/* ============================================================
   Autolub — Estilos de páginas de serviço (template-servico.php)
   Depende de home.css (que carrega tokens, base e componentes compartilhados).
   Apenas estilos específicos de serviço — não redeclara tokens nem componentes já
   definidos em home.css (.au-card, .btn, .grid-*, .section-py, .faq-*, etc.).
   ============================================================ */

/* ============================================================
   STAGGER POR VARIÁVEL --i
   Substitui o padrão nth-child fixo usado na Home, que quebra acima do N predefinido.
   Define --i:N via style inline em cada filho iterado no PHP (style="--i:<?php echo $i; ?>").
   A classe reveal-stagger é mantida para o IntersectionObserver de reveal.js observar o container.
   ============================================================ */
.sv-stagger > * {
    transition-delay: calc(var(--i, 0) * 80ms);
}

/* ===== HERO ===== */
.sv-hero {
    background: var(--color-dark-bg);
    position: relative;
    overflow: hidden;
}

.sv-hero__atmos {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse at 70% 20%, rgba(59,130,246,0.12) 0%, transparent 60%);
}

.sv-hero__inner {
    position: relative;
    z-index: 1;
    padding-block: var(--space-4xl);
}

@media (min-width: 768px) {
    .sv-hero__inner { padding-block: 96px; }
}

/* Breadcrumb */
.sv-breadcrumb {
    margin-bottom: var(--space-xl);
}

.sv-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-xs);
    list-style: none;
}

.sv-breadcrumb__item {
    display: flex;
    align-items: center;
    font-size: var(--fs-body-sm);
    color: rgba(255,255,255,0.5);
}

.sv-breadcrumb__item + .sv-breadcrumb__item::before {
    content: '/';
    margin-right: var(--space-xs);
}

.sv-breadcrumb__item a {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
}

.sv-breadcrumb__item a:hover {
    color: var(--color-bright);
}

.sv-breadcrumb__item span {
    color: var(--color-bright);
    font-weight: var(--fw-semibold);
}

/* Hero content */
.sv-hero__h1 {
    color: var(--color-text-light);
    font-size: clamp(1.875rem, 5vw, 3rem);
    line-height: 1.15;
    margin-bottom: var(--space-xl);
    max-width: 820px;
}

.sv-hero__desc {
    color: rgba(255,255,255,0.75);
    font-size: var(--fs-body-lg);
    margin-bottom: var(--space-2xl);
    max-width: 680px;
}

.sv-hero__badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin-bottom: var(--space-2xl);
}

.sv-hero__badge {
    display: flex;
    flex-direction: column;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    min-width: 120px;
}

.sv-hero__badge strong {
    color: var(--color-text-light);
    font-family: var(--font-heading);
    font-weight: var(--fw-bold);
    font-size: var(--fs-h5);
    line-height: 1.2;
}

.sv-hero__badge span {
    color: rgba(255,255,255,0.55);
    font-size: var(--fs-body-sm);
    margin-top: 2px;
}

.sv-hero__ctas {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}

/* ===== INTRO ===== */
.sv-intro {
    max-width: 760px;
    margin-bottom: var(--space-3xl);
}

.sv-intro__title {
    margin-bottom: var(--space-lg);
}

.sv-intro__lead {
    font-size: var(--fs-body-lg);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-lg);
    font-weight: var(--fw-medium);
}

/* Highlight cards (intro) */
.sv-highlight__title {
    font-size: var(--fs-h5);
    margin-bottom: var(--space-sm);
    margin-top: var(--space-sm);
}

.sv-highlight__text {
    color: var(--color-text-secondary);
    margin: 0;
}

/* ===== TIPOS DE ÓLEO ===== */
.sv-tipos {
    display: grid;
    gap: var(--space-xl);
}

@media (min-width: 640px) {
    .sv-tipos { grid-template-columns: repeat(3, 1fr); }
}

/* Quando o bloco tem EXATAMENTE 4 cards (ex.: tipos de cambio), 2x2 fica mais
   equilibrado que 3+1. So no desktop; nao afeta paginas de 3 cards nem o mobile. */
