/* ============================================================
   Evolink — Editorial Dark
   Inspiração: Vercel/Linear/Claude — tipografia é o herói,
   um acento WhatsApp #25D366 reservado para ação.
   ============================================================ */

/* --------- fontes --------- */
@font-face{font-family:'Inter';src:url('/static/fonts/inter.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/static/fonts/jetbrainsmono.woff2') format('woff2-variations');
  font-weight:100 800;font-style:normal;font-display:swap}

/* --------- tokens --------- */
:root{
  --bg:        #09090b;
  --bg-elev:   #0f0f11;
  --panel:     #121214;
  --panel-2:   #161618;
  --ink:       #fafafa;
  --ink-2:     #d4d4d8;
  --dim:       #a1a1aa;
  --faint:     #71717a;
  --mute:      #52525b;
  --line:      rgba(255,255,255,.07);
  --line-2:    rgba(255,255,255,.11);
  --line-3:    rgba(255,255,255,.18);
  --accent:    #25D366;
  --accent-2:  #1EB258;
  --accent-ink:#052e16;
  --accent-soft:rgba(37,211,102,.10);
  --accent-line:rgba(37,211,102,.26);
  --warn:      #f59e0b;
  --red:       #ef4444;

  --f-sans:    'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --ease:      cubic-bezier(.2,.7,.2,1);
  --maxw:      1120px;

  --t-xs: 12px;
  --t-sm: 13px;
  --t-md: 15px;
  --t-lg: 17px;
  --t-xl: 20px;
  --t-2xl:24px;
  --t-3xl:32px;
  --t-4xl:44px;
  --t-5xl:64px;
  --t-6xl:88px;
}

@media (max-width: 768px){
  :root{ --t-5xl:44px; --t-6xl:56px; --t-4xl:32px; --t-3xl:26px; }
}

*,*::before,*::after{ box-sizing:border-box }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-sans);
  font-size:var(--t-md);
  line-height:1.6;
  font-feature-settings:'ss01','cv11';
  letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

::selection{ background:var(--accent); color:#052e16 }

a{ color:inherit; text-decoration:none }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0 }
img,svg{ display:block; max-width:100% }
code,pre{ font-family:var(--f-mono); font-size:.88em }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 32px }
.wrap--narrow{ max-width:860px }

@media (max-width:640px){ .wrap{ padding:0 20px } }

.skip{
  position:absolute; left:-9999px; top:0;
  padding:10px 14px; background:var(--accent); color:var(--accent-ink);
  border-radius:8px; font-weight:600; font-size:var(--t-sm);
}
.skip:focus{ left:16px; top:16px; z-index:999 }

/* ========================================================
   NAV — fino, hairline no bottom, logo mono
   ======================================================== */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(9,9,11,.72);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav__in{
  display:flex; align-items:center; gap:48px;
  height:60px;
}
.brand{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--ink); font-weight:600;
}
.brand__mark{
  width:22px; height:22px; color:var(--accent);
  flex:0 0 22px;
}
.brand__name{
  font-size:var(--t-lg);
  letter-spacing:-.02em;
  font-weight:600;
}
.nav__links{
  display:flex; align-items:center; gap:28px;
  flex:1;
}
.nav__links a{
  display:inline-flex; align-items:center; gap:7px;
  font-size:var(--t-sm);
  color:var(--dim);
  transition:color .15s var(--ease);
  position:relative;
}
.nav__links a svg{
  width:14px; height:14px;
  flex:0 0 auto;
  color:var(--faint);
  transition:color .15s var(--ease);
}
.nav__links a:hover{ color:var(--ink) }
.nav__links a:hover svg{ color:var(--accent) }
.nav__cta{ display:flex; gap:10px; align-items:center }
[hidden]{ display:none !important }
.nav__mobile{ display:none }
.nav__burger{
  display:none;
  width:40px; height:40px;
  align-items:center; justify-content:center;
  border:1px solid var(--line-2); border-radius:8px;
}
.nav__burger span{
  display:block; width:16px; height:1px; background:var(--ink);
  position:relative;
}
.nav__burger span:first-child{ transform:translateY(-4px) }
.nav__burger span:last-child{ transform:translateY(3px) }

