/* BSD Artistic 01 — shared stylesheet for generated pages (ecosystem pages today, every page later).
   The three token blocks mirror the homepage helmet exactly; scripts/check.mjs fails when they drift.
   Content components and the curtain drawer live in content.css, which the homepage also loads. */

* { box-sizing: border-box; }

/* ── theme tokens · dark (default) ── */
:root {
  --page:#050505;    --page-rgb:5,5,5;
  --panel:#0B0B0D;   --panel-rgb:11,11,13;
  --ink:#F7F1E8;     --ink-rgb:247,241,232;
  --ink-mute:#808080;
  --gold:#D6A84F;    --gold-rgb:214,168,79;
  --gold-deep:#B8872D;
  --gold-bright:#E8C46A;
  --red:#D71920;     --red-rgb:215,25,32;
  --red-deep:#B11226;
  --on-gold:#0B0B0D;
  --on-red:#FFFFFF;
  --fab-ink:#0B0B0D;  --fab-ink-rgb:11,11,13;
  --fab-dark:#8a1420;
  --fab-deep1:#1a1a1d;
  --fab-deep2:#1c1416;
  --fab-mid:#171719;
  /* image scrim: artwork is dark in both themes, so its vignette never flips to cream */
  --scrim-rgb:5,5,5;
}
/* ── theme tokens · light ── */
:root[data-bsd-theme="light"], [data-bsd-theme="light"] {
  --page:#FCFAF6;    --page-rgb:252,250,246;
  --panel:#F3EBDE;   --panel-rgb:243,235,222;
  --ink:#14110E;     --ink-rgb:20,17,14;
  --ink-mute:#6E675E;
  --gold:#8A5F14;    --gold-rgb:138,95,20;
  --gold-deep:#7E5612;
  --gold-bright:#C2922F;
  --red:#C2101C;     --red-rgb:194,16,28;
  --red-deep:#9A0C16;
  --on-gold:#FFFFFF;
  --fab-ink:#3A2A17;  --fab-ink-rgb:58,42,23;
  --fab-dark:#6E0D16;
  --fab-deep1:#E4D9C6;
  --fab-deep2:#EADFCC;
  --fab-mid:#EDE3D2;
}
/* ── cinematic anchors: stay dark in both themes ── */
[data-bsd-ink="dark"] {
  --page:#050505;    --page-rgb:5,5,5;
  --panel:#0B0B0D;   --panel-rgb:11,11,13;
  --ink:#F7F1E8;     --ink-rgb:247,241,232;
  --ink-mute:#808080;
  --gold:#D6A84F;    --gold-rgb:214,168,79;
  --gold-deep:#B8872D;
  --gold-bright:#E8C46A;
  --red:#D71920;     --red-rgb:215,25,32;
  --red-deep:#B11226;
  --on-gold:#0B0B0D;
  --fab-ink:#0B0B0D;  --fab-ink-rgb:11,11,13;
  --fab-dark:#8a1420;
  --fab-deep1:#1a1a1d;
  --fab-deep2:#1c1416;
  --fab-mid:#171719;
}

html, body { margin:0; padding:0; background:var(--page); touch-action:pan-y pinch-zoom; }
html { scroll-behavior:smooth; }
body { overflow-x:hidden; font-family:'Manrope',sans-serif; font-weight:500; color:var(--ink); overscroll-behavior-y:auto; transition:background .5s ease, color .5s ease; }
::selection { background: var(--red); color: var(--on-red); }

@keyframes bsdWeave { to { background-position: 56px 28px, 28px 0, 0 0; } }
@keyframes bsdDrawX { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes bsdFlash { 0% { opacity: 0; } 8% { opacity: .85; } 22% { opacity: 0; } 34% { opacity: .5; } 100% { opacity: 0; } }
@keyframes bsdFold { from { opacity: 0; transform: translateY(30px) rotateX(-55deg); } to { opacity: 1; transform: translateY(0) rotateX(0); } }
@keyframes bsdRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }

/* ── brand wordmarks ── */
.bsd-brand { position:relative; display:block; width:clamp(136px,11.5vw,166px); aspect-ratio:360/66; flex:none; }
.bsd-brand img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; object-position:left center; transition:opacity .35s ease; }
.bsd-brand__on-dark { opacity:1; }
.bsd-brand__on-light { opacity:0; }
[data-bsd-theme="light"] .bsd-brand:not(.bsd-brand--fixed-dark) .bsd-brand__on-dark { opacity:0; }
[data-bsd-theme="light"] .bsd-brand:not(.bsd-brand--fixed-dark) .bsd-brand__on-light { opacity:1; }
.bsd-brand--fixed-dark .bsd-brand__on-dark { opacity:1; }
.bsd-brand--fixed-dark .bsd-brand__on-light { opacity:0; }
[data-bsd-theme="light"] [data-bsd-ink="dark"] .bsd-brand .bsd-brand__on-dark { opacity:1; }
[data-bsd-theme="light"] [data-bsd-ink="dark"] .bsd-brand .bsd-brand__on-light { opacity:0; }

