/* Marco Cerrado — Clínica de Reabilitação em Araguari - MG
   Assinatura desta cidade: hero em DUAS colunas com a foto dentro de uma
   MOLDURA INCLINADA (leve rotação, estilo cartão-postal), nav TOPO
   MINIMALISTA (só logo + telefone, sem menu de âncoras), estrutura em
   TRILHA HORIZONTAL COM SCROLL (paradas em sequência, como estações de
   uma linha), fotos sempre em moldura com leve rotação alternada.
   Não repetir em nenhuma irmã da rede. */

@font-face{font-family:'Alegreya';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/alegreya-600-latin.woff2') format('woff2')}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/alegreya-700-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/ibmplexsans-400-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/ibmplexsans-600-latin.woff2') format('woff2')}

:root{
  --azul:#14367B;
  --azul-fundo:#EAEFF7;
  --ink:#1B2430;
  --ink-suave:#4E5A6B;
  --papel:#FFFFFF;
  --linha:#D6DEEC;
  --sombra:0 6px 28px rgb(20 54 123 / .14);
  --corpo:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --display:'Alegreya',Georgia,serif;
  --gut:clamp(1.25rem,4vw,2.5rem);
  --secao-y:clamp(3rem,7vw,5.5rem);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;font:400 1.05rem/1.65 var(--corpo);color:var(--ink);background:var(--papel);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--azul);text-decoration:none}
