:root{
  --premium-night:#0a2115;
  --premium-deep:#103b25;
  --premium-lime:#b9db6b;
  --premium-glow:rgba(185,219,107,.24);
}

body{
  background:
    radial-gradient(circle at 92% 8%,color-mix(in srgb,var(--green) 12%,transparent),transparent 34rem),
    linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 34%,var(--bg)) 0,var(--bg) 25rem);
}

.site-header{border-bottom:0;box-shadow:0 1px 0 var(--line)}
.site-header .header-inner{width:min(1360px,calc(100% - 2rem))}
.header-inner{min-height:70px}
.brand,.brand-copy strong,.main-nav>a,.nav-group>button{white-space:nowrap}
.brand img{width:42px;height:42px;padding:8px;border-radius:13px;background:linear-gradient(145deg,var(--green),var(--green-2));box-shadow:0 8px 24px rgba(16,72,42,.22)}
.brand-copy strong{font-weight:850}
.header-search{background:color-mix(in srgb,var(--surface) 96%,transparent)}

.trust-strip{border-top:1px solid color-mix(in srgb,var(--line) 76%,transparent);background:color-mix(in srgb,var(--surface-2) 82%,var(--surface))}
.trust-strip-inner{min-height:34px;display:flex;gap:1.3rem;align-items:center;justify-content:center;color:var(--muted);font-size:.72rem;font-weight:760;letter-spacing:.01em;scrollbar-width:none}
.trust-strip-inner::-webkit-scrollbar{display:none}
.trust-strip-inner span{display:inline-flex;align-items:center;gap:.4rem}
.trust-strip-inner span::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)}

