/* ========================================================================
   ATRAIA · LANDING PAGE
   Editorial-brutalist navy / mobile-first / no framework
   ======================================================================== */

:root {
  /* color */
  --navy-deep: #0B1530;
  --navy: #1B2D55;
  --navy-soft: #243B6E;
  --navy-line: #2E4880;
  --sky: #3B9CDC;
  --sky-light: #7DD3FC;
  --sky-glow: rgba(125, 211, 252, .18);
  --white: #FFFFFF;
  --paper: #F5F1E8;
  --ink: #0B1530;
  --muted: #94A3C7;
  --muted-2: #6E7FA8;

  /* typography */
  --f-display: 'Anton', 'Bebas Neue', sans-serif;
  --f-body: 'Inter Tight', 'Inter', system-ui, -apple-system, sans-serif;
  --f-hand: 'Caveat', cursive;
  --f-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* spacing */
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --max-w: 1240px;
  --space-xs: clamp(.5rem, 1vw, .75rem);
  --space-s: clamp(1rem, 2vw, 1.5rem);
  --space-m: clamp(2rem, 4vw, 3rem);
  --space-l: clamp(3.5rem, 7vw, 6rem);
  --space-xl: clamp(5rem, 10vw, 9rem);

  /* radius */
  --r-s: 6px;
  --r-m: 14px;
  --r-l: 22px;

  /* easing */
  --ease: cubic-bezier(.2,.8,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

/* --- reset --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--navy-deep);
  color:var(--white);
  font-family:var(--f-body);
  font-size:clamp(16px,1.05vw,18px);
  line-height:1.55;
  font-weight:400;
  font-feature-settings:"ss01","cv11","kern";
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  /* subtle grain via SVG noise */
  background-image:
    radial-gradient(ellipse at 80% 0%, rgba(59,156,220,.10), transparent 50%),
    radial-gradient(ellipse at 0% 80%, rgba(59,156,220,.06), transparent 60%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .04 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-attachment:fixed,fixed,fixed;
  background-size:auto,auto,160px 160px;
}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
ul,ol{list-style:none}
input,button{font:inherit}
::selection{background:var(--sky);color:var(--navy-deep)}

.skip-link{
  position:absolute;left:-999px;top:0;
  padding:.6rem 1rem;background:var(--sky);color:var(--navy-deep);
  z-index:999;border-radius:var(--r-s);font-weight:700;
}
.skip-link:focus{left:1rem;top:1rem}

/* --- container --- */
.container{
  width:100%;
  max-width:var(--max-w);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* --- typography utilities --- */
.kicker{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--f-mono);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--sky-light);
  margin-bottom:1.5rem;
}
.kicker .dot{
  width:.55rem;height:.55rem;border-radius:50%;
  background:var(--sky-light);
  box-shadow:0 0 0 4px rgba(125,211,252,.18);
  animation:pulse 2.4s var(--ease) infinite;
}
.kicker--invert{color:var(--sky-light)}

.h2{
  font-family:var(--f-display);
  font-weight:400;
  font-size:clamp(2.4rem, 6vw, 5rem);
  line-height:.95;
  letter-spacing:-.01em;
  text-transform:uppercase;
  margin-bottom:clamp(1.5rem,3vw,2.5rem);
  color:var(--white);
}
.h2 em{
  font-family:var(--f-hand);
  font-style:normal;
  font-weight:700;
  text-transform:none;
  color:var(--sky-light);
  letter-spacing:0;
  font-size:1.2em;
  line-height:.85;
  display:inline-block;
  transform:translateY(.06em) rotate(-2deg);
}
.h2--invert{color:var(--white)}
.h2--giant{font-size:clamp(3.2rem,10vw,7.5rem)}
.h2 .hl{
  position:relative;
  display:inline-block;
  color:var(--white);
}
.h2 .hl::before{
  content:"";
  position:absolute;
  inset:auto -.15em -.05em -.15em;
  height:.4em;
  background:var(--sky);
  z-index:-1;
  transform:skewX(-8deg) translateY(.02em);
  opacity:.85;
}
.hand{
  font-family:var(--f-hand);
  font-weight:700;
  color:var(--sky-light);
  font-size:1.15em;
  text-transform:none;
  display:inline-block;
  transform:rotate(-1.5deg);
}
.hand-yellow{
  font-family:var(--f-hand);
  font-weight:700;
  color:var(--sky-light);
  font-size:1.1em;
  text-transform:none;
  display:inline-block;
}
.hand-big{
  font-family:var(--f-hand);
  font-weight:700;
  color:var(--sky-light);
  font-size:1.4em;
  text-transform:none;
  display:inline-block;
  transform:rotate(-3deg);
}

/* --- buttons --- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.95rem 1.4rem;
  font-family:var(--f-body);
  font-weight:700;
  font-size:1rem;
  letter-spacing:.005em;
  border-radius:var(--r-m);
  text-decoration:none;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .2s;
  white-space:nowrap;
  cursor:pointer;
}
.btn__arrow{
  display:inline-block;
  transition:transform .25s var(--ease);
}
.btn:hover .btn__arrow{transform:translateX(4px)}
.btn--primary{
  background:var(--sky);
  color:var(--navy-deep);
  box-shadow:
    0 1px 0 rgba(255,255,255,.4) inset,
    0 0 0 1px var(--sky),
    0 12px 40px -8px rgba(59,156,220,.55),
    0 2px 0 var(--sky-light);
}
.btn--primary:hover{
  transform:translateY(-2px);
  background:var(--sky-light);
  box-shadow:
    0 1px 0 rgba(255,255,255,.5) inset,
    0 0 0 1px var(--sky-light),
    0 18px 48px -8px rgba(59,156,220,.7),
    0 2px 0 var(--white);
}
.btn--lg{padding:1.1rem 1.7rem;font-size:1.05rem}
.btn--xl{
  padding:1.35rem 2rem;
  font-size:1.18rem;
  border-radius:18px;
}
.btn--inline{margin-top:2rem}

/* --- topbar --- */
.topbar{
  position:sticky;top:0;z-index:50;
  display:flex;justify-content:space-between;align-items:center;
  padding:.85rem var(--gutter);
  background:rgba(11,21,48,.78);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.topbar__logo{
  display:inline-flex;align-items:center;gap:.65rem;
  font-family:var(--f-display);
  letter-spacing:.04em;
}
.topbar__logo img{width:34px;height:34px}
.topbar__wordmark{display:flex;flex-direction:column;line-height:.92}
.topbar__wordmark strong{font-size:1.05rem;color:var(--white)}
.topbar__wordmark em{
  font-style:normal;font-size:.62rem;letter-spacing:.32em;
  color:var(--sky-light);font-family:var(--f-mono);
  font-weight:500;
}
.topbar__cta{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.55rem .9rem;
  background:var(--sky);
  color:var(--navy-deep);
  font-weight:700;
  border-radius:999px;
  font-size:.92rem;
  transition:transform .2s var(--ease),background .2s;
}
.topbar__cta:hover{transform:translateY(-1px);background:var(--sky-light)}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:calc(100svh - 60px);
  padding:clamp(3rem,8vw,5rem) var(--gutter) clamp(3.5rem,7vw,5rem);
  overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;
}
.hero__bg{
  position:absolute;inset:0;pointer-events:none;
  z-index:0;
}
.hero__triangle{
  position:absolute;
  right:-12%;
  top:-8%;
  width:80%;
  filter:blur(.5px);
}
.hero__inner{
  position:relative;z-index:1;
  width:100%;
  max-width:var(--max-w);
  margin-inline:auto;
}
.hero__kicker{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--f-mono);
  font-size:.74rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--sky-light);
  margin-bottom:clamp(1.5rem,3vw,2.2rem);
  padding:.5rem .85rem;
  background:rgba(59,156,220,.08);
  border:1px solid rgba(59,156,220,.22);
  border-radius:999px;
  backdrop-filter:blur(6px);
}
.hero__kicker .dot{
  width:.45rem;height:.45rem;border-radius:50%;
  background:var(--sky-light);
  box-shadow:0 0 0 3px rgba(125,211,252,.22);
  animation:pulse 2.4s var(--ease) infinite;
}
.hero__title{
  font-family:var(--f-display);
  font-weight:400;
  font-size:clamp(3.2rem, 13vw, 9rem);
  line-height:.88;
  letter-spacing:-.015em;
  text-transform:uppercase;
  color:var(--white);
  margin-bottom:clamp(1.5rem,3.5vw,2.5rem);
}
.hero__title .line{display:block}
.hero__title .line--3{color:var(--muted)}
.hero__title .line--4{color:var(--sky-light)}
.zero-wrap{
  position:relative;
  display:inline-block;
  color:var(--sky-light);
}
.zero-mark{
  position:absolute;
  left:-4%;
  bottom:-10%;
  width:108%;
  height:auto;
  pointer-events:none;
  animation:draw 1.4s .8s var(--ease-out) both;
}
.zero-mark path{
  stroke-dasharray:240;
  stroke-dashoffset:240;
  animation:draw-stroke 1.4s .8s var(--ease-out) forwards;
}
.hero__sub{
  font-size:clamp(1.05rem,1.4vw,1.25rem);
  line-height:1.55;
  color:var(--muted);
  max-width:62ch;
  margin-bottom:clamp(2rem,4vw,2.8rem);
}
.hero__cta-row{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1.4rem}
.hero__trust{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:.94rem;
  color:var(--muted);
}
.pulse{
  width:.55rem;height:.55rem;border-radius:50%;
  background:var(--sky-light);
  box-shadow:0 0 0 3px rgba(125,211,252,.22);
  animation:pulse 2.4s var(--ease) infinite;
}
.hero__metrics{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:.75rem;
  margin-top:clamp(2.5rem,5vw,3.5rem);
  padding-top:clamp(1.5rem,3vw,2rem);
  border-top:1px solid rgba(255,255,255,.08);
}
.metric{
  display:flex;flex-direction:column;gap:.25rem;
  padding:.25rem 0;
}
.metric__value{
  font-family:var(--f-display);
  font-size:clamp(1.7rem,4vw,2.6rem);
  line-height:1;
  letter-spacing:-.01em;
  color:var(--white);
}
.metric--accent .metric__value{color:var(--sky-light)}
.metric__label{
  font-size:.78rem;
  color:var(--muted-2);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-family:var(--f-mono);
}
.hero__scroll{
  position:absolute;
  left:50%;bottom:1.2rem;
  transform:translateX(-50%);
  font-family:var(--f-mono);
  font-size:.7rem;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:var(--muted-2);
  display:none;
}
.hero__scroll-line{
  display:block;width:1px;height:36px;
  background:linear-gradient(to bottom,var(--sky-light),transparent);
  margin:0 auto .5rem;
  animation:scrollBob 2.4s var(--ease) infinite;
}
@media(min-width:900px){.hero__scroll{display:block}}

