/* =========================================================
   Voice Report — landing
   Direção: prancha técnica. Linha de cota como marcador de
   seção, carimbo como rodapé, laranja de segurança só no
   estado de gravação e no CTA.
   ========================================================= */

:root{
  --ink:        #16191C;
  --ink-2:      #454C53;
  --ink-3:      #767E86;
  --vellum:     #EBEDE7;
  --sheet:      #F5F6F2;
  --blue:       #24405C;
  --safety:     #F04E23;

  --rule:        rgba(22,25,28,.16);
  --rule-soft:   rgba(22,25,28,.09);
  --rule-strong: rgba(22,25,28,.42);

  --bg: var(--vellum);
  --fg: var(--ink);
  --fg-2: var(--ink-2);
  --fg-3: var(--ink-3);
  --card: var(--sheet);

  --display: "Archivo", "Arial Narrow", Helvetica, sans-serif;
  --body: "Public Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "DM Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  --gutter: clamp(20px, 5vw, 60px);
  --sec: clamp(76px, 10vw, 136px);
  --r: 3px;
}

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

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:var(--body);
  font-size:1.0625rem;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{ max-width:100%; display:block; }
p{ margin:0 0 1em; }
p:last-child{ margin-bottom:0; }
ul,ol{ margin:0; padding:0; list-style:none; }

a{ color:inherit; }

:focus-visible{
  outline:2px solid var(--safety);
  outline-offset:3px;
  border-radius:2px;
}

.skip{
  position:absolute; left:-999px; top:0; z-index:100;
  background:var(--ink); color:var(--vellum);
  padding:12px 18px; font-family:var(--mono); font-size:.8rem;
}
.skip:focus{ left:12px; top:12px; }

/* ---------- estrutura ---------- */

.wrap{
  width:100%;
  max-width:1240px;
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.section{
  position:relative;
  padding-block:var(--sec);
  scroll-margin-top:78px;
}

/* a moldura da prancha atravessa todas as seções */
@media (min-width:1000px){
  .wrap{ border-inline:1px solid var(--rule); }
}

.section--dark{
  --bg: var(--ink);
  --fg: #E9EBE5;
  --fg-2: rgba(233,235,229,.72);
  --fg-3: rgba(233,235,229,.5);
  --card: #1D2125;
  --rule: rgba(233,235,229,.2);
  --rule-soft: rgba(233,235,229,.11);
  --rule-strong: rgba(233,235,229,.46);
  background:var(--bg);
  color:var(--fg);
}

/* ---------- tipografia ---------- */

.h2, .h3, .h4, .hero__title, .end__title, .plan__name{
  font-family:var(--display);
  font-variation-settings:"wdth" 112;
  font-weight:700;
  letter-spacing:-.022em;
  line-height:1.03;
  margin:0;
  text-wrap:balance;
}

.h2{ font-size:clamp(1.95rem,4vw,3.15rem); }
.h2--lead{ margin-bottom:clamp(32px,4vw,52px); max-width:19ch; }
.h3{ font-size:clamp(1.3rem,2vw,1.6rem); letter-spacing:-.018em; }
.h4{ font-size:1.09rem; font-variation-settings:"wdth" 105; letter-spacing:-.01em; line-height:1.2; }

.lead{
  font-size:clamp(1.08rem,1.5vw,1.28rem);
  line-height:1.5;
  color:var(--fg-2);
  text-wrap:pretty;
}

.eyebrow, .marker__num, .marker__label, .micro, .step__num,
.compare__lbl, .block__k, .note, .capture__bar, .capture__turn-lbl,
.capture__clause, .capture__foot, .plan__who{
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.13em;
  text-transform:uppercase;
}

/* ---------- nav ---------- */

.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(235,237,231,.94);
  backdrop-filter:blur(12px) saturate(1.4);
  -webkit-backdrop-filter:blur(12px) saturate(1.4);
  border-bottom:1px solid var(--rule);
}
.nav__in{
  display:flex; align-items:center; gap:24px;
  height:64px;
  border-inline:0;
}
@media (min-width:1000px){ .nav__in{ border-inline:1px solid var(--rule); } }

