/* Diamond Jim LeatherWorks — design system
   Committed dark theme. Display: Bodoni/Didot. Body: Futura/Avenir.
   Accent: amber #E3AC4E (hardware brass) with ember #C15A2C. */

:root, :root[data-theme="dark"], :root[data-theme="light"]{
  --bg:#0C0906; --bg2:#120C07; --panel:#17100A;
  --ink:#F4ECDD; --read:#DBCFB6; --muted:#9C8C75; --faint:#5B4E3D;
  --hair:rgba(244,236,221,.14);
  --amber:#E3AC4E; --ember:#C15A2C;
  --serif:"Bodoni 72","Bodoni MT","Didot","Hoefler Text",Georgia,serif;
  --sans:"Futura","Avenir Next","Helvetica Neue",system-ui,-apple-system,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
  font-size:16.5px; line-height:1.6; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility; overflow-x:hidden;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:600; margin:0; text-wrap:balance;}
p{margin:0;} img{display:block; max-width:100%;} a{color:inherit; text-decoration:none;}
::selection{background:var(--amber); color:#1a1206;}
:focus-visible{outline:2px solid var(--amber); outline-offset:3px;}
.wrap{width:min(1240px,90vw); margin-inline:auto;}
.label{font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; color:var(--amber); font-weight:600;}
.label.dim{color:var(--muted);}
.skip{position:absolute; left:-9999px; top:0; background:var(--amber); color:#1a1206;
  padding:.8em 1.2em; z-index:100; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase;}
.skip:focus{left:0;}

/* film grain */
body::after{content:""; position:fixed; inset:0; z-index:3; pointer-events:none; opacity:.05;
  mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:.6em; font:inherit; font-weight:600; font-size:.76rem;
  letter-spacing:.16em; text-transform:uppercase; padding:1em 1.9em; cursor:pointer;
  border:1px solid transparent; transition:transform .18s ease, background .2s, color .2s, border-color .2s;}
.btn-amber{background:var(--amber); color:#1a1206; border-color:var(--amber);}
.btn-amber:hover{transform:translateY(-2px); background:transparent; color:var(--amber);}
.btn-line{background:transparent; color:var(--ink); border-color:var(--hair);}
.btn-line:hover{transform:translateY(-2px); border-color:var(--amber); color:var(--amber);}

/* nav */
header.nav{position:fixed; inset:0 0 auto 0; z-index:40; padding:1.1rem 0;
  background:linear-gradient(to bottom, rgba(8,5,3,.72), rgba(8,5,3,0));
  border-bottom:0; box-shadow:none;
  transition:background .35s ease, backdrop-filter .35s ease, padding .35s ease, box-shadow .35s ease;}
header.nav.scrolled{padding:.72rem 0; background:color-mix(in srgb, var(--bg) 93%, transparent);
  backdrop-filter:blur(12px) saturate(1.15);
  box-shadow:inset 0 -1px 0 var(--hair), 0 14px 34px -22px rgba(0,0,0,.95);}
header.nav.solid{position:sticky; background:color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter:blur(10px); box-shadow:inset 0 -1px 0 var(--hair);}
.nav-in{display:flex; align-items:center; justify-content:space-between; gap:1.5rem;}
.brand{display:flex; align-items:center;}
.brand .logo-h{height:clamp(38px,4.4vw,50px); width:auto; display:block;}
header.nav.scrolled .brand .logo-h{height:clamp(32px,3.6vw,42px);}
nav.links{display:flex; gap:1.9rem; font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);}
nav.links a:hover, nav.links a[aria-current="page"]{color:var(--amber);}
@media(max-width:900px){ nav.links{display:none;} }
@media(max-width:520px){ .nav-cta{display:none;} }

/* hero (home) */
.hero{position:relative; height:300vh;}
html:not(.anim) .hero{height:100svh; min-height:600px;}
.pin{position:sticky; top:0; height:100svh; min-height:600px; overflow:hidden; display:flex; align-items:flex-end;}
.hero-vid{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%;
  animation:kenburns 26s ease-in-out infinite alternate;}
.hero-scrim{position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,5,3,.94) 4%, rgba(8,5,3,.45) 40%, rgba(8,5,3,.15) 68%, rgba(8,5,3,.55) 100%),
    linear-gradient(to right, rgba(8,5,3,.6), rgba(8,5,3,0) 55%);}