/* ============================================================
   GENERIC SECTIONS
   ============================================================ */
.section{
  padding:clamp(4rem,9vw,8rem) 0;
  position:relative;
}
.section--pain{
  background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 100%);
  border-top:1px solid rgba(255,255,255,.06);
}
.section--diff{
  background:var(--navy);
}
.section--included{
  background:linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%);
}
.section--howto{
  background:var(--navy-deep);
}
.section--pricing{
  background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 100%);
}
.section--guarantee{
  background:var(--navy);
  padding:clamp(3rem,6vw,5rem) 0;
}
.section--fit{
  background:var(--navy-deep);
}
.section--niches{
  background:var(--navy);
}
.section--faq{
  background:linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%);
}
.section--final{
  background:radial-gradient(ellipse at 50% 0%, rgba(59,156,220,.18), transparent 60%), var(--navy-deep);
  padding:clamp(5rem,10vw,9rem) 0 clamp(4rem,8vw,7rem);
  text-align:center;
}

/* ============================================================
   PAIN
   ============================================================ */
.pain-list{
  display:flex;flex-direction:column;gap:1px;
  background:rgba(255,255,255,.06);
  margin-bottom:2.5rem;
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--r-l);
  overflow:hidden;
}
.pain-item{
  display:flex;align-items:flex-start;gap:1.2rem;
  padding:1.4rem 1.5rem;
  background:var(--navy);
  transition:background .2s var(--ease);
}
.pain-item:hover{background:var(--navy-soft)}
.pain-item__num{
  font-family:var(--f-mono);
  font-size:.95rem;
  color:var(--sky-light);
  letter-spacing:.05em;
  flex-shrink:0;
  min-width:1.8rem;
  margin-top:.1rem;
}
.pain-item p{
  font-size:clamp(1.02rem,1.3vw,1.18rem);
  line-height:1.5;
  color:var(--white);
}
.pain-item p strong{color:var(--white);font-weight:700}
.pain-punch{
  font-size:clamp(1.15rem,1.7vw,1.4rem);
  line-height:1.45;
  color:var(--white);
  max-width:48ch;
  margin-bottom:.6rem;
}
.pain-bridge{
  font-family:var(--f-display);
  font-size:clamp(1.4rem,2.2vw,1.85rem);
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:var(--sky-light);
  margin-top:1rem;
}