/* ── interaction layer (same contract as the homepage helmet) ── */
.bsd-skip { position:fixed; z-index:130; top:12px; left:12px; padding:12px 18px; border-radius:2px; background:var(--red); color:var(--on-red); font-size:13px; font-weight:600; text-decoration:none; transform:translateY(-160%); transition:transform .35s cubic-bezier(.16,1,.3,1); }
.bsd-skip:focus { transform:none; }
.bsd-site :focus-visible { outline:2px solid var(--gold-bright); outline-offset:3px; }
.bsd-visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.bsd-site :is(section[id], article[id], footer[id]) { scroll-margin-top:clamp(78px,8vw,104px); }

.bsd-btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:17px 34px; border:1px solid transparent; border-radius:2px; font-family:'Manrope',sans-serif; font-size:14px; font-weight:600; letter-spacing:.04em; line-height:1.2; text-decoration:none; white-space:nowrap; cursor:pointer; transition:background-color .35s ease, border-color .35s ease, color .35s ease; }
.bsd-btn--primary { color:var(--on-red); background:var(--red); }
.bsd-btn--primary:hover { background:var(--red-deep); }
.bsd-btn--secondary { color:var(--ink); background:transparent; border-color:rgba(var(--gold-rgb),.45); }
.bsd-btn--secondary:hover { border-color:var(--gold); }
.bsd-btn--compact { padding:14px 26px; font-size:13px; }
.bsd-btn span[aria-hidden] { color:inherit; font-size:15px; line-height:1; }

.bsd-icon-btn { position:relative; display:flex; flex:none; align-items:center; justify-content:center; padding:0; border:1px solid rgba(var(--gold-rgb),.5); border-radius:50%; background:transparent; color:var(--ink); cursor:pointer; transition:border-color .35s ease, color .35s ease; }
.bsd-icon-btn:hover { border-color:var(--red); }
.bsd-theme-toggle { width:38px; height:38px; }
.bsd-theme-toggle svg { position:absolute; display:block; transition:opacity .45s ease, transform .55s cubic-bezier(.16,1,.3,1); }
.bsd-theme-toggle__sun { opacity:0; transform:rotate(-70deg) scale(.55); }
.bsd-theme-toggle__moon { opacity:1; transform:none; }
[data-bsd-theme="light"] .bsd-theme-toggle__sun { opacity:1; transform:none; }
[data-bsd-theme="light"] .bsd-theme-toggle__moon { opacity:0; transform:rotate(-70deg) scale(.55); }
.bsd-menu-trigger { display:flex; align-items:center; gap:14px; padding:8px 0; border:0; background:transparent; color:var(--ink); cursor:pointer; font-family:'Manrope',sans-serif; font-size:10.5px; font-weight:600; letter-spacing:.28em; text-transform:uppercase; white-space:nowrap; }
.bsd-menu-trigger__bars { display:flex; flex-direction:column; gap:5px; }
.bsd-menu-trigger__bars span { width:30px; height:1px; background:currentColor; transition:width .45s cubic-bezier(.16,1,.3,1); }
.bsd-menu-trigger:hover .bsd-menu-trigger__bars span:last-child { width:18px; }
.bsd-menu-close { width:46px; height:46px; border:1px solid rgba(var(--gold-rgb),.4); border-radius:2px; background:transparent; color:var(--ink); cursor:pointer; font-size:20px; line-height:1; transition:border-color .35s ease, color .35s ease; }
.bsd-menu-close:hover { border-color:var(--red); color:var(--red); }

/* ── header ── */
.bsd-header { position:fixed; top:0; right:0; left:0; z-index:60; display:flex; align-items:center; justify-content:space-between; padding:clamp(18px,2.4vw,30px) clamp(24px,5vw,72px); color:var(--ink); background:rgba(var(--page-rgb),0); border-bottom:1px solid transparent; transition:background-color .42s ease, border-color .42s ease, box-shadow .42s ease, backdrop-filter .42s ease; }
.bsd-header[data-header-state="shielded"] { background:rgba(var(--page-rgb),.76); border-bottom-color:rgba(var(--ink-rgb),.11); box-shadow:0 14px 42px rgba(0,0,0,.24); -webkit-backdrop-filter:blur(18px) saturate(135%); backdrop-filter:blur(18px) saturate(135%); }
.bsd-header__actions { display:flex; align-items:center; gap:clamp(18px,2.6vw,32px); }