@media (max-width:900px){
  .nav__links{ display:none }
  .nav__cta .btn--ghost{ display:none }
  .nav__burger{ display:inline-flex }
}
.nav__mobile{
  border-top:1px solid var(--line);
  padding:14px 32px 20px;
  display:flex; flex-direction:column; gap:14px;
  background:var(--bg-elev);
}
.nav__mobile a{
  display:inline-flex; align-items:center; gap:10px;
  font-size:var(--t-md); color:var(--ink-2);
}
.nav__mobile a svg{
  width:16px; height:16px;
  flex:0 0 auto;
  color:var(--faint);
}

/* ========================================================
   BUTTONS
   ======================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  padding:0 16px; height:36px;
  font-size:var(--t-sm); font-weight:500;
  border-radius:8px;
  border:1px solid transparent;
  transition:all .15s var(--ease);
  white-space:nowrap;
  letter-spacing:-.005em;
}
.btn--solid{
  background:var(--accent); color:var(--accent-ink);
  font-weight:600;
}
.btn--solid:hover{ background:var(--accent-2); transform:translateY(-1px) }
.btn--outline{
  border-color:var(--line-3);
  color:var(--ink);
  background:transparent;
}
.btn--outline:hover{ border-color:var(--ink); background:rgba(255,255,255,.04) }
.btn--ghost{
  color:var(--ink-2);
  background:transparent;
}
.btn--ghost:hover{ color:var(--ink); background:rgba(255,255,255,.04) }
.btn--lg{ height:44px; padding:0 20px; font-size:var(--t-md) }
.btn--sm{ height:28px; padding:0 10px; font-size:var(--t-xs); border-radius:6px }

/* ========================================================
   HERO — tipografia editorial + console vivo
   ======================================================== */
.hero{
  position:relative;
  min-height:70vh;
  padding:0;
  border-bottom:1px solid var(--line);
  overflow:hidden;
  display:flex;
  max-width:var(--maxw, 1120px);
  margin:0 auto;
}
.hero__type{
  flex:0 0 30%;
  max-width:30%;
}
.hero__console{
  flex:1;
  min-width:0;
}
.hero__grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events:none;
  opacity:.15;
}
.hero__type{
  position:relative;
  padding:64px 36px;
  display:flex; flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:20px;
  z-index:2;
  border-right:1px solid var(--line);
  justify-content:center;
}
.hero__type .eyebrow{ margin-bottom:0; }
.hero__type h1{
  font-size:28px;
  line-height:1.15;
  letter-spacing:-.03em;
  font-weight:600;
  margin:0;
  color:var(--ink);
}
.hero__type .lede{
  font-size:13px;
  line-height:1.5;
  color:var(--dim);
  margin:0;
}
.hero__type .hero__actions{ margin-top:4px; }
.hero__actions .btn--solid{
  background:var(--accent);
  color:#09090b;
  border-color:var(--accent);
}
@media (max-width:768px){
  .hero{ flex-direction:column }
  .hero__type{ flex:none; max-width:100%; border-right:none; border-bottom:1px solid var(--line); padding:48px 24px 32px }
  .hero__type h1{ font-size:32px }
  .hero__console{ min-height:260px }
  .hero__console .console__body{ min-height:200px; height:auto }
}
@media (max-width:480px){
  .hero__type h1{ font-size:24px }
}

/* Console as hero visual — conteúdo centralizado verticalmente na hero */
.hero__console{
  position:relative;
  z-index:1;
  margin:0;
  border-radius:0;
  border:none;
  border-left:1px solid var(--line);
  box-shadow:
    0 1px 0 rgba(255,255,255,.04) inset,
    0 0 80px -30px rgba(37,211,102,.08);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero__console .console__bar{
  border-bottom:1px solid var(--line-2);
  background:none;
}
.hero__console .console__body{
  min-height:340px;
  height:auto;
}
@media (max-width:900px){
  .hero__console{ margin:0 16px 32px; transform:rotate(0deg) }
  .hero__console .console__body{ min-height:200px }
}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px;
  color:var(--accent);
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.pulse-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 0 var(--accent);
  animation:pulse 2.2s var(--ease) infinite;
}
@keyframes pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(37,211,102,.6) }
  50%    { box-shadow:0 0 0 7px rgba(37,211,102,0) }
}

