@font-face{ font-family:'Frank Ruhl Libre'; font-weight:500; font-style:normal; src:url('/assets/fonts/FrankRuhlLibre-500.ttf') format('truetype'); font-display:swap; }
@font-face{ font-family:'Frank Ruhl Libre'; font-weight:700; font-style:normal; src:url('/assets/fonts/FrankRuhlLibre-700.ttf') format('truetype'); font-display:swap; }
@font-face{ font-family:'Heebo'; font-weight:400; font-style:normal; src:url('/assets/fonts/Heebo-400.ttf') format('truetype'); font-display:swap; }
@font-face{ font-family:'Heebo'; font-weight:500; font-style:normal; src:url('/assets/fonts/Heebo-500.ttf') format('truetype'); font-display:swap; }
@font-face{ font-family:'Heebo'; font-weight:600; font-style:normal; src:url('/assets/fonts/Heebo-600.ttf') format('truetype'); font-display:swap; }
@font-face{ font-family:'Heebo'; font-weight:700; font-style:normal; src:url('/assets/fonts/Heebo-700.ttf') format('truetype'); font-display:swap; }

:root{
  --soot-950:#1A1714;
  --steel-700:#43464A;
  --steel-500:#6d7075;
  --steel-300:#9a9d9f;
  --ash-100:#E8E4D9;
  --ash-050:#F2EFE6;
  --gold-500:#C7A050;
  --gold-400:#D6B569;
  --ribbon-400:#E3B21C;
  --ribbon-white:#F4EFE3;

  /* Light is the default mode. */
  --bg:var(--ash-050);
  --bg-raised:#e9e4d6;
  --bg-card:#ffffff;
  --text:var(--soot-950);
  --text-dim:#4a463d;
  --text-faint:#5f6367;
  --rule:#d8d1bd;
  --accent:#7d5f22;
  --accent-strong:#734b0f;
  --on-accent:#fffaf0;
}

:root[data-theme="dark"]{
  --bg:var(--soot-950);
  --bg-raised:#211d18;
  --bg-card:#26221c;
  --text:var(--ash-100);
  --text-dim:#c7c1b2;
  --text-faint:var(--steel-300);
  --rule:#3a3527;
  --accent:var(--gold-500);
  --accent-strong:var(--ribbon-400);
  --on-accent:var(--soot-950);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html{ overflow-x:hidden; }
body{
  margin:0; background:var(--bg); color:var(--text);
  overflow-x:hidden; max-width:100vw;
  font-family:'Heebo', 'Segoe UI', Arial, sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased;
  transition:background .3s ease, color .3s ease;
}
::selection{ background:var(--accent); color:var(--on-accent); }
h1,h2,h3,h4{ font-family:'Frank Ruhl Libre', Georgia, serif; font-weight:700; text-wrap:balance; color:var(--text); margin:0; }
p{ margin:0 0 1.1rem; max-width:62ch; color:var(--text-dim); overflow-wrap:break-word; }
a{ color:inherit; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:pointer; }

.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }

/* ===== Header ===== */
header.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--bg);
  border-bottom:1px solid var(--rule);
}
.header-inner{
  max-width:1240px; margin:0 auto; padding:1rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.wordmark{ display:flex; align-items:center; gap:0.7rem; font-family:'Frank Ruhl Libre',serif; font-size:1.5rem; font-weight:700; letter-spacing:0.02em; color:var(--text); text-decoration:none; }
.wordmark-logo{ height:28px; width:auto; display:block; filter:brightness(0) saturate(100%); opacity:0.88; }
:root[data-theme="dark"] .wordmark-logo{ filter:brightness(0) invert(1) saturate(100%); }
.wordmark-text{ border-inline-start:1px solid var(--rule); padding-inline-start:0.7rem; }

.skip-link{
  position:absolute; top:-100px; left:1rem; z-index:1000;
  background:var(--accent); color:var(--on-accent); padding:0.7rem 1.2rem;
  font-family:'Heebo',sans-serif; font-weight:600; text-decoration:none; border-radius:2px;
  transition:top .2s ease;
}
.skip-link:focus{ top:1rem; }
nav.main-nav{ display:flex; align-items:center; gap:1.9rem; }
nav.main-nav a{ text-decoration:none; font-size:0.92rem; color:var(--text-dim); padding:0.3rem 0; border-bottom:1px solid transparent; white-space:nowrap; }
nav.main-nav a:hover, nav.main-nav a.active{ color:var(--text); border-bottom-color:var(--accent); }
nav.main-nav a.cta{
  background:var(--accent); color:var(--on-accent); padding:0.55rem 1.1rem; border-radius:2px;
  font-weight:600; border-bottom:none !important;
}
nav.main-nav a.cta:hover{ background:var(--accent-strong); }
.nav-toggle{ display:none; background:none; border:1px solid var(--rule); color:var(--text); padding:0.4rem 0.6rem; }
.theme-toggle{ background:none; border:1px solid var(--rule); color:var(--text-dim); padding:0.4rem 0.7rem; font-size:0.78rem; border-radius:2px; font-weight:600; }
.theme-toggle:hover{ border-color:var(--accent); color:var(--accent); }

@media (max-width:920px){
  .header-inner{ position:relative; }
  nav.main-nav{
    position:fixed; top:64px; right:0; bottom:0; left:0;
    width:auto; height:auto;
    box-sizing:border-box;
    background:var(--bg); flex-direction:column; align-items:flex-start;
    padding:2rem 1.5rem; gap:1.4rem;
    transform:translateX(100%); transition:transform .25s ease;
    overflow-y:auto;
  }
  nav.main-nav.open{ transform:translateX(0); }
  nav.main-nav a{ font-size:1.1rem; width:100%; box-sizing:border-box; }
  .nav-toggle{ display:block; }
}

/* ===== Layout helpers ===== */
.container{ max-width:1100px; margin:0 auto; padding:0 1.5rem; }
.container-narrow{ max-width:760px; margin:0 auto; padding:0 1.5rem; }
section{ padding:4.5rem 0; }
section.tight{ padding:2.5rem 0; }
.eyebrow{ font-family:'Heebo',sans-serif; font-size:0.72rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent); margin-bottom:0.9rem; display:block; }

