/* =====================================================================
   Saúde da Casa — landing page
   ===================================================================== */

:root{
  /* tinta / superfícies */
  --ink:#0A1018;
  --ink-2:#111C28;
  --ink-3:#1B2A38;
  --paper:#FFFFFF;
  --paper-2:#F6F8F8;
  --paper-3:#EDF3F3;

  /* água */
  --aqua:#0E9AAB;
  --aqua-2:#14BACD;
  --aqua-3:#7FDCE6;
  --aqua-wash:#E8F7F9;
  --aqua-deep:#075867;

  /* texto */
  --tx:#111C28;
  --tx-2:#4A5C6B;
  --tx-3:#7E8F9C;
  --tx-inv:#F4FAFB;
  --tx-inv-2:#A8BEC9;

  /* whatsapp */
  --wa:#1FAF54;
  --wa-dark:#17843F;

  --line:#DFE8E9;
  --line-dark:rgba(255,255,255,.14);

  --r-sm:10px;
  --r:16px;
  --r-lg:26px;
  --r-pill:999px;

  --shadow-1:0 1px 2px rgba(10,16,24,.05), 0 4px 14px rgba(10,16,24,.05);
  --shadow-2:0 2px 6px rgba(10,16,24,.07), 0 18px 44px rgba(10,16,24,.11);
  --shadow-3:0 30px 70px rgba(7,88,103,.22);

  --ff-display:"Fraunces", ui-serif, Georgia, "Times New Roman", serif;
  --ff-text:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --wrap:1180px;
  --gut:clamp(20px, 5vw, 48px);
  --sec-y:clamp(68px, 10vw, 128px);
}

*,*::before,*::after{box-sizing:border-box}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:84px;
}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background:var(--paper);
  color:var(--tx);
  font-family:var(--ff-text);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,video{max-width:100%;display:block}
a{color:inherit}
[hidden]{display:none!important}

/* ---------- tipografia ---------- */
h1,h2,h3,h4{
  font-family:var(--ff-display);
  font-weight:500;
  line-height:1.1;
  letter-spacing:-.018em;
  margin:0 0 .55em;
  font-optical-sizing:auto;
  text-wrap:balance;
}
h1{font-size:clamp(2.35rem, 6.2vw, 4.3rem)}
h2{font-size:clamp(1.95rem, 4.6vw, 3.1rem)}
h3{font-size:clamp(1.2rem, 2.2vw, 1.5rem); letter-spacing:-.01em}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

.lead{
  font-size:clamp(1.05rem, 1.9vw, 1.28rem);
  line-height:1.6;
  color:var(--tx-2);
}
em.hl{
  font-style:italic;
  color:var(--aqua-deep);
  font-variation-settings:"SOFT" 60,"WONK" 1;
}
.dark em.hl{color:var(--aqua-3)}

.eyebrow{
  font-family:var(--ff-text);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--aqua);
  margin:0 0 1.1rem;
}
.dark .eyebrow{color:var(--aqua-3)}

/* ---------- layout ---------- */
.wrap{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--gut);
}
.section{padding-block:var(--sec-y)}
.section--tight{padding-block:clamp(48px,7vw,80px)}

.dark{background:var(--ink); color:var(--tx-inv)}
.dark p{color:var(--tx-inv-2)}
.dark .lead{color:var(--tx-inv-2)}
.wash{background:var(--aqua-wash)}
.soft{background:var(--paper-2)}

.measure{max-width:44ch}
.measure-wide{max-width:60ch}
.center{text-align:center}
.center .measure,.center .measure-wide{margin-inline:auto}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  padding:1.05em 1.9em;
  border:0;
  border-radius:var(--r-pill);
  font-family:var(--ff-text);
  font-size:1.0rem;
  font-weight:600;
  line-height:1;
  letter-spacing:-.005em;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}
.btn:active{transform:translateY(1px)}
.btn svg{width:1.15em;height:1.15em;flex:0 0 auto}

