/* ==========================================================================
   Allsidia Avfallsteknik — public platform
   Material, working space and machinery share the composition.
   Text and photography share a centered frame, with room around every edge.
   One existing display font, native layout and progressive enhancement.
   ========================================================================== */

/* One variable font, latin subset, 34 kB, display use only.
   The site previously shipped no webfont at all. On review the system stack made
   every heading read as "well-set document" rather than as a company with a
   voice. This is the smallest change that fixes that: one file covering 400–700,
   preloaded, and used only where character actually shows. Body copy stays on
   the system stack, which is faster to read and costs nothing. */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/assets/fonts/Archivo-Variable.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

:root {
  /* Neutrals carry a slight warmth. Pure cool grey reads as software; a touch
     of warmth reads as paper and daylight, which is where this work happens.
     It is deliberately small — enough to stop feeling clinical, not enough to
     become the beige B2B palette the earlier pass was rejected for. */
  --canvas: #f3f1e9;
  --surface: #e8e6dd;
  --surface-2: #ebe9e4;
  --ink: #121110;
  --ink-2: #45433f;
  --ink-3: #65615b;
  --line: #e4e2dd;
  --line-2: #b8b5ae;
  --accent: #c53b1b;
  --accent-ink: #a12c12;
  --accent-soft: #fdf1ec;
  /* The signal colour is too dark to read on the near-black surfaces. This is
     the same hue lifted until it passes on --dark, used only there. */
  --accent-on-dark: #ff8a5c;
  --dark: #181614;
  --on-dark: #f0eeea;
  --on-dark-2: #a8a49c;

  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --display: "Archivo", var(--sans);
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono", Consolas, "Liberation Mono", monospace;

  --shell: 1200px;
  --gutter: clamp(20px, 4vw, 64px);
  --rule: 1px solid var(--line);
  --rule-strong: 1px solid var(--line-2);
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 5rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.62;
  font-synthesis-weight: none;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 1024px) { body { font-size: 1.125rem; } }

img { max-width: 100%; height: auto; display: block; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0 0 1em; padding-left: 1.15em; }
li { margin-bottom: .35em; }
strong { font-weight: 650; }

a { color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 1px; }

.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.ap-skip {
  position: absolute; left: 12px; top: 12px; z-index: 100;
  transform: translateY(calc(-100% - 12px));
  background: var(--ink); color: #fff; padding: .7rem 1rem;
  text-decoration: none; font-size: .875rem; font-weight: 600;
  transition: transform .12s ease;
}
.ap-skip:focus { transform: none; }
@media (prefers-reduced-motion: reduce) { .ap-skip { transition: none; } }

/* ---------------------------------------------------------------- typography */

.ap-display {
  font-family: var(--display);
  font-size: clamp(2.55rem, 1.15rem + 6.1vw, 6rem);
  line-height: .97;
  letter-spacing: -.038em;
  font-weight: 700;
  margin: 0;
  text-wrap: balance;
  max-width: 19ch;
}
.ap-display em { color: var(--accent); font-style: normal; }
.ap-display--page {
  font-size: clamp(2.1rem, 1.1rem + 4vw, 4.5rem);
  line-height: 1;
  letter-spacing: -.032em;
  max-width: 24ch;
}
.ap-h2 {
  font-family: var(--display);
  font-size: clamp(1.7rem, 1.02rem + 2.5vw, 3rem);
  line-height: 1.05;
  letter-spacing: -.028em;
  font-weight: 650;
  margin: 0;
  text-wrap: balance;
  max-width: 28ch;
}
.ap-h3 {
  font-family: var(--display);
  font-size: clamp(1.15rem, 1.02rem + .55vw, 1.45rem);
  line-height: 1.22;
  letter-spacing: -.014em;
  font-weight: 650;
  margin: 0 0 .4em;
}
.ap-lead { font-size: 1.125rem; line-height: 1.55; color: var(--ink-2); max-width: 46ch; margin: 0 0 1.2em; }
.ap-lead--lg { font-size: clamp(1.1875rem, 1.02rem + .8vw, 1.5rem); line-height: 1.45; color: var(--ink-2); max-width: 36ch; margin-bottom: 1.4em; }

/* Labels are set in the text face, not in mono. Monospace everywhere is what
   made the page read as an instrument panel rather than as advice. Mono is now
   reserved for things that are genuinely technical: step numbers, image
   captions and small status values. */
.ap-eyebrow, .ap-tag {
  font-family: var(--sans);
  font-size: .8125rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ink-3);
  margin: 0;
}
.ap-num, .ap-status__tag {
  font-family: var(--mono);
  font-size: .6875rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 500;
  margin: 0;
}
.ap-eyebrow { margin-bottom: .9rem; }
.ap-tag { margin-bottom: .5rem; }
.ap-num { color: var(--ink-3); letter-spacing: .2em; }
.ap-note { font-size: .875rem; line-height: 1.55; color: var(--ink-3); max-width: 54ch; }
.ap-review { font-size: .8125rem; line-height: 1.55; color: var(--ink-3); max-width: 70ch; font-family: var(--mono); }

.ap-link {
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;
  border-bottom: 1px solid var(--line-2);
  padding-bottom: .1em;
  display: inline-block;
}
.ap-link:hover { border-color: var(--accent); color: var(--accent-ink); }

/* -------------------------------------------------------------------- layout */

/* A section is a full-bleed region that owns its background, its vertical
   weight and its measure. Direct children become its container; a child marked
   `ap-bleed` runs to the viewport edge instead.

   Two independent variables per section — `--measure` and `--section-space` — are
   what stop a long page reading as consecutive identical bands. */