/* ============================================================
   DIFF
   ============================================================ */
.diff-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media(min-width:720px){.diff-grid{grid-template-columns:repeat(2,1fr);gap:1.4rem}}
.diff-card{
  position:relative;
  padding:2rem 1.6rem 1.7rem;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
  transition:transform .3s var(--ease), border-color .3s, background .3s;
  overflow:hidden;
}
.diff-card::before{
  content:"";
  position:absolute;
  inset:auto -40% -60% auto;
  width:80%;height:80%;
  background:radial-gradient(circle,rgba(59,156,220,.16),transparent 70%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}
.diff-card:hover{
  transform:translateY(-4px);
  border-color:rgba(125,211,252,.45);
  background:linear-gradient(180deg,rgba(59,156,220,.08),rgba(255,255,255,.01));
}
.diff-card:hover::before{opacity:1}
.diff-card__num{
  display:inline-block;
  font-family:var(--f-mono);
  font-size:.78rem;
  letter-spacing:.15em;
  color:var(--sky-light);
  margin-bottom:1.2rem;
  padding:.3rem .55rem;
  background:rgba(59,156,220,.12);
  border-radius:6px;
}
.diff-card h3{
  font-family:var(--f-display);
  font-size:clamp(1.35rem,2vw,1.75rem);
  letter-spacing:-.005em;
  text-transform:uppercase;
  line-height:1;
  margin-bottom:.85rem;
  color:var(--white);
  font-weight:400;
}
.diff-card p{
  font-size:1rem;
  line-height:1.55;
  color:var(--muted);
}

/* ============================================================
   INCLUDED — checklist
   ============================================================ */
.included-head{margin-bottom:clamp(2rem,4vw,3rem)}
.check-list{
  display:flex;flex-direction:column;gap:.5rem;
  margin-bottom:2rem;
}
.check-list li{
  display:flex;align-items:flex-start;gap:1.1rem;
  padding:1.15rem 1.3rem;
  background:rgba(255,255,255,.02);
  border-left:3px solid var(--sky);
  border-radius:0 var(--r-m) var(--r-m) 0;
  transition:background .2s,border-left-width .2s;
}
.check-list li:hover{
  background:rgba(59,156,220,.06);
  border-left-width:5px;
}
.check-list__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:1.7rem;height:1.7rem;
  border-radius:50%;
  background:var(--sky);
  color:var(--navy-deep);
  font-weight:700;
  font-size:.95rem;
  flex-shrink:0;
}
.check-list li > div{display:flex;flex-direction:column;gap:.25rem}
.check-list strong{
  font-family:var(--f-body);
  font-weight:700;
  font-size:1.06rem;
  color:var(--white);
}
.check-list span{
  font-size:.95rem;
  color:var(--muted);
  line-height:1.45;
}
.included-foot{
  font-size:.92rem;
  color:var(--muted-2);
  font-style:italic;
  max-width:60ch;
}

/* ============================================================
   HOW TO — steps
   ============================================================ */
.steps{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
  margin-bottom:2rem;
  position:relative;
}
@media(min-width:820px){
  .steps{grid-template-columns:repeat(3,1fr);gap:1.5rem}
  .steps::before{
    content:"";
    position:absolute;
    top:2.6rem;
    left:8%;right:8%;
    height:1px;
    background:linear-gradient(to right,transparent,var(--sky-light) 20%,var(--sky-light) 80%,transparent);
    opacity:.35;
  }
}
.step{
  position:relative;
  padding:2rem 1.6rem 1.7rem;
  background:linear-gradient(180deg,rgba(59,156,220,.06),rgba(59,156,220,.01));
  border:1px solid rgba(125,211,252,.22);
  border-radius:var(--r-l);
}
.step__num{
  display:inline-flex;align-items:center;justify-content:center;
  width:3rem;height:3rem;
  border-radius:50%;
  background:var(--sky);
  color:var(--navy-deep);
  font-family:var(--f-display);
  font-size:1.55rem;
  margin-bottom:1.2rem;
  position:relative;
}
.step__num::after{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:50%;
  border:1px dashed var(--sky-light);
  opacity:.45;
}
.step h3{
  font-family:var(--f-display);
  font-size:1.55rem;
  text-transform:uppercase;
  letter-spacing:-.005em;
  margin-bottom:.65rem;
  color:var(--white);
  font-weight:400;
  line-height:1.05;
}
.step p{
  font-size:.98rem;
  color:var(--muted);
  line-height:1.55;
}
.howto-foot{
  font-size:1rem;
  color:var(--muted);
  max-width:62ch;
}
.howto-foot strong{color:var(--white)}

