/* ==========================================================================
   Krignal — editorial edition
   No decorative chrome. Paper, ink, hairlines, and one accent used sparingly.
   Hierarchy is carried by scale and space, not by boxes and shadows.
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */
.theme-ed {
  --paper-0:  #faf9f6;    /* the page                        */
  --paper-1:  #f2f0ea;    /* a shade back, for banding       */
  --paper-2:  #eae7df;
  --ink-0:    #111110;    /* headlines                       */
  --ink-1:    #3a3935;    /* body                            */
  --ink-2:    #6b6962;    /* labels, captions                */
  --rule:     #ddd9d0;    /* hairline                        */
  --rule-2:   #c9c4b8;
  --accent:   #b07d24;    /* Krignal gold, darkened for AA   */
  --accent-2: #8a6014;
  --dark:     #14140f;    /* the one dark passage            */

  /* remap what main.css builds on */
  --canvas: var(--paper-0); --canvas-2: var(--paper-1);
  --paper: var(--paper-0); --paper-2: var(--paper-1); --paper-3: var(--paper-2);
  --ink: var(--ink-0); --ink-2: var(--ink-1); --ink-3: var(--ink-2);
  --ink-inv: #f4f2ec;
  --night: var(--dark); --night-2: #1c1c15;
  --line: var(--rule); --line-inv: rgba(244, 242, 236, .16);
  --gold: var(--accent); --gold-lt: #d9a445; --gold-dk: var(--accent);
  --sky-deep: var(--paper-0);

  --serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans:  "Inter Tight", "Inter", -apple-system, "Segoe UI", sans-serif;

  /* nothing is rounded and nothing floats */
  --r-sm: 0; --r: 0; --r-lg: 0;
  --shadow-s: none; --shadow: none; --shadow-l: none;
}

.theme-ed body {
  background: var(--paper-0); color: var(--ink-1);
  font-family: var(--sans);
  font-size: 17px; line-height: 1.55;
  font-feature-settings: "kern" 1, "liga" 1, "cv11" 1;
  -webkit-font-smoothing: antialiased;
}
.theme-ed .h-sec,
.theme-ed .h-display,
.theme-ed .h-card,
.theme-ed .hero__word { font-family: var(--serif); font-weight: 400; letter-spacing: -.012em; }
.theme-ed .h-sec {
  font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.03; color: var(--ink-0);
}
.theme-ed .h-card { font-size: clamp(1.15rem, 1.8vw, 1.45rem); line-height: 1.2; color: var(--ink-0); }
.theme-ed .lede { font-size: clamp(1.05rem, 1.5vw, 1.24rem); line-height: 1.55; color: var(--ink-1); }

/* Labels are small, spaced and quiet — they orient, they don't shout. */
.theme-ed .eyebrow,
.theme-ed .toc__k,
.theme-ed .map__h,
.theme-ed .tagbox__k,
.theme-ed .seg__idx,
.theme-ed .panel__cap,
.theme-ed .mini__k,
.theme-ed .qcard__role,
.theme-ed .ecard__tag,
.theme-ed .ftr__k {
  font-family: var(--sans); font-size: .66rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2);
}
.theme-ed .eyebrow::before { width: 20px; background: var(--accent); }

/* ---------- 2. Structure ------------------------------------------------- */
.theme-ed .section {
  padding-block: clamp(72px, 9vw, 150px);
  border-top: 1px solid var(--rule);
  position: relative;
}
.theme-ed .problem { border-top: none; }

/* A numeral pinned to each section: the cheapest wayfinding there is. */
.secnum {
  position: absolute; top: 0; left: 0; right: 0;
  max-width: var(--wrap); margin-inline: auto; padding-inline: var(--pad);
  font-family: var(--sans); font-size: .66rem; font-weight: 600;
  letter-spacing: .18em; color: var(--accent);
  font-variant-numeric: tabular-nums;
  transform: translateY(-.62em);
  pointer-events: none;
}
.secnum::before {
  content: ""; display: inline-block; width: 7px; height: 7px;
  background: var(--paper-0); border: 1px solid var(--accent);
  margin-right: 9px; transform: translateY(-1px);
}
@media (min-width: 1100px) {
  .secnum { padding-inline: 0; left: max(var(--pad), calc(50vw - var(--wrap) / 2 - 74px)); right: auto; max-width: none; }
}