.ap-section {
  --measure: var(--shell);
  --section-space: clamp(2.75rem, 6vw, 5.5rem);
  border-top: var(--rule);
  padding-block: var(--section-space);
}
.ap-section--tall { --section-space: clamp(3.5rem, 8vw, 7.5rem); }
.ap-section--tight { --section-space: clamp(2rem, 4vw, 3.25rem); }

.ap-section > * {
  max-width: calc(var(--measure) + 2 * var(--gutter));
}
/* Section alignment must survive the components' list and figure resets. */
section.ap-section > * {
  margin-inline: auto;
  padding-inline: var(--gutter);
}
section.ap-section > .ap-link {
  margin-inline: max(var(--gutter), calc((100% - var(--measure)) / 2)) auto;
  padding-inline: 0;
}
.ap-section > .ap-bleed { max-width: none; margin-inline: 0; padding-inline: 0; }
/* Narrower blocks align to the container's left edge, so they line up with the
   section header above them instead of floating to the centre. */
.ap-section > .ap-prose,
.ap-section > .ap-org,
.ap-section > .ap-example,
.ap-section > .ap-close { margin-inline: max(0px, calc((100% - var(--measure) - 2 * var(--gutter)) / 2)) auto; }
.ap-section--surface { background: var(--surface); }
/* A rule should mark a boundary that needs marking. Where a background change
   already announces the new region, the rule is decoration — and a page where
   every boundary carries the same hairline reads as stacked bands rather than
   as a composed page. */
.ap-section--surface, .ap-section--dark { border-top: 0; }
.ap-section--dark { background: var(--dark); color: var(--on-dark); }
.ap-section--dark .ap-h2, .ap-section--dark .ap-h3 { color: var(--on-dark); }
.ap-section--dark .ap-lead, .ap-section--dark p { color: var(--on-dark-2); }
.ap-section--dark .ap-eyebrow, .ap-section--dark .ap-num, .ap-section--dark .ap-tag { color: var(--on-dark-2); }
.ap-section--dark .ap-points li { border-color: rgba(255,255,255,.16); color: var(--on-dark-2); }
.ap-section--dark .ap-link { color: var(--on-dark); border-color: rgba(255,255,255,.3); }
.ap-section--opening { border-top: 0; }
.ap-section--rule { --section-space: clamp(1.75rem, 3vw, 2.5rem); }

.ap-shell { max-width: calc(var(--shell) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }

/* -------------------------------------------------------------------- header */

.ap-header {
  position: relative; z-index: 50;
  background: var(--canvas);
  border-bottom: var(--rule);
}
.ap-header__inner { display: flex; align-items: center; gap: clamp(.75rem, 2vw, 2.5rem); min-height: 86px; }
.ap-brand__name { font-size: 2rem; letter-spacing: -.055em; }
.ap-brand { font-family: var(--display); display: flex; align-items: baseline; gap: .55rem; text-decoration: none; font-weight: 700; letter-spacing: -.025em; font-size: 1.0625rem; }
.ap-brand__suffix { font-family: var(--mono); font-size: .625rem; letter-spacing: .17em; text-transform: uppercase; color: var(--ink-3); font-weight: 400; }

.ap-nav { margin-left: auto; }
.ap-nav ul { display: flex; gap: clamp(.6rem, 1.7vw, 1.9rem); list-style: none; margin: 0; padding: 0; }
.ap-nav li { margin: 0; }
.ap-nav a {
  display: inline-block; padding: .7rem 0; font-size: .875rem; font-weight: 550;
  color: var(--ink-2); text-decoration: none; border-bottom: 1px solid transparent;
}
.ap-nav a:hover, .ap-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }

/* A compact action stays easy to find beside the quieter navigation. */
.ap-header__cta {
  font-size: .8125rem; font-weight: 600; text-decoration: none;
  color: #fff; background: var(--accent); padding: .75rem 1rem; white-space: nowrap;
}
.ap-header__cta:hover { background: var(--accent-ink); }

.ap-navtoggle {
  display: none; margin-left: auto; align-items: center; gap: .5rem;
  background: none; border: var(--rule-strong); padding: .75rem .7rem;
  font: inherit; font-size: .8125rem; font-weight: 600; color: var(--ink); cursor: pointer;
}
.ap-navtoggle__bars { width: 14px; height: 8px; border-top: 2px solid currentColor; border-bottom: 2px solid currentColor; }
/* Reserve the wider of "Meny" and "Stäng" so the button does not jump when the
   panel opens. */
.ap-navtoggle [data-nav-label] { min-width: 3.5rem; text-align: left; }

@media (max-width: 1199px) {
  .ap-header__inner { flex-wrap: wrap; }
  .ap-navtoggle { display: inline-flex; }
  .ap-navtoggle[hidden] { display: none; }
  .ap-header__inner:has(.ap-navtoggle[hidden]) { flex-wrap: wrap; padding-block: .75rem; }
  .ap-header__inner:has(.ap-navtoggle[hidden]) .ap-nav { display: block; position: static; flex-basis: 100%; padding-inline: 0; }
  .ap-header__cta { display: none; }
  /* The open state lives on the document so the page can respond to it. */
  .ap-nav {
    display: none; position: static; margin: 0; flex-basis: 100%; order: 3;
    background: var(--canvas); padding: .5rem 0 1.5rem;
  }
  .ap-nav.is-open { display: block; }
  .ap-nav ul { flex-direction: column; gap: 0; }
  .ap-nav li { border-top: var(--rule); }
  .ap-nav a { display: block; padding: .5rem 0; font-family: var(--display); font-size: clamp(1.5rem, 4vw, 2rem); letter-spacing: -.035em; }
}
@media (max-width: 600px) {
  .ap-header__inner { min-height: 76px; }
  .ap-brand { flex-direction: column; gap: 0; line-height: 1.15; }
  .ap-brand__name { font-size: 1.75rem; }
  .ap-brand__suffix { font-size: .5625rem; letter-spacing: .11em; }
}