.hero-in{position:relative; z-index:2; padding-bottom:clamp(3.5rem,8vh,7rem); width:100%;}
.veil{position:absolute; inset:0; z-index:4; pointer-events:none; opacity:0;
  background:linear-gradient(to top,#0C0906 18%, rgba(12,9,6,.78) 44%, rgba(12,9,6,.28) 66%, transparent 88%);}
html.anim .st{opacity:0; transform:translateY(34px); transition:opacity .7s ease, transform .7s ease;}
html.anim .st.on{opacity:1; transform:none;}
.hero h1{font-size:clamp(2.7rem,7.5vw,6.2rem); line-height:.98; letter-spacing:.01em; margin:.7rem 0 0;}
.hero h1 em{font-style:italic; color:var(--amber);}
.hero .tag{margin-top:1.5rem; font-size:1.12rem; color:var(--muted); max-width:34ch;}
.hero-cta{display:flex; gap:.8rem; margin-top:2rem; flex-wrap:wrap;}
.vf span{position:absolute; z-index:2; width:26px; height:26px; border:1.5px solid rgba(227,172,78,.5);}
.vf .tl{top:88px; left:5vw; border-right:0; border-bottom:0;}
.vf .tr{top:88px; right:5vw; border-left:0; border-bottom:0;}
.vf .bl{bottom:34px; left:5vw; border-right:0; border-top:0;}
.vf .br{bottom:34px; right:5vw; border-left:0; border-top:0;}
.scrollcue{position:absolute; z-index:2; bottom:26px; left:50%; transform:translateX(-50%); text-align:center;
  font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; color:var(--muted);}
.scrollcue i{display:block; width:1px; height:34px; margin:0 auto .6rem; background:linear-gradient(var(--amber),transparent);}
@keyframes kenburns{from{transform:scale(1.03)} to{transform:scale(1.13)}}
@media(max-width:820px){
  .hero{height:100svh; min-height:560px;}
  html.anim .st{opacity:1; transform:none; transition:none;}
  .veil{display:none;}
}

/* production credits */
.credits{text-align:center; padding:clamp(3.4rem,8vw,6rem) 0; border-bottom:1px solid var(--hair);}
.credits .rule{width:44px; height:1px; background:var(--amber); margin:1.6rem auto 2.2rem;}
.credits .logos{display:flex; align-items:center; justify-content:center; gap:clamp(2.2rem,7vw,5rem); flex-wrap:wrap;}
.credits .logos img{width:auto; opacity:.92;}
.credits .lg-chosen{height:clamp(44px,6.5vw,68px);}
.credits .lg-bom{height:clamp(58px,8.5vw,88px);}
.credits .lg-aod{height:clamp(50px,7.4vw,78px);}
.credits .cred-note{margin-top:2rem; font-size:.74rem; letter-spacing:.1em; color:var(--muted);}
.credits .cred-note a{color:var(--amber); border-bottom:1px solid transparent; padding-bottom:1px; transition:border-color .2s;}
.credits .cred-note a:hover{border-color:var(--amber);}
@media(max-width:700px){ .credits .logos{gap:1.8rem 2.4rem;} }

/* sections */
section.block{padding:clamp(4rem,9vw,7.5rem) 0;}
.sec-top{display:flex; align-items:baseline; justify-content:space-between; gap:2rem; margin-bottom:clamp(2rem,4vw,3rem);}
.sec-top h2{font-size:clamp(2rem,5.4vw,3.7rem); line-height:1;}
.sec-top .label{margin-bottom:1rem; display:block;}
.sec-note{font-size:.88rem; color:var(--muted); max-width:30ch; text-align:right;}
@media(max-width:620px){ .sec-top{flex-direction:column; align-items:flex-start;} .sec-note{text-align:left;} }

/* gallery */
.filmgrid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(.6rem,1.3vw,1rem);}
figure.shot{position:relative; overflow:hidden; margin:0; background:var(--panel);}
figure.shot.wide{grid-column:1 / -1; aspect-ratio:16/7;}
figure.shot.wide.feature{aspect-ratio:16/9;}
figure.shot.tall{aspect-ratio:4/5;}
@media(max-width:640px){
  .filmgrid{grid-template-columns:1fr;}
  figure.shot.wide{aspect-ratio:3/2;} figure.shot.wide.feature{aspect-ratio:4/5;}
}
figure.shot img{width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1);}
figure.shot:hover img{transform:scale(1.06);}
figure.shot .grad{position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,5,3,.9) 2%, rgba(8,5,3,.15) 45%, transparent 70%);}
figure.shot figcaption{position:absolute; inset:auto 0 0 0; z-index:2; padding:clamp(1.1rem,2.4vw,1.9rem);}
figure.shot .no{font-size:.66rem; letter-spacing:.24em; color:var(--amber); font-weight:600;}
figure.shot .cat{font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin-top:.5rem;}
figure.shot .ttl{font-family:var(--serif); font-size:clamp(1.3rem,2.6vw,2rem); line-height:1.05; margin-top:.2rem;}
figure.shot .go{display:inline-block; margin-top:.7rem; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--amber); opacity:.85; transform:none; transition:opacity .3s, transform .3s;}
figure.shot:hover .go{opacity:1; transform:translateX(3px);}
/* whole tile is a link to the contact page; sits above the caption but below the sporran's story panel */
figure.shot .shot-link{position:absolute; inset:0; z-index:4;}
figure.shot .shot-link:focus-visible{outline:2px solid var(--amber); outline-offset:-4px;}
figure.shot .more-btn{margin-top:.7rem; font:inherit; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--amber); background:none; border:0; border-bottom:1px solid rgba(227,172,78,.5); padding:0 0 2px; cursor:pointer;}
figure.shot .more-btn:hover{color:#F0C87A;}
figure.shot .story{position:absolute; inset:0; z-index:5; display:flex; flex-direction:column; justify-content:center;
  gap:.9rem; padding:clamp(1.3rem,3vw,2.2rem); overflow-y:auto;
  background:linear-gradient(rgba(8,5,3,.93),rgba(8,5,3,.96));
  opacity:0; visibility:hidden; transition:opacity .45s ease, visibility .45s;}
figure.shot.open .story{opacity:1; visibility:visible;}
figure.shot.wide .story > *{max-width:64ch; margin-inline:auto; width:100%;}
figure.shot.open img{filter:brightness(.28) saturate(.75);}
figure.shot.open:hover img{transform:none;}
figure.shot .story h3{font-family:var(--serif); font-size:clamp(1.15rem,2.2vw,1.5rem); line-height:1.15; color:var(--ink);}
figure.shot .story p{font-size:clamp(.82rem,1.15vw,.94rem); line-height:1.68; color:var(--read);}
figure.shot .story-close{align-self:flex-start; font:inherit; font-size:.62rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--amber); background:none; border:0;
  border-bottom:1px solid rgba(227,172,78,.5); padding:0 0 2px; cursor:pointer;}

