:root {
  --ink: #0a0d0c;
  --paper: #f4f2ea;
  --paper-2: #eae7dc;
  --lime: #d9ff4f;
  --orange: #ff7657;
  --muted: #74776f;
  --line: rgba(10,13,12,.16);
  --radius: 20px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; line-height: 1.55; }
body::before { content:""; position: fixed; inset: 0; pointer-events:none; background: linear-gradient(rgba(10,13,12,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(10,13,12,.025) 1px, transparent 1px); background-size: 28px 28px; z-index:-1; }
.noise { position: fixed; inset:0; opacity:.035; pointer-events:none; z-index:20; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
a { color: inherit; }
.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.site-header { width:min(1280px,calc(100% - 32px)); margin:16px auto 0; height:72px; padding:0 24px; border:1px solid var(--line); border-radius:16px; display:flex; align-items:center; justify-content:space-between; background:rgba(244,242,234,.88); backdrop-filter:blur(14px); position:sticky; top:14px; z-index:10; }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; font-family:Manrope,sans-serif; font-size:18px; font-weight:800; letter-spacing:-.5px; }
.brand-mark { width:25px; height:25px; display:flex; gap:3px; align-items:flex-end; padding:4px; border-radius:6px; background:var(--ink); transform:rotate(-2deg); }
.brand-mark i { display:block; flex:1; background:var(--lime); border-radius:1px; }
.brand-mark i:nth-child(1){height:40%}.brand-mark i:nth-child(2){height:72%}.brand-mark i:nth-child(3){height:100%}
nav { display:flex; gap:30px; }
nav a { color:#4e514c; text-decoration:none; font-size:14px; font-weight:600; }
nav a:hover { color:var(--ink); }
.header-cta { text-decoration:none; font-size:14px; font-weight:700; border-bottom:1px solid var(--ink); padding-bottom:3px; }

.hero { min-height:720px; display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:64px; padding-block:90px 80px; }
.eyebrow { margin:0 0 20px; display:flex; align-items:center; gap:10px; color:#5c6058; text-transform:uppercase; letter-spacing:1.8px; font:700 11px/1.2 Manrope,sans-serif; }
.eyebrow span { width:8px; height:8px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 4px rgba(255,118,87,.14); }
h1,h2,h3 { font-family:Manrope,sans-serif; margin:0; letter-spacing:-.045em; }
h1 { font-size:clamp(55px,6vw,86px); line-height:.96; max-width:760px; }
h1 em { color:transparent; -webkit-text-stroke:1.5px var(--ink); font-style:normal; }
.hero-lede { max-width:610px; font-size:19px; color:#5d615a; margin:28px 0 34px; }
.hero-actions { display:flex; align-items:center; gap:24px; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; min-height:54px; padding:0 22px; border-radius:10px; text-decoration:none; font-family:Manrope,sans-serif; font-weight:700; transition:.2s ease; }
.button:hover { transform:translateY(-2px); }
.button.primary { background:var(--ink); color:white; box-shadow:6px 6px 0 var(--lime); }
.button span { font-size:20px; }
.text-link { font-weight:700; font-size:14px; text-underline-offset:5px; }
.trust-row { display:flex; gap:24px; margin-top:62px; padding-top:18px; border-top:1px solid var(--line); color:#696c66; font-size:12px; text-transform:uppercase; letter-spacing:.7px; }
.trust-row b { color:var(--orange); margin-right:6px; }
.hero-visual { min-width:0; position:relative; }
.signal-card { background:var(--ink); color:white; border-radius:28px; padding:28px; box-shadow:22px 26px 0 #dfddd2; transform:rotate(1.2deg); }
.signal-top,.result-heading,.form-heading,.display-top { display:flex; align-items:center; justify-content:space-between; font:700 10px/1 Manrope,sans-serif; letter-spacing:1.3px; }
.live-dot { color:var(--lime); }
.live-dot::before { content:""; display:inline-block; width:6px;height:6px;background:var(--lime);border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px rgba(217,255,79,.12); }
.signal-number { font:700 clamp(48px,5vw,72px)/1 Manrope,sans-serif; letter-spacing:-.06em; margin-top:48px; }
.signal-number small { font-size:18px; color:#858a82; letter-spacing:-.02em; }
.signal-label { color:#8d918a; font-size:13px; margin-top:8px; }
.signal-chart { width:100%; height:auto; margin-top:24px; overflow:visible; }
.grid-line { stroke:#252b28; stroke-width:1; }.area{fill:url(#area)}.line{fill:none;stroke:var(--lime);stroke-width:3}.signal-chart circle{fill:var(--ink);stroke:var(--lime);stroke-width:3}
.cost-legend { display:flex; gap:18px; font-size:11px; color:#a5aaa2; }
.cost-legend i { display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; }.cost-legend .lime{background:var(--lime)}.cost-legend .orange{background:var(--orange)}.cost-legend .white{background:white}
.float-note { position:absolute; background:white; border:1px solid var(--line); padding:13px 16px; border-radius:11px; box-shadow:0 12px 30px rgba(10,13,12,.1); display:flex; flex-direction:column; font-size:11px; }
.float-note strong { font:700 13px Manrope,sans-serif; }.float-note span{color:var(--muted)}
.note-one { left:-32px; bottom:74px; transform:rotate(-3deg); }.note-two{right:-20px;top:90px;transform:rotate(4deg)}

.problem-strip { background:var(--lime); border-block:1px solid var(--ink); }
.strip-inner { min-height:104px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.strip-inner>p { font:800 14px Manrope,sans-serif; text-transform:uppercase; }
.loss-chain { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:14px; font-weight:600; }
.loss-chain b{color:#828e40}.loss-chain .highlight{background:var(--ink);color:white;padding:8px 12px;border-radius:6px}

.calculator-section { padding-block:120px; }
.section-intro { max-width:690px; margin-bottom:46px; }
.section-intro h2 { font-size:clamp(40px,5vw,68px); line-height:1.02; }
.section-intro>p:last-child { color:var(--muted); font-size:17px; max-width:550px; }
.calculator-grid { display:grid; grid-template-columns:1.05fr .95fr; border:1px solid var(--ink); border-radius:24px; overflow:hidden; box-shadow:12px 14px 0 var(--paper-2); }
.calculator-panel { background:#fffef9; padding:34px; }
.form-heading { border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:26px; }
.currency-label { display:flex; align-items:center; gap:8px; color:var(--muted); }
select { background:transparent; border:0; font:700 11px Manrope,sans-serif; color:var(--ink); }
.field { display:block; margin-bottom:20px; }
.field>span:first-child { display:block; margin-bottom:8px; font-size:12px; font-weight:700; color:#5f635c; }
.field-pair { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.input-wrap { display:flex; align-items:center; height:58px; border:1px solid var(--line); border-radius:9px; background:var(--paper); padding:0 16px; transition:.2s; }
.input-wrap:focus-within { border-color:var(--ink); box-shadow:0 0 0 3px rgba(217,255,79,.45); }
.input-wrap b { font:700 17px Manrope,sans-serif; }
.input-wrap input { width:100%; min-width:0; border:0; outline:0; background:transparent; font:700 21px Manrope,sans-serif; padding:0 7px; color:var(--ink); }
.input-wrap.suffix input { padding-left:0; }
input::-webkit-inner-spin-button { appearance:none; }
.tip { width:18px;height:18px;border-radius:50%;border:1px solid #aaa;background:transparent;font-size:11px;cursor:help;position:relative; }
.tip:hover::after,.tip:focus::after { content:attr(data-tip); position:absolute; left:24px; bottom:0; width:220px; background:var(--ink); color:white; padding:9px; border-radius:7px; z-index:3; text-align:left; }
.reset-button { border:0; background:transparent; text-decoration:underline; text-underline-offset:3px; color:var(--muted); cursor:pointer; padding:0; }
.result-panel { background:var(--ink); color:white; padding:34px; display:flex; flex-direction:column; }
.result-badge { color:var(--lime); border:1px solid #3d443d; border-radius:30px; padding:7px 10px; }
.total { font:800 clamp(54px,6vw,82px)/1 Manrope,sans-serif; color:var(--lime); letter-spacing:-.06em; margin-top:54px; overflow-wrap:anywhere; }
.total-caption { max-width:420px; color:#a3a7a0; margin:12px 0 34px; }
.result-breakdown { border-top:1px solid #2c322f; }
.result-breakdown div,.monthly-signal div { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid #2c322f; }
.result-breakdown span,.monthly-signal span { color:#969b94; font-size:13px; }.result-breakdown strong,.monthly-signal strong{font:700 15px Manrope,sans-serif;text-align:right}
.monthly-signal { display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:16px 0 28px; }.monthly-signal div{display:block}.monthly-signal strong{display:block;margin-top:4px;text-align:left}
.result-cta { background:var(--lime); color:var(--ink); margin-top:auto; }
.privacy-note { font-size:10px; color:#727770; text-align:center; }
.method-note { margin-top:28px; display:grid; grid-template-columns:180px 1fr; gap:20px; padding:24px 28px; border-left:4px solid var(--orange); background:rgba(255,255,255,.5); }
.method-note p{margin:0;color:#666a63}

.cost-stack { background:var(--ink); color:white; padding-block:110px; }
.section-intro.light .eyebrow{color:#aeb3aa}.section-intro.light h2{max-width:850px}
.cost-cards { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #303632; border-radius:20px; overflow:hidden; }
.cost-cards article { padding:32px; min-height:330px; border-right:1px solid #303632; position:relative; transition:.25s; }.cost-cards article:last-child{border:0}.cost-cards article:hover{background:#111613;transform:translateY(-4px)}
.card-index{position:absolute;right:24px;top:22px;color:#666c65;font:700 11px Manrope,sans-serif}.icon-box{width:52px;height:52px;border:1px solid #414841;border-radius:12px;display:grid;place-items:center;color:var(--lime);font-size:24px;margin-bottom:54px}.cost-cards h3{font-size:25px}.cost-cards p{color:#969c94;font-size:14px}

.playbook { padding-block:120px; }
.playbook-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.steps{border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:52px 1fr;gap:10px;padding:25px 12px;border-bottom:1px solid var(--line);cursor:pointer;transition:.2s}.step:hover,.step.active{background:#fffdf5;padding-left:18px}.step>span{font:800 12px Manrope,sans-serif;color:var(--orange)}.step h3{font-size:19px}.step p{margin:6px 0 0;color:var(--muted);font-size:13px;max-width:480px}
.playbook-display{background:var(--lime);border:1px solid var(--ink);border-radius:22px;padding:32px;min-height:470px;display:flex;flex-direction:column;box-shadow:10px 11px 0 var(--ink)}
.display-ring{margin:42px 0 28px;width:124px;height:124px;border:1px solid rgba(10,13,12,.35);border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 14px rgba(255,255,255,.2)}.display-ring span{font:800 46px Manrope,sans-serif}.playbook-display h3{font-size:32px}.playbook-display p{max-width:460px;margin-top:12px}.display-meter{display:flex;gap:5px;margin-top:auto}.display-meter i{height:5px;flex:1;background:rgba(10,13,12,.18)}.display-meter i:first-child{background:var(--ink)}

.comparison { padding-bottom:120px; }.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fffdf7}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:22px 24px;border-bottom:1px solid var(--line)}th{font:700 10px Manrope,sans-serif;letter-spacing:1.2px;color:var(--muted);text-transform:uppercase}td{font-size:14px}td strong{font:700 15px Manrope,sans-serif}td small{display:block;color:var(--muted);margin-top:4px}.featured{background:rgba(217,255,79,.18)}.pill{display:inline-block;padding:5px 10px;border-radius:20px;font-size:11px;font-weight:700}.pill.high{background:#ffe1d9;color:#8d321f}.pill.medium{background:#fff1c8;color:#795b00}.pill.low{background:#e8f7b7;color:#405500}.comparison-note{font-size:11px;color:var(--muted);margin-top:14px}

.faq { padding-bottom:120px; }.faq-list{border-top:1px solid var(--ink)}details{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;padding:24px 4px;font:700 18px Manrope,sans-serif;display:flex;justify-content:space-between;gap:20px}summary::-webkit-details-marker{display:none}summary span{transition:.2s}details[open] summary span{transform:rotate(45deg)}details p{max-width:820px;color:var(--muted);margin:0 0 26px 4px}
.final-cta{background:var(--orange);border-block:1px solid var(--ink);padding-block:78px}.cta-inner{display:grid;grid-template-columns:1fr .7fr;gap:80px;align-items:end}.cta-inner h2{font-size:clamp(42px,5vw,67px);max-width:650px}.cta-copy p{font-size:17px;margin:0 0 28px}.cta-copy .button{background:var(--ink);color:white;box-shadow:6px 6px 0 white}
footer{background:var(--ink);color:white;padding:40px 0}.footer-inner{display:grid;grid-template-columns:1fr 1.2fr 1.5fr auto;gap:32px;align-items:center}.footer-inner p,.footer-inner>span{color:#8d928b;font-size:11px;margin:0}.disclosure{line-height:1.5}

@media(max-width:900px){
  nav{display:none}.hero{grid-template-columns:1fr;padding-top:72px}.hero-copy{max-width:720px}.hero-visual{max-width:650px}.calculator-grid,.playbook-grid,.cta-inner{grid-template-columns:1fr}.cost-cards{grid-template-columns:1fr}.cost-cards article{border-right:0;border-bottom:1px solid #303632;min-height:270px}.footer-inner{grid-template-columns:1fr 1fr}.strip-inner{align-items:flex-start;flex-direction:column;padding-block:26px}.loss-chain{justify-content:flex-start}.method-note{grid-template-columns:1fr}.cta-copy{max-width:600px}
}
@media(max-width:600px){
  .shell{width:min(100% - 24px,1180px)}.site-header{width:calc(100% - 20px);padding:0 15px;height:64px;top:8px}.header-cta{font-size:0}.header-cta span{font-size:22px}.hero{padding-block:58px}.hero-actions{align-items:flex-start;flex-direction:column}.trust-row{display:grid;gap:9px;margin-top:45px}.signal-card{padding:20px}.note-one{left:-3px;bottom:55px}.note-two{right:-3px;top:75px}.loss-chain{font-size:13px}.calculator-section,.playbook{padding-block:80px}.calculator-panel,.result-panel{padding:24px 20px}.field-pair{grid-template-columns:1fr;gap:0}.monthly-signal{grid-template-columns:1fr}.cost-stack{padding-block:80px}.playbook-display{min-height:420px}.footer-inner{grid-template-columns:1fr}.float-note{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