/* ------------------------------------------------------------------- opening */

/* The opening shares the header's frame; the photograph keeps its own space. */
.ap-industrial {
  display: grid; grid-template-columns: minmax(0, 1fr);
  max-width: calc(var(--shell) + 2 * var(--gutter)); margin-inline: auto;
  padding: clamp(2rem, 4vw, 3.5rem) var(--gutter) 1.5rem;
}
.ap-industrial__title .ap-eyebrow { font-size: .6875rem; max-width: none; }
.ap-industrial .ap-display { font-size: clamp(2.75rem, 10.8vw, 6rem); max-width: none; letter-spacing: -.035em; word-spacing: .025em; line-height: 1; }
.ap-industrial__intro { margin-block: 1.7rem 1.5rem; }
.ap-industrial__intro .ap-lead { max-width: 39ch; font-size: 1rem; margin-bottom: 1.4rem; }
.ap-industrial__intro .ap-link { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--ink); border-bottom: 0; padding-block: .8rem; min-height: 3rem; }
.ap-industrial__intro .ap-link span { font-size: 1.75rem; line-height: 1; }
.ap-industrial__dispatch { display: none; }
.ap-industrial__media .ap-figure { display: block; height: auto; }
.ap-industrial__media .ap-figure picture { aspect-ratio: 1.65; min-height: 0; }
.ap-industrial__media img { object-position: 77% 52%; }
.ap-industrial__media .ap-figure__caption { padding-top: .75rem; font-size: .625rem; letter-spacing: .035em; }
.ap-section--journey { padding-block: .65rem; }
.ap-section--journey .ap-localnav > .ap-tag { display: none; }
.ap-section--journey .ap-localnav ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: 1rem; }
.ap-section--journey .ap-localnav li { border: 0; }
.ap-section--journey .ap-localnav li:nth-child(n) { border: 0; }
.ap-section--journey .ap-localnav a { font-size: .75rem; gap: .4rem; line-height: 1.4; min-height: 3rem; align-items: center; }
.ap-section--journey .ap-localnav__n { padding-top: 0; color: var(--accent-ink); }
@media (max-width: 359px) {
  .ap-page--guides .ap-opening > .ap-display { font-size: 2.25rem; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .ap-industrial { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
  .ap-industrial__title { padding-bottom: 1.5rem; }
  .ap-industrial .ap-display { font-size: clamp(3.3rem, 7.8vw, 4.5rem); }
  .ap-industrial__intro { padding-left: 0; margin-block: 0 1.5rem; align-self: end; }
  .ap-industrial__intro .ap-lead { font-size: .9375rem; }
  .ap-industrial__media { grid-column: 1 / -1; }
}
@media (min-width: 900px) {
  .ap-industrial { grid-template-columns: 20% minmax(0, 47%) minmax(0, 1fr); }
  .ap-industrial__title { grid-column: 1 / 3; padding: 0 clamp(1.5rem, 3vw, 3rem) 2.25rem 0; }
  .ap-industrial .ap-display { font-size: clamp(3rem, 5vw, 4.5rem); line-height: 1.03; }
  .ap-industrial__title .ap-eyebrow { margin-bottom: 1.5rem; }
  .ap-industrial__intro { grid-column: 3; align-self: end; margin-block: 0 2.25rem; padding-left: 0; }
  .ap-industrial__intro .ap-lead { font-size: 1rem; }
  .ap-industrial__dispatch { display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; background: var(--accent); color: white; padding: clamp(1.25rem, 2.5vw, 2rem); margin-bottom: 2.25rem; }
  .ap-industrial__dispatch .ap-industrial__statement { font: 500 clamp(1.55rem, 2.25vw, 2.1rem)/1.05 var(--display); letter-spacing: -.035em; }
  .ap-industrial__dispatch p:last-child { font: .75rem/1.6 var(--mono); }
  .ap-industrial__media { grid-column: 2 / 4; }
  .ap-industrial__media .ap-figure picture { aspect-ratio: 2.2; }
  .ap-industrial__media .ap-figure__caption { min-height: 2.25rem; }
  .ap-section--journey .ap-localnav a { font-size: .875rem; }
}

.ap-opening { display: grid; gap: clamp(1.5rem, 3vw, 2.25rem); }
@media (min-width: 900px) {
  .ap-opening {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: clamp(1rem, 2.4vw, 2rem);
  }
  .ap-opening__eyebrow, .ap-opening__lead, .ap-opening__aside, .ap-signals { grid-column: 1 / -1; }
  .ap-opening > .ap-display { grid-column: 1 / span 10; }
}

.ap-opening__eyebrow { margin-bottom: 0; }

.ap-opening__lead { max-width: 38rem; }
.ap-opening__body-text { color: var(--ink-2); max-width: 40ch; }
.ap-opening--media { gap: 1.5rem; }
.ap-opening--media > .ap-display { font-size: clamp(2.55rem, 1.5rem + 3.3vw, 4.8rem); max-width: 16ch; }
.ap-opening__media .ap-figure { --ratio: 3 / 2 !important; margin: 0; }
.ap-opening__media img { object-position: 70% center; }
.ap-opening--media .ap-btn--quiet { border-color: transparent; padding-inline: 0; text-decoration: underline; text-underline-offset: .25em; }
@media (max-width: 899px) { .ap-section--opening:has(.ap-opening--media) { --section-space: 2rem; } }
@media (min-width: 900px) {
  .ap-opening--media > .ap-opening__eyebrow { grid-column: 1 / 6; grid-row: 1; }
  .ap-opening--media > .ap-display { grid-column: 1 / 6; grid-row: 2; }
  .ap-opening--media > .ap-opening__lead { grid-column: 1 / 6; grid-row: 3; align-self: start; }
  .ap-opening--media > .ap-opening__media { grid-column: 6 / -1; grid-row: 1 / 4; }
  .ap-opening__media .ap-figure { height: 100%; grid-template-rows: 1fr auto; }
  .ap-opening__media .ap-figure picture { aspect-ratio: auto; min-height: 28rem; }
  .ap-opening--media > .ap-opening__aside { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
  .ap-opening--media > .ap-opening__aside > div { grid-template-columns: 1fr; border-top: 0; }
  .ap-opening--indexed > .ap-opening__lead { grid-column: 1 / 7; }
  .ap-opening--indexed > .ap-localnav { grid-column: 8 / -1; }
  .ap-opening--indexed .ap-localnav :is(ol, ul) { grid-template-columns: 1fr; }
}

/* Supporting detail follows the action and image in the reading order. */
.ap-opening__aside { display: grid; gap: 0; margin: clamp(1.5rem, 2.6vw, 2.25rem) 0 0; border-top: 1px solid var(--ink); }
.ap-opening--media > .ap-opening__aside { margin-top: 0; }
.ap-opening__aside > div { display: grid; gap: .1rem 1rem; padding: .75rem 0; border-top: var(--rule); }
.ap-opening__aside > div:first-child { border-top: 0; }
@media (min-width: 560px) { .ap-opening__aside > div { grid-template-columns: 7rem minmax(0, 1fr); } }
.ap-opening__aside dt { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; color: var(--ink-3); padding-top: .2rem; }
.ap-opening__aside dd { margin: 0; font-size: .9375rem; color: var(--ink-2); max-width: 38ch; }

.ap-pagehead { padding: clamp(2.5rem, 5vw, 4.5rem) var(--gutter) 0; max-width: calc(var(--shell) + 2 * var(--gutter)); margin-inline: auto; }

/* --------------------------------------------------------------- section head */

.ap-head { display: grid; align-content: start; gap: .6rem clamp(1rem, 3vw, 3rem); margin-bottom: clamp(1.75rem, 3.5vw, 3rem); }
@media (min-width: 768px) { .ap-head--numbered { grid-template-columns: 4.5rem minmax(0, 1fr); } }
.ap-head__text { max-width: 58rem; display: grid; align-content: start; gap: .8rem; }
.ap-head__text .ap-lead { margin: 0; }
.ap-head > .ap-num { padding-top: .55rem; }

.ap-signals { list-style: none; margin: 0; padding: 0; border-top: var(--rule-strong); display: grid; }
@media (min-width: 700px) { .ap-signals { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ap-signals li { padding: .95rem 1.5rem .95rem 0; margin: 0; font-size: .9375rem; color: var(--ink-2); }
@media (min-width: 700px) { .ap-signals li + li { border-left: var(--rule); padding-left: 1.5rem; } }
@media (max-width: 699px) { .ap-signals li + li { border-top: var(--rule); } }
.ap-signals strong { color: var(--ink); display: block; }

/* ------------------------------------------------------------- recognition */

/* One operational scene, three recognisable symptoms. Unequal scale carries the hierarchy. */
.ap-section--recognition { border-top: 0; }
.ap-recognition-layout { display: grid; gap: 1.75rem; }
.ap-recognition-layout .ap-head { margin-bottom: 0; }
.ap-recognition-layout .ap-head--numbered { grid-template-columns: 1fr; }
.ap-recognition-layout .ap-h2 { max-width: 14ch; font-size: clamp(2.2rem, 3.4vw, 3.5rem); letter-spacing: -.035em; }
.ap-recognition { list-style: none; margin: 0; padding: 0; }
.ap-recognition > li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 1rem; margin: 0; padding-block: 1.1rem; border-top: var(--rule-strong); }
.ap-recognition__n { font: .6875rem var(--mono); color: var(--accent-ink); padding-top: .5rem; }
.ap-recognition__copy { max-width: 46ch; }
.ap-recognition__copy .ap-h3 { margin-bottom: .35em; }
.ap-recognition p { font-size: .9375rem; line-height: 1.55; color: var(--ink-2); }
@media (min-width: 900px) {
  .ap-recognition-layout { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); column-gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
  .ap-recognition__scene { grid-column: 1; grid-row: 1 / 3; }
  .ap-recognition__scene picture { aspect-ratio: 4/5; }
  .ap-recognition__scene img { object-position: 35% center; }
  .ap-recognition-layout .ap-head, .ap-recognition { grid-column: 2; }
}

/* ---------------------------------------------------------------- full bleed */


/* One wide photograph, edge to edge. Breaks the document rhythm and gives the
   machinery room to be seen at the scale it actually occupies. The caption
   stays inside the section's measure so it still lines up with the copy. */
.ap-section > .ap-bleed.ap-feature { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.ap-feature .ap-figure__caption {
  max-width: calc(var(--measure) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
  margin-top: .75rem;
}

/* -------------------------------------------------------------- spec: questions */

.ap-questions { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--ink); }
@media (min-width: 860px) {
  .ap-questions { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 6vw, 6rem); }
}
.ap-questions li {
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .1rem .8rem;
  padding: 1.4rem 0 1.5rem; margin: 0; border-top: var(--rule);
}
.ap-questions li:first-child { border-top: 0; }
@media (min-width: 860px) { .ap-questions li:nth-child(2) { border-top: 0; } }
.ap-questions__n { font-family: var(--mono); font-size: .6875rem; letter-spacing: .18em; color: var(--ink-3); padding-top: .45rem; grid-row: span 2; }
.ap-questions__term { font-family: var(--display); font-weight: 650; font-size: 1.1875rem; letter-spacing: -.016em; }
.ap-questions__desc { font-size: .9375rem; line-height: 1.55; color: var(--ink-3); max-width: 46ch; }
.ap-section--questions { background: var(--surface); }
@media (min-width: 1000px) {
  .ap-section--questions { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 4.5rem); padding-inline: max(var(--gutter), calc((100% - var(--measure)) / 2)); }
  section.ap-section--questions > * { margin: 0; padding-inline: 0; }
  .ap-section--questions .ap-head--numbered { grid-template-columns: 1fr; }
  .ap-section--questions .ap-head__text { max-width: 30rem; }
  .ap-section--questions .ap-h2 { font-size: clamp(2.25rem, 3.4vw, 3.5rem); max-width: 14ch; }
  .ap-questions { display: block; }
  .ap-questions li { grid-template-columns: 2.5rem minmax(7rem, .55fr) minmax(0, 1fr); gap: 1rem; }
  .ap-questions li:nth-child(2) { border-top: var(--rule); }
  .ap-questions__n { grid-row: auto; }
}

/* ---------------------------------------------------------------- equipment */

.ap-section--equipment .ap-h2 { font-size: clamp(2.5rem, 4vw, 4rem); letter-spacing: -.035em; max-width: 17ch; }
.ap-equipment { display: grid; gap: clamp(2.5rem, 6vw, 6rem); }
.ap-equipment__item { display: grid; align-content: start; gap: 1.5rem; }
.ap-equipment__item:first-child .ap-figure picture { aspect-ratio: 4/5; }
.ap-equipment__copy .ap-h3 { font-size: clamp(1.8rem, 2.6vw, 3rem); max-width: 20ch; }
.ap-equipment__item--result { border-top: var(--rule-strong); padding-top: 2rem; }
@media (min-width: 900px) {
  .ap-section--equipment .ap-head__text { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); column-gap: 6vw; max-width: none; }
  .ap-section--equipment .ap-eyebrow { grid-column: 1 / -1; }
  .ap-section--equipment .ap-lead { align-self: end; max-width: 40ch; }
  .ap-equipment { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
  .ap-equipment__item:first-child .ap-figure picture { aspect-ratio: 1.45; }
  .ap-equipment__item:nth-child(2) { padding-top: 4rem; }
  .ap-equipment__item:nth-child(2) .ap-figure picture { aspect-ratio: 1.55; }
  .ap-equipment__item--result { grid-column: 1 / -1; grid-template-columns: minmax(0, .45fr) minmax(0, 1fr); gap: 8vw; align-items: center; }
  .ap-equipment__item--result .ap-figure picture { aspect-ratio: 1.3; }
}
.ap-equipment__copy { max-width: 38rem; }
/* A solution class without its own photograph spans the full width and reads as
   a statement, rather than leaving an empty half of a two-column row. */
@media (min-width: 900px) {
  .ap-equipment__item--text { grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--ink); padding-top: 1.5rem; }
  .ap-equipment__item--text .ap-equipment__copy { max-width: 68ch; }
}
.ap-points { list-style: none; margin: 1.1rem 0 1.2rem; padding: 0; }
.ap-points li {
  padding: .5rem 0 .5rem 1.1rem; margin: 0; border-top: var(--rule);
  font-size: .9375rem; color: var(--ink-2); position: relative;
}
.ap-points li::before { content: ''; position: absolute; left: 0; top: .95rem; width: .4rem; height: 1px; background: var(--accent); }

/* ------------------------------------------------------------------- figures */

.ap-figure { margin: 0; display: grid; gap: .6rem; }
.ap-figure picture { display: block; aspect-ratio: var(--ratio, 4 / 3); overflow: hidden; background: var(--surface-2); }
.ap-figure img { width: 100%; height: 100%; object-fit: cover; }
.ap-figure__caption { font-family: var(--mono); font-size: .625rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }

/* -------------------------------------------------------------------- ledger */

.ap-ledger { margin: 0; display: grid; }
.ap-ledger__row { display: grid; gap: .2rem 2rem; padding: 1rem 0; border-top: var(--rule); }
@media (min-width: 768px) { .ap-ledger__row { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); } }
.ap-ledger dt { font-weight: 650; font-size: 1rem; }
.ap-ledger dd { margin: 0; font-size: .9375rem; color: var(--ink-2); max-width: 62ch; }
.ap-ledger--compact { margin-top: 1.5rem; max-width: 46rem; }
/* --------------------------------------------------------------------- lists */

.ap-numbered { margin: 0; padding: 0; list-style: none; counter-reset: n; display: grid; }
.ap-numbered li {
  counter-increment: n; padding: .85rem 0 .85rem 2.6rem; margin: 0;
  border-top: var(--rule); position: relative; font-size: 1rem; color: var(--ink-2); max-width: 70ch;
}
.ap-numbered li::before {
  content: counter(n, decimal-leading-zero); position: absolute; left: 0; top: .95rem;
  font-family: var(--mono); font-size: .6875rem; letter-spacing: .12em; color: var(--accent-ink);
}
@media (min-width: 768px) { .ap-numbered--two { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; } }

.ap-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 0 clamp(1.25rem, 3vw, 2rem); }
@media (min-width: 768px) { .ap-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ap-cards li { padding: 1.4rem 0 1.6rem; margin: 0; border-top: 1px solid var(--ink); }
.ap-cards p { font-size: .9375rem; color: var(--ink-2); }
.ap-cards--media li { display: grid; gap: .85rem; align-content: start; }
.ap-cards--media .ap-figure { --ratio: 4 / 3 !important; margin-bottom: .35rem; }
.ap-cards--media .ap-h3 { margin-bottom: .25em; }

.ap-links { list-style: none; margin: 0; padding: 0; }
.ap-links li { padding: .85rem 0; border-top: var(--rule); margin: 0; }

/* Local index for a long document page. Deliberately not sticky: the page is a
   document, and a floating bar would turn it into an application. */
.ap-localnav :is(ol, ul) { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
@media (min-width: 700px) { .ap-localnav :is(ol, ul) { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 2vw, 2.25rem); } }
.ap-localnav li { margin: 0; border-top: var(--rule); }
.ap-localnav li:nth-child(-n+3) { border-top: 1px solid var(--ink); }
@media (max-width: 699px) { .ap-localnav li:first-child { border-top: 1px solid var(--ink); } .ap-localnav li:nth-child(n+2) { border-top: var(--rule); } }
.ap-localnav a { display: flex; gap: .6rem; padding: .7rem 0; text-decoration: none; font-size: .9375rem; color: var(--ink-2); }
.ap-localnav a:hover { color: var(--accent-ink); }
.ap-localnav__n { font-family: var(--mono); font-size: .625rem; letter-spacing: .1em; color: var(--ink-3); padding-top: .3rem; flex: none; white-space: nowrap; }

/* Price is a cost atlas: a compact index, chapter margins, and complete readable terms. */
.ap-page--price .ap-opening .ap-display { max-width: none; font-size: clamp(3rem, 5vw, 5.25rem); letter-spacing: -.04em; }
.ap-page--price .ap-section--localNav { background: var(--canvas); padding-block: .5rem; border-block: var(--rule-strong); z-index: 20; }
.ap-page--price .ap-section--localNav .ap-tag { display: none; }
.ap-page--price .ap-section--localNav li { border: 0; }
.ap-page--price .ap-section--localNav ol { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: 1rem; }
.ap-page--price .ap-section--localNav a { font-size: .8rem; min-height: 3rem; align-items: center; line-height: 1.4; }
.ap-page--price .ap-section--localNav .ap-localnav__n { padding: 0; }
.ap-page--price .ap-head > .ap-num { font: 500 clamp(3.5rem, 6vw, 6rem)/1 var(--display); letter-spacing: -.05em; color: var(--accent); }
.ap-page--price .ap-head--numbered { grid-template-columns: 1fr; }
.ap-page--price .ap-ledger__row { padding-block: 1.3rem; }
.ap-page--price .ap-ledger dt { font-family: var(--display); font-size: clamp(1.3rem, 1.5vw, 1.7rem); letter-spacing: -.025em; }
@media (max-width: 999px) {
  .ap-page--price .ap-head--numbered { grid-template-columns: minmax(0, 1fr) 3rem; gap: 1rem; }
  .ap-page--price .ap-head > .ap-num { grid-column: 2; grid-row: 1; font-size: 2.75rem; padding-top: 0; text-align: right; }
  .ap-page--price .ap-head__text { grid-column: 1; grid-row: 1; }
  .ap-page--price .ap-head .ap-h2 { font-size: clamp(1.75rem, 3.8vw, 2.5rem); }
}
@media (min-width: 1000px) {
  .ap-page--price .ap-opening > .ap-display { grid-column: 1 / 8; grid-row: 2; }
  .ap-page--price .ap-opening > .ap-opening__lead { grid-column: 9 / -1; grid-row: 2; align-self: end; }
  .ap-page--price .ap-section:is(.ap-section--numbered,.ap-section--ledger,.ap-section--columns,.ap-section--notes) { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 2rem clamp(2rem, 5vw, 4.5rem); padding-inline: max(var(--gutter), calc((100% - var(--measure)) / 2)); }
  .ap-page--price .ap-section:is(.ap-section--numbered,.ap-section--ledger,.ap-section--columns,.ap-section--notes) > * { margin: 0; padding-inline: 0; }
  .ap-page--price .ap-head { align-content: start; gap: 1.5rem; }
  .ap-page--price .ap-h2 { font-size: clamp(2rem, 3vw, 3.25rem); max-width: 17ch; }
  .ap-page--price .ap-head .ap-lead { max-width: 35ch; font-size: 1rem; }
  .ap-page--price .ap-ledger__row { grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); }
}