/* ============================================================
   PRICING
   ============================================================ */
.price-table{
  background:var(--navy);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
  overflow:hidden;
  margin-bottom:1.8rem;
}
.price-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1.35rem 1.6rem;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.price-row:last-child{border-bottom:0}
.price-row__label{
  font-size:1.02rem;
  color:var(--muted);
}
.price-row__label em{
  font-style:normal;
  font-size:.85rem;
  color:var(--muted-2);
  margin-left:.35rem;
}
.price-row__value{
  font-family:var(--f-display);
  font-size:clamp(1.4rem,2.3vw,1.85rem);
  letter-spacing:-.005em;
  color:var(--white);
  text-transform:uppercase;
}
.price-row__value strong{color:var(--white)}
.price-row--accent{
  background:linear-gradient(90deg,rgba(59,156,220,.18),rgba(59,156,220,.05));
  position:relative;
}
.price-row--accent::before{
  content:"GRÁTIS";
  position:absolute;
  top:.5rem;right:1rem;
  font-family:var(--f-mono);
  font-size:.7rem;
  letter-spacing:.18em;
  color:var(--sky-light);
  background:rgba(125,211,252,.12);
  padding:.18rem .5rem;
  border-radius:4px;
}
.zero-big{
  font-family:var(--f-display);
  color:var(--sky-light);
  font-size:1.15em;
}
.price-disclaimers{
  display:flex;flex-direction:column;gap:.6rem;
  margin-top:1rem;
}
.price-disclaimers li{
  font-size:.92rem;
  color:var(--muted);
  line-height:1.5;
  padding-left:1.2rem;
  position:relative;
}
.price-disclaimers li::before{
  content:"·";
  position:absolute;
  left:0;
  color:var(--sky-light);
  font-weight:700;
}
.price-disclaimers li strong{color:var(--white)}

/* ============================================================
   GUARANTEE
   ============================================================ */
.guarantee-card{
  position:relative;
  padding:clamp(2.5rem,5vw,4rem) clamp(1.8rem,4vw,3.5rem);
  background:linear-gradient(135deg,rgba(59,156,220,.18),rgba(59,156,220,.04));
  border:1px solid rgba(125,211,252,.4);
  border-radius:24px;
  overflow:hidden;
}
.guarantee-card::before{
  content:"";
  position:absolute;
  top:-30%;right:-15%;
  width:60%;height:160%;
  background:radial-gradient(circle,rgba(125,211,252,.18),transparent 65%);
  pointer-events:none;
}
.guarantee-stamp{
  position:absolute;
  top:1.2rem;right:1.2rem;
  width:80px;height:80px;
  opacity:.95;
  animation:rotateSlow 18s linear infinite;
}
@media(min-width:760px){.guarantee-stamp{width:110px;height:110px;top:1.8rem;right:1.8rem}}
.guarantee-body{
  font-size:clamp(1.05rem,1.4vw,1.22rem);
  line-height:1.55;
  color:var(--white);
  margin-bottom:1.2rem;
  max-width:60ch;
}
.guarantee-foot{
  font-size:.98rem;
  color:var(--sky-light);
  font-family:var(--f-hand);
  font-size:1.4rem;
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
}

/* ============================================================
   FIT
   ============================================================ */
.fit-grid{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
}
@media(min-width:820px){.fit-grid{grid-template-columns:1fr 1fr;gap:2rem}}
.fit-card{
  padding:2rem 1.7rem;
  border-radius:var(--r-l);
  border:1px solid rgba(255,255,255,.08);
}
.fit-card--yes{
  background:linear-gradient(180deg,rgba(59,156,220,.1),rgba(59,156,220,.02));
  border-color:rgba(125,211,252,.32);
}
.fit-card--no{
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
}
.fit-card h3{
  font-family:var(--f-display);
  font-size:1.65rem;
  text-transform:uppercase;
  letter-spacing:-.005em;
  margin-bottom:1.3rem;
  font-weight:400;
}
.fit-card--yes h3{color:var(--sky-light)}
.fit-card--no h3{color:var(--muted)}
.fit-card ul{display:flex;flex-direction:column;gap:.85rem}
.fit-card li{
  display:flex;align-items:flex-start;gap:.85rem;
  font-size:1rem;line-height:1.5;
  color:var(--white);
}
.fit-card li::before{
  flex-shrink:0;
  margin-top:.18rem;
  display:inline-flex;align-items:center;justify-content:center;
  width:1.4rem;height:1.4rem;
  border-radius:50%;
  font-size:.9rem;font-weight:700;
}
.fit-card--yes li::before{
  content:"✓";
  background:var(--sky);
  color:var(--navy-deep);
}
.fit-card--no li::before{
  content:"×";
  background:rgba(255,255,255,.08);
  color:var(--muted);
}

/* ============================================================
   NICHES
   ============================================================ */
.niches-cloud{
  display:flex;flex-wrap:wrap;gap:.55rem;
  margin-bottom:1.5rem;
}
.niches-cloud li{
  font-family:var(--f-body);
  font-weight:500;
  font-size:.92rem;
  padding:.5rem 1rem;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  color:var(--white);
  transition:background .2s,border-color .2s,transform .2s;
}
.niches-cloud li:hover{
  background:rgba(59,156,220,.14);
  border-color:rgba(125,211,252,.5);
  transform:translateY(-1px);
}
.niches-foot{
  font-size:.96rem;
  color:var(--muted);
  font-family:var(--f-hand);
  font-size:1.4rem;
  font-weight:500;
  letter-spacing:0;
}