/* craftsman split */
.craftsman{padding:clamp(4rem,9vw,7.5rem) 0; border-block:1px solid var(--hair);
  background:linear-gradient(180deg,#100B07,var(--bg) 60%);}
.craftsman-grid{display:grid; grid-template-columns:1fr 1.04fr; gap:clamp(2rem,5vw,4.4rem); align-items:center;}
@media(max-width:860px){ .craftsman-grid{grid-template-columns:1fr; gap:2.4rem;} }
.craftsman-photo{position:relative;}
.craftsman-photo img{width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; object-position:50% 32%;
  border-radius:3px; box-shadow:0 30px 70px -30px rgba(0,0,0,.9);}
.craftsman-photo::after{content:""; position:absolute; inset:11px; border:1px solid rgba(243,232,210,.3);
  border-radius:2px; pointer-events:none;}
.craftsman-photo .vf span{position:absolute; width:20px; height:20px; border:1.5px solid rgba(227,172,78,.65);}
.craftsman-photo .tl{top:-6px; left:-6px; border-right:0; border-bottom:0;}
.craftsman-photo .br{bottom:-6px; right:-6px; border-left:0; border-top:0;}
.craftsman-in{max-width:46ch;}
.craftsman h2{font-size:clamp(2rem,4.6vw,3.3rem); line-height:1; margin:.8rem 0 1.2rem;}
.craftsman p{color:var(--ink); opacity:.9;}
.pull{font-family:var(--serif); font-style:italic; font-size:clamp(1.3rem,2.6vw,1.8rem);
  line-height:1.35; margin-top:1.6rem; color:var(--ink);}
.seal-row{display:flex; align-items:center; gap:.9rem; margin-top:2rem;}
.seal-row img{width:56px; height:auto;}
.seal-row span{font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);}
.story-link{display:inline-block; margin-top:1.6rem; font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--amber); border-bottom:1px solid transparent; padding-bottom:2px; transition:border-color .2s;}
.story-link:hover{border-color:var(--amber);}