.brand{
  display:flex; align-items:center; gap:9px;
  text-decoration:none;
  font-family:var(--display);
  font-variation-settings:"wdth" 116;
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin-right:auto;
}
.brand__dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--safety);
  box-shadow:0 0 0 3px rgba(240,78,35,.18);
}

.nav__links{ display:none; gap:26px; }
.nav__links a{
  text-decoration:none;
  font-size:.9rem;
  color:var(--ink-2);
  padding-block:4px;
  border-bottom:1px solid transparent;
  transition:color .18s, border-color .18s;
}
.nav__links a:hover{ color:var(--ink); border-bottom-color:var(--ink); }

.nav__act{ display:flex; align-items:center; gap:16px; }
.nav__signin{
  display:none;
  text-decoration:none; font-size:.9rem; color:var(--ink-2);
}
.nav__signin:hover{ color:var(--ink); }

@media (min-width:900px){
  .nav__links{ display:flex; }
  .nav__signin{ display:inline; }
}

/* ---------- botões ---------- */

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  padding:14px 26px;
  border:1px solid transparent;
  border-radius:var(--r);
  font-family:var(--body);
  font-weight:600;
  font-size:.96rem;
  line-height:1;
  text-decoration:none;
  cursor:pointer;
  transition:transform .16s ease, background-color .18s, border-color .18s, color .18s;
}
.btn--sm{ padding:10px 17px; font-size:.87rem; }
.btn--full{ width:100%; }