/* Contact uses the ordinary document flow, including its image. */
.ap-page--contact .ap-opening__eyebrow { border-top: .4rem solid var(--accent); padding-top: .8rem; }
.ap-contact-details > p { margin-top: .9rem; font-size: 1rem; }
.ap-contact-details a:not(.ap-btn) { display: inline-block; min-height: 24px; }

/* Secondary pages inherit the voice, while prose stays quiet. */
.ap-page--problem .ap-opening--media > .ap-display,
.ap-page--about .ap-opening > .ap-display { font-size: clamp(3rem, 5vw, 5.25rem); max-width: 17ch; letter-spacing: -.04em; }
.ap-page--problem .ap-opening__media img { object-position: 35% center; }
@media (max-width: 599px) {
  .ap-page--problem .ap-opening--media > .ap-display { font-size: clamp(2.25rem, 11.5vw, 3rem); }
}
@media (min-width: 900px) {
  .ap-page--problem .ap-opening--media > :is(.ap-opening__eyebrow, .ap-display, .ap-opening__lead) { grid-column: 1 / 7; }
  .ap-page--problem .ap-opening--media > .ap-opening__media { grid-column: 7 / -1; }
}
.ap-page--about .ap-opening > .ap-opening__lead { max-width: 45ch; }
@media (max-width: 399px) {
  .ap-page--privacy .ap-display { font-size: clamp(1.7rem, 8.5vw, 2.1rem); }
  .ap-page--privacy .ap-h2 { font-size: clamp(1.6rem, 8vw, 1.7rem); }
}
.ap-article .ap-prose { max-width: 78rem; }
.ap-article .ap-prose__section { display: grid; column-gap: 4vw; }
.ap-article .ap-prose__section .ap-num { font: 500 3rem/1 var(--display); color: var(--accent); letter-spacing: -.05em; }
@media (min-width: 900px) {
  .ap-article .ap-prose__section { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); padding-block: 2.5rem; }
  .ap-article .ap-prose__section .ap-h2 { font-size: clamp(1.8rem, 2.6vw, 3rem); max-width: 17ch; }
  .ap-article .ap-prose__section > p { grid-column: 2; }
}