.page-hero{position:relative;overflow:hidden;padding:clamp(2.8rem,6vw,5.5rem) 0 clamp(2.2rem,4vw,3.2rem);border-bottom:0;background:linear-gradient(135deg,var(--premium-night),var(--premium-deep) 60%,#17583a);color:#fff}
.page-hero::before{content:"";position:absolute;width:36rem;height:36rem;border-radius:999px;right:-12rem;top:-20rem;background:radial-gradient(circle,var(--premium-glow),transparent 68%)}
.page-hero::after{content:"";position:absolute;inset:auto 0 0;height:80px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.08));pointer-events:none}
.page-hero .shell{position:relative;z-index:1}
.page-hero .breadcrumbs{color:#bcd0c3}
.page-hero .breadcrumbs a{color:#d9f2df}
.page-hero .eyebrow{color:#b9db6b}
.page-hero h1{max-width:16ch;text-wrap:balance}
.page-hero .lead{color:#d7e4da;max-width:64ch;line-height:1.68}
.page-hero-grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);align-items:center}
.page-hero-copy{max-width:820px}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.35rem}
.page-hero .hero-actions .button-primary{background:var(--premium-lime);color:#17351f;box-shadow:0 10px 28px rgba(0,0,0,.22)}
.page-hero .hero-actions .button-ghost{color:#fff;border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.07)}
.hero-proof{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}
.hero-proof span{font-size:.74rem;font-weight:760;color:#dbe9de;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);padding:.38rem .58rem;border-radius:999px}
.hero-meta{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.15);box-shadow:0 22px 60px rgba(0,0,0,.2);backdrop-filter:blur(12px)}
.hero-meta div{padding:.7rem;border-radius:12px;background:rgba(255,255,255,.04)}
.hero-meta span{color:#a9c2b1}.hero-meta strong{color:#fff}
.hero-project-preview{padding:1.15rem;border:1px solid rgba(255,255,255,.22);border-radius:22px;background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.06));box-shadow:0 24px 65px rgba(0,0,0,.22);backdrop-filter:blur(12px);color:#fff}
.preview-kicker{display:flex;justify-content:space-between;gap:.5rem;color:#c6e5cc;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.preview-kicker span:last-child{text-align:right;color:#bed7bf}
.hero-project-preview h2{font-size:1.45rem;letter-spacing:-.035em;margin:1.15rem 0 .2rem}.hero-project-preview>p{font-size:.78rem;line-height:1.4;color:#d4e5d8;margin:0 0 1rem}
.preview-stack{display:grid;gap:.25rem;transform:skewY(-4deg);margin:1.3rem .35rem 1.5rem;filter:drop-shadow(0 12px 13px rgba(0,0,0,.22))}.preview-stack>div{display:flex;justify-content:space-between;gap:.5rem;padding:.8rem .9rem;font-size:.78rem;font-weight:750}.preview-stack b{white-space:nowrap}.preview-surface{background:linear-gradient(110deg,#bdc6bd,#e2e6dc);color:#27402d;border:1px solid #f0f5eb;border-radius:9px 9px 3px 3px}.preview-base{background:linear-gradient(110deg,#b5ca94,#d0dcab);color:#294329;border:1px solid #e5efc3;border-radius:3px 3px 9px 9px;min-height:64px;align-items:center}
.preview-order{border-top:1px solid rgba(255,255,255,.18);padding-top:.45rem}.preview-order>div{display:flex;justify-content:space-between;gap:.5rem;padding:.34rem 0;font-size:.82rem}.preview-order strong{font-size:1.05rem}
.hero-project-preview>a{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-top:.7rem;padding:.7rem .8rem;border-radius:10px;background:#cbe981;color:#19331f;text-decoration:none;font-weight:850;font-size:.82rem}.hero-project-preview>a:hover{background:#e1f3ae}

.calculator-shell{padding-top:clamp(2rem,4vw,3.2rem)}
.calculator-shell>.section-heading{margin-bottom:1rem}
.calculator-shell>.section-heading h2{font-size:clamp(2rem,4vw,3.1rem)}
.quick-projects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin:0 0 1.15rem}
.quick-project{position:relative;text-align:left;border:1px solid var(--line);border-radius:16px;padding:.9rem 1rem;background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 44%,var(--surface)));color:var(--ink);box-shadow:var(--shadow-sm);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.quick-project::after{content:"→";position:absolute;right:.9rem;top:.85rem;color:var(--green);font-weight:900}
.quick-project span{display:block;font-weight:840;padding-right:1.4rem}.quick-project small{display:block;color:var(--muted);margin-top:.18rem;line-height:1.35}
.quick-project:hover,.quick-project:focus-visible,.quick-project.is-active{transform:translateY(-2px);border-color:color-mix(in srgb,var(--green) 48%,var(--line));box-shadow:0 12px 32px rgba(16,72,42,.11)}

.calculator-grid{grid-template-columns:minmax(0,1.45fr) minmax(340px,.72fr);gap:1.35rem}
.calculator-card{padding:clamp(1.15rem,3vw,1.7rem);border-radius:22px;box-shadow:0 18px 50px rgba(20,62,37,.07)}
.step-card{padding:1.25rem 0 1.45rem}
.step-title>span{width:34px;height:34px;flex-basis:34px;border-radius:11px;background:linear-gradient(145deg,var(--green),var(--green-2));color:#fff;box-shadow:0 8px 18px rgba(23,95,56,.18)}
.step-title h3{font-size:1.12rem;letter-spacing:-.015em}
.field input,.field select,.converter-row input,.search-field input{min-height:50px;border-radius:13px;border-color:color-mix(in srgb,var(--line) 88%,var(--green));background:color-mix(in srgb,var(--surface) 96%,var(--surface-2))}
.depth-chips button{padding:.5rem .78rem;background:var(--surface);transition:.18s}
.depth-chips button:hover{border-color:var(--green);color:var(--green);transform:translateY(-1px)}
.advanced-card{border-radius:16px;overflow:hidden}
.advanced-card summary{padding:1rem 1.05rem}
.button-large{min-height:56px;border-radius:14px;font-size:1rem}

.results-column{top:118px;gap:.85rem}
.result-card{border-radius:20px;padding:1.05rem 1.15rem}
.result-primary{position:relative;overflow:hidden;background:linear-gradient(150deg,#0d2b1a 0,#164d2f 62%,#1f6b41 100%);box-shadow:0 24px 54px rgba(13,43,26,.22)}
.result-primary::after{content:"";position:absolute;width:12rem;height:12rem;border-radius:999px;right:-6rem;top:-6rem;background:radial-gradient(circle,rgba(185,219,107,.22),transparent 67%);pointer-events:none}
.result-kicker{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:1rem}.result-kicker .eyebrow{margin:0}.result-kicker>span{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#d6efdc;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:999px;padding:.34rem .48rem}
.result-number{position:relative;z-index:1;margin:.55rem 0 .35rem}.result-number strong{font-size:clamp(3.2rem,7vw,5.2rem)}
.result-equivalent{position:relative;z-index:1;margin:.9rem 0 0;padding:.72rem .8rem;border-radius:13px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#eef7f0;font-size:.83rem;font-weight:700}
.result-context{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:.45rem;margin:.7rem 0 1rem}.result-context span{padding:.35rem .5rem;border-radius:999px;background:rgba(0,0,0,.15);color:#dcebe0;font-size:.7rem;font-weight:700}
.metric{border-radius:16px;padding:.95rem;box-shadow:none}.metric strong{font-size:1.48rem}

.article-section{border-radius:20px;box-shadow:0 12px 34px rgba(20,62,37,.055)}
.article-section h2{font-size:clamp(1.55rem,2.6vw,2.15rem)}
.topic-card{position:relative;overflow:hidden;border-radius:16px;padding:1.05rem;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.topic-card::after{content:"→";position:absolute;right:.85rem;bottom:.7rem;color:var(--green);font-weight:900;opacity:.7}
.topic-card:hover,.topic-card:focus-visible{transform:translateY(-3px);box-shadow:0 14px 32px rgba(20,62,37,.09)}
.aside-card{border-radius:18px}
.faq-item{border-radius:16px}.faq-item[open]{border-color:color-mix(in srgb,var(--green) 30%,var(--line));background:color-mix(in srgb,var(--green-soft) 38%,var(--surface))}

.site-footer{margin-top:3rem;background:linear-gradient(145deg,#0a2115,#102d1c)}
.footer-inner{padding:3.2rem 0}

@media(max-width:980px){
  .trust-strip-inner{justify-content:flex-start;overflow:auto;padding:.45rem 0;white-space:nowrap}
  .quick-projects{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:1320px){
  .main-nav{display:none}
  .mobile-menu{display:inline-grid;place-items:center}
}

@media(min-width:761px) and (max-width:1320px){
  .mobile-nav-panel.is-open{display:grid!important;position:absolute;left:auto;right:max(1rem,calc((100vw - var(--shell))/2));top:70px;width:min(420px,calc(100vw - 2rem));background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1rem;box-shadow:var(--shadow)}
  .mobile-nav-panel a{padding:.6rem .3rem;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);font-weight:700}
  .mobile-nav-panel .mobile-search{min-height:44px;border:1px solid var(--line);border-radius:11px;padding:.7rem;background:var(--surface);color:var(--ink)}
}

@media(max-width:760px){
  .page-hero{padding-top:2.4rem}.page-hero-grid{grid-template-columns:1fr}.page-hero h1{font-size:clamp(2.45rem,12vw,4.4rem)}
  .hero-actions .button{flex:1 1 160px;text-align:center}
  .quick-projects{grid-template-columns:1fr 1fr}.quick-project{padding:.78rem}.quick-project small{font-size:.72rem}
  .calculator-grid{grid-template-columns:1fr}.results-column{position:static}
}

@media(max-width:480px){
  .quick-projects{grid-template-columns:1fr}.trust-strip-inner{gap:1rem;overflow:hidden;justify-content:space-between}.trust-strip-inner span:nth-child(n+3){display:none}.hero-proof span{font-size:.69rem}
  .result-context{display:grid}.metric-grid{grid-template-columns:1fr 1fr}
}