/* commissions */
.lanes{display:grid; grid-template-columns:repeat(3,1fr);}
.lane{padding:2rem 1.9rem 2rem 1.9rem; border-top:1px solid var(--hair);}
.lane:not(:last-child){border-right:1px solid var(--hair);}
.lane:first-child{padding-left:0;}
@media(max-width:760px){
  .lanes{grid-template-columns:1fr;}
  .lane, .lane:first-child{padding-left:0; padding-right:0;}
  .lane:not(:last-child){border-right:0;}
}
.lane .no{font-family:var(--serif); font-size:2.4rem; color:var(--amber); line-height:1;}
.lane .cat{font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin:1rem 0 .5rem;}
.lane h3{font-size:1.35rem; line-height:1.15; font-family:var(--serif);}
.lane .from{margin-top:1rem; font-size:.82rem; color:var(--ink);}
.lane .from b{color:var(--amber); font-weight:600;}
.flow{display:flex; flex-wrap:wrap; align-items:center; gap:1.1rem; margin-top:clamp(2.4rem,5vw,3.6rem);
  padding-top:2rem; border-top:1px solid var(--hair);
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted);}
.flow em{color:var(--amber); font-style:normal;}

/* journal teaser */
.journal{border-top:1px solid var(--hair);}
.journal-grid{display:grid; grid-template-columns:1.35fr 1fr; gap:clamp(2.4rem,6vw,5rem); align-items:start;}
@media(max-width:760px){ .journal-grid{grid-template-columns:1fr;} }
.jall{font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--amber);
  white-space:nowrap; align-self:baseline; border-bottom:1px solid transparent; padding-bottom:2px;}
.jall:hover{border-color:var(--amber);}
a.jfeat, a.jitem{display:block; color:inherit;}
.jfeat .cat, .jitem .cat{font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-top:.55rem;}
.jfeat .no, .jitem .no{font-size:.64rem; letter-spacing:.24em; color:var(--amber); font-weight:600;}
.jfeat h3{font-size:clamp(1.9rem,4.2vw,3.1rem); line-height:1.04; font-family:var(--serif); margin-top:.25rem;}
.jfeat .dek{color:var(--muted); margin-top:1.1rem; max-width:44ch;}
.jfeat .go{display:inline-block; margin-top:1.1rem; font-size:.64rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--amber); opacity:.82; transition:opacity .2s, transform .2s;}
a.jfeat:hover .go{opacity:1; transform:translateX(3px);}
.jlist{display:flex; flex-direction:column;}
.jitem{border-top:1px solid var(--hair); padding:1.5rem 0;}
.jitem:first-child{border-top:0; padding-top:.3rem;}
@media(max-width:760px){ .jitem:first-child{border-top:1px solid var(--hair); padding-top:1.5rem; margin-top:.5rem;} }
.jitem h3{font-size:1.25rem; line-height:1.2; font-family:var(--serif); margin-top:.25rem;}
a.jitem:hover h3, a.jfeat:hover h3{color:var(--amber);}

