/* ============================================================
   Evolink — folha de estilo
   Estética: console de operação. Grafite profundo, verde de
   sinal, tipografia grotesca.
   ============================================================ */

:root{
  --bg:            #080B0A;
  --bg-2:          #0C1110;
  --surface:       #111716;
  --surface-2:     #161D1C;
  --line:          rgba(255,255,255,.085);
  --line-strong:   rgba(255,255,255,.16);

  --text:          #E8EDEB;
  --text-2:        #9BAAA6;
  --text-3:        #6B7A76;

  --signal:        #25D366;
  --signal-dim:    #129E4A;
  --signal-soft:   rgba(37,211,102,.12);
  --amber:         #F2B94B;
  --red:           #FF6B5E;
  --cyan:          #4FD1C5;

  --font-display:  'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-body:     'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-mono:     'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace;

  --ease-spring:   cubic-bezier(.34,1.56,.64,1);
  --ease-out:      cubic-bezier(.22,1,.36,1);

  --shadow-1: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px -8px rgba(0,0,0,.55);
  --shadow-2: 0 2px 4px rgba(0,0,0,.4), 0 24px 56px -12px rgba(0,0,0,.7);
  --glow:     0 0 0 1px rgba(37,211,102,.25), 0 8px 32px -8px rgba(37,211,102,.35);

  --r-sm: 8px;
  --r:    14px;
  --r-lg: 20px;
  --maxw: 1200px;
}

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

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

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.62;
  letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body::before{
  content:'';
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(900px 500px at 78% -8%, rgba(37,211,102,.07), transparent 62%),
    radial-gradient(700px 420px at 8% 8%, rgba(79,209,197,.045), transparent 60%);
}

img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
code,pre{ font-family:var(--font-mono); }

.wrap{ width:min(100% - 2.6rem, var(--maxw)); margin-inline:auto; position:relative; z-index:1; }
.wrap--narrow{ width:min(100% - 2.6rem, 780px); }

.skip{
  position:absolute; left:-9999px; top:0; z-index:99;
  background:var(--signal); color:#04160A; padding:.7rem 1.1rem; font-weight:600;
}
.skip:focus{ left:1rem; top:1rem; }

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

/* ==================== NAV ==================== */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(8,11,10,.72);
  backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease-out), background .3s var(--ease-out);
}
.nav.is-scrolled{
  border-bottom-color:var(--line);
  background:rgba(8,11,10,.92);
}
.nav__in{
  display:flex; align-items:center; gap:2rem;
  height:68px;
}
.brand{ display:flex; align-items:center; gap:.62rem; flex-shrink:0; }
.brand__mark{ width:30px; height:30px; }
.brand__name{
  font-family:var(--font-display);
  font-weight:700; font-size:1.16rem; letter-spacing:-.03em;
}
.nav__links{
  display:flex; gap:1.7rem; margin-left:auto;
  font-size:.925rem; color:var(--text-2);
}
.nav__links a{ transition:color .18s; position:relative; }
.nav__links a::after{
  content:''; position:absolute; left:0; bottom:-5px; height:1.5px; width:0;
  background:var(--signal); transition:width .25s var(--ease-out);
}
.nav__links a:hover{ color:var(--text); }
.nav__links a:hover::after{ width:100%; }
.nav__cta{ display:flex; gap:.6rem; }
.nav__burger{ display:none; }
.nav__mobile{ display:none; }

/* ==================== BOTÕES ==================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.68rem 1.15rem;
  border-radius:10px;
  font-family:var(--font-display);
  font-weight:600; font-size:.91rem; letter-spacing:-.01em;
  border:1px solid transparent;
  transition:transform .1s var(--ease-spring), background .2s, border-color .2s, box-shadow .25s, color .2s;
  white-space:nowrap;
}
.btn:active:not(:disabled){ transform:scale(.97); }

.btn--solid{
  background:var(--signal); color:#04160A;
  box-shadow:0 1px 2px rgba(0,0,0,.35), 0 8px 22px -10px rgba(37,211,102,.85);
}
.btn--solid:hover{ background:#2FDD71; box-shadow:var(--glow); }

.btn--outline{
  border-color:var(--line-strong); color:var(--text); background:rgba(255,255,255,.02);
}
.btn--outline:hover{ border-color:rgba(37,211,102,.5); background:var(--signal-soft); }

.btn--ghost{ color:var(--text-2); }
.btn--ghost:hover{ color:var(--text); background:rgba(255,255,255,.05); }

.btn--lg{ padding:.86rem 1.5rem; font-size:.98rem; border-radius:12px; }
.btn--full{ width:100%; }

/* ==================== HERO ==================== */
.hero{
  position:relative;
  padding:clamp(3.4rem,7vw,6rem) 0 clamp(3rem,6vw,5rem);
  border-bottom:1px solid var(--line);
}
.hero__grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 0%, #000 30%, transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 0%, #000 30%, transparent 78%);
}
.hero__in{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:clamp(2rem,5vw,4.2rem);
  align-items:center;
}

