:root {
  --black: #0a0909;
  --ink: #171313;
  --cream: #f1ece4;
  --paper: #e9e2d8;
  --muted: #aaa19a;
  --line: rgba(255,255,255,.16);
  --accent: #b79b7b;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Montserrat", Arial, sans-serif;
  --header-h: 82px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--black);
  color: var(--cream);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.7;
}
body.menu-open, body.lightbox-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { background: var(--accent); color: var(--black); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 5vw;
  background: rgba(10,9,9,.78);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.brand { display:flex; align-items:center; gap:12px; min-width:170px; }
.brand-mark {
  width:34px; height:34px; border:1px solid var(--accent);
  display:grid; place-items:center; font-family:var(--serif); font-size:22px;
}
.brand-text { font-size:13px; letter-spacing:.26em; font-weight:500; }
.brand-text span, .footer-brand span { display:block; color:var(--accent); font-size:7px; letter-spacing:.55em; margin-top:-3px; }
.main-nav { display:flex; align-items:center; gap:28px; font-size:10px; letter-spacing:.15em; text-transform:uppercase; }
.main-nav > a, .dropdown-toggle { opacity:.78; transition:.25s; }
.main-nav > a:hover, .dropdown-toggle:hover { opacity:1; color:var(--accent); }
.dropdown-toggle { border:0; background:none; color:var(--cream); cursor:pointer; padding:31px 0; text-transform:uppercase; font-size:10px; letter-spacing:.15em; }
.chevron { color:var(--accent); margin-left:4px; }
.nav-dropdown { position:relative; }
.dropdown-menu {
  position:absolute; top:82px; left:50%; transform:translate(-50%, 12px);
  width:390px; padding:26px; display:grid; grid-template-columns:1fr 1fr; gap:30px;
  background:rgba(17,14,14,.98); border:1px solid var(--line);
  box-shadow:0 25px 60px rgba(0,0,0,.45);
  opacity:0; visibility:hidden; transition:.25s ease;
}
.nav-dropdown:hover .dropdown-menu, .nav-dropdown.open .dropdown-menu { opacity:1; visibility:visible; transform:translate(-50%,0); }
.dropdown-column { display:flex; flex-direction:column; gap:9px; }
.dropdown-label { color:var(--accent); font-size:8px; letter-spacing:.25em; margin-bottom:5px; }
.dropdown-menu a { font-family:var(--serif); font-size:18px; transition:.2s; }
.dropdown-menu a:hover { color:var(--accent); transform:translateX(4px); }
.header-cta { border:1px solid var(--accent); padding:11px 18px; font-size:9px; letter-spacing:.18em; text-transform:uppercase; transition:.25s; }
.header-cta:hover { background:var(--accent); color:var(--black); }
.menu-toggle { display:none; background:none; border:0; color:var(--cream); width:42px; height:42px; }
.menu-toggle span { display:block; width:23px; height:1px; background:var(--cream); margin:5px auto; transition:.25s; }

.hero {
  min-height:100svh; position:relative; display:flex; align-items:center;
  padding:120px 9vw 70px;
  background:
    linear-gradient(90deg, rgba(8,7,7,.78), rgba(8,7,7,.25) 60%, rgba(8,7,7,.65)),
    radial-gradient(circle at 72% 35%, rgba(150,115,88,.32), transparent 34%),
    linear-gradient(135deg,#171211,#080707 62%,#241a17);
  overflow:hidden;
}
.hero:after {
  content:""; position:absolute; inset:8% 7% 7% 58%; border:1px solid rgba(214,194,171,.15);
  transform:rotate(5deg); pointer-events:none;
}
.hero-content { max-width:720px; position:relative; z-index:2; }
.eyebrow, .section-kicker { font-size:9px; letter-spacing:.32em; color:var(--accent); text-transform:uppercase; }
.hero h1 { font:500 clamp(72px,11vw,156px)/.75 var(--serif); margin:28px 0 40px; letter-spacing:-.045em; }
h1 em, h2 em, .collection-title em { font-style:italic; font-weight:400; }
.hero-copy { max-width:470px; color:#c8c0b8; font-size:14px; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:35px; }
.button { display:inline-block; padding:14px 24px; font-size:9px; letter-spacing:.2em; text-transform:uppercase; transition:.25s; }
.button-light { border:1px solid var(--cream); color:var(--cream); }
.button-light:hover { background:var(--cream); color:var(--black); }
.button-dark { border:1px solid var(--ink); color:var(--ink); }
.button-dark:hover { background:var(--ink); color:var(--cream); }
.text-link { font-size:9px; text-transform:uppercase; letter-spacing:.16em; }
.text-link span { color:var(--accent); margin-left:10px; font-size:15px; }
.text-link.dark { color:var(--ink); }
.hero-scroll { position:absolute; right:5vw; bottom:40px; font-size:8px; letter-spacing:.25em; color:var(--muted); writing-mode:vertical-rl; }
.hero-scroll span { display:block; width:1px; height:45px; background:var(--accent); margin:0 auto 12px; }

.section-pad { padding:120px 9vw; }
.intro { background:var(--paper); color:var(--ink); }
.intro-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:12vw; margin-top:50px; }
h2 { font:500 clamp(50px,6vw,88px)/.86 var(--serif); letter-spacing:-.035em; margin:0; }
.intro-copy { max-width:510px; padding-top:5px; }
.lead { font:400 25px/1.35 var(--serif); }
.intro-copy p:not(.lead) { font-size:13px; color:#655d56; margin:28px 0 34px; }

.portfolio { background:var(--black); }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:55px; }
.section-heading h2 { margin-top:25px; }
.section-heading > p { max-width:320px; color:var(--muted); font-size:12px; }
.gallery-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:18px; }
.featured-grid .large { grid-row:span 2; }
.gallery-card { position:relative; min-height:320px; overflow:hidden; display:block; }
.featured-grid .large { min-height:680px; }
.placeholder-image {
  height:100%; min-height:320px; display:flex; align-items:flex-end; justify-content:flex-start;
  position:relative; overflow:hidden;
  background:linear-gradient(145deg,#30221f,#765e50 45%,#17100f 75%,#0c0a0a);
}
.placeholder-image:before, .placeholder-image:after { content:""; position:absolute; border-radius:50%; filter:blur(35px); opacity:.45; }
.placeholder-image:before { width:55%; height:75%; left:25%; top:5%; background:radial-gradient(circle,#c9a98c,#624d43 52%,transparent 68%); }
.placeholder-image:after { width:35%; height:55%; right:-5%; bottom:-10%; background:#bd9170; }
.image-b { background:linear-gradient(150deg,#191313,#49332c 45%,#a27c64); }
.image-c { background:linear-gradient(35deg,#111,#2c3130 48%,#756c60); }
.image-d { min-height:500px; background:linear-gradient(150deg,#241b18,#6d5040 50%,#16100f); }
.placeholder-image span { position:relative; z-index:2; margin:0 0 25px 25px; font-size:8px; letter-spacing:.3em; color:rgba(255,255,255,.6); }
.gallery-card:after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 50%,rgba(0,0,0,.7)); }
.gallery-card:hover .placeholder-image { transform:scale(1.035); }
.placeholder-image { transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.card-caption { position:absolute; z-index:3; bottom:20px; left:25px; right:25px; display:flex; justify-content:space-between; align-items:end; }
.card-caption span { font:400 29px var(--serif); }
.card-caption small { font-size:8px; letter-spacing:.2em; color:#c1b7af; text-transform:uppercase; }

.collections { background:#111; }
.collection-list { margin-top:45px; border-top:1px solid var(--line); }
.collection-row {
  display:grid; grid-template-columns:70px 1fr 50px; align-items:center;
  padding:25px 0; border-bottom:1px solid var(--line); transition:.35s;
}
.collection-row:hover { padding-left:20px; padding-right:20px; background:rgba(255,255,255,.025); }
.collection-number { color:var(--accent); font-size:9px; letter-spacing:.1em; }
.collection-title { font:400 clamp(32px,4vw,58px) var(--serif); }
.collection-arrow { font-size:24px; color:var(--accent); text-align:right; transition:.3s; }
.collection-row:hover .collection-arrow { transform:translate(5px,-5px); }

.statement { min-height:65vh; display:grid; place-items:center; text-align:center; padding:80px 5vw; background:linear-gradient(135deg,#201714,#0b0909 60%,#241916); }
.statement h2 { margin-top:28px; font-size:clamp(45px,7vw,95px); }

.experience { background:var(--paper); color:var(--ink); }
.experience-grid { display:grid; grid-template-columns:1fr 1fr; gap:9vw; margin-top:60px; align-items:center; }
.experience-content h2 { margin-bottom:45px; }
.experience-step { display:grid; grid-template-columns:45px 1fr; gap:15px; padding:18px 0; border-top:1px solid rgba(0,0,0,.16); }
.experience-step b { color:#9b8169; font-size:10px; }
.experience-step h3 { margin:0 0 5px; font:500 25px var(--serif); }
.experience-step p { margin:0; font-size:12px; color:#6b625b; }
.experience-content .button { margin-top:25px; }

.contact { min-height:82vh; position:relative; display:grid; place-items:center; text-align:center; padding:100px 5vw; background:linear-gradient(140deg,#0b0909,#36251f 48%,#0a0909); }
.contact:before { content:""; position:absolute; width:45vw; height:45vw; border:1px solid rgba(220,190,158,.14); border-radius:50%; }
.contact-content { position:relative; z-index:2; max-width:800px; }
.contact h2 { margin:30px 0; font-size:clamp(55px,8vw,105px); }
.contact p:not(.eyebrow) { max-width:460px; margin:0 auto 30px; color:#c4bbb2; font-size:13px; }
.socials { display:flex; justify-content:center; gap:28px; margin-top:40px; font-size:8px; text-transform:uppercase; letter-spacing:.2em; color:var(--muted); }
.socials a:hover { color:var(--accent); }

footer { padding:35px 5vw; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); font-size:8px; letter-spacing:.12em; color:var(--muted); }
.footer-brand { font-size:13px; letter-spacing:.25em; color:var(--cream); }
.footer-brand span { display:inline; margin-left:8px; }
footer a:hover { color:var(--accent); }

/* Lightbox */
.lightbox {
  position:fixed; inset:0; z-index:300; display:grid; place-items:center;
  opacity:0; visibility:hidden; transition:opacity .35s, visibility .35s;
}
.lightbox.open { opacity:1; visibility:visible; }
.lightbox-backdrop { position:absolute; inset:0; background:rgba(3,2,2,.97); }
.lightbox-content { position:relative; z-index:2; width:min(88vw,1200px); height:88vh; display:flex; flex-direction:column; justify-content:center; }
.lightbox-photo {
  flex:1; min-height:0; background:
    radial-gradient(ellipse at 52% 42%, #9b7864 0, #45332c 22%, #17100f 55%, #080707 78%);
  border:1px solid rgba(255,255,255,.1);
  display:grid; place-items:center; transition:background .35s;
}
.lightbox-photo:after { content:"REPLACE WITH YOUR PHOTOGRAPH"; color:rgba(255,255,255,.4); font-size:9px; letter-spacing:.3em; }
.lightbox-meta { display:flex; justify-content:space-between; padding:14px 0 0; color:var(--muted); font-size:8px; letter-spacing:.2em; text-transform:uppercase; }
.lightbox-close, .lightbox-prev, .lightbox-next {
  position:absolute; z-index:4; border:0; background:none; color:var(--cream); cursor:pointer;
}
.lightbox-close { top:25px; right:35px; font-size:38px; font-weight:200; }
.lightbox-prev, .lightbox-next { top:50%; transform:translateY(-50%); font-size:28px; padding:30px; opacity:.7; }
.lightbox-prev { left:10px; } .lightbox-next { right:10px; }
.lightbox-prev:hover, .lightbox-next:hover, .lightbox-close:hover { color:var(--accent); opacity:1; }

/* Image-ready class: JS swaps in actual image paths */
.lightbox-photo.has-image { background-size:contain; background-position:center; background-repeat:no-repeat; background-color:#080707; }
.lightbox-photo.has-image:after { display:none; }

.cursor-glow { position:fixed; width:300px; height:300px; pointer-events:none; z-index:0; background:radial-gradient(circle,rgba(184,150,120,.08),transparent 68%); transform:translate(-50%,-50%); }

/* Responsive */
@media (max-width: 900px) {
  .main-nav { gap:16px; }
  .header-cta { display:none; }
  .brand { min-width:auto; }
  .hero { padding-left:7vw; padding-right:7vw; }
  .intro-grid, .experience-grid { gap:50px; }
}
@media (max-width: 720px) {
  :root { --header-h:68px; }
  .site-header { padding:0 5vw; }
  .main-nav {
    position:fixed; top:68px; left:0; right:0; height:calc(100svh - 68px);
    background:rgba(10,9,9,.98); display:flex; flex-direction:column; align-items:flex-start;
    padding:45px 8vw; gap:0; overflow:auto; transform:translateX(100%); transition:.35s;
  }
  .main-nav.open { transform:translateX(0); }
  .main-nav > a, .dropdown-toggle { width:100%; padding:17px 0; font-size:11px; text-align:left; border-bottom:1px solid var(--line); }
  .nav-dropdown { width:100%; }
  .dropdown-menu { position:static; width:100%; transform:none; display:none; padding:10px 0 20px 15px; background:none; border:0; box-shadow:none; opacity:1; visibility:visible; }
  .nav-dropdown.open .dropdown-menu { display:grid; }
  .menu-toggle { display:block; }
  .menu-toggle.active span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
  .menu-toggle.active span:nth-child(2) { opacity:0; }
  .menu-toggle.active span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

  .hero { min-height:92svh; }
  .hero h1 { font-size:72px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:20px; }
  .hero-scroll { display:none; }
  .section-pad { padding:80px 7vw; }
  .intro-grid, .experience-grid { grid-template-columns:1fr; }
  .section-heading { display:block; }
  .section-heading > p { margin-top:30px; }
  .gallery-grid { grid-template-columns:1fr; }
  .featured-grid .large { min-height:500px; }
  .gallery-card { min-height:350px; }
  .collection-row { grid-template-columns:40px 1fr 35px; }
  .collection-title { font-size:35px; }
  .statement { min-height:55vh; }
  .experience-image { min-height:420px; }
  .lightbox-content { width:88vw; height:78vh; }
  .lightbox-prev, .lightbox-next { padding:15px; }
  .lightbox-prev { left:0; } .lightbox-next { right:0; }
  footer { flex-direction:column; gap:15px; text-align:center; }
}

/* 18+ age gate */
.age-gate{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:25px;background:radial-gradient(circle at 50% 35%,rgba(125,91,70,.28),transparent 38%),rgba(5,4,4,.98);opacity:1;visibility:visible;transition:opacity .4s ease,visibility .4s ease}
.age-gate.hidden{opacity:0;visibility:hidden;pointer-events:none}
.age-gate-panel{width:min(600px,94vw);padding:55px 45px;text-align:center;border:1px solid rgba(183,155,123,.38);background:rgba(14,12,12,.96);box-shadow:0 30px 100px rgba(0,0,0,.65)}
.age-gate-mark{width:50px;height:50px;margin:0 auto 25px;display:grid;place-items:center;border:1px solid var(--accent);color:var(--accent);font:28px var(--serif)}
.age-gate h2{margin:20px 0 25px;font-size:clamp(58px,9vw,88px)}
.age-gate-copy{max-width:470px;margin:0 auto;color:#c2b9b1;font-size:12px;line-height:1.9}
.age-gate-actions{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin-top:32px}
.age-gate .button{cursor:pointer}
.age-leave{border:1px solid rgba(255,255,255,.25);color:#c6beb7}
.age-leave:hover{border-color:var(--cream);color:var(--cream)}
.age-gate-note{margin:25px 0 0;color:#756c65;font-size:8px;letter-spacing:.12em;text-transform:uppercase}