@import "tailwindcss";
:root { --ink:#111518; --lime:#b9ff00; --paper:#f4f5ef; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:#fff; font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; }
.hero { position:relative; min-height:100svh; overflow:hidden; padding:0 clamp(24px,5vw,76px) 42px; background:var(--ink); }
.grid-lines { position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:70px 70px; mask-image:linear-gradient(to right,transparent,black 25%,black 70%,transparent); }
.hero::after { content:""; position:absolute; width:42vw; height:42vw; right:-12vw; top:20%; border:1px solid rgba(185,255,0,.22); border-radius:50%; box-shadow:0 0 100px rgba(185,255,0,.06); }
.topbar { position:relative; z-index:3; height:118px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.13); }
.brand-logo { width:min(390px,62vw); height:auto; }
.contact-link { display:flex; align-items:center; gap:9px; text-decoration:none; text-transform:uppercase; font-weight:800; font-size:12px; letter-spacing:.14em; border-bottom:2px solid var(--lime); padding:10px 0; }
.hero-content { position:relative; z-index:2; max-width:1000px; padding-top:clamp(70px,11vh,130px); }
.eyebrow { display:flex; align-items:center; gap:12px; color:var(--lime); font-size:13px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; }
.eyebrow span { width:36px; height:3px; background:var(--lime); }
h1 { max-width:930px; margin:24px 0 28px; font-size:clamp(54px,7.4vw,112px); line-height:.88; letter-spacing:-.065em; text-transform:uppercase; font-weight:950; }
h1 em { display:block; color:var(--lime); font-style:italic; }
.intro { max-width:670px; margin:0; color:#d6d9d4; font-size:clamp(17px,1.5vw,22px); line-height:1.65; }
.category-list { display:flex; flex-wrap:wrap; gap:9px; margin-top:38px; }
.category-list span { padding:9px 14px; border:1px solid rgba(255,255,255,.18); color:#d6d9d4; font-size:12px; text-transform:uppercase; letter-spacing:.1em; background:rgba(255,255,255,.025); }
.power-mark { position:absolute; right:-3vw; bottom:-9vw; z-index:1; color:rgba(255,255,255,.035); font-size:49vw; line-height:.75; font-weight:950; letter-spacing:-.16em; transform:skew(-7deg); }
.power-mark span { color:rgba(185,255,0,.12); font-size:.66em; margin-left:-.45em; }
.scroll-note { position:absolute; z-index:2; right:clamp(24px,5vw,76px); bottom:46px; color:#9ba09b; font-size:11px; text-transform:uppercase; letter-spacing:.18em; writing-mode:vertical-rl; }
.promise { background:var(--paper); color:var(--ink); padding:clamp(75px,9vw,130px) clamp(24px,7vw,110px); }
.section-heading { display:grid; grid-template-columns:.8fr 2fr; align-items:end; gap:30px; padding-bottom:54px; border-bottom:1px solid #ccd0c7; }
.section-heading p,.closing p { margin:0; color:#6b716b; font-size:12px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.section-heading h2 { margin:0; font-size:clamp(38px,5vw,74px); line-height:.95; letter-spacing:-.055em; text-transform:uppercase; }
.promise-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#ccd0c7; margin-top:1px; }
.promise-grid article { background:var(--paper); padding:54px 36px 46px; }
.promise-grid svg { width:34px; height:34px; color:#789d00; stroke-width:1.7; }
.feature-icon { width:34px; height:34px; color:#789d00; font-size:34px; line-height:1; font-weight:400; }
.promise-grid h3 { margin:38px 0 15px; font-size:22px; text-transform:uppercase; letter-spacing:-.03em; }
.promise-grid p { margin:0; color:#626762; line-height:1.75; font-size:15px; }
.closing { position:relative; overflow:hidden; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:42px; padding:clamp(70px,9vw,120px) clamp(24px,7vw,110px); background:var(--lime); color:var(--ink); }
.closing-icon { width:90px; height:90px; display:grid; place-items:center; border:2px solid var(--ink); transform:rotate(-5deg); }
.closing-icon svg { width:44px; height:44px; }
.closing p { color:#445500; margin-bottom:16px; }
.closing h2 { margin:0; font-size:clamp(42px,6vw,88px); line-height:.9; letter-spacing:-.06em; text-transform:uppercase; }
.closing h2 span { color:#fff; text-shadow:3px 3px 0 var(--ink); }
.closing-zap { width:110px; height:110px; stroke-width:1; opacity:.3; }
.closing-zap { display:grid; place-items:center; font-size:110px; line-height:1; }
footer { min-height:125px; padding:28px clamp(24px,5vw,76px); display:flex; align-items:center; justify-content:space-between; gap:30px; color:#929892; font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
footer img { width:50px; height:50px; }
footer a { color:#fff; text-decoration:none; }
@media (max-width:800px) { .hero{min-height:auto;padding-bottom:90px}.topbar{height:90px}.contact-link{font-size:0}.contact-link svg{width:22px;height:22px}.hero-content{padding-top:70px}h1{font-size:clamp(48px,15vw,72px)}.scroll-note{display:none}.section-heading{grid-template-columns:1fr}.promise-grid{grid-template-columns:1fr}.promise-grid article{padding:38px 24px}.closing{grid-template-columns:1fr;gap:28px}.closing-icon{width:70px;height:70px}.closing-zap{display:none}footer{flex-direction:column;text-align:center;padding-block:38px} }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }