/* ============ TOKENS ============ */
:root{
  color-scheme:dark;
  /* HighEnd brand */
  --major-1:#D9C8B7;
  --major-2:#0F172A;
  --night-1:#2B2D3D;
  --night-2:#222433;
  --night-3:#191B29;
  --night-4:#12131F;
  --night-5:#0A0C14;
  --cloud-3:#C1C4D6;
  --cloud-5:#8E92AD;
  --gold-1:#F3E690;
  --gold-2:#FFC30F;
  --gold-3:#CC9900;
  --gold-4:#977A26;
  --copper-1:#FC7148;
  --osmium-3:#1796D4;
  --osmium-5:#08344A;
  --eletrum-3:#58D417;

  --bg:#0A0C14;
  --bg-soft:#12131F;
  --bg-card:#16182A;
  --rule:rgba(217,200,183,.14);
  --rule-strong:rgba(217,200,183,.32);

  --font-display:'Funnel Display','Times New Roman',serif;
  --font-body:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;

  --container:min(1280px, 100% - 32px);
  --gutter:clamp(20px,4vw,48px);

  /* Spacing scale */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
  --space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;
  --space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
  --space-32:128px;

  /* Easing */
  --ease-out:cubic-bezier(.2,.7,.1,1);
  --ease-inout:cubic-bezier(.4,0,.2,1);

  /* Durations */
  --dur-fast:150ms;
  --dur-base:250ms;
  --dur-slow:400ms;
  --dur-reveal:600ms;

  /* Z-index */
  --z-nav:50;
  --z-float-cta:60;
  --z-modal:200;

  /* Focus */
  --focus-ring:2px solid var(--gold-2);
  --focus-offset:2px;
}

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion:reduce){
  :root{
    --dur-fast:0ms;--dur-base:0ms;--dur-slow:0ms;--dur-reveal:0ms;
  }
  .ticker-track{animation:none !important}
  .reveal{opacity:1 !important;transform:none !important}
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

/* Global focus-visible */
:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset);border-radius:inherit}

/* Skip link */
.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}
.sr-only-focusable:focus{position:static;width:auto;height:auto;padding:8px 16px;margin:0;overflow:visible;clip:auto;white-space:normal;background:var(--gold-2);color:var(--night-5);font-weight:600;z-index:999}

body{
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.55;
  color:var(--major-1);
  background:var(--bg);
  background-image:
    radial-gradient(1200px 700px at 80% -10%, rgba(151,122,38,.08), transparent 60%),
    radial-gradient(900px 600px at -10% 30%, rgba(8,52,74,.18), transparent 60%);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Grain layer */
body::before{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  z-index:1;
  opacity:.55;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.85 0 0 0 0 0.78 0 0 0 0 0.72 0 0 0 0.5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.35'/></svg>");
}

::selection{background:var(--gold-2);color:var(--night-5)}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

h1,h2,h3,h4,h5{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.02em;
  line-height:1.05;
  color:var(--major-1);
}
h1{font-weight:500}

/* ============ Layout primitives ============ */
.wrap{width:var(--container);margin-inline:auto;position:relative;z-index:2}
.section{padding:clamp(48px,9vw,144px) 0;position:relative;z-index:2}
.section + .section{border-top:1px solid var(--rule)}

.eyebrow{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--cloud-5);
  display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:none}

.rule{height:1px;background:var(--rule);width:100%}

/* ============ NAV ============ */
.nav{
  position:sticky;top:0;z-index:50;
  overflow:visible;
  background:rgba(10,12,20,.72);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--rule);
}
.nav-inner{
  width:var(--container);margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;gap:24px;
  overflow:visible;
}
.brand{
  display:flex;align-items:center;
}
.brand svg{
  height:28px;width:auto;display:block;
  transition:opacity var(--dur-base) var(--ease-out);
}
.brand:hover svg{opacity:.8}
.nav-links{display:flex;gap:28px;font-size:14px;color:var(--cloud-3)}
.nav-links a{position:relative;padding:6px 0}
.nav-links a:hover{color:var(--major-1)}
.nav-cta{font-size:13px;letter-spacing:.04em}

.nav-menu{
  position:relative;
  display:none;
  align-items:center;
}

.nav-toggle{
  width:44px;height:44px;
  border:1px solid var(--rule-strong);
  border-radius:4px;
  background:transparent;
  color:var(--major-1);
  cursor:pointer;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0;
  transition:border-color var(--dur-base), background var(--dur-base);
}
.nav-toggle:hover{border-color:var(--gold-2);background:rgba(255,195,15,.04)}
.nav-toggle-bar{
  display:block;width:18px;height:1.5px;
  background:currentColor;border-radius:1px;
  transition:transform .25s var(--ease-out), opacity .25s var(--ease-out);
}
.nav.is-open .nav-toggle-bar:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav.is-open .nav-toggle-bar:nth-child(2){opacity:0}
.nav.is-open .nav-toggle-bar:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.nav-backdrop{
  position:fixed;inset:0;z-index:49;
  background:transparent;
  opacity:0;
  transition:opacity .2s var(--ease-out);
  pointer-events:none;
}
.nav-backdrop.is-visible{
  opacity:1;
  pointer-events:auto;
}

.nav-drawer{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:51;
  width:max-content;
  min-width:220px;
  max-width:min(280px, calc(100vw - 32px));
  padding:10px;
  display:flex;flex-direction:column;gap:8px;
  background:var(--night-4);
  border:1px solid var(--rule-strong);
  border-radius:8px;
  box-shadow:0 18px 40px rgba(0,0,0,.42);
  transform:translateY(-6px) scale(.98);
  opacity:0;
  pointer-events:none;
  transition:opacity .22s var(--ease-out), transform .22s var(--ease-out);
  overflow:visible;
}
.nav.is-open .nav-drawer{
  transform:translateY(0) scale(1);
  opacity:1;
  pointer-events:auto;
}

.nav-drawer-links{
  display:flex;flex-direction:column;gap:0;
}
.nav-drawer-links a{
  padding:10px 12px;
  font-size:14px;
  line-height:1.35;
  color:var(--cloud-3);
  border-radius:4px;
  white-space:nowrap;
  transition:color var(--dur-base), background var(--dur-base);
}
.nav-drawer-links a:hover,
.nav-drawer-links a[aria-current="page"]{
  color:var(--major-1);
  background:rgba(255,195,15,.05);
}

.nav-drawer-cta{
  width:100%;
  justify-content:center;
  padding:12px 14px;
  font-size:12px;
  letter-spacing:.02em;
  white-space:normal;
  text-align:center;
  line-height:1.35;
}

@media (max-width:820px){
  .nav-links a[href="#diferenca"],
  .nav-drawer-links a[href="#diferenca"]{display:none}
  .nav-links{display:none}
  .nav-menu{display:none}
  .nav-inner{
    justify-content:space-between;
    padding-block:14px;
    min-height:72px;
  }
  .brand svg{height:24px}
  .brand{
    transform:translateX(calc(50vw - 59px));
    transition:transform .5s cubic-bezier(.4,0,.2,1);
  }
  .nav-inner .nav-cta{
    display:inline-flex;
    font-size:12px;
    padding:10px 14px;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transform:translateX(10px);
    transition:opacity .4s ease .25s, transform .4s ease .25s;
  }
  .nav.nav--show-cta .brand{
    transform:translateX(0);
  }
  .nav.nav--show-cta .nav-cta{
    opacity:1;
    pointer-events:auto;
    transform:translateX(0);
    animation:nav-cta-pulse 3s ease-in-out .7s infinite;
  }
}
@keyframes nav-cta-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,195,15,0)}
  60%{box-shadow:0 0 0 8px rgba(255,195,15,.18)}
}

/* ============ Buttons ============ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;
  font-family:var(--font-body);
  font-size:14px;font-weight:600;letter-spacing:.02em;
  border-radius:2px;
  transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
  cursor:pointer;white-space:nowrap;
}
.btn-primary{
  background:var(--gold-2);color:var(--night-5);
  box-shadow:0 1px 0 0 rgba(255,255,255,.18) inset, 0 12px 30px -12px rgba(255,195,15,.45);
}
.btn-primary:hover{background:var(--gold-1);transform:translateY(-1px)}
.btn-ghost{
  border:1px solid var(--rule-strong);color:var(--major-1);
  background:transparent;
}
.btn-ghost:hover{border-color:var(--major-1)}
.btn .arrow{display:inline-block;transition:transform .25s}
.btn:hover .arrow{transform:translateX(3px)}

/* ============ HERO ============ */
.hero{
  padding:clamp(56px,7vw,96px) 0 clamp(80px,10vw,140px);
  position:relative;z-index:2;
}
@media (min-width:821px){
  .hero{
    min-height:calc(100dvh - 64px);
    min-height:calc(100svh - 64px);
    display:flex;align-items:center;justify-content:center;
    padding-block:clamp(40px,5vw,72px);
  }
  .hero .wrap.hero-center{width:100%}
}
.hero-center{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
}
.hero-h1{
  font-size:clamp(48px,6.4vw,88px);
  font-weight:400;
  line-height:.96;
  letter-spacing:-.038em;
  max-width:26ch;
  margin:0 0 36px;
}
.hero-h1 em{
  font-style:italic;font-family:var(--font-display);font-weight:300;
  color:var(--gold-1);
}
.hero-sub{
  color:var(--cloud-3);
  font-size:clamp(16px,1.35vw,19px);
  line-height:1.65;
  max-width:52ch;
  margin-bottom:52px;
}
.hero-cta{
  display:flex;flex-wrap:wrap;gap:14px;justify-content:center;
}

/* Stats sutis */
.hero-stats{
  display:flex;align-items:stretch;gap:0;
  border:1px solid var(--rule);
}
.hero-stat{
  display:flex;align-items:center;gap:18px;
  padding:28px 40px;
}
.hero-stat-div{
  width:1px;background:var(--rule);flex-shrink:0;align-self:stretch;
}
.hero-stat-val{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(28px,3vw,40px);letter-spacing:-.04em;
  color:var(--major-1);line-height:1;white-space:nowrap;
}
.hero-stat-plus, .hero-stat-pct{
  color:var(--gold-2);font-weight:300;
}
.hero-stat-lbl{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cloud-5);line-height:1.6;
  text-align:left;
}

@media (max-width:680px){
  .hero-stats{flex-direction:column;width:100%}
  .hero-stat{width:100%;justify-content:center;padding:22px 28px}
  .hero-stat-div{width:100%;height:1px;align-self:auto}
  .hero-sub br{display:none}
}

/* ============ BIGNUMBERS CROSS ============ */
.bncross{
  position:relative;
  z-index:2;
  background:var(--bg);
  overflow:hidden;
}
@media (min-width:821px){
  .bncross{
    opacity:0;
    transform:translateY(28px);
    transition:opacity .55s var(--ease-out), transform .55s var(--ease-out);
  }
  .bncross.bncross--revealed{
    opacity:1;
    transform:none;
  }
}
@media (min-width:821px) and (prefers-reduced-motion:reduce){
  .bncross{opacity:1;transform:none;transition:none}
}
.bncross-inner{
  position:relative;
  width:var(--container);
  margin-inline:auto;
  display:grid;
  grid-template-columns:1fr 1px 1fr 1px 1fr 1px 1fr;
  align-items:stretch;
  min-height:clamp(180px,20vw,260px);
}

/* Linha horizontal de fundo com degradê */
.bncross-hline{
  display:none;
}

/* Divisores verticais entre células */
.bncross-vline{
  display:none;
}

/* Divisores verticais */
.bncross-div{
  width:1px;
  height:clamp(60px,8vw,100px);
  background:linear-gradient(
    180deg,
    transparent 0%,
    rgba(217,200,183,.25) 30%,
    rgba(217,200,183,.25) 70%,
    transparent 100%
  );
  justify-self:center;
  align-self:center;
}

