/* ==========================================================================
   Adam Tracy — Redesign Design System
   Direction: "Institutional Editorial" — aubergine ink, bone paper, brand plum.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

/* ---------- Tokens ---------- */
:root {
  /* ink (dark) */
  --ink:        #140B13;
  --ink-2:      #1A0F18;
  --ink-3:      #241624;
  --ink-line:   rgba(244, 241, 234, 0.12);
  --ink-line-2: rgba(244, 241, 234, 0.07);

  /* paper (light) */
  --paper:      #F4F1EA;
  --paper-2:    #ECE7DB;
  --paper-line: rgba(20, 11, 19, 0.12);
  --paper-line-2: rgba(20, 11, 19, 0.07);

  /* accent */
  --plum:      #C465B4;
  --plum-2:    #D98FCC;
  --plum-ink:  #903084;

  /* text */
  --on-ink:     #F4F1EA;
  --on-ink-mut: rgba(244, 241, 234, 0.60);
  --on-ink-dim: rgba(244, 241, 234, 0.38);
  --on-paper:   #140B13;
  --on-paper-mut: rgba(20, 11, 19, 0.62);
  --on-paper-dim: rgba(20, 11, 19, 0.40);

  /* type */
  --serif: 'Instrument Serif', 'Times New Roman', serif;
  --sans:  'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono:  'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* layout */
  --wrap: 1240px;
  --gutter: clamp(20px, 4vw, 56px);
  --r: 3px;
  --r-lg: 6px;

  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  font-family: var(--sans);
  background: var(--ink);
  color: var(--on-ink);
  line-height: 1.6;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea { font: inherit; color: inherit; }
ul { list-style: none; padding: 0; }
::selection { background: var(--plum); color: var(--ink); }

/* ---------- Layout helpers ---------- */
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap-wide { max-width: 1480px; }
.section { padding-block: clamp(72px, 10vw, 140px); }
.section-tight { padding-block: clamp(48px, 6vw, 84px); }
.paper { background: var(--paper); color: var(--on-paper); }
.rule { height: 1px; background: var(--ink-line); border: 0; }
.paper .rule { background: var(--paper-line); }

/* ---------- Typography ---------- */
.display {
  font-family: var(--serif);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.015em;
}
h1.display { font-size: clamp(2.9rem, 7.4vw, 6.1rem); }
h2.display { font-size: clamp(2.2rem, 4.8vw, 3.7rem); }
h3.display { font-size: clamp(1.5rem, 2.6vw, 2.05rem); }
.serif-i { font-style: italic; }
.hl { color: var(--plum); }
.hl-2 { color: var(--plum-2); }
.paper .hl { color: var(--plum-ink); }

.eyebrow {
  font-family: var(--mono);
  font-size: 0.705rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--plum);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.paper .eyebrow { color: var(--plum-ink); }
.eyebrow::before {
  content: "";
  width: 26px; height: 1px; background: currentColor; opacity: .7;
}
.eyebrow.no-line::before { display: none; }

.lede { font-size: clamp(1.05rem, 1.5vw, 1.28rem); line-height: 1.62; color: var(--on-ink-mut); font-weight: 300; }
.paper .lede { color: var(--on-paper-mut); }
.muted { color: var(--on-ink-mut); }
.paper .muted { color: var(--on-paper-mut); }
.mono-sm { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; }
.dim { color: var(--on-ink-dim); }
.paper .dim { color: var(--on-paper-dim); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 0.82rem; font-weight: 500; letter-spacing: 0.02em;
  padding: 13px 22px; border-radius: var(--r);
  border: 1px solid transparent; transition: all .28s var(--ease);
  white-space: nowrap;
}
.btn i { font-size: .78em; transition: transform .28s var(--ease); }
.btn:hover i { transform: translateX(3px); }
.btn-plum { background: var(--plum); color: #FFFFFF; }
.btn-plum:hover { background: var(--plum-2); }
.btn-ghost { border-color: var(--ink-line); color: var(--on-ink); }
.btn-ghost:hover { border-color: var(--plum); color: var(--plum); }
.paper .btn-ghost { border-color: var(--paper-line); color: var(--on-paper); }
.paper .btn-ghost:hover { border-color: var(--plum-ink); color: var(--plum-ink); }
.btn-ink { background: var(--ink); color: var(--paper); }
.btn-ink:hover { background: var(--ink-3); }
.btn-lg { padding: 16px 28px; font-size: 0.88rem; }

.link-arrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .82rem; font-weight: 500; letter-spacing: .02em;
  color: var(--plum); transition: gap .25s var(--ease);
}
.link-arrow:hover { gap: 13px; }
.paper .link-arrow { color: var(--plum-ink); }

/* ---------- Header ---------- */
.topbar {
  border-bottom: 1px solid var(--ink-line-2);
  font-family: var(--mono); font-size: .68rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--on-ink-dim);
  background: var(--ink);
}
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 40px; }
.topbar-l, .topbar-r { display: flex; align-items: center; gap: 22px; }
.topbar a:hover { color: var(--plum); }
.topbar .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--plum); box-shadow: 0 0 0 3px rgba(196,101,180,.18); }
@media (max-width: 860px) { .topbar-l span.hide-m { display: none; } }

.site-header {
  position: sticky; top: 0; z-index: 200;
  background: rgba(20, 11, 19, 0.82);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border-bottom: 1px solid var(--ink-line-2);
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.site-header.solid { background: rgba(20, 11, 19, 0.96); border-bottom-color: var(--ink-line); }
.site-header .bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 74px; }

.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: auto; height: 34px; flex: none; }
.brand-txt { display: flex; flex-direction: column; line-height: 1; }
.brand-txt b { font-size: 1.1rem; font-weight: 700; font-style: italic; letter-spacing: -.015em; }
.brand-txt .w-block { color: var(--plum); }
.brand-txt .w-runner { color: #9BA9D0; }
.brand-txt span { font-family: var(--mono); font-size: .53rem; letter-spacing: .22em; text-transform: uppercase; color: var(--on-ink-dim); margin-top: 5px; }

.nav { display: flex; align-items: center; gap: 4px; }
/* NOTE: .nav-item is intentionally NOT positioned — the mega panel anchors to
   .site-header (a positioned sticky ancestor) so it spans the full header width
   instead of collapsing to the width of the nav link. */
.nav-item { position: static; }
.nav-link {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 13px; font-size: .84rem; font-weight: 450;
  color: var(--on-ink-mut); border-radius: var(--r);
  transition: color .2s var(--ease);
}
.nav-link:hover, .nav-item.open .nav-link { color: var(--on-ink); }
.nav-link .caret { font-size: .58rem; opacity: .55; transition: transform .25s var(--ease); }
.nav-item.open .nav-link .caret { transform: rotate(180deg); }

.header-cta { display: flex; align-items: center; gap: 14px; }
.header-phone { font-family: var(--mono); font-size: .72rem; letter-spacing: .06em; color: var(--on-ink-mut); }
.header-phone:hover { color: var(--plum); }

/* Mega menu — anchored to .site-header, spans full width */
.mega {
  position: absolute; top: 100%; left: 0; right: 0;
  background: var(--ink-2); border-bottom: 1px solid var(--ink-line);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .26s var(--ease), transform .26s var(--ease), visibility .26s;
  max-height: calc(100vh - 116px); overflow-y: auto;
}
.nav-item.open .mega { opacity: 1; visibility: visible; transform: translateY(0); }
.mega-inner { padding-block: clamp(28px, 3.4vw, 46px); }
.mega-grid { display: grid; grid-template-columns: 1.05fr 2.4fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
.mega-intro h4 { font-family: var(--serif); font-size: 1.55rem; line-height: 1.12; margin-bottom: 12px; }
.mega-intro p { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; max-width: 34ch; }
.mega-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 34px; }
.mega-col-h { font-family: var(--mono); font-size: .64rem; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); padding-bottom: 12px; margin-bottom: 6px; border-bottom: 1px solid var(--ink-line-2); }
.mega-list { display: flex; flex-direction: column; }
.mega-a { display: flex; align-items: center; gap: 9px; padding: 7px 8px; margin-inline: -8px; border-radius: var(--r); font-size: .845rem; color: var(--on-ink-mut); transition: all .18s var(--ease); }
.mega-a:hover { background: var(--ink-3); color: var(--on-ink); }
.mega-a .tick { width: 4px; height: 4px; border-radius: 50%; background: var(--plum); opacity: .45; flex: none; transition: opacity .18s; }
.mega-a:hover .tick { opacity: 1; }
.mega-a small { color: var(--on-ink-dim); font-family: var(--mono); font-size: .6rem; letter-spacing: .1em; margin-left: auto; }

.mega-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mega-card { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 20px; transition: all .25s var(--ease); background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); }
.mega-card:hover { border-color: var(--plum); background: var(--ink-3); }
.mega-card h5 { font-size: .98rem; font-weight: 550; margin-bottom: 7px; }
.mega-card p { font-size: .8rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.5; }
.mega-card .tag { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); display: block; margin-bottom: 12px; }

.hamburger { display: none; width: 42px; height: 42px; border: 1px solid var(--ink-line); border-radius: var(--r); place-items: center; }
.hamburger span { display: block; width: 18px; height: 1.5px; background: var(--on-ink); position: relative; transition: all .3s var(--ease); }
.hamburger span::before, .hamburger span::after { content: ""; position: absolute; left: 0; width: 18px; height: 1.5px; background: var(--on-ink); transition: all .3s var(--ease); }
.hamburger span::before { top: -6px; } .hamburger span::after { top: 6px; }
body.menu-open .hamburger span { background: transparent; }
body.menu-open .hamburger span::before { top: 0; transform: rotate(45deg); }
body.menu-open .hamburger span::after { top: 0; transform: rotate(-45deg); }

/* Mobile drawer */
/* Mobile drawer — fixed to the viewport, revealed with a clip-path wipe.
   Deliberately NOT translated off-screen: an off-canvas element still counts
   toward document scrollWidth and creates horizontal scroll on mobile. */
