/* ============================================================
   ALIVITA v2 — "Duas casas, uma luz"
   Fotografia como matéria-prima. Duotone por unidade.
   ============================================================ */

@property --split { syntax:"<percentage>"; inherits:true; initial-value:50%; }

:root{
  --ts:1;

  --nevoa:#F2F4F0;
  --papel:#FBFCFA;
  --tinta:#141A17;
  --tinta-70:rgba(20,26,23,.72);
  --tinta-50:rgba(20,26,23,.52);
  --fio:rgba(20,26,23,.14);
  --fio-forte:rgba(20,26,23,.28);

  --display:"Instrument Serif", Georgia, serif;
  --corpo:"Schibsted Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --dados:"DM Mono", ui-monospace, Menlo, monospace;

  --marg:clamp(1.15rem,4vw,4rem);
  --secao:clamp(4.5rem,9vw,8.5rem);
  --ease:cubic-bezier(.22,.72,.28,1);
  --lento:cubic-bezier(.16,.84,.24,1);
}

[data-unit="clinica"]{
  --base:#0F2A24;
  --base-2:#17392F;
  --acento:#D8A13F;
  --claro:#5C9C85;
  --duo-sombra:#0E2A23;
  --duo-luz:#F4EDDD;
  --tinte:rgba(46,107,87,.10);
}
[data-unit="homecare"]{
  --base:#10303C;
  --base-2:#164252;
  --acento:#E4674B;
  --claro:#5FA8B6;
  --duo-sombra:#0C2A34;
  --duo-luz:#EFEFE6;
  --tinte:rgba(30,122,140,.10);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ font-size:calc(16px * var(--ts)); -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--nevoa); color:var(--tinta);
  font-family:var(--corpo); font-size:1.125rem; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
p{ margin:0 0 1rem; text-wrap:pretty; }

h1,h2,h3{ font-family:var(--display); font-weight:400; line-height:1.02; letter-spacing:-.015em; margin:0; text-wrap:balance; }
h1{ font-size:clamp(2.9rem,7vw,6.2rem); }
h2{ font-size:clamp(2.2rem,4.8vw,3.9rem); }
h3{ font-size:1.6rem; line-height:1.12; }
em.it{ font-style:italic; }

.dado{ font-family:var(--dados); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; }
.rot{ font-family:var(--dados); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--tinta-50); }

