/* =====================================================================
   THE BELGIAN DESK - editorial layer for Department of Bad Decisions.
   Loaded AFTER main.css, so it reuses every DBD token and component
   (--paper, --ink, --red, .stamp, .gov-form, .field, .clerk-frame ...).
   Scoped under body.belgian so the core DBD identity is never altered.

   Restrained Belgian accents: black / gold / red. Never a full flag.

   Component classes (mirror the requested design-system components):
     .be-header       -> BelgianDeskHeader
     .be-casefile     -> BelgianCaseFile
     .be-bulletin     -> BelgianBulletin
     .money-record    -> PublicMoneyRecord
     .source-record   -> SourceRecord
     .clerk-assessment-> ClerkAssessment
     .be-approved     -> BelgianApprovedStamp
     .case-timeline   -> CaseTimeline
     .case-archive    -> CaseArchive
     .editorial-notice-> EditorialNotice
     .illus-frame     -> PoliticalIllustrationFrame
   The two editorial layers are visually separated by:
     .layer-fact      -> sourced PUBLIC RECORD
     .layer-satire    -> DEPARTMENT COMMENTARY (obvious satire)
   ===================================================================== */

body.belgian {
  --be-black: #17130b;
  --be-gold:  #e6b325;
  --be-gold-soft: rgba(230, 179, 37, 0.16);
  --be-red:   #b3261e;      /* keep DBD red for continuity */
  --be-red-flag: #c1121f;
}

/* Belgian tricolour rule (thin, restrained) */
.be-tricolor {
  height: 6px;
  border: 1.5px solid var(--line);
  background: linear-gradient(90deg,
    var(--be-black) 0 33.33%,
    var(--be-gold) 33.33% 66.66%,
    var(--be-red-flag) 66.66% 100%);
}
.be-tricolor.tall { height: 10px; }
/* vertical spine variant for dossier cards */
.be-tricolor-spine {
  position: absolute; left: 0; top: 0; bottom: 0; width: 8px;
  background: linear-gradient(180deg,
    var(--be-black) 0 33.33%,
    var(--be-gold) 33.33% 66.66%,
    var(--be-red-flag) 66.66% 100%);
  border-right: 1.5px solid var(--line);
}

/* Belgian tab accent in the shared nav */
.filetab--belgian { position: relative; }
.filetab--belgian::after {
  content: ""; position: absolute; left: 8px; right: 8px; bottom: 4px; height: 3px;
  background: linear-gradient(90deg, var(--be-black) 0 33.33%, var(--be-gold) 33.33% 66.66%, var(--be-red-flag) 66.66% 100%);
}

/* ---------------------------------------------------------------------
   HERO / HEADER  (.be-header -> BelgianDeskHeader)
   --------------------------------------------------------------------- */
.be-header {
  position: relative;
  border: 1.5px solid var(--line);
  background: var(--sheet);
  box-shadow: var(--shadow);
  margin-bottom: 30px;
  overflow: hidden;
}
/* Large, bold, weathered Belgian flag behind the Belgian Desk header */
.be-header .flag {
  position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(90deg, var(--be-black) 0 33.33%, var(--be-gold) 33.33% 66.66%, var(--be-red-flag) 66.66% 100%);
}
.be-header .flag::before {
  content: ""; position: absolute; inset: 0;
  background:
    repeating-linear-gradient(100deg, rgba(0,0,0,.22) 0 2px, rgba(255,255,255,.06) 2px 26px, rgba(0,0,0,.16) 26px 40px),
    radial-gradient(120% 120% at 50% 0%, transparent 40%, rgba(0,0,0,.42) 100%);
  mix-blend-mode: multiply;
}
.be-header .flag::after {
  content: ""; position: absolute; inset: 0;
  background-image: var(--grain); background-size: 180px 180px; opacity: .5; mix-blend-mode: multiply;
}
.be-header .be-head-inner {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 26px;
  padding: 28px 30px 26px;
  align-items: center;
}
.be-header::before { content: ""; position: absolute; inset: 6px; border: 1px solid rgba(33,29,22,.4); pointer-events: none; }
.be-kicker {
  font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .28em;
  font-size: 12px; color: var(--ink-3);
}
.be-header h1 {
  font-size: clamp(40px, 8vw, 84px);
  line-height: .9; text-transform: uppercase; letter-spacing: -.01em; margin: 6px 0 14px;
}
.be-primary {
  font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .14em; font-weight: 700;
  font-size: clamp(13px, 1.8vw, 16px); color: var(--ink); margin: 0 0 12px;
}
.be-primary span { color: var(--be-red); }
.be-intro { font-family: var(--f-display); font-size: clamp(15px, 2vw, 18px); font-style: italic; color: var(--ink-2); max-width: 44ch; }

