/* ═══════════════════════════════════════════════════════════════
   Dra. Lara D. Micali Valério — folha de estilo
   Paleta: vinho/bordô · vermelho tijolo · âmbar de boticário · osso
   bordô = superfícies sólidas · âmbar = estrutura · vermelho = pontuação
   (para trocar o acento, mexa só nas variáveis abaixo)
   ═══════════════════════════════════════════════════════════════ */

:root{
  /* vinho */
  --vinho-900:#2B0E15;
  --vinho-800:#4A1621;
  --vinho-700:#5E1E2C;
  --vinho-600:#7A2A3C;
  --vinho-400:#A85566;
  --vinho-200:#D9A8B2;
  --vinho-100:#F2E2E5;

  /* bordô — o tom quente da família */
  --bordo-800:#571620;
  --bordo-700:#6B1B26;
  --bordo-600:#83202F;
  --bordo-500:#9C2A3C;

  /* vermelho tijolo — a pontuação */
  --vermelho-700:#8F2820;
  --vermelho-600:#A62F23;
  --vermelho-500:#C2402F;
  --vermelho-400:#D8563F;
  --vermelho-200:#EFAE9F;

  /* âmbar */
  --ambar-700:#9A5418;
  --ambar-600:#B4691F;
  --ambar-500:#CE8630;
  --ambar-400:#E0A254;
  --ambar-200:#F2DBB4;

  /* osso */
  --osso:#F8F3EC;
  --osso2:#F1EAE0;
  --areia:#E6DCCC;

  /* tinta */
  --tinta:#2B0E15;
  --tinta2:#5F4750;
  --tinta3:#8E7A80;

  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --ease:cubic-bezier(.22,1,.36,1);

  --gut:clamp(20px, 5vw, 76px);
  --maxw:1280px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--osso); color:var(--tinta);
  font-family:var(--sans); font-size:16px; line-height:1.7;
  font-weight:300; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit}
button{font:inherit; cursor:pointer}
::selection{background:var(--ambar-400); color:var(--vinho-900)}

.wrap{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut)}
.wrap--narrow{max-width:880px}

/* ─── tipografia ─────────────────────────────────────────────── */
.display,.h2,.h3,.pull,.dyn__label,.faq__i summary,.step h3,
.pcard h3,.obj__card h4,.creds span,.ind__list b{
  font-family:var(--serif);
  font-variation-settings:'SOFT' 22,'WONK' 0,'opsz' 110;
}
.display{
  font-weight:330; font-size:clamp(2.8rem, 6.8vw, 6.1rem);
  line-height:1.0; letter-spacing:-.028em; margin:.16em 0 .45em;
  color:var(--vinho-900);
}
.display em{font-style:italic; color:var(--vermelho-600); font-weight:300}
.display--sm{font-size:clamp(2.1rem, 4.8vw, 4rem); line-height:1.06}

.h2{
  font-weight:340; font-size:clamp(2rem, 4.4vw, 3.7rem);
  line-height:1.05; letter-spacing:-.022em; margin:.1em 0 .5em;
  color:var(--vinho-900);
}
.h2 em{font-style:italic; color:var(--vermelho-600)}
.sec--dark .h2{color:var(--osso)}
.sec--dark .h2 em{color:var(--vermelho-400)}

.h3{font-weight:400; font-size:clamp(1.3rem, 2.1vw, 1.8rem); line-height:1.22;
    letter-spacing:-.012em; margin:0 0 .6em; color:var(--vinho-800)}
.sec--dark .h3{color:var(--osso)}

.lead{font-size:clamp(1.04rem, 1.45vw, 1.2rem); line-height:1.68; color:var(--tinta2)}
.sec--dark .lead{color:rgba(248,243,236,.76)}
p{margin:0 0 1.1em}

/* sobrancelha — régua vertical âmbar, não traço horizontal */
.eyebrow{
  font-size:.68rem; letter-spacing:.24em; text-transform:uppercase;
  font-weight:500; color:var(--ambar-700); margin:0 0 1.5em;
  padding-left:14px; border-left:2px solid var(--vermelho-500);
  line-height:1.5;
}
.eyebrow--light{color:var(--ambar-400); border-left-color:var(--vermelho-500)}
.sechead--center .eyebrow{
  border-left:none; padding-left:0; display:inline-block;
  border-bottom:2px solid var(--vermelho-500); padding-bottom:8px;
}