@media (min-width: 640px) {
    .sv-tipos:has(.sv-tipo-card:nth-child(4)):not(:has(.sv-tipo-card:nth-child(5))) {
        grid-template-columns: repeat(2, 1fr);
    }
}

.sv-tipo-card {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    border-top: 4px solid var(--color-border);
    padding: var(--space-xl);
    transition: var(--transition-base);
}

.sv-tipo-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}

.sv-tipo-card--mineral  { border-top-color: var(--color-text-secondary); }
.sv-tipo-card--semi     { border-top-color: var(--color-secondary); }
.sv-tipo-card--sintetico{ border-top-color: var(--color-primary); }

.sv-tipo-card__tag {
    display: inline-block;
    font-size: var(--fs-body-sm);
    font-family: var(--font-heading);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-secondary);
    margin-bottom: var(--space-sm);
}

.sv-tipo-card--sintetico .sv-tipo-card__tag { color: var(--color-primary); }
.sv-tipo-card--semi .sv-tipo-card__tag      { color: var(--color-secondary); }

.sv-tipo-card__nome {
    font-size: var(--fs-h4);
    margin-bottom: var(--space-md);
}

.sv-tipo-card__desc {
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
    margin-bottom: var(--space-md);
}

.sv-tipo-card__intervalo {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
    margin: 0;
    padding-top: var(--space-md);
    border-top: 1px solid var(--color-border);
}

.sv-tipo-card__intervalo svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--color-secondary);
}

/* ===== SINTOMAS ===== */
.sv-sintomas {
    display: grid;
    gap: var(--space-lg);
}

@media (min-width: 640px) {
    .sv-sintomas { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .sv-sintomas { grid-template-columns: repeat(3, 1fr); }
}

.sv-sintoma {
    display: flex;
    gap: var(--space-md);
    align-items: flex-start;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    transition: var(--transition-base);
}

.sv-sintoma:hover {
    box-shadow: var(--shadow-md);
    border-color: rgba(30,58,138,0.15);
}

.sv-sintoma__icon {
    flex-shrink: 0;
    margin-top: 2px;
}

.sv-sintoma__icon svg {
    width: 22px;
    height: 22px;
    color: var(--color-secondary);
}

.sv-sintoma__titulo {
    font-size: var(--fs-h6);
    margin-bottom: var(--space-xs);
}

.sv-sintoma__texto {
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
    margin: 0;
}

/* ===== ALERTA ===== */
.sv-alert {
    display: flex;
    align-items: flex-start;
    gap: var(--space-md);
    background: rgba(30,58,138,0.05);
    border: 1px solid rgba(30,58,138,0.15);
    border-left: 4px solid var(--color-secondary);
    border-radius: var(--radius-md);
    padding: var(--space-lg);
    margin-top: var(--space-2xl);
}

.sv-alert svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    color: var(--color-secondary);
    margin-top: 2px;
}

.sv-alert p {
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
    margin: 0;
}

.sv-alert--info {
    border-left-color: var(--color-warning);
    background: rgba(245,158,11,0.05);
    border-color: rgba(245,158,11,0.2);
}

.sv-alert--info svg { color: var(--color-warning); }

/* ===== PROCESSO (STEPS) ===== */
.sv-steps {
    display: grid;
    gap: var(--space-lg);
    padding: 0;
    list-style: none;
}

@media (min-width: 768px) {
    .sv-steps { gap: var(--space-xl); }
}

.sv-step {
    display: flex;
    gap: var(--space-lg);
    align-items: flex-start;
}

.sv-step__numero {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--color-primary);
    color: #fff;
    font-family: var(--font-heading);
    font-weight: var(--fw-bold);
    font-size: var(--fs-h5);
    line-height: 1;
}

.sv-step__body {
    flex: 1;
    padding-top: var(--space-sm);
}

.sv-step__titulo {
    font-size: var(--fs-h5);
    margin-bottom: var(--space-sm);
}

.sv-step__texto {
    color: var(--color-text-secondary);
    margin: 0;
}

.sv-tempo {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    margin-top: var(--space-2xl);
    font-weight: var(--fw-semibold);
    font-family: var(--font-heading);
    color: var(--color-text-secondary);
    background: var(--color-surface-light);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    padding: var(--space-sm) var(--space-lg);
}