.btn--wa{background:var(--wa); color:#fff; box-shadow:0 8px 22px rgba(31,175,84,.3)}
.btn--wa:hover{background:var(--wa-dark); box-shadow:0 12px 30px rgba(31,175,84,.38); transform:translateY(-2px)}

.btn--primary{
  background:linear-gradient(180deg,var(--aqua-2),var(--aqua));
  color:#fff;
  box-shadow:0 10px 26px rgba(14,154,171,.34);
}
.btn--primary:hover{transform:translateY(-2px); box-shadow:0 16px 36px rgba(14,154,171,.42)}

.btn--ghost{
  background:rgba(255,255,255,.08);
  color:#fff;
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(8px);
}
.btn--ghost:hover{background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.5)}

.btn--outline{background:transparent; color:var(--aqua-deep); border:1.5px solid var(--line)}
.btn--outline:hover{border-color:var(--aqua); background:var(--aqua-wash)}

.btn--lg{padding:1.2em 2.2em; font-size:1.06rem}
.btn--block{width:100%}

.btn-row{display:flex; flex-wrap:wrap; gap:.85rem; align-items:center}
.center .btn-row{justify-content:center}

:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--aqua-2);
  outline-offset:3px;
  border-radius:4px;
}

/* =====================================================================
   HEADER
   ===================================================================== */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:60;
  transition:background-color .35s ease, box-shadow .35s ease, backdrop-filter .35s ease;
}
.nav__in{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:clamp(16px,3vw,40px);
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding:clamp(.8rem,1.6vw,1.15rem) var(--gut);
}
.nav.is-stuck{
  background:rgba(252,254,254,.86);
  backdrop-filter:saturate(180%) blur(16px);
  box-shadow:0 1px 0 rgba(13,45,55,.08), 0 10px 30px rgba(13,45,55,.07);
}
.nav.is-stuck .nav__in{padding-block:clamp(.6rem,1.1vw,.8rem)}

/* ---------- logotipo ---------- */
.logo{
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  text-decoration:none;
  color:var(--ink);
}
.logo__mark{
  width:clamp(36px,3.4vw,44px);
  height:auto;
  flex:0 0 auto;
  filter:drop-shadow(0 4px 12px rgba(7,106,121,.28));
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
}
.logo:hover .logo__mark{transform:translateY(-2px) scale(1.03)}

.logo__txt{display:flex; flex-direction:column; gap:.18rem}
.logo__txt b{
  font-family:var(--ff-display);
  font-weight:600;
  font-size:clamp(1.08rem,1.5vw,1.28rem);
  line-height:1;
  letter-spacing:-.022em;
  white-space:nowrap;
}
/* o "da" fica menor e em itálico, dá respiro ao nome */
.logo__txt b span{
  font-style:italic;
  font-weight:400;
  font-size:.74em;
  color:var(--aqua-deep);
  margin-inline:.22em;
}
.logo__txt i{
  font-style:normal;
  font-family:var(--ff-text);
  font-size:.58rem;
  font-weight:600;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--tx-3);
  white-space:nowrap;
}

/* ---------- menu ---------- */
.nav__menu{display:flex; justify-content:center; gap:clamp(1rem,2.4vw,2.2rem)}
.nav__menu a{
  position:relative;
  font-size:.92rem;
  font-weight:500;
  color:var(--tx-2);
  text-decoration:none;
  padding-block:.3rem;
  transition:color .2s ease;
}
.nav__menu a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:1.5px;
  background:var(--aqua);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.nav__menu a:hover{color:var(--aqua-deep)}
.nav__menu a:hover::after{transform:scaleX(1)}
@media (max-width:1023px){
  .nav__menu{display:none}
  .nav__in{grid-template-columns:auto auto; justify-content:space-between}
}

.nav__cta{padding:.82em 1.5em; font-size:.93rem}
@media (max-width:620px){
  .nav__cta span{display:none}
  .nav__cta{padding:.85em 1.05em}
  .logo__txt i{display:none}
}

/* =====================================================================
   HERO — split screen: texto à esquerda, foto sangrando à direita
   ===================================================================== */
