/*
 * tokens.css — the legacy site's design values as custom properties.
 *
 * Source: section "Design-Spezifikation aus dem Bestand" in
 * AI/plans/done/theme-grundgeruest-divi.md. Measured there on 2026-08-25 from the delivered
 * theme CSS (/typo3temp/assets/compressed/merged-a543e002….css).
 *
 * This file is the only place where a colour or a measurement stands as a literal. Everything
 * else merely references. Whoever wants to change a colour changes it here — not in Divi's
 * theme options and not in the "Custom CSS" field (E2).
 */

:root {
  /* ---------------------------------------------------------------------
   * Colours
   * ------------------------------------------------------------------- */

  /* Accent: links, hover, label background. At the same time map colour of category B. */
  --wi-color-accent: #f28c00;
  /* Hover background in the dropdown menu — lighter than the accent, and not by accident. */
  --wi-color-accent-hover: #f2a030;

  /* Carries three roles at once: overlay of the dark sections, body copy in light mode, button
   * outline. The same value in the legacy site, hence one token. */
  --wi-color-ink: #707070;

  --wi-color-surface: #ffffff;
  /* Background of the news section. */
  --wi-color-surface-muted: #e2e2e2;
  /* Column divider, 1px x 130px. */
  --wi-color-rule: #6e6d6d;
  /* Active slider dot. */
  --wi-color-slider-active: #cee002;

  --wi-color-on-dark: #ffffff;

  /* The panel the front page's hero content stands on. Semi-transparent so the photo below
   * shows through — the value is measured that way and is not derived from the accent:
   * `--wi-color-accent` is rgb(242, 140, 0), this one rgb(206, 126, 7). Two different shades of
   * orange, and the second occurs at this one place only.
   * Measured on the rendered legacy site (`scripts/measure-bestand.sh 1920 hero`), on the
   * element with the area and NOT on the section — that carries the photo and a dark overlay,
   * the panel lies above it (E23). */
  --wi-color-hero-panel: rgba(206, 126, 7, 0.8);

  /* Opacity of the overlay that lies between image and text in the dark section. A token of its
   * own because it gets nudged during visual comparison against the legacy site — and because a
   * value that exists only as a var() fallback would not be findable here. */
  --wi-overlay-opacity: 0.45;

  /* Map categories. Binding per AI/architecture/wildisland-datenmodell.md, section 2 — mirrored
   * here so the wildisland-map plugin can reference them instead of carrying the hex values a
   * second time. */
  --wi-color-map-wildisland: #75b72a; /* category UID 5 — LIFE project area */
  --wi-color-map-a: #4385f5;          /* UID 2 — wild & natural */
  --wi-color-map-b: var(--wi-color-accent); /* UID 3 — near-natural; identical to the accent */
  --wi-color-map-c: #e43340;          /* UID 4 — more heavily affected, and the fallback */

  /* ---------------------------------------------------------------------
   * Typography
   * ------------------------------------------------------------------- */

  /* Fallbacks deliberately close to the system: if a woff2 fails, the page should stay legible
   * and not fall back to Times.
   *
   * Every declaration additionally appends `, sans-serif` to the token. That looks redundant but
   * is the difference between "the token ends in sans-serif" and "this rule has a generic
   * fallback": if the token does not resolve — a typo in the name, the file not loaded, the rule
   * inherited from another context — the declaration is invalid without the addition and the
   * browser falls back to its serif face. */
  --wi-font-sans: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  /* Only in the map's filter panel and in labels. 'Arial Narrow' is the closest widely
   * available condensed fallback. */
  --wi-font-condensed: 'Open Sans Condensed', 'Arial Narrow', Arial, sans-serif;

  --wi-font-size-root: 14px;   /* base */
  --wi-font-size-body: 20px;   /* body copy, links, navigation */
  /* The legacy site pulls body copy back ONCE on narrow windows: to 16px from 1600px. Measured,
   * not estimated — strictly speaking the 20px above apply only above 1600px.
   *
   * Until 2026-09-07 a second step stood here, to 14px from 450px, and it was wrong: the rule
   * exists in `assets/merged.css` but is beaten in the content area by the four-class selector
   * that carries the 1600px step. Measured over all 213 snapshot documents at 460px and at
   * 375px, the only thing that moves across that boundary is the running text of the footer
   * (F17) — F15 of the frontend defect list, the same mistake as E11. The token stays, because
   * the small print of the newsletter sign-up uses it
   * as a size of its own (newsletter-signup.css); what it no longer is, is a step of the body
   * copy. */
  --wi-font-size-body-medium: 16px;
  --wi-font-size-body-narrow: 14px;
  /* Headings. All values measured on the RENDERED legacy site, not read from its stylesheet —
   * `scripts/measure-bestand.sh` repeats the measurement at any time. The difference was
   * expensive: until 2026-08-27 this said `--wi-font-size-h2-dark: 36px` with uppercase, copied
   * from `.std-content h2`. That rule is overridden in the content area by
   * `body .content .content-inner section h2` and bites nowhere. See E11 in
   * AI/plans/done/sektions-bibliothek-divi.md.
   *
   * H1 and H2 are the same size in the LEGACY site and differ between dark and light mode by
   * colour ALONE. They stand as two tokens all the same: being equal is a finding, not an
   * identity — and on 2026-09-24 that separation paid off.
   *
   * **The H1 deliberately departs from the legacy site**, on instruction. There, H1 and H2 are
   * both 35px and tell apart by weight alone (600 against 500); our heading preset cannot carry
   * a weight per level, so both arrived at 600 and the two levels became indistinguishable. A
   * heading hierarchy that a reader cannot see is not a hierarchy, so the H1 goes to 44px. H2
   * and H3 keep their measured legacy values.
   *
   * The 35px of the legacy H1 is not lost: it is what --wi-font-size-h2 holds, and the two are
   * still separate tokens. */
  --wi-font-size-h1: 44px;
  --wi-font-size-h2: 35px;
  --wi-font-size-h3: 24px;
  /* From 991px the legacy site pulls H1 and H2 back together, H3 only from 700px. The H1 keeps a
   * step of its own there too — the whole point is that it stays distinguishable. */
  --wi-font-size-h1-narrow: 36px;
  --wi-font-size-heading-narrow: 30px;
  --wi-font-size-h3-narrow: 20px;

  /* The navigation. Its own scale and not the body one, although the middle step happens to
   * match it at 20px — that coincidence is what hid F4 of the frontend defect list for two work
   * packages: the top level hung on `--wi-font-size-body`, which is exactly the SECOND step of
   * the legacy site, and the drop-down carried the 1920px value of its FIRST step as a constant.
   * Above 1600px the top level was therefore 2px too small, below it the drop-down 4px too big.
   * A later change to body copy would move the header along, and nobody would expect it.
   *
   * All values measured on the rendered snapshot (2026-09-07), the boundaries narrowed down from
   * both sides: at 1601px the top level stands at 22px, at 1600px at 20px; at 1051px still 20px,
   * at 1050px 18px. The drop-down has ONE step, not two — 22px above 1600px, 18px from there
   * down to the narrowest measured window.
   *
   * Both levels are the same size above 1600px and differ only in weight (600 against 400) and
   * colour (white against --wi-color-ink). Being equal is a finding, not an identity — hence two
   * tokens, as with H1 and H2 above. */
  --wi-font-size-nav: 22px;
  --wi-font-size-nav-medium: 20px;   /* from 1600px */
  --wi-font-size-nav-narrow: 18px;   /* from 1050px */
  --wi-font-size-dropdown: 22px;
  --wi-font-size-dropdown-medium: 18px;   /* from 1600px */

  /* Bootstrap's ratio, and the legacy navigation carries it on both levels: 31.4286px at 22,
   * 28.5714 at 20, 25.7143 at 18. Until F4 the navigation ran on the fixed 24px of body copy and
   * was 7px short at 22px.
   *
   * Unitless for the same reason as --wi-tabs-line-height further down: in the legacy site this
   * is a ratio, and one token then covers all three sizes instead of three pixel values that a
   * changed font size would leave behind. */
  --wi-line-height-nav: 1.42857143;

  /* The title in the hero. A row of its own and not the H1 of the content area: the legacy site
   * sets it smaller (30px instead of 35px), lighter (300 instead of 600) and staggers it at
   * different boundaries — 1300px and 600px instead of 991px.
   *
   * Measured on the `<strong>` INSIDE the H1 and not on the H1 itself. The whole title lives
   * there, and the two levels carry different values: the H1 measures 22px at weight 500, the
   * `strong` inside it 30px at 300. Whoever measures the H1 measures a box with no visible text
   * in it — which is exactly what happened in E18 (E23). */
  --wi-font-size-hero: 30px;
  --wi-font-size-hero-medium: 25px;
  --wi-font-size-hero-narrow: 22px;
  --wi-line-height-hero: 34px;
  --wi-line-height-hero-medium: 29px;
  --wi-line-height-hero-narrow: 26px;

  /* The H1 carries its own pair since it left 35px behind: 39px under a 44px letter would set
   * the lines too tight. Ratio kept from the measured legacy pair (39/35). */
  --wi-line-height-h1: 49px;
  --wi-line-height-h1-narrow: 41px;
  --wi-line-height-heading: 39px;
  --wi-line-height-heading-narrow: 35px;
  --wi-line-height-h3: 26.4px;
  --wi-line-height-h3-narrow: 22px;
  --wi-line-height-body: 24px;

  --wi-font-weight-light: 300; /* body copy */
  --wi-font-weight-regular: 400;
  --wi-font-weight-medium: 500;
  --wi-font-weight-semibold: 600; /* headings, navigation */
  --wi-font-weight-bold: 700;

  /* Body copy spacing, in two steps like the spacing below the H2 — and at the same boundary.
   * Measured on the rendered legacy site by narrowing down (`scripts/measure-bestand.sh <width>
   * abstaende`): at 1601px the paragraph margin stands at 22px, at 1600px at 15px. Until
   * 2026-08-27 the repository carried it as a constant 22px — the step had not been measured in
   * work package 1 (E22 of the plan). */
  --wi-space-paragraph: 22px;  /* margin-bottom of body copy */
  --wi-space-paragraph-narrow: 15px;

  /* The LIST, and it is not the paragraph — F18 of the frontend defect list. Measured on the
   * rendered snapshot at six widths on two pages: between two items the legacy site holds 4px
   * above 1600px and 15px at and below, the second value being the paragraph's own. Below the
   * list it holds 22px at EVERY width, the paragraph step included — an `ul` there keeps what a
   * `p` gives up. That is why the closing gap has no narrow companion and reuses
   * `--wi-space-paragraph`, while the gap between items gets a token of its own for the wide
   * case only. Divi zeroes all three in its reset, and until 2026-09-07 nothing put them back. */
  --wi-space-list-item: 4px;

  /* Spacing below a heading — the same in both modes. The former
   * `--wi-space-heading-dark: 60px` came out of the same mismeasurement as the uppercase above
   * and is gone.
   *
   * The legacy site staggers in two steps, and DIFFERENTLY for H1 and H2: the H2 drops to 20px
   * as early as 1600px, the H1 only from 991px. Where that difference belongs is in base.css at
   * the media queries; only the two values stand here. */
  --wi-space-heading: 50px;
  --wi-space-heading-narrow: 20px;
  /* The H3 holds 10px throughout — in the legacy site it is a subline, not the start of a
   * paragraph. */
  --wi-space-h3: 10px;

  /* Section padding — the spacing a section keeps above and below its content (F5 of the
   * frontend defect list).
   *
   * It is NOT symmetrical and never was: measured on the rendered snapshot across three pages
   * (partners-and-donors, current-progress, contacts) every section stands at 100px above and
   * 80px below, and from 1100px at 50px/40px. Whoever assumes one value measures the average of
   * two.
   *
   * **Where the legacy site carries it is one level below the section.** `section` itself holds
   * `padding: 0`; the padding sits on `div.std-content` inside it. That is why the first
   * measurement of F5 found a zero there and concluded the legacy site knew no section padding
   * at all — the value was measured on the wrong element. It is the same mistake the child
   * theme's own convention warns about (AI/architecture/divi-fallstricke.md, section 4), one
   * level higher: not read from the stylesheet but measured on the wrong box.
   *
   * In Divi the counterpart is the section itself: `.std-content` fills the whole section width,
   * so the padding has the same effect there. It reaches the section through the three
   * `wi-section-*` presets (bin/lib/global-presets.php) and not through a CSS counter-rule —
   * Divi writes preset spacing with high specificity, and a padding that shows differently in
   * the builder than in the frontend is the more expensive variant.
   *
   * The step stands at Divi's tablet boundary (980px) and not at the legacy 1100px: a preset
   * knows only Divi's breakpoints, and per E2 of the parent plan pixel equality in spacing is
   * not owed. The measured legacy boundary is written down here so that the deviation is a
   * known one and not a forgotten one.
   *
   * **The values are no longer the measured ones.** Since NA7 (AI/plans/done/nacharbeiten.md,
   * decided by the client at the acceptance walk-through of 2026-10-06) every section keeps
   * 40px above and below instead of the legacy 100/80, and 30px instead of 50/40 from 980px —
   * the site was too stretched for the client. 40px is the ceiling at full width; the narrow
   * step gets less, not more. Symmetrical now, where the legacy site never was. The history
   * above stays because it explains WHERE the value acts and why it is a preset. */
  --wi-section-space-top: 40px;
  --wi-section-space-bottom: 40px;
  --wi-section-space-top-narrow: 30px;
  --wi-section-space-bottom-narrow: 30px;

  /* ---------------------------------------------------------------------
   * Measurements
   * ------------------------------------------------------------------- */

  --wi-width-max: 1800px;   /* header, section and — since NA9 — every content row */

  /* How wide content runs inside that cap: Divi's own row width, a share of the window. Since
   * NA9 (AI/plans/done/nacharbeiten.md, client decision of 2026-10-08) the content follows
   * Divi's standard row — 80% of the window, capped at `--wi-width-max` through the section
   * presets — instead of the legacy text column (1170px centred, 180px per side from 1366px,
   * 85% from 900px). Above roughly 1460px the content is therefore wider than in the legacy
   * site; below it the two were the same already. The row presets carry the cap, this share is
   * what `.wi-text-column` (base.css) and `.wi-row` (sections.css) read for content OUTSIDE a
   * Divi row, so that article, archive and footer stand flush with the rows. The share is NOT
   * written into the presets: Divi's row brings it on its own, and a preset value would only
   * state the default a second time. */
  --wi-width-text-ratio: 80%;

  /* The inset of the legacy text column, kept for the hero panel alone: between 1300 and 901px
   * the panel fills that column, 180px per side (F9). The column's width and the panel's pinned
   * position (F1) went with NA2, which put the panel into the flow and centres it. */
  --wi-hero-column-inset: 180px;

  /* Measurements of the hero panel, taken across the legacy steps (1300px and 600px). The width
   * is an upper bound and not a fixed width — below 600px the panel fills the column and keeps
   * only its padding. */
  --wi-hero-panel-width: 790px;
  --wi-hero-panel-width-medium: 600px;
  --wi-hero-panel-padding: 20px 25px 15px;
  --wi-hero-panel-padding-narrow: 10px 10px 15px;

  /* The depth of the panel (NA2, client wish of 2026-10-06: "more plastic"). The model is the
   * orange box at the top right of the project map `Karte_Danubeparks.jpg`: a shadow cast
   * downwards, soft at the edge, plus a tight one that lifts the edge itself. The radius is the
   * "may look more modern" of the same wish; the legacy panel has square corners. */
  --wi-hero-panel-shadow: 0 12px 32px rgba(0, 0, 0, 0.35), 0 3px 8px rgba(0, 0, 0, 0.3);
  --wi-hero-panel-radius: 4px;

  /* How wide the panel stands below 1300px (F9 of the frontend defect list,
   * measured 2026-09-07 on the rendered legacy front page across nineteen widths). The panel
   * fills the TEXT COLUMN, and that column runs through three steps — 180px per side down to
   * 901px, 85% down to 501px, 89% below that. The cap `--wi-hero-panel-width-medium` sits on
   * top of all three and is what is actually seen above 706px.
   *
   * The first step is no token: it is `calc(100% - var(--wi-hero-column-inset) * 2)` at the rule
   * itself, the same term the inset above uses, so the column cannot drift apart from the panel
   * that hangs off it. Only the two proportional steps are values.
   *
   * The section centres its rows, and a centred row is shrink-to-fit, so without a width the
   * panel would follow its heading — that is why the rule states one at all. What it states is
   * the legacy column and no longer Divi's row width of 80%, which is what F9 was about.
   *
   * The 89% belong to the HERO alone and not to the text column in general: measured against
   * the ordinary content column of the front page and of a subpage, both stay at 85% down to
   * 320px. `.wi-text-column` in base.css therefore keeps its two steps and gets no third. */
  --wi-hero-panel-width-ratio: 85%;
  --wi-hero-panel-width-ratio-narrow: 89%;

  /* How tall the hero section stands (NA2, replacing F7's window-high legacy hero). The rule in
   * sections.css clamps the window height minus the reveal between floor and cap; the panel in
   * the flow can push the band above all three.
   *
   * The reveal is what has to stay visible below the band on load: the section's top padding
   * (40px), the news heading with its gap (about 107px down to the cards) and a first strip of
   * the card images. Measured on Dev 2026-10-08 at 1920x1080: heading 40px, cards 147px below
   * the section edge.
   *
   * The floor is the header strip of the subpages plus the lift, at each of its three steps
   * (`--wi-hero-height*` below): the band stands taller than any subpage header, which is how
   * the client put it. Only the widest step is a token here; sections.css derives the other two
   * from the header strip tokens, so the two can no longer drift apart. */
  --wi-front-hero-reveal: 240px;
  --wi-front-hero-lift: 40px;
  --wi-front-hero-height-min: calc(var(--wi-hero-height) + var(--wi-front-hero-lift));
  --wi-front-hero-height-max: 760px;

  /* The button in the hero panel, measured on the rendered legacy site (F3 of the frontend
   * defect list, 2026-09-04). The legacy site turns EVERY link in this panel into one — through
   * `#section0 .csc-frame-default a`, that is, without any marker in the markup. The values are
   * therefore here and not on the unit: they belong to the surface, not to the content.
   *
   * Unstaggered, unlike the body-copy link next to it: `.std-content a` drops from 20px to 16px
   * from 1600px in the legacy site, this rule stands without a media query. */
  --wi-hero-button-size: 16px;
  --wi-hero-button-weight: 200;
  --wi-hero-button-padding: 5px 20px;
  --wi-hero-button-border: 2px;

  /* The header is staggered: 120px, from 1300px 100px. The step lives in header.css at its
   * media query — where it bites, with the derivation from the legacy site alongside
   * (work step 12).
   *
   * The logo has FOUR steps, not two (F11 of the frontend defect list, measured on the rendered
   * snapshot 2026-09-07). The rebuild used to carry one constant, 90px, and that is a correctly
   * measured legacy value — it is the third step. The two above it were missing: whoever sits at
   * a 1920 screen saw the logo 30px too small, between 1600 and 1301px 10px. Same mistake as the
   * drop-down token of F4, at another place.
   *
   * The second step stands where nobody looks for it. The legacy site has no height rule for it:
   * from 1600px it caps the logo column at 230px, the logo holder keeps 10px of that, and
   * `max-width: 100%` bites before any height does — 220 / 239.87595 x 109.23128 = 100.18.
   * Searching the legacy stylesheet for `max-height` finds three rules (150px, 125px, 90px), of
   * which the first two lose against the base rule and the fourth step is not among them at all.
   *
   * It is a height here and not a width cap, because the height is what carries the size in this
   * rebuild — an explicit height plus `max-width` would not scale the image, it would squash it.
   *
   * And the last two digits are chosen for what they RENDER, not for how they read. The legacy
   * site shows 100.17px, its arithmetic value is 100.178. Written as `100.17px` the logo comes
   * out 100.16: Chrome lays out in 64ths of a pixel and truncates, and 100.17 falls just below
   * the 64th that the legacy value falls on. 100.18px lands on the same 64th as the legacy site
   * and measures as its 100.17. */
  --wi-header-height: 120px;
  --wi-logo-height: 120px;           /* above 1600px */
  --wi-logo-height-medium: 100.18px; /* from 1600px, renders as the legacy 100.17 */
  --wi-logo-height-compact: 90px;    /* from 1300px */
  --wi-logo-height-narrow: 70px;     /* from 980px */

  /* Three-column header. Column 2 (social) is empty and hidden in the legacy site; it is not
   * rebuilt, the percentages remain documented as evidence. */
  --wi-header-col-1: 13.5%;
  --wi-header-col-2: 30%;
  --wi-header-col-3: 53.7%;

  --wi-dropdown-width: 250px;
  --wi-rule-height: 130px;

  /* The header in detail. Measured on the legacy site (assets/merged.css): the navigation sits
   * 35px below the top edge, and the gaps between the items do not come from a spacing but from
   * the links' own padding — which is why the hover area of the top level covers the whole item
   * and not just the text. */
  --wi-header-nav-offset: 35px;
  --wi-header-nav-padding-block: 7.5px;
  /* The horizontal padding is staggered in three steps as the five items move closer together,
   * measured on the rendered snapshot (2026-09-07) and narrowed down from both sides: 20px at
   * 1101px, 12px at 1100px, 5px at 1050px. The middle step was missing until F4 — the rebuild
   * jumped straight from 20 to 5.
   *
   * The staircase belongs to the TOP LEVEL alone. The drop-down keeps 7.5/20 at every measured
   * width, and that is measured too, not assumed: it stands in an area of its own, where the
   * pressure that pushes the top level together does not exist. */
  --wi-header-nav-padding-inline: 20px;
  --wi-header-nav-padding-inline-medium: 12px;   /* from 1100px */
  --wi-header-nav-padding-inline-narrow: 5px;    /* from 1050px */
  /* The button that opens a submenu where there is no hover (touch devices, the panel). No legacy
   * counterpart — the legacy site has no such button (E2). 48px is the touch target the platform
   * guidelines ask for, and the chevron inside it is 16 x 10px: the 10 x 6 it had was reported as
   * too small to see and to hit (2026-10-23). The half-width of the triangle is the token, the
   * height follows from it. */
  --wi-menu-toggle-size: 48px;
  --wi-menu-chevron-half-width: 8px;
  /* Distance of the logo from the left and the top edge.
   *
   * SIDEWAYS the value is not a padding of the header container but the inset of the logo INSIDE
   * its own column, and it is staggered in three steps (F10 of the frontend defect list, measured
   * on the rendered snapshot 2026-09-07): the legacy holder has no left margin above 1800px, 20px
   * from 1800px, 10px from 1600px. Up to F10 the rebuild carried the middle step as a container
   * padding, which put the logo 20px too far right at every width above 1800px — and, worse, took
   * those 20px away from the navigation at every width below (see --wi-header-inner-max-narrow).
   *
   * The step at 1800px is the horizontal half of a legacy rule whose vertical half is deliberately
   * not rebuilt: `.fixed-holder .logo-holder { margin: 10px 0 0 20px }` also lets the legacy logo
   * hang below the bar between 1800 and 1601px, which F11 declined to copy because it comes out
   * differently per page. The sideways inset has no such problem and is copied.
   *
   * The TOP offset is 0 while the logo is as tall as the bar; from 1600px the logo gets smaller
   * and the legacy site drops it by 10px (measured on the rendered snapshot: top edge at y = 10,
   * bottom edge at 110.17 in a 120px bar). That step lives at the 1600px media query in
   * header.css. */
  --wi-header-logo-inset: 0;              /* above 1800px */
  --wi-header-logo-inset-medium: 20px;    /* from 1800px */
  --wi-header-logo-inset-narrow: 10px;    /* from 1600px */
  --wi-header-logo-offset: 0;
  --wi-header-logo-offset-medium: 10px;   /* from 1600px */

  /* How wide the header container stands from 1600px down: 98 % of the window, centred, which
   * leaves 1 % on each side (F10, measured on the rendered snapshot 2026-09-07 — the legacy rule
   * is `body .fixed-holder header .inner { max-width: 98%; margin-left: auto; margin-right: auto }`
   * in its 1600px query). Above 1600px the container is `--wi-width-max` and has no side margin
   * of its own beyond centring.
   *
   * It is a share and not a number, and that is the point: the 11px the legacy site keeps at
   * 1101px are not a margin somebody chose, they are 1 % of the window. The rebuild kept a fixed
   * 20px there and therefore gave the navigation 38px less than the legacy site does — enough for
   * the five menu items to wrap at 1101 and 1051px where the legacy site holds them on one line. */
  --wi-header-inner-max-narrow: 98%;

  /* The narrow panel below 980px has no legacy counterpart (E2 of the parent plan lists the mobile
   * navigation under "deliberately corrected"), and it keeps the side padding it had before F10.
   * The share above would put the logo 3.75px from the edge on a 375px screen — right for a bar
   * that spans the window, wrong for a panel. */
  --wi-header-panel-inset: 20px;
  /* The legacy site puts the header above everything with z-index 99. Adopted so that a Divi
   * module with a stacking context of its own does not cover it. */
  --wi-header-z: 99;

  /* The header's background graphic comes from the media library and can therefore have no
   * value here — inc/header.php sets it at runtime as an inline declaration. `none` is not a
   * placeholder but the valid state as long as the asset has not been imported.
   *
   * The colour next to it is not decoration: header_bcg.png is an RGBA graphic that becomes
   * transparent towards the bottom. With an opaque colour behind it the gradient would be gone.
   * As long as the graphic is missing, something still has to stand behind the white type —
   * hence `--wi-color-ink` as the default here, and inc/header.php switches it to `transparent`
   * as soon as the graphic exists. */
  --wi-header-bg-image: none;
  --wi-header-bg-color: var(--wi-color-ink);
  /* On narrow windows the gradient becomes an opaque area. The value is measured: the legacy
   * site switches to `background-color: black` from 1300px. */
  --wi-header-bg-color-narrow: #000000;

  /* The footer in detail (work step 8). Measured on the legacy site (assets/merged.css): the
   * partner section stands on white, the contact and legal lines on --wi-color-ink.
   *
   * The vertical padding of the partner and contact stripes is NOT measured any more: since
   * NA7 (AI/plans/done/nacharbeiten.md, client decision of 2026-10-06) the two stripes keep
   * the same 40px above and below as every section, 30px from the footer's own 1100px step —
   * the legacy 100/55 and 120/50 stretched the page. The legal line already stood below that
   * ceiling with its 25px and keeps them. */
  --wi-footer-partners-padding-block: 40px 40px;
  --wi-footer-contact-padding-block: 40px 40px;
  --wi-footer-legal-padding-block: 25px;
  /* Narrow windows: the legacy site halves its padding from 1100px; the step stays, the value
   * is the NA7 one for narrow windows. */
  --wi-footer-partners-padding-block-narrow: 30px 30px;
  --wi-footer-contact-padding-block-narrow: 30px 30px;

  --wi-footer-heading-size: 35px;
  --wi-footer-heading-line-height: 40px;
  --wi-footer-heading-space: 30px;
  --wi-footer-column-gap: 80px;

  /* Partner logos. The legacy site limits the width only; the height is added here because
   * exactly one of the 15 logos (BROZ) has a different aspect ratio and would otherwise stand
   * half again as tall as all the others. The height is at the same time the reference for the
   * EU requirement "at least as large as the largest other logo" — without it the requirement
   * could not be verified, only asserted. See assets/brand/README.md. */
  --wi-footer-partner-max-width: 232px;
  --wi-footer-partner-max-height: 90px;
  --wi-footer-partner-gap: 45px;

  /* Funding emblems. 100px is above the largest partner logo height (90px) and therefore on the
   * safe side of the size rule; the lower bound below it is the minimum height of 1 cm from the
   * EU emblem rules — roughly 38px at 96 dpi, set to 70px here with headroom so that even the
   * mobile breakpoint does not graze it. */
  --wi-footer-emblem-height: 100px;
  --wi-footer-emblem-height-narrow: 70px;
  --wi-footer-emblem-gap: 30px;

  /* The header strip — the same on post (step 9), archive (step 10) and 404 (step 11). It
   * adopts the measurements of the legacy section `.sub-section`: that stands above the content
   * on every subpage, and its height staggering is the only measured value there is for an
   * image in this role. The legacy site fills it with a fixed graphic (`island_header.jpg`),
   * here the post image stands in it (E9) — on the archive, the one of the posts page.
   *
   * The names no longer carry `post`: since step 10 the archive uses the same values, and a
   * token called `--wi-post-…` that stands in the archive is misleading. */
  --wi-hero-height: 600px;
  --wi-hero-height-medium: 400px; /* from 1366px */
  --wi-hero-height-narrow: 300px; /* from 991px */

  /* The post in detail (work step 9). Measured on the legacy site
   * (migration/bestand/seiten/news-media_detail_danube-wildisland-…html and assets/merged.css). */

  /* Padding of the content area — in the legacy site on `section .std-content`. */
  --wi-post-padding-block: 100px 80px;
  --wi-post-padding-block-narrow: 50px 40px; /* from 1100px */

  --wi-post-title-space: 50px;   /* margin-bottom of the H1 */
  --wi-post-meta-size: 16px;     /* date and category label */
  --wi-post-meta-line-height: 18px;
  --wi-post-meta-gap: 15px;      /* gap date -> label */
  --wi-post-meta-space: 15px;    /* gap line -> body copy */
  --wi-post-content-space: 50px; /* gap body copy -> "Back" */

  /* Quotations. The legacy site leaves them to Bootstrap and only adds the italics; the values
   * here are the visible result of that overlay, not a setting of its own. Measured on the
   * rendered snapshot at 1920px, identical on an article and on a page.
   *
   * The prefix is `--wi-quote-` and no longer `--wi-post-quote-`: the quotation is not a trait
   * of the article. It stands 20 times in 12 articles and 6 times on 3 pages, and the rules
   * that read these tokens moved to base.css with F14 for exactly that reason. */
  --wi-quote-size: 17.5px;
  --wi-quote-rule: #eeeeee;
  --wi-quote-padding: 10px 20px;

  /* The gap below the quotation. It is NOT the paragraph gap: the legacy site keeps Bootstrap's
   * `margin: 0 0 20px` here, while a paragraph carries 22px. Both were measured on the same
   * document — the difference of two pixels is the legacy state, not a rounding error. */
  --wi-quote-space: 20px;

  /* Caption inside body copy — `.thumbnail .caption` in the legacy site. */
  --wi-post-caption-color: #333333;
  --wi-post-caption-padding: 9px;

  /* The news list (work step 10). Measured on the legacy site
   * (migration/bestand/seiten/news-media_news-events.html and the rules for `.news-list-view` in
   * assets/merged.css, retrieved 2026-08-25).
   *
   * The legacy site puts three cards side by side, with 15px padding each side and a negative
   * margin on the container — together a gutter of 30px. Here stands a grid with exactly that
   * gutter; the result is the same, without the margin trick. */
  --wi-card-gap: 30px;
  --wi-card-gap-narrow: 25px;  /* from 768px, single column there */
  --wi-card-max-width: 350px;  /* width of a single card once it stands alone */

  /* Aspect ratio of the card image. The legacy site sets none — it leaves every image at its own
   * height (`width:100%; height:auto`), which is why the text blocks of a row begin at different
   * heights. That is not a design feature but a consequence of TYPO3 emitting the images uncut
   * (E12). 3:2 lies between the two most common legacy formats (4:3 and 3:2). */
  --wi-card-ratio: 3 / 2;

  --wi-card-body-padding: 15px 10px 15px 15px;
  --wi-card-date-size: 16px;
  --wi-card-date-line-height: 22px;

  /* The card title stands in the lighter orange — not in the accent of body copy. Measured, not
   * estimated: `.news-list-item .text h3 a { color:#f2a030 }`. */
  --wi-card-title-size: 22px;
  --wi-card-title-line-height: 24px;
  --wi-card-title-size-medium: 18px; /* from 1600px */
  --wi-card-title-line-height-medium: 22px;
  --wi-card-title-size-narrow: 16px; /* from 1100px */
  --wi-card-title-line-height-narrow: 20px;

  /* The same card in the news teaser of the home page carries a title of its own size — the
   * legacy site styles `home-news-section` apart from the list. Measured with
   * `scripts/measure-bestand.sh <width> newsteaser` (content importer, work step 19): 24px on
   * 26.4px at 1920 and 1280px, 16px on 20px from 991px down; no step in between. */
  --wi-teaser-title-size: 24px;
  --wi-teaser-title-line-height: 26.4px;
  --wi-teaser-title-size-narrow: 16px; /* from 991px */
  --wi-teaser-title-line-height-narrow: 20px;

  /* Its button "All News" is the legacy `.btn` at its lightest: regular weight, 5px above and
   * below, no side padding, a fixed 135px — measured at every width, 37px high with the 2px
   * border, in 16px against the 20px of body copy. The theme's `.wi-button` is semibold, in body
   * size and with side padding, and stood 159 × 48px. */
  --wi-teaser-button-size: 16px;
  --wi-teaser-button-width: 135px;
  --wi-teaser-button-padding-block: 5px;
  /* The legacy news section spaces its heading apart from every other H2: 30px below "Latest
   * News" above 991px and 20px from there, where the global heading spacing (`--wi-space-heading`)
   * stands at 50px and steps at 1600px. Measured with `scripts/measure-bestand.sh <width>
   * newsteaser` on 2026-10-08 by narrowing down — 992px holds 30px, 991px 20px, the step of the
   * heading's own size (NA4 in AI/plans/done/nacharbeiten.md). The heading is a module of its
   * own and carries the global value; the teaser below it takes the difference back and puts its
   * button on the heading line, as the legacy site does. */
  --wi-teaser-head-space: 30px;
  --wi-teaser-head-space-narrow: 20px; /* from 991px */

  /* The list's label is a variant of its own — smaller, lighter, uppercase and in the lighter
   * orange. The post's label (`--wi-post-meta-…`) is larger, bolder and without uppercase. Both
   * are measured; the design specification had only one of them. */
  --wi-card-label-size: 14px;
  --wi-card-label-weight: var(--wi-font-weight-medium);
  /* The Bootstrap default value, which the legacy site leaves alone. Split into three parts
   * because the multi-line label from E14 fades its vertical padding: a collapsed line with
   * padding would leave an orange strip below the label, and `max-height: 0` limits the content
   * only, not the padding. */
  --wi-card-label-padding-top: 0.2em;
  --wi-card-label-padding-bottom: 0.3em;
  --wi-card-label-padding-inline: 0.6em;
  --wi-card-label-padding:
    var(--wi-card-label-padding-top)
    var(--wi-card-label-padding-inline)
    var(--wi-card-label-padding-bottom);

  /* The filter bar above the list (work step 14, E13). Measured on the legacy site on
   * `body .content .simple-tabs .nav-tabs a`: 16px, uppercase, 2px outline in `#707070`, square,
   * padding `5px 10px`; the bar itself with `margin: -10px 0 30px`, which pulls it next to the
   * heading line.
   *
   * They are the same values the pagination carries — both are the legacy site's button. They
   * stand as tokens of their own all the same, and not as a reference to `--wi-pagination-…`:
   * filter and pagination share a value today but are two things, and a reference would turn
   * every adjustment to the one into an adjustment to the other. The same consideration as with
   * the padding of the error page. */
  --wi-filter-size: 16px;
  --wi-filter-padding: 5px 10px;
  --wi-filter-gap: 5px;        /* horizontally between two filters */
  --wi-filter-gap-wrap: 10px;  /* vertically, once the bar wraps */
  --wi-filter-lift: -10px;     /* pulls the bar level with the heading line */
  --wi-filter-space: 30px;     /* gap bar -> grid when it stands below the heading */
  --wi-head-gap: 20px;         /* gap heading -> bar in the head line */

  /* The unfolding lines of the card label (E14). The height is an upper bound for the
   * transition, not a measurement: `max-height` needs a value, `auto` cannot be transitioned.
   * 3em carries two further lines — more categories than are conceivable today, and where it
   * does not suffice the number in brackets remains the complete answer. */
  --wi-card-label-more-max: 3em;
  --wi-card-label-more-space: 2px; /* gap between the label lines */

  --wi-archive-padding-block: 100px 80px;
  --wi-archive-padding-block-narrow: 50px 40px; /* from 1100px */
  --wi-archive-title-space: 50px;

  /* The legacy site does not style its pagination — it stands there in the Bootstrap blue
   * `#428bca` (E12). The values here are derived from the legacy button: the same outline, the
   * same font size, the same square shape, only narrower. */
  --wi-pagination-space: 50px;      /* gap grid -> pagination */
  --wi-pagination-gap: 5px;
  --wi-pagination-size: 16px;
  --wi-pagination-min-width: 45px;
  --wi-pagination-padding: 5px 10px;
  --wi-pagination-status-space: 20px;

  /* The error page (work step 11). Measured on the legacy site
   * (migration/bestand/seiten/404.html, retrieved 2026-08-26): the same content area as post and
   * list — `.content .content-inner` inside `section .std-content` — and therefore the same
   * padding as well. They stand as tokens of their own all the same, and not as a reference to
   * `--wi-post-…`: the three areas share a value today but are three things, and a reference
   * would turn every adjustment to the post into one to the error page. */
  --wi-404-padding-block: 100px 80px;
  --wi-404-padding-block-narrow: 50px 40px; /* from 1100px */
  --wi-404-title-space: 30px;               /* gap H1 -> explanatory sentence */
  --wi-404-text-space: 50px;                /* gap explanatory sentence -> button */

  /* The news search (AI/architecture/divi-fallstricke.md, section 1a). No legacy counterpart —
   * the legacy site has no search. Area, head, cards and pagination are the news list's; these
   * are only the form and the status line of the results. */
  --wi-search-head-space: var(--wi-space-heading-narrow); /* heading -> form, 20px at every width */
  --wi-search-form-gap: 10px;          /* field <-> button, also when wrapped */
  --wi-search-form-max-width: 720px;   /* a field across 1800px reads as a rule, not a field */
  --wi-search-input-min-width: 220px;  /* below this the button wraps under the field */
  --wi-search-form-space: var(--wi-filter-space); /* gap form -> grid, 30px as category bar -> grid */
  --wi-search-status-space: 20px;      /* on the results: gap form -> status line */

  /* The "back to top" button (work step 13). Measured on the legacy site (`#return-to-top` in
   * assets/merged.css): 50 x 50 px, fixed 60px above the bottom edge and 20px from the right
   * edge, chevron 20px white.
   *
   * On the colour: the legacy site takes `#f2a030` here, not the accent colour `#f28c00` — the
   * same lighter orange as in the dropdown hover and on the card title of the list. It therefore
   * stands as `--wi-color-accent-hover` and not as a value of its own.
   *
   * On the shape: `border-radius: 35px` stands in the same legacy rule and is overridden two
   * declarations later by `border-radius: 0px`. Square is therefore what one sees — and it fits
   * `--wi-radius`, which is 0 for the whole site. */
  --wi-to-top-size: 50px;
  --wi-to-top-bottom: 60px;
  --wi-to-top-right: 20px;
  --wi-to-top-icon: 20px;
  --wi-to-top-z: 999;
  --wi-to-top-fade: 200ms; /* the legacy fadeIn/fadeOut */

  /* The fixed funding badge bottom left (NA8 in AI/plans/done/nacharbeiten.md). Measured on
   * the rendered snapshot with `scripts/measure-bestand.sh <width> fixedlogo` on 2026-10-08,
   * identical at thirteen widths from 375 to 1920px and on the front page as on a subpage: a
   * 200px column fixed 20px from the left and 40px from the bottom, in it the 222 x 85 raster
   * `eu.png` scaled to 110 x 42 and centred, 5px above the column's bottom edge. The stylesheet
   * has further rules for `body.home … footer` and steps at 1300 and 900px; none of them renders,
   * because they address a `footer` element and the markup has a `div.footer`.
   *
   * The two values below are the IMAGE's edges (65px from the left, 45px from the bottom), not
   * the column's: the column leaves no visible trace. The height is the legacy image height,
   * about 1.1cm at 96dpi and so above the 1cm minimum of the LIFE rules (assets/brand/README.md).
   * The width follows from the two vector emblems at that height — about 125px against the
   * legacy 110: the raster squeezed both emblems into one height, the vector files keep their
   * own proportions, and the emblem rules forbid distorting them. z-index 10 as in the legacy
   * site: below the header (99), the back-to-top button (999) and the consent banner. */
  --wi-funding-badge-left: 65px;
  --wi-funding-badge-bottom: 45px;
  --wi-funding-badge-height: 42px;
  --wi-funding-badge-gap: 6px;
  --wi-funding-badge-z: 10;

  /* The download list (work package 2, T6 — M10). Measured on the RENDERED legacy site, not read
   * from its stylesheet: `scripts/measure-bestand.sh 1920 downloads` repeats the measurement at
   * any time. The difference is no formality here — the values are staggered three times over in
   * the legacy site and bite only INSIDE `.tab-content`. `.ce-uploads img` alone sets no
   * `max-width`; only `body .content .content-inner .tab-content .ce-uploads li img` does.
   * Whoever finds the first rule and not the second builds thumbnails at original width.
   *
   * Three columns, from 1100px two, from 550px one. Those are the steps of the LEGACY SITE and
   * not Divi's: the list is own markup in the child theme (E7) and not a Divi row — there is no
   * reason to fall back to 980/767 here. */
  --wi-downloads-column: 33.333%;
  --wi-downloads-column-medium: 50%;  /* from 1100px */
  --wi-downloads-column-narrow: 100%; /* from 550px */
  /* Padding per side. Between two entries that produces the 30px the news list holds as well —
   * there as `--wi-card-gap`, here as padding, because that is how the legacy site carries it. */
  --wi-downloads-gutter: 15px;
  --wi-downloads-item-space: 20px;
  --wi-downloads-preview-width: 80px;
  /* The gap thumbnail -> text stands in the legacy site as `padding-right: 1em` on the image and
   * therefore travels with the font size: measured 20px in body copy, 16px on narrow windows.
   * Adopted as `1em` so that this relation is preserved instead of freezing into a number that
   * is only right at one window size. */
  --wi-downloads-preview-gap: 1em;
  --wi-downloads-name-size: 18px;
  --wi-downloads-name-line-height: 20px;
  --wi-downloads-text-size: 16px;
  --wi-downloads-text-line-height: 20px;
  /* The description stands in BLACK in the legacy site. Until T7 this said it made 4.2:1 on the
   * dark section and fell below the threshold for body copy — that was measured wrong and is
   * corrected with E17: in the legacy site EVERY one of the six lists stands in a tab, and its
   * content area is WHITE (`scripts/measure-bestand.sh 1920 reiter`). Black on white is 21:1.
   *
   * The token stays all the same, for the case the legacy site does not know: a download list
   * WITHOUT tabs, that is, directly in a dark section. There its black would stand on `#707070`.
   * Switching to `inherit` is one line. */
  --wi-downloads-description-color: #000000;

  /* The tab group (work package 2, T7 — M11). Measured on the RENDERED legacy site:
   * `scripts/measure-bestand.sh 1920 reiter`. The probe takes both tab groups of the downloads
   * page and additionally the one of the news overview — the second is not a unit of ours (it
   * stays native), but it is the only place where the legacy site marks an active tab at all.
   * Why that counts is in E16 of the plan.
   *
   * The tab type is the legacy body copy in Bootstrap's line height: 20px with
   * `line-height: 1.42857143` yields a measured 28.5714px.
   *
   * The line height is the ONLY one in this file without a unit, and that is deliberate: in the
   * legacy site it is a ratio and not a pixel value. Stored as `28.57px` it misses the measured
   * value by 0.0014px — inconsequential in the picture, a failure in the check, and above all it
   * would stay put if the font size changed. Unitless it scales along, the way the legacy site
   * does. */
  --wi-tabs-size: var(--wi-font-size-body);
  --wi-tabs-line-height: 1.42857143;
  --wi-tabs-weight: var(--wi-font-weight-light);
  --wi-tabs-padding: 10px 15px;
  /* The tab text in the accent, as measured. The ACTIVE tab gets the lighter orange on a white
   * ground — that is not copied from the downloads page (which does not mark it at all, see
   * E16) but from the news overview, where the same intent arrives at suitable markup. The white
   * ground ties the open tab to the area below it. */
  --wi-tabs-color: var(--wi-color-accent);
  --wi-tabs-color-active: var(--wi-color-accent-hover);
  --wi-tabs-surface: var(--wi-color-surface);
  /* Gap between the tab bar and the content. The legacy site holds it as `padding-top` on the
   * open pane, not as a margin on the bar — adopted, because that puts it inside the white field
   * rather than in front of it. */
  --wi-tabs-pane-padding: 40px 0 0;

  /* The facts band (work package 2, T8 — M8). Measured on the RENDERED legacy site:
   * `scripts/measure-bestand.sh <width> zahlen`, front page, 2026-08-27. There was nothing to be
   * had from the stylesheet anyway: the band is a raw HTML element (`frame-type-html`) without a
   * single class of its own — what styles it are the hero's settings.
   *
   * Three size steps, and the steps are the LEGACY ones (1300 / 550) and not Divi's: the band is
   * own markup and not a Divi row, there is no reason to deviate here. The same consideration as
   * with the download list.
   *
   * The difference in weight is measured and looks wrong but is not: the number stands as
   * `<strong>` in the legacy markup and renders at 300, the label next to it without any markup
   * at 500. The word is therefore BOLDER than the number that was meant to be bold. Adopted as
   * measured — whoever inverts it changes the legacy site and not the unit.
   *
   * The NUMBER is larger than the label, and that was missed until 2026-10-06 (NA3 in
   * AI/plans/done/nacharbeiten.md): the probe measured the table cell, and the cell reads
   * 22px — but the number sits in a `<strong>` with a rule of its own,
   * `#section0 .csc-frame-default td p strong { font-size: 30px }`, 23px from 1300px and 19px
   * from 550px. Measured at the wrong element, then: the cell carries the label's size, the
   * `<strong>` the number's. Same steps, the line height stays at 20px for both — the legacy
   * `<strong>` inherits it from the cell, and the 40px row holds the taller glyphs. */
  --wi-facts-size: 22px;               /* the label, and the gap between number and label */
  --wi-facts-size-medium: 18px;        /* from 1300px */
  --wi-facts-size-narrow: 16px;        /* from 550px */
  --wi-facts-number-size: 30px;        /* the number, measured at the legacy `<strong>` */
  --wi-facts-number-size-medium: 23px; /* from 1300px */
  --wi-facts-number-size-narrow: 19px; /* from 550px */
  --wi-facts-line-height: 20px;
  --wi-facts-number-weight: var(--wi-font-weight-light);
  --wi-facts-label-weight: var(--wi-font-weight-medium);
  /* Line height of the band row, not of the text: the legacy site sets it as `height: 40px` on
   * every `<tr>` and centres the content in it. With a 20px text line, 10px remain above and
   * below. As a minimum height and not a fixed one: a label that becomes two lines on narrow
   * windows would otherwise fill the 40px exactly and the third line would stand outside. */
  --wi-facts-row-height: 40px;
  /* The gap between number and word. In the legacy site it is a table column of its own with an
   * `&nbsp;` in it — so it scales with the font size instead of standing fixed. Measured 6px at
   * 22px, 5px at 18px, 4px at 16px; that is the advance width of the space in Poppins and
   * corresponds to 0.27em. Hence a ratio and not a pixel value: stored as `6px` the gap would
   * stay put on a phone while the type shrinks.
   *
   * Widened to 0.5em with NA2 (client wish of 2026-10-08: "a little more space between the
   * numbers and their text"): 11px at 22px, 9px at 18px, 8px at 16px. Still a ratio, for the
   * same reason. */
  --wi-facts-gap: 0.5em;

  /* The newsletter sign-up (work package 2, T9 — M12). Exceptionally NO measured legacy value
   * stands here, and that is the finding and not the gap: in the legacy site the form carries
   * the appearance of `//cdn-images.mailchimp.com/embedcode/classic-10_7_dtp.css`, a stylesheet
   * from Mailchimp's CDN. It is not in the snapshot and, per E6, is not loaded either. What was
   * measured (`scripts/measure-bestand.sh 1920 newsletter`) is therefore the form WITHOUT its
   * clothing; what remains are Mailchimp's inline rules (600px wide, 14px Helvetica) and the
   * browser's defaults. What is adopted is the STRUCTURE, the appearance comes from the
   * vocabulary of work package 1. See E20 of the plan.
   *
   * The width is the only adopted value — the 600px stand in the embed code itself and are
   * therefore a statement of the legacy site and not of its foreign stylesheet. As a maximum and
   * not as a fixed width: set fixed, the form would run over the edge on a phone, and that is
   * exactly what it does in the legacy site. */
  --wi-newsletter-max-width: 600px;
  --wi-newsletter-field-gap: 20px;
  --wi-newsletter-label-space: 6px;

  /* 16px and not the measured 14px. Two reasons, and the second weighs more than closeness to
   * the legacy site: 14px is Mailchimp's default and not the client's, and below 16px Safari on
   * the iPhone zooms when tapping into a field — the page then stands shifted and has to be
   * pushed back by hand. */
  --wi-newsletter-size: var(--wi-font-size-body-medium);
  --wi-newsletter-line-height: var(--wi-line-height-body);
  --wi-newsletter-label-weight: var(--wi-font-weight-medium);

  /* The input field. White ground and dark type as in the legacy site — the unit stands on the
   * dark section, and a transparent field on it would not read as a field. 44px instead of the
   * measured 34px: that is the hit area below which a finger misses, and the legacy site lies
   * below it. */
  --wi-newsletter-input-height: 44px;
  --wi-newsletter-input-padding: 0 12px;
  --wi-newsletter-input-border: 1px;
  --wi-newsletter-input-border-color: var(--wi-color-rule);
  --wi-newsletter-input-surface: var(--wi-color-surface);
  --wi-newsletter-input-color: #000000;

  /* The required-field asterisk. `rgb(232, 92, 65)` in the legacy site — another Mailchimp
   * colour and none of the brand. Here the house accent, the same one the tabs carry. */
  --wi-newsletter-required-color: var(--wi-color-accent);

  /* The button follows M7 `button`: transparent, 2px outline, uppercase. Outline and type in
   * `currentColor` so that it is right in both section modes — own markup does not know the
   * section's background colour and therefore cannot use it as the type colour on hover, the way
   * M7 does. Instead of inverting it switches to the accent, and to the same one the active tab
   * carries. */
  --wi-newsletter-button-size: var(--wi-font-size-body-medium);
  --wi-newsletter-button-weight: var(--wi-font-weight-semibold);
  --wi-newsletter-button-padding: 10px 25px;
  --wi-newsletter-button-color-hover: var(--wi-color-accent-hover);
  --wi-newsletter-gate-space: 25px;

  --wi-border-width-button: 2px;
  --wi-radius: 0; /* The legacy site knows no rounding. */

  /* ---------------------------------------------------------------------
   * Divi's colour names — the bridge to the palette in the builder
   * ------------------------------------------------------------------- */

  /* Divi 5 keeps a colour palette of its own ("global colors"). If somebody picks a colour
   * there, Divi writes `var(--gcid-…)` into its stylesheet — but declares the variable only for
   * the five colours from the customizer. For custom palette colours it declares nothing;
   * measured on the rendered source of the instance on 2026-08-26. Without the lines here every
   * preset colour would have no effect, and silently at that: the CSS is there, only the value
   * is missing.
   *
   * The bridge points at the tokens above, not at hex values. That keeps it at one place per
   * colour. The names have to match the IDs in bin/lib/global-presets.php exactly — the script
   * checks that and aborts if a bridge is missing. */
  --gcid-wi-accent: var(--wi-color-accent);
  --gcid-wi-accent-hover: var(--wi-color-accent-hover);
  --gcid-wi-ink: var(--wi-color-ink);
  --gcid-wi-surface: var(--wi-color-surface);
  --gcid-wi-surface-muted: var(--wi-color-surface-muted);
  --gcid-wi-rule: var(--wi-color-rule);
  --gcid-wi-slider-active: var(--wi-color-slider-active);
  --gcid-wi-map-wildisland: var(--wi-color-map-wildisland);
  --gcid-wi-map-a: var(--wi-color-map-a);
  --gcid-wi-map-b: var(--wi-color-map-b);
  --gcid-wi-map-c: var(--wi-color-map-c);

  /* Distance that fixed elements have to keep clear of jump targets.
   * See base.css — without it anchor links land underneath the header. */
  --wi-scroll-offset: var(--wi-header-height);
}