.hero h1{
  font-size:var(--t-6xl);
  line-height:1.02;
  letter-spacing:-.045em;
  font-weight:600;
  margin:0 0 8px;
  color:var(--ink);
}
.lede{
  font-size:var(--t-lg);
  line-height:1.55;
  color:var(--dim);
  margin:0 0 28px;
  max-width:54ch;
  letter-spacing:-.008em;
}
.hero__actions{
  display:flex; gap:12px; align-items:center;
}
.btn--solid{
  position:relative;
  box-shadow:0 0 24px -6px var(--accent);
}
.btn--solid:hover{
  box-shadow:0 0 32px -4px var(--accent);
}
@media (max-width:480px){
  .hero__actions{ flex-direction:column; align-items:stretch }
  .hero__actions .btn{ width:100% }
}
.hero__trust{
  list-style:none; padding:0; margin:0;
  display:flex; gap:20px; flex-wrap:wrap;
  font-size:11px;
  color:var(--faint);
  letter-spacing:.03em;
}

/* -------- Console -------- */
.console{
  background:var(--panel);
  border:1px solid var(--line-2);
  border-radius:12px;
  overflow:hidden;
  box-shadow:
    0 1px 0 rgba(255,255,255,.04) inset,
    0 24px 60px -32px rgba(0,0,0,.9),
    0 8px 20px -8px rgba(0,0,0,.5);
}
.console__bar{
  display:flex; align-items:center; gap:14px;
  padding:12px 16px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent);
}
.console__dots{ display:inline-flex; gap:7px }
.console__dots i{
  width:11px; height:11px; border-radius:50%;
  background:rgba(255,255,255,.12);
}
.console__title{
  flex:1;
  font-family:var(--f-mono);
  font-size:var(--t-xs);
  color:var(--faint);
  text-align:center;
  letter-spacing:0;
}
.console__status{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--f-mono);
  font-size:11px;
  color:var(--dim);
}
.console__body{ display:flex; flex-direction:column }
.console__req{
  padding:18px 20px;
  border-bottom:1px solid var(--line);
  background:#0a0a0c;
}
.console__req pre{
  margin:0;
  font-family:var(--f-mono);
  font-size:13px; line-height:1.65;
  color:var(--ink-2);
  white-space:pre-wrap; word-break:break-word;
  min-height:84px;
}
.console__req code{ color:inherit; background:none; padding:0 }
.caret{
  display:inline-block;
  width:7px; height:14px;
  background:var(--accent);
  vertical-align:-2px; margin-left:2px;
  animation:blink 1s steps(1) infinite;
}
@keyframes blink{ 50%{ opacity:0 } }
.console__res{
  padding:16px 20px;
}
.console__res-head{
  display:flex; align-items:center; gap:12px;
  margin-bottom:12px;
  font-family:var(--f-mono); font-size:11px;
}
.tag{
  display:inline-flex; align-items:center;
  padding:3px 8px; border-radius:5px;
  font-size:11px; font-weight:500;
  font-family:var(--f-mono);
  background:var(--panel-2);
  border:1px solid var(--line-2);
  color:var(--dim);
}
.tag--ok{ color:var(--accent); border-color:var(--accent-line); background:var(--accent-soft) }
.console__time{
  color:var(--faint); font-family:var(--f-mono); font-size:11px;
  margin-left:auto;
}
.console__out{
  margin:0;
  font-family:var(--f-mono);
  font-size:12.5px; line-height:1.6;
  color:var(--dim);
  min-height:72px;
  max-height:200px; overflow:auto;
}
.copy{ margin-left:auto }

/* ========================================================
   SECTIONS — sem cards decorativos, hairline rules
   ======================================================== */
.section{
  padding:112px 0;
  border-bottom:1px solid var(--line);
}
.section--alt{ background:var(--bg-elev) }
@media (max-width:768px){ .section{ padding:72px 0 } }

.section__head{
  margin-bottom:64px;
  max-width:720px;
}
.section__head .eyebrow{ margin-bottom:16px }
.section__head h2{
  font-size:var(--t-4xl);
  line-height:1.1;
  letter-spacing:-.03em;
  font-weight:600;
  margin:0 0 16px;
  color:var(--ink);
}
.section__sub{
  margin:0;
  font-size:var(--t-md);
  color:var(--dim);
  max-width:52ch;
}