.hero{
  position:relative;
  background:
    radial-gradient(64% 52% at 4% 4%, rgba(255,255,255,.95) 0%, transparent 58%),
    radial-gradient(52% 46% at 34% 96%, rgba(20,186,205,.14) 0%, transparent 62%),
    linear-gradient(152deg, #FCFEFE 0%, #F1F9FA 42%, #E4F2F4 100%);
  overflow:hidden;
}

.hero__inner{
  display:grid;
  align-items:stretch;
  min-height:min(92svh, 840px);
  /* col 1 = exatamente a sarjeta do .wrap · col 2 = texto · col 3 = foto até a borda */
  grid-template-columns:
    max(var(--gut), calc((100% - var(--wrap)) / 2 + var(--gut)))
    minmax(0, 1.2fr)
    minmax(0, 1fr);
  grid-template-rows:1fr;
}
.hero__copy{
  grid-column:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(108px,13.5vh,146px) clamp(28px,3.4vw,64px) clamp(52px,7vh,80px) 0;
}
.hero__visual{grid-column:3}

/* ---------- texto ---------- */
.chip{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.42rem 1rem .42rem .46rem;
  margin:0 0 1.5rem;
  border-radius:var(--r-pill);
  background:#fff;
  border:1px solid rgba(13,45,55,.09);
  box-shadow:0 1px 2px rgba(13,45,55,.04), 0 8px 22px rgba(13,45,55,.06);
  font-size:.82rem;
  font-weight:500;
  color:var(--tx-2);
  letter-spacing:-.005em;
}
.chip b{font-weight:600; color:var(--tx)}
.chip__ico{
  width:26px; height:26px;
  flex:0 0 auto;
  display:grid; place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,var(--aqua-2),var(--aqua-deep));
}
.chip__ico svg{width:13px; height:13px; color:#fff}

.hero__kick{
  font-family:var(--ff-display);
  font-style:italic;
  font-size:clamp(1rem,1.35vw,1.14rem);
  line-height:1.4;
  color:var(--aqua-deep);
  margin:0 0 1.15rem;
  max-width:34ch;
}

.hero__title{
  font-size:clamp(2.6rem, 4.6vw, 4.15rem);
  line-height:1.03;
  letter-spacing:-.028em;
  color:var(--ink);
  margin:0 0 1.15rem;
  max-width:19ch;
}
.hero__title em{
  font-style:italic;
  color:var(--aqua-deep);
  font-variation-settings:"SOFT" 60,"WONK" 1;
}

.hero__sub{
  font-size:clamp(1.04rem,1.28vw,1.2rem);
  line-height:1.6;
  color:var(--tx-2);
  margin:0;
  max-width:46ch;
}

/* ---------- ações: um botão forte + um link discreto ---------- */
.hero__actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:clamp(1rem,2vw,1.9rem);
  margin-top:clamp(1.9rem,3.2vw,2.5rem);
}

.playlink{
  display:inline-flex;
  align-items:center;
  gap:.72rem;
  text-decoration:none;
  color:var(--tx);
  font-size:.96rem;
  transition:color .2s ease;
}
.playlink__ico{
  width:44px; height:44px;
  flex:0 0 auto;
  display:grid; place-items:center;
  border-radius:50%;
  background:#fff;
  border:1px solid rgba(13,45,55,.1);
  box-shadow:0 2px 6px rgba(13,45,55,.06), 0 10px 26px rgba(13,45,55,.08);
  transition:transform .24s cubic-bezier(.2,.7,.2,1), box-shadow .24s ease;
}
.playlink__ico svg{width:13px; height:13px; color:var(--aqua-deep); margin-left:2px}
.playlink__tx b{font-weight:600}
.playlink:hover{color:var(--aqua-deep)}
.playlink:hover .playlink__ico{transform:scale(1.08); box-shadow:0 4px 10px rgba(13,45,55,.08), 0 14px 32px rgba(14,154,171,.22)}

.hero__trust{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.6rem;
  /* limitado para a linha divisória nunca passar por trás do card da água */
  max-width:min(100%, 31rem);
  margin:clamp(2rem,3.4vw,2.7rem) 0 0;
  padding:clamp(1.1rem,2vw,1.4rem) 0 0;
  border-top:1px solid rgba(13,45,55,.1);
  list-style:none;
  font-size:.87rem;
  font-weight:500;
  color:var(--tx-2);
}
.hero__trust li{display:flex; align-items:center; gap:.5rem}
.hero__trust svg{width:15px; height:15px; color:var(--aqua); flex:0 0 auto}