/* -------------------------------------------------------------------- tables */

.ap-tablewrap { overflow-x: auto; }
.ap-scrolltable { container-type: inline-size; }
.ap-tablehelp { display: none; }
@container (width < 34rem) { .ap-tablehelp { display: block; } }
@container (width < 52rem) { .ap-tablehelp--wide { display: block; } }
@media print { .ap-tablehelp { display: none !important; } }
.ap-table { width: 100%; border-collapse: collapse; font-size: .9375rem; min-width: 34rem; }
.ap-table--wide { min-width: 52rem; }
.ap-table th, .ap-table td { text-align: left; vertical-align: top; padding: .85rem 1.5rem .85rem 0; border-top: var(--rule); }
.ap-table thead th {
  font-family: var(--mono); font-size: .625rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-3); border-top: 1px solid var(--ink); font-weight: 500; padding-bottom: .7rem;
}
.ap-table tbody th { font-weight: 650; width: 22%; }
.ap-table td { color: var(--ink-2); }

/* ------------------------------------------------------------------ columns */

.ap-columns { display: grid; gap: clamp(1.5rem, 3vw, 3rem); }
@media (min-width: 768px) { .ap-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ap-columns__col { border-top: 1px solid var(--ink); padding-top: 1.1rem; }
.ap-columns__col--verify { border-top-color: var(--accent); }
.ap-columns__col ul { margin: 0; padding-left: 1.1em; font-size: .9375rem; color: var(--ink-2); }

.ap-notes { display: grid; gap: clamp(1.5rem, 3vw, 3rem); }
@media (min-width: 768px) { .ap-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ap-notes > div { border-top: 1px solid var(--ink); padding-top: 1.1rem; }
.ap-notes p { font-size: .9375rem; color: var(--ink-2); max-width: 58ch; }

/* --------------------------------------------------------------------- split */

.ap-split { display: grid; gap: clamp(1.25rem, 3vw, 3.5rem); }
@media (min-width: 900px) { .ap-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: start; } }
/* The title column is already the constraint. A `ch` limit here would resolve
   against the wrapper's body font-size rather than the display size, which
   collapsed every split title into a 230px column. The h2 owns its own measure. */
.ap-split__title { max-width: none; }
.ap-split__title .ap-num { margin-bottom: .8rem; }
.ap-split__title .ap-h2 { max-width: 22ch; }
.ap-split__body { max-width: 58ch; }
.ap-split__body p { font-size: 1rem; }

/* Printable worksheet */

.ap-checklist { list-style: none; margin: 0; padding: 0; }
.ap-checklist li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .9rem; padding: 1rem 0; margin: 0; border-top: var(--rule); }
.ap-checklist li:first-child { border-top: 1px solid var(--ink); }
.ap-checklist input { width: 1.5rem; height: 1.5rem; margin: .25rem 0 0; accent-color: var(--accent); }
.ap-checklist label { display: grid; gap: .15rem; cursor: pointer; }
.ap-checklist__term { font-weight: 650; }
.ap-checklist__desc { font-size: .875rem; color: var(--ink-3); line-height: 1.5; }
.ap-checklist input:checked + label .ap-checklist__term { color: var(--ink-3); text-decoration: line-through; text-decoration-color: var(--line-2); }
.ap-worksheet__tools { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; }

