/* ===========================================================================
   POLEMARCH LLC — shared system
   "Byzantium, entered the space age." Institutional. Disciplined. Monumental.
   Serif: Newsreader (Tiempos-class)  ·  Technical sans: Inter
   Accent metal (imperial gold) — extremely limited. Byzantine purple — a whisper.
   =========================================================================== */
:root{
  --black:#09090A; --graphite:#141518; --charcoal:#1C1E22; --gunmetal:#272A30;
  --ivory:#ECE8DC; --parchment:#CFC8B6; --titanium:#9DA0A0; --faint:#5C5F62;
  --line:#23252A; --line2:#33363C;
  --gold:#B40419; --goldHi:#D8232F; --purple:#5A3A66; --cr:#B40419;
  --pad:clamp(22px,5.2vw,92px);
  --maxw:1180px;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Inter',ui-sans-serif,system-ui,'Helvetica Neue',sans-serif;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--black); color:var(--ivory); font-family:var(--serif);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
  line-height:1.5; }
body::before{ content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:var(--black) url('assets/concrete-dark.png') center/720px repeat; opacity:.6; }
::selection{ background:var(--cr); color:#fff; }
a{ color:inherit; text-decoration:none; }
img{ display:block; }

.serif{ font-family:var(--serif); }
.sans{ font-family:var(--sans); }
.wrapw{ max-width:var(--maxw); margin:0 auto; }
.tech{ font-family:var(--sans); font-weight:500; text-transform:uppercase; letter-spacing:.32em;
  font-size:11px; color:var(--titanium); }
.kicker{ font-family:var(--sans); font-weight:500; text-transform:uppercase; letter-spacing:.34em;
  font-size:11px; color:var(--faint); }

/* meander — drawn in CSS bg via JS injection; gold, extremely limited */
.meander{ height:13px; width:100%; max-width:var(--mw,260px); margin:0 auto; opacity:.85;
  background-repeat:repeat-x; background-position:center; background-size:auto 13px; }

/* tintable wing mark (white → red cross-fade on hover) */
.wmk{ position:relative; display:inline-block; line-height:0; flex:none; }
.wmk .wa{ display:block; width:auto; transition:opacity .4s; }
.wmk .wb{ position:absolute; top:0; left:0; height:100%; width:auto; opacity:0; transition:opacity .4s; }

/* ── header ── */
.bar{ position:fixed; inset:0 0 auto 0; z-index:60; display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--pad); height:78px; transition:background .5s,border-color .5s,height .5s; border-bottom:1px solid transparent; }
.bar.solid{ background:rgba(9,9,10,.86); backdrop-filter:blur(12px); border-bottom-color:var(--line); height:62px; }
.bar .id{ display:flex; align-items:center; gap:13px; }
.bar .id .wmk .wa{ height:22px; }
.bar .id .wm{ font-family:var(--serif); font-weight:500; letter-spacing:.26em; font-size:17px; color:var(--ivory); transition:color .35s; }
.bar .id:hover .wmk .wb{ opacity:1; }
.bar .id:hover .wmk .wa{ opacity:0; }
.bar .id:hover .wm{ color:var(--cr); }
.bar nav{ display:flex; gap:34px; }
.bar nav a{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--titanium); transition:color .3s; white-space:nowrap; }
.bar nav a:hover,.bar nav a.here{ color:var(--ivory); }
.bar nav a.here{ position:relative; }
.bar nav a.here::after{ content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:var(--gold); }
@media(max-width:680px){ .bar nav{ gap:16px; } .bar .id .wm{ font-size:14px; letter-spacing:.18em; } .bar nav .bar-hide-mobile{ display:none; } }
@media(max-width:480px){ .bar nav{ gap:10px; } .bar nav a{ font-size:9.5px; letter-spacing:.08em; } .bar .id .wm{ font-size:13px; letter-spacing:.14em; } }

/* ── page intro header (inner pages) ── */
.phead{ padding:clamp(150px,20vh,230px) var(--pad) clamp(56px,8vw,104px); border-bottom:1px solid var(--line);
  position:relative; isolation:isolate; }
.phead .ey{ margin-bottom:26px; }
.phead h1{ margin:0; font-family:var(--serif); font-weight:400; font-size:clamp(44px,8vw,104px);
  line-height:1.0; letter-spacing:-.01em; color:var(--ivory); }