/* ─── botões: bloco tipográfico com sombra deslocada ─────────── */
.btn{
  display:inline-flex; align-items:center; gap:.75em; justify-content:center;
  padding:1.1em 2.15em; border-radius:2px; text-decoration:none;
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:500;
  border:none; position:relative;
  transition:transform .32s var(--ease), box-shadow .32s var(--ease),
             background .32s, color .32s, border-color .32s;
}
.btn--solid{
  background:var(--bordo-700); color:var(--osso);
  box-shadow:7px 7px 0 0 var(--ambar-400);
}
.btn--solid:hover{background:var(--bordo-600); transform:translate(5px,5px); box-shadow:2px 2px 0 0 var(--bordo-800)}
.btn--amber{
  background:var(--ambar-500); color:var(--vinho-900);
  box-shadow:7px 7px 0 0 rgba(248,243,236,.22);
}
.btn--amber:hover{transform:translate(5px,5px); box-shadow:2px 2px 0 0 rgba(248,243,236,.4)}
.btn--line{
  padding:.2em 0 .7em; border-radius:0; background:none; color:var(--vinho-800);
  border-bottom:1px solid rgba(94,30,44,.3); box-shadow:none; letter-spacing:.15em;
}
.btn--line:hover{border-bottom-color:var(--vinho-700); color:var(--vinho-900)}
.btn--line-light{color:var(--osso); border-bottom-color:rgba(248,243,236,.3)}
.btn--line-light:hover{color:var(--ambar-400); border-bottom-color:var(--ambar-400)}
.btn .ar{width:22px; height:11px; flex:none; transition:transform .4s var(--ease)}
.btn--line:hover .ar{transform:translateX(7px)}
.btn--sm{padding:.78em 1.5em; font-size:.64rem; box-shadow:4px 4px 0 0 var(--ambar-400)}
.btn--sm:hover{background:var(--bordo-600); transform:translate(3px,3px); box-shadow:1px 1px 0 0 var(--bordo-800)}
.btn--lg{padding:1.3em 2.9em; font-size:.8rem}

/* ─── cortina de abertura ────────────────────────────────────── */
.curtain{
  position:fixed; inset:0; z-index:9999; background:var(--vinho-900);
  display:grid; place-items:center;
  transition:clip-path 1s var(--ease) .3s, opacity .5s .9s;
  clip-path:inset(0 0 0 0);
}
.curtain.done{clip-path:inset(0 0 100% 0); opacity:0; pointer-events:none}
.curtain__mark{width:46px}
.curtain__mark path{stroke-dasharray:140; stroke-dashoffset:140; animation:draw .95s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}

/* ─── fio lateral que se desenha no scroll ───────────────────── */
.vine{position:fixed; left:16px; top:0; width:22px; height:100vh; z-index:3; pointer-events:none; opacity:.65}
@media (max-width:1240px){.vine{display:none}}

/* ─── navegação ──────────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:900;
  display:flex; align-items:center; gap:clamp(14px,3vw,44px);
  padding:20px var(--gut);
  transition:background .45s, backdrop-filter .45s, padding .45s, border-color .45s;
  border-bottom:1px solid transparent;
}
.nav.stuck{
  background:rgba(248,243,236,.88); backdrop-filter:blur(16px) saturate(1.2);
  border-bottom-color:rgba(43,14,21,.12); padding-block:13px;
}
.nav__brand{display:flex; align-items:center; gap:13px; text-decoration:none; flex:none}
.nav__mono{
  width:34px; height:34px; flex:none; display:grid; place-items:center;
  border:1.4px solid var(--ambar-500); color:var(--vinho-800);
  font-family:var(--serif); font-size:.86rem; letter-spacing:.02em;
  font-variation-settings:'SOFT' 20,'WONK' 0; border-radius:2px;
}
.nav__name{
  font-family:var(--serif); font-variation-settings:'SOFT' 20;
  font-size:1rem; line-height:1.15; color:var(--vinho-900);
  display:flex; flex-direction:column;
}
.nav__name em{
  font-family:var(--sans); font-style:normal; font-size:.55rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--ambar-700); margin-top:3px;
}
.nav__links{display:flex; gap:clamp(12px,2vw,30px); margin-left:auto}
.nav__links a{
  text-decoration:none; color:var(--tinta2); font-size:.77rem;
  letter-spacing:.04em; position:relative; padding-block:6px; transition:color .3s;
}
.nav__links a::after{
  content:''; position:absolute; left:0; bottom:0; height:1.5px; width:100%;
  background:var(--ambar-500); transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav__links a:hover{color:var(--vinho-800)}
.nav__links a:hover::after{transform:scaleX(1); transform-origin:left}
.nav .btn{flex:none}
.nav__burger{
  display:none; width:42px; height:42px; border:1.4px solid var(--ambar-500);
  background:transparent; border-radius:2px; position:relative; margin-left:auto;
}
.nav__burger span{
  position:absolute; left:11px; width:18px; height:1.6px; background:var(--vinho-800);
  transition:transform .4s var(--ease);
}
.nav__burger span:nth-child(1){top:17px}
.nav__burger span:nth-child(2){top:22px}
.nav__burger.on span:nth-child(1){transform:translateY(2.5px) rotate(45deg)}
.nav__burger.on span:nth-child(2){transform:translateY(-2.5px) rotate(-45deg)}

@media (max-width:1000px){
  .nav__links{display:none}
  .nav .btn--sm{display:none}
  .nav__burger{display:block}
  .nav{background:rgba(248,243,236,.9); backdrop-filter:blur(14px)}
}

.drawer{
  position:fixed; inset:0 0 0 auto; width:min(360px,86vw); z-index:895;
  background:var(--vinho-900); padding:110px 34px 34px;
  display:flex; flex-direction:column; gap:2px;
  transform:translateX(101%); transition:transform .55s var(--ease);
}
.drawer.on{transform:none}
.drawer a{
  text-decoration:none; color:var(--osso); font-family:var(--serif);
  font-variation-settings:'SOFT' 20; font-size:1.45rem; padding:14px 0;
  border-bottom:1px solid rgba(248,243,236,.1);
  transition:color .3s, padding-left .4s var(--ease);
}
.drawer a:hover{color:var(--ambar-400); padding-left:8px}
.drawer__cta{
  margin-top:24px; background:var(--ambar-500); color:var(--vinho-900)!important;
  text-align:center; font-family:var(--sans)!important; font-size:.72rem!important;
  letter-spacing:.15em; text-transform:uppercase; padding:17px 0!important;
  border:none!important; border-radius:2px;
}

/* ═══ HERO ═══════════════════════════════════════════════════════ */
.hero{
  background:var(--osso); position:relative; overflow:hidden;
  padding:clamp(130px,16vh,190px) 0 clamp(70px,9vw,120px);
}
.hero::before{
  content:''; position:absolute; right:-10%; top:-10%; width:62vmax; height:62vmax;
  border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(217,168,178,.30), rgba(224,162,84,.12) 45%, transparent 68%);
  filter:blur(20px);
}
.hero__inner{
  position:relative; z-index:2; width:100%; max-width:var(--maxw);
  margin-inline:auto; padding-inline:var(--gut);
  display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(34px,6vw,84px); align-items:center;
}
.hero__copy{max-width:640px}
.hero__lead{
  font-size:clamp(1.02rem,1.35vw,1.16rem); color:var(--tinta2);
  max-width:46ch; margin-bottom:2.6em;
}
.hero__actions{display:flex; flex-wrap:wrap; align-items:center; gap:clamp(20px,3vw,40px)}