/* ------------------------------------------------------------------ principles */

.ap-principles { display: grid; gap: clamp(1.5rem, 3vw, 3rem); }
@media (min-width: 900px) { .ap-principles { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: start; } }
.ap-principles__list { list-style: none; margin: 0; padding: 0; }
.ap-principles__list li { padding: 1.1rem 0; margin: 0; border-top: var(--rule); }
.ap-principles__list li:first-child { border-top: 1px solid var(--ink); }
.ap-principles__list p { font-size: .9375rem; color: var(--ink-2); max-width: 56ch; }

/* ---------------------------------------------------------------------- org */

.ap-org { max-width: 52rem; }
.ap-org .ap-note { margin-top: 1.25rem; }
.ap-org-disclosure summary { cursor: pointer; padding-block: 1rem; border-block: var(--rule-strong); }
.ap-org-disclosure summary .ap-h2 { display: inline; font-size: 1.5rem; }
.ap-org-disclosure + .ap-link { margin-top: 1.25rem; }

.ap-status { border-left: 2px solid var(--accent); padding: .6rem 0 .6rem .9rem; margin: 1.25rem 0; font-size: .875rem; color: var(--ink-2); max-width: 56ch; }
.ap-status__tag { color: var(--accent-ink); display: block; margin-bottom: .2rem; }