/* identification mark: DBD / BELGIAN DESK / PUBLIC RECORDS OFFICE */
.be-idmark {
  justify-self: center;
  text-align: center;
  border: 3px solid var(--be-red);
  border-radius: 8px;
  padding: 14px 20px;
  transform: rotate(-3deg);
  background: var(--paper);
  box-shadow: inset 0 0 0 2px rgba(179,38,30,.4), var(--shadow-sm);
}
.be-idmark .idm-top { font-family: var(--f-stamp); font-weight: 700; font-size: 34px; letter-spacing: .1em; color: var(--be-red); line-height: 1; }
.be-idmark .idm-mid { font-family: var(--f-stamp); font-weight: 700; letter-spacing: .22em; font-size: 14px; color: var(--ink); margin: 6px 0 2px; }
.be-idmark .idm-bot { font-family: var(--f-mono); font-size: 10px; letter-spacing: .18em; color: var(--ink-3); }
.be-idmark .be-tricolor { height: 5px; margin-top: 8px; }

/* clerk strip inside the Belgian experience (canonical Clerk, unchanged) */
.be-clerkstrip {
  display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center;
  border: 1.5px solid var(--line); background: var(--sheet-2); box-shadow: var(--shadow-sm);
  padding: 14px 18px; margin-bottom: 30px;
}
.be-clerkstrip .be-clerk-thumb {
  width: 120px; height: 120px; border: 1.5px solid var(--line); overflow: hidden; background: var(--sheet);
}
.be-clerkstrip .be-clerk-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.be-clerkstrip .bc-text .bc-name { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
.be-clerkstrip .bc-text p { margin: 4px 0 0; font-size: 13px; color: var(--ink-2); }

@media (max-width: 820px) {
  .be-header .be-head-inner { grid-template-columns: 1fr; }
  .be-idmark { justify-self: start; }
}

/* ---------------------------------------------------------------------
   EDITORIAL NOTICE  (.editorial-notice -> EditorialNotice)
   --------------------------------------------------------------------- */
.editorial-notice {
  border: 2px solid var(--line);
  background: var(--be-gold-soft);
  padding: 14px 16px;
  margin: 22px 0;
  display: flex; gap: 14px; align-items: flex-start;
}
.editorial-notice .en-badge {
  flex: 0 0 auto; font-family: var(--f-stamp); font-weight: 700; text-transform: uppercase; letter-spacing: .12em;
  font-size: 11px; color: var(--ink); background: var(--be-gold); border: 1.5px solid var(--line); padding: 4px 10px; border-radius: 4px;
}
.editorial-notice p { margin: 0; font-family: var(--f-mono); font-size: 12.5px; color: var(--ink-2); line-height: 1.6; }
.editorial-notice strong { color: var(--ink); }

/* ---------------------------------------------------------------------
   SECTION SCAFFOLD
   --------------------------------------------------------------------- */
.be-section { margin: 34px 0; scroll-margin-top: 70px; }
.be-section-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  border-bottom: 3px double var(--line); padding-bottom: 8px; margin-bottom: 18px;
}
.be-section-head h2 { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(20px, 3vw, 28px); }
.be-section-head .bsh-meta { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .1em; }

/* ---------------------------------------------------------------------
   ARCHIVE + FILTERS  (.case-archive -> CaseArchive)
   --------------------------------------------------------------------- */