.sv-tempo svg {
    width: 18px;
    height: 18px;
    color: var(--color-secondary);
}

/* ===== INCLUSO ===== */
.sv-incluso {
    display: grid;
    gap: var(--space-sm);
    padding: 0;
    list-style: none;
    margin-bottom: var(--space-2xl);
}

@media (min-width: 640px) {
    .sv-incluso { grid-template-columns: repeat(2, 1fr); gap: var(--space-md); }
}

.sv-incluso__item {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-md) var(--space-lg);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-medium);
    transition: var(--transition-base);
}

.sv-incluso__item:hover {
    border-color: rgba(30,58,138,0.2);
    background: var(--color-surface-light);
}

.sv-incluso__check {
    flex-shrink: 0;
    display: flex;
}

.sv-incluso__check svg {
    width: 20px;
    height: 20px;
    color: var(--color-whatsapp-bg);
}

/* ===== MARCAS ===== */
.sv-marcas {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    padding: 0;
    list-style: none;
    margin-bottom: var(--space-xl);
}

.sv-marca-tag {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    padding: 6px var(--space-md);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-semibold);
    font-family: var(--font-heading);
    color: var(--color-text);
    transition: var(--transition-fast);
}

.sv-marca-tag:hover {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

.sv-marcas__nota {
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
    margin: 0;
}

/* ===== UNIDADES (dark) ===== */
.sv-unidades-section .section-heading__title { color: var(--color-text-light); }

.sv-unidade-card {
    background: var(--color-dark-surface);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: var(--radius-xl);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.sv-unidade-card__badge {
    display: inline-block;
    background: rgba(59,130,246,0.15);
    border: 1px solid rgba(59,130,246,0.3);
    color: var(--color-bright);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-semibold);
    font-family: var(--font-heading);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: var(--radius-full);
    align-self: flex-start;
}

.sv-unidade-card__nome {
    color: var(--color-text-light);
    font-size: var(--fs-h4);
    margin: 0;
}

.sv-unidade-card__info {
    display: flex;
    align-items: flex-start;
    gap: var(--space-sm);
    color: rgba(255,255,255,0.65);
    font-size: var(--fs-body-sm);
    margin: 0;
}

.sv-unidade-card__info svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--color-bright);
    margin-top: 2px;
}

.sv-unidade-card__servicos {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: 0;
    list-style: none;
    padding-top: var(--space-md);
    border-top: 1px solid rgba(255,255,255,0.08);
}

.sv-unidade-card__servicos li {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    color: rgba(255,255,255,0.75);
    font-size: var(--fs-body-sm);
}

.sv-unidade-card__servicos svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--color-whatsapp-bg);
}

/* ===== DEPOIMENTOS (dark) ===== */
.sv-depoimentos-section .section-heading__title { color: var(--color-text-light); }
.sv-depoimentos-section .section-heading__subtitle { color: rgba(255,255,255,0.6); }

.sv-depoimento {
    background: var(--color-dark-surface);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: var(--radius-xl);
    padding: var(--space-xl);
}

.sv-depoimento__stars {
    display: flex;
    gap: 4px;
    margin-bottom: var(--space-md);
}

.sv-depoimento__stars svg {
    width: 18px;
    height: 18px;
    color: var(--color-warning);
}

.sv-depoimento__texto {
    color: rgba(255,255,255,0.8);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-relaxed);
    margin-bottom: var(--space-md);
}

.sv-depoimento__autor {
    color: rgba(255,255,255,0.45);
    font-size: var(--fs-body-sm);
    font-weight: var(--fw-semibold);
    margin: 0;
}

/* ===== CTA ===== */
.sv-cta {
    background: var(--color-primary);
}

.sv-cta__inner {
    text-align: center;
    max-width: 680px;
    margin-inline: auto;
}

.sv-cta__titulo {
    color: var(--color-text-light);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin-bottom: var(--space-lg);
}

.sv-cta__texto {
    color: rgba(255,255,255,0.8);
    font-size: var(--fs-body-lg);
    margin-bottom: var(--space-2xl);
}

.sv-cta__botoes {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    align-items: center;
}