/* ---------- visual ---------- */
.hero__visual{position:relative; align-self:stretch}

.hero__photo{
  display:block;
  position:absolute;
  inset:0;
  border-radius:clamp(22px,2.6vw,34px) 0 0 clamp(22px,2.6vw,34px);
  overflow:hidden;
  box-shadow:-30px 0 80px rgba(9,42,52,.13);
}
.hero__photo img{width:100%; height:100%; object-fit:cover; object-position:center 42%}

/* recorte da água: encostado na borda esquerda da foto, sem tapar nada */
.hero__peek{
  position:absolute;
  left:clamp(-76px,-4.4vw,-40px);
  bottom:clamp(54px,8vh,104px);
  width:clamp(132px,13vw,178px);
  margin:0;
  aspect-ratio:1;
  border-radius:clamp(16px,1.8vw,22px);
  overflow:hidden;
  box-shadow:0 0 0 5px #F1F9FA, 0 26px 54px rgba(9,42,52,.24);
}
.hero__peek img{width:100%; height:100%; object-fit:cover}

/* ---------- hero empilhado (tablet e celular) ---------- */
@media (max-width:1139px){
  .hero__inner{
    grid-template-columns:1fr;
    min-height:0;
    row-gap:clamp(34px,5vw,48px);
  }
  .hero__copy{
    grid-column:1;
    padding:clamp(104px,14vh,132px) var(--gut) 0;
    justify-content:flex-start;
    max-width:44rem;
    margin-inline:auto;
    width:100%;
  }
  .hero__visual{
    grid-column:1;
    align-self:auto;
    aspect-ratio:5/4;
    max-height:62svh;
  }
  .hero__photo{
    position:relative;
    inset:auto;
    height:100%;
    border-radius:0;
    margin:0;
    box-shadow:none;
  }
  .hero__peek{
    left:var(--gut);
    bottom:clamp(16px,3.4vw,26px);
    width:clamp(104px,22vw,148px);
    box-shadow:0 0 0 4px rgba(255,255,255,.92), 0 18px 40px rgba(9,42,52,.3);
  }
}
@media (max-width:620px){
  .hero__title{max-width:none}
  .hero__actions{gap:1.1rem}
  .hero__actions .btn{width:100%}
}

/* ---------- faixa de frase ---------- */
.band{
  background:var(--ink-2);
  color:#fff;
  padding-block:clamp(38px,6vw,64px);
  text-align:center;
}
.band p{
  font-family:var(--ff-display);
  font-size:clamp(1.35rem,3.3vw,2.1rem);
  line-height:1.25;
  letter-spacing:-.02em;
  color:#fff!important;
  max-width:26ch;
  margin-inline:auto;
  text-wrap:balance;
}
.band--aqua{background:linear-gradient(120deg,var(--aqua-deep),var(--aqua))}

/* ---------- grade de poeira ---------- */
.dust-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:clamp(12px,1.6vw,20px);
  margin-top:clamp(36px,5vw,58px);
}
.dust{
  position:relative;
  border-radius:var(--r);
  overflow:hidden;
  aspect-ratio:4/3;
  background:var(--ink-3);
}
.dust img{
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.02);
  transition:transform .8s cubic-bezier(.2,.7,.2,1), filter .5s ease;
  filter:saturate(.9);
}
.dust:hover img{transform:scale(1.07)}
.dust figcaption{
  position:absolute; inset:auto 0 0 0;
  padding:1.5rem 1.1rem .95rem;
  font-size:.88rem;
  font-weight:500;
  color:#fff;
  background:linear-gradient(0deg,rgba(6,12,18,.9),rgba(6,12,18,.45) 55%,transparent);
}
.dust--tall{aspect-ratio:3/4}
@media (min-width:880px){
  .dust-grid--mixed{grid-template-columns:repeat(4,1fr)}
  .dust-grid--mixed .dust:nth-child(1){grid-column:span 2; grid-row:span 2; aspect-ratio:auto}
}

