:root{
    --bg: #EDEEE6;
    --bg-soft: #F5F5EF;
    --panel: #1F2420;
    --panel-soft: #2A302A;
    --screen: #C9D6BE;
    --screen-dark: #16211A;
    --ink: #171B17;
    --ink-soft: #4B5147;
    --muted: #767C70;
    --line: #D6D7CC;
    --key-blue: #3A6EA5;
    --key-blue-dark: #2C5580;
    --key-red: #B6412C;
    --key-amber: #D69A2D;
    --white: #FFFFFF;
    --radius-s: 4px;
    --radius-m: 8px;
    --mono: 'JetBrains Mono', 'Courier New', monospace;
    --sans: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  html,body{overflow-x:hidden;max-width:100%;}
  body{
    margin:0;
    font-family:var(--sans);
    background:var(--bg);
    color:var(--ink);
    line-height:1.5;
  }
  a{color:inherit;text-decoration:none;}
  img,svg{display:block;max-width:100%;}
  button{font-family:inherit;cursor:pointer;}
  input,select{font-family:inherit;max-width:100%;}
  .wrap{max-width:1240px;margin:0 auto;padding:0 24px;}

  /* ---------- utility icon ---------- */
  .icon{width:20px;height:20px;flex-shrink:0;}
  .icon path,.icon circle,.icon rect,.icon line{stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;}

  /* ---------- header ---------- */
  header{
    background:var(--panel);
    color:var(--bg-soft);
    position:sticky;top:0;z-index:100;
    border-bottom:3px solid var(--key-amber);
  }
  .header-row{
    display:flex;align-items:center;gap:44px;
    padding:14px 24px;
    max-width:1240px;margin:0 auto;
  }
  .logo{
    display:flex;align-items:center;gap:8px;
    font-family:var(--mono);font-weight:700;font-size:19px;
    color:var(--white);letter-spacing:-0.02em;
  }
  .logo .dot{width:9px;height:9px;border-radius:50%;background:var(--key-amber);}
  .logo .dot.b{background:var(--key-blue);}
  .logo .dot.r{background:var(--key-red);}
  .logo .dots{display:flex;gap:3px;margin-right:2px;}

  nav.primary-nav{display:flex;align-items:center;gap:4px;}
  .nav-item{position:relative;}
  .nav-trigger{
    background:none;border:none;color:var(--bg-soft);
    font-size:14.5px;font-weight:600;padding:10px 12px;border-radius:6px;
    display:flex;align-items:center;gap:6px;
  }
  .nav-trigger:hover, .nav-trigger.active{background:rgba(255,255,255,0.08);color:var(--white);}
  .nav-trigger svg{width:13px;height:13px;transition:transform .15s ease;}
  .nav-item.open .nav-trigger svg{transform:rotate(180deg);}
  .plain-link{color:var(--bg-soft);font-size:14.5px;font-weight:600;padding:10px 12px;border-radius:6px;}
  .plain-link:hover{background:rgba(255,255,255,0.08);color:var(--white);}

  .header-actions{display:flex;align-items:center;gap:10px;margin-left:auto;}
  .hidden-feature{display:none !important;}

  /* ---------- login modal ---------- */
  .modal-overlay{
    display:none;position:fixed;inset:0;background:rgba(20,24,20,0.55);
    align-items:center;justify-content:center;z-index:200;padding:20px;
  }
  .modal-overlay.open{display:flex;}
  .modal-box{
    position:relative;background:var(--white);border-radius:14px;padding:30px;
    width:100%;max-width:380px;box-shadow:0 30px 60px rgba(0,0,0,0.35);
  }
  .modal-box h3{margin:0 0 8px;font-size:20px;font-weight:800;}
  .modal-sub{margin:0 0 20px;font-size:13.5px;color:var(--ink-soft);}
  .modal-close{
    position:absolute;top:16px;right:16px;background:none;border:none;color:var(--muted);
    width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:6px;
  }
  .modal-close:hover{background:var(--bg-soft);color:var(--ink);}
  .modal-error{min-height:16px;font-size:12.5px;color:var(--key-red);margin:2px 0 14px;font-weight:600;}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:9px 16px;border-radius:6px;font-size:14px;font-weight:700;
    border:1px solid transparent;
  }
  .btn-ghost{color:var(--bg-soft);border-color:rgba(255,255,255,0.25);}
  .btn-ghost:hover{border-color:var(--white);color:var(--white);}
  .btn-amber{background:var(--key-amber);color:#241a04;}
  .btn-amber:hover{background:#e8ab3d;}

  /* ---------- mega menu ---------- */
  .mega{
    position:absolute;top:calc(100% + 3px);left:50%;transform:translateX(-50%);
    width:880px;max-width:92vw;
    background:var(--white);color:var(--ink);
    border-radius:var(--radius-m);
    box-shadow:0 18px 40px rgba(0,0,0,0.28);
    padding:26px;display:none;
    grid-template-columns:repeat(4,1fr) 1.4fr;gap:8px;
  }
  .nav-item.open .mega{display:grid;}
  .mega-col{padding:0 14px;border-right:1px solid var(--line);}
  .mega-col:first-child{padding-left:0;}
  .mega-col h4{
    margin:0 0 12px;font-size:11px;font-weight:800;color:var(--muted);
    text-transform:uppercase;letter-spacing:0.06em;display:flex;align-items:center;gap:7px;
  }
  .mega-col h4 span[class^="dot-"]{width:7px;height:7px;border-radius:50%;display:inline-block;}
  .dot-lav{background:#5b5df7}.dot-pink{background:#ed4e68}.dot-mint{background:#7dae1f}.dot-sky{background:#1684b9}
  .mega-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px;}
  .mega-col a{
    display:flex;align-items:center;gap:9px;
    padding:8px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--ink);transition:.15s ease;
  }
  .mega-col a:hover{background:var(--bg-soft);transform:translateX(2px);}
  .mega-col a .icon{color:var(--key-blue);width:16px;height:16px;flex-shrink:0;}
  .mega-feature{
    grid-column:span 1;background:linear-gradient(150deg,#eef0ff,#e7e9ff);border-radius:16px;padding:18px;
    display:flex;flex-direction:column;align-items:flex-start;
  }
  .mega-feature .ti{width:38px;height:38px;border-radius:11px;background:#fff;color:#5b5df7;margin-bottom:10px;box-shadow:0 4px 10px rgba(24,28,60,.06);}
  .mega-feature .tag{font-size:10px;font-weight:700;color:#5b5df7;text-transform:uppercase;letter-spacing:.04em;}
  .mega-feature h5{margin:6px 0 6px;font-size:16px;letter-spacing:-.02em;}
  .mega-feature p{margin:0 0 10px;font-size:12px;line-height:1.5;color:var(--ink-soft);}
  .mega-feature .formula{font-family:var(--mono);font-size:10px;font-weight:600;color:#3a3f5c;background:rgba(255,255,255,.7);border:1px solid rgba(20,25,45,.08);border-radius:7px;padding:4px 7px;margin-bottom:12px;}
  .mega-feature .go{font-size:13px;font-weight:700;color:var(--key-blue-dark);margin-top:auto;}

  /* mobile nav */
  .burger{display:none;background:none;border:none;color:var(--white);padding:6px;}
  .mobile-panel{display:none;}

  /* ---------- hero ---------- */
  .hero{padding:56px 0 40px;}
  .eyebrow-free{font-family:var(--mono);font-size:13px;color:var(--key-blue-dark);font-weight:600;margin:0 0 14px;}
  .hero h1{
    font-size:46px;line-height:1.08;margin:0 0 18px;letter-spacing:-0.015em;font-weight:800;
  }
  .hero p.lead{font-size:17px;color:var(--ink-soft);max-width:480px;margin:0 0 26px;}
  .hero-cta{display:flex;gap:12px;}
  .btn-primary{background:var(--key-blue);color:var(--white);padding:13px 22px;border-radius:7px;font-weight:700;font-size:15px;}
  .btn-primary:hover{background:var(--key-blue-dark);}
  .btn-secondary{padding:13px 22px;border-radius:7px;font-weight:700;font-size:15px;border:1.5px solid var(--line);color:var(--ink);}
  .btn-secondary:hover{border-color:var(--ink);}

  /* ---------- ad slots ---------- */
  .ad-slot{
    border:1.5px dashed var(--line);background:var(--bg-soft);border-radius:10px;
    display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;
    color:var(--muted);font-size:12.5px;font-weight:600;
  }
  .ad-slot .ad-label{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9AA096;}
  .ad-banner{height:90px;margin:0 0 36px;}
  .ad-banner-sm{height:74px;margin:36px 0;}
  .ad-sidebar{height:600px;position:sticky;top:90px;}

  /* ---------- section shells ---------- */
  section.block{padding:56px 0;}
  .block-head{max-width:600px;margin:0 0 34px;}
  .block-head .kicker{font-family:var(--mono);font-size:12.5px;color:var(--key-blue-dark);font-weight:700;margin:0 0 8px;}
  .block-head h2{font-size:30px;margin:0 0 10px;font-weight:800;letter-spacing:-0.01em;}
  .block-head p{margin:0;color:var(--ink-soft);font-size:15.5px;}

  /* ---------- tool grid ---------- */
  .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
  .tool-card{
    background:var(--white);border:1.5px solid var(--line);border-radius:10px;padding:18px;
    display:flex;flex-direction:column;gap:10px;min-width:0;transition:border-color .12s ease, transform .12s ease;
  }
  .tool-card:hover{border-color:var(--key-blue);transform:translateY(-2px);}
  .tool-card .ti{
    width:38px;height:38px;border-radius:8px;background:var(--screen);
    display:flex;align-items:center;justify-content:center;color:var(--screen-dark);
  }
  .tool-card h3{margin:0;font-size:15.5px;font-weight:700;}
  .tool-card p{margin:0;font-size:13px;color:var(--ink-soft);flex:1;}
  .tool-card .cat{font-family:var(--mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}

  /* ---------- calculator panels ---------- */
  .calc-layout{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:start;}
  .calc-panel{
    scroll-margin-top:90px;
    background:var(--white);border:1.5px solid var(--line);border-radius:14px;
    padding:30px;margin-bottom:26px;
  }
  .calc-panel-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:22px;}
  .calc-panel-head .ti{
    width:44px;height:44px;border-radius:9px;background:var(--panel);color:var(--screen);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .calc-panel-head h3{margin:0 0 4px;font-size:21px;font-weight:800;}
  .calc-panel-head p{margin:0;color:var(--ink-soft);font-size:14px;}

  .field-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:16px;}
  .field{display:flex;flex-direction:column;gap:6px;min-width:0;}
  .field.full{grid-column:1/-1;}
  .field label{font-size:12.5px;font-weight:700;color:var(--ink-soft);}
  .field input, .field select{
    border:1.5px solid var(--line);border-radius:7px;padding:10px 12px;font-size:15px;color:var(--ink);
    background:var(--bg-soft);
  }
  .field input:focus, .field select:focus{outline:none;border-color:var(--key-blue);}
  .seg{display:flex;border:1.5px solid var(--line);border-radius:7px;overflow:hidden;}
  .seg button{flex:1;min-width:0;background:var(--bg-soft);border:none;padding:9px 0;font-size:13.5px;font-weight:700;color:var(--ink-soft);}
  .seg button.active{background:var(--panel);color:var(--screen);}

  .result-box{
    margin-top:6px;background:var(--screen);border-radius:10px;padding:20px 22px;
  }
  .result-box .r-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;}
  .result-box .r-row + .r-row{border-top:1px dashed rgba(23,32,22,0.22);}
  .result-box .r-label{font-size:13px;color:#3B4A38;font-weight:600;}
  .result-box .r-value{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--screen-dark);}
  .result-box .r-value.big{font-size:32px;}
  .result-note{margin-top:10px;font-size:12.5px;color:var(--muted);}
  .how-to{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);font-size:13.5px;color:var(--ink-soft);line-height:1.6;}
  .how-to strong{color:var(--ink);}
  .inline-link{color:var(--key-blue-dark);font-weight:700;text-decoration:underline;}

  /* ---------- faq ---------- */
  .faq{max-width:760px;}
  .faq-item{border-bottom:1.5px solid var(--line);padding:18px 0;}
  .faq-item:first-child{border-top:1.5px solid var(--line);}
  .faq-item summary{list-style:none;cursor:pointer;font-weight:700;font-size:15.5px;display:flex;justify-content:space-between;align-items:center;gap:16px;}
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item .faq-icon{flex-shrink:0;width:24px;height:24px;border-radius:6px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--ink-soft);transition:transform .15s ease, background .15s ease, color .15s ease;}
  .faq-item[open] .faq-icon{transform:rotate(45deg);background:var(--panel);color:var(--screen);}
  .faq-item p{margin:12px 0 0;font-size:14.5px;color:var(--ink-soft);line-height:1.7;}

  .gpa-row{display:grid;grid-template-columns:1fr 110px 100px 34px;gap:10px;margin-bottom:10px;align-items:center;}
  .gpa-row input, .gpa-row select{border:1.5px solid var(--line);border-radius:7px;padding:8px 10px;font-size:14px;background:var(--bg-soft);}
  .icon-btn{
    width:32px;height:32px;border-radius:6px;border:1.5px solid var(--line);background:var(--bg-soft);
    display:flex;align-items:center;justify-content:center;color:var(--key-red);
  }
  .icon-btn:hover{border-color:var(--key-red);}
  .add-row-btn{
    display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--key-blue-dark);
    background:none;border:none;padding:8px 0;
  }

  /* ---------- feature trio ---------- */
  .trio{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .trio .card{background:var(--white);border:1.5px solid var(--line);border-radius:12px;padding:26px;}
  .trio .ti{width:40px;height:40px;border-radius:9px;background:var(--panel);color:var(--screen);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
  .trio h3{margin:0 0 8px;font-size:17px;font-weight:800;}
  .trio p{margin:0;font-size:14px;color:var(--ink-soft);}

  /* ---------- CTA banner ---------- */
  .cta-banner{
    background:var(--panel);border-radius:16px;padding:44px;text-align:center;
    background-image:radial-gradient(circle at 85% 20%, rgba(214,154,45,0.18), transparent 55%);
  }
  .cta-banner h2{color:var(--white);font-size:27px;margin:0 0 20px;font-weight:800;max-width:520px;margin-left:auto;margin-right:auto;}

  /* ---------- footer ---------- */
  footer{background:var(--panel);color:#B9BFB4;margin-top:20px;}
  .footer-top{padding:56px 0 36px;}
  .footer-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px 28px;}
  .footer-cols > div{min-width:0;}
  .footer-cols h4{color:var(--white);font-size:13px;font-weight:800;margin:0 0 14px;text-transform:uppercase;letter-spacing:.05em;}
  .footer-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  .footer-cols a{font-size:13.5px;color:#AEB5A8;}
  .footer-cols a:hover{color:var(--white);}
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,0.12);padding:22px 0;
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  }
  .footer-bottom .flinks{display:flex;gap:18px;flex-wrap:wrap;}
  .footer-bottom .flinks a{font-size:13px;color:#AEB5A8;}
  .footer-bottom .flinks a:hover{color:var(--white);}
  .footer-bottom .fbrand{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:700;color:var(--white);font-size:13.5px;}

  /* ---------- responsive ---------- */
  @media (max-width: 980px){
    .tool-grid{grid-template-columns:repeat(2,1fr);}
    .calc-layout{grid-template-columns:1fr;}
    .ad-sidebar{display:none;}
    nav.primary-nav{display:none;}
    .header-actions .btn-ghost{display:none;}
    .burger{display:block;}
    .mega{position:static;transform:none;width:auto;box-shadow:none;grid-template-columns:1fr;padding:10px 0;border-radius:0;border-top:none;}
    .mega-col{border-right:none;padding:6px 0;}
  }
  @media (max-width: 720px){
    .hero h1{font-size:32px;white-space:normal;}
    .field-row{grid-template-columns:1fr;}
    .trio{grid-template-columns:1fr;}
  }
  @media (max-width: 480px){
    .header-row{padding:12px 16px;gap:8px;}
    .wrap{padding:0 16px;}
    .logo{font-size:14px;letter-spacing:-.03em;min-width:0;flex-shrink:1;}
    .logo-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-width:100%;}
    .logo-icon{height:22px;margin-right:5px;flex-shrink:0;}
    .header-actions{gap:6px;flex-shrink:0;}
    .tt-track{width:40px;height:24px;}
    .tt-knob{width:18px;height:18px;top:2px;left:2px;}
    html[data-theme="dark"] .tt-knob{transform:translateX(18px);}
    .hero h1{font-size:26px;white-space:normal;}
    .hero-cta{flex-direction:column;align-items:stretch;}
    .tool-grid{grid-template-columns:1fr;}
    .calc-panel{padding:20px 16px;}
    .calc-panel-head{gap:10px;}
    .seg{flex-direction:column;}
    .seg button{padding:10px 6px;}
    .result-box{padding:16px;}
    .result-box .r-value.big{font-size:26px;}
    .gpa-row{grid-template-columns:1fr 1fr;row-gap:8px;}
    .gpa-row .gpaName{grid-column:1/-1;}
    .cta-banner{padding:30px 20px;}
    .cta-banner h2{font-size:22px;}
  }


/* SEO/trust additions — calculator UI styles above remain unchanged. */
.trust-note{max-width:900px;margin:28px auto 12px;padding:16px 18px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink-soft);font-size:13px;line-height:1.6;}
.trust-note strong{color:var(--ink);}


/* ---------- polished information pages ---------- */
.static-page{position:relative;}
.static-content{background:rgba(255,255,255,.56);border:1px solid var(--line);border-radius:16px;padding:30px 32px;}
.static-content h2{position:relative;padding-left:14px;}
.static-content h2:before{content:"";position:absolute;left:0;top:.42em;width:5px;height:5px;border-radius:50%;background:var(--key-amber);}
.contact-card{box-shadow:0 12px 28px rgba(20,25,20,.07);transition:transform .15s ease,box-shadow .15s ease;}
.contact-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(20,25,20,.10);}
@media(max-width:720px){.static-page .page-head{padding:24px 22px;}.static-content{padding:24px 20px;}.static-page h1{font-size:30px;}}