/* ---------- 3. Header ---------------------------------------------------- */
.theme-ed .hdr { border-bottom: 1px solid transparent; }
.theme-ed .hdr.is-stuck {
  background: rgba(250, 249, 246, .92);
  backdrop-filter: saturate(120%) blur(10px);
  -webkit-backdrop-filter: saturate(120%) blur(10px);
  border-bottom-color: var(--rule); box-shadow: none;
}
.theme-ed .hdr:not(.is-stuck),
.theme-ed .hdr:not(.is-stuck) .logo__word { color: var(--ink-0); }
.theme-ed .hdr:not(.is-stuck) .nav a,
.theme-ed .hdr:not(.is-stuck) .hdr__login { color: var(--ink-1); }
.theme-ed .hdr:not(.is-stuck) .nav a:hover { color: var(--accent); }
.theme-ed .hdr:not(.is-stuck) .burger { border-color: var(--rule-2); }
.theme-ed .hdr:not(.is-stuck) .burger span,
.theme-ed .hdr:not(.is-stuck) .burger span::before,
.theme-ed .hdr:not(.is-stuck) .burger span::after { background: var(--ink-0); }
.theme-ed .logo__word { font-family: var(--sans); font-weight: 600; letter-spacing: .26em; font-size: .92rem; }
.theme-ed .nav a { font-size: .74rem; font-weight: 500; letter-spacing: .1em; }
.theme-ed .nav a::after { background: var(--accent); }
.theme-ed .mnav { background: var(--paper-0); border-bottom-color: var(--rule); }
.theme-ed .mnav a { color: var(--ink-0); border-bottom-color: var(--rule); }
.theme-ed .verswitch { border-color: var(--rule-2); color: var(--ink-1); border-radius: 0; }
.theme-ed .verswitch:hover { border-color: var(--accent); color: var(--accent); }

/* Reading progress — a hairline, nothing more. */
.edprog {
  position: fixed; top: 0; left: 0; height: 2px; width: 0;
  background: var(--accent); z-index: 300; pointer-events: none;
}

/* ---------- 4. Hero: type carries it ------------------------------------- */
.theme-ed .hero {
  background: var(--paper-0); color: var(--ink-0);
  min-height: auto; padding-top: clamp(104px, 11vw, 152px);
  padding-bottom: clamp(48px, 5.5vw, 80px);
  display: block; overflow: visible;
}
.theme-ed .hero__in { text-align: left; max-width: none; }
.theme-ed .hero__in > *, .theme-ed .hero__word, .theme-ed .hero__tag { max-width: none; }
.hero__rule { display: block; }

.theme-ed .hero__badge {
  background: none; border: 0; border-left: 2px solid var(--accent);
  border-radius: 0; padding: 2px 0 2px 12px; color: var(--ink-2);
  font-size: .66rem; letter-spacing: .18em; backdrop-filter: none;
}
.theme-ed .hero__badge .dot { display: none; }

.theme-ed .rotator {
  place-items: start; margin-top: clamp(24px, 3vw, 40px);
  /* NOT a ch value: .rotator inherits 17px, so 20ch would be ~170px and the
     display type would wrap into six lines. Measure this one in px. */
  max-width: min(900px, 100%);
  min-height: clamp(104px, 12vw, 178px);
}
.theme-ed .rot { max-width: none; }
.theme-ed .rot__line {
  font-family: var(--serif); font-size: clamp(2rem, 4.7vw, 3.8rem);
  line-height: 1.04; letter-spacing: -.02em; color: var(--ink-0);
}
.theme-ed .rot__line em { font-style: italic; color: var(--accent); }
.theme-ed .rot__sub { font-size: .95rem; color: var(--ink-2); margin-top: 16px; letter-spacing: 0; }
.theme-ed .dots { justify-content: flex-start; margin-top: 10px; }
.theme-ed .dots button { height: 2px; background: var(--rule-2); }
.theme-ed .dots button[aria-current="true"] { background: var(--accent); }

/* The wordmark sits on a rule, like a masthead. */
.theme-ed .hero__word {
  margin-top: clamp(30px, 3.6vw, 52px);
  padding-top: 20px; border-top: 1px solid var(--rule);
  font-size: clamp(3.2rem, 11.5vw, 8.6rem); line-height: .9;
  letter-spacing: -.03em; color: var(--ink-0); text-shadow: none;
}
.theme-ed .hero__tag {
  margin-top: 14px; font-size: clamp(1rem, 1.7vw, 1.3rem);
  color: var(--ink-1); max-width: 44ch;
}
.theme-ed .hero__tag em { font-family: var(--serif); font-style: italic; color: var(--accent); }

