:root { --ink:#11110f; --ink-soft:#1b1a16; --paper:#ebe7dc; --gold:#c79b43; --gold-pale:#e7c87d; --mist:#aaa69d; --wine:#481b1b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:"Be Vietnam Pro",sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.page-grain { position:fixed; inset:0; opacity:.11; pointer-events:none; z-index:5; 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='.58'/%3E%3C/svg%3E"); }
.site-header { position:absolute; top:0; left:0; right:0; z-index:3; display:flex; align-items:center; justify-content:space-between; max-width:1440px; margin:auto; padding:28px 5.5vw; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; }
.wordmark { display:inline-flex; align-items:center; color:var(--gold-pale); text-transform:uppercase; }
.wordmark-title { position:relative; display:block; padding:3px 2px 8px 0; font-family:"Cinzel","Noto Serif Display",serif; font-size:clamp(.92rem,1.42vw,1.38rem); font-weight:800; line-height:1; letter-spacing:.105em; white-space:nowrap; text-shadow:0 1px 0 rgba(255,248,222,.15),0 4px 18px rgba(0,0,0,.34); }
.wordmark-title::after { content:""; position:absolute; right:0; bottom:0; left:8%; height:2px; background:linear-gradient(90deg,transparent,rgba(231,200,125,.95) 20%,rgba(231,200,125,.28)); }
nav { display:flex; gap:32px; color:#d2cbbd; } nav a,.header-link { transition:color .25s ease; } nav a:hover,.header-link:hover { color:var(--gold-pale); }
.hero { position:relative; min-height:770px; overflow:hidden; display:grid; grid-template-columns:minmax(320px,.9fr) minmax(460px,1.2fr); align-items:center; background:radial-gradient(circle at 52% 50%,#242116 0%,var(--ink) 58%); }
.hero-copy { position:relative; z-index:2; padding:150px 3vw 80px max(5.5vw,32px); max-width:670px; }
.eyebrow,.section-kicker { margin:0 0 22px; color:var(--gold-pale); font-size:.7rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow { display:flex; gap:10px; align-items:center; }.eyebrow span { display:block; width:28px; height:1px; background:var(--gold); }
h1,h2,h3 { margin:0; font-family:"Noto Serif Display",Georgia,serif; font-weight:600; line-height:1.02; letter-spacing:-.035em; } h1 { max-width:620px; font-size:clamp(4.2rem,7.6vw,8.4rem); } h1 em,h2 em { color:var(--gold-pale); font-weight:500; }
.hero-intro { max-width:430px; margin:34px 0 27px; color:#d5d0c5; font-size:1rem; line-height:1.8; }
.text-link { display:inline-flex; gap:12px; align-items:center; padding-bottom:7px; border-bottom:1px solid rgba(231,200,125,.65); color:var(--gold-pale); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; transition:gap .25s; }.text-link:hover { gap:18px; }
.hero-figure { position:absolute; right:0; inset-block:0; width:61%; margin:0; }.hero-figure:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--ink) 0%,transparent 30%,rgba(17,17,15,.04) 100%),linear-gradient(0deg,rgba(17,17,15,.38),transparent 40%); }.hero-figure img { width:100%; height:100%; object-fit:cover; object-position:68% center; filter:saturate(.85) contrast(1.04); }.hero-figure figcaption { position:absolute; right:7%; bottom:36px; z-index:1; color:rgba(234,228,215,.65); font-size:.67rem; letter-spacing:.13em; text-transform:uppercase; writing-mode:vertical-rl; }
.statement { padding:150px 5.5vw 110px; background:var(--paper); color:var(--ink); }.statement .section-kicker { color:#936c26; }.statement-grid { display:grid; grid-template-columns:1.05fr .75fr; gap:8vw; }.statement h2,.legends h2,.materials h2,.closing h2 { font-size:clamp(3.5rem,6vw,6.6rem); }.statement-grid p { margin:6px 0 22px; color:#2e2c27; }.statement-grid .quiet { color:#807a70; }
.measurements { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:92px; padding-top:23px; border-top:1px solid #c8c1b1; }.measurements div { display:grid; gap:4px; }.measurements span { color:#7d7569; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }.measurements strong { font-family:"Noto Serif Display",Georgia,serif; font-size:1.9rem; font-weight:600; }.measurements small { color:#777166; font-size:.75rem; }
.pieces { padding:145px 5.5vw; background:#11110f; }.pieces-heading { display:flex; align-items:end; justify-content:space-between; gap:5vw; margin-bottom:54px; }.pieces-heading h2 { font-size:clamp(3.5rem,6vw,6.6rem); }.pieces-heading>p { max-width:350px; margin:0 0 8px; color:#aaa69d; }.piece-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:500px; gap:18px; }.piece-card { position:relative; min-height:0; overflow:hidden; background:#27241e; }.piece-card img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform .65s ease,filter .65s ease; }.piece-card .piece-king-image { object-position:center 20%; }.piece-card:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(7,7,6,.95) 0%,rgba(7,7,6,.08) 63%,rgba(7,7,6,.08) 100%); }.piece-card:hover img { transform:scale(1.045); filter:brightness(1.08); }.piece-card>div { position:absolute; z-index:1; inset:auto 28px 25px; }.piece-card span { color:var(--gold-pale); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; }.piece-card h3 { margin-top:5px; font-size:2.5rem; }.piece-card p { margin:8px 0 0; color:#d0cbc0; font-size:.8rem; line-height:1.6; }
.legends { display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; padding:145px 5.5vw; background:#181713; }.legends-heading { max-width:480px; }.legends-heading>p:last-child { margin:30px 0 0; color:#aaa69d; }.legend-list { border-top:1px solid #4e493d; }.legend-card { position:relative; display:grid; grid-template-columns:48px 1fr 34px; gap:17px; padding:28px 0 25px; border-bottom:1px solid #4e493d; transition:padding .3s,background .3s; }.legend-card:hover,.legend-card.active { padding-left:18px; padding-right:18px; background:#232017; }.legend-number { color:var(--gold); font-size:.7rem; letter-spacing:.1em; }.legend-card h3 { font-size:2.2rem; }.legend-card p { max-width:430px; margin:14px 0 0; color:#aaa69d; font-size:.86rem; line-height:1.7; }.legend-card button { align-self:start; border:0; padding:0; background:none; color:var(--gold-pale); font-size:1.35rem; cursor:pointer; }
.materials { padding:145px 5.5vw; background:#d7d3ca; color:var(--ink); }.material-intro { display:grid; grid-template-columns:1fr 1.15fr .85fr; gap:4vw; align-items:end; }.material-intro .section-kicker { align-self:start; color:#937030; }.material-intro p:last-child { margin:0 0 8px; color:#5d5951; }.material-pair { display:grid; grid-template-columns:1fr; margin-top:62px; }.material-card { position:relative; min-height:430px; overflow:hidden; padding:38px; display:flex; flex-direction:column; justify-content:flex-end; isolation:isolate; }.gold-card { background:linear-gradient(135deg,#241c10,#70521f 43%,#201b12 100%); color:#f4ebd8; }.material-sheen { position:absolute; z-index:-1; inset:-20%; background:linear-gradient(112deg,transparent 32%,rgba(255,255,255,.34) 46%,transparent 59%); transform:rotate(-10deg); }.material-index { position:absolute; top:28px; right:34px; color:rgba(255,255,255,.7); font-family:"Noto Serif Display",Georgia,serif; font-size:1.7rem; }.material-card h3 { font-size:4rem; }.material-card>p:not(.material-index) { max-width:360px; margin:12px 0 18px; font-size:.88rem; }.material-note { color:rgba(255,255,255,.68); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; }
.case-study { display:grid; grid-template-columns:1fr 1fr; background:#23211d; }.case-photo { min-height:650px; }.case-photo img { width:100%; height:100%; object-fit:cover; }.case-copy { display:flex; flex-direction:column; justify-content:center; padding:8vw; }.case-copy h2 { font-size:clamp(3.5rem,5.2vw,5.8rem); }.case-copy>p:not(.section-kicker) { max-width:370px; color:#bcb6ab; }.case-copy dl { margin:20px 0 0; border-top:1px solid #4d493f; }.case-copy dl div { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid #4d493f; }.case-copy dt { color:#aca69a; font-size:.76rem; }.case-copy dd { margin:0; font-family:"Noto Serif Display",Georgia,serif; font-size:1.35rem; }
.technical-note { margin-top:18px !important; color:#948e83 !important; font-size:.72rem; line-height:1.7; }
.craft { padding:135px 5.5vw; background:var(--ink-soft); }.craft-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:7vw; align-items:end; }.craft-lead { max-width:680px; margin:0; font-family:"Noto Serif Display",Georgia,serif; font-size:clamp(2.25rem,4.2vw,4.5rem); line-height:1.12; }.craft-points { border-top:1px solid #4a463d; }.craft-points p { display:flex; gap:18px; margin:0; padding:17px 0; border-bottom:1px solid #4a463d; color:#d1cbbb; font-size:.85rem; }.craft-points span { color:var(--gold); font-size:.7rem; }
.closing { padding:145px 5.5vw 150px; text-align:center; background:radial-gradient(circle at 50% 110%,#4b3517 0%,#1c1a14 38%,var(--ink) 74%); }.closing .section-kicker { color:var(--gold-pale); }.closing h2 { font-size:clamp(4rem,7vw,7.6rem); }.closing>p { max-width:440px; margin:28px auto; color:#aaa69d; font-size:.91rem; }.closing .text-link { margin-top:10px; }
footer { display:flex; justify-content:space-between; padding:22px 5.5vw; border-top:1px solid #343128; color:#858074; font-size:.67rem; letter-spacing:.08em; text-transform:uppercase; }
@media (max-width:800px) { .site-header { padding:20px 24px; }.site-header nav { display:none; }.header-link { font-size:.65rem; }.hero { min-height:750px; display:block; }.hero-copy { padding:150px 25px 62px; }.hero-figure { width:100%; opacity:.6; }.hero-figure:after { background:linear-gradient(90deg,rgba(17,17,15,.76),rgba(17,17,15,.15)),linear-gradient(0deg,rgba(17,17,15,.7),transparent 50%); }.statement,.pieces,.legends,.materials,.craft,.closing { padding:95px 25px; }.statement-grid,.legends,.material-intro,.craft-grid,.case-study { grid-template-columns:1fr; gap:32px; }.pieces-heading { display:block; margin-bottom:34px; }.pieces-heading>p { margin-top:22px; }.piece-gallery { grid-template-columns:1fr; grid-auto-rows:460px; }.piece-card { min-height:0; }.measurements { grid-template-columns:1fr; gap:25px; margin-top:58px; }.material-intro .section-kicker { margin-bottom:0; }.material-pair { grid-template-columns:1fr; margin-top:42px; }.material-card { min-height:360px; padding:28px; }.case-photo { min-height:450px; }.case-copy { padding:75px 25px; }.legends-heading { max-width:none; }.legend-card { grid-template-columns:35px 1fr 25px; }.legend-card h3 { font-size:1.9rem; }.closing { padding-bottom:100px; } footer { flex-direction:column; gap:8px; padding:20px 25px; } }