/* -------- Grid3 (recursos) — hairline rules, sem cards -------- */
.grid3{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
.grid3 .card{
  padding:36px 32px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:transparent;
  transition:background .2s var(--ease);
}
.grid3 .card:hover{ background:rgba(255,255,255,.015) }
.card__head{ margin-bottom:12px }
.card__head h3{
  font-size:var(--t-lg);
  font-weight:600;
  letter-spacing:-.015em;
  margin:0;
  color:var(--ink);
}
.card__body p{
  margin:0;
  font-size:var(--t-sm);
  line-height:1.65;
  color:var(--dim);
}

@media (max-width:900px){ .grid3{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){ .grid3{ grid-template-columns:1fr } }

/* -------- Steps -------- */
.track{
  position:relative;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:32px;
  padding-top:8px;
}
.track__line{
  position:absolute;
  top:27px; left:16.6%; right:16.6%;
  height:1px;
  background:linear-gradient(90deg, var(--accent-line), var(--line-2) 50%, var(--line));
}
.track__node{
  position:relative;
  display:flex; flex-direction:column; align-items:center;
  text-align:center;
  gap:14px;
}
.track__dot{
  position:relative;
  width:54px; height:54px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:var(--bg-elev);
  border:1px solid var(--line-2);
  box-shadow:0 0 0 6px var(--bg-elev);
}
.track__node:first-child .track__dot{
  border-color:var(--accent);
  background:var(--accent-soft);
}
.track__num{
  font-family:var(--f-mono);
  font-size:13px;
  color:var(--dim);
  letter-spacing:.02em;
}
.track__node:first-child .track__num{ color:var(--accent) }
.track__check{
  position:absolute;
  inset:0;
  display:flex; align-items:center; justify-content:center;
  color:var(--accent);
  opacity:0;
}
.track__label{
  font-size:var(--t-lg);
  font-weight:600;
  letter-spacing:-.015em;
  color:var(--ink);
}
.track__card{
  border:1px solid var(--line);
  border-radius:10px;
  padding:18px 20px;
  background:var(--panel);
  width:100%;
  flex:1 1 auto;
  display:flex; flex-direction:column;
  text-align:left;
}
.track__card p{
  margin:0;
  font-size:var(--t-sm);
  color:var(--dim);
  line-height:1.65;
}

/* ---- mini-card padronizado ---- */
.track__card .track__desc{
  margin:0 0 14px;
  font-size:var(--t-sm);
  color:var(--dim);
  line-height:1.65;
}
.track__list{
  list-style:none; padding:0; margin:0 0 14px;
  border-top:1px solid var(--line);
  padding-top:14px;
  display:flex; flex-direction:column; gap:9px;
}
.track__list li{
  font-size:var(--t-sm);
  color:var(--ink-2);
  line-height:1.5;
  display:flex; align-items:center; gap:9px;
}
.track__txt{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.track__list li::before{
  content:'';
  width:13px; height:13px; flex:0 0 13px;
  background:var(--accent);
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") no-repeat center / contain;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") no-repeat center / contain;
}
.track__meta{
  margin-top:auto;
  display:flex; align-items:center; gap:7px;
  padding-top:12px;
  border-top:1px solid var(--line);
  font-family:var(--f-mono);
  font-size:11px;
  color:var(--faint);
  letter-spacing:.01em;
}
.track__meta span{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.track__meta-icon{ color:var(--accent); flex:0 0 13px }
@media (max-width:900px){
  .track{ grid-template-columns:1fr; gap:0 }
  .track__line{
    top:27px; left:27px; right:auto;
    width:1px; height:calc(100% - 54px);
    background:linear-gradient(180deg, var(--accent-line), var(--line-2) 50%, var(--line));
  }
  .track__node{
    flex-direction:row; align-items:flex-start;
    text-align:left; gap:20px; padding:0 0 40px;
  }
  .track__dot{ flex:0 0 54px }
  .track__card{ padding:14px 16px; width:auto }
}

/* -------- Strip (tabela editorial de endpoints) -------- */
.strip{
  display:grid; grid-template-columns:1.1fr 1.3fr 1.6fr;
  border-top:1px solid var(--line-2);
}
.strip > *{
  padding:16px 20px;
  border-bottom:1px solid var(--line);
  font-size:var(--t-sm);
  color:var(--ink-2);
  display:flex; align-items:center;
}
.strip__k,.strip__v,.strip__d{
  font-family:var(--f-mono);
  font-size:11px;
  color:var(--faint);
  letter-spacing:.04em;
  text-transform:uppercase;
  background:var(--panel);
}
.strip .code{
  font-family:var(--f-mono);
  font-size:12.5px;
  color:var(--accent);
}
@media (max-width:720px){
  .strip{ grid-template-columns:1fr }
  .strip__k,.strip__v,.strip__d{ display:none }
  .strip > *{ padding:12px 16px }
}

/* -------- Plans — tabela editorial, não cards flutuantes -------- */
.plans{
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line-2);
  border-left:1px solid var(--line);
}
@media (max-width:960px){ .plans{ grid-template-columns:1fr } }
.plan{
  padding:40px 32px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  display:flex; flex-direction:column;
  background:transparent;
  position:relative;
  transition:background .2s var(--ease);
}
.plan:hover{ background:rgba(255,255,255,.015) }
.plan__flag{
  font-size:var(--t-xs);
  font-family:var(--f-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--faint);
  margin-bottom:24px;
}
.plan__price{
  display:flex; align-items:baseline; gap:4px;
  margin-bottom:8px;
  color:var(--ink);
}
.plan__label{
  font-size:var(--t-md);
  color:var(--dim);
  font-weight:500;
}
.plan__val{
  font-size:var(--t-5xl);
  font-weight:600;
  line-height:1;
  letter-spacing:-.03em;
}
.plan__per{
  font-size:var(--t-sm);
  color:var(--dim);
  margin-left:4px;
}
.plan__limit{
  font-size:var(--t-sm);
  color:var(--dim);
  margin:0 0 24px;
}
.plan__list{
  list-style:none; padding:0; margin:0 0 32px;
  display:flex; flex-direction:column; gap:10px;
  flex:1;
}
.plan__list li{
  font-size:var(--t-sm);
  color:var(--ink-2);
  display:flex; align-items:flex-start; gap:10px;
  line-height:1.5;
}
.plan__list li::before{
  content:'';
  width:14px; height:14px; flex:0 0 14px;
  margin-top:3px;
  background:
    linear-gradient(45deg, transparent 45%, var(--accent) 45% 55%, transparent 55%) 0 0/14px 14px,
    linear-gradient(-45deg, transparent 45%, var(--accent) 45% 55%, transparent 55%) 0 0/14px 14px;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") no-repeat center / contain;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") no-repeat center / contain;
  background:var(--accent);
}
.plan__cta{ margin-top:auto; width:100% }
.plans__note{
  margin:40px 0 0;
  font-size:var(--t-xs);
  color:var(--faint);
  text-align:center;
}

/* -------- FAQ -------- */
.faq{
  border-top:1px solid var(--line-2);
}
.faq details{
  border-bottom:1px solid var(--line);
  padding:4px 0;
}
.faq summary{
  padding:22px 0;
  cursor:pointer;
  list-style:none;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px;
  font-size:var(--t-lg);
  font-weight:500;
  letter-spacing:-.015em;
  color:var(--ink);
}
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{
  content:'';
  width:12px; height:12px;
  background:
    linear-gradient(var(--dim),var(--dim)) center/12px 1.5px no-repeat,
    linear-gradient(var(--dim),var(--dim)) center/1.5px 12px no-repeat;
  transition:transform .25s var(--ease);
}
.faq details[open] summary::after{
  background:linear-gradient(var(--dim),var(--dim)) center/12px 1.5px no-repeat;
  transform:rotate(180deg);
}
.faq details p{
  margin:0 0 24px;
  font-size:var(--t-md);
  color:var(--dim);
  line-height:1.65;
  max-width:72ch;
}
.faq details code{
  background:var(--panel);
  padding:2px 6px; border-radius:4px;
  color:var(--ink-2);
  font-size:.88em;
}

/* -------- CTA final -------- */
.cta{
  padding:112px 0;
  border-bottom:1px solid var(--line);
}
.cta__in{
  display:flex; align-items:center; justify-content:space-between;
  gap:40px;
}
@media (max-width:768px){
  .cta{ padding:72px 0 }
  .cta__in{ flex-direction:column; align-items:flex-start }
}
.cta h2{
  font-size:var(--t-4xl);
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:600;
  margin:0 0 10px;
}
.cta p{
  margin:0;
  font-size:var(--t-md);
  color:var(--dim);
}
.cta__actions{ display:flex; gap:12px }

/* ========================================================
   FOOTER
   ======================================================== */
.foot{
  padding:48px 0 0;
  background:var(--bg);
}
.foot__in{
  display:grid; grid-template-columns:1.6fr repeat(3, 1fr);
  gap:48px;
  margin-bottom:32px;
}
@media (max-width:768px){ .foot__in{ grid-template-columns:1fr 1fr; gap:32px } }
@media (max-width:480px){ .foot__in{ grid-template-columns:1fr } }

.foot__brand .brand__name{
  font-size:var(--t-lg);
  color:var(--ink);
  margin-bottom:12px;
  display:inline-block;
}
.foot__brand p{
  margin:4px 0 0;
  font-size:var(--t-sm);
  color:var(--faint);
  max-width:36ch;
  line-height:1.6;
}
.foot__col h4{
  font-size:11px;
  font-weight:500;
  color:var(--faint);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:0 0 16px;
}
.foot__col{
  display:flex; flex-direction:column;
}
.foot__col a{
  font-size:var(--t-sm);
  color:var(--dim);
  padding:6px 0;
  transition:color .15s var(--ease);
}
.foot__col a:hover{ color:var(--ink) }

.foot__bar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 0;
  box-shadow:inset 0 1px 0 var(--line);   /* separador sem somar altura */
  font-size:var(--t-xs);
  color:var(--faint);
}
@media (max-width:640px){ .foot__bar{ flex-direction:column; gap:8px; padding:16px 0 } }