@media (min-width: 480px) {
    /* flex-wrap: mesmo defeito do .hero__ctas (home.css) -- ver o porque la. */
    .sv-cta__botoes { flex-direction: row; justify-content: center; flex-wrap: wrap; }
}

/* Diagramas de geometria (Alinhamento e Balanceamento): grid de 3 colunas
   que colapsa para 1 no mobile. Cores fixas do design system (light-only),
   nao usar variaveis de tema que invertam em dark. */
.diagramas-geometria{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:32px 0}
.diagrama-card{background:#F8FAFC;border:1px solid #E2E8F0;border-radius:12px;padding:24px;text-align:center;margin:0}
.diagrama-card svg{width:100%;max-width:200px;height:auto;display:block;margin:0 auto}
.diagrama-card figcaption{margin-top:12px}
.diagrama-card .diag-titulo{display:block;font-family:'Poppins',sans-serif;font-weight:600;color:#1E3A8A;font-size:16px}
.diagrama-card .diag-vista{display:block;font-family:'Inter',sans-serif;color:#475569;font-size:13px;margin-top:2px}
@media (max-width:767px){.diagramas-geometria{grid-template-columns:1fr;gap:16px}}

/* ============================================================
   P1-LEVEL - hero foto, rating, dica NeneLub, pull, preco, VS
   Evolucao do template de servico ao nivel da P1 (2026-07-01).
   Nada aqui redeclara tokens; tudo usa as variaveis do tokens.css.
   ============================================================ */

/* Hero com foto de fundo + overlay azul Autolub (~65%). Padrao de todas as paginas. */
.sv-hero--photo { background: var(--color-dark-bg); }
.sv-hero__bg { position:absolute; inset:0; z-index:0; }
.sv-hero__bg img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.sv-hero__overlay {
    position:absolute; inset:0; z-index:1;
    background:linear-gradient(100deg, rgba(30,58,138,0.92) 0%, rgba(30,58,138,0.72) 48%, rgba(15,23,42,0.55) 100%);
}
.sv-hero--photo .sv-hero__inner { z-index:2; }
.sv-hero--photo .sv-hero__h1 { text-shadow: 0 2px 14px rgba(15,23,42,0.4); }
.sv-hero--photo .sv-hero__desc { color: rgba(255,255,255,0.88); text-shadow: 0 1px 8px rgba(15,23,42,0.3); }
@media (max-width: 767px) {
    .sv-hero__overlay { background:linear-gradient(180deg, rgba(30,58,138,0.92) 0%, rgba(15,23,42,0.78) 100%); }
}

/* Badge de avaliacao no hero */
.sv-hero__rating {
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(15,23,42,0.35); border:1px solid rgba(96,165,250,0.45);
    color:#e2ecff; font-size:var(--fs-body-sm); font-weight:var(--fw-medium);
    padding:6px 14px; border-radius:var(--radius-full);
    margin-bottom:var(--space-lg); backdrop-filter:blur(2px);
}

/* Botao fantasma (CTA secundario do hero) */
.sv-hero .btn--ghost {
    display:inline-flex; align-items:center; gap:10px;
    background:transparent; border:2px solid rgba(255,255,255,0.4); color:#fff;
    font-family:var(--font-heading); font-weight:var(--fw-semibold);
    border-radius:var(--radius-md); padding:12px 28px; text-decoration:none;
    transition:var(--transition-base);
}
.sv-hero .btn--ghost:hover { background:rgba(255,255,255,0.1); }

/* ===== Dica do NeneLub (caixa creme + mascote) ===== */
.sv-dica {
    background: var(--color-accent);
    border: 2px dashed var(--color-primary);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    display: flex; gap: var(--space-xl); align-items: center;
}
.sv-dica__body { flex:1; }
.sv-dica__badge {
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--font-heading); font-weight:var(--fw-semibold);
    font-size:var(--fs-body-sm); letter-spacing:0.06em; text-transform:uppercase;
    color:var(--color-primary); margin-bottom:var(--space-md);
}
.sv-dica__w { color:var(--color-warning); font-size:18px; line-height:1; }
.sv-dica__titulo { color:var(--color-primary); font-size:var(--fs-h4); margin-bottom:var(--space-sm); }
.sv-dica__texto { color:var(--color-dark-bg); margin:0; max-width:62ch; line-height:var(--lh-loose); }
.sv-dica__texto a { color:var(--color-secondary); font-weight:var(--fw-semibold); text-decoration:underline; }
.sv-dica__mascote { width:130px; flex-shrink:0; }
.sv-dica__mascote img { width:100%; height:auto; display:block; filter:drop-shadow(0 6px 10px rgba(15,23,42,0.15)); }
@media (max-width: 639px) {
    .sv-dica { flex-direction:column-reverse; align-items:flex-start; }
    .sv-dica__mascote { width:96px; }
}

/* ===== Destaque / pull ===== */
.sv-pull { border-radius:var(--radius-xl); padding:var(--space-2xl); text-align:center; }
.sv-pull--primary { background:var(--color-primary); box-shadow:var(--shadow-lg); }
.sv-pull--primary .sv-pull__titulo { color:#fff; }
.sv-pull--primary .sv-pull__texto { color:#dbe4ff; }
.sv-pull--cream { background:var(--color-accent); border:1px solid rgba(30,58,138,0.15); }
.sv-pull--cream .sv-pull__titulo { color:var(--color-primary); }
.sv-pull--cream .sv-pull__texto { color:var(--color-dark-bg); }
.sv-pull__titulo { font-size:var(--fs-h3); margin:0 auto var(--space-md); max-width:24ch; }
.sv-pull__texto { max-width:60ch; margin:0 auto; font-size:var(--fs-body-lg); line-height:var(--lh-loose); }
.sv-pull__texto a { color:inherit; font-weight:var(--fw-semibold); text-decoration:underline; }

/* ===== Caixa de preco ===== */
.sv-preco {
    background:var(--color-surface-light); border:1px solid var(--color-border);
    border-radius:var(--radius-xl); padding:var(--space-2xl); text-align:center;
    max-width:760px; margin-inline:auto;
}
.sv-preco__eyebrow {
    font-family:var(--font-heading); font-weight:var(--fw-bold); font-size:var(--fs-body-sm);
    letter-spacing:0.08em; text-transform:uppercase; color:var(--color-secondary);
    display:block; margin-bottom:var(--space-sm);
}
.sv-preco__titulo { color:var(--color-primary); font-size:var(--fs-h3); margin-bottom:var(--space-md); }
.sv-preco__texto { color:var(--color-text-secondary); max-width:60ch; margin:0 auto var(--space-xl); line-height:var(--lh-loose); }

/* ===== Infografico comparativo VS (opcional, via bloco html-livre) ===== */
.sv-vs { background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-xl); box-shadow:var(--shadow-lg); overflow:hidden; margin-top:var(--space-2xl); }
.sv-vs__head { padding:var(--space-xl) var(--space-xl) var(--space-sm); text-align:center; }
.sv-vs__head h3 { color:var(--color-primary); font-size:var(--fs-h4); }
.sv-vs__head p { color:var(--color-text-secondary); margin-top:var(--space-sm); }
.sv-vs__grid { display:grid; grid-template-columns:1fr 56px 1fr; padding:var(--space-lg) var(--space-xl) var(--space-xl); align-items:stretch; }
.sv-vs__col { padding:var(--space-lg); border-radius:var(--radius-lg); background:var(--color-surface-light); border:1px solid var(--color-border); }
.sv-vs__col h4 { color:var(--color-primary); font-size:var(--fs-h5); margin-bottom:var(--space-md); }
.sv-vs__col ul { list-style:none; padding:0; margin:0; display:grid; gap:var(--space-sm); }
.sv-vs__col li { font-size:var(--fs-body-sm); color:var(--color-text); }
.sv-vs__mid { display:flex; align-items:center; justify-content:center; }
.sv-vs__mid span { font-family:var(--font-heading); font-weight:var(--fw-bold); font-size:var(--fs-body-sm); color:#fff; background:var(--color-secondary); width:42px; height:42px; border-radius:var(--radius-full); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-cta); }
@media (max-width: 700px) { .sv-vs__grid { grid-template-columns:1fr; gap:var(--space-md); } .sv-vs__mid { transform:rotate(90deg); } }

/* ===== Badge de unidade nao-atendida (ambar) + card atenuado ===== */
.sv-unidade-card__badge--nao {
    background: rgba(245,158,11,0.15);
    border-color: rgba(245,158,11,0.45);
    color: #FBBF24;
}
.sv-unidade-card--muted { opacity: 0.7; transition: var(--transition-base); }
.sv-unidade-card--muted:hover { opacity: 1; }

/* ===== Correcoes de layout (feedback 01/07, valem p/ todas as paginas) ===== */

/* (1) Intro em 2 colunas no desktop: preenche o vazio a direita do texto */
.sv-intro--split { max-width: none; }
@media (min-width: 900px) {
    .sv-intro--split {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--space-3xl);
        align-items: start;
    }
    .sv-intro--split .sv-intro__lead { margin-bottom: 0; }
}

/* (2) Marcas: tags e nota centralizadas para casar com o titulo centralizado */
.sv-marcas { justify-content: center; }
.sv-marcas__nota { text-align: center; }

/* (3) Cards de unidade: botao WhatsApp alinhado na base (cards de alturas diferentes) */
.sv-unidade-card > .btn { margin-top: auto; }

/* (4) Preco: reduz o respiro entre a secao anterior e a caixa de preco */
.sv-preco-section { padding-top: var(--space-xl); }

/* ===== Revisao de layout v2 (feedback 01/07) ===== */

/* Intro: titulo em largura total + texto dividido em 2 colunas */
.sv-intro--stacked { max-width: none; }
.sv-intro--stacked .sv-intro__title { max-width: none; margin-bottom: var(--space-xl); }
.sv-intro--stacked .sv-intro__lead { margin-bottom: var(--space-md); }
@media (min-width: 900px) {
    .sv-intro--stacked .sv-intro__cols { column-count: 2; column-gap: var(--space-3xl); }
    .sv-intro--stacked .sv-intro__cols > * { break-inside: avoid; }
}

/* Bloco de HTML livre centralizado (ex.: Rodizio) + respiro menor ate a proxima secao */
.sv-livre--center { text-align: center; padding-bottom: var(--space-xl); }
.sv-livre--center .sv-livre__title { color: var(--color-primary); font-size: var(--fs-h2); font-weight: var(--fw-bold); margin-bottom: var(--space-lg); }
.sv-livre--center .sv-livre__lead { color: var(--color-text-secondary); font-size: var(--fs-body-lg); max-width: 760px; margin-inline: auto; }
.sv-livre--center .sv-livre__lead + .sv-livre__lead { margin-top: var(--space-md); }
.sv-livre--center .sv-livre__lead a { color: var(--color-secondary); font-weight: var(--fw-semibold); text-decoration: underline; }

/* ===== Links de conteudo — estilo editorial discreto (v0.3.6) =====
   Substitui o azul claro chapado + negrito + sublinhado solido por:
   cor do proprio texto, sublinhado fino/afastado, que so acende em azul no hover. */
.sv-dica__texto a,
.sv-pull__texto a,
.sv-livre--center .sv-livre__lead a {
    color: inherit;
    font-weight: var(--fw-medium);
    text-decoration: underline;
    text-decoration-color: rgba(30, 58, 138, 0.30);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.22em;
    transition: color .18s ease, text-decoration-color .18s ease;
}
.sv-dica__texto a:hover,
.sv-dica__texto a:focus-visible,
.sv-pull__texto a:hover,
.sv-pull__texto a:focus-visible,
.sv-livre--center .sv-livre__lead a:hover,
.sv-livre--center .sv-livre__lead a:focus-visible {
    color: var(--color-primary);
    text-decoration-color: var(--color-primary);
}

/* ===== Alinhamento padrao + intro v3 (feedback 01/07) ===== */

/* Intro: titulo + lead centralizados (largura total); corpo em 2 colunas equilibradas (texto a esquerda) */
.sv-intro--stacked { max-width: none; text-align: center; }
.sv-intro--stacked .sv-intro__title { max-width: none; margin-bottom: var(--space-lg); }
.sv-intro--stacked .sv-intro__lead { max-width: 820px; margin: 0 auto var(--space-2xl); }
.sv-intro--stacked .sv-intro__body-cols { text-align: left; }
@media (min-width: 900px) {
    .sv-intro--stacked .sv-intro__body-cols {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--space-3xl);
        align-items: start;
    }
}


/* ===== Revisao: grade de servicos (cards com hero de cada pagina) ===== */
.sv-servicos__head{text-align:center;max-width:760px;margin:0 auto;}
.sv-servicos__title{font-family:var(--font-heading,inherit);font-weight:var(--fw-bold,700);color:var(--color-primary,#1E3A8A);margin-bottom:var(--space-sm,.75rem);}
.sv-servicos__lead{color:var(--color-text-secondary,#475569);}
.sv-serv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-lg,1.5rem);margin-top:var(--space-2xl,3rem);text-align:left;}
.sv-serv-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-border,#e5e7eb);border-radius:var(--radius-lg,16px);overflow:hidden;text-decoration:none;color:inherit;transition:transform .2s ease,box-shadow .2s ease;}
.sv-serv-card:hover,.sv-serv-card:focus-visible{transform:translateY(-4px);box-shadow:0 12px 28px rgba(15,23,42,.13);}
.sv-serv-card__img{display:block;width:100%;aspect-ratio:16/9;background-size:cover;background-position:center;background-color:var(--color-surface-light,#f1f5f9);}
.sv-serv-card__body{padding:var(--space-lg,1.5rem);display:flex;flex-direction:column;gap:var(--space-xs,.4rem);flex:1;}
.sv-serv-card__title{font-family:var(--font-heading,inherit);font-weight:var(--fw-bold,700);font-size:var(--fs-lg,1.15rem);color:var(--color-primary,#1E3A8A);}
.sv-serv-card__desc{color:var(--color-text-secondary,#475569);font-size:var(--fs-sm,.95rem);line-height:1.5;}
.sv-serv-card__more{margin-top:auto;padding-top:var(--space-sm,.75rem);color:var(--color-secondary,#2563eb);font-weight:var(--fw-medium,600);font-size:var(--fs-sm,.95rem);display:inline-flex;align-items:center;gap:.3em;}
.sv-serv-card__more::after{content:'\2192';transition:transform .2s ease;}
.sv-serv-card:hover .sv-serv-card__more::after{transform:translateX(3px);}


/* ============ Unidade (paginas de loja) ============ */
.un-nap__title{font-family:var(--font-head,'Poppins',sans-serif);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;color:var(--color-primary,#1E3A8A);margin:0 0 1.2rem;}
.un-nap__grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:stretch;}
.un-nap__info{display:flex;flex-direction:column;}
.un-nap__list{list-style:none;margin:0 0 1.6rem;padding:0;display:flex;flex-direction:column;gap:1rem;}
.un-nap__list li{display:flex;gap:.7rem;align-items:flex-start;font-size:1.05rem;line-height:1.5;color:var(--color-text,#1f2937);}
.un-nap__list li svg{width:24px;height:24px;flex:0 0 24px;color:var(--color-primary,#1E3A8A);margin-top:2px;}
.un-nap__list a{color:inherit;text-decoration:none;}
.un-nap__list a:hover{text-decoration:underline;}
.un-nap__btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:auto;}
.un-nap__map{min-height:360px;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(15,23,42,.12);background:#eef2f7;}
.un-nap__map iframe{display:block;width:100%;height:100%;min-height:360px;}
.un-galeria__title{text-align:center;font-family:var(--font-head,'Poppins',sans-serif);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;color:var(--color-primary,#1E3A8A);margin:0 0 2rem;}
.un-galeria__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.un-galeria__item{margin:0;border-radius:14px;overflow:hidden;aspect-ratio:3/2;box-shadow:0 8px 22px rgba(15,23,42,.10);}
.un-galeria__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.un-galeria__item:hover img{transform:scale(1.05);}
@media(max-width:900px){.un-nap__grid{grid-template-columns:1fr;}.un-nap__map{min-height:300px;}.un-galeria__grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.un-galeria__grid{grid-template-columns:1fr;}}