.drawer {
  position: fixed; inset: 0; z-index: 190;
  background: var(--ink); overflow-y: auto; overscroll-behavior: contain;
  visibility: hidden; opacity: 0;
  clip-path: inset(0 0 100% 0);
  transition: clip-path .42s var(--ease), opacity .3s var(--ease), visibility .42s;
}
body.menu-open .drawer { visibility: visible; opacity: 1; clip-path: inset(0 0 0 0); }
.drawer-inner { padding: 128px var(--gutter) 90px; min-height: 100%; }
@media (min-width: 1024px) { .drawer { display: none; } }
.drawer-group { border-bottom: 1px solid var(--ink-line-2); }
.drawer-t { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 18px 0; font-family: var(--serif); font-size: 1.45rem; }
.drawer-t i { font-size: .7rem; color: var(--plum); transition: transform .3s var(--ease); }
.drawer-group.open .drawer-t i { transform: rotate(180deg); }
.drawer-panel { max-height: 0; overflow: hidden; transition: max-height .4s var(--ease); }
.drawer-group.open .drawer-panel { max-height: 1400px; }
.drawer-panel ul { padding-bottom: 16px; }
.drawer-panel a { display: block; padding: 9px 0 9px 4px; color: var(--on-ink-mut); font-size: .9rem; border-left: 1px solid var(--ink-line-2); padding-left: 16px; }
.drawer-panel a:hover { color: var(--plum); }
.drawer-cta { margin-top: 28px; display: grid; gap: 12px; }

@media (max-width: 1023px) {
  .nav, .header-phone { display: none; }
  .hamburger { display: grid; }
}
/* On narrow screens the header CTA would push the bar past the viewport.
   The drawer carries the same CTA, so drop it here. */
@media (max-width: 760px) {
  .header-cta .btn { display: none; }
}

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; padding-block: clamp(64px, 8vw, 120px) clamp(40px, 5vw, 72px); }
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(900px 480px at 78% -8%, rgba(196,101,180,.16), transparent 62%),
    radial-gradient(700px 500px at 4% 6%, rgba(120,150,220,.07), transparent 60%);
}
.hero-grid-bg {
  position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(var(--ink-line-2) 1px, transparent 1px), linear-gradient(90deg, var(--ink-line-2) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
  -webkit-mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
}
.hero .wrap { position: relative; }
.hero-top { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: clamp(28px, 4vw, 46px); }
.chip { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--ink-line); border-radius: 100px; padding: 7px 14px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-mut); }
.chip .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--plum); }

.hero-h1 { max-width: 15ch; }
.hero-h1 .ln { display: block; overflow: hidden; }
.hero-h1 .ln > span { display: block; transform: translateY(105%); animation: riseIn .95s var(--ease) forwards; }
.hero-h1 .ln:nth-child(2) > span { animation-delay: .09s; }
.hero-h1 .ln:nth-child(3) > span { animation-delay: .18s; }
@keyframes riseIn { to { transform: translateY(0); } }

.hero-body { display: grid; grid-template-columns: 1.25fr .85fr; gap: clamp(30px, 5vw, 72px); align-items: end; margin-top: clamp(30px, 4vw, 50px); }
.hero-lede { max-width: 52ch; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
@media (max-width: 900px) { .hero-body { grid-template-columns: 1fr; gap: 34px; } }

.hero-panel { border: 1px solid var(--ink-line); border-radius: var(--r-lg); background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)); padding: 24px; }
.hero-panel .k { font-family: var(--mono); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); }
.hero-panel .v { font-family: var(--serif); font-size: 2.6rem; line-height: 1; margin-top: 10px; }
.hero-panel .sub { font-size: .8rem; color: var(--on-ink-mut); margin-top: 8px; font-weight: 300; }
.hero-panel .row { display: flex; gap: 22px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--ink-line-2); }
.hero-panel .row > div { flex: 1; }
.hero-panel .row .v2 { font-family: var(--mono); font-size: 1.15rem; }

/* Jurisdiction ticker */
.ticker { border-block: 1px solid var(--ink-line-2); overflow: hidden; padding-block: 18px; margin-top: clamp(40px, 5vw, 68px); position: relative; }
.ticker::before, .ticker::after { content: ""; position: absolute; top: 0; bottom: 0; width: 90px; z-index: 2; pointer-events: none; }
.ticker::before { left: 0; background: linear-gradient(90deg, var(--ink), transparent); }
.ticker::after { right: 0; background: linear-gradient(270deg, var(--ink), transparent); }
.ticker-track { display: flex; gap: 46px; width: max-content; animation: slide 42s linear infinite; }
.ticker-track span { font-family: var(--mono); font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--on-ink-dim); white-space: nowrap; display: inline-flex; align-items: center; gap: 12px; }
.ticker-track span::after { content: "◆"; font-size: .5rem; color: var(--plum); opacity: .6; }
@keyframes slide { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ticker-track, .hero-h1 .ln > span { animation: none; transform: none; } }

/* ---------- Press strip ---------- */
.press { padding-block: clamp(34px, 4vw, 54px); border-bottom: 1px solid var(--paper-line-2); }
.press-h { font-family: var(--mono); font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--on-paper-dim); margin-bottom: 26px; }
.press-row { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.press-row span { font-family: var(--serif); font-size: clamp(1.05rem, 1.7vw, 1.45rem); color: var(--on-paper); opacity: .5; transition: opacity .25s var(--ease); }
.press-row span:hover { opacity: 1; }

/* ---------- Section head ---------- */
.sec-head { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: end; margin-bottom: clamp(38px, 5vw, 62px); }
.sec-head h2 { max-width: 16ch; }
.sec-head .right p { font-size: .96rem; font-weight: 300; max-width: 46ch; }
.sec-head .right { display: flex; justify-content: flex-end; }
@media (max-width: 820px) { .sec-head { grid-template-columns: 1fr; gap: 18px; } .sec-head .right { justify-content: flex-start; } }

/* ---------- Practice area grid ---------- */
.pa-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--paper-line); border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; }
.pa-card { background: var(--paper); padding: clamp(22px, 2.6vw, 34px); position: relative; transition: background .3s var(--ease); min-height: 220px; display: flex; flex-direction: column; }
.pa-card:hover { background: var(--paper-2); }
.pa-card .tag { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum-ink); }
.pa-card h3 { font-family: var(--serif); font-size: clamp(1.3rem, 1.9vw, 1.6rem); line-height: 1.1; margin: 16px 0 10px; }
.pa-card p { font-size: .845rem; color: var(--on-paper-mut); font-weight: 300; line-height: 1.55; flex: 1; }
.pa-card .go { margin-top: 20px; display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; font-family: var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--on-paper-dim); transition: all .25s var(--ease); }
.pa-card:hover .go { color: var(--plum-ink); gap: 12px; }
.pa-card .idx { position: absolute; top: 22px; right: 26px; font-family: var(--mono); font-size: .66rem; color: var(--on-paper-dim); }
@media (max-width: 900px) { .pa-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pa-grid { grid-template-columns: 1fr; } }

/* ---------- Licensing browser ---------- */
.lic-shell { border: 1px solid var(--ink-line); border-radius: var(--r-lg); overflow: hidden; background: var(--ink-2); }
.lic-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--ink-line); overflow-x: auto; }
.lic-tab { padding: 18px 22px; font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); border-bottom: 2px solid transparent; white-space: nowrap; transition: all .22s var(--ease); }
.lic-tab:hover { color: var(--on-ink-mut); }
.lic-tab.active { color: var(--plum); border-bottom-color: var(--plum); background: rgba(196,101,180,.05); }
.lic-panels { padding: clamp(24px, 3vw, 40px); }
.lic-panel { display: none; }
.lic-panel.active { display: block; animation: fadeUp .4s var(--ease); }
@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } }
.lic-links { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px 30px; }
@media (max-width: 1000px) { .lic-links { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .lic-links { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .lic-links { grid-template-columns: 1fr; } }
.lic-a { display: flex; align-items: center; gap: 10px; padding: 11px 10px; margin-inline: -10px; border-radius: var(--r); font-size: .875rem; color: var(--on-ink-mut); border-bottom: 1px solid var(--ink-line-2); transition: all .2s var(--ease); }
.lic-a:hover { color: var(--on-ink); background: var(--ink-3); }
.lic-a .tick { width: 5px; height: 5px; border-radius: 50%; background: var(--plum); flex: none; }
.lic-a.lead { color: var(--plum); font-weight: 500; }

/* ---------- About band ---------- */
.about { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(30px, 5vw, 80px); align-items: start; }
@media (max-width: 900px) { .about { grid-template-columns: 1fr; gap: 34px; } }
.portrait { position: sticky; top: 110px; }
.portrait-frame { position: relative; border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 4/5; background: linear-gradient(160deg, var(--paper-2), #E3DDCE); }
.portrait-frame picture { display: block; width: 100%; height: 100%; }
.portrait-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; }
/* subtle ink wash + plum hairline so the photo sits in the palette */
.portrait-frame::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(to top, rgba(20,11,19,.42) 0%, rgba(20,11,19,.06) 34%, transparent 62%); }
.portrait-frame::after { content: ""; position: absolute; inset: 10px; z-index: 3; pointer-events: none;
  border: 1px solid rgba(196,101,180,.34); border-radius: calc(var(--r-lg) - 2px); }
.portrait-plate { position: absolute; left: 26px; bottom: 24px; z-index: 4; }
.portrait-plate b { display: block; font-family: var(--serif); font-size: 1.22rem; color: #F4F1EA; letter-spacing: -.01em; }
.portrait-plate span { display: block; margin-top: 5px; font-family: var(--mono); font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum-2); }
.portrait-meta { display: flex; justify-content: space-between; padding-top: 16px; font-family: var(--mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--on-paper-dim); }

.about-body h2 { margin-bottom: 22px; }
.about-body .p { font-size: clamp(1rem, 1.3vw, 1.12rem); color: var(--on-paper-mut); font-weight: 300; line-height: 1.72; margin-bottom: 18px; }
.cover-list { margin-top: 30px; border-top: 1px solid var(--paper-line); }
.cover-list li { display: flex; align-items: center; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--paper-line-2); font-size: .95rem; }
.cover-list li .n { font-family: var(--mono); font-size: .66rem; color: var(--plum-ink); }
.cover-list li i { margin-left: auto; color: var(--on-paper-dim); font-size: .72rem; }

/* ---------- Specializations ---------- */
.spec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .spec-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .spec-grid { grid-template-columns: 1fr; } }
.spec-card { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 26px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease); display: flex; flex-direction: column; }
.spec-card:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.spec-card h3 { font-size: 1.06rem; font-weight: 550; line-height: 1.25; margin-bottom: 12px; }
.spec-card p { font-size: .845rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.55; flex: 1; }
.spec-card .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.spec-card:hover .go { color: var(--plum); gap: 12px; }