/* Cyclers become a two-column spec line, not floating cards. */
.theme-ed .cyclers {
  margin: clamp(28px, 3vw, 40px) 0 0; max-width: 640px;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  gap: 0;
}
.theme-ed .cyc {
  background: none; border: 0; backdrop-filter: none; border-radius: 0;
  padding: 18px 0; box-shadow: none;
}
.theme-ed .cyc + .cyc { border-left: 1px solid var(--rule); padding-left: 26px; }
.theme-ed .cyc__k { color: var(--ink-2); }
.theme-ed .cyc__k svg { color: var(--accent); }
.theme-ed .cyc__v { font-family: var(--serif); font-size: clamp(1.3rem, 2.2vw, 1.7rem); color: var(--ink-0); }

.theme-ed .hero__actions { align-items: flex-start; margin-top: 32px; }
.theme-ed .hero__actions .row { justify-content: flex-start; }
.theme-ed .hero__note { color: var(--ink-2); }
.theme-ed .hero__note svg { color: var(--accent); }

/* ---------- 5. Buttons: rectangles with intent --------------------------- */
.theme-ed .btn {
  border-radius: 0; font-family: var(--sans); font-size: .76rem;
  font-weight: 600; letter-spacing: .1em; padding: 16px 28px;
}
.theme-ed .btn:hover { transform: none; }
.theme-ed .btn--gold {
  background: var(--ink-0); color: var(--paper-0); box-shadow: none; border-color: var(--ink-0);
}
.theme-ed .btn--gold:hover { background: var(--accent); border-color: var(--accent); box-shadow: none; }
.theme-ed .btn--ghost,
.theme-ed .hero .btn--ghost {
  background: none; border-color: var(--rule-2); color: var(--ink-0); backdrop-filter: none;
}
.theme-ed .btn--ghost:hover,
.theme-ed .hero .btn--ghost:hover { border-color: var(--ink-0); background: none; }
.theme-ed .btn--ghost-inv { border-color: rgba(244, 242, 236, .3); border-radius: 0; }
.theme-ed .btn--ghost-inv:hover { border-color: var(--paper-0); background: none; }
.theme-ed .skip, .theme-ed .btn--ink { background: var(--ink-0); color: var(--paper-0); }
.theme-ed .tlink { color: var(--ink-0); border-bottom-color: var(--ink-0); font-size: .74rem; }
.theme-ed .tlink:hover { color: var(--accent); border-bottom-color: var(--accent); }

/* ---------- 6. Contents -------------------------------------------------- */
.toc { border-top: 1px solid var(--ink-0); padding-block: clamp(28px, 4vw, 46px) clamp(40px, 5vw, 70px); }
.toc__k { margin-bottom: 18px; }
.toc__list { counter-reset: none; }
.toc__list li + li { border-top: 1px solid var(--rule); }
.toc__list a {
  display: grid; align-items: baseline; gap: 0 clamp(14px, 3vw, 34px);
  grid-template-columns: 3.2rem minmax(0, 15ch) minmax(0, 1fr) auto;
  padding: 17px 0;
  transition: color .2s;
}
.toc__n { font-size: .74rem; font-weight: 600; color: var(--accent); font-variant-numeric: tabular-nums; }
.toc__t { font-family: var(--serif); font-size: clamp(1.15rem, 2vw, 1.5rem); color: var(--ink-0); }
.toc__d { font-size: .9rem; color: var(--ink-2); }
.toc__list svg { width: 17px; height: 17px; color: var(--rule-2); transition: transform .3s var(--ease), color .3s; }
.toc__list a:hover .toc__t { color: var(--accent); }
.toc__list a:hover svg { color: var(--accent); transform: translateX(5px); }
@media (max-width: 800px) {
  .toc__list a { grid-template-columns: 2.6rem 1fr auto; }
  .toc__d { display: none; }
}