/*
 * Divi's own layout variables — occupied here, not overridden.
 *
 * Divi 5 keeps its layout measurements as custom properties on `:root`
 * (`divi-dynamic-critical-inline-css`):
 *
 *   --section-padding:56px  --section-gutter:60px  --row-gutter-horizontal:5.5%
 *   --row-gutter-vertical:40px  --module-gutter:30px
 *
 * `--module-gutter` is the spacing between two modules of a column. Divi sets it not as a
 * `margin` on the module but as a `gap` on the column's flex container
 * (`.et_flex_column{--vertical-gap:var(--module-gutter)}`). That is why it shows up in no module
 * measurement and is nevertheless part of every spacing.
 *
 * Why it stands at 0: the legacy site knows no spacing BETWEEN elements. Measured on the
 * rendered document across five pages (`scripts/measure-bestand.sh 1920 abstaende`), every gap
 * carries the text block's margin and nothing else — 50px below a heading, 22px below a
 * paragraph, and **0px** after a tab group or a grid. Two of those three values are BELOW 30px:
 * a gap of 30px is a lower bound, and with it they would only be reachable through negative
 * margins.
 *
 * A value and not a counter-rule: Divi's own rules stay untouched, and so does the mechanism. A
 * module that an editor gives a spacing in the builder still gets it — only the unasked-for base
 * spacing falls away here. And it is the one place where a Divi change to this mechanism could
 * be caught.
 *
 * `--section-gutter` stands at 0 for the same reason and was found the same way — only later
 * (F5 of the frontend defect list). It is the gap between two ROWS of a section, and Divi sets
 * it as `gap` on the section's flex container just as it does `--module-gutter` on the column.
 * Until 2026-09-04 the note here read that it "concerns rows and columns, not the module
 * sequence, and is covered by work package 1"; it was not. Measured on the rendered instance,
 * 60px stood between two rows of one section where the legacy site holds **0** — its whole
 * spacing there comes from the text block's margin. The 60px were invisible in every module
 * measurement, exactly like the module gutter before them, and they were the larger half of
 * the gap F5 reported.
 *
 * `--row-gutter-*` stays as Divi sets it: it concerns the columns WITHIN a row and the spacing
 * they take when they wrap, which is a different question and is not part of this finding.
 */
:root {
  --module-gutter: 0px;
  --section-gutter: 0px;
}