.hero__photo{margin:0; position:relative}
.hero__frame{
  position:relative; z-index:2; overflow:hidden; border-radius:2px;
  aspect-ratio:1066/1421; max-width:430px; max-height:70vh; margin-inline:auto;
  box-shadow:0 40px 70px -40px rgba(43,14,21,.55);
  transition:transform .5s var(--ease);
}
.hero__frame img{width:100%; height:100%; object-fit:cover; object-position:52% 16%}
/* aquece o fundo lilás do estúdio para a família vinho/âmbar */
.hero__frame::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(165deg, rgba(206,134,48,.14), rgba(94,30,44,.22));
  mix-blend-mode:multiply;
}
.hero__rule{
  position:absolute; z-index:1; right:max(-22px, -2vw); bottom:-22px;
  width:62%; height:58%; max-width:300px;
  border-right:2px solid var(--vermelho-500); border-bottom:2px solid var(--vermelho-500);
}

@media (max-width:920px){
  .hero__inner{grid-template-columns:1fr; gap:42px}
  .hero__photo{order:-1; max-width:280px}
  .hero__frame{max-height:42vh}
  .hero__rule{width:55%; height:50%; right:-14px; bottom:-14px}
}

/* ═══ FAIXA DE CREDENCIAIS ═══════════════════════════════════════ */
.band{background:var(--areia); border-block:1px solid rgba(43,14,21,.1)}
.band__grid{
  display:grid; grid-template-columns:1.5fr 1fr 1.5fr;
  padding-block:clamp(22px,3vw,32px); gap:0;
}
.band__grid > div{
  padding-inline:clamp(16px,2.6vw,38px);
  border-left:1px solid rgba(43,14,21,.14);
  font-size:.86rem; color:var(--tinta2); line-height:1.5;
}
.band__grid > div:first-child{border-left:none; padding-left:0}
.band__grid span{
  display:block; font-size:.58rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ambar-700); font-weight:500; margin-bottom:7px;
}
@media (max-width:760px){
  .band__grid{grid-template-columns:1fr; gap:20px}
  .band__grid > div{border-left:none; padding-left:0; padding-inline:0}
}