/* ---------- 7. The problem: pull-quotes, not cards ----------------------- */
.theme-ed .problem__head { text-align: left; margin-inline: 0; }
.theme-ed .problem__head .h-sec { max-width: 18ch; margin-inline: 0; }
.theme-ed .problem__head .lede { margin: 20px 0 0 !important; text-align: left !important; }
.theme-ed .marquee { margin-top: clamp(44px, 6vw, 80px); gap: 0; }
.theme-ed .marquee__mask { -webkit-mask-image: none; mask-image: none; overflow: visible; }
.theme-ed .marquee__row { animation: none; width: auto; display: grid; gap: 0; }
.theme-ed .marquee__row--b { border-top: 1px solid var(--rule); }
@media (min-width: 760px) {
  .theme-ed .marquee__row { grid-template-columns: repeat(3, 1fr); }
  .theme-ed .qcard:nth-child(3n+2) { border-inline: 1px solid var(--rule); }
}
.theme-ed .qcard {
  width: auto; background: none; border: 0; border-top: 1px solid var(--rule);
  border-radius: 0; padding: 26px clamp(18px, 2.4vw, 34px) 30px; box-shadow: none;
}
.theme-ed .qcard:hover { transform: none; box-shadow: none; border-color: var(--rule); }
.theme-ed .qcard__av {
  width: auto; height: auto; border-radius: 0; background: none !important;
  color: var(--accent); font-family: var(--sans); font-size: .66rem; font-weight: 600;
  letter-spacing: .16em;
}
.theme-ed .qcard__av::after { content: " /"; color: var(--rule-2); }
.theme-ed .qcard__q {
  font-family: var(--serif); font-size: clamp(1.08rem, 1.7vw, 1.3rem);
  line-height: 1.34; color: var(--ink-0); margin-top: 14px;
}
/* main.js duplicates the rows for the marquee; a static grid must not show them */
.theme-ed .marquee__row > [aria-hidden="true"] { display: none; }

/* ---------- 8. Benefits: a numbered list -------------------------------- */
.theme-ed .benefits { background: var(--paper-1); }
.theme-ed .bgrid {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0; margin-top: clamp(40px, 5vw, 70px);
  border-top: 1px solid var(--rule-2);
}
.theme-ed .bcard {
  background: none; border: 0; border-bottom: 1px solid var(--rule);
  border-radius: 0; padding: 30px clamp(20px, 2.4vw, 32px) 38px; box-shadow: none;
  counter-increment: bn;
}
.theme-ed .bcard + .bcard { border-left: 1px solid var(--rule); }
.theme-ed .bcard:hover { transform: none; box-shadow: none; }
.theme-ed .bcard::after { display: none; }
.theme-ed .bcard__ico {
  width: auto; height: auto; background: none; border: 0; border-radius: 0;
  color: var(--accent);
}
.theme-ed .bcard__ico svg { width: 20px; height: 20px; }
.theme-ed .bcard h3 { margin-top: 16px; }
.theme-ed .bcard p { color: var(--ink-1); font-size: .96rem; }

/* ---------- 9. How it works ---------------------------------------------- */
.theme-ed .step { margin-top: clamp(52px, 7vw, 104px); }
.theme-ed .step__num {
  font-family: var(--sans); font-size: .74rem; font-weight: 600; letter-spacing: .18em;
  color: var(--accent); opacity: 1; font-variant-numeric: tabular-nums;
  padding-bottom: 14px; border-bottom: 1px solid var(--rule); display: block;
}
.theme-ed .step__txt h3 { font-family: var(--serif); margin-top: 20px; }
.theme-ed .panel {
  background: var(--paper-1); border: 1px solid var(--rule); border-radius: 0; box-shadow: none;
}
.theme-ed .panel::before { display: none; }
.theme-ed .chip, .theme-ed .mini, .theme-ed .pill, .theme-ed .tag {
  background: var(--paper-0); border-color: var(--rule); border-radius: 0; box-shadow: none;
}
.theme-ed .chip { border-radius: 0; }
.theme-ed .chip:hover, .theme-ed .tag:hover { transform: none; border-color: var(--accent); }
.theme-ed .chip__d { background: var(--accent); border-radius: 0; width: 5px; height: 5px; }
.theme-ed .chip__tag { background: var(--paper-2); color: var(--ink-2); border-radius: 0; }
.theme-ed .you {
  background: var(--ink-0); color: var(--paper-0); border: 0; border-radius: 50%;
  box-shadow: none; font-family: var(--sans); font-weight: 600; font-size: .7rem;
}
.theme-ed .you::after { display: none; }
.theme-ed .mini__badge { background: var(--paper-2); color: var(--ink-2); border-radius: 0; }
.theme-ed .mini__badge .d { background: var(--accent); }
.theme-ed .mini__body { font-family: var(--serif); color: var(--ink-0); }
.theme-ed .caret { background: var(--accent); }
.theme-ed .step-a { background: var(--accent); color: var(--paper-0); border-radius: 0; }
.theme-ed .pill--found { background: var(--paper-2); border-color: var(--rule-2); }
.theme-ed .radar__dial { border-color: var(--rule-2); background: var(--paper-0); }
.theme-ed .radar__dial::before, .theme-ed .radar__dial::after { border-color: var(--rule); }
.theme-ed .radar__sweep { background: conic-gradient(from 0deg, rgba(176, 125, 36, .28), rgba(176, 125, 36, 0) 42%); }
.theme-ed .radar__pip { background: var(--accent); box-shadow: none; }
.theme-ed .mark { color: var(--ink-0); }
.theme-ed .mark::after { background: rgba(176, 125, 36, .22); height: .26em; border-radius: 0; }