/* ============================================================
   FAQ
   ============================================================ */
.faq-list{
  display:flex;flex-direction:column;gap:.5rem;
  max-width:820px;
}
.faq-item{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--r-m);
  overflow:hidden;
  transition:border-color .2s, background .2s;
}
.faq-item[open]{
  background:rgba(59,156,220,.08);
  border-color:rgba(125,211,252,.35);
}
.faq-item summary{
  cursor:pointer;
  list-style:none;
  padding:1.2rem 1.4rem;
  font-family:var(--f-body);
  font-weight:600;
  font-size:1.02rem;
  color:var(--white);
  display:flex;justify-content:space-between;align-items:center;
  gap:1rem;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"+";
  font-family:var(--f-display);
  font-size:1.6rem;
  color:var(--sky-light);
  transition:transform .25s var(--ease);
  flex-shrink:0;
  line-height:1;
}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{
  padding:0 1.4rem 1.3rem;
  font-size:.98rem;
  color:var(--muted);
  line-height:1.6;
  max-width:65ch;
}

/* ============================================================
   FINAL CTA
   ============================================================ */
.section--final .h2{margin-bottom:1rem}
.section--final .kicker{justify-content:center}
.final__sub{
  font-size:clamp(1.05rem,1.4vw,1.2rem);
  color:var(--muted);
  margin-bottom:2.2rem;
  max-width:48ch;
  margin-inline:auto;
}
.form-toggle{
  margin-top:1.8rem;
  font-size:.95rem;
  color:var(--muted);
}
.form-toggle summary{
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:4px;
  text-decoration-color:rgba(125,211,252,.5);
  display:inline-block;
  list-style:none;
}
.form-toggle summary::-webkit-details-marker{display:none}
.lead-form{
  max-width:440px;
  margin:1.6rem auto 0;
  display:flex;flex-direction:column;gap:.9rem;
  text-align:left;
  padding:1.8rem;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
}
.lead-form label{
  display:flex;flex-direction:column;gap:.35rem;
}
.lead-form label span{
  font-family:var(--f-mono);
  font-size:.74rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--sky-light);
}
.lead-form input{
  padding:.85rem 1rem;
  background:var(--navy-deep);
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r-s);
  color:var(--white);
  font-size:1rem;
  transition:border-color .2s,background .2s;
}
.lead-form input:focus{
  outline:none;
  border-color:var(--sky);
  background:var(--navy);
}
.form-note{
  font-size:.85rem;
  color:var(--muted-2);
  text-align:center;
}
.form-success{
  font-family:var(--f-hand);
  font-size:1.4rem;
  color:var(--sky-light);
  text-align:center;
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{
  background:var(--navy-deep);
  padding:2.5rem 0 2rem;
  border-top:1px solid rgba(255,255,255,.06);
}
.footer__inner{
  display:flex;flex-direction:column;gap:1rem;
  align-items:center;text-align:center;
}
.footer__brand{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--f-display);
  letter-spacing:.04em;
}
.footer__brand img{width:28px;height:28px}
.footer__copy{font-size:.88rem;color:var(--muted)}
.footer__links{display:flex;gap:1.4rem;font-size:.92rem}
.footer__links a{color:var(--sky-light);text-decoration:underline;text-underline-offset:3px}
.footer__legal{font-size:.78rem;color:var(--muted-2);max-width:60ch}

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes pulse{
  0%,100%{box-shadow:0 0 0 3px rgba(125,211,252,.22)}
  50%{box-shadow:0 0 0 8px rgba(125,211,252,0)}
}
@keyframes scrollBob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(8px)}
}
@keyframes draw-stroke{
  to{stroke-dashoffset:0}
}
@keyframes rotateSlow{
  to{transform:rotate(360deg)}
}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes fadeDown{
  from{opacity:0;transform:translateY(-12px)}
  to{opacity:1;transform:translateY(0)}
}

[data-anim="fade-up"]{
  opacity:0;
  animation:fadeUp .9s var(--ease-out) forwards;
  animation-delay:var(--d, 0ms);
}
[data-anim="fade-down"]{
  opacity:0;
  animation:fadeDown .8s var(--ease-out) forwards;
}

/* scroll-triggered reveal — graceful fallback */
@supports (animation-timeline: view()) {
  .h2, .pain-item, .diff-card, .check-list li, .step, .price-row, .fit-card, .faq-item, .niches-cloud li {
    animation: revealOnScroll .8s var(--ease-out) both;
    animation-timeline: view();
    animation-range: entry 0% cover 35%;
  }
  @keyframes revealOnScroll{
    from{opacity:0;transform:translateY(20px)}
    to{opacity:1;transform:translateY(0)}
  }
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    transition-duration:.001ms !important;
  }
  .zero-mark path{stroke-dashoffset:0}
}

/* ============================================================
   v3 — MOTION + EXTRAS BLOCK + MARQUEE
   ============================================================ */

/* --- scroll progress bar --- */
.scroll-progress{
  position:fixed;top:0;left:0;
  height:3px;width:0;
  background:linear-gradient(to right,var(--sky),var(--sky-light));
  z-index:60;
  box-shadow:0 0 12px rgba(125,211,252,.6);
  transition:width .08s linear;
  pointer-events:none;
}

/* --- pulse glow on primary CTA --- */
.btn--primary{
  position:relative;
  isolation:isolate;
}
.btn--primary::after{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  background:linear-gradient(135deg,var(--sky),var(--sky-light));
  z-index:-1;
  opacity:.45;
  filter:blur(14px);
  animation:ctaGlow 3s var(--ease) infinite;
}
@keyframes ctaGlow{
  0%,100%{opacity:.4;transform:scale(1)}
  50%{opacity:.85;transform:scale(1.06)}
}