/* ---------- Stats band ---------- */
.stats-band { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--ink-line-2); border: 1px solid var(--ink-line); border-radius: var(--r-lg); overflow: hidden; }
.stat { background: var(--ink); padding: clamp(26px, 3vw, 40px); }
.stat .v { font-family: var(--serif); font-size: clamp(2.4rem, 4.6vw, 3.4rem); line-height: 1; }
.stat .l { font-size: .82rem; color: var(--on-ink-mut); margin-top: 12px; font-weight: 300; max-width: 20ch; }
@media (max-width: 760px) { .stats-band { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Insights ---------- */
.ins-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 18px; }
@media (max-width: 900px) { .ins-grid { grid-template-columns: 1fr; } }
.ins-card { border: 1px solid var(--paper-line); border-radius: var(--r-lg); padding: 28px; background: var(--paper); display: flex; flex-direction: column; min-height: 260px; transition: all .3s var(--ease); }
.ins-card:hover { background: var(--paper-2); }
.ins-card .k { font-family: var(--mono); font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum-ink); }
.ins-card h3 { font-family: var(--serif); font-size: clamp(1.25rem, 1.8vw, 1.7rem); line-height: 1.14; margin: 16px 0 12px; }
.ins-card p { font-size: .875rem; color: var(--on-paper-mut); font-weight: 300; flex: 1; }
.ins-card.big h3 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.ins-card .go { margin-top: 22px; }

/* ---------- FAQ ---------- */
.faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px, 5vw, 70px); align-items: start; }
@media (max-width: 860px) { .faq-grid { grid-template-columns: 1fr; gap: 30px; } }
.faq-item { border-bottom: 1px solid var(--ink-line); }
.faq-q { width: 100%; display: flex; align-items: center; gap: 20px; padding: 22px 0; text-align: left; font-family: var(--serif); font-size: clamp(1.15rem, 1.7vw, 1.4rem); line-height: 1.2; transition: color .2s var(--ease); }
.faq-q:hover { color: var(--plum); }
.faq-q .n { font-family: var(--mono); font-size: .64rem; color: var(--plum); flex: none; padding-top: 4px; }
.faq-q .pm { margin-left: auto; flex: none; width: 26px; height: 26px; border: 1px solid var(--ink-line); border-radius: 50%; display: grid; place-items: center; font-size: .8rem; transition: all .28s var(--ease); }
.faq-item.open .faq-q .pm { background: var(--plum); color: var(--ink); border-color: var(--plum); transform: rotate(45deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .4s var(--ease); }
.faq-item.open .faq-a { max-height: 320px; }
.faq-a p { padding: 0 0 24px 44px; font-size: .93rem; color: var(--on-ink-mut); font-weight: 300; max-width: 68ch; }

/* ---------- CTA ---------- */
.cta { position: relative; overflow: hidden; background: var(--ink-2); border-top: 1px solid var(--ink-line); }
.cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(700px 360px at 82% 20%, rgba(196,101,180,.16), transparent 60%); }
.cta .wrap { position: relative; display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(30px, 5vw, 70px); align-items: center; }
@media (max-width: 860px) { .cta .wrap { grid-template-columns: 1fr; gap: 30px; } }
.cta h2 { max-width: 14ch; }
.cta-actions { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; border-left: 1px solid var(--ink-line); padding-left: clamp(24px, 3vw, 44px); }
@media (max-width: 860px) { .cta-actions { border-left: 0; padding-left: 0; border-top: 1px solid var(--ink-line); padding-top: 26px; } }
.cta-actions .meta { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; color: var(--on-ink-dim); }

/* ---------- Footer ---------- */
.footer { background: var(--ink); border-top: 1px solid var(--ink-line); padding-top: clamp(52px, 6vw, 84px); }
.foot-top { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 34px; padding-bottom: clamp(40px, 5vw, 64px); }
@media (max-width: 1000px) { .foot-top { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 620px) { .foot-top { grid-template-columns: 1fr 1fr; } }
.foot-brand p { font-size: .87rem; color: var(--on-ink-mut); font-weight: 300; max-width: 34ch; margin-top: 18px; }
.foot-brand .contact { margin-top: 22px; display: grid; gap: 8px; }
.foot-brand .contact a { font-family: var(--mono); font-size: .78rem; letter-spacing: .04em; color: var(--on-ink-mut); }
.foot-brand .contact a:hover { color: var(--plum); }
.foot-col h5 { font-family: var(--mono); font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); margin-bottom: 18px; }
.foot-col ul { display: grid; gap: 11px; }
.foot-col a { font-size: .855rem; color: var(--on-ink-mut); transition: color .2s var(--ease); font-weight: 300; }
.foot-col a:hover { color: var(--on-ink); }
.foot-bottom { border-top: 1px solid var(--ink-line-2); padding-block: 26px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; align-items: center; font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; color: var(--on-ink-dim); text-transform: uppercase; }
.foot-bottom .socials { display: flex; gap: 20px; }
.foot-bottom a:hover { color: var(--plum); }
.disclaimer { padding-bottom: 34px; font-size: .72rem; color: var(--on-ink-dim); max-width: 96ch; line-height: 1.6; font-weight: 300; }

/* ==========================================================================
   Licensing detail template
   ========================================================================== */

/* ---- Hero ---- */
.lp-hero { position: relative; overflow: hidden; padding-block: clamp(30px, 4vw, 52px) clamp(56px, 7vw, 92px); }
.lp-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(880px 460px at 80% -10%, rgba(196,101,180,.15), transparent 62%),
    radial-gradient(700px 480px at 2% 8%, rgba(120,150,220,.06), transparent 60%);
}
.lp-hero .wrap { position: relative; }

.lp-crumb { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); margin-bottom: clamp(26px, 3.4vw, 44px); }
.lp-crumb a { color: var(--on-ink-mut); transition: color .2s var(--ease); }
.lp-crumb a:hover { color: var(--plum); }
.lp-crumb .sep { opacity: .45; }
.lp-crumb [aria-current] { color: var(--plum); }

.lp-hero-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: clamp(30px, 5vw, 72px); align-items: start; }
@media (max-width: 900px) { .lp-hero-grid { grid-template-columns: 1fr; gap: 34px; } }
.lp-h1 { font-size: clamp(2.3rem, 4.6vw, 3.9rem); max-width: 20ch; margin-top: 18px; }
.lp-lede { max-width: 60ch; margin-top: 22px; }

/* At-a-glance card */
.lp-card { border: 1px solid var(--ink-line); border-radius: var(--r-lg); background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0)); padding: 24px; }
.lp-card-h { font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); padding-bottom: 14px; border-bottom: 1px solid var(--ink-line-2); }
.lp-facts { margin-top: 4px; }
.lp-facts > div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); }
.lp-facts > div:last-child { border-bottom: 0; }
.lp-facts dt { font-family: var(--mono); font-size: .63rem; letter-spacing: .12em; text-transform: uppercase; color: var(--on-ink-dim); }
.lp-facts dd { font-size: .86rem; font-weight: 450; text-align: right; color: var(--on-ink); }
.lp-card-foot { display: flex; align-items: center; gap: 9px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--ink-line-2); font-size: .78rem; color: var(--on-ink-mut); font-weight: 300; }
.lp-card-foot .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--plum); flex: none; }

/* ---- Body layout ---- */
.lp-body { border-top: 1px solid var(--ink-line-2); }
.lp-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(34px, 5vw, 84px); align-items: start; }
@media (max-width: 980px) { .lp-wrap { grid-template-columns: 1fr; gap: 44px; } }

.lp-block { padding-block: clamp(30px, 3.6vw, 48px); border-bottom: 1px solid var(--ink-line-2); }
.lp-block:first-child { padding-top: 0; }
.lp-block:last-child { border-bottom: 0; }
.lp-block-h { display: flex; align-items: center; gap: 14px; font-family: var(--mono); font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--plum); margin-bottom: 22px; }
.lp-block-h .n { color: var(--on-ink-dim); }
.lp-block-h::after { content: ""; flex: 1; height: 1px; background: var(--ink-line-2); }

.lp-p { font-size: clamp(1rem, 1.3vw, 1.1rem); color: var(--on-ink-mut); font-weight: 300; line-height: 1.78; margin-bottom: 18px; max-width: 74ch; }
.lp-p:last-child { margin-bottom: 0; }
.lp-note { font-size: .82rem; color: var(--on-ink-dim); font-weight: 300; margin-bottom: 20px; max-width: 62ch; }

/* Highlights */
.lp-hl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 820px) { .lp-hl-grid { grid-template-columns: 1fr; } }
.lp-hl { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 22px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); }
.lp-hl h3 { font-family: var(--serif); font-size: 1.22rem; line-height: 1.16; margin-bottom: 10px; }
.lp-hl p { font-size: .85rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; }

/* Requirements */
.lp-req { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px 30px; }
@media (max-width: 700px) { .lp-req { grid-template-columns: 1fr; } }
.lp-req li { display: flex; gap: 14px; align-items: flex-start; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); font-size: .9rem; color: var(--on-ink-mut); font-weight: 300; }
.lp-req .chk { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--plum); color: var(--plum); display: grid; place-items: center; font-size: .55rem; margin-top: 1px; }

/* Process steps */
.lp-steps { counter-reset: none; }
.lp-steps li { display: grid; grid-template-columns: 56px 1fr; gap: 22px; padding: 24px 0; border-bottom: 1px solid var(--ink-line-2); }
.lp-steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.lp-step-n { font-family: var(--serif); font-size: 1.7rem; color: var(--plum); line-height: 1; }
.lp-steps h3 { font-family: var(--serif); font-size: 1.32rem; line-height: 1.14; margin-bottom: 9px; }
.lp-steps p { font-size: .9rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.65; max-width: 72ch; }

/* Related */
.lp-related { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 30px; }
@media (max-width: 700px) { .lp-related { grid-template-columns: 1fr; } }
.lp-related a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); font-size: .88rem; color: var(--on-ink-mut); transition: color .2s var(--ease); }
.lp-related a:hover { color: var(--plum); }
.lp-related a i { font-size: .7rem; opacity: .5; transition: transform .25s var(--ease), opacity .25s var(--ease); }
.lp-related a:hover i { opacity: 1; transform: translateX(3px); }