:focus-visible{ outline:3px solid var(--acento); outline-offset:3px; }
.pular{ position:absolute; left:1rem; top:-4rem; z-index:200; background:var(--tinta); color:#fff; padding:.7rem 1.1rem; transition:top .2s; }
.pular:focus{ top:1rem; }

.env{ width:min(78rem, 100% - var(--marg)*2); margin-inline:auto; }
.larga{ width:min(94rem, 100% - var(--marg)*2); margin-inline:auto; }

/* ---------- duotone ---------- */
.foto{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--duo-sombra);
  clip-path:inset(0 0 100% 0);
}
.foto.dentro{ clip-path:inset(0 0 0 0); transition:clip-path 1.05s var(--lento); }
.foto img{
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(1) contrast(1.06) brightness(1.02);
  mix-blend-mode:screen;
  transform:scale(1.07); transition:transform 1.4s var(--lento);
}
.foto.dentro img{ transform:scale(1); }
.foto::after{
  content:""; position:absolute; inset:0; z-index:2;
  background:var(--duo-luz); mix-blend-mode:multiply; pointer-events:none;
}
.foto--suave::after{ opacity:.82; }
.credito{
  position:absolute; right:.6rem; bottom:.5rem; z-index:3;
  font-family:var(--dados); font-size:.58rem; letter-spacing:.08em;
  color:rgba(255,255,255,.55); text-decoration:none;
}
.credito:hover{ color:#fff; }

/* ============================================================
   PORTAL — duas fotografias e uma costura
   ============================================================ */
.portal{
  --split:50%;
  position:fixed; inset:0; z-index:90; overflow:hidden; background:#0B1512;
  transition:--split .95s var(--lento), opacity .55s ease;
  touch-action:none;
}
.portal[hidden]{ display:none; }
.portal.arrastando{ transition:none; }
.portal.saindo{ opacity:0; pointer-events:none; }

.lado{
  position:absolute; inset:0; border:0; padding:0; cursor:pointer;
  display:flex; flex-direction:column; justify-content:flex-end;
  color:#fff; text-align:left; font:inherit;
}
.lado--a{ clip-path:inset(0 calc(100% - var(--split)) 0 0); --duo-sombra:#0E2A23; --duo-luz:#F0E4CB; }
.lado--b{ clip-path:inset(0 0 0 var(--split)); --duo-sombra:#0C2A34; --duo-luz:#E9E7DA; }
.lado .fundo{ position:absolute; inset:0; clip-path:none; }
.lado .fundo img{ animation:assenta 1.6s var(--lento) both; }
@keyframes assenta{ from{ transform:scale(1.12) } to{ transform:scale(1) } }
.lado .veu{ position:absolute; inset:0; z-index:3; background:linear-gradient(transparent 38%, rgba(6,14,12,.72)); }

.lado__txt{ position:relative; z-index:4; padding:clamp(1.5rem,4vw,4rem); padding-bottom:clamp(5.5rem,9vw,7rem); max-width:min(26rem,27vw); }
.lado--b .lado__txt{ margin-left:auto; text-align:right; }
.lado__num{ font-family:var(--dados); font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.7); display:block; margin-bottom:.9rem; }
.lado__nome{ font-family:var(--display); font-size:clamp(2.6rem,5.6vw,4.6rem); line-height:.98; margin:0 0 .7rem; }
.lado__diz{ color:rgba(255,255,255,.85); font-size:1.02rem; margin:0 0 1.5rem; }
.lado__cta{
  display:inline-flex; align-items:center; gap:.7rem; padding:.9rem 1.5rem; min-height:3.25rem;
  border:1px solid rgba(255,255,255,.5); color:#fff; text-decoration:none; font-weight:600; font-size:1rem;
  transition:background .3s, color .3s, border-color .3s;
}
.lado:hover .lado__cta{ background:#fff; color:#10231D; border-color:#fff; }
.lado__cta svg{ transition:transform .3s var(--ease); }
.lado:hover .lado__cta svg{ transform:translateX(5px); }
.lado__end{ font-family:var(--dados); font-size:.68rem; color:rgba(255,255,255,.6); margin-top:1.4rem; line-height:1.7; }

.costura{ position:absolute; top:0; bottom:0; left:var(--split); width:2px; margin-left:-1px; z-index:8;
  background:linear-gradient(transparent, rgba(255,255,255,.6) 16%, rgba(255,255,255,.6) 84%, transparent); cursor:ew-resize; touch-action:none; }
.punho{ position:absolute; top:50%; left:50%; translate:-50% -50%; width:3.5rem; height:3.5rem; border-radius:50%;
  background:#fff; color:#141A17; border:0; padding:0; cursor:grab; display:grid; place-items:center;
  box-shadow:0 12px 34px -10px rgba(0,0,0,.7); transition:transform .3s var(--ease); }
.punho:hover{ transform:translate(-50%,-50%) scale(1.08); }
.portal.arrastando .punho{ cursor:grabbing; transform:translate(-50%,-50%) scale(.94); }
.punho .g{ display:flex; gap:3px; }
.punho .g i{ width:2px; height:14px; background:currentColor; opacity:.5; display:block; }
.dica{ position:absolute; top:calc(50% + 2.7rem); left:50%; translate:-50% 0; white-space:nowrap; pointer-events:none;
  font-family:var(--dados); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.75);
  animation:respira 3.6s ease-in-out infinite; }
@keyframes respira{ 0%,100%{opacity:.4} 50%{opacity:.95} }

.selo{ position:absolute; top:clamp(1.25rem,3vw,2.5rem); left:50%; translate:-50% 0; z-index:9; text-align:center; pointer-events:none; }
.selo .n{ font-family:var(--display); font-size:1.8rem; letter-spacing:.3em; color:#fff; text-indent:.3em; }
.selo .s{ display:block; font-family:var(--dados); font-size:.58rem; letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.62); margin-top:.4rem; }
.rodape-portal{ position:absolute; left:0; right:0; bottom:0; z-index:9; display:flex; justify-content:center; gap:.4rem 1.75rem; flex-wrap:wrap;
  padding:1rem var(--marg) calc(1rem + env(safe-area-inset-bottom));
  font-family:var(--dados); font-size:.66rem; letter-spacing:.1em; color:rgba(255,255,255,.66);
  background:linear-gradient(transparent, rgba(4,10,9,.8)); pointer-events:none; }
.rodape-portal a{ pointer-events:auto; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.4); }

.lado__txt > *, .selo, .rodape-portal{ animation:sobe .9s var(--lento) both; }
.selo{ animation-delay:.1s }
.lado--a .lado__txt > *:nth-child(1){ animation-delay:.5s } .lado--a .lado__txt > *:nth-child(2){ animation-delay:.56s }
.lado--a .lado__txt > *:nth-child(3){ animation-delay:.62s } .lado--a .lado__txt > *:nth-child(4){ animation-delay:.68s }
.lado--a .lado__txt > *:nth-child(5){ animation-delay:.74s }
.lado--b .lado__txt > *:nth-child(1){ animation-delay:.58s } .lado--b .lado__txt > *:nth-child(2){ animation-delay:.64s }
.lado--b .lado__txt > *:nth-child(3){ animation-delay:.70s } .lado--b .lado__txt > *:nth-child(4){ animation-delay:.76s }
.lado--b .lado__txt > *:nth-child(5){ animation-delay:.82s }
.rodape-portal{ animation-delay:.95s }
@keyframes sobe{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }

@media (max-width:880px){
  .lado--a{ clip-path:inset(0 0 calc(100% - var(--split)) 0); justify-content:flex-start; padding-top:5rem; }
  .lado--b{ clip-path:inset(var(--split) 0 0 0); }
  .lado__txt{ max-width:none; padding-bottom:clamp(4rem,12vw,5rem); }
  .lado--a .lado__txt{ padding-top:clamp(4.5rem,15vw,6rem); padding-bottom:1.25rem; }
  .lado--b .lado__txt{ margin-left:0; text-align:left; }
  .lado__end{ display:none; }
  .costura{ top:var(--split); left:0; right:0; bottom:auto; width:auto; height:2px; margin:-1px 0 0; cursor:ns-resize;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.6) 16%, rgba(255,255,255,.6) 84%, transparent); }
  .punho .g{ flex-direction:column; } .punho .g i{ width:14px; height:2px; }
  .dica{ top:auto; bottom:calc(50% + 2.7rem); }
}