/* ========================================================
   FOCO ACESSÍVEL
   ======================================================== */
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:4px;
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}

/* ============================================================
   Adendo: ícones Phosphor + ajustes largura 1120
   ============================================================ */
svg{ flex-shrink:0 }
.btn svg{ opacity:.95 }
.btn--solid svg{ color:var(--accent-ink) }
.card__head{
  display:flex; align-items:center; gap:12px;
  margin-bottom:12px;
}
.card__ico{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px;
  border-radius:9px;
  background:var(--accent-soft);
  color:var(--accent);
  border:1px solid var(--accent-line);
  flex:0 0 36px;
}
.plan__flag{
  display:inline-flex; align-items:center; gap:8px;
  font-size:var(--t-xs);
  font-family:var(--f-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:24px;
}
.plan__flag svg{ color:var(--accent) }
.foot__brand .brand{ margin-bottom:12px; display:inline-flex; align-items:center; gap:10px }
.foot__brand .brand__name{ font-size:var(--t-lg); color:var(--ink); margin:0 }
.foot__brand .brand__mark{ color:var(--accent) }
.foot__col a{ display:inline-flex; align-items:center; gap:8px }
.foot__col a svg{ color:var(--faint); transition:color .15s var(--ease) }
.foot__col a:hover svg{ color:var(--accent) }

/* nav burger agora tem svg */
.nav__burger{ color:var(--ink) }
.nav__burger svg{ display:block }

/* ============================================================
   HOTFIX ícones — forçar dimensões vindas do atributo width/height
   ============================================================ */
svg{
  display:inline-block;
  flex-shrink:0;
  vertical-align:middle;
  max-width:none;
  width:auto; height:auto;
}
.brand__mark{ width:22px !important; height:22px !important; color:var(--accent) }
.card__ico svg{ width:22px !important; height:22px !important }
.btn svg{ width:14px; height:14px }
.btn--lg svg{ width:16px; height:16px }
.btn--sm svg{ width:12px; height:12px }
.plan__flag svg{ width:16px; height:16px }
.foot__col a svg{ width:14px; height:14px }
.nav__burger svg{ width:20px; height:20px }