/* Signals — "when this is the right engagement" */
.lp-signals li { position: relative; padding: 14px 0 14px 32px; border-bottom: 1px solid var(--ink-line-2); font-size: .92rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; }
.lp-signals li:last-child { border-bottom: 0; }
.lp-signals .sig { position: absolute; left: 0; top: 22px; width: 18px; height: 1px; background: var(--plum); }
.lp-signals .sig::after { content: ""; position: absolute; right: 0; top: -2px; width: 5px; height: 5px; border-radius: 50%; background: var(--plum); }

/* Engagement shapes */
.lp-shapes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 820px) { .lp-shapes { grid-template-columns: 1fr; } }
.lp-shape { display: flex; flex-direction: column; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 22px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); }
.lp-shape-meta { font-family: var(--mono); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); margin-bottom: 14px; }
.lp-shape h3 { font-family: var(--serif); font-size: 1.18rem; line-height: 1.16; margin-bottom: 10px; }
.lp-shape p { font-size: .85rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; }

/* Honest exclusions */
.lp-notfor li { position: relative; padding: 13px 0 13px 30px; border-bottom: 1px solid var(--ink-line-2); font-size: .9rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; max-width: 78ch; }
.lp-notfor li:last-child { border-bottom: 0; }
.lp-notfor .x { position: absolute; left: 0; top: 20px; width: 16px; height: 1px; background: var(--on-ink-dim); }
.lp-notfor .x::after { content: ""; position: absolute; inset: -1px 0; height: 1px; background: var(--on-ink-dim); transform: rotate(0deg); }
.lp-notfor .x::before { content: ""; position: absolute; left: 7px; top: -7px; width: 1px; height: 15px; background: var(--on-ink-dim); }

/* Licensing cross-links */
.lp-regimes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 30px; }
@media (max-width: 700px) { .lp-regimes { grid-template-columns: 1fr; } }
.lp-regimes a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); font-size: .88rem; color: var(--on-ink-mut); transition: color .2s var(--ease); }
.lp-regimes a:hover { color: var(--plum); }
.lp-regimes a i { font-size: .7rem; opacity: .5; transition: transform .25s var(--ease), opacity .25s var(--ease); }
.lp-regimes a:hover i { opacity: 1; transform: translateX(3px); }

.lp-faq .faq-item { border-color: var(--ink-line); }
.lp-faq .faq-a p { max-width: 78ch; }

/* ---- Sticky aside ---- */
.lp-side { position: sticky; top: 106px; display: grid; gap: 16px; }
@media (max-width: 980px) { .lp-side { position: static; } }
.lp-side-card { border: 1px solid var(--ink-line); border-radius: var(--r-lg); padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.02), transparent); }
.lp-side-h { font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--plum); margin-bottom: 14px; }
.lp-side-card p { font-size: .85rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; margin-bottom: 18px; }
.lp-side-card .btn { width: 100%; justify-content: center; margin-bottom: 10px; }
.lp-side-card .link-arrow { margin-top: 14px; font-size: .78rem; }
.lp-side-p { margin-bottom: 16px !important; }
.lp-side-list { display: grid; gap: 2px; }
.lp-side-list a { display: flex; align-items: center; gap: 9px; padding: 9px 0; border-bottom: 1px solid var(--ink-line-2); font-size: .82rem; color: var(--on-ink-mut); transition: color .2s var(--ease); }
.lp-side-list a:hover { color: var(--plum); }
.lp-side-list .tick { width: 4px; height: 4px; border-radius: 50%; background: var(--plum); opacity: .5; flex: none; }

/* ==========================================================================
   Video library (homepage)
   ========================================================================== */
.vid-shell { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(20px, 2.6vw, 36px); align-items: start; }
@media (max-width: 900px) { .vid-shell { grid-template-columns: 1fr; gap: 24px; } }

.vid-feature { display: block; width: 100%; text-align: left; border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); transition: background .3s var(--ease); }
.vid-feature:hover { background: var(--paper-2); }
.vid-thumb { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; background: #0C0710; }
.vid-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease); }
.vid-feature:hover .vid-thumb img { transform: scale(1.035); }
.vid-thumb::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(20,11,19,.04), rgba(20,11,19,.4)); }

.vid-play { position: absolute; inset: 0; margin: auto; z-index: 2; width: 58px; height: 58px; border-radius: 50%;
  background: var(--plum); color: #fff; display: grid; place-items: center; font-size: 1.05rem;
  box-shadow: 0 12px 34px rgba(0,0,0,.5); transition: transform .3s var(--ease), background .3s var(--ease); }
.vid-play::before { content: ""; position: absolute; inset: -7px; border-radius: 50%;
  border: 1px solid rgba(244,241,234,.45); opacity: 0; transition: all .3s var(--ease); }
.vid-play i { padding-left: 3px; }
.vid-feature:hover .vid-play, .vid-row:hover .vid-play { background: var(--plum-2); transform: scale(1.08); }
.vid-feature:hover .vid-play::before, .vid-row:hover .vid-play::before { opacity: 1; inset: -11px; }
.vid-play.sm { width: 36px; height: 36px; font-size: .68rem; box-shadow: 0 6px 18px rgba(0,0,0,.5); }

.vid-badge { position: absolute; top: 14px; left: 14px; z-index: 2; font-family: var(--mono); font-size: .56rem;
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink); background: var(--plum-2);
  padding: 5px 10px; border-radius: 100px; }

.vid-feature-meta { display: block; padding: clamp(18px, 2vw, 24px); }
.vid-topic { display: block; font-family: var(--mono); font-size: .58rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--plum-ink); margin-bottom: 9px; }
.vid-feature-title { display: block; font-family: var(--serif); font-size: clamp(1.3rem, 1.9vw, 1.7rem);
  line-height: 1.12; margin-bottom: 10px; }
.vid-blurb { display: block; font-size: .85rem; color: var(--on-paper-mut); font-weight: 300; line-height: 1.6; }

.vid-side { border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); }
.vid-side-h { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 18px;
  border-bottom: 1px solid var(--paper-line); font-family: var(--mono); font-size: .59rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--on-paper-dim); }
.vid-side-h .link-arrow { font-family: var(--mono); font-size: .59rem; letter-spacing: .14em; text-transform: uppercase; }
.vid-row { display: grid; grid-template-columns: 130px 1fr; gap: 14px; align-items: center; width: 100%;
  text-align: left; padding: 12px 18px; border-bottom: 1px solid var(--paper-line-2); transition: background .25s var(--ease); }
.vid-row:last-child { border-bottom: 0; }
.vid-row:hover { background: var(--paper-2); }
.vid-row .vid-thumb { border-radius: var(--r); }
.vid-row .vid-thumb::after { background: linear-gradient(180deg, rgba(20,11,19,.02), rgba(20,11,19,.3)); }
.vid-row-meta { min-width: 0; }
.vid-row-meta .vid-topic { margin-bottom: 6px; font-size: .54rem; }
.vid-row-title { display: block; font-size: .885rem; font-weight: 500; line-height: 1.32; }
@media (max-width: 420px) { .vid-row { grid-template-columns: 100px 1fr; gap: 12px; padding-inline: 14px; } }

.vid-foot { display: flex; gap: 12px; flex-wrap: wrap; margin-top: clamp(28px, 3.4vw, 44px); }

/* Clicked facade → real player */
.vid-embed { position: relative; aspect-ratio: 16/9; background: #000; }
.vid-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ==========================================================================
   Licensing category hub
   ========================================================================== */
.hub-intro-grid { display: grid; grid-template-columns: 1.35fr .85fr; gap: clamp(30px, 4.5vw, 76px); align-items: start; }
@media (max-width: 900px) { .hub-intro-grid { grid-template-columns: 1fr; gap: 34px; } }
.hub-hl { border-left: 1px solid var(--ink-line); padding-left: clamp(20px, 2.6vw, 34px); }
@media (max-width: 900px) { .hub-hl { border-left: 0; padding-left: 0; border-top: 1px solid var(--ink-line); padding-top: 28px; } }
.hub-hl .lp-block-h { margin-bottom: 16px; }
.hub-hl-item { padding: 15px 0; border-bottom: 1px solid var(--ink-line-2); }
.hub-hl-item:last-child { border-bottom: 0; padding-bottom: 0; }
.hub-hl-item h4 { font-family: var(--serif); font-size: 1.14rem; line-height: 1.16; margin-bottom: 8px; }
.hub-hl-item p { font-size: .84rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; }

.hub-groups { border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); }
.hub-group { padding: clamp(22px, 2.6vw, 34px); border-bottom: 1px solid var(--paper-line); }
.hub-group:last-child { border-bottom: 0; }
.hub-group-head { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: start; margin-bottom: 18px; }
.hub-group-n { font-family: var(--mono); font-size: .66rem; color: var(--plum-ink); padding-top: 6px; }
.hub-group-head h3 { font-family: var(--serif); font-size: clamp(1.3rem, 1.9vw, 1.58rem); line-height: 1.1; margin-bottom: 7px; }
.hub-group-head p { font-size: .84rem; color: var(--on-paper-mut); font-weight: 300; max-width: 64ch; }
.hub-group-count { font-family: var(--mono); font-size: .57rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--on-paper-dim); white-space: nowrap; padding-top: 7px; }
@media (max-width: 620px) {
  .hub-group-head { grid-template-columns: auto 1fr; }
  .hub-group-count { grid-column: 2; padding-top: 0; }
}
.hub-group-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px 24px; }
@media (max-width: 900px) { .hub-group-links { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hub-group-links { grid-template-columns: 1fr; } }
.hub-group-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0;
  border-bottom: 1px solid var(--paper-line-2); font-size: .875rem; color: var(--on-paper-mut); transition: color .2s var(--ease); }
.hub-group-links a:hover { color: var(--plum-ink); }
.hub-group-links a i { font-size: .62rem; opacity: .45; transition: transform .25s var(--ease), opacity .25s var(--ease); }
.hub-group-links a:hover i { opacity: 1; transform: translateX(3px); }

.hub-steps li { padding-block: 22px; }

.hub-others { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .hub-others { grid-template-columns: 1fr; } }
.hub-other { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 26px;
  background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease);
  display: flex; flex-direction: column; }
.hub-other:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.hub-other-h { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--plum); margin-bottom: 14px; }
.hub-other h3 { font-size: 1.04rem; font-weight: 550; line-height: 1.25; margin-bottom: 12px; }
.hub-other p { font-size: .84rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.55; flex: 1; }
.hub-other .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center;
  transition: all .25s var(--ease); }
.hub-other:hover .go { color: var(--plum); gap: 12px; }

/* ==========================================================================
   Video section (homepage) — click-to-load YouTube facade
   ========================================================================== */