/* ===== Hero ===== */
.hero{ position:relative; min-height:88vh; display:flex; align-items:flex-end; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center 25%; filter:saturate(0.85) contrast(1.05); }
.hero-scrim{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(15,13,10,0.92) 10%, rgba(15,13,10,0.55) 45%, rgba(15,13,10,0.15) 75%); }
.hero-content{ position:relative; z-index:2; padding:3.5rem 1.5rem 4rem; max-width:1100px; margin:0 auto; width:100%; min-width:0; box-sizing:border-box; }
.hero h1{ font-size:clamp(2.1rem, 5.2vw, 3.6rem); line-height:1.16; color:#F4F1E8; max-width:min(18ch, 100%); margin-bottom:1.1rem; }
.hero p.lede{ color:#d9d4c4; font-size:1.12rem; max-width:min(52ch, 100%); margin-bottom:1.8rem; }
.cta-row{ display:flex; gap:0.9rem; flex-wrap:wrap; }
.btn{
  display:inline-flex; align-items:center; gap:0.5rem; text-decoration:none;
  padding:0.85rem 1.5rem; font-weight:600; font-size:0.95rem; border-radius:2px; border:1px solid transparent;
}
.btn-solid{ background:var(--accent); color:var(--on-accent); }
.btn-solid:hover{ background:var(--accent-strong); }
.btn-outline{ border-color:#efe9d8aa; color:#F4F1E8; }
.btn-outline:hover{ border-color:#F4F1E8; }

/* ===== Banner ===== */
.banner{
  background:var(--bg-raised); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  padding:0.9rem 0;
}
.banner-inner{ display:flex; align-items:center; justify-content:center; gap:0.8rem; flex-wrap:wrap; text-align:center; }
.banner p{ margin:0; color:var(--text-dim); font-size:0.94rem; }
.banner a{ color:var(--accent-strong); font-weight:600; text-decoration:underline; }

/* ===== Press strip ===== */
.press-strip{ border-top:1px solid var(--rule); padding:2.2rem 0; }
.press-strip .container{ display:flex; flex-wrap:wrap; gap:0.6rem 1rem; justify-content:center; }
.press-item{
  font-family:Consolas, ui-monospace, monospace; font-size:0.76rem; color:var(--text-faint);
  background:var(--bg-raised); border:1px solid var(--rule); padding:0.4rem 0.8rem; border-radius:999px;
}

/* ===== Cards ===== */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:1.6rem; margin-top:2.2rem; }
.card{ background:var(--bg-card); border:1px solid var(--rule); overflow:hidden; text-decoration:none; display:flex; flex-direction:column; }
.card:hover{ border-color:var(--accent); }
.card .card-img{ aspect-ratio:4/3; background-size:cover; background-position:center; }
.card-body{ padding:1.3rem 1.3rem 1.5rem; }
.card-body h3{ font-size:1.15rem; margin-bottom:0.5rem; }
.card-body p{ font-size:0.92rem; margin-bottom:0; }
.wall-label{
  font-family:Consolas, ui-monospace, monospace; font-size:0.68rem; letter-spacing:0.03em;
  color:var(--accent); border-top:1px solid var(--rule); margin-top:0.9rem; padding-top:0.7rem;
  text-transform:uppercase;
}

/* ===== Work page ===== */
.work-hero{ position:relative; }
.work-hero .work-hero-img{ width:100%; aspect-ratio:16/9; background-size:cover; background-position:center; }
.work-hero-caption{ max-width:1100px; margin:0 auto; padding:1rem 1.5rem 0; }

.two-col{ display:grid; grid-template-columns:1.4fr 1fr; gap:3rem; align-items:start; }
@media (max-width:800px){ .two-col{ grid-template-columns:1fr; } }

/* ===== Auction / host module ===== */
.module{
  background:var(--bg-raised); border:1px solid var(--rule); border-inline-start:3px solid var(--accent-strong);
  padding:1.8rem 1.8rem; margin:2rem 0;
}
.module h4{ font-family:'Heebo',sans-serif; font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent-strong); margin-bottom:0.7rem; }
.module .big-number{ font-family:'Frank Ruhl Libre',serif; font-size:1.9rem; color:var(--text); margin-bottom:0.4rem; }

/* ===== Forms ===== */
form.inquiry{ margin-top:1.6rem; display:grid; gap:1rem; max-width:520px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:560px){ .form-row{ grid-template-columns:1fr; } }
label{ display:block; font-size:0.82rem; color:var(--text-faint); margin-bottom:0.35rem; }
input, textarea{
  width:100%; background:var(--bg-card); border:1px solid var(--rule); color:var(--text);
  padding:0.7rem 0.8rem; font-family:inherit; font-size:0.94rem; border-radius:2px;
}
input:focus, textarea:focus{ outline:2px solid var(--accent); outline-offset:1px; }
textarea{ resize:vertical; min-height:100px; }
.form-note{ font-size:0.82rem; color:var(--text-faint); margin-top:0.2rem; }
.form-success{ display:none; background:var(--bg-card); border:1px solid var(--accent); padding:1.2rem 1.4rem; margin-top:1.6rem; max-width:520px; }
.form-success.show{ display:block; }

/* ===== Press page ===== */
.press-entry{ padding:1.6rem 0; border-bottom:1px solid var(--rule); }
.press-entry:first-child{ padding-top:0; }
.press-entry .outlet{ font-family:Consolas, ui-monospace, monospace; font-size:0.74rem; color:var(--accent); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:0.4rem; display:block; }
.press-entry blockquote{ font-family:'Frank Ruhl Libre',serif; font-style:italic; font-size:1.15rem; margin:0 0 0.5rem; color:var(--text); }

.moment-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.4rem; margin:2rem 0; }

.gallery-grid{ columns:3 260px; column-gap:0.8rem; margin-top:1.5rem; }
.g-item{
  width:100%; margin:0 0 0.8rem; break-inside:avoid;
  background-size:cover; background-position:center;
  border:1px solid var(--rule); border-radius:2px;
  aspect-ratio:3/2;
}
.g-item:nth-child(4n+1){ aspect-ratio:3/4; }
.g-item:nth-child(7n+2){ aspect-ratio:1/1; }
@media (max-width:700px){ .gallery-grid{ columns:2 200px; } }
.moment{ border:1px solid var(--rule); padding:1.2rem; background:var(--bg-card); }
.moment .m-label{ font-family:Consolas,monospace; font-size:0.68rem; color:var(--accent); text-transform:uppercase; margin-bottom:0.5rem; display:block; }

/* ===== Section image (chapter break) ===== */
.chapter-img{ width:100%; aspect-ratio:16/10; background-size:cover; background-position:center; margin:2.5rem 0; }
.shot-pair{ display:grid; grid-template-columns:1fr 1fr; gap:0.8rem; margin:2rem 0 0.8rem; }
.shot-item{ aspect-ratio:4/3; background-size:cover; background-position:center; border:1px solid var(--rule); border-radius:2px; }
.shot-single{ width:100%; aspect-ratio:16/10; background-size:cover; background-position:center; margin:0.8rem 0 2rem; border:1px solid var(--rule); border-radius:2px; }
@media (max-width:600px){ .shot-pair{ grid-template-columns:1fr; } }

hr.rule{ border:none; border-top:1px solid var(--rule); margin:2.5rem 0; }

.list-plain{ padding-inline-start:0; list-style:none; margin:0; }
.list-plain li{ padding-inline-start:1.3rem; position:relative; margin-bottom:0.6rem; color:var(--text-dim); }
.list-plain li::before{ content:"\2022"; position:absolute; inset-inline-start:0; color:var(--accent); }

footer.site-footer{ border-top:1px solid var(--rule); padding:3rem 0 2.5rem; margin-top:3rem; }
.footer-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:2rem; margin-bottom:2rem; }
.footer-grid h5{ font-family:'Heebo',sans-serif; font-size:0.74rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-faint); margin-bottom:0.9rem; }
.footer-grid a{ display:block; text-decoration:none; color:var(--text-dim); font-size:0.92rem; margin-bottom:0.55rem; }
.footer-grid a:hover{ color:var(--accent); }
.footer-bottom{ font-family:Consolas,monospace; font-size:0.74rem; color:var(--text-faint); border-top:1px solid var(--rule); padding-top:1.4rem; }

.cookie-notice{
  position:fixed; left:0; right:0; bottom:0; z-index:300;
  background:var(--bg-raised); border-top:1px solid var(--rule);
  padding:1.1rem 1.5rem; box-shadow:0 -4px 20px rgba(0,0,0,0.25);
  transform:translateY(100%); transition:transform .35s ease;
}
.cookie-notice.show{ transform:translateY(0); }
.cookie-inner{
  max-width:1100px; margin:0 auto; display:flex; align-items:center;
  justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
}
.cookie-inner p{ margin:0; font-size:0.86rem; color:var(--text-dim); max-width:64ch; }
.cookie-inner a{ color:var(--accent); text-decoration:underline; }
.cookie-actions{ display:flex; gap:0.7rem; flex-shrink:0; }
.cookie-actions button{
  font-family:inherit; font-size:0.86rem; padding:0.55rem 1.1rem; border-radius:2px; border:1px solid var(--rule);
  background:none; color:var(--text-dim);
}
.cookie-actions button.accept{ background:var(--accent); color:var(--on-accent); border-color:var(--accent); font-weight:600; }
a:focus-visible, button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