/* ── full-screen menu (the homepage renders the same structure through its runtime) ── */
.bsd-menu { position:fixed; inset:0; z-index:90; background:var(--page); color:var(--ink); }
.bsd-menu[hidden] { display:none; }
.bsd-menu__flash { position:absolute; inset:0; background:var(--red); animation:bsdFlash .85s cubic-bezier(.4,0,.2,1) both; pointer-events:none; }
.bsd-menu__grid { position:absolute; inset:0; background-image:repeating-linear-gradient(90deg, rgba(var(--gold-rgb),.06) 0 1px, transparent 1px 72px); pointer-events:none; }
.bsd-menu__frame { position:relative; display:flex; height:100%; flex-direction:column; padding:clamp(22px,3vw,40px) clamp(24px,5vw,72px); }
.bsd-menu__top { display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; }
.bsd-menu__nav { display:flex; flex:1 1 auto; flex-direction:column; justify-content:flex-start; gap:2px; min-height:0; padding:min(clamp(14px,2.4vw,32px), 3.2vh) 0; overflow-x:hidden; overflow-y:auto; perspective:1400px; scrollbar-width:none; container-type:size; }
.bsd-menu__nav::-webkit-scrollbar { width:0; height:0; }
.bsd-menu__item { animation:bsdFold .6s var(--fold-delay, .1s) cubic-bezier(.16,1,.3,1) both; }
.bsd-menu__item:first-child { margin-top:auto; }
.bsd-menu__item:last-child { margin-bottom:auto; }
.bsd-menu__toggle { display:flex; width:100%; align-items:baseline; gap:clamp(12px,2vw,22px); padding:min(clamp(6px,1vw,12px), 1.5vh) 0; border:0; background:transparent; color:var(--ink); cursor:pointer; text-align:left; font-family:'Cormorant Garamond',serif; font-size:min(clamp(30px,5.2vw,72px), 9.5cqh); font-weight:600; line-height:1.04; letter-spacing:-0.03em; transition:color .35s ease; }
.bsd-menu__toggle[aria-expanded="true"] { color:var(--gold-bright); }
.bsd-menu__chev { margin-left:auto; color:var(--gold-deep); font-family:'Manrope',sans-serif; font-size:18px; transition:transform .45s cubic-bezier(.16,1,.3,1), color .3s ease; }
.bsd-menu__toggle[aria-expanded="true"] .bsd-menu__chev { color:var(--red); transform:rotate(45deg); }
.bsd-menu__sub { max-height:0; overflow:hidden; opacity:0; visibility:hidden; transition:max-height .55s cubic-bezier(.16,1,.3,1), opacity .4s ease, visibility 0s linear .55s; }
.bsd-menu__sub[data-open] { max-height:min(300px, 24vh); opacity:1; visibility:visible; transition:max-height .55s cubic-bezier(.16,1,.3,1), opacity .4s ease, visibility 0s linear 0s; }
.bsd-menu-index { min-width:40px; color:var(--gold-deep); font-family:'Manrope',sans-serif; font-size:11px; font-weight:600; letter-spacing:.2em; text-align:left; font-variant-numeric:tabular-nums; }
.bsd-menu-sublinks { display:flex; flex-wrap:wrap; gap:14px 30px; padding:4px 0 22px clamp(0px,4vw,54px); font-size:13px; line-height:1.4; letter-spacing:.02em; }
.bsd-menu-sublink { padding-bottom:5px; color:rgba(var(--ink-rgb),.66); text-decoration:none; background-image:linear-gradient(90deg, var(--gold-bright), var(--red)); background-repeat:no-repeat; background-position:left bottom; background-size:0% 1px; transition:color .35s ease, background-size .55s cubic-bezier(.16,1,.3,1); }
.bsd-menu-sublink:is(:hover, :focus-visible) { color:var(--ink); background-size:100% 1px; }
.bsd-menu__fade { flex:none; height:30px; margin-top:-30px; pointer-events:none; background:linear-gradient(transparent, var(--page)); }
.bsd-menu__foot { display:flex; flex:0 0 auto; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:22px; border-top:1px solid rgba(var(--gold-rgb),.25); animation:bsdFold .6s .52s cubic-bezier(.16,1,.3,1) both; }
.bsd-menu__foot > span { color:var(--ink-mute); font-size:11px; letter-spacing:.2em; text-transform:uppercase; }

/* ── page shell ── */
.bsd-page { display:block; min-height:70vh; }

/* ── footer ── */
.bsd-footer { position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 28px; padding:24px clamp(24px,5vw,72px); border-top:1px solid rgba(var(--gold-rgb),.2); background:var(--page); color:var(--ink-mute); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; }
.bsd-footer__channels { display:flex; flex-wrap:wrap; gap:10px 24px; }
.bsd-footer a { color:inherit; text-decoration:none; transition:color .35s ease; }
.bsd-footer a:hover { color:var(--gold-bright); }

@media (max-width:720px) {
  .bsd-header[data-header-state="shielded"] { background:rgba(var(--page-rgb),.84); box-shadow:0 10px 30px rgba(0,0,0,.2); -webkit-backdrop-filter:blur(10px) saturate(120%); backdrop-filter:blur(10px) saturate(120%); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}