.vid-shell { display: grid; grid-template-columns: 1.32fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 900px) { .vid-shell { grid-template-columns: 1fr; gap: 22px; } }

.vid-feature { display: flex; flex-direction: column; text-align: left; border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); transition: border-color .3s var(--ease); }
.vid-feature:hover { border-color: var(--plum-ink); }

.vid-thumb { position: relative; display: block; overflow: hidden; background: var(--ink); aspect-ratio: 16/9; }
.vid-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease), opacity .3s var(--ease); }
.vid-feature:hover .vid-thumb img { transform: scale(1.045); }
.vid-play { position: absolute; inset: 0; display: grid; place-items: center; z-index: 2; }
.vid-play i {
  display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
  background: var(--plum); color: #fff; font-size: .82rem; padding-left: 4px;
  box-shadow: 0 12px 34px -10px rgba(0,0,0,.75);
  transition: transform .3s var(--ease), background .3s var(--ease);
}
.vid-feature:hover .vid-play i { transform: scale(1.09); background: var(--plum-2); }
.vid-play.sm i { width: 38px; height: 38px; font-size: .6rem; padding-left: 3px; }
.vid-badge {
  position: absolute; top: 12px; left: 12px; z-index: 3;
  background: rgba(20,11,19,.82); color: var(--on-ink);
  font-family: var(--mono); font-size: .56rem; letter-spacing: .16em; text-transform: uppercase;
  padding: 6px 11px; border-radius: 100px; backdrop-filter: blur(6px);
}
.vid-feature-meta { display: flex; flex-direction: column; gap: 9px; padding: clamp(18px, 2.2vw, 24px); }
.vid-topic { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum-ink); }
.vid-feature-title { font-family: var(--serif); font-size: clamp(1.3rem, 1.9vw, 1.72rem); line-height: 1.14; color: var(--on-paper); letter-spacing: -.01em; }
.vid-blurb { font-size: .875rem; color: var(--on-paper-mut); font-weight: 300; line-height: 1.62; }

.vid-side { display: flex; flex-direction: column; }
.vid-side-h { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 13px; border-bottom: 1px solid var(--paper-line); }
.vid-side-h > span { font-family: var(--mono); font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-paper-dim); }
.vid-side-h .link-arrow { font-size: .74rem; }
.vid-rows { display: flex; flex-direction: column; }
.vid-row { display: grid; grid-template-columns: 128px 1fr; gap: 14px; align-items: center; text-align: left; padding: 12px 10px; margin-inline: -10px; border-radius: var(--r); border-bottom: 1px solid var(--paper-line-2); transition: background .2s var(--ease); }
.vid-row:hover { background: var(--paper-2); }
.vid-row .vid-thumb { border-radius: var(--r); }
.vid-row-meta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vid-row-title { font-size: .86rem; font-weight: 500; line-height: 1.3; color: var(--on-paper); }
.vid-foot { display: flex; gap: 12px; flex-wrap: wrap; margin-top: clamp(24px, 3vw, 34px); }

/* Modal */
.vid-modal {
  position: fixed; inset: 0; z-index: 300; display: grid; place-items: center;
  padding: var(--gutter); background: rgba(10,5,9,.88);
  -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
  opacity: 0; visibility: hidden; transition: opacity .3s var(--ease), visibility .3s;
}
.vid-modal.open { opacity: 1; visibility: visible; }
.vid-modal-inner { position: relative; width: min(1100px, 100%); }
.vid-modal-frame { position: relative; aspect-ratio: 16/9; background: #000; border-radius: var(--r-lg); overflow: hidden; box-shadow: 0 44px 100px -34px rgba(0,0,0,.85); }
.vid-modal-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vid-modal-close { position: absolute; top: -48px; right: 0; width: 40px; height: 40px; border: 1px solid var(--ink-line); border-radius: 50%; color: var(--on-ink); display: grid; place-items: center; transition: all .25s var(--ease); }
.vid-modal-close:hover { background: var(--plum); border-color: var(--plum); color: #fff; }
.vid-modal-title { margin-top: 14px; font-family: var(--mono); font-size: .74rem; letter-spacing: .05em; color: var(--on-ink-mut); }

/* ==========================================================================
   Licensing category hub
   ========================================================================== */
.hub-intro-grid { display: grid; grid-template-columns: 1.42fr .82fr; gap: clamp(34px, 5vw, 84px); align-items: start; }
@media (max-width: 900px) { .hub-intro-grid { grid-template-columns: 1fr; gap: 36px; } }
.hub-intro .lp-block-h { margin-bottom: 20px; }
.hub-hl { border-left: 1px solid var(--ink-line); padding-left: clamp(22px, 3vw, 40px); }
@media (max-width: 900px) { .hub-hl { border-left: 0; padding-left: 0; border-top: 1px solid var(--ink-line-2); padding-top: 28px; } }
.hub-hl-item { padding-block: 18px; border-bottom: 1px solid var(--ink-line-2); }
.hub-hl-item:first-of-type { padding-top: 0; }
.hub-hl-item:last-child { border-bottom: 0; padding-bottom: 0; }
.hub-hl-item h4 { font-family: var(--serif); font-size: 1.18rem; line-height: 1.2; margin-bottom: 8px; }
.hub-hl-item p { font-size: .875rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.62; }

.hub-groups { display: flex; flex-direction: column; gap: 16px; }
.hub-group { border: 1px solid var(--paper-line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); }
.hub-group-head { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: baseline; padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.6vw, 32px); background: var(--paper-2); border-bottom: 1px solid var(--paper-line); }
.hub-group-n { font-family: var(--mono); font-size: .68rem; color: var(--plum-ink); }
.hub-group-head h3 { font-family: var(--serif); font-size: clamp(1.24rem, 1.9vw, 1.58rem); line-height: 1.1; margin-bottom: 7px; }
.hub-group-head p { font-size: .845rem; color: var(--on-paper-mut); font-weight: 300; max-width: 64ch; line-height: 1.55; }
.hub-group-count { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-paper-dim); white-space: nowrap; }
@media (max-width: 720px) { .hub-group-head { grid-template-columns: auto 1fr; } .hub-group-count { grid-column: 2; } }

.hub-group-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--paper-line-2); }
@media (max-width: 900px) { .hub-group-links { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hub-group-links { grid-template-columns: 1fr; } }
.hub-group-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px clamp(20px, 2.6vw, 32px); background: var(--paper); font-size: .865rem; color: var(--on-paper-mut); transition: background .2s var(--ease), color .2s var(--ease); }
.hub-group-links a:hover { background: var(--paper-2); color: var(--plum-ink); }
.hub-group-links a i { font-size: .66rem; opacity: .3; flex: none; transition: transform .22s var(--ease), opacity .22s var(--ease); }
.hub-group-links a:hover i { opacity: 1; transform: translateX(3px); }

.hub-steps li { padding-block: 22px; }

.hub-others { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .hub-others { grid-template-columns: 1fr; } }
.hub-other { display: flex; flex-direction: column; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 26px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease); }
.hub-other:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.hub-other-h { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); margin-bottom: 12px; }
.hub-other h3 { font-family: var(--serif); font-size: 1.3rem; line-height: 1.12; margin-bottom: 10px; }
.hub-other p { font-size: .845rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.56; flex: 1; }
.hub-other .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.hub-other:hover .go { color: var(--plum); gap: 12px; }

/* ==========================================================================
   Bio page (/bio)
   ========================================================================== */
.bio-hero-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(30px, 5vw, 76px); align-items: start; }
@media (max-width: 900px) { .bio-hero-grid { grid-template-columns: 1fr; gap: 38px; } }

.bio-photo { position: relative; margin: 0; }
.bio-photo picture { display: block; }
.bio-photo img {
  display: block; width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 20%;
  border: 1px solid var(--ink-line); border-radius: var(--r-lg);
  box-shadow: 0 34px 80px -40px rgba(0,0,0,.85);
}
.bio-photo::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: var(--r-lg);
  background: linear-gradient(180deg, transparent 52%, rgba(20,11,19,.62) 100%);
}
.bio-photo-plate { position: absolute; left: 24px; bottom: 22px; z-index: 2; }
.bio-photo-plate b { display: block; font-family: var(--serif); font-size: 1.22rem; color: #F4F1EA; letter-spacing: -.01em; }
.bio-photo-plate span { display: block; margin-top: 5px; font-family: var(--mono); font-size: .58rem; letter-spacing: .15em; text-transform: uppercase; color: var(--plum-2); }

/* Facts strip */
.bio-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--ink-line-2); border: 1px solid var(--ink-line); border-radius: var(--r-lg); overflow: hidden; }
@media (max-width: 900px) { .bio-facts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bio-facts { grid-template-columns: 1fr; } }
.bio-fact { background: var(--ink); padding: clamp(20px, 2.4vw, 30px); }
.bio-fact .k { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); margin-bottom: 12px; }
.bio-fact .v { font-size: .95rem; font-weight: 450; line-height: 1.42; color: var(--on-ink); }

/* Story + covers */
.bio-story-grid { display: grid; grid-template-columns: 1.4fr .8fr; gap: clamp(32px, 5vw, 84px); align-items: start; }
@media (max-width: 900px) { .bio-story-grid { grid-template-columns: 1fr; gap: 40px; } }
.bio-story .lp-block-h { margin-bottom: 24px; }
.bio-story > .lp-p:first-of-type { font-size: clamp(1.1rem, 1.6vw, 1.32rem); color: var(--on-paper); line-height: 1.66; }

.bio-covers { border-left: 1px solid var(--paper-line); padding-left: clamp(22px, 3vw, 40px); }
@media (max-width: 900px) { .bio-covers { border-left: 0; padding-left: 0; border-top: 1px solid var(--paper-line); padding-top: 30px; } }
.bio-covers .lp-block-h { color: var(--plum-ink); }
.bio-cover-list { display: grid; }
.bio-cover-list li { display: flex; gap: 13px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--paper-line-2); font-size: .9rem; color: var(--on-paper-mut); font-weight: 300; }
.bio-cover-list .chk { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--plum-ink); color: var(--plum-ink); display: grid; place-items: center; font-size: .55rem; margin-top: 1px; }
.bio-covers-cta { margin-top: 22px; }

