:root { --ink:#16181d; --muted:#666d7a; --dark:#111522; --dark-2:#202638; --paper:#fff; --soft:#f3f5f8; --line:#dce1e8; --blue:#0066ff; --lime:#ccff00; --font-heading:Geist,Arial,sans-serif; --font-body:Inter,Arial,sans-serif; --font-mono:"IBM Plex Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:76px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--font-body); overflow-x:hidden; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
.shell { width:min(1296px, calc(100% - 48px)); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.reading-progress { position:fixed; z-index:50; inset:0 auto auto 0; width:100%; height:3px; background:var(--blue); transform:scaleX(var(--scroll-progress, 0)); transform-origin:left; transition:transform .06s linear; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.9); backdrop-filter:blur(18px); border-bottom:1px solid transparent; transition:.25s ease; }
.site-header.is-scrolled { border-color:var(--line); box-shadow:0 8px 26px rgba(18,24,37,.06); }
.header__inner { min-height:85px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; color:var(--ink); font:600 13px/1 var(--font-mono); letter-spacing:.8px; white-space:nowrap; }
.brand>span { width:14px; aspect-ratio:1; background:var(--blue); display:block; transition:transform .25s ease; }
.brand:hover>span { transform:rotate(45deg); }
.brand--inverse { color:#fff; }
.site-nav { display:flex; gap:30px; align-items:center; color:var(--muted); font-size:14px; }
.site-nav>a:not(.button) { position:relative; }
.site-nav>a:not(.button)::after { content:""; position:absolute; inset:auto 0 -7px; height:1px; background:var(--blue); transform:scaleX(0); transform-origin:right; transition:transform .2s ease; }
.site-nav>a:hover::after { transform:scaleX(1); transform-origin:left; }
.menu-toggle { display:none; border:0; background:none; padding:8px 0 8px 8px; }
.menu-toggle>span:not(.sr-only) { display:block; width:24px; height:2px; background:var(--ink); margin:5px; transition:.2s ease; }
.button { display:inline-flex; width:fit-content; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:14px 21px; color:#fff; background:var(--blue); border:1px solid var(--blue); border-radius:4px; font-weight:600; font-size:15px; transition:transform .2s ease, background .2s ease, color .2s ease; cursor:pointer; }
.button:hover { transform:translateY(-2px); background:#0758db; }
.button b { font-size:18px; line-height:1; font-weight:400; transition:transform .2s ease; }
.button:hover b { transform:translate(2px,-2px); }
.button--small { min-height:40px; padding:10px 17px; font-size:14px; }
.button--ghost { color:#fff; background:transparent; border-color:rgba(255,255,255,.35); }
.button--ghost:hover { background:rgba(255,255,255,.12); }
.hero { position:relative; color:#fff; background:var(--dark); overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; opacity:.38; background:radial-gradient(circle at 14% 23%,rgba(0,102,255,.22),transparent 26%),linear-gradient(115deg,transparent 0 42%,rgba(255,255,255,.045) 42.2% 42.35%,transparent 42.5%); pointer-events:none; }
.hero__grid { display:grid; grid-template-columns:minmax(0,1fr) 480px; gap:64px; align-items:center; min-height:758px; padding:80px 0; }
.hero__copy { max-width:752px; }
.eyebrow { margin:0 0 24px; color:var(--blue); font:600 12px/1.3 var(--font-mono); letter-spacing:1px; }
.eyebrow--signal { color:var(--lime); }
.hero h1,.section h2 { margin:0; font-family:var(--font-heading); font-weight:600; letter-spacing:-.055em; line-height:1.04; }
.hero h1 { font-size:clamp(43px,4.1vw,58px); }
.hero__lead { max-width:690px; margin:28px 0; color:#c9cfda; font-size:19px; line-height:1.5; }
.actions { display:flex; flex-wrap:wrap; gap:14px; }
.trust-chips { display:flex; flex-wrap:wrap; gap:14px 22px; padding:0; margin:27px 0 0; list-style:none; color:#dde2ea; font-size:12px; }
.trust-chips li::first-letter { color:var(--lime); }
.hero-card { position:relative; min-height:590px; overflow:hidden; background:linear-gradient(145deg, rgba(9,13,27,.1),rgba(9,13,27,.83)), url("assets/hero-industrial-night.png") center/cover; isolation:isolate; transition:transform .35s cubic-bezier(.22,1,.36,1), filter .35s ease; }
.hero-card::before { content:""; position:absolute; inset:-25%; z-index:0; background:linear-gradient(115deg,transparent 44%,rgba(0,102,255,.26) 50%,transparent 56%); transform:translateX(-64%); animation:lightSweep 8s ease-in-out infinite; }
.hero-card__grid { position:absolute; z-index:0; inset:-8%; opacity:.35; background-image:linear-gradient(rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.35) 1px,transparent 1px); background-size:60px 56px; mask-image:linear-gradient(to bottom,black,transparent); animation:gridDrift 16s linear infinite; }
.hero-card__metric { position:absolute; z-index:1; right:28px; bottom:32px; left:28px; display:grid; gap:8px; padding:22px; background:rgba(16,19,30,.82); backdrop-filter:blur(10px); box-shadow:0 4px 10px rgba(0,0,0,.4); }
.hero-card__metric small,.case__meta,.case>span,.contact-details small,.footer__links small { font:600 10px/1.3 var(--font-mono); letter-spacing:.75px; }
.hero-card__metric small { color:#c9cfda; }
.hero-card__metric strong { color:var(--lime); font:600 42px/1 var(--font-mono); }
.hero-card__metric span { font-size:13px; }
.section { padding:104px 0; }
.section--white { background:var(--paper); }
.section--dark { color:#fff; background:var(--dark); }
.section-heading { margin-bottom:54px; }
.section-heading--split { display:grid; grid-template-columns:1fr 760px; gap:40px; align-items:start; }
.section h2 { font-size:clamp(38px,4vw,50px); }
.scenarios { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.scenario { min-height:357px; padding:36px; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease; }
.scenario:hover { transform:translateY(-8px); box-shadow:0 18px 38px rgba(17,21,34,.13); }
.scenario--loss { background:var(--soft); }
.scenario--growth { color:#fff; background:var(--blue); }
.scenario__top { display:flex; justify-content:space-between; align-items:center; margin-bottom:25px; font:500 15px/1 var(--font-mono); }
.scenario__top b { display:grid; place-items:center; width:52px; aspect-ratio:1; border-radius:4px; background:#fff; color:var(--blue); font-size:28px; }
.scenario h3 { margin:0 0 18px; font:600 31px/1.15 var(--font-heading); letter-spacing:-.035em; }
.scenario p { max-width:500px; margin:0; color:var(--muted); line-height:1.48; font-size:17px; }
.scenario--growth p { color:#e7efff; }
.scenario ul { display:grid; gap:10px; padding:0; margin:24px 0 0; list-style:none; font-size:14px; }
.scenario li { display:flex; gap:10px; }
.scenario li::before { content:""; flex:0 0 8px; height:8px; margin-top:4px; background:#d92d20; }
.scenario--growth li::before { background:var(--lime); }
.section-action { display:flex; justify-content:flex-end; margin-top:44px; }
.process-list { border-top:1px solid rgba(255,255,255,.14); }
.process { display:grid; grid-template-columns:170px 300px minmax(0,1fr); gap:36px; padding:30px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.process span { color:var(--blue); font:500 40px/1 var(--font-mono); }
.process h3 { margin:0; font:600 29px/1.15 var(--font-heading); letter-spacing:-.035em; }
.process p { max-width:650px; margin:0; color:#c5cbd6; font-size:17px; line-height:1.5; }
.method-visual { position:relative; display:grid; min-height:400px; margin:50px 0 0; overflow:hidden; background:#202638; }
.method-visual img,.case-photo img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 1s cubic-bezier(.22,1,.36,1), filter .5s ease; }
.method-visual::after,.case-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,13,23,.68),rgba(10,13,23,.12) 70%,rgba(10,13,23,.28)); pointer-events:none; }
.method-visual figcaption,.case-photo figcaption { position:absolute; z-index:1; bottom:34px; left:34px; max-width:500px; display:grid; gap:12px; }
.method-visual figcaption span,.case-photo figcaption span { color:var(--lime); font:600 11px/1.3 var(--font-mono); letter-spacing:.8px; }
.method-visual figcaption b,.case-photo figcaption b { color:#fff; font:500 25px/1.17 var(--font-heading); letter-spacing:-.035em; }
.method-visual:hover img,.case-photo:hover img { transform:scale(1.045); filter:saturate(1.12); }
.outcome { display:flex; align-items:center; justify-content:space-between; gap:40px; margin-top:50px; padding:28px 32px; background:var(--dark-2); }
.outcome .eyebrow { margin-bottom:6px; }
.outcome p:last-child { max-width:800px; margin:0; font-size:18px; line-height:1.4; }
.results { background:var(--soft); }
.section-heading--results { display:flex; justify-content:space-between; align-items:end; gap:36px; }
.section-heading--results h2 { max-width:820px; }
.microcopy { max-width:370px; margin:0; text-align:right; color:var(--muted); font:11px/1.35 var(--font-mono); }
.case-grid { display:grid; grid-template-columns:minmax(0,1fr) 430px; gap:24px; }
.case { display:flex; flex-direction:column; justify-content:space-between; padding:30px; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease; }
.case:hover { transform:translateY(-6px); box-shadow:0 18px 35px rgba(16,23,42,.13); }
.case--featured { min-height:480px; padding:40px; color:#fff; background:var(--blue); }
.case__meta { display:flex; justify-content:space-between; color:rgba(255,255,255,.75); }
.case--featured strong { display:block; margin-bottom:18px; color:var(--lime); font:500 clamp(68px,7vw,96px)/.9 var(--font-mono); letter-spacing:-.1em; }
.case--featured h3 { max-width:650px; margin:0 0 16px; font:600 26px/1.2 var(--font-heading); letter-spacing:-.035em; }
.case--featured p { margin:0; color:rgba(255,255,255,.75); font:11px/1.35 var(--font-mono); letter-spacing:.25px; }
.case-stack { display:grid; gap:24px; }
.case--minor { min-height:228px; background:#fff; border:1px solid var(--line); }
.case--minor>span { color:var(--muted); }
.case--minor strong { display:block; margin-top:auto; color:var(--ink); font:500 54px/.95 var(--font-mono); letter-spacing:-.08em; }
.case--minor h3 { margin:6px 0 0; font:600 20px/1.2 var(--font-heading); letter-spacing:-.03em; }
.case--minor p { margin:16px 0 0; color:var(--muted); font-size:13px; line-height:1.35; }
.case-photo { position:relative; min-height:410px; margin:24px 0 0; overflow:hidden; background:var(--dark); }
.case-photo::after { background:linear-gradient(90deg,rgba(10,13,23,.7),rgba(10,13,23,.12) 72%); }
.section-intro { max-width:390px; margin:0; color:var(--muted); font-size:17px; line-height:1.5; }
.services-list { display:grid; grid-template-columns:1fr 1fr; column-gap:72px; }
.services-list article { display:grid; grid-template-columns:52px minmax(0,1fr); gap:18px; padding:26px 0; border-bottom:1px solid var(--line); }
.services-list span { color:var(--blue); font:600 14px/1.4 var(--font-mono); }
.services-list h3 { grid-column:2; margin:0; font:600 26px/1.15 var(--font-heading); letter-spacing:-.035em; }
.services-list p { grid-column:2; margin:0; color:var(--muted); font-size:15px; line-height:1.45; }
.service-cta { display:flex; justify-content:space-between; align-items:center; gap:30px; margin-top:24px; padding:24px 0; }
.service-cta p { max-width:700px; margin:0; font-size:17px; }
.trust__grid { display:grid; grid-template-columns:minmax(0,1fr) 560px; gap:84px; }
.trust h2 { margin-bottom:28px; }
.trust__lead { max-width:650px; color:#c8ced9; font-size:20px; line-height:1.45; }
blockquote { max-width:600px; margin:28px 0 0; padding:24px 0 0 28px; border-left:3px solid var(--blue); font:500 23px/1.3 var(--font-heading); }
blockquote cite { display:block; margin-top:12px; color:#9098a8; font:10px/1.3 var(--font-mono); letter-spacing:.8px; font-style:normal; }
.principles article { display:grid; grid-template-columns:45px minmax(0,1fr); gap:18px; padding:23px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.principles b { display:grid; place-items:center; width:45px; aspect-ratio:1; color:var(--lime); background:var(--dark-2); font-size:23px; font-weight:400; }
.principles h3 { margin:0 0 7px; font:600 21px/1.2 var(--font-heading); letter-spacing:-.025em; }
.principles p { margin:0; color:#aeb5c2; font-size:14px; line-height:1.45; }
.contact { color:#fff; background:var(--blue); }
.contact__grid { display:grid; grid-template-columns:minmax(0,1fr) 650px; gap:72px; align-items:start; }
.contact h2 { margin-bottom:25px; }
.contact__copy>p:not(.eyebrow) { max-width:620px; color:#e7efff; font-size:19px; line-height:1.48; }
.contact__copy ul { display:grid; gap:12px; margin:28px 0 0; padding:0; list-style:none; font-size:15px; }
.contact__copy li::before { content:"✓"; color:var(--lime); margin-right:11px; }
.contact-details { display:grid; gap:10px; margin-top:34px; }
.contact-details small { color:rgba(255,255,255,.7); }
.contact-details a:first-of-type { font:600 25px/1.2 var(--font-heading); }
.contact-details a:last-of-type { font-size:16px; }
.lead-form { display:grid; gap:20px; padding:40px; color:var(--ink); background:#fff; box-shadow:0 4px 10px rgba(0,0,0,.3); }
.lead-form h2 { margin:0; font:600 30px/1.1 var(--font-heading); letter-spacing:-.04em; }
.lead-form>div>p { margin:7px 0 0; color:var(--muted); font-size:14px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px 18px; }
.form-grid label { display:grid; gap:8px; color:var(--muted); font:600 11px/1.2 var(--font-mono); letter-spacing:.4px; }
.form-grid input,.form-grid select { width:100%; min-height:48px; padding:0 14px; color:var(--ink); border:1px solid var(--line); border-radius:4px; outline:none; background:#fff; font:400 14px/1 var(--font-body); transition:border-color .2s,box-shadow .2s; }
.form-grid input:focus,.form-grid select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(0,102,255,.12); }
.consent { display:flex; gap:10px; align-items:flex-start; color:var(--muted); font-size:12px; line-height:1.35; }
.consent input { margin:1px 0 0; accent-color:var(--blue); }
.button--submit { width:100%; border:0; }
.form-status { margin:0; color:var(--muted); text-align:center; font:10px/1.3 var(--font-mono); }
.form-status.is-success { color:#188e45; }
.site-footer { padding:54px 0; color:#fff; background:var(--dark); }
.footer__top { display:flex; justify-content:space-between; gap:50px; }
.footer__top>div:first-child>p { max-width:440px; margin:12px 0 0; color:#aeb5c2; font-size:14px; line-height:1.45; }
.footer__links { display:flex; gap:64px; }
.footer__links>div { display:grid; gap:10px; align-content:start; }
.footer__links small { color:#7f8796; }
.footer__links a { font-size:14px; }
.footer__bottom { display:flex; justify-content:space-between; gap:24px; margin-top:34px; padding-top:22px; border-top:1px solid rgba(255,255,255,.14); color:#7f8796; font-size:12px; }
[data-reveal] { opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
[data-reveal].is-visible { opacity:1; transform:none; }
@keyframes gridDrift { to { transform:translate(60px,56px); } }
@keyframes lightSweep { 0%,58% { transform:translateX(-64%) rotate(0.001deg); } 80%,100% { transform:translateX(64%) rotate(0.001deg); } }
@media (max-width:1050px) { .hero__grid { grid-template-columns:minmax(0,1fr) 400px; gap:42px; } .hero-card { min-height:530px; } .section-heading--split { grid-template-columns:1fr 58%; } .process { grid-template-columns:120px 230px minmax(0,1fr); } .trust__grid { gap:48px; grid-template-columns:minmax(0,1fr) 48%; } .contact__grid { grid-template-columns:minmax(0,1fr) 520px; gap:45px; } .lead-form { padding:30px; } }
@media (max-width:780px) { .shell { width:min(100% - 32px, 600px); } .header__inner { min-height:70px; } .menu-toggle { display:block; z-index:2; } .site-nav { position:fixed; inset:70px 0 auto; display:grid; gap:0; padding:12px 16px 22px; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 18px 35px rgba(18,24,37,.12); transform:translateY(-130%); opacity:0; pointer-events:none; transition:.25s ease; } .site-nav.is-open { transform:none; opacity:1; pointer-events:auto; } .site-nav>a:not(.button) { padding:15px 0; color:var(--ink); font-size:16px; border-bottom:1px solid var(--line); } .site-nav .button { margin-top:16px; } .menu-toggle.is-open>span:nth-child(1) { transform:translateY(7px) rotate(45deg); } .menu-toggle.is-open>span:nth-child(2) { opacity:0; } .menu-toggle.is-open>span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); } .hero__grid,.trust__grid,.contact__grid { grid-template-columns:1fr; } .hero__grid { min-height:0; padding:70px 0 0; gap:46px; } .hero h1 { font-size:clamp(37px,10vw,50px); } .hero__lead { font-size:17px; } .hero-card { min-height:420px; margin-inline:calc(16px - (100vw - min(100vw - 32px,600px))/2); } .hero-card__metric { right:16px; bottom:16px; left:16px; } .section { padding:72px 0; } .section-heading,.section-heading--split,.section-heading--results { display:block; margin-bottom:34px; } .section-heading .eyebrow { margin-bottom:16px; } .microcopy,.section-intro { margin-top:18px; text-align:left; } .scenarios,.case-grid,.services-list { grid-template-columns:1fr; } .scenario { min-height:0; padding:28px; } .section-action { justify-content:flex-start; margin-top:28px; } .process { grid-template-columns:60px 1fr; gap:14px; } .process span { font-size:26px; } .process h3 { font-size:25px; } .process p { grid-column:2; font-size:16px; } .method-visual { min-height:330px; margin-top:34px; } .method-visual img { object-position:72% center; filter:brightness(1.12) saturate(1.08); } .method-visual figcaption,.case-photo figcaption { right:22px; bottom:22px; left:22px; } .method-visual figcaption b,.case-photo figcaption b { font-size:21px; } .outcome,.service-cta { display:grid; gap:24px; padding:24px; } .case--featured { min-height:400px; padding:28px; } .case--featured h3 { font-size:22px; } .case-stack { grid-template-columns:1fr 1fr; } .case--minor { min-height:210px; padding:22px; } .case--minor strong { font-size:40px; } .case--minor h3 { font-size:18px; } .case-photo { min-height:330px; } .case-photo img { object-position:77% center; filter:brightness(1.15) saturate(1.05); } .services-list { row-gap:0; } .services-list article { padding:22px 0; } .services-list h3 { font-size:23px; } .trust__lead { font-size:18px; } blockquote { font-size:21px; } .principles article { padding:20px 0; } .lead-form { padding:24px; } .form-grid { grid-template-columns:1fr; gap:14px; } .footer__top,.footer__bottom { display:grid; } .footer__links { gap:40px; } .footer__bottom { margin-top:28px; } }
@media (max-width:470px) { .actions,.actions .button { width:100%; } .trust-chips { display:grid; gap:10px; } .case-stack { grid-template-columns:1fr; } .case--minor { min-height:185px; } .footer__links { display:grid; grid-template-columns:1fr; } .contact-details a:first-of-type { font-size:22px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,::before,::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } [data-reveal] { opacity:1; transform:none; } }
