/*
Theme Name: Finlit-money
*/

  :root{
    --paper:#FCFBF8;
    --paper-2:#F5F2E9;
    --forest:#233E32;
    --green:#1B5F39;
    --green-deep:#123B26;
    --mint:#C3EED6;
    --mint-soft:#E9F6EE;
    --ink:#1B211D;
    --muted:#6C7A71;
    --rule:rgba(35,62,50,.15);
    --rule-soft:rgba(35,62,50,.08);

    --display:"Fraunces",Georgia,"Times New Roman",serif;
    --body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
    --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;

    --gut:clamp(20px,5vw,64px);
    --maxw:1280px;
    --ease:cubic-bezier(.22,.61,.36,1);
  }

  *,*::before,*::after{box-sizing:border-box}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  body{
    margin:0;background:var(--paper);color:var(--ink);
    font-family:var(--body);font-size:17px;line-height:1.62;
    font-optical-sizing:auto;-webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img,svg{display:block;max-width:100%}
  button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
  input,select{font:inherit}
  a{color:inherit;text-decoration:none}
  ::selection{background:var(--mint);color:var(--forest)}

  /* ============================================================
     TYPE
     ============================================================ */
  h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:-.018em;line-height:1.08;margin:0;color:var(--forest);font-variation-settings:"SOFT" 12,"WONK" 0}
  .h-xl{font-size:clamp(2.9rem,6.4vw,5.1rem);line-height:1.02;letter-spacing:-.028em}
  .h-lg{font-size:clamp(2.1rem,4vw,3.4rem);line-height:1.06}
  .h-md{font-size:clamp(1.5rem,2.3vw,2.05rem);line-height:1.14}
  .h-sm{font-size:clamp(1.16rem,1.5vw,1.34rem);line-height:1.24}
  p{margin:0 0 1em}
  p:last-child{margin-bottom:0}
  .lede{font-size:clamp(1.08rem,1.5vw,1.28rem);line-height:1.55;color:#3B4A41;max-width:62ch}
  .small{font-size:.92rem;color:var(--muted);line-height:1.55}

  .eyebrow{
    font-family:var(--mono);font-size:.7rem;letter-spacing:.19em;text-transform:uppercase;
    color:var(--green);display:flex;align-items:center;gap:.7em;margin:0 0 1.15rem;font-weight:500;
  }
  .eyebrow::before{
    content:"";width:16px;height:16px;border:2px solid currentColor;border-radius:50%;
    flex:0 0 auto;opacity:.9;
  }
  .eyebrow.on-dark{color:var(--mint)}

  /* ============================================================
     LAYOUT
     ============================================================ */
  .wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
  section{position:relative}
  section[id]{scroll-margin-top:86px}
  .band{padding-block:clamp(72px,9vw,132px)}
  .band--tight{padding-block:clamp(56px,6vw,88px)}
  .band--paper2{background:var(--paper-2)}
  .band--mint{background:var(--mint-soft)}
  .band--dark{background:var(--forest);color:#E8EFE9}
  .band--dark h2,.band--dark h3{color:#F4F8F4}

  /* seam between blocks */
  .seam{height:1px;background:var(--rule-soft);position:relative}
  .seam::after{
    content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-5px 0 0 -5px;
    border:1.5px solid var(--rule);border-radius:50%;background:var(--paper);
  }

  /* ============================================================
     BUTTONS
     ============================================================ */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.6em;
    padding:.92em 1.6em;border-radius:100px;font-size:.94rem;font-weight:500;letter-spacing:.005em;
    transition:transform .35s var(--ease),background .3s,color .3s,box-shadow .35s,border-color .3s;
    position:relative;overflow:hidden;white-space:nowrap;
  }
  .btn:focus-visible{outline:2px solid var(--green);outline-offset:3px}
  .btn--solid{background:var(--green);color:#F6FBF7;box-shadow:0 1px 0 rgba(0,0,0,.05)}
  .btn--solid:hover{background:var(--green-deep);transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(19,59,38,.75)}
  .btn--ghost{border:1.5px solid var(--rule);color:var(--forest)}
  .btn--ghost:hover{border-color:var(--green);background:rgba(27,95,57,.05);transform:translateY(-2px)}
  .btn--mint{background:var(--mint);color:var(--green-deep)}
  .btn--mint:hover{background:#B0E8C7;transform:translateY(-2px)}
  .btn--onDark{border:1.5px solid rgba(232,239,233,.3);color:#EDF4EE}
  .btn--onDark:hover{background:rgba(232,239,233,.1);border-color:rgba(232,239,233,.6);transform:translateY(-2px)}
  .btn .arw{transition:transform .35s var(--ease)}
  .btn:hover .arw{transform:translateX(4px)}

  /* ============================================================
     HEADER
     ============================================================ */
  .hdr{
    position:fixed;inset:0 0 auto;z-index:80;
    background:rgba(252,251,248,0);transition:background .4s,box-shadow .4s,border-color .4s;
    border-bottom:1px solid transparent;
  }
  .hdr.is-stuck{background:rgba(252,251,248,.88);backdrop-filter:blur(14px) saturate(1.4);border-bottom-color:var(--rule-soft)}
  .hdr__in{display:flex;align-items:center;gap:2rem;height:76px;transition:height .4s var(--ease)}
  .hdr.is-stuck .hdr__in{height:64px}
  .brand{display:flex;align-items:center;gap:.62rem;font-family:var(--display);font-size:1.32rem;color:var(--forest);letter-spacing:-.02em;flex:0 0 auto}
  .brand svg{overflow:visible}
  .brand__rings circle{transition:transform .5s var(--ease)}
  .brand:hover .brand__rings circle:first-child{transform:translateX(-1.5px)}
  .brand:hover .brand__rings circle:last-child{transform:translateX(1.5px)}
  .nav{display:flex;gap:1.75rem;margin-left:auto;align-items:center}
  .nav a{
    font-size:.9rem;color:#415046;position:relative;padding-block:.35rem;
    transition:color .3s;
  }
  .nav a::after{
    content:"";position:absolute;left:0;bottom:0;height:1.5px;width:100%;background:var(--green);
    transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);
  }
  .nav a:hover{color:var(--green)}
  .nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
  .nav a.is-active{color:var(--green)}
  .hdr .btn{padding:.7em 1.25em;font-size:.87rem}
  .hdr__prog{position:absolute;left:0;bottom:-1px;height:2px;background:var(--green);width:0;transition:width .12s linear}
  .burger{display:none;margin-left:auto;width:42px;height:42px;align-items:center;justify-content:center;border-radius:50%;border:1.5px solid var(--rule)}
  .burger span{display:block;width:17px;height:1.5px;background:var(--forest);position:relative;transition:transform .35s var(--ease),background .2s}
  .burger span::before,.burger span::after{content:"";position:absolute;left:0;width:17px;height:1.5px;background:var(--forest);transition:transform .35s var(--ease)}
  .burger span::before{top:-5.5px}.burger span::after{top:5.5px}
  .burger.is-open span{background:transparent}
  .burger.is-open span::before{transform:translateY(5.5px) rotate(45deg)}
  .burger.is-open span::after{transform:translateY(-5.5px) rotate(-45deg)}
  .mnav{
    position:fixed;inset:76px 0 auto;z-index:79;background:var(--paper);
    border-bottom:1px solid var(--rule);padding:1rem var(--gut) 2rem;
    display:none;flex-direction:column;gap:.2rem;
  }
  .mnav.is-open{display:flex;animation:drop .4s var(--ease)}
  .mnav a{font-family:var(--display);font-size:1.5rem;color:var(--forest);padding:.5rem 0;border-bottom:1px solid var(--rule-soft)}
  @keyframes drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}

  /* ============================================================
     HERO
     ============================================================ */
  .hero{position:relative;overflow:hidden;padding:calc(76px + clamp(58px,9vh,112px)) 0 clamp(52px,7vh,88px)}
  .hero .wrap{position:relative;z-index:1}
  .hero__mark{position:absolute;right:calc(var(--gut) * -1.4);top:50%;transform:translateY(-50%);pointer-events:none;z-index:0}
  .hero__mark circle{fill:none;stroke:var(--green);stroke-width:1.1;opacity:.11;stroke-dasharray:1720;stroke-dashoffset:1720;animation:mark 2.4s cubic-bezier(.22,.61,.36,1) .3s forwards}
  .hero__mark circle:nth-child(2){animation-delay:.5s}
  .hero__mark circle:nth-child(3){animation-delay:.7s;opacity:.07}
  @keyframes mark{to{stroke-dashoffset:0}}
  .hero h1{max-width:17ch}
  .hero h1 em{font-style:italic;font-variation-settings:"SOFT" 40,"WONK" 1;color:var(--green)}
  .hero__lede{margin-top:1.4rem;max-width:56ch}
  .hero__cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.3rem}
  .hero__proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(3rem,6vw,4.8rem);border-top:1px solid var(--rule)}
  .hero__proof>div{padding:1.5rem 1.6rem 0 0;border-right:1px solid var(--rule-soft)}
  .hero__proof>div:last-child{border-right:0;padding-right:0}
  .pf__n{font-family:var(--display);font-size:clamp(1.85rem,2.9vw,2.45rem);color:var(--forest);line-height:1;letter-spacing:-.025em}
  .pf__l{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:.7rem;max-width:22ch;line-height:1.7}

  /* ticker */
  .ticker{border-block:1px solid var(--rule-soft);background:var(--paper);overflow:hidden;padding-block:.85rem}
  .ticker__row{display:flex;gap:2.5rem;width:max-content;animation:slide 46s linear infinite}
  .ticker span{font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:2.5rem;white-space:nowrap}
  .ticker span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--mint);flex:0 0 auto}
  @keyframes slide{to{transform:translateX(-50%)}}
  .ticker:hover .ticker__row{animation-play-state:paused}

  /* ============================================================
     REVEAL
     ============================================================ */
  .rv{opacity:0;transform:translateY(24px);transition:opacity .85s var(--ease),transform .85s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
  .rv.in{opacity:1;transform:none}
  .rv-l{opacity:0;transform:translateX(-22px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
  .rv-l.in{opacity:1;transform:none}

  /* ============================================================
     PROBLEM / STATS
     ============================================================ */
  .sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:end;margin-bottom:clamp(2.5rem,4vw,4rem)}
  .sec-head p{margin:0}
  .stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule)}
  .stat{padding:2rem 1.5rem 1.8rem 0;border-right:1px solid var(--rule-soft);position:relative}
  .stat:last-child{border-right:0}
  .stat::before{content:"";position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--green);transition:width 1.1s var(--ease);transition-delay:calc(var(--i,0) * 120ms)}
  .stat.in::before{width:calc(100% - 1.5rem)}
  .stat__n{font-family:var(--display);font-size:clamp(2.4rem,4.4vw,3.5rem);color:var(--green);line-height:1;letter-spacing:-.03em;font-variation-settings:"SOFT" 20}
  .stat__t{margin-top:.9rem;font-size:.97rem;line-height:1.5;color:#3B4A41;max-width:26ch}
  .stat__s{margin-top:.8rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

  /* ============================================================
     MODULES
     ============================================================ */
  .mods{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(14px,1.6vw,22px)}
  .mod{
    grid-column:span 6;background:var(--paper);border:1px solid var(--rule-soft);border-radius:3px;
    padding:clamp(1.6rem,2.4vw,2.4rem);position:relative;overflow:hidden;
    transition:border-color .4s,transform .5s var(--ease),box-shadow .5s var(--ease);
  }
  .mod:hover{border-color:rgba(27,95,57,.35);transform:translateY(-4px);box-shadow:0 24px 44px -34px rgba(19,59,38,.5)}
  .mod--wide{grid-column:span 12}
  .mod--dark{background:var(--forest);border-color:var(--forest)}
  .mod--dark h3{color:#F4F8F4}
  .mod--dark .mod__d{color:rgba(232,239,233,.76)}
  .mod--dark .mod__k{color:var(--mint);border-color:rgba(195,238,214,.28)}
  .mod__ix{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;color:var(--green);margin-bottom:1.1rem;display:block}
  .mod--dark .mod__ix{color:var(--mint)}
  .mod h3{margin-bottom:.7rem}
  .mod__d{color:#405046;font-size:.99rem;line-height:1.6;max-width:52ch}
  .mod__k{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.5rem}
  .mod__k span{font-family:var(--mono);font-size:.68rem;letter-spacing:.07em;padding:.42em .8em;border:1px solid var(--rule);border-radius:100px;color:#3E4E44}
  .mod--dark .mod__k span{border-color:rgba(195,238,214,.26);color:var(--mint)}
  .mod__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--rule-soft);margin-top:1.8rem;border:1px solid var(--rule-soft)}
  .trk{background:var(--paper);padding:1.15rem 1.2rem;transition:background .35s}
  .trk:hover{background:var(--mint-soft)}
  .trk b{display:block;font-family:var(--display);font-size:1.02rem;color:var(--forest);font-weight:500;margin-bottom:.3rem}
  .trk i{font-style:normal;font-family:var(--mono);font-size:.65rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}

  /* ============================================================
     RING CHAIN
     ============================================================ */
  .chain{margin-top:clamp(2rem,4vw,3.4rem);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .chain::-webkit-scrollbar{display:none}
  .chain svg{width:100%;height:auto;display:block}
  @media (max-width:600px){.chain svg{min-width:470px}}
  .ringc{fill:none;stroke:var(--green);stroke-width:7;stroke-linecap:round;
    stroke-dasharray:440;stroke-dashoffset:440;transition:stroke-dashoffset 1.1s var(--ease)}
  .chain.in .ringc{stroke-dashoffset:0}
  .chain.in .ringc:nth-of-type(2){transition-delay:.16s}
  .chain.in .ringc:nth-of-type(3){transition-delay:.32s}
  .chain.in .ringc:nth-of-type(4){transition-delay:.48s}
  .chain.in .ringc:nth-of-type(5){transition-delay:.64s}
  .chain .ico{fill:none;stroke:#2B3630;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .6s ease .5s}
  .chain.in .ico{opacity:1}
  .chain .lbl{font-family:var(--display);font-size:16px;fill:var(--forest);text-anchor:middle}
  .chain .num{font-family:var(--mono);font-size:10px;letter-spacing:.14em;fill:var(--muted);text-anchor:middle}
  .chain-note{margin-top:1.6rem;font-style:italic;font-family:var(--display);color:var(--muted);font-size:1.02rem}

  /* ============================================================
     PRODUCT MOCKUP
     ============================================================ */
  .appshot{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:clamp(2rem,4vw,4rem);align-items:center}
  .tabs{display:flex;flex-direction:column;gap:.2rem;margin-top:2rem}
  .tab{
    text-align:left;padding:1rem 1.1rem;border-left:2px solid var(--rule);color:#506056;
    transition:border-color .35s,color .35s,background .35s,padding-left .35s var(--ease);
  }
  .tab b{display:block;font-family:var(--display);font-size:1.08rem;color:var(--forest);margin-bottom:.15rem;font-weight:500}
  .tab span{font-size:.88rem;line-height:1.45;display:block}
  .tab:hover{background:rgba(27,95,57,.04);padding-left:1.4rem}
  .tab.is-on{border-left-color:var(--green);background:rgba(27,95,57,.055);padding-left:1.4rem}
  .tab.is-on b{color:var(--green)}

  .win{
    border:1px solid var(--rule);border-radius:9px;overflow:hidden;background:#fff;
    box-shadow:0 40px 80px -50px rgba(19,59,38,.55),0 2px 8px -4px rgba(19,59,38,.16);
  }
  .win__bar{display:flex;align-items:center;gap:.5rem;padding:.7rem .9rem;background:var(--paper-2);border-bottom:1px solid var(--rule-soft)}
  .win__dots{display:flex;gap:5px}
  .win__dots i{width:9px;height:9px;border-radius:50%;background:var(--rule);display:block}
  .win__url{margin-left:.6rem;font-family:var(--mono);font-size:.68rem;color:var(--muted);background:var(--paper);border:1px solid var(--rule-soft);border-radius:100px;padding:.24rem .8rem}
  .win__body{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:392px}
  .side{background:#F7F6F1;border-right:1px solid var(--rule-soft);padding:1rem .8rem}
  .side__b{display:flex;align-items:center;gap:.4rem;font-family:var(--display);font-size:.95rem;color:var(--forest);margin-bottom:1.2rem;padding-left:.3rem}
  .side a{display:flex;align-items:center;gap:.55rem;padding:.5rem .55rem;border-radius:5px;font-size:.79rem;color:#5A6960;margin-bottom:.12rem}
  .side a.on{background:var(--mint);color:var(--green-deep);font-weight:500}
  .side a i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;flex:0 0 auto}
  .pane{padding:1.35rem 1.5rem;display:none;animation:fade .45s var(--ease)}
  .pane.on{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .pane__h{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.1rem}
  .pane__h h4{font-size:1.18rem;color:var(--forest)}
  .pane__h .small{font-size:.74rem;margin-top:.15rem}
  .chip{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;padding:.34em .7em;border-radius:100px;background:var(--mint);color:var(--green-deep);white-space:nowrap}
  .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .card{border:1px solid var(--rule-soft);border-radius:6px;padding:.9rem 1rem;background:var(--paper)}
  .card--span{grid-column:1/-1}
  .card__l{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.45rem}
  .card__t{font-family:var(--display);font-size:1rem;color:var(--forest);line-height:1.28;margin-bottom:.4rem}
  .card__x{font-size:.78rem;color:#5B6A61;line-height:1.45}
  .bar{height:5px;border-radius:100px;background:var(--rule-soft);overflow:hidden;margin-top:.7rem}
  .bar i{display:block;height:100%;background:var(--green);border-radius:100px;width:0;transition:width 1.4s var(--ease) .3s}
  .win.in .bar i{width:var(--w,60%)}
  .alert{background:var(--mint-soft);border:1px solid rgba(27,95,57,.18);border-radius:6px;padding:.85rem 1rem;display:flex;gap:.7rem;align-items:flex-start}
  .alert em{font-style:normal;width:7px;height:7px;border-radius:50%;background:var(--green);margin-top:.42rem;flex:0 0 auto;animation:pulse 2.4s ease-in-out infinite}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(27,95,57,.4)}50%{box-shadow:0 0 0 6px rgba(27,95,57,0)}}
  .ringp{display:flex;align-items:center;gap:.9rem}
  .ringp svg{flex:0 0 auto}
  .ringp circle.v{stroke-dasharray:151;stroke-dashoffset:151;transition:stroke-dashoffset 1.5s var(--ease) .4s}
  .win.in .ringp circle.v{stroke-dashoffset:var(--off,50)}
  .player{background:#101C16;border-radius:6px;aspect-ratio:16/8;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
  .player .pl{width:52px;height:52px;border:1.5px solid rgba(232,239,233,.55);border-radius:50%;display:grid;place-items:center;transition:transform .4s var(--ease),background .3s}
  .player:hover .pl{transform:scale(1.08);background:rgba(232,239,233,.12)}
  .player .pl svg{margin-left:3px}
  .player__t{position:absolute;left:0;right:0;bottom:0;padding:.7rem .9rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(232,239,233,.72);display:flex;justify-content:space-between}
  .quiz{margin-top:.75rem;border:1px solid var(--rule-soft);border-radius:6px;padding:.85rem 1rem}
  .quiz__o{display:flex;align-items:center;gap:.55rem;font-size:.79rem;color:#5B6A61;padding:.34rem 0}
  .quiz__o i{width:13px;height:13px;border-radius:50%;border:1.5px solid var(--rule);flex:0 0 auto}
  .quiz__o.ok i{border-color:var(--green);background:var(--green);box-shadow:inset 0 0 0 2.5px #fff}
  .quiz__o.ok{color:var(--forest)}
  .tool{border:1px solid var(--rule-soft);border-radius:6px;padding:.85rem .95rem;background:var(--paper);transition:border-color .3s,transform .3s var(--ease)}
  .tool:hover{border-color:rgba(27,95,57,.35);transform:translateY(-2px)}
  .tool b{display:block;font-family:var(--display);font-size:.94rem;color:var(--forest);font-weight:500;margin-bottom:.25rem}
  .tool span{font-size:.74rem;color:#5B6A61;line-height:1.4;display:block}
  .tools3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}

  /* ============================================================
     PATH BUILDER
     ============================================================ */
  .builder{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2rem,4vw,3.6rem);align-items:start}
  .qgroup{margin-bottom:1.5rem}
  .qgroup__l{font-family:var(--mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
  .opts{display:flex;flex-wrap:wrap;gap:.45rem}
  .opt{
    padding:.55em 1.05em;border:1.5px solid var(--rule);border-radius:100px;font-size:.87rem;color:#44544A;
    transition:border-color .3s,background .3s,color .3s,transform .3s var(--ease);
  }
  .opt:hover{border-color:var(--green);transform:translateY(-1px)}
  .opt.on{background:var(--green);border-color:var(--green);color:#F4FBF6}
  .opt:focus-visible{outline:2px solid var(--green);outline-offset:2px}

  .pathbox{border:1px solid var(--rule);border-radius:4px;background:var(--paper);padding:clamp(1.4rem,2.4vw,2rem)}
  .pathbox__h{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;border-bottom:1px solid var(--rule-soft);padding-bottom:1rem;margin-bottom:1.3rem}
  .pathbox__h b{font-family:var(--display);font-size:1.22rem;color:var(--forest);font-weight:500}
  .steps{display:flex;flex-direction:column}
  .step{display:grid;grid-template-columns:34px minmax(0,1fr);gap:1rem;padding-bottom:1.15rem;position:relative}
  .step:last-child{padding-bottom:0}
  .step__d{position:relative;display:flex;justify-content:center}
  .step__d::before{content:"";position:absolute;top:16px;bottom:-14px;width:1px;background:var(--rule);left:50%}
  .step:last-child .step__d::before{display:none}
  .step__d i{width:15px;height:15px;border:2px solid var(--green);border-radius:50%;background:var(--paper);margin-top:3px;z-index:1;position:relative}
  .step:first-child .step__d i{background:var(--green)}
  .step b{font-family:var(--display);font-size:1.04rem;color:var(--forest);font-weight:500;display:block}
  .step span{font-size:.87rem;color:#5B6A61;line-height:1.5;display:block;margin-top:.15rem}
  .step__m{font-family:var(--mono);font-size:.62rem;letter-spacing:.11em;text-transform:uppercase;color:var(--green);margin-top:.35rem;display:block}
  .step.fresh{animation:stepin .55s var(--ease) both}
  .step.fresh:nth-child(2){animation-delay:.07s}
  .step.fresh:nth-child(3){animation-delay:.14s}
  .step.fresh:nth-child(4){animation-delay:.21s}
  .step.fresh:nth-child(5){animation-delay:.28s}
  @keyframes stepin{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
  .why{margin-top:1.3rem;padding-top:1.1rem;border-top:1px solid var(--rule-soft);font-size:.89rem;color:#5B6A61;line-height:1.55}
  .why b{color:var(--forest);font-weight:500}

  /* ============================================================
     SIMULATOR
     ============================================================ */
  .sim{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(2rem,4vw,3.6rem);align-items:start}
  .ctrl{margin-bottom:1.9rem}
  .ctrl__t{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.7rem}
  .ctrl__t span{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
  .ctrl__t b{font-family:var(--display);font-size:1.35rem;color:var(--forest);font-weight:500;letter-spacing:-.02em}
  input[type=range]{
    -webkit-appearance:none;appearance:none;width:100%;height:2px;background:var(--rule);border-radius:2px;outline:none;
  }
  input[type=range]::-webkit-slider-thumb{
    -webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--paper);
    border:2px solid var(--green);cursor:grab;transition:transform .22s var(--ease),box-shadow .22s;
  }
  input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.16);box-shadow:0 0 0 7px rgba(27,95,57,.1)}
  input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--paper);border:2px solid var(--green);cursor:grab}
  input[type=range]:focus-visible{outline:2px solid var(--green);outline-offset:6px}
  .simout{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--rule-soft);border:1px solid var(--rule-soft);margin-top:1.4rem}
  .so{background:var(--paper);padding:1rem}
  .so__l{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:.4rem}
  .so__l::before{content:"";width:14px;height:2px;background:currentColor;border-radius:2px}
  .so--s .so__l::before{background:#9DB6A7}
  .so--b .so__l::before{background:var(--green)}
  .so--o .so__l::before{background:#5FBF8B}
  .so__v{font-family:var(--display);font-size:clamp(1.25rem,2vw,1.6rem);color:var(--forest);margin-top:.5rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
  .so__x{font-size:.75rem;color:var(--muted);margin-top:.25rem}
  .chartwrap{border:1px solid var(--rule);border-radius:4px;background:var(--paper);padding:clamp(1.1rem,2vw,1.6rem)}
  .chartwrap svg{width:100%;height:auto;overflow:visible}
  .gridline{stroke:var(--rule-soft);stroke-width:1}
  .axl{font-family:var(--mono);font-size:9px;letter-spacing:.1em;fill:#93A29A}
  .curve{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .disc{margin-top:1rem;font-size:.78rem;color:var(--muted);font-style:italic}

  /* ============================================================
     COMPARISON
     ============================================================ */
  .cmp{width:100%;border-collapse:collapse;font-size:.92rem}
  .cmp th,.cmp td{text-align:left;padding:1.05rem 1.1rem;border-bottom:1px solid var(--rule-soft);vertical-align:top}
  .cmp thead th{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500;border-bottom:1px solid var(--rule)}
  .cmp tbody th{font-family:var(--display);font-size:1.03rem;color:var(--forest);font-weight:500;width:26%}
  .cmp td{color:#5B6A61;line-height:1.5}
  .cmp tr.us th,.cmp tr.us td{background:var(--mint-soft);color:var(--forest);border-bottom-color:rgba(27,95,57,.16)}
  .cmp tr.us th{color:var(--green)}
  .cmp tbody tr{transition:background .3s}
  .cmp tbody tr:not(.us):hover{background:rgba(35,62,50,.028)}

  /* ============================================================
     PLANS
     ============================================================ */
  .plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--rule);border-radius:4px;overflow:hidden}
  .plan{padding:clamp(1.5rem,2.4vw,2rem) clamp(1.2rem,2vw,1.6rem);border-right:1px solid var(--rule-soft);display:flex;flex-direction:column;transition:background .4s}
  .plan:last-child{border-right:0}
  .plan:hover{background:rgba(27,95,57,.035)}
  .plan--hi{background:var(--forest);color:#DFE9E2}
  .plan--hi:hover{background:#1E362B}
  .plan--hi h3,.plan--hi .plan__p{color:#F4F8F4}
  .plan--hi .plan__f li{color:rgba(223,233,226,.82)}
  .plan--hi .plan__f li::before{border-color:var(--mint)}
  .plan__n{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:1rem}
  .plan--hi .plan__n{color:var(--mint)}
  .plan__p{font-family:var(--display);font-size:2.5rem;color:var(--forest);line-height:1;letter-spacing:-.03em}
  .plan__p sub{font-family:var(--body);font-size:.8rem;color:var(--muted);vertical-align:baseline;letter-spacing:0;margin-left:.25rem}
  .plan--hi .plan__p sub{color:rgba(223,233,226,.66)}
  .plan__f{list-style:none;padding:0;margin:1.5rem 0 1.8rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
  .plan__f li{font-size:.87rem;color:#5B6A61;line-height:1.45;padding-left:1.35rem;position:relative}
  .plan__f li::before{content:"";position:absolute;left:0;top:.44em;width:8px;height:8px;border:1.5px solid var(--green);border-radius:50%}
  .plan .btn{width:100%}

  /* ============================================================
     FORMS
     ============================================================ */
  .form{display:flex;gap:.6rem;flex-wrap:wrap;max-width:520px}
  .form input[type=email],.form input[type=text]{
    flex:1 1 220px;padding:.92em 1.15em;border:1.5px solid var(--rule);border-radius:100px;background:var(--paper);
    color:var(--ink);font-size:.94rem;transition:border-color .3s,box-shadow .3s;min-width:0;
  }
  .form input::placeholder{color:#9AA79F}
  .form input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 4px rgba(27,95,57,.09)}
  .form--dark input[type=email],.form--dark input[type=text]{background:rgba(255,255,255,.05);border-color:rgba(232,239,233,.24);color:#EDF4EE}
  .form--dark input::placeholder{color:rgba(232,239,233,.42)}
  .form--dark input:focus{border-color:var(--mint);box-shadow:0 0 0 4px rgba(195,238,214,.12)}
  .form__msg{width:100%;font-size:.86rem;margin-top:.2rem;min-height:1.2em;color:var(--green);display:flex;align-items:center;gap:.45rem;opacity:0;transform:translateY(-4px);transition:opacity .4s,transform .4s}
  .form__msg.show{opacity:1;transform:none}
  .form__msg.err{color:#B4553C}
  .form--dark .form__msg{color:var(--mint)}
  .form--dark .form__msg.err{color:#F0B49F}

  .b2b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
  .b2b__list{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1px;background:var(--rule-soft);border-block:1px solid var(--rule-soft)}
  .b2b__list li{background:var(--paper-2);padding:1.05rem 0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:baseline}
  .b2b__list b{font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;color:var(--green);white-space:nowrap}
  .b2b__list span{font-size:.94rem;color:#4A5A50;line-height:1.5}
  .panel{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:clamp(1.6rem,3vw,2.4rem)}

  /* ============================================================
     PRINCIPLES (dark)
     ============================================================ */
  .prin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(232,239,233,.14);border:1px solid rgba(232,239,233,.14);margin-top:clamp(2rem,4vw,3rem)}
  .pr{background:var(--forest);padding:clamp(1.5rem,2.4vw,2.1rem);transition:background .45s}
  .pr:hover{background:#1D3529}
  .pr__n{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--mint);margin-bottom:1rem;display:block}
  .pr h3{font-size:1.2rem;margin-bottom:.6rem;color:#F4F8F4}
  .pr p{font-size:.92rem;line-height:1.6;color:rgba(232,239,233,.76);margin:0}

  /* ============================================================
     TEAM
     ============================================================ */
  .team{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2rem)}
  .per{border:1px solid var(--rule-soft);border-radius:4px;padding:clamp(1.5rem,2.4vw,2rem);background:var(--paper);transition:border-color .4s,transform .5s var(--ease),box-shadow .5s var(--ease)}
  .per:hover{border-color:rgba(27,95,57,.3);transform:translateY(-4px);box-shadow:0 26px 46px -36px rgba(19,59,38,.5)}
  .per__ph{position:relative;width:104px;height:104px;margin-bottom:1.5rem}
  .per__ph::before{content:"";position:absolute;left:-13px;top:0;width:104px;height:104px;border:2px solid var(--mint);border-radius:50%;transition:transform .5s var(--ease)}
  .per:hover .per__ph::before{transform:translateX(-4px)}
  .per__ph-in{position:absolute;inset:0;border-radius:50%;overflow:hidden;border:2px solid var(--green);background:var(--mint-soft);display:grid;place-items:center}
  .per__ph-in img{width:100%;height:100%;object-fit:cover;display:block}
  .per__ph-in svg{opacity:.45}
  .per__ph-tag{position:absolute;right:-6px;bottom:-2px;background:var(--paper);border:1px solid var(--rule);border-radius:100px;padding:.2em .6em;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;color:var(--green)}
  .per h3{font-size:1.24rem;margin-bottom:.3rem}
  .per__r{font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--green);margin-bottom:1rem}
  .per p{font-size:.92rem;color:#5B6A61;line-height:1.6}
  .per__t{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.2rem;padding-top:1.1rem;border-top:1px solid var(--rule-soft)}
  .per__t span{font-family:var(--mono);font-size:.63rem;letter-spacing:.07em;color:#5E6E64;padding:.32em .7em;border:1px solid var(--rule);border-radius:100px}

  /* ============================================================
     CTA / FOOTER
     ============================================================ */
  .cta-band{background:var(--mint-soft);position:relative;overflow:hidden}
  .cta-band .wrap{position:relative;z-index:1}
  .cta-rings{position:absolute;right:-6%;top:50%;transform:translateY(-50%);opacity:.4;pointer-events:none}
  .cta-rings circle{fill:none;stroke:var(--green);stroke-width:1.4;opacity:.32}

  .ftr{background:var(--forest);color:rgba(232,239,233,.74);padding-block:clamp(3rem,5vw,4.5rem) 0}
  .ftr__top{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,.8fr)) minmax(0,1.5fr);gap:clamp(1.6rem,3vw,3rem);padding-bottom:clamp(2.2rem,4vw,3.2rem)}
  .ftr__brand{display:flex;align-items:center;gap:.6rem;font-family:var(--display);font-size:1.4rem;color:#F4F8F4;margin-bottom:.9rem}
  .ftr h4{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mint);font-weight:500;margin-bottom:1.1rem}
  .ftr ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}
  .ftr ul a{font-size:.9rem;transition:color .3s,padding-left .3s var(--ease);display:inline-block}
  .ftr ul a:hover{color:var(--mint);padding-left:5px}
  .ftr__mail{font-family:var(--display);font-size:1.16rem;color:#F4F8F4;border-bottom:1px solid rgba(195,238,214,.35);padding-bottom:2px;transition:border-color .3s}
  .ftr__mail:hover{border-color:var(--mint)}
  .ftr__bottom{border-top:1px solid rgba(232,239,233,.14);padding-block:1.4rem 1.8rem;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
  .ftr__bottom p{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(232,239,233,.5);margin:0}
  .ftr__soc{display:flex;gap:1.4rem}
  .ftr__soc a{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;transition:color .3s}
  .ftr__soc a:hover{color:var(--mint)}

  /* ============================================================
     MODAL
     ============================================================ */
  .mask{
    position:fixed;inset:0;z-index:100;background:rgba(18,34,26,.5);backdrop-filter:blur(7px);
    display:grid;place-items:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;
  }
  .mask[hidden]{display:none}
  .mask.open{opacity:1;visibility:visible}
  .modal{
    width:min(520px,100%);background:var(--paper);border-radius:6px;padding:clamp(1.8rem,4vw,2.9rem);
    position:relative;transform:translateY(22px) scale(.965);opacity:0;
    transition:transform .55s var(--ease),opacity .45s;
    box-shadow:0 50px 90px -40px rgba(12,28,20,.6);max-height:92vh;overflow-y:auto;
  }
  .mask.open .modal{transform:none;opacity:1}
  .modal__x{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--muted);transition:background .3s,color .3s}
  .modal__x:hover{background:rgba(35,62,50,.07);color:var(--forest)}
  .modal__r{margin-bottom:1.5rem}
  .modal__r circle{fill:none;stroke:var(--green);stroke-width:2.4;stroke-dasharray:88;stroke-dashoffset:88;animation:none}
  .mask.open .modal__r circle{animation:draw .9s var(--ease) forwards}
  .mask.open .modal__r circle:nth-child(2){animation-delay:.12s}
  .mask.open .modal__r circle:nth-child(3){animation-delay:.24s}
  @keyframes draw{to{stroke-dashoffset:0}}
  .modal h3{font-size:clamp(1.5rem,2.6vw,1.85rem);margin-bottom:.75rem}
  .modal p{font-size:.98rem;color:#4E5D54;line-height:1.6}
  .modal__st{display:flex;gap:.55rem;align-items:center;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:1.2rem}
  .modal__st i{width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 2.2s ease-in-out infinite}
  .modal__box{background:var(--mint-soft);border-radius:5px;padding:1.1rem 1.2rem;margin:1.5rem 0;border:1px solid rgba(27,95,57,.14)}
  .modal__box b{display:block;font-family:var(--display);font-size:1.02rem;color:var(--forest);font-weight:500;margin-bottom:.3rem}
  .modal__box span{font-size:.87rem;color:#4E5D54;line-height:1.5;display:block}
  .modal .form{max-width:none}

  /* ============================================================
     RESPONSIVE
     ============================================================ */
  @media (max-width:1180px){
    .nav{gap:1.15rem}
    .nav a{font-size:.84rem}
    .hdr .btn{padding:.66em 1.05em;font-size:.82rem}
  }
  @media (max-width:1080px){
    .hero__mark{right:-38%;opacity:.7}
    .appshot,.builder,.sim,.b2b{grid-template-columns:1fr}
    .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
    .plan:nth-child(2){border-right:0}
    .plan:nth-child(-n+2){border-bottom:1px solid var(--rule-soft)}
    .prin,.team{grid-template-columns:repeat(2,minmax(0,1fr))}
    .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
    .stat{border-bottom:1px solid var(--rule-soft)}
    .stat:nth-child(2){border-right:0}
    .ftr__top{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  @media (max-width:860px){
    .hero__proof{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hero__proof>div{padding-right:1.3rem;padding-bottom:1.3rem;border-bottom:1px solid var(--rule-soft)}
    .hero__proof>div:nth-child(2n){border-right:0;padding-right:0}
    .nav,.hdr .btn{display:none}
    .burger{display:flex}
    .sec-head{grid-template-columns:1fr}
    .mod{grid-column:span 12}
    .mod__grid,.tools3{grid-template-columns:repeat(2,minmax(0,1fr))}
    .win__body{grid-template-columns:1fr}
    .side{display:flex;gap:.3rem;overflow-x:auto;border-right:0;border-bottom:1px solid var(--rule-soft);padding:.7rem}
    .side__b{display:none}
    .side a{margin:0;white-space:nowrap}
    .cmp thead{display:none}
    .cmp tbody th,.cmp td{display:block;width:auto;padding:.5rem 1rem}
    .cmp tbody th{padding-top:1.1rem}
    .cmp td::before{content:attr(data-l);display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}
    .cmp tbody tr{display:block;border-bottom:1px solid var(--rule);padding-bottom:.7rem}
    .cmp td{border:0}
  }
  @media (max-width:620px){
    body{font-size:16px}
    .plans,.prin,.team,.simout{grid-template-columns:1fr}
    .plan{border-right:0;border-bottom:1px solid var(--rule-soft)}
    .plan:last-child{border-bottom:0}
    .stats{grid-template-columns:1fr}
    .stat{border-right:0;padding-right:0}
    .ftr__top{grid-template-columns:1fr}
    .mod__grid,.tools3,.cards{grid-template-columns:1fr}
    .hero__proof{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hero__proof>div{padding-right:1.2rem;border-bottom:1px solid var(--rule-soft);padding-bottom:1.2rem}
    .hero__proof>div:nth-child(2n){border-right:0;padding-right:0}
    .hero__mark{display:none}
  }
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
    .rv,.rv-l{opacity:1;transform:none}
    .ticker__row{animation:none}
  }