.be-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.be-chip {
  font-family: var(--f-mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em;
  border: 1.5px solid var(--border-strong); background: var(--paper); color: var(--ink-2);
  padding: 5px 11px; border-radius: 3px; cursor: pointer;
}
.be-chip[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.be-chip:focus-visible { outline: 2px solid var(--be-red); outline-offset: 2px; }

.be-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
@media (max-width: 760px) { .be-grid { grid-template-columns: 1fr; } }

/* empty state (honest, no fake cases) */
.be-empty {
  border: 2px dashed var(--border-strong); background: var(--sheet-2);
  padding: 28px 22px; text-align: center;
}
.be-empty .bee-title { font-family: var(--f-display); text-transform: uppercase; font-size: 20px; margin-bottom: 6px; }
.be-empty p { font-family: var(--f-mono); font-size: 13px; color: var(--ink-2); margin: 4px 0 0; }

/* ---------------------------------------------------------------------
   BELGIAN CASE FILE  (.be-casefile -> BelgianCaseFile) : shareable dossier
   --------------------------------------------------------------------- */
.be-casefile {
  position: relative;
  border: 1.5px solid var(--line);
  background: var(--sheet);
  box-shadow: var(--shadow);
  padding: 18px 20px 18px 26px;
  transition: transform .16s ease, box-shadow .16s ease;
}
.be-casefile:hover { transform: translateY(-2px); box-shadow: 0 2px 0 rgba(33,29,22,.2), 0 16px 34px rgba(33,29,22,.16); }
.be-casefile .cf-head {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  border-bottom: 2px solid var(--line); padding-bottom: 8px; margin-bottom: 10px;
}
.be-casefile .cf-no { font-family: var(--f-stamp); font-weight: 700; letter-spacing: .14em; color: var(--be-red); font-size: 13px; }
.be-casefile .cf-desk { font-family: var(--f-mono); font-size: 10px; letter-spacing: .18em; color: var(--ink-3); text-transform: uppercase; }
.be-casefile .cf-subject { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(17px, 2.4vw, 21px); line-height: 1.15; margin: 2px 0 8px; }
.be-casefile a.cf-subject-link { border: none; color: var(--ink); }
.be-casefile a.cf-subject-link:hover { background: var(--be-gold-soft); }
.be-casefile .cf-inst { font-family: var(--f-mono); font-size: 12px; color: var(--ink-2); margin-bottom: 10px; }
.be-casefile .cf-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; }

/* key public-money highlight on a card */
.cf-money-key {
  border: 1.5px solid var(--line); background: var(--be-gold-soft);
  padding: 8px 12px; margin: 6px 0;
}
.cf-money-key .k { font-family: var(--f-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.cf-money-key .v { font-family: var(--f-stamp); font-weight: 700; font-size: clamp(18px, 3vw, 24px); color: var(--ink); }

/* verified public record badge */
.source-status {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--f-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em;
  color: var(--ink); border: 1.5px solid var(--line); padding: 3px 8px; background: var(--paper);
}
.source-status::before { content: ""; width: 8px; height: 8px; background: var(--be-gold); border: 1px solid var(--line); border-radius: 50%; }
.source-status.sample { color: var(--be-red); border-color: var(--be-red); }
.source-status.sample::before { background: var(--be-red); }

/* ---------------------------------------------------------------------
   FACT vs SATIRE  (unmistakable separation)
   --------------------------------------------------------------------- */
.layer { padding: 14px 16px; margin: 14px 0; border: 1.5px solid var(--line); }
.layer .layer-label {
  font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .16em; font-weight: 700; font-size: 11px;
  display: inline-block; margin-bottom: 8px; padding: 3px 9px; border: 1.5px solid var(--line);
}
.layer-fact { background: var(--sheet); }
.layer-fact .layer-label { color: var(--ink); background: var(--paper); }
.layer-satire {
  background: rgba(179,38,30,.05);
  border-style: dashed; border-color: var(--be-red);
}
.layer-satire .layer-label { color: #fff; background: var(--be-red); border-color: var(--be-red); }
.layer-satire .satire-note { font-family: var(--f-mono); font-size: 10.5px; color: var(--be-red); margin-top: 8px; font-style: italic; }

/* Dossier: findings, who-involved, last verified, primary source marker */
.finding { padding: 7px 0; border-bottom: 1px dotted var(--border); }
.finding:last-child { border-bottom: none; }
.finding-inst { display: inline-block; font-family: var(--f-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--be-red); font-weight: bold; margin-right: 8px; }
.who-row { display: grid; grid-template-columns: 240px 1fr; gap: 10px; padding: 6px 0; border-bottom: 1px dotted var(--border); }
.who-row:last-child { border-bottom: none; }
.who-name { font-family: var(--f-mono); font-weight: bold; font-size: 13px; }
.who-role { font-family: var(--f-mono); font-size: 12.5px; color: var(--ink-2); }
@media (max-width: 560px) { .who-row { grid-template-columns: 1fr; gap: 2px; } }
.last-verified { margin-top: 10px; font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .08em; }
.sr-primary { display: inline-block; font-family: var(--f-stamp); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: var(--be-red); padding: 1px 6px; margin-right: 6px; }

/* ---------------------------------------------------------------------
   SOURCE RECORD  (.source-record -> SourceRecord)
   --------------------------------------------------------------------- */
.source-record { border-top: 1px dotted var(--border); padding: 8px 0; }
.source-record:first-of-type { border-top: none; }
.source-record.is-primary { background: var(--be-gold-soft); border-left: 3px solid var(--be-gold); padding-left: 8px; }
.source-record .sr-type {
  display: inline-block; font-family: var(--f-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink); border: 1.5px solid var(--line); padding: 2px 7px; margin-right: 8px; background: var(--be-gold-soft);
}
.source-record .sr-name { font-weight: 700; }
.source-record .sr-meta { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.source-record a { font-size: 12.5px; word-break: break-all; }

/* ---------------------------------------------------------------------
   PUBLIC MONEY RECORD  (.money-record -> PublicMoneyRecord)
   --------------------------------------------------------------------- */
.money-record { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.money-cell { border: 1.5px solid var(--line); background: var(--sheet); padding: 10px 12px; }
.money-cell .mc-k { font-family: var(--f-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.money-cell .mc-v { font-family: var(--f-stamp); font-weight: 700; font-size: 18px; color: var(--ink); margin-top: 3px; }
.money-cell.loss .mc-v { color: var(--be-red); }
.money-cell.notdoc .mc-v { color: var(--ink-3); font-style: italic; font-size: 13px; }
.money-cell .mc-note { font-family: var(--f-mono); font-size: 11px; line-height: 1.4; color: var(--ink-3); margin-top: 6px; }

/* ---------------------------------------------------------------------
   CLERK ASSESSMENT  (.clerk-assessment -> ClerkAssessment) : satire
   --------------------------------------------------------------------- */
.clerk-assessment { }
.clerk-assessment .ca-row {
  display: grid; grid-template-columns: 220px 1fr; gap: 12px; padding: 7px 0; border-bottom: 1px dotted rgba(179,38,30,.4);
}
.clerk-assessment .ca-row:last-child { border-bottom: none; }
.clerk-assessment .ca-k { font-family: var(--f-mono); text-transform: uppercase; font-size: 11.5px; letter-spacing: .1em; color: var(--be-red); }
.clerk-assessment .ca-v { font-family: var(--f-display); font-style: italic; }
@media (max-width: 560px) { .clerk-assessment .ca-row { grid-template-columns: 1fr; gap: 2px; } }

/* ---------------------------------------------------------------------
   TIMELINE  (.case-timeline -> CaseTimeline)
   --------------------------------------------------------------------- */
.case-timeline { list-style: none; margin: 0; padding: 0 0 0 8px; border-left: 2px solid var(--line); }
.case-timeline li { position: relative; padding: 6px 0 10px 18px; }
.case-timeline li::before { content: ""; position: absolute; left: -7px; top: 12px; width: 10px; height: 10px; background: var(--be-gold); border: 1.5px solid var(--line); border-radius: 50%; }
.case-timeline .tl-date { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); letter-spacing: .06em; }
.case-timeline .tl-event { font-family: var(--f-mono); font-size: 13px; }

/* ---------------------------------------------------------------------
   ILLUSTRATION FRAME  (.illus-frame -> PoliticalIllustrationFrame)
   Accepts future approved artwork without breaking layout.
   --------------------------------------------------------------------- */
.illus-frame {
  position: relative; border: 1.5px solid var(--line); background: var(--sheet-2);
  aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; margin: 14px 0;
}
.illus-frame > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.illus-frame .illus-empty {
  font-family: var(--f-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .14em; color: var(--ink-3);
  text-align: center; padding: 16px;
}
.illus-frame .illus-cap {
  position: absolute; left: 0; right: 0; bottom: 0; font-family: var(--f-mono); font-size: 10px; letter-spacing: .1em;
  color: var(--ink-3); background: rgba(246,239,221,.85); padding: 4px 8px; border-top: 1px solid var(--border);
}

/* ---------------------------------------------------------------------
   BELGIAN BULLETIN  (.be-bulletin -> BelgianBulletin)
   --------------------------------------------------------------------- */
.be-bulletin {
  position: relative; border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow-sm);
  padding: 16px 18px 16px 24px; margin-bottom: 18px;
}
.be-bulletin .bb-head { display: flex; justify-content: space-between; gap: 10px; border-bottom: 2px solid var(--line); padding-bottom: 6px; margin-bottom: 10px; }
.be-bulletin .bb-title { font-family: var(--f-stamp); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; font-size: 12px; color: var(--be-red); }
.be-bulletin .bb-no { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); }
.be-bulletin .bb-subject { font-family: var(--f-display); text-transform: uppercase; font-size: 18px; margin-bottom: 8px; }

/* ---------------------------------------------------------------------
   BELGIAN APPROVED STAMP  (.be-approved -> BelgianApprovedStamp)
   Reuses the DBD .stamp look with a subtle Belgian gold outer ring.
   --------------------------------------------------------------------- */
.be-approved.stamp { box-shadow: inset 0 0 0 2px rgba(179,38,30,.55), 0 0 0 3px var(--be-gold-soft); }

/* ---------------------------------------------------------------------
   DEVELOPMENT SAMPLE markers (localhost only, never production content)
   --------------------------------------------------------------------- */
.be-sample-banner {
  border: 2px dashed var(--be-red); background: rgba(179,38,30,.06); color: var(--be-red);
  font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 12px;
  padding: 10px 14px; margin: 16px 0; text-align: center;
}
.be-casefile.is-sample { outline: 2px dashed var(--be-red); outline-offset: 3px; }
.be-casefile .sample-ribbon {
  position: absolute; top: 10px; right: -6px; background: var(--be-red); color: #fff; transform: rotate(3deg);
  font-family: var(--f-stamp); font-weight: 700; letter-spacing: .14em; font-size: 10px; text-transform: uppercase; padding: 3px 12px;
}

/* ---------------------------------------------------------------------
   CASE DETAIL + SUBMIT + DETAIL nav
   --------------------------------------------------------------------- */
.be-detail-topbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.be-back {
  font-family: var(--f-mono); font-size: 12px; text-transform: uppercase; letter-spacing: .1em;
  border: 1.5px solid var(--line); padding: 6px 12px; background: var(--paper); color: var(--ink);
}
.be-share-hint { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); }

.be-submit {
  border: 1.5px solid var(--line); background: var(--sheet-2); box-shadow: var(--shadow-sm);
  padding: 20px 22px; margin: 34px 0;
}
.be-submit h2 { font-family: var(--f-display); text-transform: uppercase; font-size: 22px; margin-bottom: 8px; }
.be-submit p { font-family: var(--f-mono); font-size: 13px; color: var(--ink-2); }
.be-submit .submit-fields { font-family: var(--f-mono); font-size: 12px; color: var(--ink-3); margin-top: 10px; }
.be-submit .submit-note { margin-top: 10px; font-size: 11.5px; color: var(--be-red); }

@media (max-width: 480px) {
  .be-header h1 { font-size: clamp(34px, 13vw, 56px); }
  .clerk-assessment .ca-row { grid-template-columns: 1fr; }
}

/* =====================================================================
   HOMEPAGE (Department-first) with a large, weathered Belgian flag.
   ===================================================================== */
.home-hero {
  position: relative; overflow: hidden;
  border: 1.5px solid var(--line); box-shadow: var(--shadow); margin-bottom: 26px;
}
/* big flag backdrop: black / gold / red vertical bands, aged and printed */
.home-hero .flag {
  position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(90deg, var(--be-black) 0 33.33%, var(--be-gold) 33.33% 66.66%, var(--be-red-flag) 66.66% 100%);
}
.home-hero .flag::before { /* weathered ripple + shading */
  content: ""; position: absolute; inset: 0;
  background:
    repeating-linear-gradient(100deg, rgba(0,0,0,.22) 0 2px, rgba(255,255,255,.06) 2px 26px, rgba(0,0,0,.16) 26px 40px),
    radial-gradient(120% 120% at 50% 0%, transparent 40%, rgba(0,0,0,.45) 100%);
  mix-blend-mode: multiply;
}
.home-hero .flag::after { /* print grain */
  content: ""; position: absolute; inset: 0;
  background-image: var(--grain); background-size: 180px 180px; opacity: .5; mix-blend-mode: multiply;
}
.home-hero-inner {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.25fr .75fr; gap: 24px; align-items: stretch;
  padding: 26px;
}
.hh-copy {
  background: rgba(244,236,214,.94); border: 1.5px solid var(--line); box-shadow: var(--shadow-sm);
  padding: 24px;
}
.hh-copy .division { display:inline-block; font-family: var(--f-stamp); text-transform: uppercase; letter-spacing:.28em; font-size:11px; color: var(--ink-3); }
.hh-copy h1 { font-size: clamp(34px, 6vw, 68px); line-height:.9; text-transform: uppercase; margin: 8px 0 12px; }
.hh-copy .hh-lead { font-family: var(--f-display); font-style: italic; color: var(--ink-2); margin: 0 0 14px; max-width: 46ch; }
.hh-copy .core { font-family: var(--f-mono); text-transform: uppercase; letter-spacing:.04em; color: var(--ink-2); border-left: 4px solid var(--ink); padding-left: 12px; margin: 0 0 14px; font-size: 14px; }
.hh-copy .core strong { color: var(--ink); }
.hh-clerk {
  position: relative; border: 1.5px solid var(--line); background: rgba(244,236,214,.85);
  box-shadow: var(--shadow-sm); display: grid; grid-template-rows: 1fr auto; overflow: hidden;
}
.hh-clerk .hhc-frame { overflow: hidden; }
.hh-clerk img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; min-height: 220px; }
.hh-clerk .hhc-cap { font-family: var(--f-mono); font-size: 10px; letter-spacing:.1em; color: var(--ink-3); text-transform: uppercase; padding: 6px 8px; border-top: 1px dashed var(--border); }
@media (max-width: 820px) { .home-hero-inner { grid-template-columns: 1fr; } .hh-clerk { order: -1; max-width: 420px; margin: 0 auto; } }

/* Belgian Desk call-to-action band */
.be-cta {
  display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center;
  border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow-sm);
  padding: 18px 20px; margin-bottom: 30px;
}
.be-cta .cta-title { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(22px, 3vw, 30px); }
.be-cta .cta-title .be-tricolor { height: 6px; width: 160px; margin-top: 6px; }
.be-cta .cta-sub { font-family: var(--f-mono); font-size: 12.5px; color: var(--ink-2); margin-top: 8px; }
.be-cta .cta-sub b { color: var(--be-red); }
.be-cta .cta-btn {
  font-family: var(--f-stamp); text-transform: uppercase; letter-spacing:.14em; font-weight:700; font-size: 14px;
  background: var(--ink); color: var(--paper); border: 1.5px solid var(--line); padding: 14px 20px; white-space: nowrap;
}
.be-cta .cta-btn:hover { background: var(--be-red); }
@media (max-width: 620px) { .be-cta { grid-template-columns: 1fr; } }

/* FILES CURRENTLY UNDER REVIEW - homepage dossier cards */
.home-files { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 1000px) { .home-files { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .home-files { grid-template-columns: 1fr; } }

.home-file {
  position: relative; border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow-sm);
  padding: 26px 14px 14px; transition: transform .16s ease, box-shadow .16s ease;
}
.home-file:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.home-file::before { /* paperclip */
  content: ""; position: absolute; top: -8px; left: 16px; width: 16px; height: 34px; border: 3px solid var(--ink-3);
  border-radius: 8px; border-bottom: none; background: transparent; opacity: .7;
}
.home-file .hf-tag {
  position: absolute; top: 10px; right: 8px; font-family: var(--f-stamp); font-weight: 700; letter-spacing: .1em;
  font-size: 9px; text-transform: uppercase; color: var(--be-red); border: 1.5px solid var(--be-red); padding: 2px 6px; transform: rotate(3deg);
}
.home-file .hf-no { font-family: var(--f-stamp); font-weight: 700; letter-spacing: .12em; font-size: 12px; color: var(--ink); background: var(--paper); border: 1.5px solid var(--line); display: inline-block; padding: 2px 8px; }
.home-file .hf-title { font-family: var(--f-display); text-transform: uppercase; font-size: 16px; line-height: 1.12; margin: 10px 0 8px; }
.home-file .hf-title a { border: none; color: var(--ink); }
.home-file .hf-title a:hover { background: var(--be-gold-soft); }
.home-file .hf-k { font-family: var(--f-mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); margin-top: 8px; }
.home-file .hf-v { font-family: var(--f-mono); font-size: 12px; }
.home-file .hf-money { font-family: var(--f-stamp); font-weight: 700; font-size: 20px; color: var(--ink); margin-top: 2px; }
.home-file .hf-money.nd { font-size: 13px; color: var(--ink-3); font-style: italic; }
.home-file .hf-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; border-top: 1px dashed var(--border); padding-top: 10px; }
.home-file .hf-clerk { width: 40px; height: 40px; border: 1.5px solid var(--line); overflow: hidden; flex: 0 0 auto; }
.home-file .hf-clerk img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }

.home-section { margin: 34px 0; }
.home-section .hs-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 3px double var(--line); padding-bottom: 8px; margin-bottom: 16px; }
.home-section .hs-head h2 { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(20px, 3vw, 28px); }
.home-section .hs-head .hs-note { font-family: var(--f-mono); font-size: 10.5px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .08em; text-align: right; max-width: 34ch; }