/* Timeline */
.bio-tl { border-top: 1px solid var(--ink-line-2); }
.bio-tl-item { display: grid; grid-template-columns: 190px 1fr; gap: clamp(20px, 3vw, 48px); padding-block: clamp(24px, 3vw, 38px); border-bottom: 1px solid var(--ink-line-2); }
@media (max-width: 780px) { .bio-tl-item { grid-template-columns: 1fr; gap: 12px; } }
.bio-tl-when { font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--plum); padding-top: 6px; }
.bio-tl-body { position: relative; padding-left: clamp(18px, 2.4vw, 32px); border-left: 1px solid var(--ink-line-2); }
@media (max-width: 780px) { .bio-tl-body { border-left: 0; padding-left: 0; } }
.bio-tl-n { font-family: var(--serif); font-size: 1.3rem; color: var(--on-ink-dim); display: block; margin-bottom: 6px; }
.bio-tl-body h3 { font-family: var(--serif); font-size: clamp(1.28rem, 2vw, 1.62rem); line-height: 1.14; margin-bottom: 10px; }
.bio-tl-body p { font-size: .92rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.66; max-width: 68ch; }

/* Focus cards */
.bio-focus { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .bio-focus { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bio-focus { grid-template-columns: 1fr; } }
.bio-focus-card { display: flex; flex-direction: column; border: 1px solid var(--paper-line); border-radius: var(--r-lg); padding: 26px; background: var(--paper); transition: background .3s var(--ease), border-color .3s var(--ease); }
.bio-focus-card:hover { background: var(--paper-2); border-color: var(--plum-ink); }
.bio-focus-card .tag { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum-ink); }
.bio-focus-card h3 { font-family: var(--serif); font-size: clamp(1.24rem, 1.8vw, 1.5rem); line-height: 1.12; margin: 14px 0 10px; }
.bio-focus-card p { font-size: .855rem; color: var(--on-paper-mut); font-weight: 300; line-height: 1.55; flex: 1; }
.bio-focus-card .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-paper-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.bio-focus-card:hover .go { color: var(--plum-ink); gap: 12px; }

/* ==========================================================================
   Schedule page (/schedule)
   ========================================================================== */
.sc-h1 { font-size: clamp(2.4rem, 5.4vw, 4.2rem); max-width: 18ch; margin-top: clamp(18px, 2.4vw, 30px); }
.sc-lede { max-width: 58ch; margin-top: 22px; }

.sc-body { border-top: 1px solid var(--ink-line-2); }
.sc-grid { display: grid; grid-template-columns: 1.28fr .72fr; gap: clamp(34px, 5vw, 80px); align-items: start; }
@media (max-width: 980px) { .sc-grid { grid-template-columns: 1fr; gap: 46px; } }

/* ---- Form ---- */
.sc-form-wrap { border: 1px solid var(--ink-line); border-radius: var(--r-lg); background: linear-gradient(180deg, rgba(255,255,255,.02), transparent); padding: clamp(24px, 3vw, 42px); }
.sc-form-h { margin-bottom: 26px; }
.sc-form-note { font-size: .82rem; color: var(--on-ink-dim); font-weight: 300; }
.sc-form-note .req { color: var(--plum); }

.sc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 640px) { .sc-row { grid-template-columns: 1fr; gap: 18px; } }

.sc-field { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
.sc-field label { font-family: var(--mono); font-size: .61rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-mut); }
.sc-field label .req { color: var(--plum); }
.sc-field input, .sc-field select, .sc-field textarea {
  width: 100%; font-family: var(--sans); font-size: .92rem; color: var(--on-ink);
  background: var(--ink-2); border: 1px solid var(--ink-line); border-radius: var(--r);
  padding: 13px 15px; transition: border-color .2s var(--ease), background .2s var(--ease);
}
.sc-field textarea { resize: vertical; min-height: 132px; line-height: 1.6; }
.sc-field input::placeholder, .sc-field textarea::placeholder { color: var(--on-ink-dim); }
.sc-field input:hover, .sc-field select:hover, .sc-field textarea:hover { border-color: #3A2A38; }
.sc-field input:focus, .sc-field select:focus, .sc-field textarea:focus { outline: none; border-color: var(--plum); background: var(--ink-3); box-shadow: 0 0 0 3px rgba(196,101,180,.14); }
.sc-field select { appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23D98FCC' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.sc-field select option { background: var(--ink-2); color: var(--on-ink); }
.sc-field.invalid input, .sc-field.invalid select, .sc-field.invalid textarea { border-color: #E0629B; box-shadow: 0 0 0 3px rgba(224,98,155,.14); }

/* Honeypot — visually and programmatically hidden */
.sc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sc-submit { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 6px; }
.sc-submit-note { font-size: .78rem; color: var(--on-ink-dim); font-weight: 300; }

.sc-status { margin-top: 20px; padding: 15px 18px; border-radius: var(--r); font-size: .88rem; font-weight: 400;
  border: 1px solid var(--ink-line); color: var(--on-ink-mut); }
.sc-status.ok { border-color: rgba(196,101,180,.5); background: rgba(196,101,180,.09); color: var(--on-ink); }
.sc-status.err { border-color: rgba(224,98,155,.5); background: rgba(224,98,155,.08); color: var(--on-ink); }
.sc-status[hidden] { display: none; }
.sc-form.sending .btn { opacity: .6; pointer-events: none; }

/* ---- Side rail ---- */
.sc-side { position: sticky; top: 106px; display: grid; gap: 16px; }
@media (max-width: 980px) { .sc-side { position: static; } }
.sc-side-card { border: 1px solid var(--ink-line); border-radius: var(--r-lg); padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.02), transparent); }
.sc-side-dark { background: var(--ink-3); }
.sc-side-card.soft { background: none; }
.sc-side-card .lp-block-h { margin-bottom: 18px; }
.sc-side-p { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.62; }
.sc-side-p a { color: var(--plum); }
.sc-side-p a:hover { color: var(--plum-2); }

.sc-channels { display: grid; gap: 4px; }
.sc-channel { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--ink-line-2); transition: color .2s var(--ease); }
.sc-channel:last-child { border-bottom: 0; padding-bottom: 0; }
.sc-channel .ic { flex: none; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--ink-line); color: var(--plum); display: grid; place-items: center; font-size: .78rem; }
.sc-channel:hover .ic { border-color: var(--plum); background: var(--plum); color: #fff; }
.sc-channel .tx { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sc-channel .k { font-family: var(--mono); font-size: .56rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-ink-dim); }
.sc-channel .v { font-size: .88rem; color: var(--on-ink); word-break: break-word; }
.sc-channel:hover .v { color: var(--plum); }
.sc-channel .n { font-size: .76rem; color: var(--on-ink-dim); font-weight: 300; }

.sc-steps { display: grid; }
.sc-steps li { display: grid; grid-template-columns: 26px 1fr; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); }
.sc-steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.sc-steps .n { font-family: var(--mono); font-size: .62rem; color: var(--plum); padding-top: 3px; }
.sc-steps h4 { font-size: .92rem; font-weight: 550; margin-bottom: 5px; }
.sc-steps p { font-size: .82rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.55; }

.sc-prep { display: grid; gap: 2px; }
.sc-prep li { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--ink-line-2); font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; }
.sc-prep .chk { flex: none; width: 19px; height: 19px; border-radius: 50%; border: 1px solid var(--plum); color: var(--plum); display: grid; place-items: center; font-size: .52rem; margin-top: 1px; }
.sc-prep-note { margin-top: 16px; font-size: .78rem; color: var(--on-ink-dim); font-weight: 300; line-height: 1.55; }

.sc-socials { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; }
.sc-socials a { font-family: var(--mono); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--on-ink-mut); }
.sc-socials a:hover { color: var(--plum); }

/* In-page anchor targets clear the sticky header */
section[id], div[id^="group-"] { scroll-margin-top: 104px; }

/* ==========================================================================
   Capability hub (/expertise) + capability detail pages
   ========================================================================== */
.ex-hero { display: grid; grid-template-columns: 1.42fr .58fr; gap: clamp(30px, 5vw, 72px); align-items: start; }
@media (max-width: 980px) { .ex-hero { grid-template-columns: 1fr; gap: 38px; } }

.ex-jump-list { display: grid; }
.ex-jump-list a { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--ink-line-2); transition: color .2s var(--ease); }
.ex-jump-list a:last-child { border-bottom: 0; padding-bottom: 0; }
.ex-jump-list .n { font-family: var(--mono); font-size: .62rem; color: var(--on-ink-dim); transition: color .2s var(--ease); }
.ex-jump-list .t { font-size: .88rem; color: var(--on-ink-mut); transition: color .2s var(--ease); }
.ex-jump-list .c { font-family: var(--mono); font-size: .6rem; color: var(--plum); }
.ex-jump-list a:hover .t { color: var(--plum); }
.ex-jump-list a:hover .n { color: var(--plum-2); }

.ex-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .ex-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ex-grid { grid-template-columns: 1fr; } }

.ex-card { display: flex; flex-direction: column; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 26px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease); }
.ex-card:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.ex-card .idx { font-family: var(--mono); font-size: .6rem; letter-spacing: .16em; color: var(--on-ink-dim); }
.ex-card .tag { margin-top: 12px; font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); }
.ex-card h3 { font-family: var(--serif); font-size: clamp(1.28rem, 1.9vw, 1.55rem); line-height: 1.12; margin: 12px 0 10px; }
.ex-card p { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.58; flex: 1; }
.ex-card .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.ex-card:hover .go { color: var(--plum); gap: 12px; }
.paper .ex-card { border-color: var(--paper-line-2); background: var(--paper); }
.paper .ex-card:hover { border-color: var(--plum-ink); background: var(--paper-2); }
.paper .ex-card .idx { color: var(--on-paper-dim); }
.paper .ex-card .tag { color: var(--plum-ink); }
.paper .ex-card p { color: var(--on-paper-mut); }
.paper .ex-card .go { color: var(--on-paper-dim); }
.paper .ex-card:hover .go { color: var(--plum-ink); }

/* ==========================================================================
   Video library — topic groups + cards (paper context)
   ========================================================================== */
.vl-topic { padding-block: clamp(26px, 3vw, 40px); border-bottom: 1px solid var(--paper-line); }
.vl-topic:first-child { padding-top: 0; }
.vl-topic:last-child { border-bottom: 0; padding-bottom: 0; }
.vl-topic-h { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.vl-topic-h-l { display: flex; align-items: baseline; gap: 16px; min-width: 0; }
.vl-topic-h-l .n { font-family: var(--mono); font-size: .64rem; color: var(--plum-ink); }
.vl-topic-h h2 { font-family: var(--serif); font-size: clamp(1.4rem, 2.2vw, 1.9rem); line-height: 1.1; }
.vl-topic-count { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-paper-dim); white-space: nowrap; }