.phead.celestial{ background:var(--black) center/cover no-repeat; }
.phead.celestial::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.55;
  background:url('assets/celestial.png') center/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent); mask-image:linear-gradient(180deg,#000,transparent); }

/* ── generic section ── */
section.band{ padding:clamp(84px,12vw,168px) var(--pad); border-top:1px solid var(--line); position:relative; }
section.band:first-of-type{ border-top:none; }
.seclabel{ display:flex; align-items:center; gap:16px; margin-bottom:clamp(44px,5.5vw,72px); }
.seclabel .n{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:.18em; color:var(--gold); }
.seclabel .t{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--titanium); }
.seclabel .ln{ flex:1; height:1px; background:var(--line); }

/* lead + prose */
.lead{ margin:0; font-family:var(--serif); font-weight:400; font-size:clamp(25px,3.9vw,46px);
  line-height:1.28; letter-spacing:-.005em; color:var(--ivory); }
.prose{ font-size:clamp(15px,1.55vw,17.5px); line-height:1.92; color:var(--parchment); }
.prose p{ margin:0 0 22px; } .prose p:last-child{ margin-bottom:0; }
.prose .em{ color:var(--ivory); }
.twocol{ display:grid; grid-template-columns:1fr; gap:clamp(30px,4vw,60px); }
@media(min-width:920px){ .twocol{ grid-template-columns:0.85fr 1.15fr; align-items:start; } }

/* ── frieze band ── */
.friezewrap{ position:relative; border-top:1px solid var(--line2); border-bottom:1px solid var(--line2); background:#0c0c0b; }
.friezewrap .pillar{ position:absolute; top:0; bottom:0; width:13px; z-index:3;
  background:#15161a url('assets/concrete-dark.png') center/200px; }
.friezewrap .pillar::before{ content:""; position:absolute; inset:0 0 auto 0; height:5px; background:var(--gold); opacity:.5; }
.friezewrap .pillar::after{ content:""; position:absolute; inset:auto 0 0 0; height:5px; background:var(--gold); opacity:.5; }
.friezewrap .pillar.l{ left:0; } .friezewrap .pillar.r{ right:0; }
.frieze{ position:relative; height:clamp(120px,16vw,196px); width:100%;
  background:#4f3f24 url('assets/frieze-bronze.png') center/cover no-repeat; filter:saturate(.7) brightness(.82); }
.frieze::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(9,9,10,.34),rgba(9,9,10,.5)); }

/* ── footer ── */
footer{ padding:clamp(70px,9vw,124px) var(--pad) clamp(36px,4vw,54px); border-top:1px solid var(--line); }
.foot-grid{ display:flex; align-items:flex-start; justify-content:space-between; gap:40px; flex-wrap:wrap;
  padding-bottom:clamp(44px,5vw,64px); border-bottom:1px solid var(--line); }
.foot-id{ display:flex; align-items:center; gap:14px; }
.foot-id .wmk .wa{ height:30px; }
.foot-id .wm{ font-family:var(--serif); font-weight:500; letter-spacing:.26em; font-size:18px; transition:color .35s; }
.foot-id:hover .wmk .wb{ opacity:1; }
.foot-id:hover .wmk .wa{ opacity:0; }
.foot-id:hover .wm{ color:var(--cr); }
.foot-nav{ display:flex; gap:30px; flex-wrap:wrap; }
.foot-nav a{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--titanium); transition:color .25s; }
.foot-nav a:hover{ color:var(--ivory); }
.foot-x{ display:flex; align-items:center; color:var(--titanium); transition:color .25s; }
.foot-x:hover{ color:var(--ivory); }
.colophon{ margin-top:clamp(34px,4vw,48px); display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap; font-family:var(--sans); font-weight:500; font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--faint); }

/* ── reveal (slow, intentional) ── */
.js .rv{ opacity:0; }
.js .rv.in{ animation:rise 1.4s cubic-bezier(.22,.6,.2,1) both; }
@keyframes rise{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }
.hl{ animation:rise 1.5s cubic-bezier(.22,.6,.2,1) both; }
.hl.d1{ animation-delay:.1s } .hl.d2{ animation-delay:.34s } .hl.d3{ animation-delay:.58s } .hl.d4{ animation-delay:.82s } .hl.d5{ animation-delay:1.06s }
@media(prefers-reduced-motion:reduce){ .js .rv,.hl{ opacity:1!important; animation:none!important; } }