/* ---------- 404 ---------- */
.not-found-card{max-width:620px;margin:0 auto;text-align:center;background:var(--white);border:1px solid var(--line);border-radius:28px;padding:16px 34px 48px;box-shadow:0 20px 50px rgba(20,25,20,.08);position:relative;overflow:hidden;}
.nf-art{position:relative;width:240px;height:240px;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;}
.nf-ring{position:absolute;inset:0;border-radius:50%;border:1.5px dashed #d7d9ee;animation:nfSpin 40s linear infinite;}
.nf-ring:before{content:"";position:absolute;inset:18px;border-radius:50%;background:radial-gradient(circle,rgba(91,93,247,.10),rgba(91,93,247,0) 70%);}
@keyframes nfSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.nf-illustration{position:relative;width:188px;height:auto;display:none;}
.nf-illustration-light{display:block;}
.not-found-code{display:inline-block;font-family:var(--mono);font-size:11.5px;font-weight:800;letter-spacing:.14em;color:#5b5df7;background:#eef0ff;padding:6px 14px;border-radius:999px;margin-bottom:14px;}
.not-found-card h1{font-size:32px;line-height:1.15;margin:0 0 12px;letter-spacing:-.025em;}
.not-found-card>p{max-width:460px;margin:0 auto;color:var(--ink-soft);font-size:15px;line-height:1.6;}
.not-found-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px;}
.not-found-tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--line);}
.not-found-tools a{padding:8px 11px;border:1px solid var(--line);border-radius:7px;background:var(--bg-soft);font-size:12.5px;font-weight:700;color:var(--ink-soft);}
.not-found-tools a:hover{border-color:var(--key-blue);color:var(--key-blue-dark);}
@media(max-width:600px){.not-found-card{padding:12px 20px 38px;}.not-found-card h1{font-size:26px;}.nf-art{width:190px;height:190px;}.nf-illustration{width:150px;}}