/* Células */
.bncross-cell{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:clamp(32px,4vw,56px) clamp(16px,2vw,32px);
  text-align:center;
  position:relative;
  z-index:2;
}

/* Valor numérico */
.bnc-val{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:4px;
  line-height:1;
  width:100%;
  min-height:clamp(64px,8vw,112px);
}
.bnc-count{
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(44px,6vw,80px);
  letter-spacing:-.04em;
  color:var(--major-1);
}
.bnc-pre{
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(22px,3vw,40px);
  letter-spacing:-.02em;
  color:var(--major-1);
}
.bnc-unit{
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(22px,3vw,40px);
  letter-spacing:-.02em;
  color:var(--major-1);
}
.bnc-plus{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(28px,3.5vw,52px);
  color:var(--gold-2);
}
.bnc-pct{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(28px,3.5vw,52px);
  color:var(--gold-2);
}
.bnc-label{
  font-family:var(--font-mono);
  font-size:clamp(10px,0.9vw,12px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cloud-5);
  max-width:20ch;
  line-height:1.6;
  width:100%;
  min-height:3.2em;
  margin:0;
}

/* Célula destaque — R$100mi+ */
.bncross-hero .bnc-count{
  font-size:clamp(56px,8vw,108px);
  color:var(--gold-2);
}
.bncross-hero .bnc-pre,
.bncross-hero .bnc-unit{
  font-size:clamp(28px,4vw,56px);
  color:var(--gold-2);
}
.bncross-hero .bnc-plus{
  font-size:clamp(32px,4.5vw,64px);
  color:var(--gold-1);
}
.bncross-hero .bnc-label{
  color:var(--cloud-3);
  letter-spacing:.14em;
}
/* Glow sutil no destaque */
.bncross-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse 60% 60% at 50% 50%, rgba(255,195,15,.06) 0%, transparent 70%);
  pointer-events:none;
}

@media(max-width:640px){
  .bncross-inner{
    grid-template-columns:1fr 1fr 1fr;
    grid-template-rows:auto auto;
    min-height:auto;
    column-gap:0;
    row-gap:0;
  }
  .bncross-div{ display:none }

  /* Hero ocupa toda a largura na primeira linha */
  .bncross-hero{
    grid-column:1 / -1;
    order:-1;
    padding:28px 16px 32px;
    border-bottom:1px solid rgba(217,200,183,.12);
  }

  /* Os 3 demais ficam lado a lado na segunda linha */
  .bncross-cell:not(.bncross-hero){
    padding:24px 8px;
    position:relative;
  }
  .bncross-cell:not(.bncross-hero) + .bncross-cell:not(.bncross-hero)::before{
    content:"";
    position:absolute;
    left:0;top:25%;bottom:25%;
    width:1px;
    background:linear-gradient(
      180deg,
      transparent 0%,
      rgba(217,200,183,.18) 30%,
      rgba(217,200,183,.18) 70%,
      transparent 100%
    );
  }

  /* Hero controlado no mobile */
  .bncross-hero .bnc-count{ font-size:clamp(56px,16vw,80px) }
  .bncross-hero .bnc-pre,
  .bncross-hero .bnc-unit{ font-size:clamp(28px,8vw,40px) }
  .bncross-hero .bnc-plus{ font-size:clamp(32px,9vw,48px) }

  /* Cards de baixo encolhem para caber 3 lado a lado */
  .bncross-cell:not(.bncross-hero) .bnc-count{
    font-size:clamp(22px,7vw,34px);
  }
  .bncross-cell:not(.bncross-hero) .bnc-pre,
  .bncross-cell:not(.bncross-hero) .bnc-unit{
    font-size:clamp(11px,3.2vw,15px);
  }
  .bncross-cell:not(.bncross-hero) .bnc-plus,
  .bncross-cell:not(.bncross-hero) .bnc-pct{
    font-size:clamp(15px,4.5vw,22px);
  }
  .bncross-cell:not(.bncross-hero) .bnc-val{
    min-height:clamp(34px,9vw,44px);
  }
  .bncross-cell:not(.bncross-hero) .bnc-label{
    font-size:9px;
    letter-spacing:.12em;
    max-width:14ch;
    line-height:1.5;
    min-height:3.4em;
  }
}

/* ============ PROVA SOCIAL — MARQUEE ============ */
.social-proof{
  padding:clamp(56px,7vw,96px) 0;
  overflow:hidden;
  position:relative;z-index:2;
}
.social-proof-inner{
  display:grid;
  grid-template-columns:minmax(260px,420px) 1fr;
  gap:clamp(24px,3vw,48px);
  align-items:center;
}
@media(max-width:900px){
  .social-proof-inner{grid-template-columns:1fr}
}
.social-proof-text{
  text-align:center;
}
.social-proof-text h2{
  font-size:clamp(24px,2.8vw,38px);
  font-weight:500;line-height:1.15;margin-bottom:18px;
  margin-inline:auto;
}
.social-proof-text h2 em{
  font-style:italic;font-weight:300;color:var(--gold-1);
}
.social-proof-text p{
  color:var(--cloud-5);font-size:15px;line-height:1.65;
  max-width:42ch;margin-inline:auto;
}
.social-proof-bar{
  margin:26px auto 0;width:40px;height:2px;background:var(--gold-2);
}
@media(max-width:900px){
  .social-proof-text p{max-width:100%}
  .social-proof-bar{display:none}
}

/* Marquee container */
.social-proof-marquees{
  position:relative;
  display:flex;flex-direction:column;gap:12px;
  overflow:hidden;
}
.marquee-fade{
  position:absolute;top:0;bottom:0;width:120px;z-index:10;pointer-events:none;
}
.marquee-fade-left{
  left:0;
  background:linear-gradient(90deg, var(--bg) 0%, transparent 100%);
}
.marquee-fade-right{
  right:0;
  background:linear-gradient(270deg, var(--bg) 0%, transparent 100%);
}
.marquee-row{overflow:hidden}
.marquee-row:hover .marquee-track{animation-play-state:paused}
.marquee-track{
  display:flex;gap:12px;width:max-content;
  animation:mq-left 55s linear infinite;
}
.marquee-track.marquee-right{
  animation:mq-right 62s linear infinite;
}
.marquee-track.marquee-slow{
  animation-duration:80s;
}
@keyframes mq-left{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes mq-right{
  from{transform:translateX(-50%)}
  to{transform:translateX(0)}
}
.mq-card{
  display:inline-flex;align-items:center;justify-content:center;
  padding:0 28px;
  height:56px;
  min-width:140px;
  border:1px solid rgba(217,200,183,.08);
  background:var(--night-2);
  border-radius:10px;
  font-family:var(--font-display);font-weight:500;
  font-size:15px;color:var(--cloud-3);
  white-space:nowrap;
  letter-spacing:.01em;
  transition:background var(--dur-base), color var(--dur-base);
}
.mq-card:hover{
  background:var(--night-1);
  color:var(--major-1);
}
.mq-card--person{
  padding:12px 24px 12px 12px;
  height:auto;gap:16px;
}
.mq-card--person:hover{
  background:var(--night-1);
  border-color:rgba(255,195,15,.25);
}
.mq-avatar{
  width:56px;height:56px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
  border:2px solid rgba(255,195,15,.3);
}
.mq-person-info{
  display:flex;flex-direction:column;gap:4px;
  text-align:left;
}
.mq-person-name{
  font-family:var(--font-display);font-weight:500;
  font-size:17px;color:var(--major-1);letter-spacing:.01em;
  white-space:nowrap;
}
.mq-person-niche{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--cloud-5);
  white-space:nowrap;
}

.mq-card--dim{
  color:var(--cloud-5);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;
  background:transparent;
  border-color:transparent;
  min-width:auto;
}

@media(prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
}

/* ============ MARQUEE / TICKER ============ */
.ticker{
  border-block:1px solid var(--rule);
  background:rgba(15,23,42,.4);
  overflow:hidden;
  position:relative;z-index:2;
}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track{
  display:flex;gap:64px;
  padding:18px 0;
  white-space:nowrap;
  font-family:var(--font-mono);
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cloud-3);
  animation:ticker 50s linear infinite;
  will-change:transform;
}
.ticker-track span{display:inline-flex;align-items:center;gap:18px}
.ticker-track span::after{content:"·";color:var(--gold-3);margin-left:64px}
@keyframes ticker{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ============ BIG NUMBERS ============ */
.bignums{padding:clamp(80px,10vw,140px) 0}
.bignums-head{
  display:flex;align-items:end;justify-content:space-between;
  gap:40px;margin-bottom:64px;flex-wrap:wrap;
}
.bignums-head h2{font-size:clamp(28px,3.4vw,42px);max-width:20ch;line-height:1.08}
.bignums-head p{max-width:42ch;color:var(--cloud-3);font-size:clamp(15px,1.2vw,17px);line-height:1.65}

.nums{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--rule);
}
.num-cell{
  padding:48px 40px;border-right:1px solid var(--rule);
  position:relative;
}
.num-cell:last-child{border-right:0}
.num-cell .v{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(44px,5.4vw,76px);line-height:1;
  letter-spacing:-.04em;color:var(--major-1);
}
.num-cell .v sup{font-size:.45em;vertical-align:super;color:var(--gold-2);margin-right:3px;font-weight:400}
.num-cell .v .plus{color:var(--gold-2);font-weight:300}
.num-cell .l{
  margin-top:20px;font-family:var(--font-mono);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--cloud-5);
  max-width:26ch;line-height:1.6;
}
.num-cell.hero{border-top:2px solid var(--gold-2)}
.num-cell.hero .v{color:var(--gold-2);font-size:clamp(52px,6vw,88px)}
@media (max-width:680px){
  .nums{grid-template-columns:1fr}
  .num-cell{border-right:0;border-bottom:1px solid var(--rule);padding:36px 28px}
  .num-cell:last-child{border-bottom:0}
}

/* ============ LOGO WALL ============ */
.logos{padding:48px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:rgba(15,23,42,.3)}
.logos-head{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--cloud-5);text-align:center;margin-bottom:28px;
}
.logos-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border-top:1px solid var(--rule);border-left:1px solid var(--rule);
}
.logo-cell{
  border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);
  height:88px;display:grid;place-items:center;
  font-family:var(--font-display);font-weight:500;
  color:var(--cloud-3);font-size:15px;letter-spacing:.02em;
  opacity:.78;transition:opacity .3s, color .3s;
  text-align:center;padding:0 12px;
}
.logo-cell:hover{opacity:1;color:var(--major-1)}
.logo-cell.placeholder{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-3);opacity:.6;
}
@media (max-width:560px){.logos-grid{grid-template-columns:repeat(2,1fr)}}

.placeholder-note{
  margin-top:24px;text-align:center;font-family:var(--font-mono);font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-3);opacity:.7;
}

/* ============ SECTION HEADER ============ */
.sec-head{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:16px;
  margin-bottom:64px;
}
.sec-head h2{
  font-size:clamp(32px,4.4vw,56px);
  max-width:none;
}
.sec-head h2 em{font-style:italic;font-weight:300;color:var(--cloud-3)}
.sec-head .lede{
  color:var(--cloud-3);font-size:clamp(16px,1.4vw,18px);
  max-width:52ch;margin-inline:auto;
}
.sec-head .lede strong{color:var(--major-1);font-weight:500}
.sec-head--center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}