/* Meet the Clerk (homepage) */
.meet-clerk { display: grid; grid-template-columns: 150px 1fr; gap: 20px; align-items: center; border: 1.5px solid var(--line); background: var(--sheet-2); box-shadow: var(--shadow-sm); padding: 18px 20px; }
.meet-clerk .mc-portrait { width: 150px; height: 150px; border: 1.5px solid var(--line); overflow: hidden; }
.meet-clerk .mc-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.meet-clerk .mc-body p { margin: 4px 0; font-family: var(--f-mono); font-size: 13px; color: var(--ink-2); }
.meet-clerk .mc-body .mc-name { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; color: var(--ink); }
@media (max-width: 560px) { .meet-clerk { grid-template-columns: 1fr; } .meet-clerk .mc-portrait { margin: 0 auto; } }

/* $DBD demoted section header */
.dbd-office .hs-head h2 { font-size: clamp(18px, 2.6vw, 24px); }

/* EU-first homepage hero variant (used on the front door) */
.home-hero.eu .flag {
  background-color: #003399;
  background-image: url("../assets/eu-flag.svg");
  background-repeat: no-repeat;
  background-position: 72% 42%;
  background-size: 150% auto;
}
.home-hero.eu .home-eu-division {
  display: inline-block; font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .2em; font-weight: 700;
  font-size: 14px; color: #003399; border-bottom: 3px solid #e6b325; padding-bottom: 2px; margin: 2px 0 10px;
}
.home-hero.eu .hh-copy .pay { color: #003399; }

/* =====================================================================
   HOMEPAGE — strong EU case files (front-door editorial cards)
   ===================================================================== */
.eu-home-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 820px) { .eu-home-grid { grid-template-columns: 1fr; } }
.eu-home-card { position: relative; border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow); padding: 22px 24px 20px 32px; transition: transform .16s ease, box-shadow .16s ease; }
.eu-home-card:hover { transform: translateY(-2px); box-shadow: 0 2px 0 rgba(33,29,22,.2), 0 18px 36px rgba(33,29,22,.16); }
.eu-home-card .ehc-spine { position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: linear-gradient(180deg, #003399 0 68%, #e6b325 68% 100%); border-right: 1.5px solid var(--line); }
.eu-home-card .ehc-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.eu-home-card .ehc-no { font-family: var(--f-stamp); font-weight: 700; letter-spacing: .14em; color: #003399; font-size: 13px; }
.eu-home-card .ehc-status { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; font-size: 11px; border: 2px solid #003399; color: #003399; padding: 3px 9px; border-radius: 4px; }
.eu-home-card .ehc-status.convicted { color: #fff; background: var(--red); border-color: var(--red); }
.eu-home-card .ehc-status.closed { color: var(--green); border-color: var(--green); }
.eu-home-card .ehc-title { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(26px, 4.2vw, 42px); line-height: .98; margin: 10px 0 4px; }
.eu-home-card .ehc-title a { border: none; color: var(--ink); }
.eu-home-card .ehc-title a:hover { background: rgba(230,179,37,.18); }
.eu-home-card .ehc-money { border-top: 1px dashed var(--border); border-bottom: 1px dashed var(--border); padding: 12px 0; margin: 10px 0; }
.eu-home-card .ehc-money-figure { font-family: var(--f-stamp); font-weight: 700; font-size: clamp(40px, 8vw, 64px); line-height: 1; color: var(--ink); }
.eu-home-card .ehc-money-label { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; font-size: 13px; color: var(--red); margin-top: 4px; }
.eu-home-card .ehc-teaser { font-family: var(--f-display); font-size: clamp(15px, 1.9vw, 18px); line-height: 1.42; margin: 8px 0; }
.eu-home-card .ehc-john { font-family: var(--f-mono); font-size: 12px; color: var(--ink-2); font-style: italic; border-left: 3px solid var(--red); padding-left: 10px; margin: 10px 0 4px; }
.eu-home-card .ehc-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.eu-home-card .ehc-cta { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 13px; color: #fff; background: var(--ink); border: 1.5px solid var(--line); padding: 10px 16px; }
.eu-home-card .ehc-cta:hover { background: #003399; }
.eu-home-card .ehc-right { display: flex; align-items: center; gap: 10px; }

/* Audit / institutional finding: distinct from a criminal conviction */
.eu-home-card .ehc-status.audit { color: #7a4e00; border-color: #e6b325; background: rgba(230,179,37,.16); }

/* "Kind" band — instantly separates criminal conviction from an audit finding */
.eu-home-card .ehc-kind { display: inline-block; margin: 10px 0 2px; font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 11px; padding: 4px 10px; border-radius: 3px; border: 1.5px solid var(--line); }
.eu-home-card .ehc-kind.convicted { color: #fff; background: var(--red); border-color: var(--red); }
.eu-home-card .ehc-kind.audit { color: #7a4e00; background: rgba(230,179,37,.2); border-color: #e6b325; }
.eu-home-card .ehc-kind.ongoing { color: #003399; background: rgba(0,51,153,.08); border-color: #003399; }
.eu-home-card .ehc-kind.closed { color: var(--green); background: rgba(30,110,60,.08); border-color: var(--green); }

/* "What happened?" prompt above the citizen summary */
.eu-home-card .ehc-what { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; font-size: 11px; color: var(--ink-2); margin: 12px 0 2px; }

/* Section rhythm labels */
.eu-featured-lead, .eu-more-lead { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .16em; font-weight: 700; font-size: 12px; color: #003399; margin: 6px 0 12px; padding-bottom: 6px; border-bottom: 2px solid rgba(0,51,153,.25); }
.eu-more-lead { margin-top: 30px; color: var(--ink-2); border-bottom-color: var(--border); }

/* Two large FEATURED files up top */
.eu-featured-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.eu-home-card--featured { padding: 26px 28px 22px 36px; }
.eu-home-card--featured .ehc-title { font-size: clamp(30px, 4.8vw, 48px); }
.eu-home-card--featured .ehc-money-figure { font-size: clamp(46px, 8.5vw, 72px); }

/* Substantial dossier cards below (0003, 0004, 0005) — NOT tiny nav links */
.eu-more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.eu-more-grid .ehc-title { font-size: clamp(22px, 2.6vw, 30px); }
.eu-more-grid .ehc-money-figure { font-size: clamp(30px, 4.4vw, 44px); }

@media (max-width: 980px) { .eu-more-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 820px) {
  .eu-featured-grid { grid-template-columns: 1fr; }
  .eu-more-grid { grid-template-columns: 1fr; }
}

/* Homepage Public Records verification snapshot */
.public-records .pr-tagline { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .16em; font-weight: 700; color: var(--red); font-size: clamp(13px, 1.8vw, 16px); }
.public-records .gov-form { margin-bottom: 18px; }
.public-records .verify-alert { margin: 4px 0 20px; }
.public-records .pr-subhead { font-family: var(--f-display); text-transform: uppercase; letter-spacing: .04em; font-size: clamp(18px, 2.4vw, 24px); margin: 6px 0 12px; }
.public-records .wallet-grid { margin-bottom: 8px; }
.public-records .pr-full { display: inline-block; margin-top: 20px; }

/* Make the EU flag POP on the homepage hero: bolder stars, lighter aging */
.home-hero.eu { border-top: 5px solid #e6b325; }
.home-hero.eu .flag { background-position: 80% 45%; background-size: 128% auto; }
.home-hero.eu .flag::before {
  background:
    repeating-linear-gradient(100deg, rgba(0,0,0,.10) 0 2px, rgba(255,255,255,.05) 2px 26px, rgba(0,0,0,.07) 26px 40px),
    radial-gradient(120% 120% at 50% 0%, transparent 60%, rgba(0,0,0,.26) 100%);
}
.home-hero.eu .flag::after { opacity: .3; }
.home-hero.eu .hh-copy { background: rgba(244,236,214,.9); }

/* ===================== VERIFY / TRANSPARENCY PAGE ===================== */
.verify-hero { position: relative; margin: 18px 0 8px; padding: 34px 30px; background: var(--sheet); border: 1.5px solid var(--line); border-top: 6px solid var(--red); box-shadow: var(--shadow); }
.verify-hero .division { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .18em; font-size: 12px; color: var(--ink-2); }
.verify-hero h1 { font-family: var(--f-display); text-transform: uppercase; line-height: .95; margin: 8px 0 10px; font-size: clamp(38px, 7vw, 78px); }
.verify-hero h1 .pay { color: var(--red); }
.verify-hero .hh-lead { font-family: var(--f-display); font-size: clamp(16px, 2.1vw, 20px); max-width: 60ch; margin: 0 0 16px; }

.verify-alert { margin-top: 16px; border: 2px solid var(--red); background: rgba(179,42,42,.06); padding: 16px 18px; }
.verify-alert .va-title { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .08em; font-weight: 700; font-size: clamp(15px, 2.4vw, 19px); color: var(--red); }
.verify-alert p { margin: 6px 0 0; }

.verify-fineprint { font-family: var(--f-mono); font-size: 12px; color: var(--ink-2); margin-top: 12px; }

/* Wallet cards */
.wallet-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .wallet-grid { grid-template-columns: 1fr; } }
.wallet-card { position: relative; border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow); padding: 18px 18px 16px; }
.wallet-card .wc-role { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 14px; color: #003399; }
.wallet-card .wc-desc { font-family: var(--f-display); font-size: 14px; line-height: 1.4; color: var(--ink-2); margin: 6px 0 12px; }
.wallet-card .wc-addr { display: inline-block; font-family: var(--f-mono); font-size: 20px; font-weight: 700; color: var(--ink); border-bottom: 2px solid rgba(0,51,153,.4); }
.wallet-card .wc-addr:hover { background: rgba(230,179,37,.18); }
.wallet-card .wc-full { display: block; font-family: var(--f-mono); font-size: 11px; color: var(--ink-2); word-break: break-all; margin: 8px 0 12px; }
.wallet-card .wc-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.wallet-card .wc-copy { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; font-size: 11px; color: #fff; background: var(--ink); border: 1.5px solid var(--line); padding: 8px 12px; cursor: pointer; }
.wallet-card .wc-copy:hover { background: #003399; }
.wallet-card .wc-copy.is-copied { background: var(--green); }
.wallet-card .wc-solscan { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .08em; font-weight: 700; font-size: 11px; }

/* Why this exists */
.why-body { border-left: 4px solid #003399; padding-left: 16px; }
.why-body p { font-family: var(--f-display); font-size: clamp(15px, 2vw, 18px); margin: 0 0 8px; }
.why-nots { margin: 8px 0 0; padding-left: 20px; font-family: var(--f-mono); font-size: 13px; color: var(--ink-2); }

/* Bad Decision Register */
.register { display: grid; gap: 14px; }
.reg-entry { border: 1.5px solid var(--line); background: var(--sheet); box-shadow: var(--shadow); padding: 16px 18px; border-left: 6px solid var(--red); }
.reg-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .1em; font-size: 11px; color: var(--ink-2); }
.reg-decision { font-family: var(--f-display); text-transform: uppercase; font-size: clamp(18px, 2.8vw, 26px); line-height: 1.05; margin: 8px 0 10px; }
.reg-foot { display: flex; align-items: center; gap: 10px; }
.reg-status-label { font-family: var(--f-stamp); text-transform: uppercase; letter-spacing: .1em; font-size: 11px; color: var(--ink-2); }