/* =========================================================
   ONLINECALCULATORWORKS — MODERN YOUTH REDESIGN
   Original calculator functionality preserved.
   ========================================================= */
:root{
  --bg:#f7f7fb;
  --bg-soft:#ffffff;
  --panel:#111426;
  --panel-soft:#1c2035;
  --screen:#eef7ff;
  --screen-dark:#10162b;
  --ink:#101426;
  --ink-soft:#5f6578;
  --muted:#8c91a3;
  --line:#e6e8f0;
  --key-blue:#5b5df7;
  --key-blue-dark:#4547dc;
  --key-red:#ff5d73;
  --key-amber:#c8f04a;
  --white:#fff;
  --radius-s:10px;
  --radius-m:18px;
  --shadow:0 18px 50px rgba(24,28,60,.10);
  --shadow-lg:0 30px 80px rgba(25,29,65,.16);
}
body{background:
  radial-gradient(circle at 8% 8%,rgba(91,93,247,.08),transparent 24rem),
  radial-gradient(circle at 92% 18%,rgba(200,240,74,.10),transparent 23rem),
  var(--bg);}
::selection{background:#c8f04a;color:#101426;}

/* Header */
header{background:rgba(17,20,38,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.09);box-shadow:0 8px 30px rgba(10,12,25,.10);}
.header-row{padding:15px 24px;gap:30px;}
.logo{font-family:var(--sans);font-size:18px;letter-spacing:-.045em;font-weight:800;display:inline-flex;align-items:center;color:#fff;}
.logo-icon{height:30px;width:auto;margin-right:9px;display:block;}
.logo-suffix{color:#5b5df7;font-weight:800;}
.fbrand{display:flex;align-items:center;}
.fbrand .logo-icon{height:26px;}
.fbrand .logo-suffix{color:#c8f04a;}
.logo .dot{width:8px;height:8px;box-shadow:0 0 0 3px rgba(200,240,74,.08);}
.logo .dot.b{background:#6b6dff}.logo .dot.r{background:#ff5d73}
.nav-trigger,.plain-link{font-size:13.5px;color:#dfe2f1;border-radius:10px;transition:.2s ease;}
.nav-trigger:hover,.nav-trigger.active,.plain-link:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateY(-1px)}
.mega{border:1px solid rgba(17,20,38,.07);border-radius:20px;box-shadow:0 25px 60px rgba(20,25,50,.16);}

/* Hero */
.hero{padding:74px 0 60px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(120% 100% at 50% -10%,#f3f6ff 0%,#fbfbfe 45%,#fff 75%);}
.hero-inner{max-width:920px;margin:0 auto;text-align:center;}
.eyebrow-free{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 25px rgba(30,35,70,.06);padding:8px 12px;border-radius:999px;color:#4e5368;font-size:11px;letter-spacing:.01em;margin-bottom:18px;}
.pulse-dot{width:7px;height:7px;background:#65c466;border-radius:50%;box-shadow:0 0 0 5px rgba(101,196,102,.13);animation:pulseDot 1.8s infinite;}
.hero h1{font-size:clamp(34px,4.6vw,54px);line-height:1.06;letter-spacing:-.04em;white-space:nowrap;margin:0 auto 18px;}
.hero h1 span{background:linear-gradient(100deg,#5b5df7 0%,#7a63ff 55%,#4c4fdc 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero p.lead{font-size:17px;line-height:1.65;max-width:520px;color:#666c80;margin:0 auto 22px;}
.hero-usecases{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 28px;}
.hero-usecases span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 11px;font-size:11.5px;font-weight:700;color:#545a70;box-shadow:0 5px 18px rgba(20,25,60,.04);}
.hero-cta{gap:10px;align-items:center;justify-content:center;}
.btn-primary,.btn-secondary{border-radius:12px;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.btn-primary{background:#5b5df7;padding:14px 20px;box-shadow:0 12px 25px rgba(91,93,247,.22);}
.btn-primary:hover{background:#4b4de1;transform:translateY(-2px);box-shadow:0 16px 30px rgba(91,93,247,.27)}
.btn-secondary{background:#fff;border:1px solid var(--line);padding:13px 20px;box-shadow:0 8px 20px rgba(25,30,70,.05)}
.btn-secondary:hover{border-color:#cfd2df;transform:translateY(-2px);}

/* Sections */
section.block{padding:72px 0;}
.block-head{max-width:700px;margin-bottom:30px;}
.block-head .kicker{color:#5b5df7;font-size:11px;letter-spacing:.1em;text-transform:uppercase;}
.block-head h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.045em;margin-bottom:9px;}
.block-head p{font-size:15.5px;color:#707588;}

/* Tool cards */
.tool-grid{grid-template-columns:repeat(4,1fr);gap:15px;}
.tool-card{position:relative;overflow:hidden;border:1px solid transparent;border-radius:22px;padding:22px;background:#eef0ff;box-shadow:0 8px 24px rgba(24,28,60,.05);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;display:flex;flex-direction:column;gap:2px;}
.tool-card[data-cat="Finance"]{background:#eef0ff;}
.tool-card[data-cat="Health"]{background:#fff0f2;}
.tool-card[data-cat="Math & data"]{background:#eafbe0;}
.tool-card[data-cat="Everyday"]{background:#eaf8ff;}
.tool-card::after{content:"→";position:absolute;right:20px;top:20px;font-size:18px;font-weight:800;color:rgba(20,25,45,.18);transition:.25s ease;}
.tool-card:hover{transform:translateY(-7px);box-shadow:0 20px 45px rgba(35,39,95,.14)}
.tool-card:hover::after{color:#171a30;transform:translateX(3px)}
.tool-card .ti{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.75);color:#5b5df7;margin-bottom:10px;transition:.25s ease;box-shadow:0 4px 12px rgba(24,28,60,.06);}
.tool-card[data-cat="Health"] .ti{color:#c22a4e}
.tool-card[data-cat="Math & data"] .ti{color:#4c7a12}
.tool-card[data-cat="Everyday"] .ti{color:#1684b9}
.tool-card:hover .ti{transform:rotate(-4deg) scale(1.06)}
.tool-card h3{font-size:17px;font-weight:800;letter-spacing:-.02em;color:#14172a;}
.tool-card p{font-size:12.5px;color:#565c75;margin-bottom:8px;}
.tool-card .formula{display:inline-block;width:fit-content;font-family:var(--mono);font-size:10.5px;font-weight:600;color:#3a3f5c;background:rgba(255,255,255,.6);border:1px solid rgba(20,25,45,.08);border-radius:7px;padding:4px 8px;margin-bottom:10px;}
.tool-card .cat{font-size:9.5px;color:#7d8296;letter-spacing:.09em;margin-top:auto;}

/* Calculator panels */
.calc-layout{grid-template-columns:minmax(0,1fr);}
.calc-panel{position:relative;background:rgba(255,255,255,.88);border:1px solid var(--line);border-radius:24px;padding:28px;margin-bottom:18px;box-shadow:0 8px 30px rgba(24,28,60,.04);transition:box-shadow .25s ease,border-color .25s ease,transform .25s ease;}
.calc-panel:hover{border-color:#d8daf0;box-shadow:0 18px 45px rgba(24,28,60,.08)}
.calc-panel::before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:3px;border-radius:999px;background:linear-gradient(#5b5df7,#c8f04a);opacity:0;transition:.25s ease}.calc-panel:hover::before{opacity:1}
.calc-panel-head{margin-bottom:20px}.calc-panel-head .ti{width:46px;height:46px;border-radius:14px;background:#111426;color:#fff}.calc-panel-head h3{font-size:22px;letter-spacing:-.03em}.calc-panel-head p{color:#717789}
.field-row{gap:14px}.field{gap:7px}.field label{font-size:11.5px;color:#646a7d;letter-spacing:.01em}.field input,.field select{border:1px solid #e1e3eb;border-radius:11px;background:#fafbfe;padding:12px 13px;transition:.2s ease}.field input:hover,.field select:hover{border-color:#cfd2e0}.field input:focus,.field select:focus{border-color:#696bff;box-shadow:0 0 0 4px rgba(91,93,247,.10)}
.seg{border:1px solid #e1e3eb;border-radius:12px;padding:3px;background:#f7f8fb}.seg button{border-radius:9px;padding:9px;background:transparent;transition:.2s ease}.seg button.active{background:#111426;color:#fff;box-shadow:0 4px 12px rgba(17,20,38,.15)}
.result-box{border:1px solid #e0e3ec;border-radius:17px;background:linear-gradient(135deg,#f7f9ff,#f1f5ff);padding:17px 18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.r-row{padding:7px 0}.r-label{color:#73798b;font-size:12px}.r-value{font-weight:800;color:#171a30}.r-value.big{font-size:27px;color:#5154e9}
.how-to{background:#fafbfe;border-left:3px solid #c8f04a;border-radius:0 10px 10px 0;padding:10px 12px;font-size:12px;color:#73788a;margin-top:15px}.how-to strong{color:#363b50}.result-note{font-size:11.5px;color:#8a8fa0}
.add-row-btn{border:1px dashed #cfd2df;background:#fff;color:#5b5df7;border-radius:11px;padding:10px 14px;font-weight:800;transition:.2s}.add-row-btn:hover{background:#f4f4ff;border-color:#9698ff}

/* Feature cards */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.card{background:#111426;color:#fff;border:1px solid rgba(255,255,255,.06);border-radius:22px;padding:25px;box-shadow:var(--shadow);transition:.25s}.card:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(17,20,38,.18)}.card .ti{width:44px;height:44px;border-radius:13px;background:#262b48;color:#c8f04a;margin-bottom:16px}.card h3{font-size:18px;letter-spacing:-.025em}.card p{color:#b9bdd0;font-size:13px}

/* FAQ */
.faq{display:grid;gap:9px}.faq-item{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0 18px;box-shadow:0 5px 20px rgba(24,28,60,.035);overflow:hidden}.faq-item summary{list-style:none;cursor:pointer;padding:18px 0;font-weight:750;font-size:14px;display:flex;justify-content:space-between;gap:20px}.faq-item summary::-webkit-details-marker{display:none}.faq-item p{font-size:13px;color:#6c7284;max-width:850px;margin:0;padding:0 0 18px}.faq-icon{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#f0f1ff;color:#5b5df7;font-weight:800;transition:.2s}.faq-item[open] .faq-icon{transform:rotate(45deg);background:#111426;color:#c8f04a}
.trust-note{background:linear-gradient(100deg,#111426,#1c2035);color:#dfe2f0;border:1px solid rgba(255,255,255,.07);border-radius:20px;padding:0;box-shadow:var(--shadow);font-size:12.5px;overflow:hidden;}
.trust-note strong{color:#c8f04a}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);}
.marquee-track{display:flex;width:max-content;animation:marqueeScroll 26s linear infinite;padding:18px 0;}
.marquee-track span{white-space:nowrap;padding:0 40px;position:relative;}
.marquee-track span::after{content:"•";position:absolute;right:-4px;color:#454b68;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes marqueeScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

/* Footer */
footer{background:#0c0f1d;color:#aeb3c6;border-top:1px solid rgba(255,255,255,.06);margin-top:20px}
.footer-top{padding-top:60px;padding-bottom:38px;display:grid;grid-template-columns:.85fr 2.2fr;gap:56px;}
.footer-lead{max-width:280px;}
.footer-brand{display:inline-flex;align-items:center;gap:10px;color:#fff;font-family:var(--sans);font-size:20px;font-weight:800;letter-spacing:-.03em;margin-bottom:14px;}
.footer-brand .logo-icon-lg{height:32px;width:auto;}
.footer-lead p{font-size:13px;line-height:1.6;color:#9198b0;margin:0 0 18px;}
.footer-mail{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:9px 14px;transition:.2s ease;}
.footer-mail svg{width:15px;height:15px;color:#c8f04a;}
.footer-mail:hover{background:#fff;color:#0c0f1d;}
.footer-mail:hover svg{color:#0c0f1d;}
.footer-cols{gap:28px;}
.footer-cols h4{color:#fff;font-size:11px;text-transform:uppercase;letter-spacing:.09em}
.footer-cols a{color:#9fa5ba;font-size:12.5px}
.footer-cols a:hover{color:#c8f04a}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:18px;padding-bottom:22px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.fbrand{color:#fff;font-weight:800}
@media (max-width:820px){.footer-top{grid-template-columns:1fr;gap:34px;}.footer-lead{max-width:none;}}

/* Back to top */
.back-to-top{position:fixed;right:22px;bottom:22px;width:44px;height:44px;border-radius:50%;background:#5b5df7;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(91,93,247,.35);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s ease,transform .25s ease,background .2s ease;z-index:60;border:none;cursor:pointer;}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.back-to-top:hover{background:#4b4de1;}
.back-to-top svg{width:18px;height:18px;}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1)}
.reveal.is-visible{opacity:1;transform:none}

/* ---------- hero floating cards ---------- */
.hero-floaters{display:grid;grid-template-columns:1fr auto 1.3fr;gap:18px;align-items:center;max-width:900px;margin:52px auto 0;position:relative;z-index:1;}
.hf-card{border-radius:20px;padding:20px;box-shadow:0 20px 45px rgba(24,28,60,.08);transition:transform .25s ease,box-shadow .25s ease;}
.hf-card:hover{transform:translateY(-4px);}
.hf-dark{background:linear-gradient(150deg,#171a2d,#0d1020);color:#fff;text-align:left;}
.hf-light{background:#fff;border:1px solid var(--line);text-align:left;}
.hf-tabs{display:flex;gap:6px;margin-bottom:14px;}
.hf-tabs button{flex:1;background:rgba(255,255,255,.07);color:#c3c6dc;border-radius:8px;padding:7px 4px;font-size:10px;font-weight:700;transition:.2s ease;}
.hf-tabs button.active{background:#fff;color:#11162b;}
.hf-io{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;margin-bottom:10px;}
.hf-io label{font-size:10px;color:#9aa0c0;display:block;margin-bottom:4px;}
.hf-io input{width:100%;background:rgba(255,255,255,.08);border:none;border-radius:8px;padding:9px 10px;color:#fff;font-family:var(--mono);font-size:15px;}
.hf-result{font-family:var(--mono);font-size:32px;font-weight:700;margin:6px 0 0;color:#fff;}
.hf-result .unit{font-size:16px;color:#9aa0c0;margin-left:2px;}
.hf-tag{display:inline-block;font-size:10.5px;font-weight:800;color:#5b5df7;background:#eef0ff;padding:4px 9px;border-radius:999px;margin-bottom:10px;text-transform:uppercase;letter-spacing:.04em;}
.hf-headline{font-size:17px;font-weight:800;margin:0 0 6px;color:#171a30;}
.hf-sub{font-size:12.5px;color:#6c7284;margin:0;line-height:1.5;}
.hf-go{display:inline-block;margin-top:12px;font-size:12.5px;font-weight:700;color:#5b5df7;}
.hf-scroll{position:relative;display:block;width:128px;height:128px;margin:0 auto;border-radius:50%;box-shadow:0 16px 34px rgba(91,93,247,.3);transition:transform .25s ease,box-shadow .25s ease;}
.hf-scroll:hover{transform:scale(1.05);box-shadow:0 18px 38px rgba(91,93,247,.38);}
.hf-scroll-ring{position:absolute;inset:0;width:100%;height:100%;display:block;animation:hfRingRotate 16s linear infinite;}
.hf-scroll-ring circle{fill:#5b5df7;}
.hf-scroll-ring text{font-size:7.6px;font-weight:800;letter-spacing:1.1px;fill:#fff;text-transform:uppercase;}
.hf-scroll:hover .hf-scroll-ring{animation-play-state:paused;}
.hf-scroll-arrow{position:absolute;top:50%;left:50%;width:26px;height:26px;transform:translate(-50%,-50%);color:#fff;pointer-events:none;}
@keyframes hfRingRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.hf-scroll-ring{animation:none;}}
@media (max-width:820px){.hero-floaters{grid-template-columns:1fr;max-width:440px;}.hf-scroll{width:96px;height:96px;}.hf-scroll-arrow{width:20px;height:20px;}}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 4px rgba(101,196,102,.12)}50%{box-shadow:0 0 0 8px rgba(101,196,102,.02)}}

@media(max-width:900px){
  .header-row{padding:13px 18px}.primary-nav{display:none!important}.burger{display:block}
  .hero{padding:55px 0 42px}.hero h1{font-size:clamp(30px,6.5vw,44px);white-space:normal;}.hero p.lead{font-size:16px}.tool-grid{grid-template-columns:repeat(2,1fr)}.trio{grid-template-columns:1fr}.calc-layout{grid-template-columns:1fr}
}
@media(max-width:560px){
  .wrap{padding:0 16px}.hero{padding-top:42px}.hero-cta{flex-direction:column;align-items:stretch}.hero-cta a{width:100%;text-align:center}.hero-usecases{gap:6px}.hero-usecases span{font-size:10.5px}.tool-grid{grid-template-columns:1fr 1fr;gap:10px}.tool-card{padding:16px;border-radius:16px}.tool-card p{display:none}.calc-panel{padding:20px;border-radius:20px}.field-row{grid-template-columns:1fr}.field.full{grid-column:auto}.block-head h2{font-size:32px}.footer-cols{grid-template-columns:repeat(2,1fr)}.footer-brand{font-size:17px}.footer-brand .logo-icon-lg{height:26px}.back-to-top{right:14px;bottom:14px;width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Static pages use the same visual system */
.static-page{padding-top:65px;padding-bottom:75px;max-width:1240px}.page-head{background:linear-gradient(135deg,#111426,#242949);border-radius:28px;padding:42px 44px;margin-bottom:22px;color:#fff;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}.page-head::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-40px;top:-70px;background:rgba(200,240,74,.13)}.page-head .kicker{position:relative;z-index:1;color:#c8f04a;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.page-head h1{position:relative;z-index:1;font-size:clamp(38px,6vw,62px);line-height:1;letter-spacing:-.055em;margin:8px 0 0}.static-content{background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:24px;padding:34px 38px;box-shadow:var(--shadow)}.static-content h2{font-size:23px;letter-spacing:-.03em;margin:28px 0 9px}.static-content h2:first-child{margin-top:0}.static-content p,.static-content li{font-size:14px;line-height:1.8;color:#62697b}.static-content ul{padding-left:20px}.inline-link{color:#5558e8;font-weight:800;text-decoration:underline;text-decoration-color:#c8f04a;text-underline-offset:3px}.inline-link:hover{color:#3f41c8}
@media(max-width:560px){.static-page{padding-top:38px}.page-head{padding:30px 24px;border-radius:22px}.static-content{padding:24px 20px;border-radius:20px}.static-content h2{font-size:20px}}

/* =========================================================
   FINAL UI POLISH — mega menu + calculator cards
   ========================================================= */
header{border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 30px rgba(7,10,15,.14);backdrop-filter:blur(14px);}
.header-row{min-height:70px;gap:34px;}
.logo{font-size:20px;letter-spacing:-.045em;}
.logo-icon{width:29px;height:29px;object-fit:contain;}
.nav-trigger,.plain-link{font-size:13px;letter-spacing:.01em;padding:10px 13px;border-radius:10px;}
.nav-trigger:hover,.nav-trigger.active,.plain-link:hover{background:rgba(255,255,255,.10);}

/* Mega menu */
.mega{
  top:calc(100% + 12px);
  width:min(1080px,calc(100vw - 32px));
  max-width:none;
  padding:14px;
  gap:10px;
  grid-template-columns:repeat(4,minmax(0,1fr)) minmax(220px,1.25fr);
  border:1px solid rgba(17,20,38,.08);
  border-radius:24px;
  background:rgba(255,255,255,.98);
  box-shadow:0 28px 80px rgba(18,22,45,.22),0 8px 24px rgba(18,22,45,.08);
  transform:translateX(-50%) translateY(-5px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.nav-item.open .mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.mega-intro{display:none;}
.mega-col{padding:12px 12px 10px;border-right:1px solid #eceef4;min-width:0;}
.mega-col:first-of-type{padding-left:12px;}
.mega-col:last-of-type{border-right:0;}
.mega-col h4{margin:0 0 10px;font-size:10px;letter-spacing:.12em;color:#8b90a2;}
.mega-col h4 span[class^="dot-"]{width:8px;height:8px;box-shadow:0 0 0 4px rgba(91,93,247,.08);}
.mega-col ul{gap:3px;}
.mega-col a{padding:9px 8px;border-radius:11px;font-size:12.5px;font-weight:750;}
.mega-col a .icon{width:17px;height:17px;color:#686bff;}
.mega-col a:hover{background:#f5f6ff;transform:translateX(3px);}
.mega-feature{margin:0;background:linear-gradient(145deg,#171a30 0%,#272b4b 100%);border-radius:18px;padding:20px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);}
.mega-feature .ti{width:42px;height:42px;border-radius:13px;background:#c8f04a;color:#171a30;box-shadow:none;}
.mega-feature .tag{font-size:9px;color:#c8f04a;letter-spacing:.11em;}
.mega-feature h5{font-size:20px;color:#fff;margin:7px 0 7px;}
.mega-feature p{color:#c2c6d6;font-size:11.5px;line-height:1.6;}
.mega-feature .formula{display:block;color:#dce0ec;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12);font-size:9.5px;white-space:normal;line-height:1.45;}
.mega-feature .go{color:#c8f04a;font-size:12.5px;}

/* Better calculator cards */
.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch;}
.tool-card{
  min-height:244px;
  padding:18px;
  border:1px solid #e4e6ee;
  border-radius:20px;
  background:#fff !important;
  box-shadow:0 8px 25px rgba(25,29,60,.045);
  gap:0;
  isolation:isolate;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease;
}
.tool-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,#6a6cff,#c8f04a);transform:scaleX(.25);transform-origin:left;transition:transform .28s ease;z-index:-1;}
.tool-card::after{display:none;}
.tool-card[data-cat="Health"]::before{background:linear-gradient(90deg,#ed4e68,#ff9a9a);}
.tool-card[data-cat="Everyday"]::before{background:linear-gradient(90deg,#1684b9,#7dd3fc);}
.tool-card[data-cat="Math & data"]::before{background:linear-gradient(90deg,#73a916,#c8f04a);}
.tool-card:hover{transform:translateY(-8px);border-color:#d5d7ea;box-shadow:0 22px 50px rgba(27,31,72,.13);}
.tool-card:hover::before{transform:scaleX(1);}
.tool-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.tool-number{font-family:var(--mono);font-size:9px;font-weight:800;color:#9a9eac;letter-spacing:.08em;}
.tool-arrow{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#f4f5fa;color:#73778b;font-size:16px;font-weight:800;transition:.25s ease;}
.tool-card:hover .tool-arrow{background:#171a30;color:#c8f04a;transform:rotate(6deg);}
.tool-card .ti{width:48px;height:48px;border-radius:15px;margin:0 0 13px;background:#f0f1ff;color:#5b5df7;box-shadow:none;transition:.25s ease;}
.tool-card[data-cat="Health"] .ti{background:#fff0f2;color:#d33155;}
.tool-card[data-cat="Math & data"] .ti{background:#eff9e7;color:#5f8e1c;}
.tool-card[data-cat="Everyday"] .ti{background:#ebf8ff;color:#1684b9;}
.tool-card:hover .ti{transform:translateY(-2px) rotate(-4deg) scale(1.05);}
.tool-card .cat{display:inline-flex;width:max-content;margin:0 0 7px;padding:5px 8px;border-radius:999px;background:#f5f6fa;color:#777c8d;font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.tool-card h3{font-size:18px;line-height:1.2;margin:0 0 7px;color:#15182a;letter-spacing:-.035em;}
.tool-card p{font-size:12px;line-height:1.55;color:#73788a;margin:0;min-height:38px;}
.tool-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto;padding-top:14px;}
.tool-card .formula{max-width:78%;margin:0;padding:5px 7px;border-radius:8px;font-size:9px;line-height:1.35;white-space:normal;color:#5e6376;background:#f8f9fc;border:1px solid #eceef4;}
.open-tool{font-size:10px;font-weight:800;color:#5b5df7;white-space:nowrap;transition:.2s ease;}
.tool-card:hover .open-tool{transform:translateX(2px);}

/* Section heading polish */
#tools{padding-top:82px;}
.block-head{margin-bottom:34px;}
.block-head .kicker{font-weight:800;color:#6a6cff;}
.block-head h2{font-weight:850;}

@media(max-width:1100px){
  .tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .mega{grid-template-columns:repeat(2,minmax(0,1fr)) 1.2fr;width:min(850px,calc(100vw - 28px));}.mega-feature{grid-column:3;grid-row:1 / span 2;}
  .mega-col:nth-of-type(2){border-right:0;}
}
@media(max-width:820px){
  .mega{position:static;width:auto;max-width:none;transform:none!important;opacity:1;visibility:visible;pointer-events:auto;display:grid!important;grid-template-columns:1fr 1fr;padding:10px;border-radius:16px;box-shadow:none;background:#171a30;color:#fff;border:1px solid rgba(255,255,255,.08);}
  .mega-col{border-right:0;padding:12px 10px;}
  .mega-col h4{color:#aeb3c6;}
  .mega-col a{color:#fff;}
  .mega-col a:hover{background:rgba(255,255,255,.08);}
  .mega-col a .icon{color:#c8f04a;}
  .mega-feature{display:none;}
  .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .tool-card{min-height:220px;padding:16px;}
}
@media(max-width:520px){
  .tool-grid{grid-template-columns:1fr 1fr;}
  .tool-card{min-height:205px;border-radius:17px;padding:14px;}
  .tool-card .ti{width:42px;height:42px;border-radius:12px;}
  .tool-card h3{font-size:16px;}
  .tool-card p{font-size:11px;min-height:34px;}
  .tool-card .formula{display:none;}
  .open-tool{font-size:9px;}
  .tool-number{font-size:8px;}
}

/* =========================================================
   CONTAINER + MEGA MENU ALIGNMENT / RESPONSIVE FIX
   ========================================================= */
.header-row{position:relative;max-width:1240px;margin:0 auto;padding-left:24px;padding-right:24px;}
.nav-item{position:static;}
.mega{
  position:absolute;
  left:50%;
  top:calc(100% + 12px);
  width:min(1192px,calc(100vw - 48px));
  max-width:none;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr) minmax(0,1fr) minmax(250px,1.08fr);
  gap:0;
  padding:12px;
  transform:translateX(-50%) translateY(-6px);
}
.mega-col{padding:16px 18px 14px;border-right:1px solid #eceef4;}
.mega-col:first-of-type{padding-left:16px;}
.mega-col:nth-of-type(3){border-right:1px solid #eceef4;}
.mega-feature{margin:4px 4px 4px 16px;min-width:0;}

@media(max-width:1100px) and (min-width:901px){
  .mega{width:min(900px,calc(100vw - 32px));grid-template-columns:repeat(2,minmax(0,1fr)) minmax(210px,1fr);}
  .mega-feature{grid-column:3;grid-row:1 / span 2;margin-left:10px;}
  .mega-col:nth-of-type(2){border-right:0;}
}

/* =========================================================
   FOOTER REDESIGN
   ========================================================= */
footer{margin-top:0;background:#0f1221;color:#aeb3c6;border-top:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden;}
footer::before{content:"";position:absolute;width:420px;height:420px;right:-180px;top:-240px;border-radius:50%;background:radial-gradient(circle,rgba(91,93,247,.20),transparent 68%);pointer-events:none;}
footer::after{content:"";position:absolute;width:260px;height:260px;left:-150px;bottom:-170px;border-radius:50%;background:radial-gradient(circle,rgba(200,240,74,.08),transparent 70%);pointer-events:none;}
.footer-top{position:relative;z-index:1;max-width:1240px;padding:68px 24px 48px;display:grid;grid-template-columns:minmax(250px,.95fr) minmax(0,2.05fr);gap:70px;}
.footer-lead{max-width:360px;}
.footer-brand{margin-bottom:18px;font-size:22px;}
.footer-brand .logo-icon-lg{height:34px;}
.footer-lead p{font-size:13px;line-height:1.75;color:#8f96ad;margin:0 0 22px;max-width:340px;}
.footer-mail{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.03);padding:10px 15px;}
.footer-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;}
.footer-cols h4{margin-bottom:15px;color:#fff;font-size:10px;letter-spacing:.12em;}
.footer-cols ul{gap:10px;}
.footer-cols a{font-size:12px;color:#9299b0;transition:color .2s ease,transform .2s ease;display:inline-block;}
.footer-cols a:hover{color:#c8f04a;transform:translateX(2px);}
.footer-bottom{position:relative;z-index:1;max-width:1240px;padding:19px 24px 24px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:20px;}
.footer-bottom span{color:#777f97;}

@media(max-width:1000px){
  .footer-top{grid-template-columns:1fr;gap:40px;}
  .footer-lead{max-width:600px;}
  .footer-cols{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:700px){
  .header-row{padding-left:16px;padding-right:16px;}
  .footer-top{padding:50px 16px 36px;}
  .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;}
  .footer-bottom{padding:17px 16px 22px;align-items:flex-start;flex-direction:column;}
}
@media(max-width:520px){
  .footer-brand{font-size:19px;}
  .footer-brand .logo-icon-lg{height:29px;}
  .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px;}
  .footer-cols a{font-size:11.5px;}
  .footer-mail{font-size:12px;max-width:100%;}
}

/* =========================================================
   MOBILE MENU — compact, no oversized gaps
   ========================================================= */
@media(max-width:900px){
  .mobile-panel{background:#111426;border-top:1px solid rgba(255,255,255,.08);box-shadow:0 20px 40px rgba(0,0,0,.20);}
  .mobile-panel .wrap{padding:12px 16px 16px;}
  .mobile-panel .mega{position:static;width:100%;max-width:none;transform:none!important;opacity:1;visibility:visible;pointer-events:auto;display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;padding:4px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;}
  .mobile-panel .mega-col{padding:13px 8px;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.07);}
  .mobile-panel .mega-col:nth-last-child(-n+2){border-bottom:0;}
  .mobile-panel .mega-col h4{margin-bottom:9px;color:#9da4ba;}
  .mobile-panel .mega-col a{color:#f5f6fb;padding:8px 5px;font-size:12px;}
  .mobile-panel .mega-col a:hover{background:rgba(255,255,255,.07);}
  .mobile-panel .mega-feature,.mobile-panel .mega-intro{display:none;}
}
@media(max-width:420px){
  .mobile-panel .mega{grid-template-columns:1fr!important;}
  .mobile-panel .mega-col{border-bottom:1px solid rgba(255,255,255,.07)!important;}
  .mobile-panel .mega-col:last-of-type{border-bottom:0!important;}
}

/* =========================================================
   RESPONSIVE CONTENT / CARDS
   ========================================================= */
@media(max-width:1100px) and (min-width:901px){
  .tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:700px){
  .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .tool-card{min-height:205px;padding:16px;border-radius:18px;}
  .tool-card h3{font-size:16px;}
  .tool-card p{font-size:11.5px;}
  section.block{padding:54px 0;}
}
@media(max-width:420px){
  .tool-grid{grid-template-columns:1fr;}
  .tool-card{min-height:0;padding:17px;}
  .tool-card p{display:block;min-height:auto;}
  .tool-card .formula{display:inline-block;}
}

/* =========================================================
   HEADER RESTYLE — off-white + interactive nav
   ========================================================= */
header{
  background:rgba(253,251,246,.88);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(20,20,40,.08);
  box-shadow:0 4px 24px rgba(20,25,50,.05);
}
.logo{color:#171a30;}
.logo:hover{color:#171a30;}
.logo-icon{transition:transform .3s cubic-bezier(.2,.8,.2,1);}
.logo:hover .logo-icon{transform:rotate(-8deg) scale(1.06);}
.logo-suffix{color:#5b5df7;}
.nav-trigger,.plain-link{
  color:#3d4257!important;
  font-size:13.5px;font-weight:700;border-radius:10px;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.nav-trigger svg{color:#8a8fa6;transition:transform .2s ease,color .2s ease;}
.nav-trigger:hover,.nav-trigger.active,.plain-link:hover{
  background:rgba(91,93,247,.09)!important;
  color:#4b4de1!important;
  transform:translateY(-1px);
}
.nav-trigger:hover svg,.nav-trigger.active svg{color:#4b4de1;}
.burger{color:#171a30;border-radius:8px;transition:background .2s ease;}
.burger:hover{background:rgba(20,20,40,.06);}
.header-actions .btn-ghost{color:#3d4257;}
@media (max-width:980px){
  .mobile-panel{background:#fff;border-top:1px solid rgba(20,20,40,.08);}
}

/* =========================================================
   TOOL CARDS — colorful + bigger formula text
   ========================================================= */
.tool-card{background:#eef0ff !important;}
.tool-card[data-cat="Health"]{background:#fff0f2 !important;}
.tool-card[data-cat="Math & data"]{background:#eefbe2 !important;}
.tool-card[data-cat="Everyday"]{background:#e9f7ff !important;}
.tool-card .ti{background:rgba(255,255,255,.75) !important;box-shadow:0 4px 12px rgba(24,28,60,.08);}
.tool-card .cat{background:rgba(255,255,255,.6) !important;}
.tool-card .formula{
  font-size:12px !important;
  line-height:1.5 !important;
  padding:7px 9px !important;
  background:rgba(255,255,255,.65) !important;
  border-color:rgba(20,25,45,.1) !important;
  color:#2b2f45 !important;
  font-weight:700;
}
.tool-arrow{background:rgba(255,255,255,.7) !important;}
.tool-card:hover .tool-arrow{background:#171a30 !important;}

/* =========================================================
   MEGA MENU FEATURE — center icon + content
   ========================================================= */
.mega-feature{align-items:center !important;text-align:center;}
.mega-feature .formula{white-space:normal;}

/* =========================================================
   MEGA MENU FEATURE — auto-rotating slide carousel
   ========================================================= */
.mega-feature{position:relative !important;min-height:280px;padding:0 !important;overflow:hidden;}
.mega-slide{
  position:absolute;inset:20px 20px 32px 20px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .32s ease,transform .32s ease;
  pointer-events:none;
}
.mega-slide .ti{display:flex;align-items:center;justify-content:center;}
.mega-slide.is-active{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;}
.mega-slide .go{margin-top:auto;padding-top:4px;}
.mega-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:6px;z-index:2;}
.mega-dots span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.22);transition:width .3s ease,background .3s ease;}
.mega-dots span.is-active{background:#c8f04a;width:15px;border-radius:3px;}
@media (prefers-reduced-motion:reduce){.mega-slide{transition:opacity .01s linear;}}

/* =========================================================
   HEADER — fixed position + logo left / nav right
   ========================================================= */
header{position:fixed;top:0;left:0;right:0;width:100%;}
body{padding-top:78px;}
.logo{margin-right:auto;}
@media (max-width:480px){body{padding-top:64px;}}
html{scroll-padding-top:90px;}

/* =========================================================
   TRUST CARDS ("why-us" trio) — fix white-on-white heading
   ========================================================= */
.trio .card{
  background:#111426 !important;color:#fff;
  border:1px solid rgba(255,255,255,.07);border-radius:22px;padding:28px;
  box-shadow:0 20px 45px rgba(17,20,38,.16);
}
.trio .card h3{color:#fff;font-size:18px;letter-spacing:-.025em;margin:4px 0 9px;}
.trio .card p{color:#b9bdd0;font-size:13.5px;line-height:1.65;margin:0;}
.trio .card .ti{width:46px;height:46px;border-radius:14px;background:#262b48;color:#c8f04a;margin-bottom:15px;}
.trio .card:hover{transform:translateY(-5px);box-shadow:0 26px 55px rgba(17,20,38,.22);}


/* =========================================================
   FINAL POLISH — shared page width + softer information sections
   ========================================================= */
.static-page .page-head,
.static-page .static-content{
  width:100% !important;
  max-width:none !important;
}
.static-page .static-content{
  padding:38px 42px !important;
}
.static-page .static-content p,
.static-page .static-content li{
  max-width:980px;
}

/* Why-us cards: light, useful, less artificial */
.trio .card,
.trio .card:hover{
  background:#fff !important;
  color:var(--ink) !important;
  border:1px solid #e5e7ef !important;
  box-shadow:0 10px 30px rgba(24,28,60,.055) !important;
}
.trio .card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(24,28,60,.09) !important;}
.trio .card h3{color:#15182b !important;}
.trio .card p{color:#666c7e !important;}
.trio .card .ti{background:#f0f1ff !important;color:#5b5df7 !important;}

/* FAQ: clean card layout */
#faq .block-head{margin-bottom:24px;}
#faq .faq{
  max-width:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
#faq .faq-item{
  background:#fff;
  border:1px solid #e5e7ef;
  border-radius:16px;
  padding:0 18px;
  box-shadow:0 7px 24px rgba(24,28,60,.035);
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
#faq .faq-item:hover{border-color:#d5d8e8;box-shadow:0 12px 30px rgba(24,28,60,.06);transform:translateY(-2px);}
#faq .faq-item[open]{border-color:#cfd2ff;box-shadow:0 12px 30px rgba(91,93,247,.07);}
#faq .faq-item summary{padding:18px 0;min-height:68px;align-items:center;}
#faq .faq-item p{padding-bottom:18px;}
#faq .faq-icon{background:#f1f2ff;color:#5b5df7;}
#faq .faq-item[open] .faq-icon{background:#5b5df7;color:#fff;}

/* Important notice: simple, readable, no marquee/dark block */
.trust-note{
  width:100%;
  max-width:none !important;
  margin:10px 0 28px;
  padding:20px 22px !important;
  background:#fffdf4 !important;
  color:#666c7e !important;
  border:1px solid #ece4bc !important;
  border-left:4px solid #d6b84b !important;
  border-radius:16px !important;
  box-shadow:0 8px 24px rgba(60,50,15,.045) !important;
  font-size:13px;
  line-height:1.6;
  overflow:visible !important;
}
.trust-note .marquee{
  overflow:visible;
  -webkit-mask-image:none;
  mask-image:none;
}
.trust-note .marquee-track{
  width:auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 28px;
  padding:0;
  animation:none;
}
.trust-note .marquee-track span{
  white-space:normal;
  padding:0 0 0 24px;
  position:relative;
}
.trust-note .marquee-track span:before{
  content:'!';
  position:absolute;
  left:0;
  top:1px;
  width:17px;height:17px;
  border-radius:50%;
  display:grid;place-items:center;
  background:#f3e7a8;
  color:#66591d;
  font-size:11px;font-weight:800;
}
.trust-note .marquee-track span:after{display:none;}
.trust-note strong{color:#3e3a20 !important;}

@media(max-width:820px){
  #faq .faq{grid-template-columns:1fr;}
  .trust-note .marquee-track{grid-template-columns:1fr;}
}
@media(max-width:720px){
  .static-page .static-content{padding:28px 22px !important;}
  .static-page .page-head{padding:32px 26px !important;}
}

/* =========================================================
   THEME — light / dark toggle (header, right side)
   Light = the existing look. Dark keeps the same brand colours
   (indigo, lime, and the four category tints), just on deep navy.
   ========================================================= */
html{color-scheme:light;}
html[data-theme="dark"]{color-scheme:dark;}

/* Smooth theme change: the browser cross-fades one snapshot of the page
   (View Transitions). Cost doesn't depend on how many elements the page has. */
::view-transition-old(root),::view-transition-new(root){
  animation-duration:.38s;
  animation-timing-function:cubic-bezier(.4,0,.2,1);
}

/* Fallback for browsers without View Transitions: fade colours only
   (no box-shadow / fill / stroke, those are the expensive ones to repaint) */
html.theme-switching *,html.theme-switching *::before,html.theme-switching *::after{
  transition:background-color .3s ease,color .3s ease,border-color .3s ease !important;
}
html.theme-switching .theme-toggle .tt-track{transition:background-color .3s ease,border-color .3s ease !important;}
html.theme-switching .theme-toggle .tt-knob{transition:transform .32s cubic-bezier(.3,1.3,.5,1),background-color .3s ease,color .3s ease !important;}
html.theme-switching .theme-toggle .tt-knob svg{transition:opacity .25s ease,transform .35s ease !important;}

/* header: nav + toggle sit together on the right */
.header-actions{margin-left:0;gap:12px;}

/* toggle switch */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;padding:4px;margin:0;background:none;border:0;border-radius:999px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.tt-track{position:relative;display:block;width:54px;height:30px;border-radius:999px;background:#e9eaf8;border:1px solid #d5d8ee;box-shadow:inset 0 1px 2px rgba(24,28,60,.06);transition:background-color .3s ease,border-color .3s ease;}
.theme-toggle:hover .tt-track{border-color:#aeb2ee;}
.theme-toggle:focus-visible{outline:none;}
.theme-toggle:focus-visible .tt-track{outline:2px solid #5b5df7;outline-offset:2px;}
.tt-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;color:#d97706;box-shadow:0 2px 6px rgba(24,28,60,.22);transition:transform .32s cubic-bezier(.3,1.3,.5,1),background-color .3s ease,color .3s ease;}
.tt-knob svg{position:absolute;top:50%;left:50%;width:14px;height:14px;margin:-7px 0 0 -7px;transition:opacity .25s ease,transform .35s ease;}
.tt-moon{opacity:0;transform:rotate(-50deg) scale(.5);}
html[data-theme="dark"] .tt-track{background:#232860;border-color:#3b4187;box-shadow:inset 0 1px 3px rgba(0,0,0,.35);}
html[data-theme="dark"] .theme-toggle:hover .tt-track{border-color:#6a71d6;}
html[data-theme="dark"] .tt-knob{transform:translateX(24px);background:#0b0d1a;color:#c8f04a;box-shadow:0 2px 8px rgba(0,0,0,.55);}
html[data-theme="dark"] .tt-sun{opacity:0;transform:rotate(50deg) scale(.5);}
html[data-theme="dark"] .tt-moon{opacity:1;transform:none;}

/* light mode: phone menu links were light-on-white — make them readable */
@media (max-width:980px){
  .mobile-panel .mega-col a{color:var(--ink);}
  .mobile-panel .mega-col a:hover{background:rgba(91,93,247,.08);}
  .mobile-panel .mega-col h4{color:var(--muted);}
  html .mobile-panel .mega-col{border-bottom-color:var(--line) !important;}
}

/* ---------- DARK THEME ---------- */
html[data-theme="dark"]{
  --bg:#0b0d1a;--bg-soft:#12162b;--ink:#eef0fb;--ink-soft:#a9afc8;--muted:#8b91ac;--line:#262c4d;
  --shadow:0 18px 50px rgba(0,0,0,.45);--shadow-lg:0 30px 80px rgba(0,0,0,.55);
}
html[data-theme="dark"] body{background:radial-gradient(circle at 8% 8%,rgba(91,93,247,.18),transparent 26rem),radial-gradient(circle at 92% 18%,rgba(200,240,74,.06),transparent 24rem),var(--bg);}

/* header + nav */
html[data-theme="dark"] header{background:rgba(11,13,26,.82);border-bottom-color:rgba(255,255,255,.08);box-shadow:0 6px 28px rgba(0,0,0,.35);}
html[data-theme="dark"] .logo,html[data-theme="dark"] .logo:hover{color:#f2f3fb;}
html[data-theme="dark"] .logo-suffix{color:#8f91ff;}
html[data-theme="dark"] .nav-trigger,html[data-theme="dark"] .plain-link{color:#c9cde3 !important;}
html[data-theme="dark"] .nav-trigger svg{color:#8b91ac;}
html[data-theme="dark"] .nav-trigger:hover,html[data-theme="dark"] .nav-trigger.active,html[data-theme="dark"] .plain-link:hover{background:rgba(143,145,255,.14) !important;color:#fff !important;}
html[data-theme="dark"] .nav-trigger:hover svg,html[data-theme="dark"] .nav-trigger.active svg{color:#fff;}
html[data-theme="dark"] .burger{color:#eef0fb;}
html[data-theme="dark"] .burger:hover{background:rgba(255,255,255,.08);}

/* mega menu */
html[data-theme="dark"] .mega{background:rgba(17,20,40,.98);border-color:rgba(255,255,255,.09);box-shadow:0 28px 80px rgba(0,0,0,.6),0 8px 24px rgba(0,0,0,.4);}
html[data-theme="dark"] .mega-col{border-right-color:rgba(255,255,255,.08);}
html[data-theme="dark"] .mega-col h4{color:#8b91ac;}
html[data-theme="dark"] .mega-col a{color:#e4e7f6;}
html[data-theme="dark"] .mega-col a .icon{color:#9fa1ff;}
html[data-theme="dark"] .mega-col a:hover{background:rgba(143,145,255,.12);}
html[data-theme="dark"] .mega-feature{background:linear-gradient(145deg,#232866 0%,#171a44 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 1px rgba(143,145,255,.18);}

/* phone menu */
html[data-theme="dark"] .mobile-panel{background:#0f1226;border-top-color:rgba(255,255,255,.08);box-shadow:0 20px 40px rgba(0,0,0,.5);}
html[data-theme="dark"] .mobile-panel .mega-col a{color:#e4e7f6;}
html[data-theme="dark"] .mobile-panel .mega-col a:hover{background:rgba(143,145,255,.12);}
html[data-theme="dark"] .mobile-panel .mega-col h4{color:#8b91ac;}
html[data-theme="dark"] .mobile-panel .mega-col{border-bottom-color:rgba(255,255,255,.07) !important;}

/* hero */
html[data-theme="dark"] .hero{background:radial-gradient(120% 100% at 50% -10%,#1a1f45 0%,#10132a 48%,#0b0d1a 80%);}
html[data-theme="dark"] .hero h1 span{background:linear-gradient(100deg,#9a9cff 0%,#b8a2ff 55%,#8f91ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
html[data-theme="dark"] .eyebrow-free{background:#161a2e;border-color:#262c4d;color:#c1c6dc;box-shadow:0 8px 25px rgba(0,0,0,.3);}
html[data-theme="dark"] .hero p.lead{color:#a9afc8;}
html[data-theme="dark"] .hero-usecases span{background:#161a2e;border-color:#262c4d;color:#c1c6dc;box-shadow:0 5px 18px rgba(0,0,0,.25);}
html[data-theme="dark"] .btn-secondary{background:#161a2e;border-color:#2c3255;color:var(--ink);box-shadow:0 8px 20px rgba(0,0,0,.3);}
html[data-theme="dark"] .btn-secondary:hover{border-color:#6a71d6;}
html[data-theme="dark"] .hf-card{box-shadow:0 20px 45px rgba(0,0,0,.4);}
html[data-theme="dark"] .hf-light{background:#161a2e;border-color:#262c4d;}
html[data-theme="dark"] .hf-dark{border:1px solid rgba(255,255,255,.08);}
html[data-theme="dark"] .hf-tag{background:#232860;color:#b1b3ff;}
html[data-theme="dark"] .hf-headline{color:#f2f3fb;}
html[data-theme="dark"] .hf-sub{color:#a9afc8;}
html[data-theme="dark"] .hf-go{color:#9fa1ff;}

/* section headings */
html[data-theme="dark"] .block-head .kicker{color:#9fa1ff;}
html[data-theme="dark"] .block-head p{color:#a9afc8;}

/* tool cards — same four category hues, deepened */
html[data-theme="dark"] .tool-card{background:#171b3a !important;border-color:rgba(143,145,255,.2);box-shadow:0 10px 28px rgba(0,0,0,.35);}
html[data-theme="dark"] .tool-card[data-cat="Health"]{background:#2a1420 !important;border-color:rgba(255,138,160,.2);}
html[data-theme="dark"] .tool-card[data-cat="Math & data"]{background:#16261a !important;border-color:rgba(166,214,90,.2);}
html[data-theme="dark"] .tool-card[data-cat="Everyday"]{background:#10233a !important;border-color:rgba(98,195,240,.2);}
html[data-theme="dark"] .tool-card:hover{border-color:rgba(255,255,255,.3);box-shadow:0 22px 50px rgba(0,0,0,.55);}
html[data-theme="dark"] .tool-card h3{color:#f2f3fb;}
html[data-theme="dark"] .tool-card p{color:#b0b6cf;}
html[data-theme="dark"] .tool-number{color:#8d93b0;}
html[data-theme="dark"] .tool-arrow{background:rgba(255,255,255,.08) !important;color:#b0b6cf;}
html[data-theme="dark"] .tool-card:hover .tool-arrow{background:#c8f04a !important;color:#171a30;}
html[data-theme="dark"] .tool-card .ti{background:rgba(255,255,255,.08) !important;color:#a4a6ff;box-shadow:none;}
html[data-theme="dark"] .tool-card[data-cat="Health"] .ti{color:#ff8aa0;}
html[data-theme="dark"] .tool-card[data-cat="Math & data"] .ti{color:#a6d65a;}
html[data-theme="dark"] .tool-card[data-cat="Everyday"] .ti{color:#62c3f0;}
html[data-theme="dark"] .tool-card .cat{background:rgba(255,255,255,.08) !important;color:#b0b6cf;}
html[data-theme="dark"] .tool-card .formula{background:rgba(255,255,255,.07) !important;border-color:rgba(255,255,255,.12) !important;color:#e2e5f4 !important;}
html[data-theme="dark"] .open-tool{color:#a4a6ff;}

/* calculator panels */
html[data-theme="dark"] .calc-panel{background:rgba(21,25,49,.92);border-color:#262c4d;box-shadow:0 10px 34px rgba(0,0,0,.35);}
html[data-theme="dark"] .calc-panel:hover{border-color:#3b4280;box-shadow:0 18px 45px rgba(0,0,0,.5);}
html[data-theme="dark"] .calc-panel-head .ti{background:#5b5df7;color:#fff;}
html[data-theme="dark"] .calc-panel-head p{color:#a9afc8;}
html[data-theme="dark"] .field label{color:#a9afc8;}
html[data-theme="dark"] .field input,html[data-theme="dark"] .field select,html[data-theme="dark"] .gpa-row input,html[data-theme="dark"] .gpa-row select{background:#0f1326;border-color:#2b3150;color:#eef0fb;}
html[data-theme="dark"] .field input:hover,html[data-theme="dark"] .field select:hover,html[data-theme="dark"] .gpa-row input:hover,html[data-theme="dark"] .gpa-row select:hover{border-color:#3d4470;}
html[data-theme="dark"] .field input:focus,html[data-theme="dark"] .field select:focus,html[data-theme="dark"] .gpa-row input:focus,html[data-theme="dark"] .gpa-row select:focus{border-color:#7f82ff;box-shadow:0 0 0 4px rgba(127,130,255,.18);outline:none;}
html[data-theme="dark"] input::placeholder{color:#6d7492;}
html[data-theme="dark"] option{background:#0f1326;color:#eef0fb;}
html[data-theme="dark"] .seg{background:#0f1326;border-color:#2b3150;}
html[data-theme="dark"] .seg button{color:#a9afc8;}
html[data-theme="dark"] .seg button:hover{color:#fff;}
html[data-theme="dark"] .seg button.active{background:#5b5df7;color:#fff;box-shadow:0 4px 14px rgba(91,93,247,.4);}
html[data-theme="dark"] .result-box{background:linear-gradient(135deg,#1b2044,#141830);border-color:#2b3260;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);}
html[data-theme="dark"] .result-box .r-row + .r-row{border-top-color:rgba(255,255,255,.14);}
html[data-theme="dark"] .result-box .r-label{color:#a9afc8;}
html[data-theme="dark"] .result-box .r-value{color:#f2f3fb;}
html[data-theme="dark"] .result-box .r-value.big{color:#b1b3ff;}
html[data-theme="dark"] .how-to{background:#12162b;color:#a9afc8;border-left-color:#c8f04a;}
html[data-theme="dark"] .how-to strong{color:#eef0fb;}
html[data-theme="dark"] .result-note{color:#8b91ac;}
html[data-theme="dark"] .add-row-btn{background:transparent;border-color:#3a4180;color:#a4a6ff;}
html[data-theme="dark"] .add-row-btn:hover{background:#1b2044;border-color:#7f82ff;}

/* why-us cards */
html[data-theme="dark"] .trio .card,html[data-theme="dark"] .trio .card:hover{background:#151931 !important;color:var(--ink) !important;border-color:rgba(255,255,255,.08) !important;box-shadow:0 12px 34px rgba(0,0,0,.4) !important;}
html[data-theme="dark"] .trio .card:hover{border-color:rgba(143,145,255,.35) !important;}
html[data-theme="dark"] .trio .card h3{color:#f2f3fb !important;}
html[data-theme="dark"] .trio .card p{color:#a9afc8 !important;}
html[data-theme="dark"] .trio .card .ti{background:#232860 !important;color:#b1b3ff !important;}

/* FAQ */
html[data-theme="dark"] #faq .faq-item{background:#151931;border-color:rgba(255,255,255,.08);box-shadow:0 7px 24px rgba(0,0,0,.3);}
html[data-theme="dark"] #faq .faq-item:hover{border-color:rgba(143,145,255,.3);box-shadow:0 12px 30px rgba(0,0,0,.4);}
html[data-theme="dark"] #faq .faq-item[open]{border-color:#4a50c9;box-shadow:0 12px 30px rgba(91,93,247,.18);}
html[data-theme="dark"] .faq-item p{color:#a9afc8;}
html[data-theme="dark"] #faq .faq-icon{background:#232860;color:#b1b3ff;}
html[data-theme="dark"] #faq .faq-item[open] .faq-icon{background:#5b5df7;color:#fff;}

/* "Important" notice keeps its warm amber identity */
html[data-theme="dark"] .trust-note{background:#211d10 !important;color:#cfc9b0 !important;border-color:#4a3f17 !important;border-left-color:#d6b84b !important;box-shadow:0 8px 24px rgba(0,0,0,.35) !important;}
html[data-theme="dark"] .trust-note strong{color:#f3e9b5 !important;}
html[data-theme="dark"] .trust-note .marquee-track span:before{background:#4a3f17;color:#f3e7a8;}

/* footer */
html[data-theme="dark"] footer{background:#080a15;border-top-color:rgba(255,255,255,.07);}

/* information pages (About, Contact, Privacy, Terms, ...) */
html[data-theme="dark"] .page-head{border:1px solid rgba(255,255,255,.07);}
html[data-theme="dark"] .static-content{background:rgba(20,24,48,.92);border-color:#262c4d;box-shadow:0 18px 50px rgba(0,0,0,.4);}
html[data-theme="dark"] .static-content p,html[data-theme="dark"] .static-content li,html[data-theme="dark"] .static-content ul{color:#a9afc8;}
html[data-theme="dark"] .inline-link,html[data-theme="dark"] .static-content a.inline-link{color:#a4a6ff;text-decoration-color:#c8f04a;}
html[data-theme="dark"] .inline-link:hover{color:#d0d1ff;}
html[data-theme="dark"] .contact-card{background:#151931;border-color:#262c4d;box-shadow:0 12px 28px rgba(0,0,0,.4);}
html[data-theme="dark"] .contact-card .ti{background:#5b5df7;color:#fff;}
html[data-theme="dark"] .contact-card p{color:#a9afc8;}

/* 404 */
html[data-theme="dark"] .not-found-card{background:#151931;border-color:#262c4d;box-shadow:0 20px 50px rgba(0,0,0,.45);}
html[data-theme="dark"] .not-found-code{color:#b1b3ff;background:#232860;}
html[data-theme="dark"] .not-found-tools a{background:#12162b;color:#b3b9d3;border-color:#262c4d;}
html[data-theme="dark"] .not-found-tools a:hover{border-color:#7f82ff;color:#fff;}
html[data-theme="dark"] .nf-ring{border-color:#2f3564;}
html[data-theme="dark"] .nf-illustration-light{display:none;}
html[data-theme="dark"] .nf-illustration-dark{display:block;}

/* =========================================================
   MOBILE — formulas always visible, single-column cards
   ========================================================= */
@media (max-width:640px){
  .tool-grid{grid-template-columns:1fr !important;gap:12px !important;}
  .tool-card{min-height:0 !important;padding:18px !important;border-radius:18px !important;}
  .tool-card p{display:block !important;min-height:0 !important;font-size:13px !important;margin-bottom:10px;}
  .tool-card .formula{display:block !important;max-width:100% !important;width:100% !important;font-size:12px !important;line-height:1.5 !important;white-space:normal !important;overflow-wrap:anywhere;word-break:break-word;margin:0 0 12px !important;}
  .tool-card h3{font-size:17px !important;padding-right:30px;}
  .open-tool{font-size:11px !important;}
  .tool-number{font-size:10px !important;}
}
html,body{overflow-x:hidden;}
img,svg{max-width:100%;}