/* --- extras section (Site/Landing extra) --- */
.section--extras{
  background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 100%);
  position:relative;
  overflow:hidden;
}
.section--extras::before{
  content:"";
  position:absolute;
  top:-10%;left:-5%;
  width:30%;height:60%;
  background:radial-gradient(circle,rgba(125,211,252,.1),transparent 70%);
  pointer-events:none;
  animation:floatBlob 14s var(--ease) infinite;
}
.section--extras::after{
  content:"";
  position:absolute;
  bottom:-10%;right:-5%;
  width:35%;height:55%;
  background:radial-gradient(circle,rgba(59,156,220,.08),transparent 70%);
  pointer-events:none;
  animation:floatBlob 18s var(--ease) infinite reverse;
}
.extras-card{
  position:relative;
  padding:clamp(2rem,5vw,3.5rem) clamp(1.5rem,4vw,3rem);
  background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(59,156,220,.06));
  border:1px solid rgba(125,211,252,.25);
  border-radius:24px;
  overflow:hidden;
}
.extras-card__tag{
  display:inline-block;
  font-family:var(--f-mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--sky-light);
  background:rgba(125,211,252,.12);
  padding:.4rem .7rem;
  border-radius:6px;
  margin-bottom:1.4rem;
}
.h2--small{
  font-size:clamp(2rem,4.5vw,3.4rem);
  margin-bottom:1.5rem;
}
.extras-lead{
  font-size:clamp(1rem,1.3vw,1.18rem);
  line-height:1.55;
  color:var(--white);
  max-width:62ch;
  margin-bottom:2rem;
}
.extras-lead strong{
  color:var(--sky-light);
  font-weight:700;
}
.extras-grid{
  display:grid;grid-template-columns:1fr;gap:1rem;
  margin-bottom:1.5rem;
}
@media(min-width:780px){.extras-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem}}
.extras-item{
  padding:1.4rem 1.3rem;
  background:rgba(11,21,48,.4);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--r-l);
  transition:transform .3s var(--ease), border-color .3s, background .3s;
}
.extras-item:hover{
  transform:translateY(-3px);
  border-color:rgba(125,211,252,.35);
  background:rgba(11,21,48,.6);
}
.extras-item__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;
  border-radius:12px;
  background:rgba(59,156,220,.14);
  color:var(--sky-light);
  margin-bottom:1rem;
}
.extras-item__icon svg{width:22px;height:22px}
.extras-item h3{
  font-family:var(--f-body);
  font-weight:700;
  font-size:1.05rem;
  color:var(--white);
  margin-bottom:.55rem;
  letter-spacing:0;
  text-transform:none;
  line-height:1.3;
}
.extras-item p{
  font-size:.94rem;
  line-height:1.5;
  color:var(--muted);
}
.extras-foot{
  font-size:.92rem;
  color:var(--muted-2);
  font-style:italic;
  max-width:65ch;
}