/* ═══ SEÇÕES ═════════════════════════════════════════════════════ */
.sec{padding:clamp(78px,10.5vw,148px) 0; position:relative}
.sec--osso{background:var(--osso)}
.sec--osso2{background:var(--osso2)}
.sec--dark{background:linear-gradient(168deg,#2B0E15 0%,#3C1219 46%,#571620 100%); color:var(--osso)}
.sec--dark p{color:rgba(248,243,236,.7)}

.sechead{max-width:760px; margin-bottom:clamp(46px,6vw,80px)}
.sechead--center{margin-inline:auto; text-align:center}
.sechead__lead{font-size:clamp(1rem,1.3vw,1.12rem); line-height:1.72; color:var(--tinta2)}
.sec--dark .sechead__lead{color:rgba(248,243,236,.72)}
.sechead__lead em{font-family:var(--serif); font-size:1.14em; color:var(--ambar-700); font-style:italic}
.sec--dark .sechead__lead em{color:var(--ambar-400)}

/* ─── princípio ─────────────────────────────────────────────── */
.principio__grid{max-width:920px}
.principio__two{
  display:grid; grid-template-columns:1fr 1fr; gap:0; margin:52px 0;
  border-top:1px solid rgba(43,14,21,.16);
}
.pcard{
  padding:32px clamp(20px,3vw,38px) 32px 0; position:relative;
  border-left:1px solid rgba(43,14,21,.16);
  transition:background .5s var(--ease);
}
.pcard:first-child{border-left:none}
.pcard:not(:first-child){padding-left:clamp(20px,3vw,38px)}
.pcard::before{
  content:''; position:absolute; left:-1px; top:0; width:2px; height:0;
  background:var(--vermelho-500); transition:height .7s var(--ease);
}
.pcard:hover::before{height:100%}
.pcard:first-child::before{left:0}
.pcard__num{
  font-family:var(--serif); font-style:italic; font-size:1.4rem;
  color:var(--vermelho-600); display:block; margin-bottom:14px;
}
.pcard h3{font-weight:420; font-size:1.32rem; margin:0 0 .5em; color:var(--vinho-800)}
.pcard p{margin:0; font-size:.94rem; color:var(--tinta2)}
.pcard em{font-style:italic; color:var(--vinho-700); font-weight:400}

.pull{
  margin:0; padding:42px 0 0; border-top:1px solid rgba(43,14,21,.16);
  font-weight:330; font-size:clamp(1.5rem,3.1vw,2.35rem);
  line-height:1.26; color:var(--vinho-900);
}
.pull em{display:block; font-style:italic; color:var(--vermelho-600); margin-top:.14em}

@media (max-width:760px){
  .principio__two{grid-template-columns:1fr}
  .pcard{border-left:none; border-top:1px solid rgba(43,14,21,.16); padding-left:0!important}
  .pcard:first-child{border-top:none}
}

/* ─── homeopatia: intro ─────────────────────────────────────── */
.hom__intro{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,70px);
  padding-bottom:clamp(50px,7vw,90px);
}
.hom__intro p{font-size:.96rem; color:var(--tinta2)}
@media (max-width:820px){.hom__intro{grid-template-columns:1fr}}

/* ─── INTERATIVO: dinamização ───────────────────────────────── */
.dyn{
  background:linear-gradient(158deg,#2B0E15 0%,#43141D 55%,#5E1922 100%);
  color:var(--osso); border-radius:2px; padding:clamp(32px,5vw,62px); position:relative; overflow:hidden;
  box-shadow:14px 14px 0 0 var(--ambar-500);
}
.dyn__head{max-width:620px; margin-bottom:38px; position:relative; z-index:2}
.dyn__head .h3{color:var(--osso)}
.dyn__sub{font-size:.9rem; color:rgba(248,243,236,.64); margin:0}
.dyn__stage{
  display:grid; grid-template-columns:200px 1fr; gap:clamp(28px,5vw,62px);
  align-items:center; position:relative; z-index:2;
}
.dyn__vialwrap{position:relative; display:grid; place-items:center}
.dyn__glow{
  position:absolute; width:230px; height:230px; border-radius:50%;
  background:radial-gradient(circle, rgba(224,162,84,.6), transparent 62%);
  filter:blur(26px); opacity:.2; transition:opacity .9s var(--ease), transform .9s var(--ease);
}
.dyn__vial{width:100%; max-width:172px; position:relative; z-index:2; overflow:visible}
#dynDots circle{transition:opacity .7s var(--ease)}

.dyn__potency{display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; margin-bottom:14px}
.dyn__label{
  font-weight:330; font-size:clamp(2.5rem,5.6vw,3.8rem); line-height:1;
  color:var(--ambar-400); letter-spacing:-.03em;
}
.dyn__ratio{
  font-size:.8rem; letter-spacing:.12em; color:rgba(248,243,236,.52);
  font-variant-numeric:tabular-nums;
}
.dyn__ratio sup{font-size:.72em}
.dyn__text{
  min-height:5.2em; font-size:.96rem; line-height:1.7;
  color:rgba(248,243,236,.78); margin:0 0 14px; max-width:52ch;
}
.dyn__flag{
  display:inline-flex; align-items:center; gap:9px; margin-bottom:20px;
  padding:8px 15px; border-radius:2px; border:1px solid var(--vermelho-600);
  background:rgba(194,64,47,.14); color:var(--vermelho-400);
  font-size:.65rem; letter-spacing:.16em; text-transform:uppercase;
  animation:pop .5s var(--ease);
}
.dyn__flag[hidden]{display:none}
.dyn__flag .ic{width:14px; height:14px}
@keyframes pop{from{opacity:0; transform:translateY(6px)}}

.dyn__range{
  -webkit-appearance:none; appearance:none; width:100%; background:transparent;
  margin:26px 0 8px; cursor:grab;
}
.dyn__range:active{cursor:grabbing}
.dyn__range::-webkit-slider-runnable-track{
  height:2px; background:linear-gradient(to right, var(--ambar-500), rgba(248,243,236,.16));
}
.dyn__range::-moz-range-track{height:2px; background:rgba(248,243,236,.18)}
.dyn__range::-moz-range-progress{height:2px; background:var(--ambar-500)}
.dyn__range::-webkit-slider-thumb{
  -webkit-appearance:none; width:20px; height:20px; border-radius:2px; margin-top:-9px;
  background:var(--ambar-400); border:1px solid var(--ambar-200);
  box-shadow:0 0 0 7px rgba(206,134,48,.14);
  transform:rotate(45deg); transition:box-shadow .35s;
}
.dyn__range:hover::-webkit-slider-thumb{box-shadow:0 0 0 12px rgba(206,134,48,.2)}
.dyn__range::-moz-range-thumb{
  width:18px; height:18px; border-radius:2px; border:1px solid var(--ambar-200);
  background:var(--ambar-400);
}
.dyn__ticks{
  list-style:none; display:flex; justify-content:space-between; padding:0; margin:0 0 24px;
  font-size:.64rem; letter-spacing:.1em; color:rgba(248,243,236,.38);
}
.dyn__ticks li{transition:color .4s, transform .4s var(--ease); flex:1; text-align:center; cursor:pointer}
.dyn__ticks li:first-child{text-align:left}
.dyn__ticks li:last-child{text-align:right}
.dyn__ticks li.on{color:var(--ambar-400); transform:translateY(-2px)}
.dyn__note{
  font-size:.78rem; color:rgba(248,243,236,.44); line-height:1.62; margin:0; max-width:56ch;
  border-top:1px solid rgba(248,243,236,.12); padding-top:16px;
}

@media (max-width:780px){
  .dyn{box-shadow:8px 8px 0 0 var(--ambar-500)}
  .dyn__stage{grid-template-columns:1fr; gap:30px}
  .dyn__vial{max-width:128px}
  .dyn__text{min-height:auto}
}

/* ─── condições ─────────────────────────────────────────────── */
.cond{padding-top:clamp(60px,8vw,110px)}
.cond__hint{font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--tinta3); margin-bottom:2.2em}
.cond__grid{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(250px,1fr));
  gap:1px; background:rgba(43,14,21,.14);
}
.cond__item{
  background:var(--osso2); padding:26px 24px; cursor:pointer; position:relative;
  min-height:112px; display:flex; flex-direction:column; justify-content:center;
  transition:background .5s var(--ease); outline:none;
}
.cond__item::before{
  content:''; position:absolute; inset:0; background:var(--bordo-700);
  transform:scaleY(0); transform-origin:bottom; transition:transform .5s var(--ease);
}
.cond__item.on::before, .cond__item:focus-visible::before{transform:scaleY(1)}
.cond__t{
  position:relative; z-index:2; font-family:var(--serif); font-variation-settings:'SOFT' 22;
  font-size:1.24rem; line-height:1.2; color:var(--vinho-900); transition:color .35s;
}
.cond__d{
  position:relative; z-index:2; font-size:.85rem; line-height:1.55;
  color:rgba(248,243,236,.72); max-height:0; opacity:0; overflow:hidden;
  transition:max-height .55s var(--ease), opacity .4s .08s, margin-top .55s var(--ease);
}
.cond__item.on .cond__t, .cond__item:focus-visible .cond__t{color:var(--ambar-400)}
.cond__item.on .cond__d, .cond__item:focus-visible .cond__d{max-height:130px; opacity:1; margin-top:10px}