/* ============ DEPOIMENTO ÂNCORA ============ */
.anchor-quote{
  position:relative;
  background:rgba(255,195,15,.03);
}
.anchor-quote-line{
  height:1px;
  background:linear-gradient(90deg,
    transparent 0%,
    var(--gold-3) 15%,
    var(--gold-2) 50%,
    var(--gold-3) 85%,
    transparent 100%
  );
}
.anchor-quote-inner{
  padding:clamp(24px,3vw,40px) 0;
  display:flex;flex-direction:column;gap:20px;
  align-items:center;text-align:center;
}
.anchor-quote-text{
  font-family:var(--font-display);font-weight:300;font-style:italic;
  font-size:clamp(18px,2vw,28px);line-height:1.3;letter-spacing:-.01em;
  color:var(--major-1);max-width:52ch;
}
.anchor-quote-attr{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--cloud-5);
}
.anchor-quote-attr-line{
  display:flex;align-items:center;gap:10px;
}
.anchor-quote-name{color:var(--gold-2)}
.anchor-quote-sep{color:var(--gold-3)}

/* ============ FERRAMENTA VS. THE — sticky invertido ============ */
.ftvt-section{padding:0;overflow:visible}
.ftvt-wrap{
  display:grid;
  grid-template-columns:1.6fr 32px .8fr;
  align-items:start;gap:0;
  width:var(--container);margin-inline:auto;
  padding:clamp(64px,8vw,120px) 0;
}
@media(max-width:900px){
  .ftvt-wrap{grid-template-columns:1fr}
}

/* Coluna esquerda — cards de comparação (scroll) */
.ftvt-left{
  display:flex;flex-direction:column;gap:0;
  padding-right:clamp(24px,3vw,48px);
}
@media(max-width:900px){
  .ftvt-left{padding-right:0;order:2}
}

/* Card — linha horizontal compacta, sem caixa */
.ftvt-card{
  position:relative;
  padding:clamp(20px,2.4vw,28px) 0;
  transition:opacity var(--dur-base);
}
.ftvt-card:last-child{padding-bottom:0}
.ftvt-card.active .ftvt-card-num{opacity:1;color:var(--gold-2)}

.ftvt-card-inner{
  display:block;
  margin-bottom:16px;
}

.ftvt-card-num{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;
  color:var(--cloud-5);opacity:.55;padding-top:2px;
  transition:color var(--dur-base), opacity var(--dur-base);
}

.ftvt-card-content{display:flex;flex-direction:column;gap:12px}

.ftvt-card-topic{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--cloud-5);
}

/* Dot na timeline */
.ftvt-dot{
  display:block;position:absolute;
  left:50%;transform:translateX(-50%);
  width:12px;height:12px;border-radius:50%;
  border:2px solid rgba(217,200,183,.25);
  background:var(--bg);z-index:3;
  transition:border-color .3s, background .3s, box-shadow .3s;
}
.ftvt-dot.active{
  border-color:var(--gold-2);background:var(--gold-2);
  animation:dot-pulse 1.8s ease-in-out infinite;
}
@media(max-width:900px){.ftvt-dot{display:none}}

/* Grid ferramenta vs THE — horizontal, compacto */
.ftvt-vs{
  display:grid;
  grid-template-columns:1fr 20px 1fr;
  gap:10px;
  align-items:start;
}
@media(max-width:820px){
  .ftvt-vs{grid-template-columns:1fr;gap:8px}
  .ftvt-vs-arrow{display:none !important}
}
.ftvt-vs-col{display:flex;flex-direction:column;gap:4px}
.ftvt-vs-label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;
}
.ftvt-vs-label.ftvt-brand--utmify{color:#6BA4FF}
.ftvt-vs-label.ftvt-brand--vk{color:#C4A8F0}
.ftvt-vs-label.ftvt-brand--gerenciador{color:var(--cloud-3)}
.ftvt-vs-col--the .ftvt-vs-label{color:var(--gold-2)}

.ftvt-vs-text{
  font-family:var(--font-display);font-style:italic;font-weight:300;
  font-size:clamp(13px,1.2vw,15px);line-height:1.45;
  color:var(--cloud-5);
}
.ftvt-tool--utmify{color:rgba(107,164,255,.9)}
.ftvt-tool--vk{color:rgba(196,168,240,.9)}
.ftvt-tool--gerenciador{color:var(--cloud-3)}
.ftvt-vs-text--the{
  font-style:normal;font-weight:500;
  color:var(--major-1);
}
.ftvt-vs-arrow{
  font-size:13px;color:var(--gold-3);
  text-align:center;padding-top:18px;
  opacity:.7;
}

/* Identidade das marcas */
.ftvt-brand--utmify{color:#005AE3}
.ftvt-brand--vk{color:#A37ED9}
.ftvt-brand--gerenciador{color:var(--cloud-5)}

/* Dashboard — compacto, sem aspect-ratio forçado grande */
.ftvt-dash{
  position:relative;
  overflow:hidden;
  border-radius:3px;
  background:var(--night-4);
  border:1px solid rgba(217,200,183,.08);
}
.ftvt-dash img{
  width:100%;display:block;
  opacity:.92;
  transition:opacity var(--dur-base);
}
.ftvt-dash--expandable{cursor:zoom-in}
.ftvt-dash--expandable:hover img{opacity:1}
.ftvt-dash:not(:has(img)){
  aspect-ratio:16/9;
  background-image:
    linear-gradient(rgba(255,195,15,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,195,15,.03) 1px, transparent 1px);
  background-size:28px 28px;
}
.ftvt-dash-tag{display:none}

/* Botão expandir */
.ftvt-dash-expand{
  position:absolute;bottom:8px;right:8px;
  width:28px;height:28px;border-radius:3px;
  background:rgba(10,12,20,.75);
  border:1px solid rgba(255,195,15,.3);
  display:grid;place-items:center;
  color:var(--gold-2);
  opacity:0;transition:opacity var(--dur-base);
}
.ftvt-dash--expandable:hover .ftvt-dash-expand{opacity:1}

/* Título com traço dos dois lados */
.ftvt-card-topic--highlight{
  display:flex;align-items:center;gap:12px;
  font-family:var(--font-display);font-size:clamp(14px,1.3vw,17px);
  font-weight:500;letter-spacing:.01em;
  color:var(--gold-2);
  margin-bottom:14px;
}
.ftvt-card-topic--highlight::before,
.ftvt-card-topic--highlight::after{
  content:"";flex:1;height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,195,15,.3));
}
.ftvt-card-topic--highlight::before{
  background:linear-gradient(270deg, transparent, rgba(255,195,15,.3));
}

/* Grid vs — horizontal no desktop */
.ftvt-vs--stacked{
  grid-template-columns:.55fr 20px 1.45fr;
  gap:12px;align-items:start;
}
.ftvt-vs--stacked .ftvt-vs-col{gap:6px}
.ftvt-vs--stacked .ftvt-vs-text{font-size:13px}

/* Mobile: tópico → imagem → ferramenta → leitura THE */
@media(max-width:820px){
  .ftvt-vs--stacked{
    display:contents;
  }
  .ftvt-vs--stacked .ftvt-vs-arrow{display:none !important}
  .ftvt-card{
    display:flex;flex-direction:column;gap:14px;
  }
  .ftvt-card-inner,
  .ftvt-card-content{
    display:contents;
  }
  .ftvt-card-topic--highlight{
    order:1;
    margin-bottom:0;
  }
  .ftvt-dash{
    order:2;
    margin:0;
  }
  .ftvt-vs-col--tool{
    order:3;
    padding:12px;
    border-radius:4px;
    background:rgba(255,255,255,.03);
    border-left:2px solid rgba(217,200,183,.2);
  }
  .ftvt-vs-col--the{
    order:4;
    padding:12px;
    border-radius:4px;
    background:rgba(255,195,15,.04);
    border-left:2px solid rgba(255,195,15,.35);
  }
}

/* ============ LIGHTBOX ============ */
.lightbox{
  position:fixed;inset:0;z-index:500;
  background:rgba(0,0,0,.92);
  display:grid;place-items:center;
  opacity:0;pointer-events:none;
  transition:opacity .25s var(--ease-out);
}
.lightbox.open{opacity:1;pointer-events:all}
.lightbox-inner{
  max-width:min(90vw,1200px);
  max-height:90vh;
  position:relative;
}
.lightbox-img{
  width:100%;height:auto;max-height:90vh;
  object-fit:contain;border-radius:3px;
  display:block;
}
.lightbox-close{
  position:absolute;top:-40px;right:0;
  background:transparent;border:0;
  color:rgba(217,200,183,.7);font-size:28px;line-height:1;
  cursor:pointer;transition:color var(--dur-base);
}
.lightbox-close:hover{color:var(--major-1)}

.img-expandable{
  cursor:zoom-in;
}
.img-expandable:hover{opacity:.92}

/* Timeline central */
.ftvt-timeline{
  position:sticky;
  top:calc(64px + 40px);
  align-self:start;
  height:calc(100vh - 64px - 80px);
  display:flex;justify-content:center;
}
.ftvt-tl-track{
  position:relative;width:2px;height:100%;margin:0 auto;
  background:rgba(217,200,183,.1);border-radius:2px;
}
.ftvt-tl-fill{
  position:absolute;top:0;left:0;right:0;height:0%;
  background:linear-gradient(180deg, var(--gold-1) 0%, var(--gold-2) 60%, var(--gold-3) 100%);
  border-radius:2px;
  transition:height .1s linear;
  box-shadow:0 0 8px 1px rgba(255,195,15,.35);
}
@media(max-width:900px){.ftvt-timeline{display:none}}

/* Coluna direita — título sticky */
.ftvt-right{
  position:sticky;top:calc(64px + 40px);
  padding-left:clamp(24px,3vw,48px);
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:20px;
}
@media(max-width:900px){
  .ftvt-right{position:static;padding-left:0;margin-bottom:40px;order:1}
}
.ftvt-right h2{
  font-size:clamp(28px,3.2vw,44px);
  font-weight:400;line-height:1.08;letter-spacing:-.03em;
}
.ftvt-right h2 em{font-style:italic;font-weight:300;color:var(--gold-1)}
.ftvt-right p{
  color:var(--cloud-3);font-size:clamp(14px,1.1vw,16px);
  line-height:1.65;max-width:42ch;margin-inline:auto;
}
.ftvt-right p strong{color:var(--major-1);font-weight:500}
.ftvt-right-foot{
  margin-top:8px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cloud-5);
  padding-top:18px;border-top:1px solid var(--rule);
}
.ftvt-right-count{color:var(--gold-2)}

/* ============ COMPARATIVO VISUAL — gerenciador vs THE ============ */
.compare-visual{
  margin-top:clamp(40px,5vw,72px);
  position:relative;
}
.compare-visual-grid{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:clamp(20px,2.4vw,40px);
  align-items:stretch;
}
@media(max-width:900px){
  .compare-visual-grid{grid-template-columns:1fr;gap:32px}
}

/* Cada lado */
.cv-side{display:flex;flex-direction:column;gap:18px}

/* Label superior */
.cv-label{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;flex-wrap:wrap;
}
.cv-tag{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cloud-5);
  border-left:1px solid var(--cloud-5);padding-left:10px;
}
.cv-tag--gold{
  color:var(--gold-2);border-left-color:var(--gold-2);
}
.cv-source{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;
  color:var(--cloud-5);opacity:.6;
}

/* Frame (moldura do mock) */
.cv-frame{
  position:relative;
  border:1px solid var(--rule);
  background:var(--bg-soft);
  aspect-ratio:4/3.2;
  overflow:hidden;
  isolation:isolate;
}
.cv-frame::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(0deg, rgba(217,200,183,.03) 0 1px, transparent 1px 28px),
    repeating-linear-gradient(90deg, rgba(217,200,183,.03) 0 1px, transparent 1px 28px);
  pointer-events:none;z-index:1;
}
.cv-frame--blur .cv-mock{
  filter:blur(.6px) saturate(.55) brightness(.78);
  opacity:.78;
}
.cv-frame--blur::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(135deg, rgba(10,12,20,.4) 0%, transparent 40%, rgba(10,12,20,.5) 100%);
  pointer-events:none;z-index:2;
}
.cv-frame--sharp{
  border-color:rgba(255,195,15,.3);
  box-shadow:
    0 0 0 1px rgba(255,195,15,.08) inset,
    0 24px 60px -24px rgba(255,195,15,.15);
}