/* closing CTA */
.cta{position:relative; text-align:center; padding:clamp(4.5rem,11vw,8rem) 0; overflow:hidden;
  background:radial-gradient(120% 130% at 50% 0%, #1c130b, #0a0704 70%);}
.cta h2{font-size:clamp(2.4rem,7vw,5rem); line-height:.98;}
.cta p{color:var(--muted); margin:1.2rem auto 2rem; max-width:40ch;}

/* footer */
footer.foot{border-top:1px solid var(--hair); padding:3rem 0 2.6rem; text-align:center;}
footer .brand{justify-content:center; margin-bottom:1.6rem;}
footer .logo-badge{height:clamp(110px,15vw,150px); width:auto; display:inline-block;}
.foot-links{display:flex; justify-content:center; flex-wrap:wrap; gap:1.4rem; font-size:.66rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-bottom:1.5rem;}
.foot-links a:hover{color:var(--amber);}
.foot-meta{font-size:.82rem; color:var(--muted); line-height:1.9;}
.foot-meta strong{color:var(--ink); font-weight:600;}
.foot-meta a{color:var(--muted);} .foot-meta a:hover{color:var(--amber);}
.foot-legal{display:flex; justify-content:center; flex-wrap:wrap; gap:1.1rem; margin-top:1.5rem;
  font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint);}
.foot-legal a:hover{color:var(--amber);}
.foot-note{margin-top:1.6rem; font-size:.68rem; letter-spacing:.05em; color:var(--faint);}

/* ---------- interior pages ---------- */
.page-hero{position:relative; height:clamp(340px,52vh,520px); display:flex; align-items:flex-end; overflow:hidden;}
.page-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 40%;}
.page-hero .scrim{position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,5,3,.96) 6%, rgba(8,5,3,.6) 42%, rgba(8,5,3,.22) 76%, rgba(8,5,3,.5)),
    linear-gradient(to right, rgba(8,5,3,.55), rgba(8,5,3,0) 62%);}
.page-hero .inner{position:relative; z-index:2; width:100%; padding-bottom:clamp(2rem,4vw,3.2rem);}
.page-hero h1{font-size:clamp(2rem,5.2vw,3.8rem); line-height:1.02; max-width:20ch; margin-top:1rem;}
.ameta{display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:1.3rem;
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);}
.ameta .dot{width:4px; height:4px; background:var(--amber); transform:rotate(45deg);}
.ameta b{color:var(--ink); font-weight:600;}

/* plain page header (no photo) */
.page-head{padding:clamp(7rem,14vh,10rem) 0 clamp(2rem,4vw,3rem); border-bottom:1px solid var(--hair);}
.page-head h1{font-size:clamp(2rem,5vw,3.4rem); line-height:1.04; margin-top:.9rem; max-width:22ch;}
.page-head .lede{margin-top:1.2rem; color:var(--muted); max-width:60ch;}

.crumbs{font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint);}
.crumbs a:hover{color:var(--amber);} .crumbs span{color:var(--muted);}

article.doc{width:min(70ch,90vw); margin:clamp(2.4rem,5vw,3.6rem) auto 0;}
.doc h2{font-size:clamp(1.4rem,2.8vw,1.9rem); color:var(--ink); margin:2.2em 0 .6em; line-height:1.15;}
.doc h3{font-size:1.15rem; color:var(--ink); margin:1.8em 0 .5em; font-family:var(--serif);}
.doc p, .doc li{color:var(--read); line-height:1.78;}
.doc p{margin:0 0 1.2em;}
.doc ul, .doc ol{margin:0 0 1.4em; padding-left:1.3em;}
.doc li{margin:.5em 0;}
.doc li::marker{color:var(--amber);}
.doc a{color:var(--amber); border-bottom:1px solid rgba(227,172,78,.4);}
.doc strong{color:var(--ink);}
.doc .updated{font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:2.4rem;}
.doc table{width:100%; border-collapse:collapse; margin:0 0 1.6em; font-size:.92rem;}
.doc th, .doc td{text-align:left; padding:.7em .8em; border-bottom:1px solid var(--hair); color:var(--read);}
.doc th{color:var(--amber); font-family:var(--sans); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;}

/* article body (journal posts) */
.deck{width:min(72ch,90vw); margin:clamp(2.6rem,5vw,3.8rem) auto 0; font-family:var(--serif);
  font-size:clamp(1.3rem,2.6vw,1.7rem); line-height:1.4; color:var(--ink); font-style:italic; text-align:center;}