/* ═══ ECS — mapa de receptores ═══════════════════════════════════ */
.ecs{
  display:grid; grid-template-columns:1fr 420px; gap:clamp(30px,5vw,70px);
  align-items:center; padding-bottom:clamp(60px,8vw,110px);
}
.ecs__tabs{display:inline-flex; gap:0; margin-bottom:22px; border:1px solid rgba(224,162,84,.35); border-radius:2px}
.ecs__tab{
  border:none; background:transparent; color:rgba(248,243,236,.6);
  padding:.72em 1.9em; font-size:.72rem; letter-spacing:.18em; font-weight:500;
  transition:background .4s var(--ease), color .3s;
}
.ecs__tab.is-on{background:var(--ambar-500); color:var(--vinho-900)}
.ecs__tab[data-r="cb1"].is-on{background:var(--vermelho-500); color:var(--osso)}
.ecs__tabdesc{font-size:.92rem; color:rgba(248,243,236,.68); min-height:3.6em; margin-bottom:22px; max-width:46ch}
.ecs__card{
  border-left:2px solid var(--ambar-500); padding:4px 0 4px 22px; min-height:120px;
}
.ecs__cardtag{
  display:inline-block; font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ambar-400); margin-bottom:10px;
}
.ecs__card p{margin:0; font-size:.92rem; line-height:1.68; color:rgba(248,243,236,.82)}
.ecs__hint{font-size:.65rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(248,243,236,.34); margin:16px 0 0}