/* Mock interno */
.cv-mock{
  position:absolute;inset:24px;
  display:flex;flex-direction:column;gap:14px;
  z-index:2;
}
.cv-mock-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:12px;border-bottom:1px solid var(--rule);
}
.cv-mock-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--cloud-3);
}
.cv-mock-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--cloud-5);
}
.cv-mock-dot--live{
  background:var(--gold-2);
  box-shadow:0 0 0 4px rgba(255,195,15,.15);
  animation:cv-pulse 2.2s ease-in-out infinite;
}
@keyframes cv-pulse{
  0%,100%{box-shadow:0 0 0 4px rgba(255,195,15,.15)}
  50%{box-shadow:0 0 0 7px rgba(255,195,15,.05)}
}
.cv-mock-big{
  display:flex;flex-direction:column;gap:6px;
}
.cv-mock-label{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cloud-5);
}
.cv-mock-num{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(24px,3.4vw,42px);letter-spacing:-.03em;
  line-height:1;color:var(--major-1);
}
.cv-mock-num--gold{color:var(--gold-2)}
.cv-mock-row{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.cv-mock-cell{
  display:flex;flex-direction:column;gap:4px;
  padding:10px 12px;
  border:1px solid var(--rule);
  background:rgba(217,200,183,.02);
}
.cv-mock-cell-l{
  font-family:var(--font-mono);font-size:8px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cloud-5);
}
.cv-mock-cell-v{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(14px,1.4vw,18px);color:var(--major-1);
  letter-spacing:-.01em;
}
.cv-mock-cell-v--gold{color:var(--gold-2)}
.cv-mock-bars{
  display:flex;align-items:flex-end;gap:4px;
  flex:1;min-height:0;
}
.cv-mock-bars span{
  flex:1;background:var(--cloud-5);opacity:.32;border-radius:1px;
}
.cv-mock-bars--hi span{background:var(--major-1);opacity:.28}
.cv-mock-bars--hi span.hi{background:var(--gold-2);opacity:.85}
.cv-mock-foot{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--cloud-5);opacity:.7;
  padding-top:8px;border-top:1px solid var(--rule);
}

/* Caption abaixo de cada lado */
.cv-caption{
  display:flex;flex-direction:column;gap:6px;
  padding:14px 18px;
  border-left:1px solid var(--rule);
}
.cv-side--good .cv-caption{border-left-color:var(--gold-2)}
.cv-caption-num{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(20px,2.2vw,28px);letter-spacing:-.02em;
  color:var(--cloud-5);
}
.cv-caption-num--gold{color:var(--gold-1)}
.cv-caption-txt{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;
  color:var(--cloud-5);line-height:1.55;
}

/* Divisor central VS */
.cv-vs{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;padding:0 4px;
}
.cv-vs-line{
  width:1px;flex:1;min-height:40px;
  background:linear-gradient(180deg, transparent, var(--rule-strong), transparent);
}
.cv-vs-label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;
  color:var(--gold-2);font-weight:500;
}
@media(max-width:900px){
  .cv-vs{flex-direction:row;width:100%;padding:8px 0}
  .cv-vs-line{width:auto;flex:1;height:1px;min-height:0;
    background:linear-gradient(90deg, transparent, var(--rule-strong), transparent);
  }
}

/* Fechamento — linha com diferença total */
.cv-bottom{
  margin-top:clamp(28px,3.5vw,48px);
  padding-top:clamp(24px,3vw,36px);
  border-top:1px solid var(--rule);
}
.cv-bottom-line{
  display:flex;align-items:baseline;gap:clamp(16px,2.4vw,32px);
  flex-wrap:wrap;
}
.cv-bottom-label{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cloud-5);
}
.cv-bottom-num{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(28px,3.6vw,48px);letter-spacing:-.03em;
  color:var(--gold-2);line-height:1;
}
.cv-bottom-pct{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;
  color:var(--gold-1);padding:4px 10px;border:1px solid var(--gold-3);
  border-radius:2px;
}
.cv-bottom-note{
  margin-top:16px;color:var(--cloud-3);font-size:14px;line-height:1.65;
  max-width:64ch;
}
.cv-bottom-note strong{color:var(--major-1);font-weight:500}

/* ============ PROBLEM ============ */
.problem{position:relative}
.verb{
  font-family:var(--font-display);font-weight:300;
  font-size:clamp(24px,3.2vw,40px);line-height:1.25;
  color:var(--major-1);max-width:28ch;
  border-left:1px solid var(--gold-2);padding:6px 0 6px 24px;
  font-style:italic;
}
.verb-attr{
  display:block;margin-top:16px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cloud-5);font-style:normal;
}
.problem-grid{
  margin-top:64px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid var(--rule);
}
.problem-item{
  padding:36px 28px;border-right:1px solid var(--rule);
}
.problem-item:last-child{border-right:0}
.problem-item .pn{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;
  color:var(--gold-2);text-transform:uppercase;margin-bottom:16px;
}
.problem-item h4{font-size:22px;margin-bottom:12px;font-weight:500}
.problem-item p{color:var(--cloud-3);font-size:15px;line-height:1.6}
@media (max-width:820px){
  .problem-grid{grid-template-columns:1fr}
  .problem-item{border-right:0;border-bottom:1px solid var(--rule)}
  .problem-item:last-child{border-bottom:0}
}

/* ============ PILLARS — sticky layout ============ */
.pillar-sticky-section{
  padding:0;
  overflow:visible;
}
.pillar-sticky-wrap{
  display:grid;
  grid-template-columns:1fr 32px 1.2fr;
  align-items:start;
  gap:0;
  width:var(--container);
  margin-inline:auto;
  padding:clamp(64px,8vw,120px) 0;
}
@media(max-width:900px){
  .pillar-sticky-wrap{grid-template-columns:1fr}
}

/* Coluna esquerda — sticky */
.pillar-sticky-left{
  position:sticky;
  top:calc(64px + 40px);
  padding-right:clamp(24px,3vw,48px);
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:20px;
}
.pillar-sticky-left .eyebrow{margin-bottom:4px}
.pillar-sticky-left h2{
  font-size:clamp(28px,3.2vw,44px);
  font-weight:400;line-height:1.08;letter-spacing:-.03em;
}
.pillar-sticky-left h2 em{
  font-style:italic;font-weight:300;color:var(--gold-1);
}
.pillar-sticky-left p{
  color:var(--cloud-3);font-size:clamp(14px,1.1vw,16px);
  line-height:1.65;max-width:42ch;margin-inline:auto;
}
.pillar-sticky-left p strong{color:var(--major-1);font-weight:500}
.pillar-sticky-foot{
  margin-top:8px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cloud-5);
  padding-top:18px;border-top:1px solid var(--rule);
}
.pillar-sticky-count{color:var(--gold-2)}
@media(max-width:900px){
  .pillar-sticky-left{position:static;padding-right:0;margin-bottom:40px}
}

/* ---- Timeline central ---- */
.pillar-timeline{
  position:sticky;
  top:calc(64px + 40px);
  align-self:start;
  height:calc(100vh - 64px - 80px);
  display:flex;justify-content:center;
}
.pillar-tl-track{
  position:relative;
  width:2px;
  height:100%;
  margin:0 auto;
  background:rgba(217,200,183,.1);
  border-radius:2px;
}
.pillar-tl-fill{
  position:absolute;
  top:0;left:0;right:0;
  height:0%;
  background:linear-gradient(180deg, var(--gold-1) 0%, var(--gold-2) 60%, var(--gold-3) 100%);
  border-radius:2px;
  transition:height .1s linear;
  box-shadow:0 0 8px 1px rgba(255,195,15,.35);
}
@media(max-width:900px){.pillar-timeline{display:none}}

/* Dot dentro de cada card — flutua para a esquerda, na coluna da timeline */
.pillar-dot{
  display:block;
  position:absolute;
  /* timeline col = 32px, linha no centro = 16px do card.
     dot width = 12px, então left = -(16 + 6) = -22px centraliza a bolinha sobre a linha */
  left:-22px;
  top:clamp(24px,2.8vw,32px);
  width:12px;height:12px;
  border-radius:50%;
  border:2px solid rgba(217,200,183,.25);
  background:var(--bg);
  z-index:3;
  transition:border-color .3s, background .3s, box-shadow .3s;
}

/* Card precisa de position:relative para o dot se posicionar corretamente */
.pillar-card{
  position:relative;
}

/* Dot e card ativos */
.pillar-card.active .pillar-dot{
  border-color:var(--gold-2);
  background:var(--gold-2);
  animation:dot-pulse 1.8s ease-in-out infinite;
}
@keyframes dot-pulse{
  0%,100%{box-shadow:0 0 0 5px rgba(255,195,15,.2)}
  50%{box-shadow:0 0 0 10px rgba(255,195,15,.05)}
}
.pillar-card.active{
  border-color:rgba(255,195,15,.32);
  background:
    linear-gradient(90deg, rgba(255,195,15,.055), transparent 34%),
    rgba(18,19,31,.56);
}
.pillar-card--highlight.active{
  border-color:rgba(255,195,15,.45);
}

/* Coluna direita — scroll */
.pillar-sticky-right{
  display:flex;flex-direction:column;gap:0;
}

/* Cards de pilar */
.pillar-card{
  background:rgba(18,19,31,.48);
  border:1px solid rgba(217,200,183,.08);
  border-left:2px solid rgba(217,200,183,.18);
  border-radius:0 10px 10px 0;
  padding:clamp(18px,2vw,24px) clamp(18px,2.2vw,26px);
  margin-bottom:10px;
  display:grid;
  grid-template-columns:minmax(150px,.62fr) 1fr;
  column-gap:clamp(18px,2.4vw,34px);
  row-gap:12px;
  transition:border-color var(--dur-base), background var(--dur-base), transform var(--dur-base);
}
.pillar-card:last-child{margin-bottom:0}
.pillar-card:hover{
  border-color:rgba(255,195,15,.28);
  border-left-color:var(--gold-2);
  background:
    linear-gradient(90deg, rgba(255,195,15,.05), transparent 36%),
    rgba(34,36,51,.5);
  transform:translateX(2px);
}
.pillar-card--highlight{
  position:relative;
  border-color:rgba(255,195,15,.35);
  border-left-color:var(--gold-2);
  background:
    linear-gradient(90deg, rgba(255,195,15,.08) 0%, rgba(255,195,15,0) 46%),
    rgba(34,36,51,.58);
  box-shadow:
    0 0 0 1px rgba(255,195,15,.15),
    0 18px 42px -34px rgba(255,195,15,.35),
    inset 0 1px 0 rgba(255,195,15,.18);
}
.pillar-card--highlight::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(180deg, rgba(255,195,15,.55) 0%, rgba(255,195,15,0) 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}
.pillar-card--highlight:hover{
  border-color:rgba(255,195,15,.55);
  border-left-color:var(--gold-1);
  background:
    linear-gradient(90deg, rgba(255,195,15,.1) 0%, rgba(255,195,15,0) 48%),
    rgba(34,36,51,.66);
}
.pillar-card-tag{
  display:inline-block;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-2);
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  margin-bottom:10px;
  grid-column:1;
}
.pillar-card-tag--gold{
  color:var(--gold-1);
  background:transparent;
}
.pillar-card h3{
  font-family:var(--font-display);font-size:clamp(18px,1.8vw,23px);
  font-weight:500;margin:0;line-height:1.18;color:var(--major-1);
  grid-column:1;
}
.pillar-card--highlight h3{color:var(--gold-1)}
.pillar-card p{
  color:var(--cloud-3);font-size:14px;line-height:1.58;
  max-width:none;margin:0;
  grid-column:2;
}
.pillar-card p + p{margin-top:8px}
.pillar-card p strong{color:var(--major-1);font-weight:500}
.pillar-card-list{
  margin-top:12px;display:flex;flex-wrap:wrap;gap:8px;
  list-style:none;
  grid-column:2;
}
.pillar-card-list li{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);
  font-size:10px;letter-spacing:.04em;color:var(--cloud-3);line-height:1.35;
  padding:6px 9px;
  border:1px solid rgba(217,200,183,.1);
  background:rgba(10,12,20,.34);
  border-radius:999px;
}
.pillar-card-list li::before{
  content:"";
  flex-shrink:0;
  width:7px;height:7px;
  background:var(--eletrum-3);
  border-radius:50%;
  box-shadow:0 0 0 0 rgba(88,212,23,.35);
  animation:pillar-active-dot 2.8s ease-in-out infinite;
}
.pillar-card--highlight .pillar-card-list li{color:var(--major-1)}
@keyframes pillar-active-dot{
  0%,100%{
    opacity:.65;
    box-shadow:0 0 0 0 rgba(88,212,23,.28);
  }
  50%{
    opacity:1;
    box-shadow:0 0 0 5px rgba(88,212,23,.08);
  }
}
@media (prefers-reduced-motion:reduce){
  .pillar-card-list li::before{animation:none;opacity:1}
}