/* ---------- ciclo (3 passos) ---------- */
.cycle{
  display:grid;
  gap:clamp(24px,3vw,40px);
  align-items:center;
  margin-top:clamp(36px,5vw,56px);
}
@media (min-width:900px){ .cycle{grid-template-columns:1.05fr .95fr} }

.cycle__art{
  position:relative;
  border-radius:var(--r-lg);
  overflow:hidden;
  box-shadow:var(--shadow-2);
  aspect-ratio:3/2;
}
.cycle__art img{width:100%;height:100%;object-fit:cover}

.steps{list-style:none; margin:0; padding:0; display:grid; gap:1px; background:var(--line)}
.dark .steps{background:var(--line-dark)}
.steps li{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.1rem;
  align-items:start;
  padding:1.4rem .2rem;
  background:inherit;
}
.steps b{
  display:grid;place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  font-family:var(--ff-text);
  font-size:.86rem;
  font-weight:700;
  background:var(--aqua-wash);
  color:var(--aqua-deep);
}
.dark .steps b{background:rgba(127,220,230,.16); color:var(--aqua-3)}
.steps h3{margin-bottom:.25rem}
.steps p{margin:0; font-size:.98rem}

/* ---------- cards "você sabia" ---------- */
.facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:clamp(14px,1.8vw,22px);
  margin-top:clamp(36px,5vw,56px);
}
.fact{
  position:relative;
  padding:1.8rem 1.6rem;
  border-radius:var(--r);
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:var(--shadow-1);
}
.fact__n{
  font-family:var(--ff-display);
  font-size:2.5rem;
  line-height:1;
  color:var(--aqua-3);
  display:block;
  margin-bottom:.7rem;
  font-variation-settings:"SOFT" 60,"WONK" 1
}
.fact p{margin:0; font-size:1rem; color:var(--tx-2)}

/* ---------- vídeo ---------- */
.player{
  position:relative;
  margin-inline:auto;
  max-width:420px;
  border-radius:var(--r-lg);
  overflow:hidden;
  background:#000;
  box-shadow:var(--shadow-3);
  aspect-ratio:9/16;
}
.player video{width:100%;height:100%;object-fit:cover}
.player__btn{
  position:absolute; inset:0;
  display:grid; place-items:center;
  border:0; padding:0; margin:0;
  background:transparent;
  cursor:pointer;
  transition:opacity .25s ease;
}
.player__btn::after{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(circle at 50% 50%, rgba(6,14,20,.15), rgba(6,14,20,.45));
}
.player__btn i{
  position:relative;
  z-index:1;
  display:grid; place-items:center;
  width:78px;height:78px;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  box-shadow:0 12px 40px rgba(0,0,0,.4);
  transition:transform .22s ease;
}
.player__btn:hover i{transform:scale(1.08)}
.player__btn svg{width:26px;height:26px;color:var(--aqua-deep);margin-left:3px}
.player.is-playing .player__btn{opacity:0; pointer-events:none}

.video-sec{display:grid; gap:clamp(30px,4vw,54px); align-items:center}
@media (min-width:980px){ .video-sec{grid-template-columns:1fr auto} }

/* ---------- a tecnologia (mistério) ---------- */
.reveal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(14px,1.8vw,20px);
  margin-top:clamp(40px,5vw,60px);
}
.peek{
  position:relative;
  border-radius:var(--r);
  overflow:hidden;
  aspect-ratio:1;
  background:var(--ink-3);
  border:1px solid var(--line-dark);
}
.peek img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .9s cubic-bezier(.2,.7,.2,1), opacity .5s ease;
}
.peek:hover img{transform:scale(1.06)}
.peek__veil{
  position:absolute; inset:0;
  background:linear-gradient(190deg, rgba(10,16,24,.05) 0%, rgba(10,16,24,.55) 62%, rgba(10,16,24,.92) 100%);
}
.peek__txt{position:absolute; inset:auto 0 0 0; padding:1.4rem}
.peek__txt b{
  display:block;
  font-family:var(--ff-display);
  font-size:1.16rem;
  font-weight:600;
  letter-spacing:-.015em;
  color:#fff;
  margin-bottom:.2rem;
}
.peek__txt span{display:block; font-size:.9rem; line-height:1.5; color:rgba(220,238,242,.82)}
.peek__step{
  position:absolute; top:1rem; left:1rem;
  display:grid;place-items:center;
  width:30px;height:30px;
  border-radius:50%;
  font-size:.78rem; font-weight:700;
  color:var(--ink);
  background:var(--aqua-3);
}

