:root { --ink:#0b0b09; --paper:#f4f1e9; --acid:#d8ff38; --orange:#ff4d00; --line:rgba(255,255,255,.18); --font-display:"Arial Black","Segoe UI",sans-serif; --font-body:"Segoe UI",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--paper); background:var(--ink) url("/assets/backgrounds/site-monument-v1.webp") center top/cover fixed; font-family:var(--font-body); line-height:1.5; }
a { color:inherit; text-decoration:none; }
.shell { width:min(calc(100% - 48px),1180px); margin:auto; }
.service-header { position:sticky; top:0; z-index:20; background:rgba(8,8,6,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
.service-header .shell { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { font:800 18px var(--font-display); letter-spacing:0; }
.brand span { color:var(--acid); }
.nav { display:flex; align-items:center; gap:24px; font-size:14px; font-weight:700; }
.nav a:hover { color:var(--acid); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:12px 20px; color:var(--ink); background:var(--acid); border:1px solid var(--acid); font-weight:800; transition:transform .18s ease; }
.button:hover { transform:translateY(-2px); }
.button-ghost { color:var(--paper); background:transparent; border-color:rgba(255,255,255,.4); }
.hero { min-height:690px; display:flex; align-items:center; padding:110px 0 90px; background:rgba(8,8,6,.79); border-bottom:8px solid var(--acid); }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr); align-items:end; gap:76px; }
.eyebrow { margin:0 0 22px; color:var(--acid); font-size:12px; font-weight:800; text-transform:uppercase; }
h1,h2,h3 { margin-top:0; font-family:var(--font-display); letter-spacing:0; }
h1 { max-width:900px; margin-bottom:28px; font-size:clamp(48px,7vw,98px); line-height:.93; overflow-wrap:break-word; }
.lead { max-width:760px; margin:0; color:#cfccc0; font-size:20px; }
.offer { padding:30px; color:var(--ink); background:var(--acid); box-shadow:10px 10px 0 var(--orange); }
.offer span { display:block; font-size:12px; font-weight:800; text-transform:uppercase; }
.offer strong { display:block; margin:9px 0 3px; font:800 36px var(--font-display); }
.offer p { margin:0 0 24px; }
.offer .button { color:var(--paper); background:var(--ink); border-color:var(--ink); }
.section { padding:100px 0; background:rgba(244,241,233,.93); color:var(--ink); backdrop-filter:blur(5px); }
.section-dark { color:var(--paper); background:rgba(8,8,6,.88); }
.section-head { display:grid; grid-template-columns:1fr minmax(280px,.55fr); gap:60px; margin-bottom:54px; }
h2 { margin-bottom:0; font-size:clamp(38px,5vw,68px); line-height:.98; }
.section-head p { margin:8px 0 0; color:#5f5d56; font-size:18px; }
.section-dark .section-head p { color:#bbb8ad; }
.deliverables { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid currentColor; border-left:1px solid currentColor; }
.deliverable { min-height:250px; padding:30px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; }
.deliverable span { color:var(--orange); font-size:12px; font-weight:800; }
.deliverable h3 { margin:38px 0 16px; font-size:24px; line-height:1.08; }
.deliverable p { margin:0; color:#5f5d56; }
.section-dark .deliverable p { color:#bbb8ad; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); }
.step { min-height:230px; padding:28px; background:var(--ink); }
.step span { color:var(--acid); font-weight:800; }
.step h3 { margin:52px 0 14px; font-size:21px; }
.step p { margin:0; color:#aaa79d; }
.cta { padding:90px 0; color:var(--ink); background:rgba(216,255,56,.94); }
.cta .shell { display:flex; align-items:end; justify-content:space-between; gap:50px; }
.cta h2 { max-width:780px; }
.cta .button { color:var(--paper); background:var(--ink); border-color:var(--ink); white-space:nowrap; }
.service-footer { padding:38px 0; color:#aaa79d; background:rgba(8,8,6,.96); font-size:13px; }
.service-footer .shell { display:flex; justify-content:space-between; gap:25px; }
@media (max-width:900px) { .hero-grid,.section-head { grid-template-columns:1fr; } .hero-grid { gap:45px; } .deliverables { grid-template-columns:repeat(2,1fr); } .steps { grid-template-columns:repeat(2,1fr); } .nav a:not(.button) { display:none; } }
@media (max-width:620px) { .shell { width:min(calc(100% - 32px),1180px); } .service-header .shell { min-height:68px; } .nav { gap:10px; } .nav .button { min-height:42px; padding:8px 12px; font-size:12px; } .hero { min-height:auto; padding:90px 0 72px; } h1 { font-size:43px; } .lead { font-size:17px; } .section,.cta { padding:72px 0; } .deliverables,.steps { grid-template-columns:1fr; } .deliverable,.step { min-height:auto; } .cta .shell,.service-footer .shell { align-items:stretch; flex-direction:column; } .cta .button { width:100%; } }