/* Mobile — pilares viram carrossel horizontal com peek do próximo card */
@media(max-width:900px){
  .pillar-sticky-wrap{
    width:100%;
    padding-inline:0;
  }
  .pillar-sticky-left{
    padding-inline:clamp(20px,5vw,32px);
  }
  .pillar-sticky-right{
    flex-direction:row;
    overflow-x:auto;
    overflow-y:hidden;
    gap:14px;
    padding:4px clamp(20px,5vw,32px) 8px;
    scroll-snap-type:x mandatory;
    scroll-padding-left:clamp(20px,5vw,32px);
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
  }
  .pillar-sticky-right::-webkit-scrollbar{display:none}
  .pillar-card{
    flex:0 0 82%;
    max-width:340px;
    margin-bottom:0;
    scroll-snap-align:start;
    display:flex;
    flex-direction:column;
    gap:0;
    border-left:1px solid rgba(217,200,183,.08);
    border-radius:8px;
    transform:none;
  }
  .pillar-card:last-child{
    /* garante que o último card também faça snap no início, sem peek extra */
    margin-right:clamp(20px,5vw,32px);
  }
  .pillar-dot{display:none}
}

/* ============ COMPARISON ============ */
/* Tabela editorial — coluna THE como protagonista, demais como rodapé
   tipográfico. Sem outer-border de caixa. Hierarquia por escala + peso. */
.compare-wrap{
  overflow-x:auto;
  border:0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.compare{
  width:100%;min-width:760px;
  border-collapse:collapse;
  font-size:14px;
  table-layout:fixed;
}
/* Larguras: capability protagonista à esquerda, THE com peso na direita */
.compare colgroup,.compare col{display:none} /* defensive */
.compare th:nth-child(1),.compare td:nth-child(1){ width:30% }
.compare th:nth-child(2),.compare td:nth-child(2){ width:24% }
.compare th:nth-child(3),.compare td:nth-child(3),
.compare th:nth-child(4),.compare td:nth-child(4),
.compare th:nth-child(5),.compare td:nth-child(5){ width:15.33% }

.compare th, .compare td{
  text-align:left;
  padding:22px 22px;
  border-bottom:1px solid rgba(217,200,183,.06);
  vertical-align:middle;
}
.compare tbody tr:last-child td{ border-bottom:0 }

/* Header — eyebrow tipográfico, sem peso visual */
.compare thead th{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cloud-5);font-weight:500;
  padding:14px 22px 16px;
  border-bottom:1px solid var(--rule);
}
.compare thead th.us{
  color:var(--gold-2);
  background:linear-gradient(180deg, rgba(255,195,15,.06) 0%, rgba(255,195,15,.02) 100%);
}

/* Coluna 1 — capability como statement editorial */
.compare tbody td:first-child{
  font-family:var(--font-display);font-weight:500;
  font-size:17px;line-height:1.25;letter-spacing:-.01em;
  color:var(--major-1);
}

/* Coluna THE — protagonista: bg gradient sutil + tipografia maior */
.compare tbody td.us{
  background:linear-gradient(180deg, rgba(255,195,15,.06) 0%, rgba(255,195,15,.02) 100%);
  padding-left:26px;padding-right:26px;
}

/* Hover refinado — só linha, sem mudar bg da THE */
.compare tbody tr:hover td{ background-color:rgba(217,200,183,.015) }
.compare tbody tr:hover td.us{
  background:linear-gradient(180deg, rgba(255,195,15,.09) 0%, rgba(255,195,15,.03) 100%);
}

/* ---- Indicadores de cobertura: barras em vez de dots ----
   Mais legível por proporção; remove o "checklist look" de table SaaS. */
.compare .dot{
  display:inline-block;
  width:28px;height:3px;border-radius:1.5px;
  background:rgba(217,200,183,.16);
  vertical-align:middle;
  border:0;
}
.compare .dot.full{ background:var(--gold-2) }
.compare .dot.half{
  background:linear-gradient(90deg,
    var(--cloud-3) 0%, var(--cloud-3) 50%,
    rgba(217,200,183,.16) 50%, rgba(217,200,183,.16) 100%);
}
.compare .dot.none{
  background:transparent;
  box-shadow:inset 0 0 0 1px rgba(217,200,183,.18);
}

/* THE: barra mais grossa, com leve "presença" extra */
.compare td.us .dot{ height:4px;width:32px;border-radius:2px }
.compare td.us .dot.full{
  background:linear-gradient(90deg, var(--gold-1) 0%, var(--gold-2) 100%);
}

/* Label — pareado com a barra */
.compare .label{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;
  color:var(--cloud-5);text-transform:uppercase;
  margin-left:12px;
}
.compare td.us .label{
  color:var(--gold-1);
  font-size:12px;letter-spacing:.08em;
}

/* Linhas das colunas concorrentes — silenciar (mono, menor) */
.compare tbody td:nth-child(3),
.compare tbody td:nth-child(4),
.compare tbody td:nth-child(5){
  color:var(--cloud-5);
}

/* ---- Mobile: tabela única, sem scroll horizontal ----
   Padrão "protagonist column + stacked competitors":
   - cada linha continua sendo uma <tr> (semântica preservada);
   - THE ocupa a coluna esquerda em altura cheia da linha;
   - os 3 concorrentes empilham à direita;
   - sem cards separados, sem scroll lateral. */
@media(max-width:720px){
  .compare-wrap{
    overflow:visible;
    border:0;
    border-top:1px solid var(--rule);
    border-bottom:1px solid var(--rule);
    background:transparent;
  }
  .compare{
    display:block;
    min-width:0;
    width:100%;
    font-size:13px;
    table-layout:auto;
  }
  .compare thead{ display:none }
  .compare tbody{ display:block }
  .compare colgroup,.compare col{ display:none }

  /* Cada linha = grid 2 colunas com THE à esquerda (alta) e
     concorrentes empilhados à direita */
  .compare tbody tr{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:14px;
    row-gap:0;
    padding:18px 0;
    border-bottom:1px solid var(--rule);
    background:transparent;
  }
  .compare tbody tr:last-child{ border-bottom:0 }
  .compare tbody tr:hover td,
  .compare tbody tr:hover td.us{ background:transparent }

  /* Reset cells */
  .compare tbody tr td{
    display:block;
    padding:0;
    border:0;
    background:transparent;
    width:auto;
    color:var(--cloud-5);
  }

  /* Linha 1 — capability ocupa toda a largura */
  .compare tbody tr td:first-child{
    grid-column:1 / -1;
    grid-row:1;
    font-family:var(--font-display);
    font-size:14.5px;
    font-weight:500;
    color:var(--major-1);
    line-height:1.3;
    margin-bottom:12px;
  }
  .compare tbody tr td:first-child strong{
    color:inherit;font-weight:500;
  }

  /* THE — coluna esquerda, span vertical de 3 linhas */
  .compare tbody tr td.us{
    grid-column:1;
    grid-row:2 / span 3;
    align-self:stretch;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:8px;
    padding:12px 14px;
    background:linear-gradient(180deg, rgba(255,195,15,.07) 0%, rgba(255,195,15,.02) 100%);
    border-radius:3px;
    box-shadow:none;
  }
  .compare tbody tr td.us::before{
    content:"★ THE";
    font-family:var(--font-mono);
    font-size:9.5px;letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--gold-2);
    font-weight:500;
  }
  .compare tbody tr td.us .dot{
    width:36px;height:4px;border-radius:2px;
  }
  .compare tbody tr td.us .label{
    margin-left:0;
    font-family:var(--font-display);
    font-size:14px;
    font-weight:500;
    letter-spacing:.01em;
    color:var(--gold-1);
    text-transform:none;
  }

  /* Concorrentes — coluna direita, cada um em sua linha */
  .compare tbody tr td:nth-child(3),
  .compare tbody tr td:nth-child(4),
  .compare tbody tr td:nth-child(5){
    grid-column:2;
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 0;
    min-width:0;
  }
  .compare tbody tr td:nth-child(3){ grid-row:2 }
  .compare tbody tr td:nth-child(4){ grid-row:3 }
  .compare tbody tr td:nth-child(5){ grid-row:4 }

  /* Rótulo do concorrente injetado via ::before */
  .compare tbody tr td:nth-child(3)::before,
  .compare tbody tr td:nth-child(4)::before,
  .compare tbody tr td:nth-child(5)::before{
    font-family:var(--font-mono);
    font-size:9px;letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--cloud-5);
    flex:0 0 64px;
    line-height:1.2;
  }
  .compare tbody tr td:nth-child(3)::before{ content:"Plataforma genérica" }
  .compare tbody tr td:nth-child(4)::before{ content:"Freelancer" }
  .compare tbody tr td:nth-child(5)::before{ content:"Time interno" }

  /* Barras menores no mobile */
  .compare tbody tr td:not(.us) .dot{
    width:18px;height:3px;flex:0 0 auto;
  }

  /* Label do resultado */
  .compare tbody tr td:not(.us) .label{
    font-family:var(--font-mono);
    font-size:9.5px;letter-spacing:.06em;
    color:var(--cloud-3);
    margin-left:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    min-width:0;
  }
}

/* ============ CASE SPOTLIGHT ============ */
#cases-sidebar .sec-head{margin-bottom:40px}
.case-spotlight{
  position:relative;
  display:flex;flex-direction:row;gap:48px;align-items:flex-start;
  padding-top:0;
}
/* Barra vertical separadora: dourada, forte no centro, transparente nas bordas */
.case-spotlight::before{
  content:'';
  position:absolute;
  top:0;bottom:0;
  left:calc(40% + 24px);
  width:2px;
  transform:translateX(-1px);
  background:linear-gradient(180deg,
    transparent 0%,
    rgba(255,195,15,.12) 18%,
    var(--gold-2) 50%,
    rgba(255,195,15,.12) 82%,
    transparent 100%);
}

.csb-blocks{
  display:flex;flex-direction:column;gap:16px;
  flex:0 0 40%;max-width:40%;
}
.csb-block{
  position:relative;
  display:flex;flex-direction:column;gap:10px;
  padding:22px 24px 22px 28px;
  background:var(--night-4);
  border:1px solid var(--rule);
  border-radius:6px;
  overflow:hidden;
}
.csb-block::before{
  content:'';
  position:absolute;left:0;top:0;bottom:0;
  width:3px;
}
.csb-block-label{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;
}
.csb-block p{
  color:var(--cloud-3);font-size:15px;line-height:1.65;
}
.csb-block p strong{color:var(--major-1);font-weight:500}

/* Evolução: cinza → amarelado → verde */
.csb-block--antes{
  background:linear-gradient(135deg, rgba(142,146,173,.08) 0%, rgba(142,146,173,.02) 100%);
  border-color:rgba(142,146,173,.22);
}
.csb-block--antes::before{
  background:linear-gradient(180deg, rgba(142,146,173,.75) 0%, rgba(142,146,173,.12) 100%);
}
.csb-block--antes .csb-block-label{color:var(--cloud-5)}

.csb-block--feito{
  background:linear-gradient(135deg, rgba(255,195,15,.1) 0%, rgba(243,230,144,.025) 100%);
  border-color:rgba(255,195,15,.25);
}
.csb-block--feito::before{
  background:linear-gradient(180deg, var(--gold-2) 0%, rgba(255,195,15,.18) 100%);
}
.csb-block--feito .csb-block-label{
  background:linear-gradient(90deg, var(--gold-2) 0%, rgba(243,230,144,.75) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}

.csb-block--depois{
  background:linear-gradient(135deg, rgba(88,212,23,.11) 0%, rgba(88,212,23,.025) 100%);
  border-color:rgba(88,212,23,.3);
}
.csb-block--depois::before{
  background:linear-gradient(180deg, var(--eletrum-3) 0%, rgba(88,212,23,.18) 100%);
}
.csb-block--depois .csb-block-label{
  background:linear-gradient(90deg, var(--eletrum-3) 0%, rgba(88,212,23,.6) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}
.csb-block--depois p strong{color:var(--eletrum-3)}
.csb-block-outcome{
  margin-top:4px;padding-top:14px;
  border-top:1px solid rgba(88,212,23,.22);
  font-size:15px;line-height:1.55;
}
.csb-block--depois .csb-block-outcome strong{
  display:block;
  color:var(--eletrum-3);
  font-size:clamp(15px,1.05vw,16px);
  font-weight:600;
  letter-spacing:-.01em;
}

.csb-visual{
  flex:1;
  margin:0;
  max-width:none;
  border-radius:6px;
  overflow:hidden;
  border:1px solid rgba(217,200,183,.1);
}
.csb-visual img{
  display:block;width:100%;height:auto;
  cursor:zoom-in;
}

.csb-quote{
  padding:28px 0 0;
  border-top:1px solid var(--rule);
  display:flex;flex-direction:column;gap:14px;
  max-width:62ch;
}
.csb-quote-text{
  font-family:var(--font-display);font-weight:300;font-style:italic;
  font-size:clamp(18px,2vw,24px);line-height:1.45;
  color:var(--major-1);
}
.csb-quote-text::before{content:'"';margin-right:2px}
.csb-quote-text::after{content:'"';margin-left:2px}
.csb-quote-who{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.csb-quote-name{
  font-family:var(--font-display);font-weight:500;
  font-size:14px;color:var(--major-1);
}
.csb-quote-role{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;
  color:var(--cloud-5);
}

@media(max-width:820px){
  #cases-sidebar .sec-head{margin-bottom:28px}
  #cases-sidebar .case-spotlight{
    flex-direction:column;gap:16px;
  }
  #cases-sidebar .case-spotlight::before{display:none}
  #cases-sidebar .csb-visual{
    order:1;
    max-width:100%;width:100%;
    margin-inline:0;border-radius:4px;
  }
  #cases-sidebar .csb-blocks{
    order:2;
    flex:unset;max-width:none;gap:12px;
  }
}

@media(max-width:720px){
  .case-spotlight{gap:24px}
  .csb-block{padding:16px 18px}
  .csb-block p{font-size:14px;line-height:1.55}
  .csb-quote{padding-top:20px}
  .csb-quote-text{font-size:17px}
}

/* ============ CASES ============ */
.cases-carousel{
  position:relative;
}
.cases-carousel--scroll::after{
  content:"";
  position:absolute;top:0;right:0;bottom:0;
  width:min(72px, 18vw);
  background:linear-gradient(270deg, var(--bg) 10%, transparent 100%);
  pointer-events:none;
  z-index:2;
  opacity:1;
  transition:opacity .35s var(--ease-out);
}
.cases-carousel--scroll.is-at-end::after{opacity:0}
.cases-arrow{
  position:absolute;top:35%;transform:translateY(-50%);
  width:40px;height:40px;border-radius:50%;
  border:1px solid var(--rule-strong);
  background:var(--bg-soft);
  color:var(--major-1);font-size:16px;
  display:grid;place-items:center;
  cursor:pointer;z-index:3;
  transition:border-color var(--dur-base), background var(--dur-base);
}
.cases-arrow:hover{border-color:var(--gold-2);background:var(--night-2)}
.cases-arrow--prev{left:-20px}
.cases-arrow--next{right:-20px}
.cases-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  grid-template-rows:auto auto;
  gap:clamp(20px,2.5vw,36px);
  align-items:start;
}
.cases-grid .case:nth-child(1){grid-column:2;grid-row:1}
.cases-grid .case:nth-child(2){grid-column:2;grid-row:2;position:relative;padding-top:32px;border-top:none}
.cases-grid .case:nth-child(2)::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(255,195,15,.35) 50%,
    transparent 100%);
  opacity:1;
}
.cases-grid .case--feature{grid-column:1;grid-row:1/3}

.case{scroll-snap-align:none}
@media (max-width:820px){
  #diferenca{display:none}

  #cases .sec-head{
    margin-bottom:28px;
    gap:12px;
  }

  #cases .cases-grid{
    display:flex;
    flex-direction:column;
    gap:48px;
  }
  #cases .cases-grid .case,
  #cases .cases-grid .case--feature{
    grid-column:auto;grid-row:auto;
    width:100%;
  }
  #cases .cases-grid .case--feature{order:-1}

  /* Divisor entre blocos de vídeo — linha dourada (mobile, respeita ordem visual) */
  #cases .cases-grid .case:not(.case--feature){
    position:relative;
    padding-top:48px;
    border-top:none;
  }
  #cases .cases-grid .case:not(.case--feature)::before{
    content:"";
    position:absolute;
    top:0;left:0;right:0;
    height:1px;
    background:linear-gradient(90deg,
      transparent 0%,
      rgba(255,195,15,.35) 50%,
      transparent 100%);
    opacity:1;
  }
  .cases-arrow{display:none}
  .cases-swipe-hint{display:none !important}
}

/* Hint de swipe — só no mobile, quando há carrossel */
.cases-swipe-hint{display:none}
@media (max-width:820px){
  .cases-carousel--scroll .cases-swipe-hint{
    display:flex;align-items:center;gap:10px;
    margin:0 0 10px;
    padding:8px 14px;
    width:fit-content;
    border:1px solid rgba(255,195,15,.18);
    border-radius:999px;
    background:rgba(255,195,15,.04);
    font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;
    text-transform:uppercase;color:var(--gold-2);
    transition:opacity .3s var(--ease-out), transform .3s var(--ease-out);
  }
  .cases-swipe-hint.is-hidden{
    opacity:0;
    transform:translateY(-4px);
    pointer-events:none;
  }
  .cases-swipe-hint-dot{
    width:6px;height:6px;border-radius:50%;
    background:var(--gold-2);
    box-shadow:0 0 0 4px rgba(255,195,15,.15);
  }
  .cases-swipe-hint-arrow{
    display:inline-block;
    animation:cases-hint-arrow 1.6s ease-in-out infinite;
  }
}
@keyframes cases-hint-arrow{
  0%,100%{transform:translateX(0);opacity:.6}
  50%{transform:translateX(6px);opacity:1}
}

.case{
  display:flex;flex-direction:column;
  position:relative;
}

/* Área do vídeo/placeholder — sem borda de caixa */
.case-media{
  position:relative;aspect-ratio:4/3;
  background:var(--night-5);
  overflow:hidden;
}
.case-media--video{background:#000;aspect-ratio:16/9}
/* Teodoro: vídeo nativo 4:3 — casa a proporção pra eliminar as barras laterais */
.case--ratio43 .case-media--video{aspect-ratio:4/3}
.case--feature .case-body .quote{font-size:clamp(18px,1.8vw,23px)}
.case--feature .case-body{padding-top:32px;gap:24px}
.case-media--video iframe{
  position:absolute;top:0;left:0;
  width:100%;height:100%;
  border:0;outline:0;
  pointer-events:none;
}

/* Player customizado */
.vp-overlay{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  z-index:2;
  cursor:pointer;
}
.vp-overlay.playing .vp-play{opacity:0}
.vp-overlay:hover .vp-play{opacity:1}

.vp-play{
  width:64px;height:64px;border-radius:50%;
  border:1.5px solid rgba(255,195,15,.8);
  background:rgba(0,0,0,.45);
  display:grid;place-items:center;
  cursor:pointer;
  transition:background var(--dur-base), border-color var(--dur-base), opacity var(--dur-base);
  flex-shrink:0;
}
.vp-play:hover{background:rgba(255,195,15,.18);border-color:var(--gold-2)}
.vp-play svg{width:22px;height:22px;fill:var(--gold-2)}
.vp-icon-play{margin-left:3px}

/* Barra de progresso — fixada na base do vídeo */
.vp-bar{
  position:absolute;bottom:0;left:0;right:0;
  padding:10px 14px 10px;
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(0deg, rgba(0,0,0,.7) 0%, transparent 100%);
}
.vp-progress{
  flex:1;height:3px;background:rgba(255,255,255,.2);
  border-radius:2px;cursor:pointer;position:relative;
}
.vp-fill{
  height:100%;width:0%;
  background:var(--gold-2);border-radius:2px;
  transition:width .25s linear;
  position:relative;
}
.vp-fill::after{
  content:"";position:absolute;right:-4px;top:50%;
  transform:translateY(-50%);
  width:8px;height:8px;border-radius:50%;
  background:var(--gold-2);
}
.vp-time{
  font-family:var(--font-mono);font-size:10px;
  color:rgba(255,255,255,.7);letter-spacing:.06em;
  white-space:nowrap;flex-shrink:0;
}
.vp-duration{
  position:absolute;top:10px;right:10px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;
  color:rgba(255,255,255,.85);
  background:rgba(0,0,0,.55);
  padding:2px 8px;border-radius:4px;
  z-index:3;pointer-events:none;
}
.vp-duration:empty{display:none}
.cases-grid--flat{
  overflow-x:visible;
  scroll-snap-type:none;
  cursor:default;
  flex-wrap:wrap;
}
.cases-grid--flat:active{cursor:default}
.cases-grid--flat .case{
  flex:1 1 260px;
  scroll-snap-align:none;
}

/* ===== Carrossel center-stage de vídeos (desktop) ===== */
@media (min-width:821px){
  .cases-carousel--coverflow .cases-grid{
    display:block;
    position:relative;
    overflow:visible;
    /* altura definida via JS = card mais alto */
  }
  .cases-carousel--coverflow .case{
    position:absolute;
    top:50%;left:50%;
    width:clamp(360px,44%,520px);
    margin:0;
    grid-column:auto;grid-row:auto;
    padding-top:0;border-top:none;
    transition:transform .6s cubic-bezier(.45,0,.15,1),
               opacity .5s ease, filter .5s ease;
    will-change:transform,opacity;
  }
  .cases-carousel--coverflow .case::before{display:none}

  .cases-carousel--coverflow .case[data-slot="center"]{
    transform:translate(-50%,-50%) scale(1);
    z-index:3;opacity:1;filter:none;
  }
  .cases-carousel--coverflow .case[data-slot="left"]{
    transform:translate(-122%,-50%) scale(.78);
    z-index:1;opacity:.42;filter:saturate(.6) brightness(.78);
    cursor:pointer;
  }
  .cases-carousel--coverflow .case[data-slot="right"]{
    transform:translate(22%,-50%) scale(.78);
    z-index:1;opacity:.42;filter:saturate(.6) brightness(.78);
    cursor:pointer;
  }
  .cases-carousel--coverflow .case[data-slot="left"]:hover,
  .cases-carousel--coverflow .case[data-slot="right"]:hover{
    opacity:.7;filter:saturate(.85) brightness(.92);
  }
  /* laterais: clique gira em vez de tocar o vídeo */
  .cases-carousel--coverflow .case:not([data-slot="center"]) .vp-overlay{
    pointer-events:none;
  }

  /* legenda do card em destaque: painel escuro pra não sobrepor as laterais */
  .cases-carousel--coverflow .case[data-slot="center"] .case-body{
    position:relative;
    z-index:1;
    margin-top:6px;
    padding:20px 22px 22px;
    border-radius:12px;
    background:rgba(6,8,12,.9);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    box-shadow:0 10px 32px rgba(0,0,0,.5);
  }

  /* Teodoro 4:3 -> preenche 16:9 (cover), sem barras laterais */
  .cases-carousel--coverflow .case--ratio43 .case-media--video{aspect-ratio:16/9}
  .cases-carousel--coverflow .case--ratio43 .vp-iframe{
    width:100%;height:auto;
    aspect-ratio:4/3;
    top:50%;left:0;
    transform:translateY(-50%);
  }
}
.case-media::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(
    45deg,
    rgba(217,200,183,.02) 0 6px,
    transparent 6px 12px
  );
}
.case-media .play{
  position:absolute;inset:0;display:grid;place-items:center;
}
.case-media .play .pbox{
  width:56px;height:56px;
  border:1px solid rgba(255,195,15,.6);
  border-radius:50%;
  display:grid;place-items:center;
  background:rgba(0,0,0,.3);
  transition:background var(--dur-base), border-color var(--dur-base);
}
.case-media .play .pbox:hover{background:rgba(255,195,15,.15);border-color:var(--gold-2)}
.case-media .play svg{width:16px;height:16px;fill:var(--gold-2);margin-left:2px}
.case-media .ph-tag{
  position:absolute;top:12px;left:12px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-2);
  border:1px solid rgba(255,195,15,.35);padding:4px 8px;
  background:rgba(10,12,20,.65);
}