/* ------------------------------------------------------------------ buttons */

.ap-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.6rem; }
.ap-btn {
  min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: .8rem 1.35rem; font-family: var(--display); font-size: .9375rem; font-weight: 600;
  text-decoration: none; border: 1px solid transparent; cursor: pointer; text-align: center;
}
.ap-btn--primary { background: var(--accent); color: #fff; }
.ap-btn--primary:hover { background: var(--accent-ink); }
.ap-btn--quiet { background: transparent; border-color: var(--line-2); color: var(--ink); }
.ap-btn--quiet:hover { border-color: var(--ink); }

/* ---------------------------------------------------------------- guides list */

.ap-guides { list-style: none; margin: 0; padding: 0; }
.ap-guides > li { padding: 1.5rem 0 1.75rem; margin: 0; border-top: 1px solid var(--ink); }
.ap-guides > li > p { margin-block: .8rem 1.2rem; font-size: .9375rem; color: var(--ink-2); max-width: 64ch; }
.ap-guides .ap-h3 a { text-decoration: none; border-bottom: 1px solid var(--line-2); }
.ap-guides .ap-h3 a:hover { border-color: var(--accent); color: var(--accent-ink); }

/* -------------------------------------------------------------------- prose */

.ap-prose { max-width: 46rem; }
.ap-prose__section { padding-top: clamp(1.75rem, 3vw, 2.5rem); }
.ap-prose__section + .ap-prose__section { border-top: var(--rule); margin-top: clamp(1.75rem, 3vw, 2.5rem); }
.ap-prose__section p { color: var(--ink-2); max-width: 66ch; }
.ap-prose--narrow { max-width: 40rem; }
.ap-prose .ap-num { margin-bottom: .7rem; }

.ap-example { max-width: 52rem; border-top: 1px solid var(--ink); padding-top: 1.25rem; }
.ap-example .ap-h2 { margin-bottom: 1rem; }
.ap-example p:last-child { color: var(--ink-2); }

.ap-decision { list-style: none; margin: 0; padding: 0; counter-reset: d; }
.ap-decision li { counter-increment: d; padding: 1.1rem 0 1.1rem 2.6rem; margin: 0; border-top: var(--rule); position: relative; }
.ap-decision li:first-child { border-top: 1px solid var(--ink); }
.ap-decision li::before {
  content: counter(d, decimal-leading-zero); position: absolute; left: 0; top: 1.2rem;
  font-family: var(--mono); font-size: .6875rem; letter-spacing: .12em; color: var(--accent-ink);
}
.ap-decision__q { font-weight: 650; margin: 0 0 .25rem; max-width: 56ch; }
.ap-decision__a { margin: 0; font-size: .9375rem; color: var(--ink-2); max-width: 56ch; }

/* --------------------------------------------------------------------- close */

.ap-close { display: grid; gap: clamp(1.5rem, 3vw, 3.5rem); }
@media (min-width: 900px) { .ap-close:has(.ap-close__aside) { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: start; } }
.ap-close__copy { max-width: 58rem; }
.ap-close__copy .ap-h2 { margin-bottom: 1.5rem; font-size: clamp(2.5rem, 4vw, 4rem); line-height: 1.05; letter-spacing: -.035em; max-width: 17ch; }
.ap-close .ap-btn--primary { background: transparent; color: var(--ink); border-block: 1px solid var(--ink); padding: 1rem 0; min-width: min(100%, 20rem); justify-content: space-between; }
.ap-close .ap-btn--primary::after { content: '↗'; font-size: 1.5em; margin-left: 2rem; }
.ap-close .ap-btn--primary:hover { color: var(--accent-ink); border-color: var(--accent); }
.ap-close__copy p { color: var(--ink-2); max-width: 46ch; }
.ap-close__aside { border-top: 1px solid var(--ink); padding-top: 1.1rem; max-width: 26rem; }
.ap-close__aside ul { list-style: none; margin: .5rem 0 1rem; padding: 0; }
.ap-close__aside li { padding: .45rem 0; border-top: var(--rule); margin: 0; font-size: .9375rem; }


/* -------------------------------------------------------------------- footer */

.ap-footer { background: var(--dark); color: var(--on-dark); }
.ap-footer__inner {
  display: grid; gap: clamp(1.75rem, 4vw, 3.5rem);
  padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(2rem, 4vw, 3rem);
}
@media (min-width: 900px) { .ap-footer__inner { grid-template-columns: minmax(0, .9fr) minmax(0, 2.1fr); } }
.ap-footer__name { font: 650 clamp(1.8rem, 3vw, 3.5rem)/1.08 var(--display); letter-spacing: -.04em; margin: 0 0 1rem; max-width: 12ch; }
.ap-footer__tag { color: var(--on-dark-2); font-size: .9375rem; margin: 0; max-width: 26ch; }
.ap-footer__nav { display: grid; gap: 2rem; }
@media (min-width: 700px) { .ap-footer__nav { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ap-footer__nav .ap-tag { color: var(--on-dark-2); margin-bottom: .8rem; }
.ap-footer__nav ul { list-style: none; margin: 0; padding: 0; }
.ap-footer__nav li { margin: 0; padding: .35rem 0; }
.ap-footer__nav a { color: var(--on-dark); text-decoration: none; font-size: .9375rem; border-bottom: 1px solid transparent; }
.ap-footer__nav a:hover { border-bottom-color: var(--accent); }
.ap-footer__base { padding-bottom: clamp(2rem, 4vw, 3rem); }
.ap-footer__base p {
  color: var(--on-dark-2); font-size: .75rem; font-family: var(--mono); letter-spacing: .04em;
  margin: 0; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.14);
}

/* ------------------------------------------------------------ forced colors */

@media (forced-colors: active) {
  .ap-figure picture { border: 1px solid CanvasText; }
  .ap-questions li, .ap-cards li, .ap-columns__col,
  .ap-notes > div, .ap-example, .ap-guides > li, .ap-close__aside, .ap-opening__aside { border-top-color: CanvasText; }
}

.ap-footer :focus-visible, .ap-section--dark :focus-visible { outline-color: var(--accent-on-dark); }
.ap-prose__section .ap-h2 { margin-bottom: 1rem; }