.ecs__figure{position:relative; display:grid; place-items:center}
.ecs__svg{width:100%; max-width:320px; color:rgba(217,168,178,.4); overflow:visible}
.ecs__body{filter:drop-shadow(0 0 20px rgba(168,85,102,.22))}
.ecs__pt{cursor:pointer}
.ecs__pt .halo{fill:var(--ambar-500); opacity:.13; transform-box:fill-box; transform-origin:center; animation:pulse 2.8s ease-in-out infinite}
.ecs__pt .core{fill:var(--ambar-400); stroke:var(--vinho-900); stroke-width:1}
.ecs__pt.on .core{fill:var(--osso)}
.ecs__pt.on .halo{opacity:.45}
.ecs__pt:hover .halo{opacity:.36}
@keyframes pulse{0%,100%{transform:scale(.85); opacity:.12}50%{transform:scale(1.35); opacity:.3}}
/* a cor dos pontos identifica a família de receptores */
.ecs[data-r="cb1"] .halo{fill:var(--vermelho-500)}
.ecs[data-r="cb1"] .core{fill:var(--vermelho-400)}
.ecs[data-r="cb1"] .ecs__card{border-left-color:var(--vermelho-500)}
.ecs[data-r="cb1"] .ecs__cardtag{color:var(--vermelho-400)}

.ecs__molecule{position:absolute; bottom:-8px; left:0; display:flex; flex-direction:column; gap:6px; opacity:.75}
.ecs__molecule svg{width:110px}
.ecs__molecule span{font-size:.54rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(248,243,236,.34)}
.mol-key{stroke-dasharray:110; stroke-dashoffset:110; animation:molDraw 4s var(--ease) infinite}
.mol-dot{opacity:0; animation:molDot 4s var(--ease) infinite}
.mol-dot:nth-of-type(2){animation-delay:.2s}
.mol-dot:nth-of-type(3){animation-delay:.4s}
@keyframes molDraw{0%{stroke-dashoffset:110}45%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:-110}}
@keyframes molDot{0%,25%{opacity:0}50%,80%{opacity:1}100%{opacity:0}}

@media (max-width:940px){
  .ecs{grid-template-columns:1fr}
  .ecs__figure{order:-1}
  .ecs__svg{max-width:230px}
  .ecs__molecule{display:none}
}

