@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;1,700&family=DM+Sans:wght@400;500;600;700&display=swap');

:root { --yellow:#f4c318; --navy:#102b3b; --cream:#fff8e9; --red:#c43c2f; --ink:#15232a; --line:rgba(16,43,59,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:'DM Sans',sans-serif; }
img { display:block; width:100%; height:100%; object-fit:cover; }
a { color:inherit; text-decoration:none; }
.site-header { min-height:104px; padding:10px 4vw; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); background:var(--cream); position:relative; z-index:2; }
.brand { display:flex; align-items:center; gap:12px; text-transform:uppercase; font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; line-height:.8; letter-spacing:.02em; }
.brand em { display:block; color:var(--red); font-size:13px; font-style:normal; letter-spacing:.14em; margin-top:7px; }
.brand-mark { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; color:var(--yellow); background:var(--navy); border:4px solid var(--yellow); outline:2px solid var(--navy); font-size:17px; }
.brand-logo { width:78px; height:78px; flex:0 0 78px; object-fit:cover; object-position:center 42%; border-radius:50%; mix-blend-mode:multiply; }
nav { display:flex; gap:30px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
nav a:hover { color:var(--red); }
.hero { min-height:720px; display:grid; grid-template-columns:42% 58%; background:var(--yellow); }
.hero-copy { padding:8vw 4vw 5vw; display:flex; flex-direction:column; align-items:flex-start; }
.eyebrow,.section-number { margin:0 0 24px; text-transform:uppercase; font-size:12px; font-weight:800; letter-spacing:.16em; }
h1,h2,blockquote { font-family:'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:-.035em; }
h1 { margin:0; font-size:clamp(72px,8vw,138px); line-height:.75; }
.hero-lede { max-width:530px; margin:42px 0 32px; font-size:18px; line-height:1.6; }
.button { display:inline-flex; align-items:center; gap:32px; padding:17px 22px; background:var(--red); color:white; text-transform:uppercase; font-size:13px; font-weight:800; letter-spacing:.08em; box-shadow:5px 5px 0 var(--navy); transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--navy); }
.button span { font-size:20px; }
.hero-photo { margin:0; position:relative; min-height:720px; overflow:hidden; }
.hero-photo img { object-position:center; }
.hero-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(244,195,24,.15),transparent 30%); pointer-events:none; }
.hero-photo figcaption { position:absolute; z-index:1; bottom:28px; right:28px; display:flex; gap:26px; align-items:center; padding:13px 18px; background:var(--cream); font-family:'Barlow Condensed',sans-serif; }
.hero-photo figcaption strong { font-size:24px; }.hero-photo figcaption span { font-size:12px; letter-spacing:.16em; }
.ticker { background:var(--navy); color:var(--cream); display:flex; align-items:center; justify-content:space-around; gap:25px; padding:18px 4vw; font:700 18px 'Barlow Condensed',sans-serif; letter-spacing:.1em; overflow:hidden; white-space:nowrap; }
.ticker i { color:var(--yellow); font-style:normal; }
.story,.mission,.engine { padding:110px 5vw; }
.story-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:8vw; align-items:start; }
blockquote { margin:0; font-size:clamp(52px,6vw,96px); line-height:.92; color:var(--navy); }
.story-text { border-top:5px solid var(--yellow); padding-top:26px; font-size:18px; line-height:1.7; }.story-text p:first-child { font-size:34px; font-weight:800; color:var(--red); margin-top:0; }
.badge-note { margin-top:34px; padding:25px 26px; background:var(--yellow); border-left:7px solid var(--red); color:var(--navy); }
.badge-note h3 { margin:0 0 10px; font:800 30px 'Barlow Condensed',sans-serif; text-transform:uppercase; }
.badge-note p { margin:10px 0 0; font-size:15px; line-height:1.6; }
.mission { background:var(--navy); color:var(--cream); display:grid; grid-template-columns:1fr 1fr; gap:8vw; }
.mission h2,.engine h2,.next-call h2 { margin:0; font-size:clamp(76px,9vw,150px); line-height:.8; }
.mission-lede { color:var(--yellow); font:700 clamp(28px,3vw,44px)/1.1 'Barlow Condensed',sans-serif; text-transform:uppercase; margin:0 0 35px; }
.mission-list article { display:grid; grid-template-columns:50px 1fr; gap:20px; padding:24px 0; border-top:1px solid rgba(255,255,255,.25); }
.mission-list article>span { color:var(--yellow); font-weight:800; }.mission-list h3 { margin:0 0 7px; font:700 30px 'Barlow Condensed',sans-serif; text-transform:uppercase; }.mission-list p { margin:0; line-height:1.6; color:#d7dedf; }
.engine { display:grid; grid-template-columns:30% 1fr; gap:5vw; }
.engine h2 { color:var(--red); margin-bottom:55px; }
dl { margin:0; }dl div { display:flex; justify-content:space-between; padding:15px 0; border-top:1px solid var(--line); }dt { text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.12em; }dd { margin:0; font-weight:700; text-align:right; }
.gallery { display:grid; grid-template-columns:1.25fr .75fr; grid-template-rows:360px 360px; gap:14px; }.gallery figure { margin:0; overflow:hidden; }.gallery-1 { grid-row:1/3; }.gallery-1 img { object-position:58% center; }.gallery-2 img { object-position:center; }
.meter-section { padding:110px 5vw; display:grid; grid-template-columns:.8fr 1.2fr; gap:7vw; align-items:center; background:#d7d2c7; color:var(--navy); border-top:12px solid #a9a69e; border-bottom:12px solid #a9a69e; }
.meter-copy h2 { margin:0; font:800 clamp(65px,7vw,118px)/.82 'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:-.035em; }
.meter-copy>p:last-child { max-width:520px; margin:34px 0 0; font-size:17px; line-height:1.65; }
.pump-gauge { position:relative; max-width:650px; width:100%; margin:auto; padding:34px 42px 25px; border-radius:38px; background:linear-gradient(145deg,#f4f4f0 0%,#8e9291 28%,#e8e6dd 52%,#777d7d 76%,#d9dad5 100%); border:3px solid #4f5555; box-shadow:inset 0 0 0 5px #cfd1cc,inset 0 0 18px #414747,0 18px 28px rgba(16,43,59,.28); }
.gauge-screws i { position:absolute; width:18px; height:18px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#f8f7ef,#7d8382 58%,#303737 62%); box-shadow:inset 0 0 0 1px #3b4141; }
.gauge-screws i:after { content:""; position:absolute; left:4px; right:4px; top:8px; height:2px; background:#343a3a; transform:rotate(-35deg); }
.gauge-screws i:nth-child(1){top:15px;left:18px}.gauge-screws i:nth-child(2){top:15px;right:18px}.gauge-screws i:nth-child(3){bottom:18px;left:18px}.gauge-screws i:nth-child(4){bottom:18px;right:18px}
.gauge-face { position:relative; aspect-ratio:1.75/1; overflow:hidden; border-radius:50% 50% 22% 22%/80% 80% 20% 20%; background:radial-gradient(circle at 50% 62%,#263037 0 7%,transparent 7.5%),repeating-conic-gradient(from 242deg at 50% 78%,#e8e2c8 0deg 1.2deg,transparent 1.2deg 9deg),radial-gradient(ellipse at center,#1d272d 0%,#070b0d 72%); border:8px solid #222a2d; box-shadow:inset 0 0 35px #000,0 0 0 4px #696e6e,0 0 0 7px #252b2c; color:#eee7c9; font-family:'Barlow Condensed',sans-serif; }
.gauge-brand { position:absolute; top:12%; left:50%; transform:translateX(-50%); color:var(--yellow); font-weight:800; font-size:clamp(18px,3vw,34px); letter-spacing:.2em; }
.gauge-scale { position:absolute; top:49%; font-weight:700; font-size:14px; }.gauge-scale-left{left:10%;transform:rotate(-42deg)}.gauge-scale-mid{top:20%;left:50%;transform:translateX(-50%)}.gauge-scale-right{right:8%;transform:rotate(42deg)}
.gauge-needle { position:absolute; z-index:2; left:50%; bottom:22%; width:4px; height:45%; transform-origin:50% 100%; background:linear-gradient(90deg,#7d120d,#ef4338,#77100c); clip-path:polygon(50% 0,100% 100%,0 100%); transition:transform .8s cubic-bezier(.2,.8,.2,1); }
.gauge-hub { position:absolute; z-index:3; left:50%; bottom:19%; width:34px; height:34px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(circle at 35% 30%,#f1eee1,#737a79 55%,#202727 60%); border:2px solid #111; }
.odometer { position:absolute; z-index:4; left:50%; bottom:7%; transform:translateX(-50%); display:flex; padding:4px; background:#050707; border:3px inset #747b79; box-shadow:0 0 0 2px #111; }
.odometer span { display:grid; place-items:center; width:34px; height:42px; color:#f4ead0; background:linear-gradient(#080a0a 0 42%,#333 48%,#080a0a 54%); border-right:1px solid #555; font:700 32px/1 'DM Sans',monospace; text-shadow:0 1px 2px #000; }.odometer span:last-child{border-right:0;color:#f0c131}
.gauge-label { position:absolute; left:50%; bottom:1.5%; transform:translateX(-50%); width:100%; text-align:center; font-size:10px; letter-spacing:.18em; }
.gauge-plate { margin-top:22px; text-align:center; color:#202728; font:700 11px 'DM Sans',sans-serif; letter-spacing:.08em; }
.next-call { padding:110px 5vw; text-align:center; background:var(--yellow); }.next-call h2 { color:var(--navy); }.next-call>p:not(.eyebrow) { max-width:620px; margin:35px auto; font-size:18px; line-height:1.6; }.button-dark { background:var(--navy); box-shadow:5px 5px 0 var(--red); }
footer { padding:45px 5vw; display:grid; grid-template-columns:1fr auto auto; gap:50px; align-items:center; background:#091d28; color:var(--cream); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
footer .brand { font-size:20px; }footer .brand-logo { mix-blend-mode:normal; border-radius:0; }footer p { margin:0; }
@media (max-width:900px) { nav{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:80px 6vw}.hero-photo{min-height:520px}.story-grid,.mission,.engine,.meter-section{grid-template-columns:1fr}.gallery{margin-top:20px}.engine-intro{max-width:600px}.ticker span:last-child,.ticker i:last-of-type{display:none} }
@media (max-width:600px) { .site-header{min-height:86px;padding:8px 20px}.brand{font-size:17px}.brand-logo{width:62px;height:62px;flex-basis:62px}.hero{min-height:0}.hero-copy{padding:70px 22px 55px}h1{font-size:70px}.hero-lede{font-size:16px;margin:30px 0}.hero-photo{min-height:390px}.hero-photo figcaption{bottom:15px;right:15px}.story,.mission,.engine,.meter-section,.next-call{padding:80px 22px}.story-grid{gap:35px}blockquote{font-size:54px}.mission h2,.engine h2,.next-call h2{font-size:72px}.gallery{grid-template-columns:1fr;grid-template-rows:300px 230px 230px}.gallery-1{grid-row:auto}.ticker{justify-content:flex-start;font-size:15px}.ticker span:nth-of-type(2),.ticker i{display:none}.pump-gauge{padding:28px 24px 22px}.odometer span{width:27px;height:34px;font-size:25px}.gauge-hub{width:28px;height:28px}.gauge-plate{font-size:9px}footer{grid-template-columns:1fr;gap:22px;text-align:center}footer .brand{justify-content:center} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.button{transition:none} }
