
:root { --red:#e4232a; --ink:#070708; --paper:#f2f0eb; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; background:var(--ink); color:#fff; font-family:var(--font-sans),Arial,sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
main { min-width:320px; }
.site-header { height:92px; position:absolute; z-index:20; top:0; left:0; right:0; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 5vw; border-bottom:1px solid #ffffff22; }
.brand img { width:134px; height:66px; object-fit:contain; }
nav { display:flex; gap:38px; font-size:12px; font-weight:650; letter-spacing:.12em; text-transform:uppercase; }
nav a { color:#d6d6d6; transition:.2s; }
nav a:hover { color:#fff; }
.header-cta { justify-self:end; border-bottom:1px solid var(--red); padding:9px 0; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.header-cta span { color:var(--red); margin-left:8px; }
.hero { min-height:840px; height:100vh; position:relative; display:flex; align-items:center; overflow:hidden; background:#0a0a0b; }
.hero-bg { position:absolute; inset:0; background:linear-gradient(90deg,#050506 0%,#080808e8 35%,#08080855 64%,#080808bb 100%),url('/hero-zrc.jpg') center/cover no-repeat; filter:saturate(.75) contrast(1.05); }
.hero-bg:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#070708 0%,transparent 26%),radial-gradient(circle at 78% 50%,transparent 0 18%,#0008 65%); }
.hero-grid { position:absolute; inset:0; opacity:.13; background-image:linear-gradient(#fff1 1px,transparent 1px),linear-gradient(90deg,#fff1 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(90deg,#000 0%,transparent 75%); }
.hero-content { position:relative; z-index:2; width:min(720px,90vw); margin-left:10vw; padding-top:80px; }
.eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 26px; color:#b8b8b8; font-family:var(--font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; }
.eyebrow span { width:30px; height:2px; background:var(--red); }
h1,h2 { margin:0; text-transform:uppercase; font-size:clamp(58px,7.2vw,112px); line-height:.85; letter-spacing:-.07em; font-weight:780; }
h1 em,h2 em { color:transparent; font-style:normal; -webkit-text-stroke:1px #fff; }
.hero-copy { max-width:530px; margin:35px 0; color:#b9b9bb; font-size:16px; line-height:1.7; }
.hero-actions,.contact-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.btn { min-height:54px; padding:0 25px; display:inline-flex; align-items:center; justify-content:center; gap:26px; font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; transition:.25s; }
.btn-primary { background:var(--red); }
.btn-primary:hover { background:#ff3038; transform:translateY(-2px); }
.btn-ghost { border:1px solid #ffffff42; background:#0808084d; }
.btn-ghost:hover { border-color:#fff; background:#ffffff0c; }
.play { border:1px solid #ffffff77; border-radius:50%; width:25px; height:25px; display:grid; place-items:center; font-size:8px; }
.hero-number { position:absolute; right:5vw; bottom:58px; z-index:2; font-family:var(--font-mono); font-size:18px; font-weight:700; letter-spacing:.14em; }
.hero-number span { color:#777; font-size:11px; }
.scroll-cue { position:absolute; z-index:3; left:5vw; bottom:46px; display:flex; align-items:center; gap:14px; writing-mode:vertical-rl; font-size:9px; letter-spacing:.25em; text-transform:uppercase; color:#777; }
.scroll-cue i { width:1px; height:52px; background:linear-gradient(#777,var(--red)); }
.proof { min-height:145px; display:grid; grid-template-columns:repeat(3,1fr) .8fr; padding:0 7vw; align-items:center; border-bottom:1px solid #202022; background:#09090a; }
.proof div { border-right:1px solid #232325; padding:18px 3vw; }
.proof strong { display:block; text-transform:uppercase; font-size:12px; letter-spacing:.08em; }
.proof span { color:#777; font-size:11px; display:block; margin-top:8px; }
.proof>p { font-size:14px; line-height:.88; font-weight:800; letter-spacing:.18em; text-align:right; color:#67676b; }
.proof b { color:var(--red); }
.section { padding:130px 7vw; }
.section-head { display:grid; grid-template-columns:1.4fr .6fr; gap:8vw; align-items:end; margin-bottom:64px; }
.section-head h2,.craft h2,.about h2,.contact h2 { font-size:clamp(45px,5.5vw,82px); }
.section-head>p,.craft-copy>p,.about>div>p,.contact>p { color:#949497; line-height:1.75; font-size:14px; max-width:520px; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.product-card { min-height:520px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:27px; border:1px solid #28282b; background:#101011; }
.product-card:after { content:""; position:absolute; inset:0; background:linear-gradient(125deg,transparent 20%,#ffffff0a 45%,transparent 60%); transform:translateX(-100%); transition:.7s; }
.product-card:hover:after { transform:translateX(100%); }
.product-card.titanium { background:linear-gradient(160deg,#241613,#09090a 70%); }
.product-card.black { background:linear-gradient(160deg,#181818,#070708 70%); }
.product-card.stainless { background:linear-gradient(160deg,#182025,#08090a 70%); }
.product-code { font-family:var(--font-mono); color:#7f7f82; font-size:9px; letter-spacing:.16em; }
.product-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 53%; opacity:.84; filter:saturate(.82) contrast(1.06); transition:transform .6s,opacity .4s; }
.product-card:before { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(180deg,#07070845 0%,transparent 30%,#0707080a 46%,#070708f5 100%); }
.product-card:hover .product-photo { transform:scale(1.035); opacity:.96; }
.product-card>.product-code { position:relative; z-index:2; color:#d2d2d2; }
.product-metal { height:255px; position:relative; transform:rotate(-8deg); }
.product-metal i { position:absolute; width:72%; height:112px; top:64px; left:11%; border-radius:58px 18px 18px 58px; background:linear-gradient(180deg,#707377,#1b1c1e 18%,#898b8c 44%,#171819 75%,#606165); border:1px solid #ffffff4a; box-shadow:0 25px 55px #000c; }
.product-metal i:before { content:""; position:absolute; left:-14px; top:8px; width:30px; height:94px; border-radius:50%; background:linear-gradient(90deg,#111,#a3a3a3,#1d1d1d); }
.product-metal b { position:absolute; width:33%; height:42px; top:97px; right:-3%; background:linear-gradient(#65676a,#1b1c1e,#777); border-radius:4px 25px 25px 4px; }
.racing .product-metal i { background:linear-gradient(180deg,#65686b,#151617 18%,#47494c 40%,#151617 70%,#6c2025); }
.custom .product-metal i { background:linear-gradient(180deg,#836739,#202123 20%,#7d6c49 45%,#171819 72%,#47767b); }
.product-info { border-top:1px solid #ffffff22; padding-top:20px; position:relative; z-index:2; }
.product-info h3 { margin:0; font-size:22px; text-transform:uppercase; }
.product-info p { margin:7px 0 0; color:#79797c; font-size:11px; }
.product-info .product-status { display:inline-block; margin-bottom:11px; color:#e5e5e5; font-family:var(--font-mono); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
.product-info .product-placeholder { max-width:280px; line-height:1.55; color:#a0a0a3; }
.product-info .product-consult { width:100%; height:44px; margin-top:17px; padding:0 14px; border:1px solid #ffffff42; display:flex; align-items:center; justify-content:space-between; color:#fff; font-family:var(--font-mono); font-size:9px; letter-spacing:.08em; text-transform:uppercase; transition:.2s; }
.product-info .product-consult:hover { background:var(--red); color:#fff; border-color:var(--red); }
.catalog-note { margin-top:18px; padding:28px 30px; border:1px solid #28282b; display:grid; grid-template-columns:.8fr 1.5fr auto; gap:25px; align-items:center; background:#101011; }
.catalog-note>span { color:#fff; font-size:17px; font-weight:700; text-transform:uppercase; }
.catalog-note p { margin:0; color:#858588; font-size:12px; line-height:1.65; }
.catalog-note a { padding:15px 18px; background:var(--red); color:#fff; font-family:var(--font-mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.gallery { background:#080809; }
.gallery-grid { display:grid; grid-template-columns:1.15fr .85fr .85fr; grid-template-rows:380px 380px; gap:16px; }
.gallery-item { position:relative; overflow:hidden; margin:0; background:#111; border:1px solid #252527; }
.gallery-item img { width:100%; height:100%; object-fit:cover; filter:saturate(.82) contrast(1.05); transition:transform .6s,filter .4s; }
.gallery-item:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 48%,#050505d9 100%); pointer-events:none; }
.gallery-item:hover img { transform:scale(1.025); filter:saturate(1) contrast(1.06); }
.gallery-1 { grid-row:1/3; }
.gallery-1 img { object-position:center; }
.gallery-2 { grid-column:2/4; }
.gallery-2 img { object-position:center 51%; }
.gallery-item figcaption { position:absolute; z-index:2; left:22px; right:22px; bottom:19px; display:flex; justify-content:space-between; color:#fff; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.gallery-item figcaption span { color:var(--red); font-family:var(--font-mono); }
.craft { display:grid; grid-template-columns:1fr 1fr; padding-top:60px; gap:9vw; align-items:center; background:var(--paper); color:#111; }
.craft-visual { min-height:640px; position:relative; }
.image-frame { position:absolute; inset:0 15% 0 0; background:linear-gradient(#0001,#0008),url('/zrc-titanium-angle.jpeg') center/cover; }
.craft-visual>p { position:absolute; bottom:30px; left:30px; margin:0; color:white; text-transform:uppercase; font-family:var(--font-mono); font-size:12px; line-height:1.7; }
.stamp { position:absolute; width:118px; height:118px; right:7%; top:40px; border:1px solid #111; border-radius:50%; display:grid; place-content:center; text-align:center; font-size:30px; line-height:.8; transform:rotate(8deg); background:var(--paper); }
.stamp b { font-family:var(--font-mono); font-size:8px; letter-spacing:.2em; color:var(--red); }
.craft .eyebrow { color:#5f5f62; }
.craft h2 em { -webkit-text-stroke:1px #111; }
.craft-copy>p { margin:34px 0; color:#5c5c5f; }
.text-link { display:inline-flex; align-items:center; gap:40px; font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; border-bottom:1px solid var(--red); padding-bottom:10px; }
.text-link span { color:var(--red); }
.craft dl { margin-top:70px; border-top:1px solid #c5c3bd; }
.craft dl div { padding:17px 0; border-bottom:1px solid #c5c3bd; display:grid; grid-template-columns:.45fr 1fr; }
.craft dt { text-transform:uppercase; font-weight:700; font-size:11px; letter-spacing:.08em; }
.craft dd { margin:0; color:#777; font-size:11px; }
.process { background:#0b0b0c; }
.section-head.compact { margin-bottom:40px; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #2a2a2d; border-bottom:1px solid #2a2a2d; }
.step-grid article { min-height:260px; padding:35px; border-right:1px solid #2a2a2d; position:relative; }
.step-grid article:last-child { border:0; }
.step-grid span { font-family:var(--font-mono); color:var(--red); font-size:10px; }
.step-grid h3 { margin:65px 0 14px; font-size:26px; text-transform:uppercase; }
.step-grid p { color:#7f7f82; font-size:12px; line-height:1.6; max-width:280px; }
.about { min-height:650px; position:relative; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:5vw; padding:110px 9vw; overflow:hidden; background:linear-gradient(90deg,#050505 0,#0b0b0bd9 55%,#0b0b0b),url('/zrc-installed.jpeg') 35% 62%/cover; }
.about-mark { font-size:clamp(170px,28vw,440px); line-height:.7; font-weight:900; font-style:italic; letter-spacing:-.13em; color:#ffffff08; position:absolute; left:-4vw; }
.about>div:last-child { grid-column:2; z-index:1; }
.about>div>p { margin-top:30px; }
.contact { text-align:center; min-height:630px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--paper); color:#111; }
.contact .eyebrow { color:#555; }
.contact h2 em { -webkit-text-stroke:1px #111; }
.contact>p { margin:30px auto; color:#666; }
.contact .btn-ghost { border-color:#aaa; background:transparent; }
.service-highlights { width:min(900px,100%); margin:5px auto 12px; display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #c9c9c9; text-align:left; }
.service-highlights div { min-height:126px; padding:21px 23px; display:flex; flex-direction:column; justify-content:center; border-right:1px solid #c9c9c9; }
.service-highlights div:last-child { border-right:0; }
.service-highlights small { font-family:var(--font-mono); font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:#777; }
.service-highlights strong { margin:9px 0; font-size:16px; text-transform:uppercase; }
.service-highlights span { color:#6e6e6e; font-size:10px; line-height:1.55; }
.workshop-cards { width:min(900px,100%); margin:4px auto 28px; display:grid; grid-template-columns:repeat(2,1fr); gap:12px; text-align:left; }
.workshop-cards a { min-height:132px; padding:23px 25px; border:1px solid #c9c9c9; display:flex; flex-direction:column; justify-content:center; color:#111; transition:.25s; }
.workshop-cards a:hover { background:#111; color:#fff; border-color:#111; transform:translateY(-3px); }
.workshop-cards small { font-family:var(--font-mono); font-size:8px; letter-spacing:.12em; text-transform:uppercase; opacity:.6; }
.workshop-cards strong { margin:10px 0 12px; font-size:20px; text-transform:uppercase; }
.workshop-cards span { font-size:11px; opacity:.65; }
footer { display:grid; grid-template-columns:1.2fr .6fr .6fr 1fr; gap:5vw; padding:80px 7vw 35px; background:#070708; border-top:1px solid #242426; }
.footer-brand img { width:150px; height:85px; object-fit:contain; }
.footer-brand p { color:#707074; font-size:12px; line-height:1.6; }
footer>div:not(.footer-brand) { display:flex; flex-direction:column; gap:13px; }
footer>div>p { color:#626266; text-transform:uppercase; font-family:var(--font-mono); letter-spacing:.15em; font-size:9px; margin:0 0 10px; }
footer>div>a { font-size:12px; color:#c2c2c4; }
footer small { grid-column:1/3; color:#4c4c50; font-size:9px; padding-top:55px; }
footer small.push { grid-column:3/5; text-align:right; color:#777; letter-spacing:.2em; }
@media (max-width:900px) {
  .site-header { height:78px; grid-template-columns:1fr auto; padding:0 22px; }.brand img { width:105px; }nav { display:none; }.header-cta { font-size:10px; }
  .hero { min-height:760px; }.hero-bg { background-position:66% center; }.hero-content { margin-left:7vw; padding-top:60px; }h1 { font-size:clamp(54px,14vw,80px); }.hero-copy { max-width:82vw; font-size:14px; }.scroll-cue { display:none; }.hero-number { right:25px; bottom:25px; }
  .proof { grid-template-columns:1fr 1fr; padding:25px; }.proof div { min-height:90px; padding:20px 12px; border-bottom:1px solid #232325; }.proof>p { padding-right:12px; }
  .section { padding:90px 24px; }.section-head { grid-template-columns:1fr; gap:25px; }.product-grid { grid-template-columns:1fr; }.product-card { min-height:560px; }.catalog-note { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:560px 360px 360px; }.gallery-1 { grid-column:1/3; grid-row:auto; }.gallery-2 { grid-column:1/3; }.gallery-3,.gallery-4 { grid-column:auto; }
  .craft { grid-template-columns:1fr; gap:70px; }.craft-visual { min-height:520px; }.craft dl { margin-top:50px; }
  .step-grid { grid-template-columns:1fr; }.step-grid article { min-height:220px; border-right:0; border-bottom:1px solid #2a2a2d; }
  .about { grid-template-columns:1fr; padding:100px 24px; min-height:600px; }.about>div:last-child { grid-column:1; }
  footer { grid-template-columns:1fr 1fr; }.footer-brand,.footer-contact { grid-column:1/3; }footer small { grid-column:1/2; }footer small.push { grid-column:2/3; }
}
@media (max-width:520px) { .hero-actions .btn { width:100%; }.proof { grid-template-columns:1fr; }.proof div { border-right:0; }.proof>p { text-align:left; padding-left:12px; }.product-card { min-height:510px; }.gallery-grid { display:flex; flex-direction:column; }.gallery-item { height:500px; }.craft-visual { min-height:430px; }.image-frame { right:7%; }.stamp { right:0; width:95px; height:95px; }.service-highlights,.workshop-cards { grid-template-columns:1fr; }.service-highlights div { border-right:0; border-bottom:1px solid #c9c9c9; }.service-highlights div:last-child { border-bottom:0; }footer { gap:45px 25px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }* { transition:none!important; } }