.peek--locked{
  display:grid;
  place-items:center;
  text-align:center;
  padding:2rem;
  background:
    linear-gradient(140deg, rgba(14,154,171,.22), rgba(10,16,24,.55)),
    var(--ink-2);
}
.peek--locked .peek__lock{
  width:52px;height:52px;
  display:grid;place-items:center;
  border-radius:50%;
  background:rgba(127,220,230,.14);
  border:1px solid rgba(127,220,230,.35);
  margin:0 auto 1rem;
}
.peek--locked svg{width:22px;height:22px;color:var(--aqua-3)}
.peek--locked b{
  display:block;
  font-family:var(--ff-display);
  font-size:1.2rem;
  color:#fff;
  margin-bottom:.35rem;
}
.peek--locked span{font-size:.92rem; color:rgba(220,238,242,.78); display:block; max-width:22ch; margin-inline:auto}

/* selos */
.seals{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:.6rem;
  margin-top:clamp(34px,4.5vw,50px);
  padding:0; list-style:none;
}
.seals li{
  display:flex; align-items:center; gap:.55rem;
  padding:.7rem 1.2rem;
  border-radius:var(--r-pill);
  font-size:.9rem;
  font-weight:500;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line-dark);
  color:var(--tx-inv);
}
.seals svg{width:16px;height:16px;color:var(--aqua-3);flex:0 0 auto}
.light .seals li{background:var(--paper); border-color:var(--line); color:var(--tx)}
.light .seals svg{color:var(--aqua)}

/* ---------- para quem (cartões com foto) ---------- */
.who{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(285px,1fr));
  gap:clamp(16px,2vw,26px);
  margin-top:clamp(38px,5vw,58px);
}
.who__card{
  position:relative;
  display:flex;
  flex-direction:column;
  border-radius:var(--r-lg);
  overflow:hidden;
  background:var(--paper);
  box-shadow:var(--shadow-1);
  border:1px solid var(--line);
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease;
}
.who__card:hover{transform:translateY(-5px); box-shadow:var(--shadow-2)}
.who__img{position:relative; aspect-ratio:16/11; overflow:hidden; background:var(--paper-3)}
.who__img img{width:100%;height:100%;object-fit:cover; transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.who__card:hover .who__img img{transform:scale(1.05)}
.who__tag{
  position:absolute; top:.95rem; left:.95rem;
  padding:.4rem .85rem;
  border-radius:var(--r-pill);
  background:rgba(255,255,255,.93);
  backdrop-filter:blur(6px);
  font-size:.74rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--aqua-deep);
}
.who__body{padding:1.6rem 1.5rem 1.75rem}
.who__body h3{margin-bottom:.5rem; text-wrap:balance}
.who__body p{margin:0; font-size:.99rem; color:var(--tx-2)}

/* ---------- sintomas ---------- */
.sym{display:grid; gap:clamp(28px,4vw,54px); align-items:center}
@media (min-width:920px){ .sym{grid-template-columns:.95fr 1.05fr} }
.sym__stack{display:grid; grid-template-columns:1fr 1fr; gap:clamp(10px,1.4vw,16px)}
.sym__stack figure{margin:0; border-radius:var(--r); overflow:hidden; aspect-ratio:4/5; background:var(--paper-3)}
.sym__stack img{width:100%;height:100%;object-fit:cover}
.sym__stack figure:nth-child(1){transform:translateY(clamp(-6px,-1.4vw,-14px))}
.sym__stack figure:nth-child(2){transform:translateY(clamp(8px,1.8vw,22px))}