/* --- marquee (niches infinite ticker) --- */
.marquee{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:1.4rem 0;
  margin-top:1rem;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  background:linear-gradient(90deg,var(--navy-deep),var(--navy),var(--navy-deep));
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee + .marquee{
  margin-top:0;
  border-top:0;
}
.marquee--reverse{
  background:linear-gradient(90deg,var(--navy),var(--navy-deep),var(--navy));
}
.marquee__track{
  display:flex;
  gap:1.6rem;
  white-space:nowrap;
  width:max-content;
  font-family:var(--f-display);
  font-size:clamp(1.6rem,3.2vw,2.4rem);
  letter-spacing:-.005em;
  text-transform:uppercase;
  color:var(--white);
}
.marquee__track span{
  flex-shrink:0;
}
.marquee__track span:nth-child(2n){
  color:var(--sky-light);
  font-family:var(--f-hand);
  font-weight:500;
  font-size:1.4em;
  text-transform:none;
  letter-spacing:0;
  align-self:center;
}
.marquee__track--left{
  animation:marqueeLeft 40s linear infinite;
}
.marquee__track--right{
  animation:marqueeRight 50s linear infinite;
}
.marquee:hover .marquee__track{
  animation-play-state:paused;
}
@keyframes marqueeLeft{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes marqueeRight{
  from{transform:translateX(-50%)}
  to{transform:translateX(0)}
}

/* --- floating blob animation --- */
@keyframes floatBlob{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(20px,-30px) scale(1.05)}
  66%{transform:translate(-15px,20px) scale(.95)}
}

/* --- floating decorative triangles in section backgrounds --- */
.section--what,
.section--benefits,
.section--money,
.section--howto{
  position:relative;
  overflow:hidden;
}
.section--what::after,
.section--money::after{
  content:"";
  position:absolute;
  width:280px;height:280px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><polygon points='50,10 90,85 10,85' fill='none' stroke='%233B9CDC' stroke-width='1' opacity='.15'/></svg>") no-repeat center/contain;
  pointer-events:none;
  animation:rotateSlow 60s linear infinite;
}
.section--what::after{top:-60px;right:-80px}
.section--money::after{bottom:-60px;left:-80px;animation-direction:reverse}

/* --- enhanced hero triangle with subtle drift --- */
.hero__triangle{
  animation:triangleDrift 24s var(--ease) infinite;
}
@keyframes triangleDrift{
  0%,100%{transform:translate(0,0) rotate(0deg) scale(1)}
  50%{transform:translate(-2%,1%) rotate(-1.5deg) scale(1.03)}
}

/* --- enhanced reveal: stagger children --- */
.what-grid > *,
.benefits-grid > *,
.setup-list > *,
.money-grid > *{
  opacity:0;
  transform:translateY(24px);
  animation:fadeUp .8s var(--ease-out) forwards;
}
.what-grid > *:nth-child(1),.benefits-grid > *:nth-child(1),.setup-list > *:nth-child(1),.money-grid > *:nth-child(1){animation-delay:.1s}
.what-grid > *:nth-child(2),.benefits-grid > *:nth-child(2),.setup-list > *:nth-child(2),.money-grid > *:nth-child(2){animation-delay:.2s}
.what-grid > *:nth-child(3),.benefits-grid > *:nth-child(3),.setup-list > *:nth-child(3),.money-grid > *:nth-child(3){animation-delay:.3s}
.benefits-grid > *:nth-child(4),.setup-list > *:nth-child(4){animation-delay:.4s}
.setup-list > *:nth-child(5){animation-delay:.5s}

/* --- enhanced cards: more expressive hover --- */
.what-card,.benefit,.diff-card,.money-card,.extras-item,.fit-card,.step,.faq-item{
  will-change:transform;
}
.what-card:hover,.benefit:hover,.money-card:hover,.extras-item:hover{
  box-shadow:0 18px 50px -16px rgba(59,156,220,.4);
}

/* --- price-row: hover slide --- */
.price-row{transition:background .25s,padding-left .25s var(--ease)}
.price-row:not(.price-row--accent):hover{
  background:rgba(59,156,220,.06);
  padding-left:calc(1.6rem + 8px);
}

/* --- step number: subtle bounce on view --- */
@keyframes bounceIn{
  0%{transform:scale(.6);opacity:0}
  60%{transform:scale(1.1);opacity:1}
  100%{transform:scale(1)}
}
.step__num{animation:bounceIn .7s var(--ease-out) both}
.step:nth-child(1) .step__num{animation-delay:.2s}
.step:nth-child(2) .step__num{animation-delay:.35s}
.step:nth-child(3) .step__num{animation-delay:.5s}

/* --- money arrow pulse --- */
.money-card__arrow{
  display:inline-block;
  animation:arrowSlide 2.4s var(--ease) infinite;
}
@keyframes arrowSlide{
  0%,100%{transform:translateX(0);opacity:.7}
  50%{transform:translateX(4px);opacity:1}
}

/* --- prefers-reduced-motion: kill all the new motion --- */
@media(prefers-reduced-motion:reduce){
  .marquee__track--left,.marquee__track--right{animation:none}
  .btn--primary::after{animation:none;opacity:.5}
  .hero__triangle{animation:none}
  .scroll-progress{transition:none}
  .section--what::after,.section--money::after,.section--extras::before,.section--extras::after{animation:none}
  .step__num{animation:none}
  .money-card__arrow{animation:none}
  .what-grid > *,.benefits-grid > *,.setup-list > *,.money-grid > *{
    opacity:1 !important;
    transform:none !important;
    animation:none !important;
  }
}

/* ============================================================
   v2 BLOCKS — WHAT, BENEFITS, SETUP, MONEY
   ============================================================ */

/* shared lead text */
.lead{
  font-size:clamp(1.05rem,1.4vw,1.22rem);
  line-height:1.6;
  color:var(--muted);
  max-width:62ch;
  margin-bottom:clamp(2rem,4vw,3rem);
}

/* --- WHAT section: 3 didactic cards --- */
.section--what{
  background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 100%);
  border-top:1px solid rgba(255,255,255,.06);
}
.what-grid{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
}
@media(min-width:780px){.what-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem}}
.what-card{
  position:relative;
  display:flex;flex-direction:column;
  padding:1.8rem 1.6rem 1.6rem;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
  transition:transform .3s var(--ease), border-color .3s, background .3s;
  overflow:hidden;
}
.what-card::before{
  content:"";
  position:absolute;
  top:-40%;right:-30%;
  width:80%;height:80%;
  background:radial-gradient(circle,rgba(59,156,220,.16),transparent 70%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}
.what-card:hover{
  transform:translateY(-4px);
  border-color:rgba(125,211,252,.4);
}
.what-card:hover::before{opacity:1}
.what-card--accent{
  background:linear-gradient(180deg,rgba(59,156,220,.1),rgba(59,156,220,.02));
  border-color:rgba(125,211,252,.32);
}
.what-card__head{
  margin-bottom:1.1rem;
  padding-bottom:1.1rem;
  border-bottom:1px dashed rgba(255,255,255,.08);
}
.what-card__tag{
  display:inline-block;
  font-family:var(--f-mono);
  font-size:.7rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--sky-light);
  background:rgba(125,211,252,.1);
  padding:.3rem .55rem;
  border-radius:6px;
  margin-bottom:.85rem;
}
.what-card h3{
  font-family:var(--f-display);
  font-weight:400;
  font-size:clamp(1.7rem,2.6vw,2.2rem);
  letter-spacing:-.005em;
  text-transform:uppercase;
  line-height:.95;
  color:var(--white);
}
.what-card__sub{
  display:block;
  margin-top:.35rem;
  font-family:var(--f-body);
  font-size:.84rem;
  color:var(--muted-2);
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
}
.what-card p{
  font-size:.98rem;
  line-height:1.55;
  color:var(--white);
  margin-bottom:.85rem;
}
.what-card p em{
  font-style:normal;
  background:rgba(125,211,252,.12);
  padding:1px 6px;
  border-radius:3px;
  color:var(--sky-light);
  font-family:var(--f-mono);
  font-size:.92em;
}
.what-card__why{
  color:var(--muted) !important;
  font-size:.95rem !important;
  padding:.8rem .95rem;
  background:rgba(255,255,255,.03);
  border-left:2px solid var(--sky);
  border-radius:0 6px 6px 0;
  margin-bottom:1rem !important;
}
.what-card__bullets{
  display:flex;flex-direction:column;gap:.4rem;
  margin-top:auto;
  padding-top:.5rem;
}
.what-card__bullets li{
  font-size:.88rem;
  color:var(--muted);
  line-height:1.45;
  padding-left:1.3rem;
  position:relative;
}
.what-card__bullets li::before{
  content:"→";
  position:absolute;
  left:0;
  color:var(--sky-light);
  font-weight:700;
}