.fonte a,.legal a{text-decoration:underline}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.15;margin:0 0 .55em;color:var(--ink)}
h2{font-size:clamp(1.55rem,2.6vw,2.1rem);max-width:20em}
h3{font-size:1.2rem}
p{margin:0 0 1em}
strong,b{font-weight:700}
.limite{width:min(1180px,100% - var(--gut)*2);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.olho{font:700 .78rem/1 var(--corpo);letter-spacing:.12em;text-transform:uppercase;color:var(--azul);margin:0 0 .6em}

/* ---------- nav: top minimalista, so logo e CTA, sem menu de ancoras ---------- */
.topo{background:var(--papel);border-bottom:1px solid var(--linha)}
.topo__interno{width:min(1180px,100% - var(--gut)*2);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:68px}
.marca{display:flex;align-items:center;gap:.6rem;color:var(--ink);flex:0 0 auto}
.marca:hover{text-decoration:none}
.marca__logo{width:32px;height:32px;object-fit:contain}
.marca__texto{display:flex;flex-direction:column;line-height:1.2}
.marca__texto strong{font-family:var(--display);font-size:1.05rem}
.marca__texto em{font-style:normal;font-size:.7rem;color:var(--ink-suave)}
.botao{display:inline-flex;align-items:center;gap:.5rem;font:700 .95rem/1 var(--corpo);padding:.85rem 1.4rem;border-radius:8px;transition:background-color .2s ease,color .2s ease;cursor:pointer;border:2px solid transparent}
.botao:hover{text-decoration:none}
.botao--solido{background:var(--azul);color:#fff}
.botao--solido:hover{background:#0E2A61}
.botao--linha{background:transparent;color:#fff;border-color:#fff}
.botao--linha:hover{background:rgb(255 255 255 / .14)}
.botao--linha-tinta{background:transparent;color:var(--azul);border-color:var(--azul)}
.botao--linha-tinta:hover{background:var(--azul-fundo)}
.botao--mini{flex:0 0 auto;padding:.6rem 1.1rem;font-size:.88rem;background:var(--azul);color:#fff}
.botao--mini:hover{background:#0E2A61}

/* ---------- shape motif: molduras inclinadas (postal), alternando rotacao ---------- */
.moldura{margin:0;background:#fff;padding:.5rem .5rem .9rem;border-radius:4px;box-shadow:var(--sombra);display:inline-block}
.moldura img{border-radius:2px}
.moldura--tinta1{transform:rotate(-2.6deg)}
.moldura--tinta2{transform:rotate(2.2deg)}

/* ---------- hero: duas colunas, foto em moldura inclinada ---------- */
.hero{background:var(--azul-fundo);padding-block:clamp(2.5rem,7vw,4.5rem)}
.hero__grade{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,3.5rem);align-items:center}
.hero__h1{font-size:clamp(2rem,4.4vw,3rem);max-width:16em;color:var(--ink)}
.hero__linha{font-size:clamp(1.02rem,1.2vw,1.15rem);color:var(--ink-suave);max-width:38em}
.hero__acoes{display:flex;flex-wrap:wrap;gap:.75rem;margin:.6rem 0 1rem}
.hero__nota{font-size:.885rem;color:var(--ink-suave);margin:0;max-width:34em}
.hero__selo{display:inline-flex;align-items:center;gap:.5rem;background:rgb(20 54 123 / .1);border:1px solid rgb(20 54 123 / .28);color:var(--azul);border-radius:999px;padding:.5rem 1rem;font-size:.8rem;margin-bottom:1.2rem;font-weight:700}
.hero__moldura{display:flex;justify-content:center;padding:1rem}
.hero__moldura .moldura{max-width:min(420px,90%)}
.hero__moldura img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
@media (max-width:56rem){
  .hero__grade{grid-template-columns:1fr}
  .hero__moldura{order:-1}
}

/* ---------- secoes ---------- */
.secao{padding-block:var(--secao-y)}
.secao--tinta{background:var(--azul-fundo)}
.secao--acao{background:var(--azul);color:#fff;text-align:center;overflow:hidden}
.secao--acao h2,.secao--acao p{color:#fff;margin-inline:auto}
.secao__cabecalho{max-width:42em;margin-bottom:2.5rem}

.grade-cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.25rem}
.cartao{background:var(--papel);border:1px solid var(--linha);border-radius:4px 16px 4px 16px;padding:1.6rem;box-shadow:0 1px 0 rgb(20 54 123 / .05)}
.cartao h3{font-size:1.1rem;margin-bottom:.5rem}
.cartao p{color:var(--ink-suave);font-size:.94rem;margin:0}

/* ---------- estrutura: trilha horizontal com scroll ---------- */
.trilha{position:relative;margin:0 calc(var(--gut) * -1);padding-inline:var(--gut)}
.trilha__lista{list-style:none;margin:0;padding:1rem 0 1.4rem;display:flex;gap:2.25rem;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin}
.trilha__lista::before{content:"";position:absolute;left:var(--gut);right:var(--gut);top:calc(1rem + 100px);height:2px;background:var(--linha);z-index:0}
.trilha__parada{flex:0 0 auto;width:220px;scroll-snap-align:start;position:relative;z-index:1;text-align:center}
.trilha__parada .moldura{width:200px}
.trilha__parada .moldura img{width:100%;height:150px;object-fit:cover}
.trilha__legenda{margin-top:1rem;font-size:.92rem}
.trilha__legenda strong{display:block;font-family:var(--display);font-size:1.05rem;color:var(--ink)}
.trilha__legenda span{color:var(--ink-suave);font-size:.85rem}
.trilha__dica{font-size:.82rem;color:var(--ink-suave);margin:0 0 .5rem;font-style:italic}
.aviso-fotos{font-size:.85rem;color:var(--ink-suave);margin-top:1.1rem}
@media (min-width:64rem){ .trilha__dica{display:none} }

.lista-check{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.lista-check li{display:flex;gap:.75rem;align-items:flex-start}
.lista-check li::before{content:"";flex:0 0 auto;width:9px;height:9px;background:var(--azul);margin-top:.5rem;transform:rotate(45deg)}
.lista-check strong{color:var(--ink)}

.faq{border-top:1px solid var(--linha)}
.faq__item{border-bottom:1px solid var(--linha)}
.faq__item summary{cursor:pointer;padding:1.1rem 0;font-weight:700;display:flex;justify-content:space-between;align-items:center;list-style:none;gap:1rem}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::after{content:"+";font-size:1.3rem;color:var(--azul);transition:transform .2s ease;flex:0 0 auto}
.faq__item[open] summary::after{transform:rotate(45deg)}
.faq__item p{color:var(--ink-suave);padding-bottom:1.1rem;margin:0}

.mapa__caixa{border-radius:4px;overflow:hidden;box-shadow:var(--sombra);aspect-ratio:16/10}
.mapa__caixa iframe{width:100%;height:100%;border:0}
.mapa__legenda{font-size:.9rem;color:var(--ink-suave);margin-top:.9rem}

.zap{position:fixed;right:1rem;bottom:1rem;z-index:50;width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:#1F8A3B;color:#fff;box-shadow:0 3px 12px rgb(20 54 123 / .3)}
.zap:hover{background:#1A7632;text-decoration:none}
.zap svg{width:26px;height:26px}
@media (min-width:64rem){ .zap{right:1.5rem} }

.revela{opacity:0;transform:translateY(14px);transition:opacity .35s ease-out,transform .35s ease-out}
.revela.dentro{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.revela{opacity:1;transform:none;transition:none}}

.rodape{background:var(--azul);color:rgb(255 255 255 / .9);padding-block:2.5rem;font-size:.9rem;margin-top:2.5rem}
.rodape strong{color:#fff}
.rodape__links{display:flex;gap:1.2rem;flex-wrap:wrap;margin:.8rem 0}
.rodape__links a{color:rgb(255 255 255 / .85)}
.fonte{border-top:1px solid rgb(255 255 255 / .22);margin-top:1rem;padding-top:.8rem;font-size:.82rem;color:rgb(255 255 255 / .75)}

@media (max-width:28rem){
  .topo__interno{min-height:60px}
}