.ticks{list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.85rem}
.ticks li{display:grid; grid-template-columns:auto 1fr; gap:.8rem; align-items:start; font-size:1rem; color:var(--tx-2)}
.ticks svg{width:21px;height:21px;color:var(--aqua);margin-top:.15rem;flex:0 0 auto}
.dark .ticks li{color:var(--tx-inv-2)}
.dark .ticks svg{color:var(--aqua-3)}

/* ---------- formulário ---------- */
.cta-sec{
  position:relative;
  background:linear-gradient(165deg,var(--ink) 0%, #0C2430 48%, var(--aqua-deep) 100%);
  color:#fff;
  overflow:hidden;
  isolation:isolate;
}
.cta-sec::before{
  content:"";
  position:absolute; inset:-30% -10% auto -10%;
  height:70%;
  z-index:-1;
  background:radial-gradient(60% 60% at 70% 20%, rgba(20,186,205,.3), transparent 70%);
}
.cta-grid{display:grid; gap:clamp(34px,4.5vw,64px); align-items:start}
@media (min-width:960px){ .cta-grid{grid-template-columns:1fr 1fr} }
.cta-sec h2{color:#fff}
.cta-sec p{color:rgba(228,244,247,.86)}

.card-form{
  padding:clamp(1.6rem,3vw,2.4rem);
  border-radius:var(--r-lg);
  background:rgba(255,255,255,.97);
  box-shadow:0 40px 90px rgba(3,20,28,.4);
  color:var(--tx);
}
.card-form h3{margin-bottom:.3rem}
.card-form>p{font-size:.95rem; color:var(--tx-2); margin-bottom:1.5rem}

.field{margin-bottom:1.05rem}
.field label{
  display:block;
  font-size:.83rem;
  font-weight:600;
  letter-spacing:.01em;
  color:var(--tx-2);
  margin-bottom:.4rem;
}
.field input,.field select{
  width:100%;
  padding:.92rem 1rem;
  font:inherit;
  font-size:1rem;
  color:var(--tx);
  background:var(--paper-2);
  border:1.5px solid var(--line);
  border-radius:var(--r-sm);
  transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.field input::placeholder{color:var(--tx-3)}
.field input:focus,.field select:focus{
  outline:0;
  background:#fff;
  border-color:var(--aqua-2);
  box-shadow:0 0 0 4px rgba(20,186,205,.15);
}
.field select{appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A5C6B' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  background-size:17px;
  padding-right:2.6rem;
}
.field--row{display:grid; grid-template-columns:1fr 1fr; gap:.9rem}
@media (max-width:460px){ .field--row{grid-template-columns:1fr} }

.hp{position:absolute!important; left:-9999px!important; width:1px; height:1px; overflow:hidden}

.form-note{
  margin:1.1rem 0 0;
  font-size:.82rem;
  line-height:1.5;
  color:var(--tx-3);
  text-align:center;
}
.form-alt{
  margin-top:1.3rem;
  padding-top:1.3rem;
  border-top:1px solid var(--line);
  text-align:center;
  font-size:.92rem;
  color:var(--tx-2);
}
.form-alt a{color:var(--aqua-deep); font-weight:600; text-decoration:none; border-bottom:1.5px solid var(--aqua-3)}
.form-alt a:hover{border-color:var(--aqua-deep)}

.alerta{
  display:flex; gap:.7rem;
  padding:.9rem 1.05rem;
  margin-bottom:1.3rem;
  border-radius:var(--r-sm);
  background:#FFF4E8;
  border:1px solid #F5D9B6;
  color:#7A4A12;
  font-size:.92rem;
  line-height:1.5;
}
.alerta svg{width:19px;height:19px;flex:0 0 auto;margin-top:.15rem}

/* ---------- faq ---------- */
.faq{max-width:52rem; margin-inline:auto; margin-top:clamp(32px,4vw,48px)}
.faq details{
  border-bottom:1px solid var(--line);
  padding:.35rem 0;
}
.faq summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1.2rem;
  padding:1.2rem .2rem;
  cursor:pointer;
  list-style:none;
  font-family:var(--ff-display);
  font-size:clamp(1.06rem,2vw,1.25rem);
  font-weight:500;
  letter-spacing:-.012em;
  color:var(--tx);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";
  flex:0 0 auto;
  width:22px;height:22px;
  margin-top:.2rem;
  background:currentColor;
  opacity:.45;
  transition:transform .25s ease;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq details p{
  padding:0 2.6rem 1.35rem .2rem;
  margin:0;
  color:var(--tx-2);
  font-size:1rem;
}

/* ---------- rodapé ---------- */
.foot{background:var(--ink); color:var(--tx-inv-2); padding-block:clamp(44px,6vw,68px) 44px}
@media (max-width:879px){ .foot{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))} }
.foot__top{
  display:flex; flex-wrap:wrap; gap:1.6rem;
  align-items:center; justify-content:space-between;
  padding-bottom:1.8rem;
  border-bottom:1px solid var(--line-dark);
}
.foot__legal{margin-top:1.8rem; font-size:.82rem; line-height:1.65; max-width:62ch}
.foot__legal p{color:var(--tx-3)!important}
.foot a{color:var(--aqua-3)}

/* ---------- barra fixa mobile + fab ---------- */
.dock{
  position:fixed;
  inset:auto 0 0 0;
  z-index:55;
  padding:.7rem var(--gut) calc(.7rem + env(safe-area-inset-bottom,0px));
  background:rgba(255,255,255,.93);
  backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 -1px 0 var(--line), 0 -8px 26px rgba(10,16,24,.09);
  transform:translateY(120%);
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
}
.dock.is-on{transform:translateY(0)}
@media (min-width:880px){ .dock{display:none} }

.fab{
  position:fixed;
  right:24px; bottom:24px;
  z-index:55;
  width:60px;height:60px;
  display:grid;place-items:center;
  border-radius:50%;
  background:var(--wa);
  color:#fff;
  box-shadow:0 10px 30px rgba(31,175,84,.42);
  transition:transform .25s ease, box-shadow .25s ease, opacity .3s ease;
}
.fab:hover{transform:scale(1.07); box-shadow:0 14px 38px rgba(31,175,84,.5)}
.fab svg{width:30px;height:30px}
.fab.is-off{opacity:0; pointer-events:none; transform:scale(.7)}
@media (max-width:879px){ .fab{display:none} }

/* ---------- animação de entrada ---------- */
.rv{opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.is-in{opacity:1; transform:none}
.rv-d1{transition-delay:.08s}
.rv-d2{transition-delay:.16s}
.rv-d3{transition-delay:.24s}
.rv-d4{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1; transform:none; transition:none}
  .dust img,.peek img,.who__img img{transition:none}
}

.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;
}