.vl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 980px) { .vl-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .vl-grid { grid-template-columns: 1fr; } }

.vl-card { display: flex; flex-direction: column; width: 100%; text-align: left; border: 1px solid var(--paper-line); border-radius: var(--r-lg); background: var(--paper); overflow: hidden; transition: border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease); }
.vl-card:hover { border-color: var(--plum-ink); background: var(--paper-2); transform: translateY(-3px); }
.vl-card .vid-thumb { border-radius: 0; }
.vl-card:hover .vid-thumb img { transform: scale(1.045); }
.vl-badge { position: absolute; top: 10px; left: 10px; z-index: 3; background: rgba(20,11,19,.82); color: var(--on-ink); font-family: var(--mono); font-size: .54rem; letter-spacing: .16em; text-transform: uppercase; padding: 5px 10px; border-radius: 100px; }
.vl-meta { display: flex; flex-direction: column; gap: 8px; padding: 18px; flex: 1; }
.vl-title { font-family: var(--serif); font-size: 1.16rem; line-height: 1.2; color: var(--on-paper); }
.vl-blurb { font-size: .82rem; color: var(--on-paper-mut); font-weight: 300; line-height: 1.56; }

/* ==========================================================================
   Legal pages (/privacy, /terms) — ink context
   ========================================================================== */
.legal-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(34px, 5vw, 84px); align-items: start; }
@media (max-width: 980px) { .legal-wrap { grid-template-columns: 1fr; gap: 46px; } }
.legal-doc { max-width: 80ch; }
.legal-doc .lp-p { max-width: none; }
.legal-updated { margin-top: 16px; font-family: var(--mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--plum); }

/* ==========================================================================
   Insights (/insights)
   ========================================================================== */
.ins-feature { max-width: 980px; }

.ins-themes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .ins-themes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ins-themes { grid-template-columns: 1fr; } }
.ins-theme { display: flex; flex-direction: column; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease); }
.ins-theme:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.ins-theme-h { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.ins-theme-h .n { font-family: var(--mono); font-size: .62rem; color: var(--plum); }
.ins-theme-h .c { font-family: var(--mono); font-size: .58rem; color: var(--on-ink-dim); }
.ins-theme h3 { font-family: var(--serif); font-size: clamp(1.24rem, 1.8vw, 1.5rem); line-height: 1.14; margin-bottom: 10px; }
.ins-theme p { font-size: .85rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.58; flex: 1; }
.ins-theme .go { margin-top: 20px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.ins-theme:hover .go { color: var(--plum); gap: 12px; }

/* ==========================================================================
   Resources (/resources)
   ========================================================================== */
.res-tag { display: inline-block; align-self: flex-start; font-family: var(--mono); font-size: .56rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); margin-bottom: 14px; }

.res-libs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (max-width: 720px) { .res-libs { grid-template-columns: 1fr; } }
.res-lib { display: flex; flex-direction: column; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 28px; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: all .3s var(--ease); }
.res-lib:hover { border-color: var(--plum); transform: translateY(-3px); background: var(--ink-2); }
.res-lib h3 { font-family: var(--serif); font-size: clamp(1.3rem, 2vw, 1.62rem); line-height: 1.12; margin: 8px 0 10px; }
.res-count { font-family: var(--mono); font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); }
.res-lib .go { margin-top: 18px; font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); display: inline-flex; gap: 8px; align-items: center; transition: all .25s var(--ease); }
.res-lib:hover .go { color: var(--plum); gap: 12px; }

.res-deck-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(30px, 5vw, 76px); align-items: start; }
@media (max-width: 980px) { .res-deck-grid { grid-template-columns: 1fr; gap: 40px; } }

/* ==========================================================================
   Regulatory feed (/regulatory-feed) — ink context
   ========================================================================== */
.rf-list { display: grid; }
.rf-row { display: grid; grid-template-columns: 240px 1fr; gap: clamp(18px, 2.4vw, 32px); align-items: center; width: 100%; text-align: left; padding: 20px 0; border-bottom: 1px solid var(--ink-line-2); }
.rf-row:first-child { padding-top: 0; }
.rf-row:last-child { border-bottom: 0; padding-bottom: 0; }
@media (max-width: 780px) { .rf-row { grid-template-columns: 1fr; gap: 14px; } }
.rf-thumb { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; border-radius: var(--r-lg); border: 1px solid var(--ink-line); background: var(--ink-2); }
.rf-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.rf-row:hover .rf-thumb img { transform: scale(1.04); }
.rf-row:hover .vid-play i { transform: scale(1.09); background: var(--plum-2); }
.rf-meta { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.rf-topic { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); }
.rf-title { font-family: var(--serif); font-size: clamp(1.15rem, 1.7vw, 1.42rem); line-height: 1.16; color: var(--on-ink); }
.rf-blurb { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; max-width: 76ch; }

/* ==========================================================================
   Paper-context overrides for components authored for the dark (ink) band.
   These make the shared primitives safe on `.paper` sections.
   ========================================================================== */
.paper .spec-card { border-color: var(--paper-line-2); background: linear-gradient(180deg, rgba(20,11,19,.018), transparent); }
.paper .spec-card:hover { border-color: var(--plum-ink); background: var(--paper-2); }
.paper .spec-card p { color: var(--on-paper-mut); }
.paper .spec-card .go { color: var(--on-paper-dim); }
.paper .spec-card:hover .go { color: var(--plum-ink); }

.paper .hub-other { border-color: var(--paper-line-2); background: linear-gradient(180deg, rgba(20,11,19,.018), transparent); }
.paper .hub-other:hover { border-color: var(--plum-ink); background: var(--paper-2); }
.paper .hub-other p { color: var(--on-paper-mut); }
.paper .hub-other .go { color: var(--on-paper-dim); }
.paper .hub-other:hover .go { color: var(--plum-ink); }
.paper .hub-other-h { color: var(--plum-ink); }

.paper .lp-block-h { color: var(--plum-ink); }
.paper .lp-block-h .n { color: var(--on-paper-dim); }
.paper .lp-block-h::after { background: var(--paper-line-2); }
.paper .lp-p { color: var(--on-paper-mut); }
.paper .lp-req li { color: var(--on-paper-mut); border-color: var(--paper-line-2); }
.paper .lp-side-card { border-color: var(--paper-line); background: var(--paper); }
.paper .lp-side-card p { color: var(--on-paper-mut); }
.paper .lp-side-h { color: var(--plum-ink); }
.paper .lp-side-list a { color: var(--on-paper-mut); }
.paper .lp-side-list a:hover { color: var(--plum-ink); }
.paper .lp-side-list .tick { background: var(--plum-ink); }

/* Hover lift must survive the reveal transition */
.js .vl-card.reveal.in:hover,
.js .ex-card.reveal.in:hover,
.js .ins-theme.reveal.in:hover,
.js .res-lib.reveal.in:hover,
.js .bio-focus-card.reveal.in:hover { transform: translateY(-3px); }

/* ==========================================================================
   Jurisdiction comparison (/jurisdiction-comparison) — ink context
   ========================================================================== */
.jc-list { display: grid; gap: 20px; }
.jc-row { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); overflow: hidden; background: linear-gradient(180deg, rgba(255,255,255,.015), transparent); transition: border-color .3s var(--ease); }
.jc-row:hover { border-color: var(--plum); }

.jc-head { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: clamp(20px, 3vw, 44px); align-items: start; padding: clamp(22px, 2.6vw, 32px); border-bottom: 1px solid var(--ink-line-2); }
@media (max-width: 780px) { .jc-head { grid-template-columns: 1fr; gap: 22px; } }
.jc-fam { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); }
.jc-head h3 { font-family: var(--serif); font-size: clamp(1.3rem, 2vw, 1.62rem); line-height: 1.12; margin: 10px 0 10px; }
.jc-head p { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; max-width: 68ch; }

.jc-count { border-left: 1px solid var(--ink-line-2); padding-left: clamp(18px, 2.4vw, 30px); display: flex; flex-direction: column; gap: 6px; }
@media (max-width: 780px) { .jc-count { border-left: 0; padding-left: 0; border-top: 1px solid var(--ink-line-2); padding-top: 20px; } }
.jc-count b { font-family: var(--serif); font-size: 2rem; line-height: 1; color: var(--plum); }
.jc-count span { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-ink-dim); }
.jc-count .link-arrow { margin-top: 10px; font-size: .72rem; }