/* Corpo do card — editorial, sem box */
.case-body{
  padding:28px 0 0;
  flex:1;display:flex;flex-direction:column;gap:20px;
}
.case-body .quote{
  font-family:var(--font-display);font-weight:300;
  font-size:clamp(16px,1.5vw,19px);line-height:1.5;
  color:var(--major-1);font-style:italic;
  flex:1;
  padding-left:16px;
  border-left:2px solid rgba(255,195,15,.4);
}
.case-body .who{
  display:flex;flex-direction:column;gap:4px;
  padding-top:8px;
}
.case-body .who .name{
  font-family:var(--font-display);font-size:15px;
  color:var(--major-1);font-weight:500;
}
.case-body .who .role{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cloud-5);
}

/* prints/screenshots strip */
.prints{
  margin-top:48px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
@media (max-width:820px){.prints{grid-template-columns:repeat(2,1fr)}}
.print{
  aspect-ratio:9/16;
  border:1px solid var(--rule);background:var(--bg-soft);
  position:relative;overflow:hidden;
}
.print::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.5) 0, transparent 30%),
    repeating-linear-gradient(180deg, rgba(217,200,183,.04) 0 14px, transparent 14px 30px);
}
.print .ph-tag{
  position:absolute;top:10px;left:10px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-2);
  border:1px solid var(--gold-2);padding:4px 7px;background:rgba(0,0,0,.5);
}
.print .cap{
  position:absolute;left:12px;right:12px;bottom:12px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;color:var(--cloud-3);
}

.dashes{
  margin-top:48px;
  display:grid;grid-template-columns:repeat(2,1fr);gap:16px;
}
@media (max-width:820px){.dashes{grid-template-columns:1fr}}
.dashph{
  aspect-ratio:16/9;
  border:1px solid var(--rule);background:var(--bg-soft);
  position:relative;overflow:hidden;
}
.dashph::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(0deg, rgba(217,200,183,.04) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(90deg, rgba(217,200,183,.04) 0 1px, transparent 1px 22px);
}
.dashph .ph-tag{
  position:absolute;top:14px;left:14px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-2);
  border:1px solid var(--gold-2);padding:5px 9px;background:rgba(0,0,0,.5);
}
.dashph .cap{
  position:absolute;left:18px;right:18px;bottom:18px;
  font-family:var(--font-mono);font-size:11px;color:var(--cloud-3);letter-spacing:.04em;
}

/* ============ GESTOR BLOCK ============ */
.gestor{
  border:1px solid var(--rule);
  padding:clamp(40px,5vw,72px);
  background:
    linear-gradient(180deg, rgba(8,52,74,.18), transparent 100%),
    rgba(15,23,42,.4);
  display:grid;grid-template-columns:1fr;gap:32px;
  text-align:center;
}
.gestor .lbl{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--osmium-3);
}
.gestor h3{
  font-size:clamp(28px,3.4vw,40px);margin:14px auto 0;
  max-width:22ch;
}
.gestor .body p{
  font-size:clamp(16px,1.3vw,18px);color:var(--cloud-3);line-height:1.65;
  max-width:60ch;margin-inline:auto;text-align:left;
}
.gestor .body p + p{margin-top:18px}
.gestor .body strong{color:var(--major-1);font-weight:500}
@media (max-width:820px){.gestor{gap:24px}}

/* ============ POSSIBILIDADES THE ============ */
.poss-head{
  text-align:center;
  margin-bottom:clamp(40px,5vw,64px);
}
.poss-head h2{
  font-size:clamp(32px,4.4vw,56px);
  font-weight:400;letter-spacing:-.02em;
  margin-bottom:16px;
}
.poss-head h2 em{font-style:italic;font-weight:300;color:var(--gold-1)}
.poss-head .lede{max-width:48ch;margin-inline:auto}

/* Carrossel full-bleed — drag scroll */
.poss-carousel-wrap{
  position:relative;
  overflow:hidden;
}
.poss-fade{
  position:absolute;top:0;bottom:0;width:120px;
  pointer-events:none;z-index:2;
}
.poss-fade--left{
  left:0;
  background:linear-gradient(90deg, var(--bg) 0%, transparent 100%);
}
.poss-fade--right{
  right:0;
  background:linear-gradient(270deg, var(--bg) 0%, transparent 100%);
}

.poss-track{
  display:flex;
  gap:20px;
  padding:4px 0 24px;
  overflow-x:auto;
  overflow-y:hidden;
  cursor:grab;
  user-select:none;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  touch-action:pan-x;
}
.poss-track::-webkit-scrollbar{display:none}
.poss-track.is-dragging{cursor:grabbing}
.poss-track.is-dragging .poss-img{cursor:grabbing}
.poss-track.is-dragging img{pointer-events:none}

.poss-card{
  display:flex;flex-direction:column;gap:12px;
  flex-shrink:0;
  width:clamp(280px,28vw,400px);
}
.poss-img{
  width:100%;
  aspect-ratio:16/9;
  border-radius:3px;
  display:block;
  object-fit:cover;
  border:1px solid rgba(217,200,183,.1);
  cursor:zoom-in;
  transition:opacity var(--dur-base), border-color var(--dur-base);
}
.poss-img:hover{opacity:.9;border-color:rgba(255,195,15,.3)}
.poss-img--ph{
  background:var(--night-3);
  background-image:
    linear-gradient(rgba(255,195,15,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,195,15,.03) 1px, transparent 1px);
  background-size:24px 24px;
  cursor:default;
}
.poss-label{
  font-family:var(--font-display);
  font-size:clamp(15px,1.2vw,18px);
  font-weight:500;letter-spacing:.005em;
  color:var(--major-1);
  text-align:center;
  line-height:1.3;
}

/* ============ CARROSSEL SNAPSHOT ============ */
.snapshot-header{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:12px;
  margin-bottom:32px;
}
.snapshot-header h3{
  font-size:clamp(22px,2.4vw,30px);max-width:32ch;
  margin-inline:auto;
}
.snapshot-scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(90deg,#000 85%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 85%,transparent 100%);
  scrollbar-width:none;
}
.snapshot-scroll::-webkit-scrollbar{display:none}
.snapshot-track{
  display:flex;gap:16px;align-items:flex-start;
  width:max-content;
}
.snap-print{
  flex-shrink:0;width:clamp(180px, 26vw, 240px);
  margin:0;
  aspect-ratio:3/4;
  border:1px solid var(--rule);background:var(--bg-soft);
  position:relative;overflow:hidden;
  border-radius:2px;
}
.snap-print::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.5) 0, transparent 30%),
    repeating-linear-gradient(180deg, rgba(217,200,183,.04) 0 14px, transparent 14px 30px);
  pointer-events:none;
}
.snap-print--media{
  width:clamp(200px, 28vw, 280px);
  aspect-ratio:auto;
  height:auto;
  overflow:visible;
  background:var(--night-1);
}
.snap-print--media::before{display:none}
.snap-print--media img{
  display:block;width:100%;height:auto;
  max-height:min(72vh, 640px);
  cursor:zoom-in;
}
.snap-ph-tag{
  position:absolute;top:10px;left:10px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-2);
  border:1px solid var(--gold-2);padding:4px 7px;background:rgba(0,0,0,.5);
}
.snap-cap{
  position:absolute;left:12px;right:12px;bottom:12px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;color:var(--cloud-3);
}

/* ============ FAQ ============ */
.faq{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--rule)}
.faq details{overflow:hidden;border-bottom:1px solid var(--rule);padding:0}
.faq summary{
  list-style:none;cursor:pointer;
  padding:28px 16px 28px 0;
  display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;
  font-family:var(--font-display);font-weight:500;font-size:clamp(18px,1.7vw,22px);
  color:var(--major-1);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary .qn{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;
  color:var(--cloud-5);min-width:36px;
}
.faq summary .ico{
  width:28px;height:28px;border:1px solid var(--rule-strong);border-radius:50%;
  display:grid;place-items:center;color:var(--major-1);
  position:relative;transition:transform .25s, background .25s, color .25s;
}
.faq summary .ico::before, .faq summary .ico::after{
  content:"";position:absolute;background:currentColor;
}
.faq summary .ico::before{width:10px;height:1px}
.faq summary .ico::after{width:1px;height:10px;transition:transform .25s}
.faq details[open] summary .ico{background:var(--gold-2);color:var(--night-5);border-color:var(--gold-2)}
.faq details[open] summary .ico::after{transform:rotate(90deg)}
.faq .ans{
  max-height:0;overflow:hidden;
  transition:max-height var(--dur-slow) var(--ease-out), opacity var(--dur-slow) var(--ease-out);
  opacity:0;
  padding-bottom:0;
}
.faq details[open] .ans{max-height:600px;opacity:1;padding-bottom:32px}
.faq details[open]{border-left:1px solid var(--gold-2)}
.faq .ans{padding:0 16px 32px 60px;color:var(--cloud-3);font-size:16px;line-height:1.65;max-width:70ch}

/* ============ FINAL CTA ============ */
.final{
  text-align:center;padding:clamp(80px,12vw,180px) 0;
  border-top:1px solid var(--rule);
  background:
    radial-gradient(900px 500px at 50% 100%, rgba(255,195,15,.08), transparent 60%);
}
.final .eyebrow{margin-bottom:28px}
.final h2{
  font-size:clamp(40px,7vw,96px);font-weight:400;letter-spacing:-.035em;line-height:1;
  max-width:14ch;margin:0 auto 24px;
}
.final h2 em{font-style:italic;font-weight:300;color:var(--gold-1)}
.final p{max-width:48ch;margin:0 auto 36px;color:var(--cloud-3);font-size:clamp(16px,1.4vw,19px)}
.final .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.final .small{margin-top:36px;font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cloud-5)}