.btn--primary{
  background:var(--safety);
  color:#170B06;
  border-color:var(--safety);
}
.btn--primary:hover{ background:#FF6236; border-color:#FF6236; transform:translateY(-1px); }

.btn--ghost{
  background:transparent;
  color:var(--fg);
  border-color:var(--rule-strong);
}
.btn--ghost:hover{ border-color:var(--fg); transform:translateY(-1px); }

.btn-row{ display:flex; flex-wrap:wrap; gap:12px; }
@media (max-width:479px){
  .btn-row{ display:grid; gap:10px; width:100%; }
}

/* ---------- marcador de seção (linha de cota) ---------- */

.marker{
  display:flex; align-items:center; gap:14px;
  margin-bottom:clamp(28px,4vw,48px);
  color:var(--fg-3);
}
.marker__num{ color:var(--fg); font-weight:500; }
.marker__rule{
  flex:1; height:1px; background:var(--rule-strong);
  position:relative; max-width:min(38vw,320px);
}
.marker__rule::before,
.marker__rule::after{
  content:""; position:absolute; top:-4px;
  width:1px; height:9px; background:var(--rule-strong);
}
.marker__rule::before{ left:0; }
.marker__rule::after{ right:0; }

/* ---------- hero ---------- */

.hero{ padding-top:clamp(48px,7vw,86px); overflow:hidden; }
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(22,25,28,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(22,25,28,.05) 1px, transparent 1px);
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(115% 85% at 50% 18%, #000 18%, transparent 72%);
  mask-image:radial-gradient(115% 85% at 50% 18%, #000 18%, transparent 72%);
}
@media (min-width:1040px){
  .hero::before{
    -webkit-mask-image:radial-gradient(115% 85% at 76% 14%, #000 12%, transparent 72%);
    mask-image:radial-gradient(115% 85% at 76% 14%, #000 12%, transparent 72%);
  }
}
.hero__in{
  position:relative;
  display:grid;
  gap:clamp(36px,6vw,72px);
  align-items:start;
  min-width:0;
}
@media (min-width:1040px){
  .hero__in{ grid-template-columns:1.05fr .95fr; gap:clamp(40px,4vw,64px); align-items:center; }
}

.hero__copy{
  min-width:0;
  max-width:100%;
}
@media (max-width:1039px){
  .hero{
    padding-top:clamp(36px,8vw,56px);
    padding-bottom:clamp(40px,8vw,64px);
  }
  .hero__copy{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  .hero__copy .eyebrow{ justify-content:center; }
  .hero__title{
    max-width:14ch;
    margin-inline:auto;
  }
  .hero__copy .lead{
    max-width:34ch;
    margin-inline:auto;
  }
  .hero__copy .btn-row{
    width:100%;
    max-width:320px;
    margin-inline:auto;
  }
  .hero__copy .micro{
    max-width:34ch;
    margin-inline:auto;
    text-wrap:balance;
  }
}

.eyebrow{
  display:flex; align-items:center; gap:10px;
  color:var(--ink-2);
  margin:0 0 22px;
}
.eyebrow__tick{
  width:26px; height:1px; background:var(--safety);
  position:relative; flex:none;
}
.eyebrow__tick::after{
  content:""; position:absolute; right:0; top:-3px;
  width:1px; height:7px; background:var(--safety);
}

.hero__title{
  font-size:clamp(2.2rem,6.4vw,4.05rem);
  line-height:1;
  letter-spacing:-.034em;
  font-variation-settings:"wdth" 108;
  margin-bottom:26px;
  max-width:15ch;
}
.hero__title-em{ color:var(--ink-2); font-weight:600; }

.hero__copy .lead{ max-width:44ch; margin-bottom:32px; }

.micro{
  margin:22px 0 0;
  color:var(--ink-3);
  letter-spacing:.09em;
  line-height:1.9;
  max-width:100%;
  overflow-wrap:anywhere;
}
.micro i{ color:var(--rule-strong); font-style:normal; margin-inline:2px; }

/* ---------- painel de captura (assinatura) ---------- */

.capture{
  margin:0;
  min-width:0;
  max-width:100%;
  background:var(--sheet);
  border:1px solid var(--rule-strong);
  border-radius:var(--r);
  padding:clamp(18px,2.4vw,26px);
  box-shadow:6px 7px 0 -1px rgba(22,25,28,.055);
}
@media (min-width:700px){
  .capture{ box-shadow:14px 16px 0 -1px rgba(22,25,28,.055); }
}

.capture__bar{
  display:flex; align-items:center; gap:12px;
  padding-bottom:14px;
  border-bottom:1px solid var(--rule);
  color:var(--ink-3);
}
.rec{ display:flex; align-items:center; gap:7px; color:var(--safety); flex:none; }
.rec i{
  width:7px; height:7px; border-radius:50%; background:var(--safety);
  animation:blip 1.4s ease-in-out infinite;
}
@keyframes blip{ 0%,100%{opacity:1} 50%{opacity:.25} }

.capture__room{
  flex:1; min-width:0;
  color:var(--ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.capture__time{ flex:none; font-variant-numeric:tabular-nums; }

.wave{
  display:flex; align-items:center; gap:2px;
  height:56px;
  margin:18px 0 16px;
}
.wave i{
  flex:1;
  min-width:2px;
  height:100%;
  background:var(--blue);
  opacity:.62;
  border-radius:1px;
  transform:scaleY(.06);
  transform-origin:center;
  transition:transform .1s linear;
}

.capture__said{
  font-family:var(--mono);
  font-size:.86rem;
  line-height:1.65;
  letter-spacing:-.005em;
  color:var(--ink);
  min-height:5.4em;
  margin:0;
  text-transform:none;
}
.capture__said::before{ content:"\201C"; color:var(--ink-3); }
.capture__said::after{ content:"\201D"; color:var(--ink-3); }
.capture__said .cursor{
  display:inline-block; width:7px; height:1em; margin-left:2px;
  background:var(--safety); vertical-align:-.14em;
  animation:blip 1s steps(1) infinite;
}

.capture__turn{
  display:flex; align-items:center; gap:12px;
  margin:20px 0 18px;
}
.capture__turn-rule{ flex:1; height:1px; background:var(--rule); }
.capture__turn-lbl{ color:var(--ink-3); flex:none; }

.capture__out{
  display:flex; gap:14px;
  background:#FFF; border:1px solid var(--rule-soft);
  border-left:2px solid var(--blue);
  border-radius:2px;
  padding:16px 18px;
  min-height:8.4em;
}
.capture__clause{
  flex:none; color:var(--blue); font-weight:500; padding-top:.18em;
}
.capture__out p{
  margin:0; font-size:.93rem; line-height:1.58; color:var(--ink);
}

.capture__foot{
  display:flex; gap:16px;
  margin-top:14px;
  color:var(--ink-3);
}
.capture__foot span{ display:flex; align-items:center; gap:7px; }
.capture__foot span::before{
  content:""; width:5px; height:5px; background:var(--ink-3); flex:none;
}

/* ---------- problema ---------- */

.split{ display:grid; gap:clamp(28px,4vw,56px); }
@media (min-width:900px){ .split{ grid-template-columns:1fr 1.15fr; } }
.split__a .h2{ max-width:12ch; }
.split__b p{ color:var(--fg-2); }
.split__b .lead{ color:var(--fg); margin-bottom:18px; }

.pain{ margin-top:34px; border-top:1px solid var(--rule); }
.pain li{
  display:flex; align-items:flex-start; gap:14px;
  padding:15px 0;
  border-bottom:1px solid var(--rule);
  color:var(--fg-2);
  font-size:1rem;
}
.pain li::before{
  content:"\00D7";
  font-family:var(--mono); font-size:.95rem; line-height:1.5;
  color:var(--safety); flex:none;
}

/* ---------- solução ---------- */

.manifesto{ display:grid; gap:clamp(28px,4vw,56px); }
@media (min-width:900px){ .manifesto{ grid-template-columns:1.1fr 1fr; align-items:end; } }
.manifesto .h2{ max-width:16ch; }

.flow-words{ display:block; color:var(--blue); font-variation-settings:"wdth" 100; }
.flow-words i{ font-style:normal; color:var(--ink-3); margin-inline:.06em; }

.manifesto__body .lead{ margin-bottom:20px; }
.stress{
  font-family:var(--display);
  font-variation-settings:"wdth" 104;
  font-weight:600;
  font-size:clamp(1.15rem,1.7vw,1.4rem);
  line-height:1.28;
  letter-spacing:-.018em;
  border-top:1px solid var(--rule-strong);
  padding-top:20px;
}

/* solução e "como funciona" são um movimento só: encosta as duas */
#solucao{ padding-bottom:clamp(46px,5.5vw,74px); }
#como-funciona{ padding-top:clamp(46px,5.5vw,74px); }

/* ---------- passos ---------- */

.steps{
  display:grid; gap:0;
  border-top:1px solid var(--rule-strong);
}
@media (min-width:860px){
  .steps{ grid-template-columns:repeat(3,1fr); }
}
.step{
  position:relative;
  padding:30px 0 34px;
  border-bottom:1px solid var(--rule);
}
@media (min-width:860px){
  .step{ padding:34px 34px 8px 26px; border-bottom:0; border-left:1px solid var(--rule); }
  .step:first-child{ border-left:0; padding-left:0; }
}
/* a estação na linha de cota */
.step::before{
  content:""; position:absolute; top:-4px; left:0;
  width:7px; height:7px; background:var(--vellum);
  border:1px solid var(--ink); border-radius:50%;
}
@media (min-width:860px){
  .step:not(:first-child)::before{ left:-4px; }
}
.step__num{ display:block; color:var(--ink-3); margin-bottom:14px; }
.step .h3{ margin-bottom:12px; }
.step p{ color:var(--ink-2); max-width:34ch; }

/* ---------- prints mobile do app ---------- */

.section--shots{
  background:
    linear-gradient(180deg, rgba(22,25,28,.03), transparent 42%),
    var(--bg);
  overflow:hidden;
}
.shots__lead{
  max-width:48ch;
  margin:-clamp(12px,2vw,24px) 0 clamp(36px,5vw,56px);
}

.phones{
  display:flex;
  gap:clamp(18px,3vw,28px);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding:8px 2px 28px;
  margin-inline:calc(var(--gutter) * -1);
  padding-inline:var(--gutter);
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}

.phone{
  flex:0 0 min(62vw, 230px);
  max-width:230px;
  margin:0;
  scroll-snap-align:center;
}
@media (min-width:1100px){
  .phones{
    display:flex;
    justify-content:center;
    gap:22px;
    overflow:visible;
    margin-inline:0;
    padding-inline:0;
    scroll-snap-type:none;
  }
  .phone{
    flex:0 0 210px;
    width:210px;
    max-width:210px;
  }
}

.phone__bezel{
  position:relative;
  background:var(--ink);
  border-radius:28px;
  padding:12px 10px 14px;
  aspect-ratio:390 / 844;
  box-shadow:
    0 0 0 1px rgba(22,25,28,.55),
    0 22px 44px -24px rgba(22,25,28,.58);
  transform:translateY(0);
  transition:transform .35s cubic-bezier(.2,.6,.25,1);
  overflow:hidden;
}
.phone__bezel::before{
  content:"";
  position:absolute;
  z-index:2;
  top:10px; left:50%;
  width:68px; height:5px;
  margin-left:-34px;
  border-radius:99px;
  background:rgba(233,235,229,.2);
  pointer-events:none;
}
.phone:hover .phone__bezel{ transform:translateY(-6px); }

.phone__bezel img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  border-radius:20px;
  background:var(--sheet);
}

.phone figcaption{
  display:flex; align-items:center; gap:10px;
  margin-top:14px;
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-2);
}
.phone__tag{ color:var(--ink); font-weight:500; }

.phone:nth-child(1) .phone__bezel{ animation:phone-in .7s cubic-bezier(.2,.6,.25,1) both; }
.phone:nth-child(2) .phone__bezel{ animation:phone-in .7s .08s cubic-bezier(.2,.6,.25,1) both; }
.phone:nth-child(3) .phone__bezel{ animation:phone-in .7s .16s cubic-bezier(.2,.6,.25,1) both; }
.phone:nth-child(4) .phone__bezel{ animation:phone-in .7s .24s cubic-bezier(.2,.6,.25,1) both; }

@keyframes phone-in{
  from{ opacity:0; transform:translateY(18px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ---------- recursos ---------- */

.feats{
  display:grid; gap:1px;
  background:var(--rule);
  border:1px solid var(--rule);
  border-radius:var(--r);
  overflow:hidden;
}
@media (min-width:600px){ .feats{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .feats{ grid-template-columns:repeat(4,1fr); } }

.feat{
  background:var(--sheet);
  padding:26px 24px 30px;
  transition:background-color .2s;
}
.feat:hover{ background:#FFF; }
.feat .h4{ margin-bottom:11px; }
.feat p{ color:var(--ink-2); font-size:.95rem; line-height:1.55; }

.feat--mark{
  background:var(--ink);
  color:#E9EBE5;
  position:relative;
}
.feat--mark::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(45deg, rgba(233,235,229,.05) 0 1px, transparent 1px 8px);
}
.feat--mark:hover{ background:#1E2226; }
.feat--mark p{ color:rgba(233,235,229,.72); }

/* ---------- para quem é ---------- */

.who{ border-top:1px solid var(--rule-strong); }
.who li{
  display:flex; align-items:baseline; gap:18px;
  padding:22px 0;
  border-bottom:1px solid var(--rule);
  font-family:var(--display);
  font-variation-settings:"wdth" 104;
  font-weight:500;
  font-size:clamp(1.05rem,1.9vw,1.45rem);
  letter-spacing:-.015em;
  line-height:1.25;
  text-wrap:pretty;
}
.who li::before{
  content:""; width:22px; height:1px; background:var(--safety); flex:none;
  transform:translateY(-.4em);
}

/* ---------- comparação ---------- */

.compare{ border-top:1px solid var(--rule-strong); position:relative; }
.compare__head{ display:none; }
@media (min-width:760px){
  .compare__head{ display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:14px 0; }
  /* eixo que separa o antes do depois */
  .compare::after{
    content:""; position:absolute; top:0; bottom:0; left:50%;
    width:1px; background:var(--rule); pointer-events:none;
  }
}
.compare__lbl{ color:var(--fg-3); }
.compare__lbl--was{ color:var(--fg-3); }

.compare__row{
  display:grid; gap:8px;
  padding:20px 0;
  border-top:1px solid var(--rule);
}
@media (min-width:760px){
  .compare__row{ grid-template-columns:1fr 1fr; gap:36px; align-items:center; }
}
.was{
  margin:0; color:var(--fg-3);
  display:flex; align-items:baseline; gap:12px;
}
.was::before{
  content:"\00D7"; font-family:var(--mono); font-size:.85rem; flex:none;
}
.now{
  margin:0; color:var(--fg); font-weight:500;
  display:flex; align-items:baseline; gap:12px;
}
.now::before{
  content:"\2192"; font-family:var(--mono); font-size:.85rem; color:var(--safety); flex:none;
}

.value{
  margin:clamp(40px,5vw,64px) 0 0;
  font-family:var(--display);
  font-variation-settings:"wdth" 108;
  font-weight:600;
  font-size:clamp(1.4rem,3vw,2.3rem);
  line-height:1.14;
  letter-spacing:-.028em;
  max-width:22ch;
  text-wrap:balance;
}

/* ---------- depoimentos ---------- */

.quotes{ display:grid; gap:1px; background:var(--rule); border-block:1px solid var(--rule); }
@media (min-width:800px){ .quotes{ grid-template-columns:1fr 1fr; } }

.quote{ margin:0; background:var(--vellum); padding:clamp(26px,3vw,38px) clamp(24px,3vw,34px); }
.quote blockquote{
  margin:0 0 22px;
  font-family:var(--display);
  font-variation-settings:"wdth" 104;
  font-weight:500;
  font-size:clamp(1.15rem,2.1vw,1.55rem);
  line-height:1.25;
  letter-spacing:-.02em;
  text-wrap:pretty;
}
.quote blockquote::before{ content:"\201C"; }
.quote blockquote::after{ content:"\201D"; }
.quote figcaption{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:10px;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
}
.quote figcaption span{ color:var(--ink-3); }

/* ---------- planos ---------- */

.billing-toggle{
  display:inline-flex;
  gap:2px;
  margin:0 0 clamp(22px,3vw,32px);
  padding:3px;
  border:1px solid var(--rule-strong);
  border-radius:999px;
  background:var(--sheet);
}
.billing-toggle__btn{
  appearance:none; border:0; background:transparent; cursor:pointer;
  font-family:var(--mono); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-3);
  padding:10px 16px;
  border-radius:999px;
  transition:background .18s, color .18s;
}
.billing-toggle__btn.is-active{
  background:var(--ink); color:#E9EBE5;
}
.billing-toggle__btn:focus-visible{
  outline:2px solid var(--blue); outline-offset:2px;
}

.plans{
  display:grid; gap:1px;
  background:var(--rule);
  border:1px solid var(--rule);
  border-radius:var(--r);
  overflow:hidden;
}
@media (min-width:720px){ .plans{ grid-template-columns:repeat(2,1fr); } }

.plan{
  background:var(--sheet);
  padding:clamp(26px,3vw,34px) clamp(22px,2.4vw,30px) clamp(28px,3vw,34px);
  display:flex; flex-direction:column;
}
.plan__name{ font-size:clamp(1.5rem,2.4vw,1.95rem); font-variation-settings:"wdth" 116; }
.plan__who{ color:var(--ink-3); margin:10px 0 18px; }

.plan__price{
  display:flex; align-items:baseline; gap:.35rem;
  margin:0 0 6px;
  font-family:var(--display);
  font-variation-settings:"wdth" 112;
  letter-spacing:-.02em;
}
.plan__price[hidden],
.plan__alt[hidden]{ display:none !important; }
.plan__amount{ font-size:clamp(2rem,3.2vw,2.55rem); font-weight:700; line-height:1; }
.plan__period{ color:var(--ink-3); font-size:.95rem; }
.plan__alt{
  margin:0 0 22px;
  color:var(--ink-3);
  font-size:.9rem;
  letter-spacing:.01em;
}

.plan__list{ margin-bottom:30px; flex:1; }
.plan__list li{
  display:flex; align-items:baseline; gap:11px;
  padding:9px 0;
  border-bottom:1px solid var(--rule-soft);
  font-size:.95rem;
}
.plan__list li::before{
  content:""; width:6px; height:1px; background:var(--ink-3); flex:none;
  transform:translateY(-.35em);
}
.plan__list i{ font-style:normal; color:var(--safety); }

.plan--mark{
  background:var(--ink);
  color:#E9EBE5;
}
.plan--mark .plan__who,
.plan--mark .plan__period,
.plan--mark .plan__alt{ color:rgba(233,235,229,.55); }
.plan--mark .plan__list li{ border-bottom-color:rgba(233,235,229,.13); }
.plan--mark .plan__list li::before{ background:rgba(233,235,229,.5); }

.note{ margin:24px 0 0; color:var(--ink-3); letter-spacing:.06em; }
.note i{ font-style:normal; color:var(--safety); }

/* ---------- faq ---------- */

.faq{ border-top:1px solid var(--rule-strong); max-width:900px; }

.qa{ border-bottom:1px solid var(--rule); }
.qa summary{
  display:flex; align-items:center; gap:20px;
  padding:22px 0;
  cursor:pointer;
  list-style:none;
  font-family:var(--display);
  font-variation-settings:"wdth" 104;
  font-weight:600;
  font-size:clamp(1.02rem,1.6vw,1.22rem);
  letter-spacing:-.016em;
  transition:color .18s;
}
.qa summary::-webkit-details-marker{ display:none; }
.qa summary span{ flex:1; }
.qa summary::after{
  content:"+";
  font-family:var(--mono); font-weight:400; font-size:1.2rem;
  color:var(--ink-3); flex:none; line-height:1;
  transition:transform .22s ease, color .18s;
}
.qa[open] summary::after{ transform:rotate(45deg); color:var(--safety); }
.qa summary:hover{ color:var(--blue); }
.qa p{
  margin:0; padding:0 0 26px;
  max-width:62ch; color:var(--ink-2);
}

/* ---------- cta final ---------- */

.section--cta{ padding-block:clamp(84px,11vw,150px); }
.end{ text-align:center; display:flex; flex-direction:column; align-items:center; }
.end__title{
  font-size:clamp(2.1rem,5.4vw,4.1rem);
  line-height:1;
  letter-spacing:-.034em;
  font-variation-settings:"wdth" 110;
  max-width:17ch;
  margin-bottom:24px;
}
.end .lead{ max-width:46ch; margin-bottom:34px; }

/* ---------- rodapé / carimbo ---------- */

.foot{
  background:var(--vellum);
  border-top:1px solid var(--rule-strong);
  padding-block:clamp(36px,5vw,56px);
}

.block{
  display:grid;
  border:1px solid var(--rule-strong);
  border-radius:var(--r);
  overflow:hidden;
  background:var(--rule);
  gap:1px;
}
@media (min-width:640px){ .block{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:980px){ .block{ grid-template-columns:1.6fr 1fr 1fr .8fr .5fr; } }

.block__cell{
  background:var(--vellum);
  padding:18px 20px 20px;
  display:flex; flex-direction:column; gap:7px;
  min-height:104px;
}
.block__k{ color:var(--ink-3); }
.block__v{ font-size:.95rem; font-weight:500; line-height:1.3; }
.block__v--big{
  font-family:var(--display);
  font-variation-settings:"wdth" 116;
  font-weight:700;
  font-size:1.35rem;
  letter-spacing:-.02em;
  text-transform:uppercase;
}
.block__sub{ color:var(--ink-2); font-size:.9rem; line-height:1.4; }

.foot__end{
  display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px;
  margin-top:24px;
}
.foot__links{ display:flex; flex-wrap:wrap; gap:8px 24px; margin-right:auto; }
.foot__links a{
  font-size:.92rem; text-decoration:none; color:var(--ink-2);
  border-bottom:1px solid var(--rule); padding-bottom:2px;
  transition:color .18s, border-color .18s;
}
.foot__links a:hover{ color:var(--ink); border-bottom-color:var(--ink); }
.foot__cr{ margin:0; font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; color:var(--ink-3); }

/* ---------- reveal ---------- */

.reveal{ opacity:0; transform:translateY(12px); }
.reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .62s cubic-bezier(.2,.6,.25,1), transform .62s cubic-bezier(.2,.6,.25,1);
}

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