.jc-reads { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--ink-line-2); }
@media (max-width: 1100px) { .jc-reads { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .jc-reads { grid-template-columns: 1fr; } }
.jc-reads > div { background: var(--ink); padding: clamp(18px, 2vw, 24px); }
.jc-reads dt { font-family: var(--mono); font-size: .56rem; letter-spacing: .15em; text-transform: uppercase; color: var(--plum); margin-bottom: 10px; }
.jc-reads dd { font-size: .82rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.55; }

/* ---------- Reveal (progressive enhancement) ----------
   Content is visible by DEFAULT. The hidden state is only applied once the
   `js` class is set on <html> by an inline head script — so with JS disabled
   (or a JS error) every section still renders. */
.reveal { opacity: 1; transform: none; }
.js .reveal {
  opacity: 0; transform: translateY(22px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; transition: none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Private operator surfaces — /admin and /dashboard
   Not linked from public chrome; both are served with noindex.
   ══════════════════════════════════════════════════════════════════════════ */

.admin-wrap { width: 100%; max-width: 1180px; margin-inline: auto; padding: clamp(38px, 5vw, 68px) var(--gutter) clamp(64px, 8vw, 110px); }

/* ---- Sign in ---- */
.admin-login { display: grid; place-items: center; min-height: 54vh; }
.admin-login-card { width: 100%; max-width: 460px; border: 1px solid var(--ink-line); border-radius: var(--r-lg); padding: clamp(28px, 4vw, 44px); background: linear-gradient(180deg, rgba(255,255,255,.02), transparent); }
.admin-login-h { font-size: clamp(1.9rem, 3.4vw, 2.5rem); margin: 12px 0 22px; }
.admin-login-note { font-size: .88rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.66; margin-bottom: 22px; }
.admin-login-note code { font-family: var(--mono); font-size: .78rem; color: var(--plum); background: rgba(196,101,180,.09); padding: 1px 5px; border-radius: 4px; }
.admin-login-warn { border-left: 2px solid var(--plum); padding-left: 14px; }
.admin-login-error { display: flex; gap: 10px; align-items: flex-start; font-size: .85rem; color: #F2A6A6; background: rgba(200,70,70,.10); border: 1px solid rgba(200,70,70,.30); border-radius: var(--r); padding: 12px 14px; margin-bottom: 20px; }
.admin-login-form { display: grid; gap: 10px; }
.admin-login-form label { font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--on-ink-dim); }
.admin-login-form input { width: 100%; background: var(--ink-2); border: 1px solid var(--ink-line); border-radius: var(--r); color: var(--on-ink); font-family: var(--mono); font-size: .95rem; padding: 13px 15px; }
.admin-login-form input:focus { outline: none; border-color: var(--plum); }
.admin-login-form .btn { justify-content: center; margin-top: 10px; }
.admin-login-foot { font-size: .72rem; color: var(--on-ink-dim); font-weight: 300; line-height: 1.6; margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--ink-line-2); }

/* ---- Bar ---- */
.admin-bar { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-end; justify-content: space-between; padding-bottom: 26px; border-bottom: 1px solid var(--ink-line); margin-bottom: 30px; }
.admin-h1 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); margin-top: 10px; }
.admin-sub { font-size: .86rem; color: var(--on-ink-mut); font-weight: 300; margin-top: 10px; max-width: 62ch; }
.admin-sub code { font-family: var(--mono); font-size: .76rem; color: var(--plum); }
.admin-nav { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.admin-nav a { font-family: var(--mono); font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-ink-mut); padding: 9px 14px; border: 1px solid var(--ink-line-2); border-radius: var(--r); transition: color .2s var(--ease), border-color .2s var(--ease); }
.admin-nav a:hover { color: var(--plum); border-color: var(--plum); }
.admin-nav a[aria-current="page"] { color: var(--ink); background: var(--plum); border-color: var(--plum); }
.admin-signout { font-family: var(--mono); font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-ink-dim); background: none; border: 1px solid var(--ink-line-2); border-radius: var(--r); padding: 9px 14px; cursor: pointer; }
.admin-signout:hover { color: #F2A6A6; border-color: rgba(200,70,70,.5); }

/* ---- Banners ---- */
.admin-banner { display: flex; gap: 11px; align-items: flex-start; font-size: .85rem; font-weight: 300; line-height: 1.6; border-radius: var(--r); padding: 13px 16px; margin-bottom: 24px; }
.admin-banner code { font-family: var(--mono); font-size: .76rem; }
.admin-banner-warn { color: #F5D9A6; background: rgba(210,150,40,.10); border: 1px solid rgba(210,150,40,.32); }
.admin-banner-ok { color: #A9E0BC; background: rgba(70,170,110,.10); border: 1px solid rgba(70,170,110,.30); }

/* ---- Stats ---- */
.admin-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 10px; margin-bottom: 26px; }
.admin-stat { display: block; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); padding: 18px 20px; background: linear-gradient(180deg, rgba(255,255,255,.018), transparent); transition: border-color .2s var(--ease); }
a.admin-stat:hover { border-color: var(--plum); }
.admin-stat-n { font-family: var(--serif); font-size: clamp(1.6rem, 2.6vw, 2.05rem); line-height: 1; }
.admin-stat-l { font-family: var(--mono); font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-ink-dim); margin-top: 9px; }
.admin-stat-sub { font-size: .68rem; color: var(--on-ink-dim); font-weight: 300; margin-top: 5px; }
.admin-stat-plain { opacity: .72; }

/* ---- Filters ---- */
.admin-filters { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; padding: 18px 20px; border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); margin-bottom: 24px; }
.admin-field { display: grid; gap: 7px; min-width: 0; }
.admin-field span { font-family: var(--mono); font-size: .58rem; letter-spacing: .17em; text-transform: uppercase; color: var(--on-ink-dim); }
.admin-field input, .admin-field select, .admin-field textarea { background: var(--ink-2); border: 1px solid var(--ink-line); border-radius: var(--r); color: var(--on-ink); font-size: .86rem; font-weight: 300; padding: 10px 12px; font-family: inherit; }
.admin-field input:focus, .admin-field select:focus, .admin-field textarea:focus { outline: none; border-color: var(--plum); }
.admin-field input, .admin-field select, .admin-field textarea { min-width: 0; max-width: 100%; }
.admin-field-wide { flex: 1 1 260px; }
.admin-filter-actions { display: flex; gap: 8px; margin-left: auto; }

/* ---- Lead rows ---- */
.admin-empty { font-size: .9rem; color: var(--on-ink-mut); font-weight: 300; padding: 46px 0; text-align: center; border: 1px dashed var(--ink-line-2); border-radius: var(--r-lg); }
.admin-empty a { color: var(--plum); }
.admin-list { display: grid; gap: 6px; list-style: none; }
.admin-item { border: 1px solid var(--ink-line-2); border-radius: var(--r-lg); background: rgba(255,255,255,.012); overflow: hidden; }
.admin-item[open], .admin-item:has(> details[open]) { border-color: var(--ink-line); }
.admin-item summary { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto auto; gap: 16px; align-items: center; padding: 15px 18px; cursor: pointer; list-style: none; }
.admin-item summary::-webkit-details-marker { display: none; }
.admin-item summary:hover { background: rgba(255,255,255,.02); }
.admin-avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--ink-line); font-family: var(--mono); font-size: .68rem; color: var(--plum); flex: none; }
.admin-who { display: grid; gap: 2px; min-width: 0; }
.admin-name { font-size: .94rem; font-weight: 400; }
.admin-mail { font-family: var(--mono); font-size: .72rem; color: var(--on-ink-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-meta { display: flex; gap: 6px; flex-wrap: wrap; }
.admin-chip { font-family: var(--mono); font-size: .6rem; letter-spacing: .06em; color: var(--on-ink-mut); border: 1px solid var(--ink-line-2); border-radius: 999px; padding: 3px 9px; white-space: nowrap; }
.admin-when { font-family: var(--mono); font-size: .68rem; color: var(--on-ink-dim); white-space: nowrap; }
.admin-badge { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; border-radius: 999px; padding: 4px 10px; white-space: nowrap; border: 1px solid; }
.st-new      { color: #F5D9A6; border-color: rgba(210,150,40,.42); }
.st-contacted{ color: #A9CBEA; border-color: rgba(90,150,220,.42); }
.st-qualified{ color: #A9E0BC; border-color: rgba(70,170,110,.42); }
.st-closed   { color: var(--on-ink-dim); border-color: var(--ink-line); }
.admin-badge.st-new { background: rgba(210,150,40,.12); }
.admin-badge.st-contacted { background: rgba(90,150,220,.12); }
.admin-badge.st-qualified { background: rgba(70,170,110,.12); }
.admin-badge.st-closed { background: rgba(255,255,255,.03); }

/* ---- Lead detail ---- */
.admin-detail { padding: 4px 18px 22px; border-top: 1px solid var(--ink-line-2); }
.admin-rows { display: grid; grid-template-columns: 116px minmax(0,1fr); gap: 9px 20px; padding: 20px 0; font-size: .85rem; }
.admin-rows dt { font-family: var(--mono); font-size: .58rem; letter-spacing: .15em; text-transform: uppercase; color: var(--on-ink-dim); padding-top: 3px; }
.admin-rows dd { color: var(--on-ink-mut); font-weight: 300; margin: 0; }
.admin-rows dd a { color: var(--plum); }
.admin-mono { font-family: var(--mono); font-size: .74rem; }
.admin-break { overflow-wrap: anywhere; }
.admin-brief { padding: 18px 20px; border: 1px solid var(--ink-line-2); border-radius: var(--r); background: var(--ink-2); }
.admin-brief-h { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--plum); margin-bottom: 11px; }
.admin-brief p { font-size: .9rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.7; white-space: pre-wrap; }
.admin-triage { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin-top: 18px; }
.admin-triage .btn { margin-left: auto; }

/* ---- Sections + tables ---- */
.admin-section { padding-top: 34px; margin-top: 34px; border-top: 1px solid var(--ink-line-2); }
.admin-section:first-of-type { padding-top: 0; margin-top: 0; border-top: 0; }
.admin-h2 { font-family: var(--serif); font-size: 1.42rem; margin-bottom: 18px; }
.admin-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 20px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: .85rem; margin-bottom: 16px; }
.admin-table th { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-ink-dim); text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--ink-line); }
.admin-table td { padding: 12px 14px; border-bottom: 1px solid var(--ink-line-2); color: var(--on-ink-mut); font-weight: 300; vertical-align: top; }
.admin-table td a { color: var(--plum); }
.admin-table tr:last-child td { border-bottom: 0; }
.admin-pill { font-family: var(--mono); font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; border-radius: 999px; padding: 4px 10px; border: 1px solid; white-space: nowrap; }
.admin-pill.ok { color: #A9E0BC; border-color: rgba(70,170,110,.42); background: rgba(70,170,110,.10); }
.admin-pill.warn { color: #F5D9A6; border-color: rgba(210,150,40,.42); background: rgba(210,150,40,.10); }
.admin-pill.bad { color: #F2A6A6; border-color: rgba(200,70,70,.42); background: rgba(200,70,70,.10); }
.admin-note { font-size: .78rem; color: var(--on-ink-dim); font-weight: 300; line-height: 1.68; max-width: 78ch; }
.admin-note code, .admin-todo code { font-family: var(--mono); font-size: .72rem; color: var(--plum); }
.admin-todo { display: grid; gap: 9px; list-style: none; }
.admin-todo li { display: flex; gap: 11px; align-items: flex-start; font-size: .85rem; color: var(--on-ink-mut); font-weight: 300; line-height: 1.6; }
.admin-todo .admin-pill { flex: none; margin-top: 1px; }

@media (max-width: 720px) {
  .admin-item summary { grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; }
  .admin-meta, .admin-when { display: none; }
  .admin-rows { grid-template-columns: 1fr; gap: 4px 0; }
  .admin-rows dt { padding-top: 10px; }
  .admin-filter-actions { margin-left: 0; width: 100%; }
  .admin-field, .admin-field-wide { flex: 1 1 100%; }
  .admin-table th, .admin-table td { padding-left: 8px; padding-right: 8px; }
  .admin-table { display: block; overflow-x: auto; }
  .admin-triage .btn { margin-left: 0; width: 100%; }
}