/* ---------- faixa com vídeo ao fundo ---------- */
.band--media{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding-block:clamp(60px,9vw,108px);
}
.band__media{position:absolute; inset:0; z-index:-2}
.band__media img,.band__media video{width:100%; height:100%; object-fit:cover}
.band--media::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(90% 100% at 50% 40%, rgba(7,24,34,.5), rgba(8,18,26,.88)),
    linear-gradient(180deg, rgba(10,16,24,.55), rgba(10,16,24,.8));
}
.band--media p{text-shadow:0 2px 24px rgba(0,0,0,.5)}

/* ---------- seção "A tecnologia" com vídeo de fundo ---------- */
.tec{position:relative; isolation:isolate; overflow:hidden; background:var(--ink-2)}
.tec__media{position:absolute; inset:0; z-index:-2}
.tec__media img,.tec__media video{width:100%; height:100%; object-fit:cover}
.tec::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(80% 70% at 50% 0%, rgba(11,32,42,.72), rgba(9,20,28,.93) 70%),
    linear-gradient(180deg, rgba(10,18,26,.86), rgba(8,16,22,.95));
}

/* ---------- logotipo sobre fundo escuro ---------- */
.logo--foot{color:#fff}
.logo--foot .logo__txt b span{color:var(--aqua-3)}
.logo--foot .logo__txt i{color:rgba(168,190,201,.8)}