/* ============ FOOTER ============ */
footer{
  border-top:1px solid var(--rule);padding:36px 0;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cloud-5);
}
.foot{
  width:var(--container);margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
}
.foot .legal{display:flex;gap:18px}

/* ============ MODAL ============ */
.modal-backdrop{
  position:fixed;inset:0;z-index:200;
  background:rgba(8,9,16,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;padding:20px;
  opacity:0;transition:opacity .25s;
}
.modal-backdrop.open{display:flex;opacity:1}
.modal{
  width:min(640px, 100%);max-height:92vh;overflow:auto;
  background:var(--bg-soft);border:1px solid var(--rule-strong);
  border-radius:14px;
  box-shadow:0 40px 120px rgba(0,0,0,.78), 0 0 0 1px rgba(255,255,255,.05) inset, 0 1px 0 rgba(255,255,255,.06) inset;
  position:relative;
  transform:translateY(10px) scale(.984);
  transition:transform .4s var(--ease-out);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.85 0 0 0 0 0.78 0 0 0 0 0.72 0 0 0 0.16 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
.modal-backdrop.open .modal{transform:translateY(0) scale(1)}
.modal-head{
  padding:22px 28px 20px;border-bottom:1px solid var(--rule);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  position:sticky;top:0;background:rgba(18,19,31,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:2;
}
.modal-head .title{font-family:var(--font-display);font-weight:500;font-size:18px;letter-spacing:-.01em}
.modal-head .title span{color:var(--gold-2);font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;display:block;margin-top:4px}
.modal-head .title span b{color:var(--major-1)}
.modal-close{
  width:34px;height:34px;border:1px solid var(--rule);border-radius:50%;
  display:grid;place-items:center;color:var(--cloud-3);flex-shrink:0;
  transition:background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.modal-close:hover{background:var(--major-1);color:var(--night-5);border-color:var(--major-1);transform:rotate(90deg)}

.progress{display:flex;gap:6px;padding:18px 28px 0}
.progress span{
  flex:1;height:3px;border-radius:99px;background:var(--rule);
  position:relative;overflow:hidden;
  transition:background var(--dur-base) var(--ease-out);
}
.progress span.done{background:var(--osmium-3)}
.progress span.active{background:var(--rule)}
.progress span.active::after{
  content:'';position:absolute;inset:0;border-radius:99px;
  background:linear-gradient(90deg, var(--osmium-3), var(--major-1));
  transform-origin:left;animation:progFill .5s var(--ease-out) both;
}
@keyframes progFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.modal-body{padding:26px 28px 18px;min-height:300px}
.form-step-alert{
  margin-bottom:22px;padding:12px 14px;
  border:1px solid rgba(252,113,72,.42);
  background:rgba(252,113,72,.10);
  border-radius:8px;
  font-size:13px;line-height:1.5;color:var(--major-1);
  display:flex;align-items:center;gap:10px;
  animation:alertIn .3s var(--ease-out) both;
}
.form-step-alert::before{
  content:'';flex-shrink:0;width:16px;height:16px;
  background:var(--copper-1);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><path d='M12 8v5M12 16.5v.5'/><circle cx='12' cy='12' r='9'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><path d='M12 8v5M12 16.5v.5'/><circle cx='12' cy='12' r='9'/></svg>") center/contain no-repeat;
}
@keyframes alertIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.form-step-alert[hidden]{display:none !important}

.step-head{
  margin-bottom:30px;padding-bottom:22px;
  border-bottom:1px solid var(--rule);
  position:relative;
}
.step-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--cloud-5);
  margin-bottom:14px;
}
.step-eyebrow::before{
  content:'';width:22px;height:1px;background:var(--osmium-3);opacity:.7;
}
.step h3{font-size:27px;font-weight:500;margin-bottom:10px;line-height:1.12;letter-spacing:-.025em;color:var(--major-1)}
.step p.sub{color:var(--cloud-3);font-size:15px;line-height:1.55;margin-bottom:0;max-width:42ch}
@keyframes stepIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.step:not([hidden]){animation:stepIn .32s var(--ease-out)}
/* stagger dos campos ao entrar no step */
@keyframes fieldIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.step:not([hidden]) .form-block > *{animation:fieldIn .42s var(--ease-out) both}
.step:not([hidden]) .form-block > *:nth-child(1){animation-delay:.05s}
.step:not([hidden]) .form-block > *:nth-child(2){animation-delay:.11s}
.step:not([hidden]) .form-block > *:nth-child(3){animation-delay:.17s}
.step:not([hidden]) .form-block > *:nth-child(4){animation-delay:.23s}

.form-block{
  display:flex;flex-direction:column;gap:24px;
}
.form-row{display:grid;gap:16px}
.form-row--2{grid-template-columns:1fr 1fr}

.field{display:flex;flex-direction:column;gap:9px}
.field label{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  font-family:var(--font-body);font-size:14px;font-weight:500;
  letter-spacing:0;text-transform:none;color:var(--cloud-3);
}
.field-tag{
  font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cloud-5);font-weight:500;
  padding:3px 7px;border:1px solid var(--rule);border-radius:99px;
}
.field-tag--req{
  color:var(--gold-2);
  border-color:rgba(255,195,15,.24);
  background:rgba(255,195,15,.07);
}
.field-tag--opt{color:var(--cloud-5);border-color:rgba(217,200,183,.12);background:rgba(255,255,255,.02)}

.field input, .field select, .field textarea{
  width:100%;padding:15px 16px;
  background:var(--night-5);
  border:1px solid var(--night-1);
  color:var(--major-1);font-family:var(--font-body);font-size:15px;line-height:1.4;
  border-radius:8px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.35);
  transition:border-color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.field textarea{min-height:96px;resize:vertical}
.field input:hover, .field textarea:hover{border-color:var(--rule-strong)}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--osmium-3);
  background:var(--night-4);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.3), 0 0 0 3px rgba(23,150,212,.16);
}
.field input::placeholder, .field textarea::placeholder{color:var(--cloud-5);opacity:.8}

.field-hint{
  margin:0;font-size:11px;line-height:1.45;color:var(--cloud-5);
  font-family:var(--font-mono);letter-spacing:.04em;
}
.field-error{
  margin:0;font-size:12px;line-height:1.45;color:var(--copper-1);
  font-family:var(--font-body);
  display:flex;align-items:center;gap:6px;
  animation:alertIn .24s var(--ease-out) both;
}
.field-error::before{
  content:'';flex-shrink:0;width:13px;height:13px;
  background:var(--copper-1);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'><path d='M12 8v5M12 16.5v.5'/><circle cx='12' cy='12' r='9'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'><path d='M12 8v5M12 16.5v.5'/><circle cx='12' cy='12' r='9'/></svg>") center/contain no-repeat;
}
.field-error[hidden]{display:none !important}
.field.field--invalid input,
.field.field--invalid textarea{border-color:var(--copper-1);box-shadow:inset 0 1px 2px rgba(0,0,0,.3), 0 0 0 3px rgba(252,113,72,.14)}
.field.field--invalid .choices{border-radius:8px;box-shadow:0 0 0 1px rgba(252,113,72,.4)}


.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choices--3{grid-template-columns:repeat(3,1fr)}
.choices--cards .choice{
  border:1px solid var(--night-1);
  padding:14px 16px;
  font-size:14px;color:var(--cloud-3);text-align:left;cursor:pointer;
  transition:border-color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out), transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  font-family:var(--font-body);
  display:flex;align-items:center;gap:12px;
  min-height:52px;border-radius:8px;
  background:var(--night-5);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.25);
}
.choices--cards .choice:hover{
  border-color:var(--rule-strong);background:var(--night-4);color:var(--major-1);
  transform:translateY(-1px);
}
.choices--cards .choice:active{transform:translateY(0) scale(.99)}
.choices--cards .choice.sel{
  border-color:var(--osmium-3);
  background:rgba(23,150,212,.09);
  color:var(--major-1);
  box-shadow:0 0 0 1px rgba(23,150,212,.35) inset;
}
.choice .check{
  width:20px;height:20px;border:1.5px solid var(--night-1);border-radius:6px;
  display:grid;place-items:center;flex-shrink:0;
  background:var(--night-4);
  transition:background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.choice.sel .check{background:var(--osmium-3);border-color:var(--osmium-3)}
.choice.sel .check::after{
  content:'';width:11px;height:11px;
  background:var(--night-5);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12l5 5L20 7'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12l5 5L20 7'/></svg>") center/contain no-repeat;
  animation:checkPop .22s var(--ease-out) both;
}
@keyframes checkPop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}

.modal-consent{
  margin:4px 0 0;padding:14px 16px;
  border:1px solid var(--rule);border-radius:8px;
  background:var(--night-5);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;
  color:var(--cloud-5);line-height:1.6;
}

.modal-foot{
  padding:16px 28px 24px;border-top:1px solid var(--rule);
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  position:sticky;bottom:0;background:rgba(18,19,31,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.modal-foot .pager{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--cloud-5)}
.modal-foot .pager b{color:var(--major-1)}
.modal-foot .actions{display:flex;gap:10px}
.btn-sm{padding:12px 20px;font-size:13px;min-height:44px;border-radius:8px}
.btn-sm:active{transform:translateY(0) scale(.98)}
.modal-note{
  margin:8px 28px 0;padding:10px 14px;border:1px dashed var(--gold-3);
  background:rgba(255,195,15,.04);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;
  color:var(--gold-1);text-transform:uppercase;
}

.success{text-align:center;padding:44px 16px}
.success .ico{
  width:66px;height:66px;border:1.5px solid var(--osmium-3);border-radius:50%;
  margin:0 auto 24px;display:grid;place-items:center;color:var(--osmium-3);
  background:rgba(23,150,212,.08);
  box-shadow:0 0 0 8px rgba(23,150,212,.05), 0 0 40px -8px rgba(23,150,212,.4);
  animation:checkPop .4s var(--ease-out) both;
}
.success .ico svg{width:26px;height:26px}
.success h3{font-size:28px;font-weight:500;margin-bottom:12px;color:var(--major-1)}
.success p{color:var(--cloud-3);max-width:42ch;margin:0 auto}
.success .meta{margin-top:32px;font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cloud-5)}

/* ============ MODAL — mobile bottom sheet ============ */
@media (max-width:620px){
  .modal-backdrop{align-items:flex-end;padding:0}
  .modal{
    width:100%;max-height:92dvh;
    border-radius:20px 20px 0 0;
    border-left:none;border-right:none;border-bottom:none;
    transform:translateY(100%) scale(1);
  }
  .modal-backdrop.open .modal{transform:translateY(0) scale(1)}
  /* drag handle */
  .modal::before{
    content:'';display:block;
    width:40px;height:4px;border-radius:99px;
    background:var(--rule-strong);
    margin:12px auto 0;
  }
  .modal-head{padding:16px 20px}
  .modal-body{padding:20px 20px 12px}
  .modal-foot{padding:12px 20px 24px}
  .modal .progress{padding:14px 20px 0}
  .choices, .choices--3{grid-template-columns:1fr}
  .form-row--2{grid-template-columns:1fr}
  .step h3{font-size:22px}
  .step-head{margin-bottom:22px;padding-bottom:16px}
  .form-block{gap:18px}
}

/* ============ Float CTA mobile ============ */

/* ============ Reveal on scroll ============ */
.reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out)}
.reveal.in{opacity:1;transform:none}

/* Nav scroll shadow */
.nav.scrolled{box-shadow:0 1px 0 0 rgba(217,200,183,.06) inset}

@media (prefers-color-scheme:dark){
  :root{
    --gold-1:#F3E690;
    --gold-2:#FFC30F;
    --gold-3:#CC9900;
    --gold-4:#977A26;
  }
}