/* ─── indicações ────────────────────────────────────────────── */
.ind{padding-bottom:clamp(50px,7vw,90px)}
.ind .h3{margin-bottom:1.4em}
.ind__list{list-style:none; padding:0; margin:0 0 30px; display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.ind__list li{
  padding:22px 26px 22px 0; border-top:1px solid rgba(248,243,236,.14);
  transition:padding-left .5s var(--ease), border-color .5s;
}
.ind__list li:hover{padding-left:16px; border-color:var(--ambar-500)}
.ind__list b{display:block; font-weight:430; font-size:1.16rem; color:var(--osso); margin-bottom:4px}
.ind__list span{font-size:.85rem; color:rgba(248,243,236,.58); line-height:1.55}
.ind__disc{font-size:.78rem; color:rgba(248,243,236,.42); border-left:2px solid var(--ambar-600); padding-left:16px; max-width:70ch; margin:0}

/* ─── objeções ──────────────────────────────────────────────── */
.obj{display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:0; border-top:1px solid rgba(248,243,236,.14)}
.obj__card{
  padding:32px clamp(20px,2.6vw,32px) 32px 0; position:relative;
  border-left:1px solid rgba(248,243,236,.14);
  transition:background .5s;
}
.obj__card:first-child{border-left:none}
.obj__card:not(:first-child){padding-left:clamp(20px,2.6vw,32px)}
.obj__card::before{
  content:''; position:absolute; left:-1px; top:0; width:2px; height:0;
  background:var(--ambar-500); transition:height .6s var(--ease);
}
.obj__card:hover::before{height:100%}
.obj__card h4{font-weight:430; font-size:1.26rem; color:var(--vermelho-400); margin:0 0 .6em}
.obj__card p{margin:0; font-size:.89rem; line-height:1.68}
.obj__card em{font-style:italic; color:var(--ambar-200)}
@media (max-width:820px){
  .obj__card{border-left:none; border-top:1px solid rgba(248,243,236,.14); padding-left:0!important}
  .obj__card:first-child{border-top:none}
}

/* ─── passos da consulta: trilho que se preenche ─────────────── */
.steps{list-style:none; padding:0; margin:0; max-width:900px}
.step{
  display:grid; grid-template-columns:46px 1fr; gap:clamp(22px,3.5vw,46px);
  padding-bottom:clamp(34px,4.5vw,56px); position:relative;
}
.step:last-child{padding-bottom:0}
/* segmento do trilho, ligando um marcador ao próximo */
.step::before,
.step::after{
  content:''; position:absolute; left:22px; top:46px; width:2px;
}
.step::before{bottom:0; background:rgba(43,14,21,.15)}
.step::after{height:0; background:var(--ambar-500); transition:height 1s var(--ease) .25s}
.step.in::after{height:calc(100% - 46px)}
.step:last-child::before,.step:last-child::after{display:none}

.step__n{
  width:46px; height:46px; display:grid; place-items:center; position:relative; z-index:2;
  border:1.5px solid rgba(43,14,21,.2); border-radius:2px; background:var(--osso);
  font-family:var(--sans); font-size:.72rem; letter-spacing:.1em; font-weight:500;
  color:var(--tinta3);
  transition:background .55s var(--ease), color .55s, border-color .55s, box-shadow .55s var(--ease);
}
.step.in .step__n{
  background:var(--ambar-500); border-color:var(--ambar-500); color:var(--vinho-900);
  box-shadow:4px 4px 0 0 var(--bordo-700);
}
.step__body{padding-top:6px}
.step h3{font-weight:430; font-size:clamp(1.32rem,2.1vw,1.72rem); margin:0 0 .5em; color:var(--vinho-900)}
.step p{margin:0; color:var(--tinta2); font-size:.97rem; line-height:1.72; max-width:60ch}
@media (max-width:560px){
  .step{gap:18px; grid-template-columns:40px 1fr}
  .step::before,.step::after{left:19px; top:40px}
  .step.in::after{height:calc(100% - 40px)}
  .step__n{width:40px; height:40px; font-size:.66rem}
}

/* ─── sobre ─────────────────────────────────────────────────── */
.sobre{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(34px,6vw,86px); align-items:center}
.sobre__photo{margin:0; position:relative}
.sobre__frame{
  border-radius:2px; overflow:hidden; aspect-ratio:1376/1066; position:relative;
  box-shadow:0 36px 70px -42px rgba(43,14,21,.6);
  transition:transform .5s var(--ease);
}
.sobre__frame img{width:100%; height:100%; object-fit:cover; object-position:56% 40%}
.sobre__crm{
  position:absolute; left:-10px; bottom:-16px; background:var(--bordo-700); color:var(--ambar-400);
  padding:12px 20px; font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  border-radius:2px; box-shadow:5px 5px 0 0 var(--ambar-500);
}
.creds{list-style:none; padding:0; margin:36px 0 0}
.creds li{padding:15px 0; border-top:1px solid rgba(43,14,21,.16); font-size:.86rem; color:var(--tinta3)}
.creds span{display:block; font-weight:420; font-size:1.16rem; color:var(--vinho-800); margin-bottom:2px}
@media (max-width:880px){
  .sobre{grid-template-columns:1fr}
  .sobre__photo{max-width:460px}
}

/* ─── consultório ───────────────────────────────────────────── */
.cons{display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,6vw,80px); align-items:center}
.cons__info{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:26px; margin:36px 0}
.cons__info dt{font-size:.58rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ambar-400); margin-bottom:8px}
.cons__info dd{margin:0; font-size:.9rem; line-height:1.68; color:rgba(248,243,236,.78)}
.cons__info a{color:var(--ambar-400); text-decoration:none; border-bottom:1px solid rgba(224,162,84,.35)}
.cons__info a:hover{border-color:var(--ambar-400)}
.cons__actions{display:flex; flex-wrap:wrap; align-items:center; gap:clamp(20px,3vw,36px)}
.cons__photo{margin:0}
.cons__frame{
  border-radius:2px; overflow:hidden; aspect-ratio:1421/1895; position:relative;
  max-width:400px; margin-inline:auto;
  box-shadow:0 44px 84px -48px rgba(0,0,0,.9);
  transition:transform .5s var(--ease);
}
.cons__frame img{width:100%; height:100%; object-fit:cover}
.cons__frame::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(43,14,21,.5), rgba(43,14,21,.08) 60%);
  mix-blend-mode:multiply;
}
@media (max-width:880px){.cons{grid-template-columns:1fr}.cons__photo{order:-1}}

/* ─── FAQ ───────────────────────────────────────────────────── */
.faq{border-top:1px solid rgba(43,14,21,.16)}
.faq__i{border-bottom:1px solid rgba(43,14,21,.16)}
.faq__i summary{
  list-style:none; cursor:pointer; padding:26px 46px 26px 0; position:relative;
  font-weight:400; font-size:clamp(1.1rem,1.8vw,1.36rem); color:var(--vinho-900);
  transition:color .35s;
}
.faq__i summary::-webkit-details-marker{display:none}
.faq__i summary:hover{color:var(--ambar-700)}
.faq__i summary::before,
.faq__i summary::after{
  content:''; position:absolute; right:8px; top:50%; background:var(--ambar-600);
  transition:transform .45s var(--ease), opacity .3s;
}
.faq__i summary::before{width:13px; height:1.6px; margin-top:-.8px}
.faq__i summary::after{width:1.6px; height:13px; margin-top:-6.5px; margin-right:5.7px}
.faq__i[open] summary::after{transform:rotate(90deg); opacity:0}
.faq__i[open] summary{color:var(--ambar-700)}
.faq__i > div{overflow:hidden; animation:faqIn .55s var(--ease)}
.faq__i p{padding-bottom:26px; margin:0; color:var(--tinta2); font-size:.95rem; max-width:68ch}
.faq__i a{color:var(--ambar-700)}
@keyframes faqIn{from{opacity:0; transform:translateY(-8px)}}