.deck-rule{width:44px; height:1px; background:var(--amber); margin:1.8rem auto 0;}
article.post{width:min(68ch,90vw); margin:clamp(2.4rem,4vw,3.4rem) auto 0;}
.prose{font-size:1.16rem; line-height:1.78; color:var(--read);}
.prose>p{margin:0 0 1.35em;}
.prose>p:first-of-type{font-size:1.28rem; color:var(--ink);}
.prose>p:first-of-type::first-letter{float:left; font-family:var(--serif); color:var(--amber);
  font-size:4.4rem; line-height:.78; padding:.06em .12em 0 0; font-weight:600;}
.prose h2{font-size:clamp(1.5rem,3vw,2rem); color:var(--ink); margin:2em 0 .7em; line-height:1.1;}
.prose h2::before{content:"\25C6"; color:var(--amber); font-size:.5em; vertical-align:middle;
  margin-right:.7em; position:relative; top:-.18em;}
.prose strong{color:var(--ink); font-weight:600;}
.prose em{font-style:italic; color:var(--ink);}
.prose a{color:var(--amber); border-bottom:1px solid rgba(227,172,78,.4);}
.prose ul{list-style:none; padding:0; margin:1.4em 0;}
.prose ul li{position:relative; padding-left:1.6em; margin:.7em 0;}
.prose ul li::before{content:""; position:absolute; left:0; top:.62em; width:7px; height:7px;
  background:var(--amber); transform:rotate(45deg);}
.prose ol{counter-reset:c; list-style:none; padding:0; margin:1.4em 0;}
.prose ol li{position:relative; padding-left:2.4em; margin:.9em 0;}
.prose ol li::before{counter-increment:c; content:counter(c,decimal-leading-zero); position:absolute; left:0; top:.05em;
  font-family:var(--serif); color:var(--amber); font-size:1.05em; font-weight:600;}
.prose blockquote{margin:2.4em 0; padding:0; border:0; text-align:center;}
@media(min-width:900px){ .prose blockquote{margin-inline:-3.5rem;} }
.prose blockquote p{font-family:var(--serif); font-style:italic; font-size:clamp(1.3rem,4.8vw,2.3rem);
  line-height:1.3; color:var(--ink); text-wrap:balance;}
.after{width:min(68ch,90vw); margin:clamp(3rem,5vw,4rem) auto 0;}
.author{display:flex; align-items:center; gap:1.4rem; padding:1.8rem 0;
  border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);}
.author img{height:74px; width:auto;}
.author .n{font-family:var(--serif); font-size:1.3rem; color:var(--ink);}
.author .b{font-size:.92rem; color:var(--muted); margin-top:.25rem;}
.author .b a{color:var(--amber);}
.endcta{margin:clamp(2.6rem,5vw,4rem) auto 0; text-align:center;
  background:radial-gradient(120% 130% at 50% 0%, #1c130b, #0c0805 72%); border:1px solid var(--hair);
  padding:clamp(2.4rem,5vw,3.6rem) 1.6rem; border-radius:3px;}
.endcta h2{font-size:clamp(1.6rem,3.4vw,2.4rem); line-height:1.05;}
.endcta p{color:var(--muted); margin:.9rem auto 1.7rem; max-width:40ch;}
.more{width:min(1180px,90vw); margin:clamp(3.4rem,6vw,5rem) auto 0; padding-top:2rem; border-top:1px solid var(--hair);}
.more .label{display:block; margin-bottom:1.6rem;}
.more-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.4rem;}
@media(max-width:640px){ .more-grid{grid-template-columns:1fr;} }
.mcard{border:1px solid var(--hair); border-radius:3px; padding:1.6rem 1.5rem;
  transition:border-color .2s, transform .2s; display:block;}
.mcard:hover{border-color:var(--amber); transform:translateY(-3px);}
.mcard .c{font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);}
.mcard h3{font-family:var(--serif); font-size:1.3rem; line-height:1.15; margin-top:.5rem;}
.mcard .r{margin-top:1rem; font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--amber);}
.backrow{width:min(1180px,90vw); margin:2.4rem auto 0; text-align:center;}
.back{font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);}
.back:hover{color:var(--amber);}

/* journal index cards */
/* min(100%,320px) stops the classic auto-fill overflow on phones narrower than the min track */
.jcards{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); gap:1.6rem;
  margin-top:clamp(2rem,4vw,3rem);}
.jcard{border:1px solid var(--hair); border-radius:3px; overflow:hidden; display:block;
  transition:border-color .2s, transform .2s;}