.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--font-mono);
  font-size:.735rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--signal); margin:0 0 1.15rem;
}
.eyebrow .pulse-dot{ flex-shrink:0; }

.pulse-dot{
  position:relative; width:7px; height:7px; border-radius:50%;
  background:var(--signal); display:inline-block;
}
.pulse-dot::after{
  content:''; position:absolute; inset:-2px; border-radius:50%;
  background:var(--signal); opacity:.5;
  animation:pulse 2.4s infinite ease-out;
}
@keyframes pulse{
  0%{ transform:scale(1); opacity:.5; }
  70%{ transform:scale(2.6); opacity:0; }
  100%{ opacity:0; }
}

.hero h1{
  font-family:var(--font-display);
  font-size:clamp(2.1rem,4.4vw,3.5rem);
  line-height:1.06; letter-spacing:-.038em; font-weight:700;
  margin:0 0 1.15rem;
}
.hero h1::selection{ background:var(--signal); color:#04160A; }

.lede{
  font-size:clamp(1rem,1.35vw,1.09rem);
  color:var(--text-2); max-width:56ch; margin:0 0 1.9rem;
}
.hero__actions{ display:flex; gap:.75rem; flex-wrap:wrap; margin-bottom:1.9rem; }
.hero__trust{
  display:flex; gap:1.4rem; flex-wrap:wrap;
  list-style:none; margin:0; padding:0;
  font-family:var(--font-mono); font-size:.77rem;
  color:var(--text-3); letter-spacing:.02em;
}
.hero__trust li{ display:flex; align-items:center; gap:.45rem; }
.hero__trust li::before{
  content:''; width:4px; height:4px; background:var(--signal-dim); border-radius:50%;
}

/* ---------- console ---------- */
.console{
  background:linear-gradient(180deg, var(--surface-2), var(--surface));
  border:1px solid var(--line-strong);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-2);
  overflow:hidden;
  font-size:.83rem;
}
.console__bar{
  display:flex; align-items:center; gap:.8rem;
  padding:.7rem .95rem;
  border-bottom:1px solid var(--line);
  background:rgba(0,0,0,.3);
}
.console__dots{ display:flex; gap:.34rem; }
.console__dots i{ width:9px; height:9px; border-radius:50%; background:#2A3431; }
.console__dots i:first-child{ background:#3B2A28; }
.console__dots i:nth-child(2){ background:#3B372A; }
.console__dots i:last-child{ background:#24352B; }
.console__title{
  font-family:var(--font-mono); font-size:.71rem; color:var(--text-3);
  letter-spacing:.05em;
}
.console__status{
  margin-left:auto; display:flex; align-items:center; gap:.42rem;
  font-family:var(--font-mono); font-size:.7rem; color:var(--signal);
}
.console__status .pulse-dot{ width:5px; height:5px; }

.console__body{ padding:.9rem .95rem 1rem; }
.console__req pre{ margin:0 0 .8rem; }
.console__req code{
  font-size:.79rem; color:var(--cyan); white-space:pre-wrap; word-break:break-all;
  line-height:1.6;
}
.caret{
  display:inline-block; width:7px; height:1.05em; vertical-align:-.18em;
  background:var(--signal); animation:blink 1.05s steps(1) infinite;
}
@keyframes blink{ 50%{ opacity:0; } }

.console__res{
  background:rgba(0,0,0,.42);
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  padding:.7rem .8rem;
}
.console__res-head{
  display:flex; align-items:center; gap:.6rem; margin-bottom:.55rem;
}
.tag{
  font-family:var(--font-mono); font-size:.68rem; font-weight:500;
  padding:.14rem .48rem; border-radius:5px; letter-spacing:.03em;
}
.tag--ok{ background:rgba(37,211,102,.15); color:var(--signal); }
.console__time{ font-family:var(--font-mono); font-size:.68rem; color:var(--text-3); margin-left:auto; }
.console__res code{
  font-size:.745rem; color:var(--text-2); white-space:pre-wrap; word-break:break-word;
  line-height:1.66; display:block;
}
.console__res code .k{ color:#8AB4F8; }
.console__res code .s{ color:#A5D6A7; }
.console__res code .n{ color:var(--amber); }
.console__res code .b{ color:#CE93D8; }

.console__foot{ padding:.7rem .95rem; border-top:1px solid var(--line); background:rgba(0,0,0,.22); }
.copy{
  display:flex; align-items:center; gap:.7rem; width:100%;
  background:none; border:0; padding:.2rem 0;
  font-family:var(--font-mono); font-size:.765rem; color:var(--text-3);
  transition:color .2s; text-align:left;
}
.copy em{ margin-left:auto; font-style:normal; font-size:.68rem; color:var(--signal); opacity:0; transition:opacity .2s; }
.copy:hover{ color:var(--text); }
.copy:hover em{ opacity:1; }
.copy.is-done{ color:var(--signal); }
.copy.is-done em{ opacity:1; }

/* ==================== STRIP ==================== */
.strip{ border-bottom:1px solid var(--line); background:var(--bg-2); }
.strip__in{
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:1px; background:var(--line);
}
.strip__item{
  background:var(--bg-2); padding:1.35rem 1.2rem;
  display:flex; flex-direction:column; gap:.2rem;
}
.strip__k{
  font-family:var(--font-mono); font-size:.69rem; letter-spacing:.11em;
  text-transform:uppercase; color:var(--text-3);
}
.strip__v{
  font-family:var(--font-display); font-size:1.42rem; font-weight:600;
  letter-spacing:-.03em; color:var(--text); font-variant-numeric:tabular-nums;
}
.strip__d{ font-size:.795rem; color:var(--text-2); }

/* ==================== SEÇÕES ==================== */
.section{ padding:clamp(3.6rem,7vw,6rem) 0; position:relative; }
.section--alt{
  background:var(--bg-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.section__head{ max-width:640px; margin-bottom:2.9rem; }
.section__head--center{ margin-inline:auto; text-align:center; max-width:600px; }
.section h2{
  font-family:var(--font-display);
  font-size:clamp(1.65rem,3vw,2.4rem);
  line-height:1.14; letter-spacing:-.034em; font-weight:700; margin:0 0 .7rem;
}
.section__sub{ color:var(--text-2); margin:0; font-size:1rem; }

/* ==================== STEPS ==================== */
.steps{ list-style:none; margin:0; padding:0; display:grid; gap:1px; background:var(--line); }
.step{
  display:grid; grid-template-columns:auto 1fr; gap:1.6rem;
  padding:1.7rem 1.5rem; background:var(--bg);
  align-items:start;
  transition:background .25s;
}
.step:hover{ background:var(--surface); }
.step__n{
  font-family:var(--font-mono); font-size:.95rem; font-weight:500;
  color:var(--signal); padding-top:.15rem; font-variant-numeric:tabular-nums;
}
.step__body h3{
  font-family:var(--font-display); font-size:1.14rem; font-weight:600;
  margin:0 0 .4rem; letter-spacing:-.02em;
}
.step__body p{ margin:0; color:var(--text-2); max-width:62ch; }
.step__body code, .section code{
  font-size:.855em; background:rgba(255,255,255,.06);
  padding:.1rem .38rem; border-radius:5px; color:var(--cyan);
}

/* ==================== BENTO ==================== */
.bento{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:1.5rem;
  display:flex; flex-direction:column; gap:.6rem;
  transition:border-color .25s, transform .25s var(--ease-out), background .25s;
  position:relative; overflow:hidden;
}
.card:hover{
  border-color:rgba(37,211,102,.3);
  background:var(--surface-2);
  transform:translateY(-2px);
}
.card h3{
  font-family:var(--font-display); font-size:1.06rem; font-weight:600;
  margin:0; letter-spacing:-.02em;
}
.card p{ margin:0; color:var(--text-2); font-size:.925rem; }
.card--wide{ grid-column:span 2; }
.card--wide2{ grid-column:span 2; }
.card--tall{ grid-row:span 2; }

.card__code{
  margin-top:auto; padding-top:.7rem;
  font-size:.735rem; color:var(--text-3); letter-spacing:.02em;
}

.meter{ display:flex; flex-direction:column; gap:.4rem; margin:.5rem 0 .3rem; }
.meter span{
  height:5px; border-radius:3px; background:rgba(255,255,255,.06);
  position:relative; overflow:hidden;
}
.meter span::after{
  content:''; position:absolute; inset:0 auto 0 0; width:var(--w);
  background:linear-gradient(90deg, var(--signal-dim), var(--signal));
  border-radius:3px;
  animation:fill 1.8s var(--ease-out) both;
}
@keyframes fill{ from{ width:0; } }

.chips{ list-style:none; margin:.3rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.42rem; }
.chips li{
  font-family:var(--font-mono); font-size:.715rem;
  padding:.26rem .6rem; border-radius:6px;
  border:1px solid var(--line); color:var(--text-2);
  background:rgba(255,255,255,.02);
  transition:border-color .2s, color .2s;
}
.card:hover .chips li{ border-color:rgba(37,211,102,.22); }
.chips li:hover{ color:var(--signal); border-color:rgba(37,211,102,.5); }

/* ==================== TOGGLE ==================== */
.toggle{
  display:inline-flex; gap:.25rem; margin-top:1.7rem;
  padding:.28rem; border:1px solid var(--line); border-radius:11px;
  background:var(--surface);
}
.toggle__btn{
  background:none; border:0; padding:.5rem 1.05rem; border-radius:8px;
  font-family:var(--font-display); font-weight:600; font-size:.87rem;
  color:var(--text-2); transition:background .2s, color .2s;
  display:inline-flex; align-items:center; gap:.4rem;
}
.toggle__btn.is-on{ background:rgba(37,211,102,.14); color:var(--signal); }
.toggle__btn span{
  font-family:var(--font-mono); font-size:.68rem; font-weight:500;
  background:var(--signal); color:#04160A; padding:.06rem .34rem; border-radius:4px;
}

/* ==================== PLANOS ==================== */
.plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; align-items:start; }
.plan{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:1.9rem 1.6rem;
  display:flex; flex-direction:column; gap:1rem;
  position:relative;
  transition:border-color .25s, transform .25s var(--ease-out);
}
.plan:hover{ border-color:var(--line-strong); transform:translateY(-3px); }
.plan--featured{
  border-color:rgba(37,211,102,.42);
  background:linear-gradient(180deg, rgba(37,211,102,.055), var(--surface) 40%);
  box-shadow:var(--shadow-1), 0 0 60px -24px rgba(37,211,102,.5);
}
.plan__flag{
  position:absolute; top:-.72rem; left:1.6rem;
  font-family:var(--font-mono); font-size:.67rem; letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--signal); color:#04160A;
  padding:.24rem .6rem; border-radius:5px; font-weight:600;
}
.plan__name{
  font-family:var(--font-display); font-size:1.24rem; font-weight:600;
  margin:0; letter-spacing:-.024em;
}
.plan__desc{ margin:0; color:var(--text-2); font-size:.9rem; min-height:2.6em; }
.plan__price{
  display:flex; align-items:baseline; gap:.18rem; margin:.2rem 0 .3rem;
  font-family:var(--font-display); font-variant-numeric:tabular-nums;
}
.plan__price .cur{ font-size:1.02rem; color:var(--text-2); font-weight:500; }
.plan__price .val{ font-size:2.7rem; font-weight:700; letter-spacing:-.045em; line-height:1; }
.plan__price .per{ font-size:.88rem; color:var(--text-3); font-family:var(--font-body); }
.plan__list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.62rem;
  font-size:.9rem; color:var(--text-2);
  border-top:1px solid var(--line); padding-top:1.1rem;
}
.plan__list li{ display:flex; gap:.6rem; align-items:flex-start; }
.plan__list li::before{
  content:''; flex-shrink:0; width:15px; height:15px; margin-top:.24rem;
  border-radius:50%; background:rgba(37,211,102,.14);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2325D366' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size:10px; background-repeat:no-repeat; background-position:center;
}
.plan .btn{ margin-top:auto; }
.plans__note{
  text-align:center; color:var(--text-3); font-size:.86rem; margin:2rem 0 0;
}

/* ==================== FAQ ==================== */
.faq{ display:flex; flex-direction:column; }
.faq details{ border-bottom:1px solid var(--line); }
.faq details:first-child{ border-top:1px solid var(--line); }
.faq summary{
  padding:1.15rem .2rem; cursor:pointer; list-style:none;
  font-family:var(--font-display); font-weight:600; font-size:1.02rem;
  letter-spacing:-.018em;
  display:flex; align-items:center; gap:1rem;
  transition:color .2s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:''; margin-left:auto; flex-shrink:0;
  width:11px; height:11px;
  border-right:1.8px solid var(--text-3); border-bottom:1.8px solid var(--text-3);
  transform:rotate(45deg) translateY(-3px);
  transition:transform .28s var(--ease-out), border-color .2s;
}
.faq details[open] summary::after{
  transform:rotate(225deg) translateY(-1px);
  border-color:var(--signal);
}
.faq summary:hover{ color:var(--signal); }
.faq details p{
  margin:0; padding:0 2.6rem 1.35rem .2rem;
  color:var(--text-2); max-width:70ch;
}
.faq details p code{
  font-size:.86em; background:rgba(255,255,255,.06);
  padding:.08rem .34rem; border-radius:5px; color:var(--cyan);
}

/* ==================== CTA ==================== */
.cta{
  padding:clamp(3rem,6vw,5rem) 0;
  border-top:1px solid var(--line);
  background:
    radial-gradient(600px 260px at 50% 100%, rgba(37,211,102,.09), transparent 70%),
    var(--bg);
}
.cta__in{
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem; flex-wrap:wrap;
}
.cta h2{
  font-family:var(--font-display);
  font-size:clamp(1.5rem,2.7vw,2.15rem); font-weight:700;
  letter-spacing:-.034em; margin:0 0 .35rem; line-height:1.14;
}
.cta p{ margin:0; color:var(--text-2); }
.cta__actions{ display:flex; gap:.7rem; flex-wrap:wrap; }

/* ==================== FOOTER ==================== */
.foot{ border-top:1px solid var(--line); background:var(--bg-2); padding:3rem 0 1.4rem; }
.foot__in{
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
  gap:2.4rem; padding-bottom:2.4rem;
}
.foot__brand p{
  color:var(--text-3); font-size:.865rem; margin:.7rem 0 0; max-width:38ch;
}
.foot__col{ display:flex; flex-direction:column; gap:.6rem; }
.foot__col h4{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.13em;
  text-transform:uppercase; color:var(--text-3); margin:0 0 .35rem; font-weight:500;
}
.foot__col a{
  font-size:.885rem; color:var(--text-2); transition:color .18s;
  width:fit-content;
}
.foot__col a:hover{ color:var(--signal); }
.foot__bar{
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  border-top:1px solid var(--line); padding-top:1.3rem;
  font-family:var(--font-mono); font-size:.735rem; color:var(--text-3);
}

/* ==================== REVEAL ==================== */
.js .reveal{ opacity:0; transform:translateY(14px); }
.js .reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);
}

/* ==================== RESPONSIVO ==================== */
@media (max-width:1080px){
  .hero__in{ grid-template-columns:1fr; gap:2.6rem; }
  .console{ max-width:640px; }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .card--tall{ grid-row:span 1; }
  .plans{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; }
  .plan__desc{ min-height:0; }
  .foot__in{ grid-template-columns:1fr 1fr; }
}

@media (max-width:860px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{
    display:flex; flex-direction:column; justify-content:center; gap:5px;
    margin-left:auto; width:40px; height:40px;
    background:none; border:1px solid var(--line); border-radius:9px;
    padding:0 11px;
  }
  .nav__burger span{
    height:1.6px; background:var(--text); border-radius:2px;
    transition:transform .28s var(--ease-out), opacity .2s;
  }
  .nav__burger[aria-expanded="true"] span:first-child{ transform:translateY(3.3px) rotate(45deg); }
  .nav__burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.3px) rotate(-45deg); }
  .nav__mobile{
    display:flex; flex-direction:column;
    border-top:1px solid var(--line);
    background:rgba(8,11,10,.97);
    padding:.7rem 1.3rem 1.2rem;
  }
  .nav__mobile[hidden]{ display:none; }
  .nav__mobile a{
    padding:.78rem 0; border-bottom:1px solid var(--line);
    color:var(--text-2); font-size:.95rem;
  }
  .nav__mobile a:last-child{ border-bottom:0; color:var(--signal); font-weight:600; }

  .strip__in{ grid-template-columns:repeat(2,1fr); }
  .strip__item:last-child{ grid-column:span 2; }
  .bento{ grid-template-columns:1fr; }
  .card--wide, .card--wide2{ grid-column:span 1; }
  .step{ grid-template-columns:1fr; gap:.6rem; padding:1.4rem 1.1rem; }
}

@media (max-width:520px){
  body{ font-size:15.5px; }
  .wrap, .wrap--narrow{ width:min(100% - 1.8rem, var(--maxw)); }
  .hero__actions .btn{ width:100%; }
  .cta__actions{ width:100%; }
  .cta__actions .btn{ flex:1 1 auto; }
  .foot__in{ grid-template-columns:1fr; gap:1.8rem; }
  .console{ font-size:.775rem; }
}

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