:root { --ink:#171914; --paper:#f4f1e9; --muted:#686960; --copper:#c86233; --sand:#d8d0c0; --line:rgba(23,25,20,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,Arial,sans-serif; }
.page-grain { position:fixed; inset:0; opacity:.13; pointer-events:none; z-index:20; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E"); }
.topbar { height:94px; width:100%; position:absolute; z-index:3; top:0; padding:0 5vw; display:flex; align-items:center; gap:42px; color:#fff; }
.brand { color:inherit; display:flex; align-items:center; gap:11px; text-decoration:none; line-height:.9; flex:none; }
.brand-mark { font-family:Oswald,sans-serif; border:2px solid currentColor; border-radius:50%; display:grid; place-items:center; width:43px; height:43px; font-size:18px; font-weight:700; letter-spacing:-1.5px; }
.brand-logo-circle { width:48px; height:48px; flex:0 0 48px; display:grid; place-items:center; overflow:hidden; background:#fff; border-radius:50%; box-shadow:0 2px 10px rgba(0,0,0,.2); }
.brand-logo { display:block; width:42px !important; max-width:42px !important; height:42px !important; max-height:42px !important; object-fit:contain; transform:scale(1.22); }
.brand-name { font-size:9px; letter-spacing:2px; font-weight:800; }
.main-nav { display:flex; justify-content:center; gap:31px; flex:1; }
.main-nav a, footer a { text-decoration:none; color:inherit; font-size:14px; font-weight:700; letter-spacing:.3px; }
.main-nav a { opacity:.72; transition:opacity .25s; }.main-nav a:hover,.main-nav a.active { opacity:1; }
.button { border:0; display:inline-flex; justify-content:center; align-items:center; gap:22px; min-height:52px; padding:0 23px; text-decoration:none; font:700 12px Manrope,sans-serif; letter-spacing:.5px; text-transform:uppercase; cursor:pointer; transition:transform .2s, background .2s; }.button:hover{transform:translateY(-2px)}
.button span { font-size:17px; font-weight:400; }.button-outline { color:#fff; border:1px solid rgba(255,255,255,.58); }.button-copper { color:#fff; background:var(--copper); }.button-light { color:var(--ink); background:var(--paper); }.button-outline-light { color:#fff; border:1px solid rgba(255,255,255,.65); }
.hero { min-height:100vh; min-height:730px; color:#fff; padding:150px 8.1vw 40px; position:relative; display:flex; align-items:center; overflow:hidden; background:#162025 url('basalt-hero.png') center center / cover no-repeat; }.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,13,14,.74) 0%,rgba(11,14,13,.47) 34%,transparent 69%),linear-gradient(0deg,rgba(6,7,5,.45),transparent 38%); }
.hero-content,.hero-footer,.hero-index { z-index:1; position:relative; }.hero-content { max-width:670px; margin-top:50px; }.eyebrow { margin:0 0 20px; text-transform:uppercase; font:500 10px 'DM Mono',monospace; letter-spacing:2px; }.eyebrow span { display:inline-block; background:currentColor; width:27px; height:1px; vertical-align:middle; margin-right:9px; }
h1,h2,h3,p { margin-top:0; } h1,h2,h3 { font-family:Oswald,Impact,sans-serif; font-weight:600; text-transform:uppercase; line-height:.95; letter-spacing:-1px; }h1 { font-size:clamp(62px,8.7vw,132px); margin-bottom:27px; } h1 em,h2 em { color:var(--copper); font-style:normal; } .hero-description { max-width:465px; font-size:16px; line-height:1.7; color:rgba(255,255,255,.82); }.hero-description strong { color:#fff; }.hero-actions { margin-top:34px; display:flex; gap:25px; align-items:center; }.play-link { border:0; padding:0; background:transparent; color:#fff; text-transform:uppercase; font:700 11px Manrope,sans-serif; letter-spacing:1px; cursor:pointer; display:flex; align-items:center; gap:9px; }.play-icon { border:1px solid #fff; width:33px; height:33px; display:grid; place-items:center; border-radius:50%; font-size:10px; padding-left:1px; }
.hero-footer { position:absolute; bottom:36px; left:8.1vw; right:8.1vw; display:flex; justify-content:flex-end; font:500 10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:1.2px; color:rgba(255,255,255,.76); }.hero-footer a { color:inherit; text-decoration:none; }.hero-footer span { color:var(--copper); margin-left:10px; font-size:15px; }.hero-index { position:absolute; right:3.1vw; bottom:35px; display:flex; gap:7px; align-items:center; font:10px 'DM Mono'; }.hero-index i { width:53px; height:1px; background:rgba(255,255,255,.55); }
.section-padding { padding:132px 8.1vw; }.section-label { color:#72746a; font:500 10px 'DM Mono',monospace; letter-spacing:1.3px; text-transform:uppercase; display:flex; gap:15px; align-items:center; }.section-label span { color:var(--copper); }.section-label.light { color:rgba(255,255,255,.64); }
.models { background:#d9d2c4; }.models-heading { display:grid; grid-template-columns:1.1fr .63fr; gap:80px; align-items:end; margin:70px 0 64px; }.models-heading h2 { margin:0; font-size:clamp(50px,6.4vw,92px); }.models-heading p { margin:0 0 7px; color:#5c5e55; font-size:17px; line-height:1.8; }.model-selector { display:grid; grid-template-columns:1.4fr .8fr .8fr; gap:1px; background:rgba(23,25,20,.2); border:1px solid rgba(23,25,20,.2); }.model-card { position:relative; min-height:427px; border:0; padding:26px; background:#c5beb1; color:var(--ink); text-align:left; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; }.model-card-active { cursor:pointer; color:#fff; background:#272b25; }.model-card-active img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }.model-card-active:hover img { transform:scale(1.04); }.model-card-overlay { position:absolute; inset:0; background:linear-gradient(0deg,rgba(9,12,10,.88),rgba(9,12,10,.08) 68%); }.model-card-future { background:linear-gradient(145deg,#cdc5b7 0%,#aaa79c 100%); }.model-card-future::after { content:""; position:absolute; width:110%; height:1px; background:rgba(23,25,20,.16); transform:rotate(-38deg); top:49%; left:-7%; }.model-status { position:relative; z-index:1; align-self:flex-start; border:1px solid currentColor; padding:7px 9px; font:500 9px 'DM Mono'; text-transform:uppercase; letter-spacing:.7px; }.model-copy { position:relative; z-index:1; display:flex; flex-direction:column; gap:9px; }.model-copy small { font:500 10px 'DM Mono'; text-transform:uppercase; letter-spacing:1px; }.model-copy strong { font:600 clamp(50px,5vw,74px) Oswald,sans-serif; text-transform:uppercase; line-height:.86; letter-spacing:-1px; }.model-copy em { font:700 10px Manrope,sans-serif; font-style:normal; text-transform:uppercase; letter-spacing:.8px; }.model-copy b { font-size:18px; margin-left:8px; color:var(--copper); }
.intro-grid { display:grid; grid-template-columns:1.2fr .8fr; align-items:end; margin:78px 0 91px; gap:80px; }.intro h2,.features h2,.specs h2,.journey h2,.contact h2,.manifesto h2 { font-size:clamp(50px,6.4vw,92px); margin-bottom:0; }.intro-copy { max-width:420px; }.intro-copy p,.feature-heading p,.journey-copy>p:not(.eyebrow),.contact-copy>p:not(.eyebrow),.manifesto-card>p:not(.eyebrow) { font-size:17px; line-height:1.8; color:#5c5e55; }.text-link { color:var(--ink); display:inline-flex; gap:20px; border-bottom:1px solid var(--ink); text-decoration:none; padding-bottom:8px; text-transform:uppercase; font:700 12px Manrope,sans-serif; letter-spacing:1px; margin-top:20px; }.text-link span { color:var(--copper); font-size:17px; line-height:9px; }.stats { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); }.stats article { min-height:112px; padding:24px 20px 0 0; display:flex; align-items:flex-start; gap:16px; border-right:1px solid var(--line); }.stats article+article { padding-left:32px; }.stats article:last-child { border:0; }.stats strong { color:var(--copper); font:500 40px Oswald,sans-serif; line-height:1; }.stats span { font:500 11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.8px; line-height:1.5; }
.manifesto { background:#1b1e1a; min-height:690px; color:var(--paper); position:relative; display:flex; align-items:center; overflow:hidden; }.manifesto-image { position:absolute; inset:0; background:linear-gradient(90deg,rgba(22,24,20,.25),rgba(22,24,20,.9)),url('basalt-hero.png') center / cover; filter:grayscale(1) contrast(1.1); opacity:.64; }.manifesto-card { margin-left:auto; margin-right:8.1vw; width:min(490px,46vw); position:relative; padding:58px; background:#242821; }.manifesto-card h2 { font-size:75px; }.manifesto-card h2 em { color:#d4d0c8; }.manifesto-card>p:not(.eyebrow) { color:#d1d0c9; }.manifesto-card .button { margin-top:18px; }
.features { background:#e2ddd1; }.feature-heading { margin:72px 0 82px; display:grid; grid-template-columns:1.1fr .62fr; gap:80px; align-items:end; }.feature-heading p { margin-bottom:7px; }.feature-list { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(23,25,20,.2); border:1px solid rgba(23,25,20,.2); }.feature { min-height:305px; padding:27px; background:#e2ddd1; display:grid; grid-template-rows:auto 1fr; position:relative; }.feature-wide { grid-row:span 2; min-height:611px; background:#e8e3d8; }.feature-number { font:11px 'DM Mono'; color:var(--copper); }.feature h3 { font-size:clamp(42px,4vw,64px); align-self:end; margin:35px 0 16px; }.feature p { font-size:14px; max-width:290px; line-height:1.7; margin:0; color:#595a53; }.feature-arrow { position:absolute; right:27px; bottom:27px; color:var(--copper); font-size:24px; }
.specs { background:#20231f; color:var(--paper); }.specs-top { display:flex; align-items:end; justify-content:space-between; margin:67px 0 72px; gap:30px; }.specs h2 em { color:#c8c4b8; }.spec-grid { display:grid; grid-template-columns:repeat(3,1fr); border-left:1px solid rgba(255,255,255,.15); border-top:1px solid rgba(255,255,255,.15); }.spec-grid article { min-height:140px; padding:25px 24px; border-right:1px solid rgba(255,255,255,.15); border-bottom:1px solid rgba(255,255,255,.15); display:flex; flex-direction:column; justify-content:space-between; }.spec-grid span { color:#aaa99f; font:11px 'DM Mono'; letter-spacing:.5px; text-transform:uppercase; }.spec-grid strong { font:500 25px Oswald,sans-serif; text-transform:uppercase; letter-spacing:.15px; }.basalt-layout { margin-top:66px; padding:42px 0 0; border-top:1px solid rgba(255,255,255,.15); display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:60px; }.basalt-layout h3 { font-size:clamp(40px,4vw,63px); margin:0 0 18px; }.basalt-layout p:not(.eyebrow) { margin:0; max-width:330px; font-size:15px; line-height:1.75; color:#c7c6bd; }.basalt-layout img { width:100%; min-height:290px; object-fit:contain; background:#111410; }.spec-note { margin:25px 0 0; color:#aaa99f; font-size:11px; max-width:700px; line-height:1.6; }
.journey { min-height:640px; display:grid; grid-template-columns:1fr 1fr; background:linear-gradient(122deg,#dad3c4 0%,#ded6c8 55%,#a8a69a 55%,#b7b5aa 100%); }.journey-copy { padding:116px 8.1vw; }.journey-copy h2 { font-size:clamp(58px,6.1vw,90px); margin:22px 0; }.journey-copy h2 em { color:#3b4438; }.journey-copy>p:not(.eyebrow) { max-width:390px; }.journey-quote { align-self:end; padding:0 7vw 95px; color:#fff; }.journey-quote span { display:block; font:100px Georgia,serif; height:53px; color:var(--copper); }.journey-quote p { text-transform:uppercase; font:600 clamp(25px,3vw,45px) Oswald,sans-serif; line-height:1.05; }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:var(--paper); }.contact h2 { margin:21px 0 28px; }.contact h2 em { color:#607057; }.contact-copy>p:not(.eyebrow) { max-width:405px; }.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:25px 22px; align-content:start; }.contact-form label { color:#5a5c53; font:500 11px 'DM Mono'; letter-spacing:.8px; text-transform:uppercase; }.contact-form input,.contact-form select { appearance:none; width:100%; display:block; border:0; border-bottom:1px solid #b4b1a8; padding:14px 0 12px; outline:0; background:transparent; color:var(--ink); font:500 15px Manrope,sans-serif; }.contact-form input:focus,.contact-form select:focus { border-color:var(--copper); }.contact-form input::placeholder { color:#9b9b91; }.contact-form .button,.form-note { grid-column:span 2; }.contact-form .button { margin-top:12px; justify-self:start; }.form-note { font-size:11px; line-height:1.6; color:#7a7a70; margin:0; }
footer { background:#141612; color:#f0ede6; min-height:240px; padding:50px 8.1vw 25px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; align-items:start; } footer>p { font:500 19px Oswald,sans-serif; text-transform:uppercase; letter-spacing:.5px; margin:8px 0; } .footer-links { display:flex; gap:22px; justify-content:flex-end; padding-top:8px; } .footer-links a { font-size:10px; text-transform:uppercase; letter-spacing:1px; } .footer-email { grid-column:1/-1; color:#f0ede6; text-decoration:none; font:500 13px 'DM Mono',monospace; letter-spacing:.3px; margin-top:7px; } footer small { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.15); padding-top:18px; margin-top:18px; font:9px 'DM Mono'; color:#b3b3aa; }
.menu-toggle { display:none; }.story-dialog { color:#fff; border:0; width:min(760px,calc(100% - 32px)); min-height:380px; background:#1e241f url('basalt-hero.png') center / cover; }.story-dialog::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }.story-dialog>div { position:relative; z-index:1; padding:75px 8%; max-width:520px; }.story-dialog::after { content:""; position:absolute; inset:0; background:rgba(19,24,19,.74); }.story-dialog h2 { font-size:55px; margin:0 0 20px; }.story-dialog p:not(.eyebrow) { font-size:14px; line-height:1.7; }.dialog-close { position:absolute; z-index:2; top:15px; right:18px; border:0; color:#fff; background:transparent; font-size:32px; cursor:pointer; }.toast { position:fixed; right:22px; bottom:22px; z-index:25; max-width:340px; padding:18px 20px; background:#20251e; color:#fff; box-shadow:0 8px 30px rgba(0,0,0,.2); font-size:12px; line-height:1.5; transform:translateY(130%); transition:transform .3s; }.toast.show { transform:translateY(0); }
@media (max-width:800px) { .topbar { height:78px; padding:0 6vw; justify-content:space-between; }.main-nav,.header-cta { display:none; }.menu-toggle { display:block; width:40px; height:40px; padding:9px 4px; border:0; background:transparent; }.menu-toggle span { background:#fff; width:100%; height:1px; display:block; margin:7px 0; }.main-nav.open { display:flex; flex-direction:column; align-items:flex-end; gap:19px; position:absolute; top:75px; right:5vw; padding:24px; background:#1b1f1a; }.hero { min-height:690px; padding:105px 7vw 82px; align-items:center; background-position:62% center; }.hero::after{background:linear-gradient(90deg,rgba(8,13,14,.79),rgba(8,13,14,.18)),linear-gradient(0deg,rgba(6,7,5,.55),transparent 45%);}.hero-content { margin-top:20px; }.hero-description { max-width:325px; }.hero-actions { flex-wrap:wrap; }.hero-footer { left:7vw; right:7vw; bottom:22px; justify-content:flex-start; }.hero-footer p { display:none; }.hero-index { display:none; }.section-padding { padding:83px 7vw; }.intro-grid,.feature-heading,.contact { grid-template-columns:1fr; gap:31px; margin:45px 0 59px; }.intro h2,.features h2,.specs h2,.journey h2,.contact h2 { font-size:clamp(50px,13vw,74px); }.stats { grid-template-columns:1fr; }.stats article { min-height:78px; padding:18px 0; border-right:0; border-bottom:1px solid var(--line); }.stats article+article { padding-left:0; }.stats article:last-child { border-bottom:0; }.manifesto { min-height:720px; align-items:end; }.manifesto-card { width:100%; margin:0; padding:43px 7vw 50px; }.manifesto-card h2 { font-size:60px; }.feature-heading { margin:47px 0; }.feature-list { grid-template-columns:1fr; }.feature,.feature-wide { min-height:250px; grid-row:auto; }.specs-top { display:block; margin:48px 0; }.specs-top .button { margin-top:27px; }.spec-grid { grid-template-columns:1fr 1fr; }.spec-grid article { min-height:125px; padding:20px 14px; }.spec-grid strong { font-size:18px; }.journey { grid-template-columns:1fr; min-height:auto; background:linear-gradient(155deg,#ded5c5 0%,#ded5c5 56%,#aeb0a3 56%,#b9b7ac 100%); }.journey-copy { padding:83px 7vw 45px; }.journey-quote { padding:50px 7vw 75px; }.contact { gap:53px; }.contact-form { gap:22px; }.contact-form label { grid-column:span 2; }.contact-form .button { width:100%; }.form-note { grid-column:span 2; } footer { grid-template-columns:1fr; padding:42px 7vw 22px; } footer>div { justify-content:flex-start; } footer small { margin-top:22px; } }

@media (max-width:800px) { .models-heading,.basalt-layout { grid-template-columns:1fr; gap:29px; }.models-heading { margin:45px 0; }.models-heading h2 { font-size:clamp(50px,13vw,74px); }.model-selector { grid-template-columns:1fr; }.model-card { min-height:285px; }.model-card-future { min-height:190px; }.model-copy strong { font-size:57px; }.basalt-layout { margin-top:48px; padding-top:34px; }.basalt-layout img { min-height:210px; }.hero-description { font-size:15px; } }