.jcard:hover{border-color:var(--amber); transform:translateY(-3px);}
.jcard img{display:block; width:100%; height:auto; max-width:100%; aspect-ratio:3/2; object-fit:cover;}
.jcard .body{padding:1.3rem 1.4rem 1.6rem;}
.jcard .c{font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--amber);}
.jcard h2{font-family:var(--serif); font-size:1.35rem; line-height:1.15; margin:.5rem 0 .6rem;}
.jcard p{font-size:.92rem; color:var(--muted); line-height:1.6;}
.jcard time{display:block; margin-top:1rem; font-size:.66rem; letter-spacing:.16em; color:var(--faint);}

/* contact */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start;}
@media(max-width:820px){ .contact-grid{grid-template-columns:1fr;} }
.nap{font-size:1rem; line-height:2; color:var(--read);}
.nap strong{color:var(--ink); display:block; font-family:var(--serif); font-size:1.3rem; margin-bottom:.4rem;}
.nap a{color:var(--amber);}
.field{display:block; margin-bottom:1.2rem;}
.field span{display:block; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.5rem;}
.field input, .field textarea, .field select{width:100%; background:var(--panel); color:var(--ink);
  border:1px solid var(--hair); padding:.85em 1em; font:inherit; border-radius:2px;}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--amber);}
.field textarea{min-height:150px; resize:vertical;}
.form-note{font-size:.78rem; color:var(--faint); margin-top:1rem;}
.contact-actions{display:flex; flex-wrap:wrap; gap:.9rem;}
.contact-actions .btn{justify-content:center;}
@media(max-width:480px){ .contact-actions{flex-direction:column; align-items:stretch;} }

/* faq */
.faq{width:min(74ch,90vw); margin-inline:auto;}
.faq details{border-top:1px solid var(--hair); padding:1.4rem 0;}
.faq details:last-of-type{border-bottom:1px solid var(--hair);}
.faq summary{cursor:pointer; list-style:none; font-family:var(--serif); font-size:1.22rem;
  color:var(--ink); display:flex; justify-content:space-between; gap:1.4rem; align-items:baseline;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; color:var(--amber); font-family:var(--sans); font-size:1.1rem; flex:0 0 auto;}
.faq details[open] summary::after{content:"\2013";}
.faq details p{margin-top:.9rem; color:var(--read); line-height:1.75;}

/* 404 */
.notfound{min-height:76vh; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:8rem 1.5rem 4rem;}
.notfound h1{font-size:clamp(3rem,12vw,7rem); line-height:.9;}
.notfound p{color:var(--muted); margin:1.2rem auto 2rem; max-width:44ch;}

/* reveal */
html.anim .reveal{opacity:0; transform:translateY(22px); transition:opacity .8s ease, transform .8s ease;}
html.anim .reveal.in{opacity:1; transform:none;}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  html.anim .reveal, html.anim .st{opacity:1; transform:none; transition:none;}
  .hero-vid{animation:none;}
  .btn:hover, figure.shot:hover img, .mcard:hover, .jcard:hover{transform:none;}
}

/* --- mobile nav (hamburger) --- */
.nav-toggle{display:none; width:44px; height:44px; padding:0; margin-left:auto;
  background:transparent; border:1px solid color-mix(in srgb, var(--amber) 55%, transparent);
  border-radius:6px; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:5px;}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--amber); transition:transform .2s ease, opacity .2s ease;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media(max-width:900px){
  .nav-toggle{display:inline-flex;}
  nav.links{display:none; position:absolute; top:100%; left:0; right:0;
    flex-direction:column; gap:0; padding:1rem 1.5rem 1.4rem;
    background:color-mix(in srgb, var(--bg) 97%, transparent);
    border-top:1px solid color-mix(in srgb, var(--amber) 25%, transparent);
    font-size:.82rem;}
  nav.links.open{display:flex;}
  nav.links a{padding:.65rem 0; border-bottom:1px solid color-mix(in srgb, var(--muted) 15%, transparent);}
  nav.links a:last-child{border-bottom:0;}
  header.nav{position:sticky;}
  .nav-in{position:relative;}
}
@media(max-width:520px){
  .nav-cta{display:none;}
}