/* ============================================================
   ESTRUTURA COMUM DOS SITES
   ============================================================ */
.site{ display:none; }
.site.ativa{ display:block; }

.barra{ background:var(--base); color:#fff; font-family:var(--dados); font-size:.7rem; letter-spacing:.06em; }
.barra .env{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:2.6rem; flex-wrap:wrap; }
.barra .pt{ width:.45rem; height:.45rem; background:var(--acento); display:inline-block; margin-right:.5rem; }
.barra .aq{ color:rgba(255,255,255,.72); }
.barra .ac{ display:flex; gap:1.25rem; align-items:center; }
.barra a, .barra button{ color:#fff; background:none; border:0; cursor:pointer; text-decoration:none; font:inherit; padding:.3rem 0; border-bottom:1px solid rgba(255,255,255,.35); }
.barra a:hover, .barra button:hover{ color:var(--acento); border-color:var(--acento); }
@media (max-width:660px){ .barra .lg{ display:none } }

.topo{ position:sticky; top:0; z-index:60; background:var(--papel); border-bottom:1px solid var(--fio); }
.topo .env{ display:flex; align-items:center; gap:1.5rem; min-height:4.5rem; }
.marca{ display:flex; align-items:baseline; gap:.6rem; text-decoration:none; margin-right:auto; }
.marca .n{ font-family:var(--display); font-size:1.5rem; letter-spacing:.16em; text-indent:.16em; }
.marca .u{ font-family:var(--dados); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--base); border-left:1px solid var(--fio-forte); padding-left:.6rem; }
.nav{ display:flex; gap:1.75rem; align-items:center; }
.nav a{ text-decoration:none; font-size:.97rem; font-weight:500; color:var(--tinta-70); padding:.35rem 0; position:relative; }
.nav a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--base); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.nav a:hover, .nav a.atual{ color:var(--tinta); }
.nav a:hover::after, .nav a.atual::after{ transform:scaleX(1); }
.ferramentas{ display:flex; align-items:center; gap:.7rem; }
.tsz{ border:1px solid var(--fio-forte); background:none; padding:.5rem .75rem; min-height:2.8rem; cursor:pointer; display:flex; align-items:baseline; gap:.1rem; font-family:var(--display); line-height:1; }
.tsz:hover{ border-color:var(--base); background:var(--tinte); }
.tsz .a1{ font-size:.8rem } .tsz .a2{ font-size:1rem } .tsz .a3{ font-size:1.2rem }
.burg{ display:none; width:2.8rem; height:2.8rem; border:1px solid var(--fio-forte); background:none; cursor:pointer; padding:0; place-items:center; gap:4px; }
.burg i{ display:block; width:18px; height:1.5px; background:var(--tinta); transition:transform .3s var(--ease), opacity .2s; }
.burg[aria-expanded="true"] i:nth-child(1){ transform:translateY(5.5px) rotate(45deg) }
.burg[aria-expanded="true"] i:nth-child(2){ opacity:0 }
.burg[aria-expanded="true"] i:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg) }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.55rem; background:var(--base); color:#fff;
  border:1px solid transparent; padding:.9rem 1.5rem; min-height:3.15rem; font-weight:600; font-size:1rem; text-decoration:none; cursor:pointer;
  transition:background .25s, color .25s, border-color .25s; }
