:root {
  --black: #080808;
  --black-2: #11100e;
  --gold: #d9a441;
  --gold-light: #f2d080;
  --cream: #f7f1e5;
  --muted: #a9a29a;
  --line: rgba(217,164,65,.25);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Montserrat", Arial, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--black); color: var(--cream); font-family: var(--sans); line-height: 1.7; }
a { color: inherit; text-decoration: none; }
.topbar { text-align:center; padding:9px 20px; background:#000; border-bottom:1px solid var(--line); color:var(--gold-light); font-size:10px; letter-spacing:2.5px; }
.header { position:sticky; top:0; z-index:20; height:88px; padding:10px 5vw; display:flex; align-items:center; justify-content:space-between; background:rgba(8,8,8,.94); backdrop-filter:blur(12px); border-bottom:1px solid rgba(255,255,255,.06); }
.brand img { width:130px; height:62px; object-fit:cover; object-position:center; border-radius:3px; }
.nav { display:flex; gap:34px; font-size:11px; text-transform:uppercase; letter-spacing:2px; color:#d9d2c8; }
.nav a { transition:.25s; }
.nav a:hover { color:var(--gold-light); }
.menu { display:none; border:0; background:none; color:var(--cream); font-size:25px; cursor:pointer; }
.hero { min-height:calc(100vh - 120px); padding:10vh 8vw; display:flex; align-items:center; position:relative; overflow:hidden; background:
radial-gradient(circle at 75% 45%, rgba(184,125,29,.12), transparent 30%),
linear-gradient(115deg,#050505 0%,#0d0c0a 55%,#060606 100%); }
.hero::before { content:""; position:absolute; inset:7%; border:1px solid rgba(217,164,65,.14); pointer-events:none; }
.hero-content { position:relative; z-index:2; max-width:720px; }
.eyebrow { color:var(--gold-light); font-size:10px; letter-spacing:4px; font-weight:600; margin-bottom:18px; }
h1,h2,h3 { font-family:var(--serif); font-weight:600; line-height:.95; }
h1 { font-size:clamp(64px,9vw,132px); letter-spacing:-3px; }
h1 span { color:var(--gold-light); font-style:italic; }
.hero-copy { max-width:560px; color:#bdb6ad; font-size:15px; margin:30px 0 34px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.btn { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:0 25px; text-transform:uppercase; letter-spacing:1.7px; font-size:10px; font-weight:600; transition:.25s; }
.btn-gold { background:var(--gold); color:#0a0805; }
.btn-gold:hover { background:var(--gold-light); transform:translateY(-2px); }
.btn-outline { border:1px solid rgba(242,208,128,.6); color:var(--gold-light); }
.btn-outline:hover { background:rgba(242,208,128,.08); }
.hero-mark { position:absolute; right:8vw; bottom:2vh; font:700 50vw/.8 var(--serif); color:rgba(217,164,65,.035); user-select:none; }
.intro { padding:120px 10vw; text-align:center; max-width:950px; margin:auto; }
.intro h2,.section-heading h2,.story h2,.why h2,.contact h2 { font-size:clamp(42px,5vw,72px); }
.intro > p:last-child { color:#aaa39a; max-width:650px; margin:28px auto 0; font-size:14px; }
.collections { padding:90px 7vw 120px; background:#0c0b09; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:55px; }
.section-heading > p { max-width:330px; color:#99928a; font-size:13px; }
.collection-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.card { min-height:330px; padding:28px; display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(145deg,#191713,#0d0c0a); border:1px solid rgba(255,255,255,.06); transition:.3s; }
.card:hover { transform:translateY(-5px); border-color:var(--line); }
.card-large { grid-column:span 2; min-height:420px; }
.card-dark { background:#050505; }
.card-art { font:80px/1 var(--serif); color:var(--gold); opacity:.8; }
.card-art.bamboo { font-size:110px; transform:rotate(-15deg); }
.card span { color:var(--gold); font-size:10px; letter-spacing:2px; }
.card h3 { font-size:31px; margin:8px 0; }
.card p { color:#8e8982; font-size:12px; max-width:360px; }
.story { padding:130px 10vw; display:grid; grid-template-columns:1fr 1fr; gap:9vw; align-items:center; }
.story-image { min-height:520px; display:grid; place-items:center; background:radial-gradient(circle,rgba(217,164,65,.18),transparent 50%), #0e0d0b; border:1px solid var(--line); }
.image-frame { width:68%; height:72%; border:1px solid rgba(217,164,65,.45); display:flex; flex-direction:column; justify-content:center; align-items:center; position:relative; }
.image-frame::before,.image-frame::after { content:""; position:absolute; width:18px; height:18px; border:1px solid var(--gold); }
.image-frame::before { top:-1px; left:-1px; border-right:0; border-bottom:0; }
.image-frame::after { right:-1px; bottom:-1px; border-left:0; border-top:0; }
.frame-symbol { font:180px/.7 var(--serif); color:rgba(217,164,65,.25); }
.image-frame p { color:var(--gold); font-size:9px; letter-spacing:4px; }
.story-content > p:not(.eyebrow) { color:#aaa39a; font-size:14px; margin:24px 0; }
.text-link { display:inline-block; margin-top:18px; color:var(--gold-light); text-transform:uppercase; letter-spacing:2px; font-size:10px; border-bottom:1px solid var(--line); padding-bottom:7px; }
.text-link span { margin-left:12px; }
.why { padding:110px 7vw; background:#0d0c0a; }
.centered { display:block; text-align:center; }
.features { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); margin-top:60px; }
.feature { padding:42px 30px; background:#0d0c0a; min-height:220px; }
.feature b { color:var(--gold); font-size:10px; letter-spacing:2px; }
.feature h3 { font-size:29px; margin:28px 0 12px; }
.feature p { color:#8e8982; font-size:12px; }
.quote { padding:130px 7vw; background:linear-gradient(rgba(5,5,5,.75),rgba(5,5,5,.75)), radial-gradient(circle at 50% 50%,#4c3515,#050505 60%); text-align:center; }
.quote-inner { max-width:800px; margin:auto; }
.quote span { font:110px/.5 var(--serif); color:var(--gold); }
.quote h2 { font:600 clamp(42px,5vw,68px)/.98 var(--serif); margin:25px 0; }
.quote p { color:#a39c93; font-size:13px; letter-spacing:1px; }
.contact { padding:130px 7vw; text-align:center; background:var(--cream); color:#111; }
.contact .eyebrow { color:#8e651f; }
.contact h2 { max-width:780px; margin:auto; }
.contact > p:not(.eyebrow) { color:#69635c; margin:24px auto 32px; }
.dark-outline { color:#8e651f; border-color:#8e651f; }
.dark-outline:hover { background:rgba(142,101,31,.08); }
footer { padding:55px 7vw 30px; display:grid; grid-template-columns:1fr 1fr auto; gap:40px; align-items:end; border-top:1px solid var(--line); }
.footer-brand img { width:110px; height:50px; object-fit:cover; margin-bottom:8px; }
.footer-brand p,.copyright { color:#77716a; font-size:11px; }
.footer-links { display:flex; gap:25px; flex-wrap:wrap; font-size:10px; text-transform:uppercase; letter-spacing:1.5px; }
.footer-links a:hover { color:var(--gold-light); }
.copyright { text-align:right; }
@media (max-width: 850px) {
  .nav { display:none; position:absolute; top:88px; left:0; right:0; padding:25px 7vw; background:#090909; flex-direction:column; gap:20px; border-bottom:1px solid var(--line); }
  .nav.open { display:flex; }
  .menu { display:block; }
  .hero { min-height:680px; padding:70px 8vw; }
  .hero::before { inset:4%; }
  .collection-grid { grid-template-columns:1fr 1fr; }
  .card-large { grid-column:span 2; }
  .story { grid-template-columns:1fr; }
  .features { grid-template-columns:1fr 1fr; }
  footer { grid-template-columns:1fr; }
  .copyright { text-align:left; }
}
@media (max-width: 560px) {
  .topbar { font-size:8px; letter-spacing:1.4px; }
  .header { height:76px; }
  .brand img { width:105px; height:52px; }
  .nav { top:76px; }
  h1 { font-size:64px; }
  .hero { min-height:600px; }
  .section-heading { display:block; }
  .section-heading > p { margin-top:25px; }
  .collection-grid,.features { grid-template-columns:1fr; }
  .card-large { grid-column:auto; }
  .story-image { min-height:390px; }
  .image-frame { width:72%; height:70%; }
  footer { padding:45px 7vw 25px; }
}