:root{
    --bg:#06060b;
    --ink:#0a0a12;
    --paper:#f3f3f6;
    --paper-2:#e9e9ee;
    --halo-1:#1b2bd6;     /* deep electric */
    --halo-2:#5b6dff;     /* mid blue */
    --halo-3:#a8b2ff;     /* soft */
    --muted-dark:rgba(255,255,255,.55);
    --muted-light:rgba(10,10,18,.55);
    --hair-dark:rgba(255,255,255,.10);
    --hair-light:rgba(10,10,18,.10);
    --tg:#2AABEE;
    --page-pad:clamp(18px, 4vw, 32px);
    --section-pad:clamp(72px, 10vw, 120px);
    --container:1180px;
    --radius-sm:12px;
    --radius-md:16px;
    --radius-lg:22px;
    --control-h-sm:40px;
    --control-h-md:46px;
    --control-h-lg:56px;
    --space-1:4px;
    --space-2:8px;
    --space-3:12px;
    --space-4:16px;
    --space-5:20px;
    --space-6:24px;
    --space-7:32px;
    --space-8:40px;
    --step--2:clamp(10px, .72vw, 11px);
    --step--1:clamp(12px, .86vw, 13px);
    --step-0:clamp(13.5px, .98vw, 15px);
    --step-1:clamp(15px, 1.1vw, 17px);
    --step-2:clamp(18px, 1.45vw, 22px);
    --step-3:clamp(24px, 2.3vw, 36px);
    --step-4:clamp(32px, 4.2vw, 56px);
    --step-5:clamp(36px, 5.2vw, 72px);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{min-height:100%;background:var(--bg);color:#fff;font-family:"Onest",ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  html{scroll-behavior:smooth}
  body{font-feature-settings:"ss01","cv11";font-size:var(--step-0);line-height:1.5}

  /* ─────────── stage ─────────── */
  .stage{
    position:relative;
    min-height:100dvh;
    width:100%;
    overflow:hidden;
    isolation:isolate;
    /* hero photo — optimized beach/surf background (see assets/hero-beach.*) */
    background-color:#cfe7f3; /* sky tone shown until the image paints */
    background-image:url("../assets/hero-beach.jpg");
    background-image:-webkit-image-set(
      url("../assets/hero-beach.webp") type("image/webp"),
      url("../assets/hero-beach.jpg") type("image/jpeg"));
    background-image:image-set(
      url("../assets/hero-beach.webp") type("image/webp"),
      url("../assets/hero-beach.jpg") type("image/jpeg"));
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }
  /* the dark generative hero layers are retired in favour of the photo */
  .aurora,.mesh,.shimmer,.grain{display:none}

  /* ─── dynamic mesh aurora — multi-orb soft-glow gradient ─── */
  .aurora{
    position:absolute;inset:-8%;
    z-index:0;
    background:
      /* deep navy crown */
      radial-gradient(120% 80% at 50% 18%, rgba(18,26,90,.85) 0%, rgba(6,8,30,.55) 40%, transparent 70%),
      #04040a;
    transform:translate3d(0,0,0);
    will-change:transform;
  }

  /* mesh layer holds the drifting blurred color orbs */
  .mesh{
    position:absolute;inset:-12%;
    z-index:0;
    filter:blur(70px) saturate(1.15);
    pointer-events:none;
    will-change:transform;
  }
  .orb{
    position:absolute;border-radius:50%;
    mix-blend-mode:screen;
    opacity:.95;
    will-change:transform, opacity;
  }
  /* electric core — sits high-center */
  .orb-1{
    width:62vmin;height:62vmin;left:50%;top:24%;transform:translate(-50%,-50%);
    background:radial-gradient(circle at 50% 50%,
      rgba(170,190,255,.95) 0%,
      rgba(91,109,255,.78) 28%,
      rgba(46,64,210,.35) 55%,
      transparent 72%);
    animation:drift1 18s ease-in-out infinite alternate;
  }
  /* violet wing — left */
  .orb-2{
    width:55vmin;height:55vmin;left:18%;top:32%;
    background:radial-gradient(circle at 50% 50%,
      rgba(140,90,255,.85) 0%,
      rgba(80,40,200,.5) 35%,
      transparent 70%);
    animation:drift2 22s ease-in-out infinite alternate;
  }
  /* cyan wing — right */
  .orb-3{
    width:50vmin;height:50vmin;left:78%;top:28%;
    background:radial-gradient(circle at 50% 50%,
      rgba(60,180,255,.78) 0%,
      rgba(20,90,220,.45) 38%,
      transparent 72%);
    animation:drift3 26s ease-in-out infinite alternate;
  }
  /* warm-magenta ember — drifts low for chromatic contrast */
  .orb-4{
    width:42vmin;height:42vmin;left:62%;top:62%;
    background:radial-gradient(circle at 50% 50%,
      rgba(220,90,200,.55) 0%,
      rgba(120,40,180,.3) 40%,
      transparent 72%);
    animation:drift4 20s ease-in-out infinite alternate;
  }
  /* tight bright nucleus — punches through */
  .orb-5{
    width:24vmin;height:24vmin;left:50%;top:30%;transform:translate(-50%,-50%);
    background:radial-gradient(circle at 50% 50%,
      rgba(255,255,255,.55) 0%,
      rgba(180,200,255,.4) 40%,
      transparent 70%);
    filter:blur(0);
    animation:pulseCore 7s ease-in-out infinite alternate;
  }
  @keyframes drift1{
    0%  {transform:translate(-50%,-50%) scale(1)   rotate(0deg)}
    50% {transform:translate(-48%,-54%) scale(1.08) rotate(8deg)}
    100%{transform:translate(-53%,-47%) scale(.96)  rotate(-6deg)}
  }
  @keyframes drift2{
    0%  {transform:translate(0,0) scale(1)}
    50% {transform:translate(8vmin,-4vmin) scale(1.12)}
    100%{transform:translate(-4vmin,5vmin) scale(.92)}
  }
  @keyframes drift3{
    0%  {transform:translate(0,0) scale(1)}
    50% {transform:translate(-9vmin,3vmin) scale(1.08)}
    100%{transform:translate(5vmin,-6vmin) scale(.94)}
  }
  @keyframes drift4{
    0%  {transform:translate(0,0) scale(.95);opacity:.55}
    50% {transform:translate(-6vmin,-3vmin) scale(1.1);opacity:.75}
    100%{transform:translate(7vmin,4vmin) scale(1);opacity:.5}
  }
  @keyframes pulseCore{
    0%  {transform:translate(-50%,-50%) scale(1);opacity:.85}
    50% {transform:translate(-50%,-50%) scale(1.18);opacity:1}
    100%{transform:translate(-50%,-50%) scale(.94);opacity:.7}
  }

  /* chromatic shimmer — slow-rotating conic, low opacity */
  .shimmer{
    position:absolute;inset:-30%;z-index:0;
    background:conic-gradient(from 0deg at 50% 35%,
      rgba(91,109,255,0)   0deg,
      rgba(91,109,255,.18) 60deg,
      rgba(140,90,255,.10) 130deg,
      rgba(60,180,255,.14) 220deg,
      rgba(220,90,200,.08) 300deg,
      rgba(91,109,255,0)   360deg);
    mix-blend-mode:screen;
    filter:blur(60px);
    animation:shimmerSpin 40s linear infinite;
    opacity:.7;
    pointer-events:none;
  }
  @keyframes shimmerSpin{to{transform:rotate(360deg)}}

  /* soft light scrim — lifts dark copy off the photo without washing it out */
  .vignette{
    position:absolute;inset:0;z-index:2;pointer-events:none;
    background:
      linear-gradient(180deg, rgba(255,255,255,.38) 0%, rgba(255,255,255,.10) 26%, rgba(255,255,255,0) 50%),
      radial-gradient(120% 80% at 50% 40%, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 55%);
  }

  /* very soft grain so gradients don't band */
  .grain{
    position:absolute;inset:0;pointer-events:none;z-index:1;
    background-image: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='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.06 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    mix-blend-mode:overlay;opacity:.55;
  }

  /* horizon scan line — removed */

  /* ─────────── header ─────────── */
  header{
    position:relative;z-index:5;
    display:flex;align-items:center;justify-content:space-between;
    padding:22px var(--page-pad) 0;
    color:#16244f;
  }
  .brand{display:flex;align-items:center;gap:10px;font-weight:500;letter-spacing:-.01em}
  .brand-mark{
    width:40px;height:40px;
    background:url("../assets/tgscore-logo.png") center/contain no-repeat;
    filter:drop-shadow(0 0 14px rgba(91,109,255,.45));
    flex:none;
  }
  nav{
    display:flex;gap:42px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
    color:rgba(20,30,70,.72);
  }
  nav a{color:inherit;text-decoration:none;position:relative;padding:6px 0;transition:color .25s}
  nav a:hover{color:#1b2bd6}
  nav a::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
    background:linear-gradient(90deg,transparent,#1b2bd6,transparent);
    transform:scaleX(0);transform-origin:center;transition:transform .35s ease;
  }
  nav a:hover::after{transform:scaleX(1)}
  .lang{font-size:12px;color:rgba(20,30,70,.6);cursor:pointer}
  .lang:hover{color:#16244f}

  /* ─────────── hero ─────────── */
  main{
    position:relative;z-index:4;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    min-height:calc(100dvh - 64px);
    padding:clamp(32px, 5vw, 56px) var(--page-pad) 72px;
    text-align:center;
  }
  h1{
    font-weight:400;
    font-size:var(--step-5);
    line-height:1.05;
    letter-spacing:-.025em;
    max-width:1100px;
    color:#13225c;
    text-shadow:0 1px 22px rgba(255,255,255,.6), 0 1px 2px rgba(255,255,255,.45);
    text-wrap:balance;
  }
  h1 .em{
    font-family:"Lora",serif;
    font-style:italic;
    font-weight:500;
    color:#2f44cf;
    position:relative;
    padding:0 .06em;
  }
  /* dotted underline beneath italic words */
  h1 .em::after{
    content:"";
    position:absolute;left:.06em;right:.06em;bottom:-.12em;height:6px;
    background-image:radial-gradient(circle, rgba(79,99,224,.95) 1px, transparent 1.3px);
    background-size:7px 6px;background-repeat:repeat-x;background-position:0 50%;
    transform:scaleX(0);transform-origin:left center;
    animation:drawUnder .9s ease-out forwards;
    animation-delay:1.1s;
  }
  h1 .em.delay::after{animation-delay:1.4s}
  @keyframes drawUnder{to{transform:scaleX(1)}}

  /* reveal headline word by word */
  .word{display:inline-block;opacity:0;transform:translateY(14px);filter:blur(6px);
    animation:wordIn .8s cubic-bezier(.2,.7,.2,1) forwards}
  @keyframes wordIn{to{opacity:1;transform:none;filter:blur(0)}}

  /* ─────────── CTA prompt (above input) ─────────── */
  .cta-prompt{
    margin-top:var(--space-8);
    display:inline-flex;align-items:center;gap:10px;
    font-size:var(--step-0);font-weight:500;letter-spacing:-.005em;line-height:1;
    color:#fff;
    padding:10px 18px 10px 14px;
    border-radius:999px;
    background:
      linear-gradient(180deg, rgba(120,135,255,.28) 0%, rgba(91,109,255,.14) 100%),
      rgba(20,22,42,.35);
    border:1px solid rgba(168,178,255,.38);
    box-shadow:
      0 10px 32px -12px rgba(91,109,255,.65),
      0 0 0 1px rgba(91,109,255,.18),
      inset 0 1px 0 rgba(255,255,255,.18);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
    opacity:0;transform:translateY(10px);
    animation:fieldIn .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:.55s;
    text-shadow:0 1px 18px rgba(91,109,255,.45);
  }
  .cta-dot{
    width:8px;height:8px;border-radius:999px;flex:none;
    background:radial-gradient(circle at 30% 30%, #fff 0%, #c4ccff 55%, #5b6dff 100%);
    box-shadow:0 0 0 3px rgba(91,109,255,.18), 0 0 14px rgba(168,178,255,.85);
    animation:ctaDotPulse 2.2s ease-in-out infinite;
  }
  @keyframes ctaDotPulse{
    0%,100%{box-shadow:0 0 0 3px rgba(91,109,255,.18), 0 0 14px rgba(168,178,255,.55)}
    50%{box-shadow:0 0 0 5px rgba(91,109,255,.10), 0 0 22px rgba(168,178,255,1)}
  }

  /* ─────────── input ─────────── */
  .search{
    margin-top:clamp(28px, 5vw, 56px);
    width:min(720px,100%);
    background:
      linear-gradient(180deg, rgba(220,228,255,.55) 0%, rgba(255,255,255,0) 38%),
      rgba(255,255,255,.97);
    backdrop-filter:blur(8px);
    border:1px solid rgba(255,255,255,.7);
    border-radius:var(--radius-lg);
    padding:14px 14px 14px 20px;
    box-shadow:
      0 30px 60px -20px rgba(20,30,90,.35),
      0 10px 30px -15px rgba(91,109,255,.4),
      inset 0 0 0 1px rgba(255,255,255,.6),
      inset 0 1px 0 rgba(255,255,255,.9);
    display:flex;flex-direction:column;gap:var(--space-3);
    position:relative;overflow:hidden;
    opacity:0;transform:translateY(18px);
    animation:fieldIn .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:.7s;
  }
  /* scanning beam along bottom edge — plays on focus */
  .search::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
    background:linear-gradient(90deg, transparent 0%, rgba(91,109,255,0) 20%, rgba(91,109,255,.9) 50%, rgba(91,109,255,0) 80%, transparent 100%);
    transform:translateX(-100%);opacity:0;
  }
  .search:focus-within::after{
    animation:scanBeam 1.6s ease-in-out infinite;opacity:1;
  }
  @keyframes scanBeam{
    0%{transform:translateX(-100%)}
    100%{transform:translateX(100%)}
  }
  @keyframes fieldIn{to{opacity:1;transform:none}}
  .search:focus-within{
    box-shadow:
      0 30px 60px -18px rgba(20,30,90,.45),
      0 0 0 4px rgba(91,109,255,.18),
      0 12px 36px -10px rgba(91,109,255,.55),
      inset 0 0 0 1px rgba(91,109,255,.35);
  }
  .search-header{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding-bottom:12px;
    position:relative;
  }
  .search-header::after{
    content:"";position:absolute;left:-4px;right:-4px;bottom:0;height:1px;
    background:linear-gradient(90deg, rgba(10,10,18,.10) 0%, rgba(91,109,255,.30) 60%, rgba(91,109,255,.55) 100%);
  }
  .cta-label{
    font-size:var(--step-1);color:var(--ink);letter-spacing:-.014em;font-weight:400;
  }
  /* clickable ghost prompt — overlays the input when empty */
  .input-wrap{position:relative;flex:1;min-width:0;display:flex;align-items:center}
  .ghost{
    position:absolute;inset:0;display:flex;align-items:center;
    pointer-events:none;
    z-index:2;
    font-size:var(--step-0);letter-spacing:-.008em;color:#9a9aa6;
    padding:10px 0;
    transition:opacity .2s ease;
    white-space:nowrap;overflow:hidden;
  }
  .ghost.is-hidden{opacity:0;visibility:hidden}
  .ghost .fill{
    appearance:none;background:transparent;border:0;
    font:inherit;font-size:inherit;letter-spacing:inherit;
    pointer-events:auto;cursor:pointer;
    color:rgba(10,10,18,.72);
    text-decoration:underline dotted rgba(10,10,18,.6);
    text-decoration-thickness:1.5px;
    text-underline-offset:4px;
    transition:color .2s ease, text-decoration-color .2s ease;
    padding:0 1px;line-height:1.2;
  }
  .ghost .fill:hover{color:#1b2bd6;text-decoration-color:rgba(27,43,214,.75)}
  .badge{
    display:inline-flex;align-items:center;gap:6px;
    font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
    color:#3a3a48;
    background:#f1f1f6;border:1px solid rgba(10,10,18,.06);
    padding:4px 9px;border-radius:999px;white-space:nowrap;
  }
  .badge-dot{
    width:6px;height:6px;border-radius:50%;
    background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18);
    animation:pulse 1.8s infinite;
  }
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.5)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
  .search-row{display:flex;align-items:center;gap:var(--space-3);padding-top:2px;min-height:var(--control-h-lg)}
  .input-icon{
    flex:none;width:22px;height:22px;color:#9a9aa6;
    display:grid;place-items:center;
    transition:color .3s ease, transform .3s ease;
  }
  .search:focus-within .input-icon{color:var(--halo-1);transform:scale(1.05)}
  .search input{
    flex:1;min-width:0;
    background:transparent;border:0;outline:0;
    font:inherit;color:var(--ink);
    font-size:var(--step-1);letter-spacing:-.01em;
    padding:10px 0;
    position:relative;z-index:1;
  }
  .search input::placeholder{color:transparent}
  /* ─── 2026 Liquid-glass CTA button ─── */
  .submit{
    --mx:50%; --my:50%;
    --r:16px;
    flex:none;height:var(--control-h-md);padding:0 18px 0 22px;border:0;cursor:pointer;
    border-radius:var(--radius-md);
    color:#fff;
    display:inline-flex;align-items:center;gap:10px;
    font:inherit;font-size:var(--step-0);font-weight:500;letter-spacing:-.005em;
    position:relative;isolation:isolate;
    background:
      radial-gradient(120% 180% at 50% 120%, rgba(60,180,255,.55) 0%, rgba(91,109,255,.35) 35%, transparent 65%),
      linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 40%),
      linear-gradient(140deg, #5b46d8 0%, #4759e6 38%, #3b6fea 72%, #2f8be8 100%);
    box-shadow:
      /* close shadow — anchors button */
      0 1px 0 rgba(255,255,255,.45) inset,
      0 -10px 18px -10px rgba(20,20,80,.55) inset,
      /* multi-color aurora cast */
      0 12px 28px -10px rgba(91,109,255,.65),
      0 18px 40px -14px rgba(140,90,255,.55),
      0 22px 48px -18px rgba(60,180,255,.55),
      /* hairline */
      0 0 0 .5px rgba(255,255,255,.35) inset;
    transition:
      transform .35s cubic-bezier(.2,.7,.2,1),
      border-radius .45s cubic-bezier(.2,.7,.2,1),
      box-shadow .35s ease,
      filter .35s ease;
    overflow:visible;
  }
  /* aurora halo — soft multi-color glow behind the button */
  .submit::before{
    content:"";position:absolute;inset:-14px;z-index:-2;
    border-radius:inherit;
    background:
      radial-gradient(60% 80% at 20% 40%, rgba(140,90,255,.55), transparent 70%),
      radial-gradient(60% 80% at 80% 60%, rgba(60,180,255,.55), transparent 70%),
      radial-gradient(80% 80% at 50% 100%, rgba(255,120,210,.40), transparent 70%);
    filter:blur(18px) saturate(1.1);
    opacity:.55;
    transition:opacity .35s ease, filter .35s ease, inset .35s ease;
    pointer-events:none;
  }
  /* chromatic conic ring — 1px animated border via mask */
  .submit::after{
    content:"";position:absolute;inset:0;z-index:1;
    border-radius:inherit;
    padding:1px;
    background:conic-gradient(from 180deg,
      rgba(255,255,255,.7) 0deg,
      rgba(168,178,255,.55) 90deg,
      rgba(140,160,255,.45) 180deg,
      rgba(168,178,255,.55) 270deg,
      rgba(255,255,255,.7) 360deg);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
            mask-composite:exclude;
    pointer-events:none;
    opacity:.85;
  }
  /* register the custom prop so it can animate */
  @property --ring-rot{syntax:'<angle>';inherits:false;initial-value:0deg}

  /* inner glass layers — top sheen + cursor-tracked specular */
  .submit .glass{
    position:absolute;inset:0;border-radius:inherit;overflow:hidden;
    pointer-events:none;z-index:0;
  }
  /* frosted top highlight (liquid-glass crown) */
  .submit .glass::before{
    content:"";position:absolute;left:0;right:0;top:0;height:55%;
    background:linear-gradient(180deg, rgba(255,255,255,.32) 0%, rgba(255,255,255,.10) 45%, rgba(255,255,255,0) 100%);
    opacity:.85;
    pointer-events:none;
  }
  /* cursor-tracked specular highlight */
  .submit .glass::after{
    content:"";position:absolute;inset:-20%;
    background:radial-gradient(120px 80px at var(--mx) var(--my), rgba(255,255,255,.55), rgba(255,255,255,.0) 60%);
    mix-blend-mode:screen;
    opacity:0;
    transition:opacity .25s ease;
  }
  .submit:hover .glass::after{opacity:1}

  /* sheen sweep — independent traveling reflection */
  .submit .sheen{
    position:absolute;inset:0;border-radius:inherit;overflow:hidden;
    pointer-events:none;z-index:0;
  }
  .submit .sheen::before{
    content:"";position:absolute;top:-10%;bottom:-10%;left:-30%;width:30%;
    background:linear-gradient(105deg, transparent 0%, rgba(255,255,255,.0) 20%, rgba(255,255,255,.55) 50%, rgba(255,255,255,.0) 80%, transparent 100%);
    transform:translateX(0) skewX(-18deg);
    filter:blur(2px);
    transition:transform .8s cubic-bezier(.4,.0,.3,1);
  }
  .submit:hover .sheen::before{
    transform:translateX(620%) skewX(-18deg);
  }

  /* label + arrow */
  .submit .label,
  .submit .arrow{position:relative;z-index:2;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .submit .arrow{display:inline-grid;place-items:center;width:16px;height:16px}
  .submit .arrow svg{display:block}
  .submit .check{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.6);transition:opacity .25s, transform .35s cubic-bezier(.2,.7,.2,1);z-index:2;pointer-events:none}
  .submit .spinner{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:opacity .2s;z-index:2;pointer-events:none}
  .submit .spinner svg{animation:spin 1s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}

  /* hover — rise, morph, intensify aurora */
  .submit:hover{
    transform:translateY(-2px);
    border-radius:20px 18px 22px 16px;
    filter:saturate(1.08) brightness(1.04);
    box-shadow:
      0 1px 0 rgba(255,255,255,.55) inset,
      0 -10px 18px -10px rgba(20,20,80,.55) inset,
      0 18px 36px -10px rgba(91,109,255,.85),
      0 24px 52px -14px rgba(140,90,255,.75),
      0 30px 60px -18px rgba(60,180,255,.65),
      0 0 0 .5px rgba(255,255,255,.45) inset;
  }
  .submit:hover::before{
    opacity:.95;
    filter:blur(22px) saturate(1.2);
    inset:-22px;
  }
  .submit:hover .arrow{transform:translateX(4px)}
  /* tactile press */
  .submit:active{
    transform:translateY(0) scale(.985);
    border-radius:14px;
    transition-duration:.12s;
  }
  /* keyboard focus ring */
  .submit:focus-visible{
    outline:none;
    box-shadow:
      0 0 0 3px rgba(255,255,255,.8),
      0 0 0 6px rgba(91,109,255,.55),
      0 18px 36px -10px rgba(91,109,255,.85),
      0 24px 52px -14px rgba(140,90,255,.75);
  }

  /* loading & success states (toggled via JS class, no innerHTML wipe) */
  .submit.is-loading .label,
  .submit.is-loading .arrow{opacity:0;transform:translateY(-2px)}
  .submit.is-loading .spinner{opacity:1}
  .submit.is-loading{cursor:progress}

  .submit.is-done{
    background:
      radial-gradient(120% 180% at 50% 120%, rgba(80,220,160,.55) 0%, rgba(40,180,120,.35) 35%, transparent 65%),
      linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 40%),
      linear-gradient(140deg, #10a36a 0%, #1cb87a 50%, #34d39a 100%);
    box-shadow:
      0 1px 0 rgba(255,255,255,.45) inset,
      0 -10px 18px -10px rgba(8,60,40,.55) inset,
      0 12px 28px -10px rgba(34,197,94,.6),
      0 18px 40px -14px rgba(34,197,94,.45),
      0 0 0 .5px rgba(255,255,255,.35) inset;
  }
  .submit.is-done .label,
  .submit.is-done .arrow,
  .submit.is-done .spinner{opacity:0}
  .submit.is-done .check{opacity:1;transform:scale(1)}

  /* on small screens — keep proportions */
  @media (max-width:760px){
    .submit{height:42px;padding:0;width:42px;justify-content:center}
    .submit .label{display:inline}
  }

  /* ─────────── preview report (mini) ─────────── */
  .preview-report{
    width:min(720px,100%);
    margin-top:auto;
    margin-bottom:clamp(44px, 7vh, 72px);
    background:
      linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(244,248,255,.80) 100%);
    border:1px solid rgba(255,255,255,.75);
    border-radius:var(--radius-lg);
    padding:18px 22px;
    color:#16244f;
    text-align:left;
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    box-shadow:
      0 20px 50px -22px rgba(10,18,60,.45),
      0 10px 24px -14px rgba(91,109,255,.30),
      inset 0 1px 0 rgba(255,255,255,.9);
    position:relative;
    opacity:0;transform:translateY(18px);
    animation:fieldIn .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:.95s;
  }
  /* subtle connector tab on top edge */
  .preview-report::before{
    content:"Пример отчёта";
    position:absolute;top:-10px;left:24px;
    font-size:var(--step--2);letter-spacing:.18em;text-transform:uppercase;
    color:rgba(49,66,196,.95);
    background:rgba(255,255,255,.92);
    padding:3px 10px;border-radius:999px;
    border:1px solid rgba(49,66,196,.22);
  }
  /* CSS-generated label — swapped via the [lang] attr the i18n engine sets */
  html[lang="en"] .preview-report::before{content:"Report preview"}
  .pr-head{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding-bottom:14px;margin-bottom:14px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .pr-channel{
    display:flex;align-items:center;gap:10px;
    font-size:var(--step--1);color:rgba(255,255,255,.78);letter-spacing:-.005em;
  }
  .pr-channel-avatar{
    width:22px;height:22px;border-radius:50%;flex:none;
    background:conic-gradient(from 200deg, #5b6dff, #8c5aff, #3cb4ff, #5b6dff);
    border:1px solid rgba(255,255,255,.2);
  }
  .pr-channel b{color:#fff;font-weight:500}
  .pr-meta{
    font-size:var(--step--2);letter-spacing:.14em;text-transform:uppercase;
    color:rgba(255,255,255,.45);
    display:inline-flex;align-items:center;gap:7px;
  }
  .pr-meta .live-dot{
    width:6px;height:6px;border-radius:50%;
    background:#3ddb8a;
    box-shadow:0 0 0 3px rgba(61,219,138,.15);
    animation:pulse 2s infinite;
  }

  .pr-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1.3fr;
    gap:0;
  }
  .pr-cell{
    padding:8px 18px;
    display:flex;flex-direction:column;gap:var(--space-2);
    border-left:1px solid rgba(20,30,70,.1);
  }
  .pr-cell:first-child{border-left:0;padding-left:0}
  .pr-cell:last-child{padding-right:0}
  .pr-k{
    font-size:var(--step--2);letter-spacing:.14em;text-transform:uppercase;
    color:rgba(20,30,70,.5);font-weight:500;
  }
  .pr-v{
    font-size:var(--step-2);font-weight:400;letter-spacing:-.02em;color:#16244f;line-height:1;
    font-variant-numeric:tabular-nums;
    display:flex;align-items:baseline;gap:3px;
  }
  .pr-v .small{font-size:var(--step--1);color:rgba(20,30,70,.45);letter-spacing:-.005em;font-weight:400}
  .pr-v.score strong{
    font-size:clamp(24px, 2vw, 28px);font-weight:500;
    background:linear-gradient(180deg,#3142c4 0%,#5b6dff 110%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .pr-v.low{
    color:#1f9d63;font-size:var(--step-1);
    display:inline-flex;align-items:center;gap:7px;
  }
  .pr-v.low::before{
    content:"";width:8px;height:8px;border-radius:50%;
    background:#3ddb8a;box-shadow:0 0 12px rgba(61,219,138,.6);
  }
  .pr-v.rec{
    color:#16244f;font-size:var(--step-1);font-weight:500;letter-spacing:-.012em;
    line-height:1.15;
    display:inline-flex;align-items:center;gap:8px;
    text-wrap:balance;
  }
  .pr-v.rec .rec-icon{
    flex:none;width:22px;height:22px;border-radius:50%;
    background:rgba(61,219,138,.22);
    color:#1f9d63;display:grid;place-items:center;
    border:1px solid rgba(61,219,138,.5);
  }

  /* score gauge dot row */
  .pr-bar{
    margin-top:4px;height:3px;border-radius:2px;
    background:rgba(20,30,70,.12);overflow:hidden;
  }
  .pr-bar .fill{
    display:block;height:100%;width:0;
    background:linear-gradient(90deg, #5b6dff, #a8b2ff);
    border-radius:2px;
    animation:prFill 1.2s cubic-bezier(.2,.7,.2,1) forwards;
    animation-delay:1.5s;
  }
  @keyframes prFill{to{width:82%}}

  /* verdict footer */
  .pr-verdict{
    margin-top:14px;padding:12px 14px;
    border-radius:var(--radius-md);
    background:
      linear-gradient(90deg, rgba(61,219,138,.16) 0%, rgba(61,219,138,.04) 100%);
    border:1px solid rgba(61,219,138,.28);
    display:flex;align-items:center;gap:12px;
    font-size:var(--step-0);letter-spacing:-.005em;
  }
  .pr-verdict-icon{
    flex:none;width:26px;height:26px;border-radius:50%;
    background:rgba(61,219,138,.18);
    color:#7dd9a8;display:grid;place-items:center;
    border:1px solid rgba(61,219,138,.45);
  }
  .pr-verdict-label{
    font-size:var(--step--2);letter-spacing:.16em;text-transform:uppercase;
    color:rgba(125,217,168,.85);
    display:block;line-height:1;margin-bottom:3px;
  }
  .pr-verdict-text{
    color:#fff;font-weight:500;letter-spacing:-.01em;line-height:1.2;
    font-size:var(--step-0);
  }
  .pr-verdict-text .alt{color:rgba(255,255,255,.4);font-weight:400;font-size:var(--step--1);margin-left:4px}
  .pr-verdict-cta{
    margin-left:auto;flex:none;
    font-size:var(--step--1);letter-spacing:.06em;
    color:rgba(255,255,255,.55);text-transform:uppercase;
    display:inline-flex;align-items:center;gap:4px;
  }
  @media (max-width:760px){
    .preview-report{margin-top:auto;margin-bottom:0;padding:16px 16px}
    .preview-report::before{left:18px}
    .pr-grid{grid-template-columns:1fr 1fr;gap:0}
    .pr-risk{display:none}
    .pr-cell{padding:10px 12px;border-left:0;border-top:1px solid rgba(20,30,70,.08)}
    .pr-score{border-top:0;padding-left:0}
    .pr-rec-cell{grid-column:auto;border-top:0;border-left:1px solid rgba(20,30,70,.08);padding-right:0}
    .pr-k{font-size:9px;letter-spacing:.1em;white-space:nowrap}
    .pr-v{font-size:19px}
    .pr-v.score strong{font-size:24px}
    .pr-v.rec{font-size:15px}
  }
  @media (prefers-reduced-motion: reduce){
    .preview-report{opacity:1;transform:none;animation:none}
    .pr-bar .fill{animation:none;width:82%}
  }

  /* ─────────── foot strip ─────────── */
  .foot{
    position:absolute;left:0;right:0;bottom:0;z-index:5;
    display:flex;align-items:center;justify-content:center;
    padding:0 var(--page-pad) 28px;
    color:var(--ink);
    text-align:center;
  }
  .micro{
    max-width:640px;font-size:var(--step-0);line-height:1.55;color:rgba(20,30,70,.82);font-weight:400;
    letter-spacing:-.005em;
  }
  .micro b{color:#16244f;font-weight:600}
  .micro .save{
    position:relative;color:#1b2bd6;font-weight:600;
    white-space:nowrap;
  }
  .micro .save::after{
    content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;
    background:linear-gradient(90deg, rgba(140,160,255,.2) 0%, rgba(140,160,255,.95) 50%, rgba(140,160,255,.2) 100%);
    transform:scaleX(0);transform-origin:left center;
    animation:saveLine .9s cubic-bezier(.2,.7,.2,1) forwards;
    animation-delay:1.6s;
  }
  @keyframes saveLine{to{transform:scaleX(1)}}

  /* ─────────── sections ─────────── */
  .section{
    position:relative;z-index:5;
    background:#06060b;
    padding:var(--section-pad) var(--page-pad);
    color:#fff;
    border-top:1px solid rgba(255,255,255,.06);
  }
  .section-inner{max-width:var(--container);margin:0 auto}
  #how{
    --flight-progress:0;
    --flight-opacity:0;
    --flight-x:0px;
    --flight-y:0px;
    --flight-rotate:0deg;
    --flight-scale:.9;
    --trail-x:0px;
    --trail-y:0px;
    --trail-rotate:0deg;
    overflow:hidden;
    isolation:isolate;
  }
  #how .section-inner{
    position:relative;
    z-index:2;
  }
  .how-flight{
    display:none;
  }
  .eyebrow{
    font-size:var(--step--2);letter-spacing:.18em;text-transform:uppercase;
    color:rgba(255,255,255,.55);
    display:inline-flex;align-items:center;gap:10px;
    padding:0 0 24px;
  }
  .eyebrow::before{
    content:"";width:24px;height:1px;background:rgba(255,255,255,.35);display:inline-block;
  }
  .section-title{
    font-size:var(--step-4);
    font-weight:400;letter-spacing:-.025em;line-height:1.05;
    max-width:880px;
    text-wrap:balance;
    margin-bottom:64px;
  }
  .section-title.has-lede{margin-bottom:18px}
  .section-lede{
    font-size:var(--step-1);
    line-height:1.5;letter-spacing:-.005em;
    color:rgba(255,255,255,.6);
    max-width:620px;
    margin-bottom:64px;
  }
  .section-title .em{
    font-family:"Lora",serif;font-style:italic;font-weight:500;
    color:#a8b2ff;
  }
  .section-title .hl{color:#a8b2ff}

  /* ─── How it works ─── */
  @media (min-width:761px){
    .how-flight{
      position:absolute;
      inset:0;
      z-index:1;
      display:block;
      pointer-events:none;
      opacity:var(--flight-opacity);
    }
    .how-flight::before{
      content:"";
      position:absolute;
      width:46vw;
      height:2px;
      left:0;
      top:0;
      border-radius:999px;
      background:linear-gradient(90deg, transparent, rgba(42,171,238,.12), rgba(168,178,255,.30), transparent);
      filter:blur(.5px);
      transform:
        translate3d(
          var(--trail-x),
          var(--trail-y),
          0
        )
        rotate(var(--trail-rotate));
      transform-origin:100% 50%;
    }
    .how-plane{
      position:absolute;
      width:clamp(112px, 13vw, 176px);
      left:0;
      top:0;
      filter:
        drop-shadow(0 18px 28px rgba(42,171,238,.18))
        drop-shadow(0 0 30px rgba(168,178,255,.18));
      transform:
        translate3d(
          var(--flight-x),
          var(--flight-y),
          0
        )
        rotate(var(--flight-rotate))
        scale(var(--flight-scale));
      will-change:transform, opacity;
    }
    .plane-main{
      fill:rgba(245,247,255,.92);
      stroke:rgba(168,178,255,.42);
      stroke-width:1.6;
      stroke-linejoin:round;
    }
    .plane-fold{
      fill:rgba(213,221,255,.68);
    }
    .plane-wing{
      fill:rgba(166,190,255,.45);
    }
    .plane-highlight{
      fill:rgba(255,255,255,.42);
    }
  }
  .how-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:1px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-lg);
    overflow:hidden;
  }
  .how-step{
    background:#0a0a12;
    padding:clamp(24px, 3vw, 36px) clamp(20px, 2.4vw, 28px);
    display:flex;
    flex-direction:column;
    gap:var(--space-4);
    position:relative;
    min-height:clamp(220px, 24vw, 280px);
    transition:background .35s ease;
  }
  .how-step:hover{background:#0e0e1a}
  .how-num{
    font-family:"Lora",serif;font-style:italic;font-weight:500;
    font-size:clamp(24px, 2.2vw, 28px);color:rgba(168,178,255,.85);
    letter-spacing:-.02em;
  }
  .how-step h3{
    font-size:var(--step-2);font-weight:500;letter-spacing:-.015em;line-height:1.25;
    color:#fff;
    align-self:start;
  }
  .how-step p{
    font-size:var(--step-0);line-height:1.55;color:rgba(255,255,255,.6);
    letter-spacing:-.005em;
    align-self:start;
  }
  /* ─── Pricing ─── */
  .price-grid{
    display:grid;grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));gap:var(--space-4);
  }
  .plan{
    background:linear-gradient(180deg, rgba(20,22,42,.85) 0%, rgba(10,10,18,.95) 100%);
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-lg);
    padding:clamp(24px, 3vw, 32px) clamp(20px, 2.4vw, 28px) clamp(22px, 2.8vw, 28px);
    display:flex;flex-direction:column;gap:var(--space-5);
    position:relative;
    transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
  }
  .plan:hover{transform:translateY(-4px);border-color:rgba(168,178,255,.25)}
  .plan.featured{
    background:
      radial-gradient(120% 80% at 50% 0%, rgba(91,109,255,.25) 0%, transparent 60%),
      linear-gradient(180deg, rgba(28,30,68,.95) 0%, rgba(10,10,18,.95) 100%);
    border-color:rgba(168,178,255,.35);
    box-shadow:
      0 24px 48px -20px rgba(91,109,255,.45),
      inset 0 1px 0 rgba(255,255,255,.08);
  }
  .plan-heading{
    min-height:2.8em;
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;
    gap:8px;
  }
  .plan-discount{
    display:inline-flex;
    align-items:center;
    gap:10px;
    white-space:nowrap;
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
      radial-gradient(130% 160% at 18% 0%, rgba(94,234,212,.14) 0%, transparent 54%),
      linear-gradient(135deg, rgba(30,36,82,.86) 0%, rgba(17,22,53,.9) 48%, rgba(9,12,30,.94) 100%);
    color:#f8fbff;
    padding:10px 20px;border-radius:999px;
    border:1px solid rgba(94,234,212,.28);
    -webkit-backdrop-filter:blur(16px) saturate(155%);
    backdrop-filter:blur(16px) saturate(155%);
    box-shadow:
      0 0 0 1px rgba(91,109,255,.05),
      0 0 22px -12px rgba(94,234,212,.66),
      0 14px 34px -24px rgba(86,111,255,.9),
      inset 0 1px 0 rgba(255,255,255,.22),
      inset 0 -1px 0 rgba(94,234,212,.09);
  }
  .plan-discount::before{
    content:"";
    position:absolute;
    width:64px;height:44px;
    left:10px;top:50%;
    transform:translateY(-50%);
    background:radial-gradient(ellipse at center, rgba(94,234,212,.24) 0%, rgba(94,234,212,.09) 38%, transparent 70%);
    filter:blur(2px);
    z-index:-1;
  }
  .plan-discount b{
    font-size:15px;
    line-height:1;
    font-weight:900;
    letter-spacing:0;
    color:#7ee7c8;
    text-shadow:0 0 14px rgba(94,234,212,.28);
  }
  .plan-discount small{
    font-size:8px;
    line-height:1;
    font-weight:750;
    letter-spacing:.07em;
    text-transform:uppercase;
    color:rgba(246,248,255,.94);
  }
  .plan-name{
    font-size:var(--step-0);letter-spacing:.04em;color:rgba(255,255,255,.7);
    text-transform:uppercase;font-weight:500;line-height:1.1;
    min-width:0;
    white-space:nowrap;
  }
  .plan-price{
    display:flex;align-items:baseline;gap:6px;
    margin-top:-4px;
  }
  .plan-price .old-price{
    position:relative;
    display:inline-block;
    color:rgba(255,255,255,.42);
    font-size:var(--step-0);
    line-height:1;
    letter-spacing:-.005em;
    white-space:nowrap;
  }
  .plan-price .old-price::after{
    content:"";
    position:absolute;
    left:-2px;right:-2px;top:50%;
    height:1.2px;
    background:rgba(255,255,255,.46);
    transform:rotate(-14deg);
    transform-origin:center;
  }
  .plan-price .amount{
    font-size:clamp(36px, 4vw, 48px);font-weight:400;letter-spacing:-.03em;color:#fff;line-height:1;
    white-space:nowrap;
  }
  .plan-price .per{
    font-size:var(--step-0);color:rgba(255,255,255,.5);letter-spacing:-.005em;
  }
  .plan-desc{
    font-size:var(--step-0);line-height:1.55;color:rgba(255,255,255,.6);
    padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08);
  }
  .plan-features{list-style:none;display:flex;flex-direction:column;gap:var(--space-3);flex:1}
  .plan-features li{
    font-size:var(--step-0);color:rgba(255,255,255,.78);line-height:1.4;
    display:flex;gap:10px;align-items:flex-start;
    letter-spacing:-.003em;
  }
  .plan-features li::before{
    content:"";flex:none;width:14px;height:14px;border-radius:50%;
    background:radial-gradient(circle at 50% 50%, rgba(168,178,255,.9) 0%, rgba(91,109,255,.4) 50%, transparent 75%);
    margin-top:3px;
  }
  .plan-cta{
    margin-top:8px;
    appearance:none;border:1px solid rgba(255,255,255,.18);
    background:rgba(255,255,255,.04);
    color:#fff;font:inherit;font-size:var(--step-0);font-weight:500;letter-spacing:-.005em;
    min-height:var(--control-h-md);padding:0 18px;border-radius:var(--radius-md);cursor:pointer;
    transition:background .25s ease, border-color .25s ease, transform .25s ease;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
  }
  .plan-cta:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.32)}
  .plan.featured .plan-cta{
    background:linear-gradient(140deg, #5b46d8 0%, #4759e6 50%, #3b6fea 100%);
    border-color:rgba(168,178,255,.4);
    box-shadow:0 12px 28px -10px rgba(91,109,255,.65);
  }
  .plan.featured .plan-cta:hover{filter:brightness(1.08)}

  /* ─── Featured case (GPT-Психолог) ─── */
  .feature-case{
    position:relative;
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    overflow:visible;
    box-shadow:none;
  }
  .fc-head{
    display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;
    padding-bottom:var(--space-6);
    border-bottom:1px solid rgba(255,255,255,.08);
    margin-top:18px;
  }
  .fc-channel{
    display:flex;align-items:center;gap:14px;
  }
  .fc-avatar{
    width:40px;height:40px;border-radius:10px;
    background:#fff;
    border:1px solid rgba(255,255,255,.16);
    position:relative;flex:none;
    overflow:hidden;
    display:block;
  }
  .fc-avatar img{width:100%;height:100%;object-fit:cover;display:block}
  .fc-name a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(168,178,255,.35);transition:border-color .25s ease,color .25s ease}
  .fc-name a:hover{color:#a8b2ff;border-bottom-color:#a8b2ff}
  .fc-name{font-size:var(--step-1);font-weight:500;color:#fff;letter-spacing:-.012em;line-height:1.2}
  .fc-niche{font-size:var(--step--1);color:rgba(255,255,255,.55);letter-spacing:.04em;text-transform:uppercase;margin-top:4px}
  .fc-badges{display:flex;gap:8px;flex-wrap:wrap}
  .fc-badge{
    font-size:var(--step--2);letter-spacing:.14em;text-transform:uppercase;
    padding:0;border-radius:0;
    background:transparent;color:rgba(255,255,255,.55);
    border:0;
    display:inline-flex;align-items:center;gap:8px;
  }
  .fc-badge .num{color:#fff;font-weight:500;letter-spacing:-.005em;font-size:var(--step--1);text-transform:none}
  .fc-badge.solid{
    background:transparent;color:rgba(255,255,255,.55);border:0;
  }
  .fc-badge .dot{
    width:6px;height:6px;border-radius:50%;
    background:currentColor;opacity:.85;
  }
  .fc-title{
    margin-top:var(--space-8);
    font-size:var(--step-3);
    font-weight:400;letter-spacing:-.022em;line-height:1.15;
    color:#fff;text-wrap:balance;
    max-width:780px;
  }
  .fc-title .em{font-family:"Lora",serif;font-style:italic;font-weight:500;color:#fff;white-space:nowrap}
  .fc-sub{
    margin-top:var(--space-4);
    font-size:var(--step-0);line-height:1.55;letter-spacing:-.003em;
    color:rgba(255,255,255,.55);
    max-width:640px;
  }

  /* before / after — benchmark-bar style */
  .fc-ba{
    margin-top:clamp(36px, 4vw, 48px);
    display:flex;flex-direction:column;gap:var(--space-7);
  }
  .fc-metric-row{
    display:grid;grid-template-columns:minmax(180px, 220px) 1fr;gap:var(--space-6);align-items:center;
  }
  .fc-metric-lbl{
    font-size:var(--step-0);color:#fff;letter-spacing:-.005em;line-height:1.35;
  }
  .fc-metric-lbl .unit{
    display:block;margin-top:4px;
    font-size:var(--step--2);letter-spacing:.04em;text-transform:none;
    color:rgba(255,255,255,.4);
  }
  .fc-bars{display:flex;flex-direction:column;gap:8px;min-width:0}
  .fc-bar{
    display:grid;grid-template-columns:minmax(72px, 96px) minmax(90px, 1fr) minmax(58px, 80px);gap:var(--space-3);align-items:center;
    font-size:var(--step--1);color:rgba(255,255,255,.6);
  }
  .fc-bar .tag{
    letter-spacing:.14em;text-transform:uppercase;font-size:var(--step--2);
    color:rgba(255,255,255,.45);
  }
  .fc-bar.is-before .tag{color:#e89aa8}
  .fc-bar.is-after .tag{color:#9fd9b8}
  .fc-bar .track{
    position:relative;height:26px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.06);
    border-radius:4px;overflow:hidden;
  }
  .fc-bar .fill{
    position:absolute;inset:0 auto 0 0;width:var(--w,50%);
    background:linear-gradient(90deg, rgba(168,138,168,.55), rgba(168,138,168,.18));
  }
  .fc-bar.is-after .fill{
    background:linear-gradient(90deg, rgba(91,109,255,.65), rgba(91,109,255,.22));
  }
  .fc-bar .val{
    text-align:right;font-size:var(--step--1);color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.005em;
  }
  .fc-note{font-size:var(--step--1);line-height:1.55;color:rgba(255,255,255,.45);letter-spacing:-.003em;margin-top:8px;max-width:640px}

  /* KPI row — flat, gridded */
  .fc-kpis{
    margin-top:clamp(40px, 5vw, 56px);
    display:grid;grid-template-columns:repeat(3,1fr);gap:0;
    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .fc-kpi{
    background:transparent;
    border:0;
    border-left:1px solid rgba(255,255,255,.08);
    border-radius:0;
    padding:clamp(20px, 2.8vw, 28px) clamp(14px, 2.4vw, 24px);
    display:flex;flex-direction:column;gap:var(--space-3);
  }
  .fc-kpi:first-child{border-left:0}
  .fc-kpi .big{
    font-size:clamp(30px, 3.8vw, 44px);font-weight:400;letter-spacing:-.028em;color:#fff;line-height:1;
  }
  .fc-kpi .big .em{font-family:"Lora",serif;font-style:italic;font-weight:500;color:#fff}
  .fc-kpi .lbl{font-size:var(--step--1);color:rgba(255,255,255,.7);letter-spacing:-.004em;line-height:1.4;margin-top:4px}
  .fc-kpi .sub{font-size:var(--step--1);color:rgba(255,255,255,.4);letter-spacing:-.002em}

  /* quote — flat, no card */
  .fc-quote{
    margin-top:clamp(36px, 4vw, 48px);
    padding:0;
    background:transparent;border:0;border-radius:0;
    display:grid;grid-template-columns:minmax(160px, 220px) 1fr;gap:var(--space-6);align-items:flex-start;
    position:relative;
    max-width:none;
  }
  .fc-quote .mark{display:none}
  .fc-quote q{
    font-size:var(--step-1);line-height:1.55;letter-spacing:-.008em;
    color:rgba(255,255,255,.82);quotes:none;
    display:block;text-wrap:pretty;max-width:680px;
    font-weight:300;
  }
  .fc-quote q::before, .fc-quote q::after{content:""}
  .fc-quote-side{
    font-size:var(--step--2);letter-spacing:.16em;text-transform:uppercase;
    color:rgba(255,255,255,.4);
  }
  .fc-author{
    margin-top:22px;
    display:flex;align-items:center;gap:12px;
    font-size:var(--step--1);color:rgba(255,255,255,.5);letter-spacing:-.003em;
  }
  .fc-author .ava{
    width:42px;height:42px;border-radius:50%;
    object-fit:cover;display:block;flex:none;
    border:1px solid rgba(255,255,255,.14);
  }
  .fc-author .who{display:flex;flex-direction:column;line-height:1.35}
  .fc-author b{color:#fff;font-weight:500;font-size:var(--step-0)}

  /* CTA inside card */
  .fc-cta-wrap{
    margin-top:36px;
    display:flex;flex-direction:column;gap:10px;align-items:flex-start;
  }
  .fc-cta{
    appearance:none;border:0;cursor:pointer;
    font:inherit;font-size:var(--step-0);font-weight:500;letter-spacing:-.005em;
    color:#fff;
    background:linear-gradient(140deg, #5b46d8 0%, #4759e6 50%, #3b6fea 100%);
    min-height:var(--control-h-lg);padding:0 24px;border-radius:var(--radius-md);
    display:inline-flex;align-items:center;gap:10px;
    box-shadow:
      0 12px 28px -10px rgba(91,109,255,.65),
      0 18px 40px -14px rgba(140,90,255,.45),
      inset 0 1px 0 rgba(255,255,255,.18);
    transition:transform .25s ease, filter .25s ease, box-shadow .25s ease;
  }
  .fc-cta:hover{transform:translateY(-2px);filter:brightness(1.06)}
  .fc-cta:active{transform:translateY(0)}
  .fc-cta svg{display:block}
  .fc-cta-hint{
    font-size:var(--step--1);color:rgba(255,255,255,.5);letter-spacing:-.003em;line-height:1.5;
    max-width:520px;
  }

  @media (max-width:980px){
    .feature-case{padding:0;border-radius:0}
    .fc-metric-row{grid-template-columns:1fr;gap:12px}
    .fc-bar{grid-template-columns:72px 1fr 70px;gap:10px}
    .fc-kpis{grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid rgba(255,255,255,.08)}
    .fc-kpi{border-top:0;border-left:1px solid rgba(255,255,255,.08);padding:22px 14px}
    .fc-kpi:first-child{border-left:0}
    .fc-kpi .big{font-size:clamp(26px, 7vw, 38px)}
    .fc-kpi .lbl{font-size:12px;line-height:1.25}
    .fc-kpi .sub{font-size:11px;line-height:1.3}
    .fc-quote{grid-template-columns:1fr;gap:14px}
  }

  /* ─── Savings cases ─── */
  .cases-grid{
    display:grid;grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr));gap:var(--space-4);
  }
  .case{
    background:#0a0a12;
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-lg);
    padding:clamp(24px, 3vw, 32px) clamp(20px, 2.4vw, 28px);
    display:flex;flex-direction:column;gap:var(--space-5);
    transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease;
  }
  .case:hover{transform:translateY(-3px);border-color:rgba(168,178,255,.22)}
  .case-head{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08);
  }
  .case-channel{
    display:flex;align-items:center;gap:10px;
  }
  .case-avatar{
    width:36px;height:36px;border-radius:50%;
    background:conic-gradient(from 200deg, #5b6dff, #8c5aff, #3cb4ff, #5b6dff);
    border:1px solid rgba(255,255,255,.2);
  }
  .case-name{font-size:var(--step-0);font-weight:500;color:#fff;letter-spacing:-.005em}
  .case-meta{font-size:var(--step--2);color:rgba(255,255,255,.45);letter-spacing:.04em;text-transform:uppercase}
  .case-tag{
    font-size:var(--step--2);letter-spacing:.12em;text-transform:uppercase;
    padding:4px 9px;border-radius:999px;
    background:rgba(255,90,120,.12);color:#ff8aa0;
    border:1px solid rgba(255,90,120,.25);
    white-space:nowrap;
  }
  .case-tag.ok{background:rgba(60,200,140,.12);color:#7dd9a8;border-color:rgba(60,200,140,.25)}
  .case-stats{
    display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;
  }
  .stat-label{font-size:var(--step--2);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:4px}
  .stat-value{font-size:var(--step-2);font-weight:400;letter-spacing:-.02em;color:#fff;line-height:1.1}
  .stat-value .delta{font-size:var(--step--1);color:#7dd9a8;margin-left:6px;font-weight:500}
  .stat-value .delta.bad{color:#ff8aa0}
  .case-verdict{
    margin-top:auto;padding-top:20px;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:var(--step-0);line-height:1.5;letter-spacing:-.005em;
    color:rgba(255,255,255,.82);
  }
  .case-verdict .vlabel{
    display:block;
    font-size:var(--step--2);letter-spacing:.12em;text-transform:uppercase;
    color:rgba(168,178,255,.7);
    margin-bottom:8px;
    font-family:inherit;font-style:normal;font-weight:400;
  }
  .case-verdict .vamount{
    font-family:"Lora",serif;font-style:italic;font-weight:500;
    color:#a8b2ff;white-space:nowrap;
  }

  /* ─────────── mobile ─────────── */
  @media (max-width: 980px){
    .how-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    #price{overflow:hidden}
    #price .section-inner{max-width:none}
    #price .price-grid{
      display:flex;
      grid-template-columns:none;
      gap:12px;
      width:calc(100% + var(--page-pad));
      margin-right:calc(var(--page-pad) * -1);
      padding:2px var(--page-pad) 18px 0;
      overflow-x:auto;
      overflow-y:hidden;
      scroll-snap-type:x mandatory;
      scroll-padding-left:0;
      -webkit-overflow-scrolling:touch;
      scrollbar-width:none;
    }
    #price .price-grid::-webkit-scrollbar{display:none}
    #price .price-grid::after{
      content:"";
      flex:0 0 6px;
    }
    #price .plan{
      flex:0 0 clamp(250px, 30vw, 300px);
      min-height:0;
      scroll-snap-align:start;
    }
    #price .plan.featured{order:-1}
    .cases-grid{grid-template-columns:1fr;gap:var(--space-4)}
  }
  @media (max-width: 760px){
    :root{
      --page-pad:18px;
      --section-pad:72px;
      --step-5:clamp(32px, 9.2vw, 38px);
      --step-4:clamp(29px, 8.3vw, 36px);
      --step-3:clamp(24px, 6.8vw, 30px);
    }
    header{
      flex-wrap:nowrap;
      gap:8px;
      padding:16px var(--page-pad) 0;
    }
    .brand{
      gap:6px;
      font-size:12px;
      flex:none;
    }
    .brand-mark{width:32px;height:32px}
    nav{
      flex:1 1 auto;
      min-width:0;
      display:flex;
      justify-content:flex-end;
      gap:clamp(8px, 2.5vw, 14px);
      overflow-x:auto;
      padding:0;
      font-size:9px;
      letter-spacing:.07em;
      scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
    }
    nav::-webkit-scrollbar{display:none}
    nav a{flex:none}
    .lang{flex:none;font-size:11px}
    main{min-height:calc(100dvh - 56px);height:auto;justify-content:flex-start;padding:clamp(28px, 7vw, 44px) var(--page-pad) 96px}
    h1{line-height:1.06}
    .how-grid{
      grid-template-columns:1fr;
      gap:10px;
      background:transparent;
      border:0;
      border-radius:0;
      overflow:visible;
    }
    .how-step{
      display:grid;
      grid-template-columns:42px 1fr;
      gap:5px 12px;
      min-height:0;
      padding:14px 14px 15px;
      border:1px solid rgba(255,255,255,.09);
      border-radius:16px;
      background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
    }
    .how-num{
      grid-row:1 / 3;
      font-size:22px;
      line-height:1;
      padding-top:2px;
    }
    .how-step h3{font-size:15px;line-height:1.2;letter-spacing:-.01em}
    .how-step p{font-size:12.5px;line-height:1.38;color:rgba(255,255,255,.58)}
    .section-title{margin-bottom:var(--space-8)}
    .section-lede{margin-bottom:var(--space-8)}
    .search{margin-top:var(--space-7);padding:12px 12px 12px 16px;border-radius:18px}
    .cta-prompt{margin-top:var(--space-7);padding:8px 14px 8px 12px}
    .cta-prompt-text{max-width:78vw;line-height:1.25;text-align:left;text-wrap:balance}
    .search-row{flex-wrap:wrap;align-items:center;row-gap:12px;min-height:var(--control-h-sm)}
    .input-wrap{flex:1 1 calc(100% - 46px)}
    .search input{font-size:var(--step-0)}
    .ghost{font-size:var(--step--1)}
    .submit{
      flex:0 0 100%;
      width:100%;
      height:var(--control-h-md);
      padding:0 18px;
      justify-content:center;
      font-size:var(--step-0);
    }
    .submit .label{display:inline}
    .cta-label{font-size:var(--step-0);line-height:1.3}
    .search-header{flex-wrap:wrap;gap:6px}
    .example{font-size:11px}
    .preview-report{margin-top:clamp(36px, 16dvh, 132px);padding:16px;border-radius:18px}
    .pr-grid{grid-template-columns:1fr;gap:0}
    .pr-risk{display:flex}
    .pr-cell{padding:12px 0;border-left:0;border-top:1px solid rgba(20,30,70,.08)}
    .pr-score{border-top:0}
    .pr-rec-cell{grid-column:auto;border-left:0;padding-right:0}
    .pr-k{font-size:9.5px;letter-spacing:.1em;white-space:normal}
    .pr-v{font-size:19px}
    .pr-v.score strong{font-size:24px}
    .pr-v.rec{font-size:15px}
    .foot{position:absolute;padding:0 var(--page-pad) 18px}
    .micro{font-size:var(--step--1);line-height:1.45}
    /* keep the surfer/wave in frame when the photo is cropped to portrait */
    .stage{background-position:64% center}
    #case-gpt{padding-top:54px;padding-bottom:56px}
    #case-gpt .section-inner{padding:0 14px}
    #case-gpt .eyebrow{margin-left:4px}
    .feature-case{
      padding:18px 16px 20px;
      border:1px solid rgba(168,178,255,.14);
      border-radius:22px;
      background:
        radial-gradient(80% 60% at 50% 0%, rgba(91,109,255,.12), transparent 62%),
        linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
      box-shadow:0 24px 70px -48px rgba(91,109,255,.8);
      overflow:hidden;
    }
    .fc-head{margin-top:0;padding-bottom:16px;gap:10px;align-items:flex-start}
    .fc-channel{gap:10px;min-width:0}
    .fc-avatar{width:38px;height:38px;border-radius:11px}
    .fc-name{font-size:13.5px;line-height:1.25}
    .fc-badges{width:100%;margin-left:48px;margin-top:-3px}
    .fc-badge{font-size:9px;letter-spacing:.08em;gap:6px;white-space:nowrap}
    .fc-badge .num{font-size:12px;color:#a8b2ff}
    .fc-title{margin-top:20px;font-size:24px;line-height:1.1;letter-spacing:-.02em}
    .fc-title .em{white-space:normal}
    .fc-sub{
      margin-top:10px;font-size:13px;line-height:1.42;
      display:block;overflow:visible;
    }
    .fc-ba{display:none}
    .fc-metric-row{
      display:flex;flex-direction:column;gap:10px;min-width:0;
      padding:12px;border:1px solid rgba(255,255,255,.09);
      border-radius:15px;background:rgba(255,255,255,.04);
    }
    .fc-metric-lbl{font-size:12px;line-height:1.2}
    .fc-metric-lbl .unit{display:inline;margin-left:5px;font-size:9px;letter-spacing:.1em}
    .fc-bars{gap:8px}
    .fc-bar{display:grid;grid-template-columns:1fr auto;gap:4px 6px;padding-bottom:9px;font-size:11px}
    .fc-bar .tag{font-size:8.5px;letter-spacing:.1em;white-space:nowrap}
    .fc-bar .val{text-align:right;font-size:12px}
    .fc-bar .track{grid-column:1/-1;height:5px;border:0;border-radius:999px;background:rgba(255,255,255,.06)}
    .fc-bar .fill{border-radius:inherit}
    .fc-note{
      grid-column:1/-1;margin:0;padding:10px 12px;border-radius:14px;
      background:rgba(91,109,255,.1);border:1px solid rgba(91,109,255,.16);
      font-size:11.5px;line-height:1.35;color:rgba(255,255,255,.64);
    }
    .fc-kpis{
      margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px;
      padding:0;border:0;overflow:visible;
    }
    .fc-kpis::-webkit-scrollbar{display:none}
    .fc-kpi{
      border:1px solid rgba(255,255,255,.1);border-radius:15px;
      background:linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.024));
      padding:14px 12px;gap:6px;min-width:0;
    }
    .fc-kpi:first-child{border-top:1px solid rgba(255,255,255,.1)}
    .fc-kpi:nth-child(3){grid-column:1 / -1}
    .fc-kpi .big{font-size:27px;white-space:nowrap}
    .fc-kpi .lbl{font-size:12px;line-height:1.2}
    .fc-kpi .sub{font-size:10.5px;line-height:1.25;color:rgba(255,255,255,.44)}
    .fc-kpi:not(:nth-child(3)) .sub{display:block;margin-top:1px;color:rgba(168,178,255,.72)}
    .fc-quote{
      margin-top:18px;padding-top:18px;gap:10px;
      border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;
      background:transparent;position:relative;
    }
    .fc-quote-side{font-size:9.5px;letter-spacing:.12em;color:rgba(168,178,255,.64)}
    .fc-quote q{
      font-size:13.5px;line-height:1.48;color:rgba(255,255,255,.72);
      display:block;overflow:visible;max-width:none;
    }
    .fc-author{margin-top:14px;font-size:11px;gap:10px;color:rgba(255,255,255,.48)}
    .fc-author .ava{width:36px;height:36px}
    .fc-author b{font-size:12px}
  }

  /* tiny screens */
  @media (max-width:380px){
    h1{font-size:30px}
    main{padding-top:22px}
    .search{margin-top:26px}
    .fc-kpi{padding:16px 8px;gap:6px}
    .fc-kpi .big{font-size:22px;white-space:nowrap}
    .fc-kpi .lbl{font-size:10px}
    .fc-kpi .sub{font-size:9.5px}
    .chips{gap:6px}
    .chip{font-size:11px;padding:5px 8px}
  }

  /* mobile pricing: reduce vertical scan by turning full cards into a snap rail */
  @media (max-width:760px){
    #price{
      padding-top:54px;
      padding-bottom:64px;
      overflow:hidden;
    }
    #price .section-title{
      max-width:330px;
      margin-bottom:22px;
      font-size:clamp(26px, 7.4vw, 32px);
      line-height:1.08;
    }
    #price .section-inner{
      max-width:none;
    }
    #price .price-grid{
      display:flex;
      grid-template-columns:none;
      gap:12px;
      width:calc(100% + var(--page-pad));
      margin-right:calc(var(--page-pad) * -1);
      padding:2px var(--page-pad) 18px 0;
      overflow-x:auto;
      overflow-y:hidden;
      scroll-snap-type:x mandatory;
      scroll-padding-left:0;
      -webkit-overflow-scrolling:touch;
      scrollbar-width:none;
    }
    #price .price-grid::-webkit-scrollbar{display:none}
    #price .price-grid::after{
      content:"";
      flex:0 0 6px;
    }
    #price .plan{
      flex:0 0 min(82vw, 318px);
      min-height:0;
      scroll-snap-align:start;
      border-radius:18px;
      padding:18px 18px 20px;
      gap:14px;
      box-shadow:0 20px 56px -42px rgba(91,109,255,.7);
    }
    #price .plan.featured{
      order:-1;
      flex-basis:min(86vw, 328px);
    }
    #price .plan-heading{
      min-height:3.2em;
      gap:6px;
    }
    #price .plan-discount{
      padding:8px 13px;
      gap:7px;
    }
    #price .plan-discount b{
      font-size:14px;
    }
    #price .plan-discount small{
      font-size:8px;
      letter-spacing:.03em;
    }
    #price .plan-name{
      font-size:11px;
      letter-spacing:.12em;
    }
    #price .plan-price{
      gap:5px;
      margin-top:-2px;
      flex-wrap:wrap;
    }
    #price .plan-price .amount{
      font-size:34px;
      letter-spacing:-.025em;
    }
    #price .plan-price .per{
      font-size:12px;
    }
    #price .plan-desc{
      min-height:58px;
      padding-bottom:12px;
      font-size:13px;
      line-height:1.38;
    }
    #price .plan-features{
      gap:8px;
    }
    #price .plan-features li{
      gap:9px;
      font-size:12.5px;
      line-height:1.32;
    }
    #price .plan-features li::before{
      width:11px;
      height:11px;
      margin-top:3px;
      box-shadow:0 0 14px rgba(168,178,255,.55);
    }
    #price .plan-cta{
      min-height:42px;
      margin-top:4px;
      border-radius:14px;
      font-size:13px;
    }
  }

  @media (max-height:640px){
    main{padding-top:22px}
    .search{margin-top:26px}
  }

  /* reduce-motion */
  @media (prefers-reduced-motion: reduce){
    .orb,.shimmer{animation:none}
    .word{opacity:1;transform:none;filter:none;animation:none}
    h1 .em::after{transform:scaleX(1);animation:none}
    .search{opacity:1;transform:none;animation:none}
    .cta-prompt{opacity:1;transform:none;animation:none}
    .cta-dot{animation:none}
  }

  /* ═════════ 2026 scroll FX (IntersectionObserver-driven) ═════════ */

  /* top progress rail — JS-driven scaleX via --p */
  .scroll-progress{
    position:fixed;top:0;left:0;right:0;height:2px;z-index:60;
    background:linear-gradient(90deg, var(--halo-2,#5b6dff), #8c5aff, #3cb4ff);
    transform-origin:0 50%;
    transform:scaleX(var(--p,0));
    pointer-events:none;
    transition:transform .08s linear;
  }

  .section-lede, .how-step, .plan, .fc-kpi, .fc-kpi .big,
  .fc-bar .fill, .fc-head, .fc-title, .fc-sub, .fc-ba, .fc-quote, .eyebrow{
    will-change:transform;
  }

  .section-lede{opacity:1;filter:none;transform:none}
  .section-lede.is-in{opacity:1;filter:blur(0);transform:none}

  /* section titles — italic em words get a soft underline draw */
  .section-title .hl, .section-title .em{position:relative;display:inline-block}
  .section-title .hl::after, .section-title .em::after{
    content:"";position:absolute;left:0;right:0;bottom:-.06em;height:2px;
    background:linear-gradient(90deg, rgba(168,178,255,.95), rgba(91,109,255,.55));
    transform:scaleX(0);transform-origin:left center;border-radius:2px;
    transition:transform .9s cubic-bezier(.2,.7,.2,1);
  }
  .section-title.is-in .hl::after, .section-title.is-in .em::after{transform:scaleX(1)}

  /* how-it-works — staggered reveal */
  .how-step{opacity:1;transform:none;filter:none}
  .how-step.is-in{opacity:1;transform:none;filter:blur(0)}
  .how-step:nth-child(2).is-in{transition-delay:.08s}
  .how-step:nth-child(3).is-in{transition-delay:.16s}
  .how-step:nth-child(4).is-in{transition-delay:.24s}

  /* pricing plans — stagger reveal */
  .plan{opacity:1;transform:none;filter:none}
  .plan.is-in{opacity:1;transform:none;filter:blur(0)}
  .plan:nth-child(2).is-in{transition-delay:.1s}
  .plan:nth-child(3).is-in{transition-delay:.2s}

  /* case KPIs — staggered slide + pop on .big */
  .fc-kpi{opacity:1;transform:none;filter:none}
  .fc-kpi.is-in{opacity:1;transform:none;filter:blur(0)}
  .fc-kpi:nth-child(2).is-in{transition-delay:.1s}
  .fc-kpi:nth-child(3).is-in{transition-delay:.2s}
  .fc-kpi .big{transform:none;transform-origin:left center;display:inline-block}
  .fc-kpi.is-in .big{transform:scale(1)}

  /* before/after bars — fill width once in view */
  .fc-bar .fill{transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
  .fc-bar.is-in .fill{width:var(--w) !important}

  /* case head / title / sub / quote — gentle slide */
  .fc-head, .fc-title, .fc-sub, .fc-ba, .fc-quote{opacity:1;transform:none}
  .fc-head.is-in, .fc-title.is-in, .fc-sub.is-in, .fc-ba.is-in, .fc-quote.is-in{opacity:1;transform:none}

  /* eyebrow — slide in */
  .eyebrow{opacity:1;transform:none}
  .eyebrow.is-in{opacity:1;transform:none}

  /* respect motion preferences */
  @media (prefers-reduced-motion: reduce){
    .how-flight{display:none}
    .scroll-progress{display:none}
    .section-lede, .how-step, .plan, .fc-kpi, .fc-kpi .big,
    .fc-head, .fc-title, .fc-sub, .fc-ba, .fc-quote, .eyebrow{
      opacity:1 !important;transform:none !important;filter:none !important;
      transition:none !important;
    }
    .section-title .hl::after, .section-title .em::after{transform:scaleX(1) !important;transition:none !important}
    .fc-bar .fill{width:var(--w) !important;transition:none !important}
  }

  /* ─────────── final CTA block ─────────── */
  .cta-section{
    position:relative;z-index:5;
    background:#06060b;
    padding:var(--section-pad) var(--page-pad) clamp(72px, 8vw, 100px);
    color:#fff;
    border-top:1px solid rgba(255,255,255,.06);
    overflow:hidden;
  }
  .cta-section::before{
    content:"";position:absolute;inset:-10% -5% -20%;z-index:0;
    background:
      radial-gradient(50% 60% at 18% 40%, rgba(91,109,255,.30) 0%, transparent 65%),
      radial-gradient(40% 60% at 88% 70%, rgba(140,90,255,.22) 0%, transparent 65%),
      radial-gradient(60% 50% at 50% 100%, rgba(60,140,230,.18) 0%, transparent 70%);
    filter:blur(40px);
    pointer-events:none;
  }
  .cta-inner{
    max-width:var(--container);margin:0 auto;
    position:relative;z-index:1;
    display:grid;grid-template-columns:1.4fr auto;gap:48px;align-items:center;
  }
  .cta-copy{max-width:680px}
  .cta-title{
    font-size:var(--step-4);
    font-weight:400;letter-spacing:-.025em;line-height:1.05;
    margin-bottom:22px;text-wrap:balance;
  }
  .cta-title .em{
    font-family:"Lora",serif;font-style:italic;font-weight:500;color:#a8b2ff;
  }
  .cta-title .hl{color:#a8b2ff;position:relative;display:inline-block}
  .cta-title .hl::after{
    content:"";position:absolute;left:0;right:0;bottom:-.06em;height:2px;
    background:linear-gradient(90deg, rgba(168,178,255,.95), rgba(91,109,255,.55));
    transform:scaleX(0);transform-origin:left center;border-radius:2px;
    transition:transform .9s cubic-bezier(.2,.7,.2,1);
  }
  .cta-title.is-in .hl::after{transform:scaleX(1)}
  @media (prefers-reduced-motion: reduce){
    .cta-title .hl::after{transform:scaleX(1) !important;transition:none !important}
  }
  .cta-lede{
    font-size:var(--step-1);line-height:1.55;letter-spacing:-.003em;
    color:rgba(255,255,255,.62);max-width:560px;
  }
  .cta-lede b{color:#fff;font-weight:500}
  .cta-big-btn{
    appearance:none;border:0;cursor:pointer;font:inherit;
    font-size:var(--step-0);font-weight:500;letter-spacing:-.005em;color:#fff;
    background:linear-gradient(140deg, #5b46d8 0%, #4759e6 50%, #3b6fea 100%);
    min-height:var(--control-h-lg);padding:0 26px;border-radius:var(--radius-md);
    display:inline-flex;align-items:center;gap:12px;
    box-shadow:
      0 14px 32px -10px rgba(91,109,255,.7),
      0 22px 48px -16px rgba(140,90,255,.55),
      inset 0 1px 0 rgba(255,255,255,.22);
    transition:transform .25s ease, filter .25s ease, box-shadow .25s ease;
    text-decoration:none;
  }
  .cta-big-btn:hover{transform:translateY(-2px);filter:brightness(1.06)}
  .cta-big-btn svg{display:block;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .cta-big-btn:hover svg{transform:translateX(4px)}

  @media (max-width:760px){
    .cta-section{padding:72px var(--page-pad) 64px}
    .cta-inner{grid-template-columns:1fr;gap:28px}
    .cta-big-btn{align-self:flex-start}
  }

  /* ─────────── footer ─────────── */
  .footer{
    position:relative;z-index:5;
    background:#06060b;
    color:rgba(255,255,255,.6);
    border-top:1px solid rgba(255,255,255,.08);
    padding:72px var(--page-pad) 32px;
  }
  .footer-inner{max-width:var(--container);margin:0 auto}
  .footer-cols{
    display:grid;
    grid-template-columns:1.4fr repeat(3,1fr);
    gap:48px;
    padding-bottom:56px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .footer-brand{
    display:flex;flex-direction:column;gap:16px;max-width:320px;
  }
  .footer-brand .brand{font-size:var(--step-1);color:#fff}
  .footer-brand .brand-mark{width:28px;height:28px}
  .footer-tag{
    font-size:var(--step--1);line-height:1.55;color:rgba(255,255,255,.5);
    letter-spacing:-.003em;
  }
  .footer-col h4{
    font-size:var(--step--2);letter-spacing:.16em;text-transform:uppercase;
    color:rgba(255,255,255,.5);
    font-weight:500;
    margin-bottom:18px;
  }
  .footer-col ul{list-style:none;display:flex;flex-direction:column;gap:12px}
  .footer-col a{
    color:rgba(255,255,255,.72);text-decoration:none;font-size:var(--step-0);letter-spacing:-.003em;
    transition:color .2s ease;
    display:inline-flex;align-items:center;gap:6px;
  }
  .footer-col a:hover{color:#fff}
  .footer-col a .ext{
    font-size:10px;opacity:.6;transition:transform .25s ease, opacity .25s ease;
  }
  .footer-col a:hover .ext{transform:translate(2px,-2px);opacity:1}
  .footer-bottom{
    padding-top:28px;
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    flex-wrap:wrap;
    font-size:var(--step--1);color:rgba(255,255,255,.45);letter-spacing:-.002em;
  }
  .footer-bottom .brand{font-size:var(--step-0);color:rgba(255,255,255,.7)}
  .footer-bottom .brand-mark{width:20px;height:20px}
  .footer-bottom .lang{font-size:12px;color:rgba(255,255,255,.45);cursor:pointer}
  .footer-bottom .lang:hover{color:#fff}

  @media (max-width:980px){
    .footer-cols{grid-template-columns:1fr 1fr;gap:36px 28px}
    .footer-brand{grid-column:1 / -1}
  }
  @media (max-width:560px){
    .footer{padding:56px 22px 28px}
    .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px;padding-bottom:36px}
    .footer-brand{grid-column:1 / -1}
    .footer-col h4{margin-bottom:14px}
    .footer-col ul{gap:10px}
    .footer-col a{font-size:13px;line-height:1.3}
    .footer-bottom{flex-direction:column;align-items:flex-start;gap:14px}
  }
