:root { --bg:#fbfaf7; --ink:#1c1a17; --soft:#6f6a62; --line:#dcd7cd; --clay:#a8471f; --card:#fff; --shadow:0 18px 50px -24px rgba(40,28,16,.35); }
@media (prefers-color-scheme: dark) { :root { --bg:#171513; --ink:#ebe6dd; --soft:#a39c90; --line:#35312b; --clay:#e08055; --card:#201d1a; --shadow:0 18px 50px -24px rgba(0,0,0,.8); } }
* { box-sizing:border-box; margin:0; }
body { background:var(--bg); color:var(--ink); font:17px/1.6 "Hanken Grotesk", sans-serif; padding-bottom:78px; }
img { display:block; width:100%; height:100%; object-fit:cover; }
a { color:inherit; }
.serif { font-family:Newsreader, serif; }
.cap { font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); }

.cover { position:relative; height:min(86vh, 760px); min-height:480px; color:#fff; }
.cover::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 45%, rgba(0,0,0,.78) 100%); pointer-events:none; }
.cover > div { position:absolute; z-index:1; left:0; right:0; padding:0 20px; }
.cover .top { top:18px; display:flex; justify-content:space-between; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; }
.cover .bottom { bottom:26px; }
.cover h1 { font:500 clamp(2.3rem, 9vw, 5rem)/1 Newsreader, serif; letter-spacing:-.01em; max-width:14ch; }
.cover .bottom p { margin-top:10px; opacity:.9; }

.page { max-width:1180px; margin:0 auto; padding:0 20px; }
.lede { font:400 clamp(1.3rem, 4.6vw, 1.75rem)/1.35 Newsreader, serif; padding:32px 0 8px; max-width:30ch; }
.lede em { color:var(--clay); }
.fit { max-width:56ch; padding-top:8px; }

.card { background:var(--card); border:1px solid var(--line); border-radius:4px; padding:22px; box-shadow:var(--shadow); margin:24px 0 8px; }
.card .p { font:500 3rem/1 Newsreader, serif; }
.card .p small { font:400 1rem "Hanken Grotesk", sans-serif; color:var(--soft); }
.card dl { display:grid; grid-template-columns:1fr auto; gap:8px 12px; margin:18px 0; padding-top:16px; border-top:1px solid var(--line); font-size:.95rem; }
.card dt { color:var(--soft); } .card dd { margin:0; text-align:right; font-weight:500; }
.btn { display:block; text-align:center; padding:15px; border-radius:3px; text-decoration:none; font-weight:700; border:1.5px solid var(--ink); }
.btn.go { background:var(--clay); border-color:var(--clay); color:#fff; margin-bottom:8px; }
.card .note { font-size:.85rem; color:var(--soft); margin-top:12px; text-align:center; }

.ch { padding:44px 0 0; }
.ch header { display:flex; align-items:baseline; gap:14px; border-top:1px solid var(--ink); padding-top:12px; margin-bottom:14px; }
.ch h2 { font:500 clamp(1.8rem, 6.5vw, 2.6rem)/1.05 Newsreader, serif; flex:1; }
.ch header span { font:500 1.05rem Newsreader, serif; white-space:nowrap; }
.ch > p { max-width:56ch; margin-bottom:18px; }
.set { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.set .ph { border:0; padding:0; background:none; aspect-ratio:4/3; cursor:zoom-in; }
.set .ph:first-child { grid-column:span 2; aspect-ratio:3/2; }

.quote { margin:52px 0 0; padding:34px 22px; background:var(--ink); color:var(--bg); border-radius:4px; }
.quote h2 { font:italic 400 clamp(1.9rem, 7.5vw, 3.2rem)/1.08 Newsreader, serif; max-width:16ch; }
.quote p { margin:14px 0; opacity:.8; }
.quote ul { padding-left:1.1em; display:grid; gap:6px; font-size:.97rem; }

.two { display:grid; gap:28px; }
.two h3 { font:500 1.3rem Newsreader, serif; margin-bottom:8px; }
.two ul { padding-left:1.1em; display:grid; gap:5px; }
.map { width:100%; height:320px; border:1px solid var(--line); border-radius:4px; margin:6px 0 10px; }
.last { text-align:center; padding:56px 0 30px; }
.last h2 { font:500 clamp(2rem, 8vw, 3.4rem)/1.05 Newsreader, serif; margin-bottom:10px; }
.last .row { display:grid; gap:8px; max-width:380px; margin:22px auto 0; }

.bar { position:fixed; left:0; right:0; bottom:0; z-index:5; display:flex; gap:8px; align-items:center; padding:10px 14px; background:var(--card); border-top:1px solid var(--line); }
.bar strong { font:500 1.5rem Newsreader, serif; margin-right:auto; }
.bar strong small { font:400 .8rem "Hanken Grotesk", sans-serif; color:var(--soft); }
.bar a { padding:12px 16px; min-height:46px; border-radius:3px; text-decoration:none; font-weight:700; border:1.5px solid var(--ink); }
.bar a.go { background:var(--clay); border-color:var(--clay); color:#fff; }

@media (min-width: 900px) {
  body { padding-bottom:0; } .bar { display:none; }
  .cover > div { padding:0 44px; } .cover .bottom { bottom:44px; }
  .page { display:grid; grid-template-columns:minmax(0, 1fr) 340px; gap:56px; padding:0 44px; align-items:start; }
  .side { position:sticky; top:24px; grid-column:2; grid-row:1; margin-top:-70px; z-index:2; }
  .main { grid-column:1; grid-row:1; }
  .card { margin:0; }
  .set { grid-template-columns:repeat(3, 1fr); }
  .set .ph, .set .ph:first-child { aspect-ratio:4/3; }
  .set .ph:first-child { grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
  .set.flip .ph:first-child { grid-column:2 / span 2; grid-row:1 / span 2; }
  .quote { padding:48px; display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; }
  .two { grid-template-columns:1fr 1fr; }
}

.banner { background:var(--clay); color:#fff; text-align:center; padding:10px 16px; font-weight:700; }
.footer { border-top:1px solid var(--line); padding:20px 20px 32px; text-align:center; color:var(--soft); font-size:.85rem; }
.footer a { color:var(--clay); font-weight:700; }