/* --- BENEFITS section: 4 benefit cards --- */
.section--benefits{
  background:var(--navy);
}
.benefits-grid{
  display:grid;grid-template-columns:1fr;gap:1.1rem;
}
@media(min-width:680px){.benefits-grid{grid-template-columns:repeat(2,1fr);gap:1.4rem}}
@media(min-width:1080px){.benefits-grid{grid-template-columns:repeat(4,1fr)}}
.benefit{
  padding:1.7rem 1.5rem 1.5rem;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
  transition:transform .3s var(--ease), border-color .3s;
}
.benefit:hover{
  transform:translateY(-3px);
  border-color:rgba(125,211,252,.35);
}
.benefit__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;
  border-radius:14px;
  background:rgba(59,156,220,.14);
  color:var(--sky-light);
  margin-bottom:1.1rem;
}
.benefit__icon svg{width:24px;height:24px}
.benefit h3{
  font-family:var(--f-display);
  font-weight:400;
  font-size:1.45rem;
  letter-spacing:-.005em;
  text-transform:uppercase;
  line-height:1;
  margin-bottom:.7rem;
  color:var(--white);
}
.benefit p{
  font-size:.96rem;
  line-height:1.55;
  color:var(--muted);
}

/* --- SETUP section: numbered didactic list --- */
.section--setup{
  background:linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%);
}
.setup-list{
  display:flex;flex-direction:column;gap:.6rem;
  margin-bottom:1.5rem;
  counter-reset:none;
}
.setup-list li{
  display:flex;align-items:flex-start;gap:1.3rem;
  padding:1.6rem 1.5rem;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--r-l);
  transition:background .25s, border-color .25s, transform .25s var(--ease);
}
.setup-list li:hover{
  background:rgba(59,156,220,.07);
  border-color:rgba(125,211,252,.28);
  transform:translateX(4px);
}
.setup-list__num{
  flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  width:2.6rem;height:2.6rem;
  border-radius:50%;
  background:var(--sky);
  color:var(--navy-deep);
  font-family:var(--f-display);
  font-size:1.3rem;
  font-weight:400;
  line-height:1;
  position:relative;
}
.setup-list__num::after{
  content:"";
  position:absolute;
  inset:-5px;
  border-radius:50%;
  border:1px dashed rgba(125,211,252,.3);
}
.setup-list li > div{flex:1;display:flex;flex-direction:column;gap:.45rem}
.setup-list h3{
  font-family:var(--f-body);
  font-weight:700;
  font-size:1.08rem;
  color:var(--white);
  letter-spacing:0;
  text-transform:none;
  line-height:1.3;
}
.setup-list p{
  font-size:.96rem;
  line-height:1.55;
  color:var(--muted);
}
.setup-list p strong{color:var(--white)}
.setup-foot{
  font-size:.92rem;
  color:var(--muted-2);
  font-style:italic;
  max-width:65ch;
  margin-top:.5rem;
}

/* --- MONEY FLOW section --- */
.section--money{
  background:var(--navy-deep);
}
.money-grid{
  display:grid;grid-template-columns:1fr;gap:1rem;
  margin-bottom:1.5rem;
  position:relative;
}
@media(min-width:840px){.money-grid{grid-template-columns:repeat(3,1fr);gap:1.3rem}}
.money-card{
  position:relative;
  padding:1.6rem 1.4rem;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.005));
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-l);
  display:grid;
  grid-template-columns:auto auto 1fr;
  align-items:center;
  gap:.6rem;
  row-gap:1rem;
  grid-template-areas:
    "from arrow to"
    "desc desc desc";
}
.money-card--accent{
  background:linear-gradient(180deg,rgba(59,156,220,.14),rgba(59,156,220,.02));
  border-color:rgba(125,211,252,.4);
}
.money-card__from{
  grid-area:from;
  font-family:var(--f-display);
  font-size:1.35rem;
  text-transform:uppercase;
  letter-spacing:-.005em;
  color:var(--white);
  padding:.4rem .8rem;
  background:rgba(255,255,255,.06);
  border-radius:8px;
}
.money-card__arrow{
  grid-area:arrow;
  font-family:var(--f-display);
  font-size:1.5rem;
  color:var(--sky-light);
  line-height:1;
}
.money-card__to{
  grid-area:to;
  font-family:var(--f-display);
  font-size:1.35rem;
  text-transform:uppercase;
  letter-spacing:-.005em;
  color:var(--sky-light);
  padding:.4rem .8rem;
  background:rgba(125,211,252,.12);
  border-radius:8px;
  white-space:nowrap;
}
.money-card p{
  grid-area:desc;
  font-size:.94rem;
  line-height:1.55;
  color:var(--muted);
  margin:0;
}
.money-card p strong{color:var(--white)}
.money-foot{
  font-size:.95rem;
  color:var(--muted);
  font-family:var(--f-hand);
  font-size:1.4rem;
  font-weight:500;
  letter-spacing:0;
  margin-top:.5rem;
}

/* ============================================================
   DESKTOP REFINEMENTS
   ============================================================ */
@media(min-width:980px){
  .hero{padding-top:clamp(4rem,10vw,7rem)}
  .hero__title{max-width:13ch}
  .hero__sub{font-size:1.18rem}
  .what-card{padding:2.2rem 1.9rem 1.9rem}
  .benefit{padding:2rem 1.7rem 1.7rem}
  .setup-list li{padding:2rem 1.9rem;gap:1.5rem}
  .setup-list__num{width:3rem;height:3rem;font-size:1.5rem}
  .money-card{padding:1.9rem 1.7rem}
  .step{padding:2.5rem 2rem 2rem}
  .price-row{padding:1.6rem 2rem}
  .h2{margin-bottom:2.5rem}
  .container{padding-inline:clamp(2rem,4vw,3rem)}
}