/* ─── CTA final ─────────────────────────────────────────────── */
.cta{
  background:var(--ambar-500); color:var(--vinho-900); text-align:center;
  padding:clamp(84px,12vw,160px) 0; position:relative; overflow:hidden;
}
.cta::before{
  content:''; position:absolute; inset:0; opacity:.16; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
.cta .wrap{position:relative; z-index:2}
.cta .eyebrow{
  display:inline-block; border-left:none; padding-left:0; padding-bottom:8px;
  border-bottom:2px solid var(--vinho-800); color:var(--vinho-800);
}
.cta .display{color:var(--vinho-900); margin-inline:auto}
.cta .display em{color:var(--osso); font-style:italic}
.cta__lead{color:rgba(43,14,21,.8); font-size:.94rem; letter-spacing:.05em; margin-bottom:2.8em}
.cta .btn--solid{box-shadow:7px 7px 0 0 var(--osso)}
.cta .btn--solid:hover{box-shadow:2px 2px 0 0 var(--vinho-900)}

/* ─── rodapé ────────────────────────────────────────────────── */
.foot{background:linear-gradient(180deg,#2B0E15 0%,#3C1219 100%); color:rgba(248,243,236,.62); padding:72px 0 0; font-size:.84rem}
.foot__grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.3fr; gap:clamp(24px,4vw,50px); padding-bottom:52px}
.foot__brand .nav__mono{color:var(--ambar-400); border-color:var(--ambar-600); margin-bottom:16px}
.foot__brand strong{font-family:var(--serif); font-variation-settings:'SOFT' 20; font-size:1.16rem; color:var(--osso); font-weight:450}
.foot h5{font-size:.58rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ambar-400); margin:0 0 14px; font-weight:500}
.foot p{margin:0 0 12px; line-height:1.72}
.foot a{color:rgba(248,243,236,.82); text-decoration:none; border-bottom:1px solid rgba(224,162,84,.3); transition:color .3s, border-color .3s}
.foot a:hover{color:var(--ambar-400); border-color:var(--ambar-400)}
.foot__col--legal p{font-size:.75rem; color:rgba(248,243,236,.42); line-height:1.66}
.foot__bar{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  border-top:1px solid rgba(248,243,236,.1); padding-block:24px;
  font-size:.7rem; color:rgba(248,243,236,.38); letter-spacing:.05em;
}
@media (max-width:880px){.foot__grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot__grid{grid-template-columns:1fr}}

/* ─── barra flutuante de contato ────────────────────────────── */
.wafloat{
  position:fixed; right:20px; bottom:20px; z-index:880;
  display:inline-flex; align-items:center; gap:.7em;
  background:var(--bordo-700); color:var(--osso); text-decoration:none;
  padding:14px 20px; border-radius:2px; box-shadow:5px 5px 0 0 var(--ambar-500);
  font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; font-weight:500;
  opacity:0; transform:translateY(18px); pointer-events:none;
  transition:opacity .45s var(--ease), transform .32s var(--ease), box-shadow .32s var(--ease);
}
.wafloat.on{opacity:1; transform:none; pointer-events:auto}
.wafloat:hover{transform:translate(3px,3px); box-shadow:1px 1px 0 0 var(--ambar-600)}
.wafloat svg{width:20px; height:20px; flex:none}
@media (max-width:600px){
  .wafloat{padding:15px; gap:0}
  .wafloat span{display:none}
  .wafloat svg{width:24px; height:24px}
}

/* ─── animações de entrada ──────────────────────────────────── */
.reveal{opacity:0; transform:translateY(24px); filter:blur(5px);
  transition:opacity .85s var(--ease), transform .85s var(--ease), filter .85s var(--ease)}
.reveal.in{opacity:1; transform:none; filter:none}
.reveal[data-delay="1"]{transition-delay:.09s}
.reveal[data-delay="2"]{transition-delay:.18s}
.reveal[data-delay="3"]{transition-delay:.27s}

.split .w{display:inline-block; overflow:hidden; vertical-align:top}
.split .w > span{
  display:inline-block; transform:translateY(105%) rotate(2deg); opacity:0;
  transition:transform 1s var(--ease), opacity .8s var(--ease);
}
.split.in .w > span{transform:none; opacity:1}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important; animation-iteration-count:1!important;
    transition-duration:.01ms!important; scroll-behavior:auto!important}
  .reveal{opacity:1; transform:none; filter:none}
  .split .w > span{transform:none; opacity:1}
  .curtain{display:none}
}