/* ---------- 10. Privacy: the one dark passage ---------------------------- */
.theme-ed .privacy {
  background: var(--dark); border-radius: 0; border: 0;
  padding: clamp(44px, 6vw, 86px) clamp(26px, 4vw, 62px);
}
.theme-ed .privacy::before, .theme-ed .privacy::after { display: none; }
.theme-ed .privacy .h-sec { color: #f6f4ee; }
.theme-ed .privacy p { color: rgba(246, 244, 238, .72); }
.theme-ed .pchip {
  background: none; border: 0; border-top: 1px solid rgba(246, 244, 238, .2);
  border-radius: 0; padding: 16px 0 0; color: #f6f4ee; font-size: .92rem;
}
.theme-ed .pchip svg { color: var(--gold-lt); }
.theme-ed .eyebrow--inv { color: rgba(246, 244, 238, .55); }

/* ---------- 11. Segments -------------------------------------------------- */
.theme-ed .seg--ind { background: var(--paper-0); }
.theme-ed .seg--org { background: var(--paper-1); color: var(--ink-1); }
.theme-ed .seg--org .h-sec { color: var(--ink-0); }
.theme-ed .seg--org .lede { color: var(--ink-1); }
.theme-ed .seg--org .seg__list li { color: var(--ink-1); }
.theme-ed .seg--org .seg__list svg,
.theme-ed .seg__list svg { color: var(--accent); }
.theme-ed .seg--org .seg__meta { color: var(--ink-2); border-color: var(--rule); }
.theme-ed .seg--org .eyebrow--inv { color: var(--ink-2); }
.theme-ed .seg--org .tagbox,
.theme-ed .tagbox {
  background: none; border: 0; border-top: 1px solid var(--ink-0);
  border-radius: 0; padding: 26px 0 0; backdrop-filter: none;
}
.theme-ed .seg--org .tagbox__k, .theme-ed .tagbox__k { color: var(--ink-2); }
.theme-ed .seg--org .tagrow__h, .theme-ed .tagrow__h { color: var(--ink-0); }
.theme-ed .seg--org .tagrow__h svg, .theme-ed .tagrow__h svg { color: var(--accent); }
.theme-ed .seg--org .tag { background: var(--paper-0); border-color: var(--rule); color: var(--ink-1); }
.theme-ed .tagbox__foot, .theme-ed .seg--org .tagbox__foot { color: var(--ink-2); border-color: var(--rule); }
.theme-ed .seg__idx { color: var(--accent); }

/* ---------- 12. TV -------------------------------------------------------- */
.theme-ed .tv { background: var(--dark); }
.theme-ed .tv__word { font-family: var(--serif); color: #f6f4ee; text-transform: none; }
.theme-ed .tv__sub { color: rgba(246, 244, 238, .66); }
.theme-ed .tv__mission h3 { font-family: var(--serif); color: #f6f4ee; text-transform: none; }
.theme-ed .tv__mission h3 span { color: var(--gold-lt); }
.theme-ed .tv__mission p { color: rgba(246, 244, 238, .66); }
.theme-ed .tvframe { border: 0; border-radius: 0; background: #0c0c08; }
.theme-ed .tvframe img { filter: grayscale(1) contrast(1.06); }
.theme-ed .tvframe__scan { display: none; }
.theme-ed .tlink--inv { color: rgba(246, 244, 238, .8); border-bottom-color: rgba(246, 244, 238, .3); }
.theme-ed .tlink--inv:hover { color: var(--gold-lt); border-bottom-color: var(--gold-lt); }

/* ---------- 13. Events: let the photographs do the work ----------------- */
.theme-ed .events { background: var(--paper-0); }
.theme-ed .events__word { font-family: var(--serif); text-transform: none; color: var(--ink-0); }
.theme-ed .events__sub { font-family: var(--serif); color: var(--ink-1); }
.theme-ed .events__sub span { color: var(--accent); }
.theme-ed .ecards { gap: clamp(18px, 2.4vw, 30px); }
.theme-ed .ecard {
  background: none; border: 0; border-radius: 0; box-shadow: none;
}
.theme-ed .ecard:hover { transform: none; box-shadow: none; }
.theme-ed .ecard__art { aspect-ratio: 4 / 5; }
.theme-ed .ecard__art img { filter: grayscale(1) contrast(1.05); transition: filter .6s var(--ease), transform .8s var(--ease); }
.theme-ed .ecard:hover .ecard__art img { filter: grayscale(0) contrast(1); transform: scale(1.03); }
.theme-ed .ecard__tag {
  position: static; background: none; backdrop-filter: none; border-radius: 0;
  padding: 0; color: var(--accent); display: block; margin-top: 16px;
}
.theme-ed .ecard__body { padding: 4px 0 0; }
.theme-ed .ecard__body h3 { font-family: var(--serif); text-transform: none; margin-top: 6px; color: var(--ink-0); }
.theme-ed .ecard__body p { color: var(--ink-1); font-size: .93rem; }

/* ---------- 14. FAQ ------------------------------------------------------- */
.theme-ed .faq { background: var(--paper-0); }
.theme-ed .faq__list { border-top: 1px solid var(--ink-0); }
.theme-ed .qa { border-bottom: 1px solid var(--rule); }
.theme-ed .qa summary {
  font-family: var(--serif); font-size: clamp(1.1rem, 1.9vw, 1.4rem);
  color: var(--ink-0); padding: 26px 46px 26px 0;
}
.theme-ed .qa summary:hover { color: var(--accent); }
.theme-ed .qa summary::after { border-color: var(--rule-2); width: 10px; height: 10px; }
.theme-ed .qa[open] summary::after { border-color: var(--accent); }
.theme-ed .qa__a p { color: var(--ink-1); font-size: 1rem; max-width: 68ch; }

/* ---------- 15. Closer + footer ------------------------------------------ */
.theme-ed .closer {
  background: var(--paper-0); color: var(--ink-0); min-height: auto;
  padding-block: clamp(80px, 10vw, 150px); border-top: 1px solid var(--ink-0);
  text-align: left; display: block;
}
.theme-ed .closer .wrap { position: static; }
.theme-ed .closer .h-sec {
  color: var(--ink-0); max-width: 16ch; margin-inline: 0;
  font-size: clamp(2.4rem, 6.4vw, 5rem); text-shadow: none;
}
.theme-ed .closer .h-sec span { color: var(--accent); font-style: italic; }
.theme-ed .closer p { margin: 22px 0 0; color: var(--ink-1); text-shadow: none; max-width: 46ch; }
.theme-ed .closer__actions { justify-content: flex-start; margin-top: 36px; }
.theme-ed .closer .eyebrow--inv { color: var(--ink-2); }

.theme-ed .ftr { background: var(--dark); padding-block: clamp(56px, 7vw, 90px) 30px; }
.theme-ed .ftr__brand p { color: rgba(246, 244, 238, .6); }
.theme-ed .ftr__col a { color: rgba(246, 244, 238, .74); font-size: .92rem; }
.theme-ed .ftr__col a:hover { color: var(--gold-lt); }
.theme-ed .ftr__bot { border-color: rgba(246, 244, 238, .16); color: rgba(246, 244, 238, .45); }

.theme-ed .totop {
  background: var(--ink-0); border: 0; border-radius: 0; backdrop-filter: none;
}
.theme-ed .totop svg { color: var(--paper-0); }
.theme-ed .totop:hover { background: var(--accent); }
.theme-ed :focus-visible { outline-color: var(--accent); }

/* ---------- 16. Small screens -------------------------------------------- */
@media (max-width: 620px) {
  /* Stacked, the divider has to become a top rule — a left border reads as
     an accidental indent. */
  .theme-ed .cyclers { max-width: none; gap: 0; }
  .theme-ed .cyc + .cyc { border-left: 0; border-top: 1px solid var(--rule); padding-left: 0; }
  .theme-ed .qcard { padding-inline: 0; }
  .theme-ed .bcard { padding-inline: 0; }
  .theme-ed .bcard + .bcard { border-left: 0; }
}