.btn:hover{ background:var(--base-2); }
.btn--ac{ background:var(--acento); color:#22160A; }
.btn--ac:hover{ background:#fff; color:var(--base); }
.btn--va{ background:transparent; color:currentColor; border-color:currentColor; }
.btn--va:hover{ background:currentColor; color:var(--base); }
.btn svg{ transition:transform .25s var(--ease) }
.btn:hover svg{ transform:translateX(4px) }
.topo .btn{ padding:.7rem 1.15rem; min-height:2.8rem; font-size:.93rem; }

@media (max-width:1060px){
  .nav{ position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:var(--papel);
    border-bottom:1px solid var(--fio); padding:.25rem var(--marg) 1.25rem; display:none; }
  .nav.aberto{ display:flex }
  .nav a{ padding:.95rem 0; border-bottom:1px solid var(--fio); font-size:1.05rem }
  .burg{ display:grid }
  .topo .btn--wpp{ display:none }
}

/* revelação de texto (discreta) */
.sub{ opacity:0; transform:translateY(12px); }
.sub.dentro{ opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease); }
.sub.d1{ transition-delay:.09s } .sub.d2{ transition-delay:.18s } .sub.d3{ transition-delay:.27s }

/* rodapé */
.rodape{ background:var(--base); color:rgba(255,255,255,.74); padding:clamp(3.5rem,7vw,5.5rem) 0 2rem; }
.rodape__g{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(2rem,5vw,4rem); padding-bottom:2.75rem; border-bottom:1px solid rgba(255,255,255,.16); }
@media (max-width:820px){ .rodape__g{ grid-template-columns:1fr } }
.rodape .marca .n{ color:#fff } .rodape .marca .u{ color:var(--acento); border-color:rgba(255,255,255,.24) }
.rodape p{ margin-top:1.1rem; max-width:36ch; font-size:1rem }
.rodape h4{ font-family:var(--dados); font-size:.68rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:#fff; margin:0 0 1.1rem }
.rodape ul{ list-style:none; margin:0; padding:0; display:grid; gap:.75rem; font-size:.98rem }
.rodape a{ text-decoration:none } .rodape a:hover{ color:var(--acento) }
.rodape__b{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-top:1.75rem;
  font-family:var(--dados); font-size:.66rem; letter-spacing:.08em; color:rgba(255,255,255,.5) }

.flut{ position:fixed; right:1.1rem; bottom:calc(1.1rem + env(safe-area-inset-bottom)); z-index:70;
  display:flex; align-items:center; gap:.65rem; background:#25D366; color:#0A2E17; font-weight:700; font-size:.96rem;
  padding:.85rem 1.3rem; text-decoration:none; box-shadow:0 16px 36px -14px rgba(0,0,0,.55);
  transition:transform .25s var(--ease); }
.flut:hover{ transform:scale(1.03) }
.flut svg{ width:1.35rem; height:1.35rem }
@media (max-width:520px){ .flut span{ display:none } .flut{ padding:1rem } }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .sub{ opacity:1; transform:none }
  .foto{ clip-path:none }
  .foto img{ transform:none }
}

/* ============================================================
   INTERNAS v4 — clean, moderno, áreas separadas por fundo
   Dois sites independentes. Troca de ambiente só pelo início.
   ============================================================ */
:root{
  --r:18px; --r-sm:12px; --r-xs:8px;
  --sombra-1:0 1px 2px rgba(16,32,26,.04), 0 8px 24px -16px rgba(16,32,26,.24);
  --sombra-2:0 2px 6px rgba(16,32,26,.06), 0 26px 50px -24px rgba(16,32,26,.34);
}

/* imagens internas em cor natural (o duotone fica só no portal) */
.site .foto img{ filter:none; mix-blend-mode:normal; }
.site .foto::after{ display:none; }
.site .foto{ background:var(--nevoa); border-radius:var(--r); }

/* ---------- cabeçalho ---------- */
.cab{ position:sticky; top:0; z-index:60; background:#fff; border-bottom:1px solid transparent; transition:box-shadow .3s, border-color .3s; }
.cab.rolou{ box-shadow:0 1px 20px -6px rgba(16,32,26,.18); border-color:var(--fio); }
.cab__c{ display:flex; align-items:center; gap:1.5rem; min-height:4.75rem; }
.logo{ display:flex; align-items:baseline; gap:.6rem; text-decoration:none; margin-right:auto; }
.logo .n{ font-family:var(--display); font-size:1.55rem; letter-spacing:.15em; text-indent:.15em; }
.logo .u{ font-family:var(--dados); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--base); background:var(--tinte); padding:.3rem .55rem; border-radius:100px; }
.menu{ display:flex; gap:1.85rem; align-items:center; }
.menu a{ text-decoration:none; font-size:.97rem; font-weight:500; color:var(--tinta-70); position:relative; padding:.3rem 0; transition:color .25s; }
.menu a::after{ content:""; position:absolute; left:0; right:0; bottom:-.15rem; height:2px; border-radius:2px; background:var(--acento); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.menu a:hover{ color:var(--tinta); } .menu a:hover::after, .menu a.aqui::after{ transform:scaleX(1); }
.menu a.aqui{ color:var(--tinta); }
.acoes{ display:flex; align-items:center; gap:.6rem; }
.cab .logo{ margin-right:0; padding-right:1.1rem; border-right:1px solid var(--fio); }
.logo__img{ height:2.3rem; width:auto; display:block; }
.rodape .logo{ background:#fff; border-radius:var(--r-sm); padding:.6rem .85rem; display:inline-flex; align-items:center; gap:.6rem; }
.rodape .logo .u{ color:var(--base); background:var(--tinte); }
.social{ display:flex; gap:.6rem; margin-top:1.5rem; }
.social a{ width:2.6rem; height:2.6rem; border-radius:50%; border:1px solid rgba(255,255,255,.26); display:grid; place-items:center;
  color:#fff; transition:background .25s, border-color .25s, color .25s, transform .25s var(--ease); }
.social a:hover{ background:var(--acento); border-color:var(--acento); color:#1E1405; transform:translateY(-2px); }
.social svg{ width:1.1rem; height:1.1rem; }
.mapa{ margin-top:2rem; border-radius:var(--r); overflow:hidden; box-shadow:var(--sombra-2); background:#fff; }
.mapa iframe{ width:100%; height:clamp(18rem,42vw,26rem); border:0; display:block; }
.mapa__pe{ padding:.85rem 1.1rem; font-family:var(--dados); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-50); }
.selo .placa-logo{ display:block; }
.selo .placa-logo img{
  height:clamp(3rem, 6.5vw, 4.6rem); width:auto; display:block; margin-inline:auto;
  /* deixa a logo em branco sólido sobre a fotografia, qualquer que seja a cor original */
  filter:brightness(0) invert(1) drop-shadow(0 3px 16px rgba(0,0,0,.55));
}
.selo .s{ margin-top:.7rem; }
.inicio{ display:inline-flex; align-items:center; gap:.55rem; margin-right:auto; text-decoration:none;
  font-family:var(--dados); font-size:.7rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:var(--base); background:var(--tinte); border:1.5px solid var(--base); border-radius:100px;
  padding:.6rem 1.05rem; min-height:2.7rem; white-space:nowrap;
  transition:background .25s, color .25s, transform .25s var(--ease), box-shadow .25s var(--ease); }
.inicio svg{ transition:transform .25s var(--ease); }
.inicio:hover{ background:var(--base); color:#fff; transform:translateX(-3px); box-shadow:0 12px 22px -12px rgba(16,32,26,.65); }
.inicio:hover svg{ transform:translateX(-4px); }
.inicio .curto{ display:none; }
@media (max-width:780px){ .inicio .longo{ display:none } .inicio .curto{ display:inline } .inicio{ padding:.6rem .85rem } }
@media (max-width:400px){ .cab .logo{ padding-right:.7rem } .inicio span{ display:none } .inicio{ padding:.6rem .7rem } }
.tsz{ border:1px solid var(--fio-forte); background:none; border-radius:100px; padding:.5rem .8rem; min-height:2.7rem; cursor:pointer;
  display:inline-flex; align-items:baseline; gap:.1rem; font-family:var(--display); line-height:1; transition:border-color .25s, background .25s; }
.tsz:hover{ border-color:var(--base); background:var(--tinte); }
.tsz .a1{ font-size:.78rem } .tsz .a2{ font-size:.96rem } .tsz .a3{ font-size:1.15rem }
.hamb{ display:none; width:2.7rem; height:2.7rem; border:1px solid var(--fio-forte); border-radius:100px; background:none; cursor:pointer; padding:0; place-items:center; gap:4px }
.hamb i{ display:block; width:16px; height:1.5px; background:var(--tinta); border-radius:2px; transition:transform .3s var(--ease), opacity .2s }
.hamb[aria-expanded="true"] i:nth-child(1){ transform:translateY(5.5px) rotate(45deg) }
.hamb[aria-expanded="true"] i:nth-child(2){ opacity:0 }
.hamb[aria-expanded="true"] i:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg) }
@media (max-width:1080px){
  .menu{ position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:#fff;
    padding:.25rem var(--marg) 1.25rem; box-shadow:var(--sombra-1); display:none }
  .menu.aberto{ display:flex }
  .menu a{ padding:.95rem 0; border-bottom:1px solid var(--fio); font-size:1.05rem }
  .menu a::after{ display:none }
  .hamb{ display:grid }
  .cab .btn-topo{ display:none }
}

/* ---------- botões ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.55rem; border:1.5px solid transparent; border-radius:100px;
  padding:.9rem 1.6rem; min-height:3.15rem; font-weight:600; font-size:1rem; text-decoration:none; cursor:pointer;
  background:var(--base); color:#fff; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s, border-color .25s; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 14px 26px -14px rgba(16,32,26,.5) }
.btn:active{ transform:translateY(0) }
.btn--ac{ background:var(--acento); color:#1E1405 }
.btn--ac:hover{ background:#fff; color:var(--base) }
.btn--linha{ background:transparent; color:currentColor; border-color:currentColor }
.btn--linha:hover{ background:currentColor; color:var(--base) }
.btn--claro{ background:#fff; color:var(--base) }
.btn svg{ transition:transform .25s var(--ease) } .btn:hover svg{ transform:translateX(4px) }
.cab .btn{ padding:.7rem 1.25rem; min-height:2.7rem; font-size:.93rem }

/* ---------- áreas com fundo definido ---------- */
.sec{ padding:clamp(4.5rem,9vw,7.5rem) 0; position:relative; }
.sec--branco{ background:#fff }
.sec--nevoa{ background:var(--nevoa) }
.sec--tinte{ background:var(--tinte) }
.sec--escuro{ background:var(--base); color:#fff }
.sec--escuro h2, .sec--escuro h3{ color:#fff }
.sec--escuro .cabecalho p{ color:rgba(255,255,255,.78) }
.sec--curva{ border-radius:var(--r) var(--r) 0 0; margin-top:-1px }

.cabecalho{ max-width:48rem; margin-bottom:clamp(2.25rem,5vw,3.5rem) }
.cabecalho.centro{ margin-inline:auto; text-align:center }
.etiqueta{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--dados); font-size:.66rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--base); background:var(--tinte); padding:.45rem .9rem; border-radius:100px; margin-bottom:1.25rem }
.sec--escuro .etiqueta, .sec--imagem .etiqueta{ color:var(--acento); background:rgba(255,255,255,.1) }
.cabecalho h2{ font-size:clamp(2.1rem,4.4vw,3.5rem); margin-bottom:1rem }
.cabecalho p{ color:var(--tinta-70); font-size:1.15rem; margin:0; max-width:46ch }
.cabecalho.centro p{ margin-inline:auto }

/* ---------- herói clínica ---------- */
.heroi{ background:var(--base); color:#fff; padding:clamp(3rem,6vw,5rem) 0 clamp(4rem,8vw,6.5rem); position:relative; overflow:hidden }
.heroi::before{ content:""; position:absolute; width:38rem; height:38rem; border-radius:50%; right:-12rem; top:-14rem;
  background:radial-gradient(circle, rgba(255,255,255,.07), transparent 65%) }
.heroi__g{ display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(2rem,5vw,4rem); align-items:center; position:relative }
.heroi h1{ color:#fff; font-size:clamp(2.7rem,5.6vw,4.6rem); margin-bottom:1.4rem }
.heroi h1 em{ font-style:italic; color:var(--acento) }
.heroi__lead{ color:rgba(255,255,255,.84); font-size:1.2rem; max-width:40ch }
.heroi__b{ display:flex; gap:.75rem; flex-wrap:wrap; margin-top:2rem }
.heroi__foto{ position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:4/3.4; box-shadow:var(--sombra-2) }
.heroi__foto .foto{ position:absolute; inset:0; border-radius:var(--r) }
.selo-flut{ position:absolute; left:-1.25rem; bottom:1.75rem; z-index:6; background:#fff; color:var(--tinta);
  border-radius:var(--r-sm); padding:1rem 1.25rem; box-shadow:var(--sombra-2); display:grid; gap:.35rem; min-width:13rem }
.selo-flut .chip{ display:flex; align-items:center; gap:.5rem; font-weight:700; font-size:.95rem }
.farol{ width:.55rem; height:.55rem; border-radius:50%; background:#2FA36B; flex:none; box-shadow:0 0 0 0 rgba(47,163,107,.55); animation:pulsa 2.6s infinite }
.chip[data-e="fechado"] .farol{ background:#D98324; animation:none }
@keyframes pulsa{ 70%{ box-shadow:0 0 0 .55rem rgba(47,163,107,0) } 100%{ box-shadow:0 0 0 0 rgba(47,163,107,0) } }
.selo-flut small{ font-family:var(--dados); font-size:.68rem; color:var(--tinta-50); line-height:1.5 }
@media (max-width:940px){
  .heroi__g{ grid-template-columns:1fr }
  .heroi__foto{ aspect-ratio:16/11 }
  .selo-flut{ left:1rem; bottom:1rem; min-width:0 }
}

/* barra de pontos */
.pontos-barra{ background:#fff; border-radius:var(--r); box-shadow:var(--sombra-1); padding:1.5rem clamp(1.25rem,3vw,2.5rem);
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-top:-3.25rem; position:relative; z-index:5 }
.pontos-barra div{ display:grid; gap:.25rem }
.pontos-barra b{ font-family:var(--display); font-size:2rem; line-height:1; color:var(--base) }
.pontos-barra span{ font-size:.94rem; color:var(--tinta-70) }
@media (max-width:820px){ .pontos-barra{ grid-template-columns:1fr 1fr; margin-top:-2rem } }
@media (max-width:480px){ .pontos-barra{ grid-template-columns:1fr } }

/* ---------- cartões com imagem ---------- */
.grade{ display:grid; gap:1.5rem }
.grade--3{ grid-template-columns:repeat(auto-fit,minmax(18rem,1fr)) }
.grade--2{ grid-template-columns:repeat(auto-fit,minmax(22rem,1fr)) }
.cartao{ background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:var(--sombra-1);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease); display:flex; flex-direction:column }
.cartao:hover{ transform:translateY(-6px); box-shadow:var(--sombra-2) }
.cartao__f{ aspect-ratio:16/10; overflow:hidden; position:relative }
.cartao__f .foto{ position:absolute; inset:0; border-radius:0 }
.cartao__f img{ transition:transform .8s var(--lento) }
.cartao:hover .cartao__f img{ transform:scale(1.06) }
.cartao__c{ padding:1.6rem 1.6rem 1.85rem; display:flex; flex-direction:column; flex:1 }
.cartao h3{ font-size:1.5rem; margin-bottom:.6rem }
.cartao p{ color:var(--tinta-70); font-size:1rem; margin:0 0 1.1rem }
.cartao .marca-l{ margin-top:auto; font-family:var(--dados); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--base); display:inline-flex; align-items:center; gap:.45rem }
.cartao .marca-l::before{ content:""; width:1.5rem; height:2px; background:var(--acento); border-radius:2px; transition:width .35s var(--ease) }
.cartao:hover .marca-l::before{ width:2.5rem }

/* lista de pontos coloridos */
.pontos{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); gap:.9rem 2rem }
.pontos li{ display:grid; grid-template-columns:1.4rem 1fr; gap:.75rem; align-items:baseline; padding:.7rem 0; border-bottom:1px solid var(--fio) }
.sec--escuro .pontos li{ border-color:rgba(255,255,255,.16) }
.pontos li::before{ content:""; width:.55rem; height:.55rem; border-radius:50%; background:var(--acento); transform:translateY(.15rem) }
.pontos b{ display:block; font-weight:600 }
.pontos span{ color:var(--tinta-70); font-size:.98rem }
.sec--escuro .pontos span{ color:rgba(255,255,255,.72) }

/* etapas */
.etapas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:1.5rem; counter-reset:e }
.etapa{ background:#fff; border-radius:var(--r); padding:1.75rem; position:relative; box-shadow:var(--sombra-1) }
.sec--escuro .etapa{ background:rgba(255,255,255,.06); box-shadow:none; border:1px solid rgba(255,255,255,.14) }
.etapa::before{ counter-increment:e; content:counter(e,decimal-leading-zero); font-family:var(--display); font-size:2.4rem;
  color:var(--acento); display:block; line-height:1; margin-bottom:.9rem }
.etapa h3{ font-size:1.3rem; margin-bottom:.5rem }
.etapa p{ margin:0; color:var(--tinta-70); font-size:1rem }
.sec--escuro .etapa p{ color:rgba(255,255,255,.76) }

/* faixa com imagem de fundo */
.sec--imagem{ color:#fff; overflow:hidden }
.sec--imagem .fundo{ position:absolute; inset:0; z-index:0 }
.sec--imagem .fundo img{ width:100%; height:100%; object-fit:cover }
.sec--imagem .veu2{ position:absolute; inset:0; z-index:1; background:linear-gradient(100deg, var(--base) 6%, rgba(15,42,36,.82) 45%, rgba(15,42,36,.45)) }
.sec--imagem .env, .sec--imagem .larga{ position:relative; z-index:2 }
.sec--imagem h2{ color:#fff }
.sec--imagem p{ color:rgba(255,255,255,.85) }

/* faq */
.faq{ max-width:52rem; display:grid; gap:.75rem }
.faq details{ background:#fff; border-radius:var(--r-sm); box-shadow:var(--sombra-1); overflow:hidden; transition:box-shadow .3s }
.faq details[open]{ box-shadow:var(--sombra-2) }
.faq summary{ list-style:none; cursor:pointer; padding:1.25rem 3.25rem 1.25rem 1.5rem; position:relative; font-weight:600; font-size:1.1rem }
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{ content:""; position:absolute; right:1.5rem; top:calc(50% - .35rem); width:.7rem; height:.7rem;
  border-right:2px solid var(--base); border-bottom:2px solid var(--base); transform:rotate(45deg); transition:transform .3s var(--ease) }
.faq details[open] summary::after{ transform:rotate(-135deg) }
.faq .resp{ padding:0 1.5rem 1.4rem; color:var(--tinta-70) }
.faq .resp p{ margin:0 }

/* contato */
.contato{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,4vw,3.5rem); align-items:start }
@media (max-width:900px){ .contato{ grid-template-columns:1fr } }
.canais{ list-style:none; margin:1.75rem 0 0; padding:0; display:grid; gap:1rem }
.canais li{ background:#fff; border-radius:var(--r-sm); padding:1rem 1.25rem; box-shadow:var(--sombra-1); display:grid; gap:.15rem }
.canais .rot{ font-family:var(--dados); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--tinta-50) }
.canais a{ text-decoration:none; font-weight:600 } .canais a:hover{ color:var(--base) }
.form{ background:#fff; border-radius:var(--r); padding:clamp(1.5rem,3vw,2.5rem); box-shadow:var(--sombra-1) }
.linha2{ display:grid; grid-template-columns:1fr 1fr; gap:0 1.25rem }
@media (max-width:600px){ .linha2{ grid-template-columns:1fr } }
.campo{ margin-bottom:1.1rem }
.campo label{ display:block; font-size:.88rem; font-weight:600; margin-bottom:.4rem }
.campo input, .campo select, .campo textarea{ width:100%; font:inherit; font-size:1rem; color:var(--tinta); background:var(--nevoa);
  border:1.5px solid transparent; border-radius:var(--r-xs); padding:.85rem 1rem; min-height:3.1rem; transition:border-color .2s, background .2s }
.campo textarea{ min-height:6.5rem; resize:vertical }
.campo input:focus, .campo select:focus, .campo textarea:focus{ outline:none; background:#fff; border-color:var(--base) }
.form .obs{ font-size:.85rem; color:var(--tinta-50); margin:.9rem 0 0 }
.mel{ position:absolute; left:-9999px }

/* chamada final */
.chamada{ background:var(--base); border-radius:var(--r); padding:clamp(2.25rem,5vw,3.5rem); color:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; position:relative; overflow:hidden }
.chamada::before{ content:""; position:absolute; width:26rem; height:26rem; border-radius:50%; right:-8rem; bottom:-12rem;
  background:radial-gradient(circle, rgba(255,255,255,.09), transparent 65%) }
.chamada > *{ position:relative }
.chamada h2{ color:#fff; font-size:clamp(1.8rem,3.4vw,2.6rem); max-width:20ch }
.chamada p{ color:rgba(255,255,255,.78); margin:.7rem 0 0; max-width:38ch }

/* rodapé */
.rodape{ background:var(--base); color:rgba(255,255,255,.74); padding:clamp(3.5rem,7vw,5rem) 0 2rem }
.rodape__g{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(2rem,5vw,4rem); padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.16) }
@media (max-width:820px){ .rodape__g{ grid-template-columns:1fr } }
.rodape .logo .n{ color:#fff } .rodape .logo .u{ color:var(--acento); background:rgba(255,255,255,.1) }
.rodape p{ margin-top:1.1rem; max-width:36ch; font-size:1rem }
.rodape h4{ font-family:var(--dados); font-size:.66rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:#fff; margin:0 0 1.1rem }
.rodape ul{ list-style:none; margin:0; padding:0; display:grid; gap:.7rem; font-size:.98rem }
.rodape a{ text-decoration:none } .rodape a:hover{ color:var(--acento) }
.rodape__b{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-top:1.75rem;
  font-family:var(--dados); font-size:.66rem; letter-spacing:.08em; color:rgba(255,255,255,.5) }
.voltar-inicio{ display:inline-flex; align-items:center; gap:.5rem; margin-top:1.75rem; color:#fff; text-decoration:none;
  border:1px solid rgba(255,255,255,.3); border-radius:100px; padding:.7rem 1.2rem; font-size:.92rem; transition:background .25s, border-color .25s }
.voltar-inicio:hover{ background:rgba(255,255,255,.1); border-color:var(--acento); color:var(--acento) }

/* whatsapp flutuante */
.flut{ position:fixed; right:1.1rem; bottom:calc(1.1rem + env(safe-area-inset-bottom)); z-index:70; display:flex; align-items:center; gap:.6rem;
  background:#25D366; color:#0A2E17; font-weight:700; font-size:.95rem; padding:.85rem 1.3rem; border-radius:100px; text-decoration:none;
  box-shadow:0 16px 34px -14px rgba(0,0,0,.5); transition:transform .25s var(--ease) }
.flut:hover{ transform:scale(1.04) }
.flut svg{ width:1.3rem; height:1.3rem }
@media (max-width:520px){ .flut span{ display:none } .flut{ padding:1rem } }

/* animações de entrada */
.an{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease) }
.an.dentro{ opacity:1; transform:none }
.an.d1{ transition-delay:.1s } .an.d2{ transition-delay:.2s } .an.d3{ transition-delay:.3s } .an.d4{ transition-delay:.4s }
.an-z{ opacity:0; transform:scale(.97); transition:opacity .9s var(--ease), transform .9s var(--ease) }
.an-z.dentro{ opacity:1; transform:none }
@media (prefers-reduced-motion: reduce){ .an,.an-z{ opacity:1; transform:none } }


/* Classes antes declaradas diretamente no HTML */
.sec--sem-topo { padding-top: 0; }
.env--respiro-topo { padding-top: clamp(3.5rem, 7vw, 5.5rem); }
.cabecalho--medio { max-width: 40rem; }
.pontos--largo { max-width: 52rem; }
.titulo-contato { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 1rem; }
.texto-contato { color: var(--tinta-70); font-size: 1.12rem; max-width: 38ch; }
.btn--cheio { width: 100%; }
.hero-homecare { min-height: min(82vh, 44rem); display: flex; align-items: center; padding: clamp(4rem, 9vw, 7rem) 0; }
.veu2--hero { background: linear-gradient(100deg, var(--base) 4%, rgba(16,48,60,.85) 42%, rgba(16,48,60,.35)); }
.hero-conteudo { max-width: 44rem; }
.hero-titulo { font-size: clamp(2.7rem, 5.6vw, 4.5rem); color: #fff; margin-bottom: 1.35rem; }
.hero-titulo__destaque { font-style: italic; color: var(--acento); }
.hero-texto { color: rgba(255,255,255,.9); font-size: 1.2rem; max-width: 44ch; }
.status-homecare { margin-top: 2rem; }
.chip-status { display: inline-flex; align-items: center; gap: .55rem; background: rgba(255,255,255,.12); color: #fff; padding: .6rem 1.1rem; border-radius: 100px; font-weight: 600; font-size: .95rem; }
.pontos--coluna { grid-template-columns: 1fr; gap: 0; margin-bottom: 1.25rem; }
.btn--cor-base { color: var(--base); }
.etiqueta--destaque { background: var(--acento); color: #3A1109; }
.veu2--areas { background: linear-gradient(100deg, var(--base) 6%, rgba(16,48,60,.82) 45%, rgba(16,48,60,.4)); }
.areas-lista { display: flex; flex-wrap: wrap; gap: .5rem; max-width: 48rem; }
.etiqueta--compacta { margin: 0; }
.faq--espaco { margin-bottom: clamp(3rem, 6vw, 4.5rem); }
.rodape-slogan { color: #fff; font-family: var(--display); font-size: 1.25rem; display: block; margin-bottom: .5rem; }