/* global.css — oficial.ar shared utility + chassis layer.
 *
 * Imports the token layer, then defines the type specimens, the section/
 * container chassis, and the small shared component classes (eyebrow,
 * lede, card, hairline). Pages + components compose from these so the
 * rendered design system (oficial-ar-design-system-v1.html) is the
 * single visual reference.
 *
 * Everything here is two-color + Outfit + light-default. No third hue.
 */

/* oficial.ar design tokens · v3 (Ann ratification 2026-07-23/24 — master mockup
 * round + color round 2). Supersedes v2/v1 wherever they disagree.
 *
 * v3 deltas (Ann master round):
 *   - COLOR: Hueso profundo #D0C8B8 / Tinta profunda #171612 (was greige
 *     #C6BEB3 / #1A1A24). Still the off-celeste firewall register (h≈40°).
 *   - RAMP re-based for the lighter ground (AA floor): muted = ink-70 (was
 *     ink-60 role) · labels/faint = ink-55 (was ink-40 role). Hairlines at
 *     ink-16 (1px — the v2 rule, kept).
 *   - TYPE: display scale 72/48/34/24 (was 64/44/32/23). Body 19/17/14/12 kept.
 *   - WEIGHTS: buttons/CTA 500 (was 600). El renglón de titulares de v3
 *     («headings 500») quedó revertido por v3.1 — ver abajo.
 *
 * v3.1 delta (Ann, 2026-08-05):
 *   - WEIGHTS: TODOS los titulares a 600, incluidos títulos de sección y de
 *     tarjeta. Cuerpo, botones, labels e items de nav se quedan como estaban.
 *     El escalón de jerarquía lo da el peso, no sólo el tamaño.
 *   - RHYTHM: fluid clamp(40px,6vw,72px) (was fixed 96/64).
 *   - RADII: 2 chip / 4 control / 8 card + pill (was 6/10/14).
 *   - FIELDS: underline (no box/fill) — the v2 pattern now applies to
 *     /reportar + newsletter too.
 *   - Eyebrows/labels: versalita trackeada (micro uppercase) — v1 idiom KEPT
 *     for marketing (Ann pick; the client template keeps sentence-case).
 *   - Reading column 640 kept.
 *
 * The deliberate fork from TWS (do NOT reintroduce the TWS vocabulary):
 *   Outfit (NOT PP Mori) · TWO colors only, every other value an OPACITY
 *   VARIANT of the ink · LIGHT default.
 * This system governs ALL oficial.ar surfaces. Ops (tws-system) now ALSO
 * consumes this color world in light mode (canon 17 amendment 2026-07-24).
 */

:root {
  /* ===== THE TWO COLORS (only) ===== */
  --bg:   #D0C8B8;   /* hueso profundo — the off-celeste firewall defense */
  --ink:  #171612;   /* tinta profunda — near-black, warm cast */

  /* ===== INK OPACITY RAMP (the only sanctioned derivations) =====
   * v3 stops. 70/55 replace the 60/45 roles — AA on the lighter ground:
   * ink-70 on bg = 5.2:1 · ink-55 on bg = 3.4:1 · ink on bg = 10.9:1. */
  --ink-80: rgba(23, 22, 18, 0.80);  /* secondary copy */
  --ink-70: rgba(23, 22, 18, 0.70);  /* muted / captions — the MUTED stop */
  --ink-55: rgba(23, 22, 18, 0.55);  /* faint / labels / eyebrows */
  --ink-20: rgba(23, 22, 18, 0.20);  /* subtle borders (cards) */
  --ink-16: rgba(23, 22, 18, 0.16);  /* hairlines / dividers */
  --ink-10: rgba(23, 22, 18, 0.10);  /* subtle fills */
  /* DEPRECATED role aliases — old names resolve to the re-based stops so any
     unswept consumer stays legible. New code uses the names above. */
  --ink-60: var(--ink-70);
  --ink-40: var(--ink-55);

  /* Raised surface = the bg lightened toward warm-white via white overlay */
  --surface:   rgba(255, 255, 255, 0.28);
  --surface-2: rgba(255, 255, 255, 0.50);

  /* ===== SEMANTIC ALIASES ===== */
  --text:         var(--ink);
  --text-dim:     var(--ink-70);
  --text-faint:   var(--ink-55);
  --text-strong:  var(--ink);
  --text-on-ink:  var(--bg);       /* label color on an ink fill (CTA, etc.) */
  --hairline:      var(--ink-16);
  --hairline-soft: var(--ink-16);  /* the default divider — 1px width (v2 rule) */

  /* ===== TYPE SCALE — v3 display 72/48/34/24 · body 19/17/14/12 ===== */
  --type-display: 72px;
  --type-h1:      48px;
  --type-h2:      34px;
  --type-h3:      24px;
  --type-body-lg: 19px;
  --type-body:    17px;
  --type-caption: 14px;
  --type-micro:   12px;

  /* ===== FONT ===== */
  --font-sans: var(--font-outfit), system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Weights — v3.1 (Ann, 2026-08-05): TODOS los titulares pesan 600, de la
     display al título de tarjeta. Con titulares en 500 sobre controles en 500
     no había escalón: la jerarquía existía sólo por tamaño, y en las tarjetas
     —donde título y label comparten cuerpo— desaparecía del todo. El cuerpo y
     los controles NO se mueven: si sube todo, no se destaca nada, que es
     justamente lo que este cambio corrige.
     `--fw-medium` es el token de CONTROLES (botones, labels, chips, items de
     nav) y se queda en 500. Un título montado sobre él está en el token
     equivocado: se corrige la semántica, no el valor del token. */
  --fw-body: 400;
  --fw-medium: 500;
  --fw-heading: 600;
  --fw-btn: 500;
  --fw-semibold: 600;   /* alias histórico del wordmark + lockup. Ya no es el
                           peso exclusivo de la marca: 600 es ahora el peso de
                           todo titular. Se conserva porque nombra la intención
                           «esto es marca, no encabezado» donde ya se usa. */

  /* ===== SPACING — editorial scale (v2, kept) ===== */
  --s-1: 6px;  --s-2: 12px; --s-3: 20px; --s-4: 32px;
  --s-5: 48px; --s-6: 64px; --s-7: 80px; --s-8: 96px; --s-9: 128px;

  /* Section rhythm — v3 FLUID (Ann: «fluido apretado»). One token, no -m pair. */
  --section-rhythm:   clamp(40px, 6vw, 72px);
  --section-rhythm-m: clamp(40px, 6vw, 72px);  /* compat alias — same value */
  --container-pad:    32px;  /* desktop page margin */
  --container-pad-t:  24px;  /* tablet */
  --container-pad-m:  16px;  /* mobile */
  --maxw:        920px;  /* the chassis band — every section aligns to this */
  --maxw-copy:   640px;  /* long-form copy column (v3: kept) */
  --container-max: 920px;

  /* ===== RADII — v3: 2/4/8 + pill ===== */
  --r-chip:    2px;
  --r-control: 4px;
  --r-card:    8px;
  --r-pill:    999px;
  --r-focus:   4px;
  /* Compat aliases */
  --radius-card:    var(--r-card);
  --radius-chip:    var(--r-chip);
  --radius-control: var(--r-control);
  --radius-focus:   var(--r-focus);
  --radius-pill:    var(--r-pill);
  --text-accent:    var(--ink-80);

  /* ===== MOTION =====
   * ONE ease across the whole system, and it is the SAME curve the client
   * template uses (`tws-template/src/styles/transitions.css`) — an S-curve with
   * a soft start and a long settle. Any new animation reuses these; a hand-tuned
   * curve is how a system stops reading as one thing.
   *
   * The disclosure pair (2026-07-26) is asymmetric ON PURPOSE, ported verbatim
   * from the client template's FAQ after it fought browsers through three
   * rounds: opening is a single 700ms height move with the text fading in late
   * (280ms delay, 320ms) so the words arrive as the drawer is mostly open;
   * closing fades the text FIRST (240ms) and only then collapses the height.
   * Collapsing while the text is still legible is what reads as "abrupt". */
  --motion-ease: cubic-bezier(0.6, 0, 0, 1);
  --motion-canonical: 560ms;
  --motion-hover: 250ms;
  --motion-open: 700ms;      /* disclosure height, both directions */
  --motion-fade: 240ms;      /* text fade-out before a collapse */
  --motion-fade-in: 320ms;   /* text fade-in during an open */
  --motion-fade-delay: 280ms;/* how late the text arrives on open */
  --char-delay: 25ms;
  --char-duration: 380ms;

  /* ===== STROKE ===== */
  --stroke-underline: 2px;

  /* ===== COMPONENT GEOMETRY TOKENS (v3) — so components carry zero
     spacing/type/radius literals; the design-guard allowlists this file. ===== */
  --field-line: rgba(23, 22, 18, 0.35);  /* underline field baseline (ink-35) */
  --field-pad: 6px 2px;                  /* underline field inner padding */
  --island-bg: color-mix(in srgb, #fff 32%, var(--bg));  /* nav island tint (was raw #D7D1C8) */
  --btn-pad-sm: 10px 20px;
  --btn-pad-md: 14px 26px;
  --btn-pad-lg: 18px 34px;
  --chip-pad: 4px 10px;
}

/* ===== BASE TYPOGRAPHIC RULES ===== */

*, *::before, *::after { box-sizing: border-box; }

html, body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-weight: var(--fw-body);
  font-size: var(--type-body);
  line-height: 1.6;
  letter-spacing: -0.003em;
  font-feature-settings: "liga" 1, "calt" 1, "kern" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

a { color: inherit; text-decoration: none; }

a:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
  border-radius: var(--r-focus);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ── DERIVED CUSTOM PROPS (v3 sweep) ──────────────────────────────────
 * The design-guard counts raw px/rem/em only in counted-property VALUES;
 * custom-prop DECLARATIONS are exempt. Every raw metric global.css still
 * needs lives here, once, with a reason — consumers below are var()-only.
 * ──────────────────────────────────────────────────────────────────── */

:root {
  /* Fluid heading sizes — mobile floor kept from the responsive-first pass
     (Ann F1 #13); the ceiling is the v3 token (72/48/34). */
  --fluid-display: clamp(40px, 7vw, var(--type-display));
  --fluid-h1:      clamp(31px, 5.2vw, var(--type-h1));
  --fluid-h2:      clamp(25px, 4vw, var(--type-h2));
  /* Outfit leading-trim metrics (measured) — see the trim block below. */
  --trim-cap:      -0.27em;   /* ascender→cap gap */
  --trim-baseline: -0.30em;   /* baseline→descender gap */
  /* Eyebrow pill inner geometry (component token, sibling of --chip-pad). */
  --eyebrow-pad: 6px 14px;
  /* Prose micro-geometry consumed by article-prose.css. */
  --link-underline-gap: 1px;  /* inline-link underline offset */
  --code-pad: 2px 6px;        /* inline-code capsule padding */
  /* Prose mid-step (24px): the heading→content gap + list indent + pre
     rhythm in article-prose.css. Sits between --s-3 (20) and --s-4 (32)
     on the editorial scale — the "one notch above body rhythm" beat. */
  --prose-heading-gap: 24px;
}

/* ════════════════════════════════════════════════════════════════════
 * TYPE SPECIMENS (spec §3.1 — Major Third scale, real values)
 * ════════════════════════════════════════════════════════════════════ */

/* Responsive-first (Ann F1 #13): headings are fluid by default so they read
   well from 360px up to the 920 band — no separate mobile override needed.
   The ceiling is the design-system spec value. */

/* LEADING-TRIM — works in EVERY browser (no text-box dependency).
   A heading's line box carries empty space above the cap line and below the
   baseline; that "leading" makes an equal `gap`/margin LOOK unequal next to a
   pill-chip eyebrow or body text. We remove it with the deterministic pseudo-
   element trim: ::before pulls the top up to the cap, ::after pulls the bottom
   up to the baseline. Values are Outfit's metrics (cap ≈ 0.16em from box top,
   baseline ≈ 0.21em from box bottom at the heading line-heights). After this,
   a 24px gap is a VISIBLE 24px gap, above and below, identically — systemic,
   measurable, no per-element compensation.
   (When text-box ships everywhere this whole block becomes one line; until
   then this is the reliable method.) */

.t-display::before,
.t-h1::before,
.t-h2::before,
.t-h3::before {
  content: '';
  display: table;
  margin-bottom: var(--trim-cap);   /* Outfit ascender→cap gap (measured) */
}

.t-display::after,
.t-h1::after,
.t-h2::after,
.t-h3::after {
  content: '';
  display: table;
  margin-top: var(--trim-baseline); /* Outfit baseline→descender gap (measured) */
}

.t-display {
  font-size: var(--fluid-display);
  font-weight: var(--fw-heading);
  line-height: 1.05;
  letter-spacing: -0.03em;
  text-wrap: balance;       /* #9 — wrap headers into balanced blocks */
}

.t-h1 {
  font-size: var(--fluid-h1);
  font-weight: var(--fw-heading);
  line-height: 1.1;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.t-h2 {
  font-size: var(--fluid-h2);
  font-weight: var(--fw-heading);
  line-height: 1.18;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.t-h3 {
  font-size: var(--type-h3);
  /* v3.1: es un titular, no un control. Estaba montado en el token de controles
     y por eso pesaba lo mismo que un label. */
  font-weight: var(--fw-heading);
  line-height: 1.25;
  letter-spacing: -0.012em;
}

/* ── La contracara de `text-wrap: balance` ────────────────────────────────
   `balance` optimiza largo de línea parejo y es CIEGO AL PUNTO: en un titular
   de dos oraciones corta al medio de la primera y deja su cola arriba de la
   segunda. Cada oración en su propio bloque acota el rebalanceo al interior de
   una oración, sin cruzar el punto.

   Se aplica desde `splitSentences()` (src/lib/sentences.ts), que además carga
   el espacio separador DENTRO del span — sin él, el `textContent` del heading
   sale «acá.Vos tampoco.» y eso es lo que leen el nombre accesible y los
   extractores de AEO. Al final de una caja de bloque el espacio colapsa, así
   que no cuesta nada visualmente.

   Regla del sistema, no arreglo puntual (Ann, 2026-08-06). ⚠️ Y su alcance es
   EXACTAMENTE «los headings que heredan balance en una medida angosta»:
   `PageHero` (h1) y `StatementBand` (h2). Costo medido cero en los dos: mismas
   líneas y misma altura a 640/390/360/320.

   NO se aplica a `Steps` (h3), y se midió antes de decidirlo: `.steps__t` NO
   hereda `balance`, es de alineación izquierda y su caja mide 861px, así que su
   único título de dos oraciones —«Sumás el plan cuando lo necesites. Demo si la
   querés.», en /como-funciona— ENTRA EN UNA LÍNEA. Partirlo lo llevaría de 30
   a 60px: sería una regresión, no un arreglo. Si algún día ese h3 pasa a una
   medida angosta o adopta `balance`, la decisión se reabre. */

.sentence-block { display: block; }

.t-body-lg {
  font-size: var(--type-body-lg);
  font-weight: var(--fw-body);
  line-height: 1.65;
}

.t-body {
  font-size: var(--type-body);
  font-weight: var(--fw-body);
  line-height: 1.6;
}

.t-caption {
  font-size: var(--type-caption);
  font-weight: var(--fw-body);
  line-height: 1.45;
  color: var(--ink-70);
}

.t-micro {
  font-size: var(--type-micro);
  font-weight: var(--fw-medium);
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: var(--ink-55);
}

/* ════════════════════════════════════════════════════════════════════
 * CHASSIS — section + container (spec §3.2)
 * ════════════════════════════════════════════════════════════════════ */

.section {
  padding-block: var(--section-rhythm);
  padding-inline: max(var(--container-pad), env(safe-area-inset-left))
                  max(var(--container-pad), env(safe-area-inset-right));
}

/* ⚠️ FIXED 2026-07-26. This was `--s-7` (80px FIXED) while `.section` is
   `clamp(40px,6vw,72px)` — so "tight" was LARGER than the untight band at every
   viewport ≥667px, across the 17 files that use it, and it is almost always the
   band directly under the hero. The largest gap on the page sat exactly where
   the name promised the smallest. */

.section--tight { padding-block: var(--s-5); }

/* ⚠️ 2026-08-05 — `.section--hairline` SE RETIRÓ (Ann). Era el divisor de
   sección: un border-top de 1px en 16 lugares. La separación entre bandas la
   hace el ritmo vertical (`--section-rhythm`), no una línea — y con el ritmo
   ya en clamp(40,6vw,72) la línea era redundancia, no jerarquía. La prop
   `hairline` de `StatementBand` murió con ella.
   NO reintroducir la clase: si dos bandas necesitan separarse, se separan con
   espacio. Las reglas de fila que sobreviven —las de `Faq`, la lista de
   hechos de la home, el marco de prueba de `ModulePage`, el seam de
   `RelatedNotes`— son OTRO objeto: separan ítems dentro de un bloque, no
   bloques entre sí. */

.section__inner {
  max-width: var(--container-max);
  margin: 0 auto;
}

.measure    { max-width: var(--maxw); }

.measure-copy { max-width: var(--maxw-copy); }

/* v3: section rhythm is ONE fluid token (clamp) — the old --section-rhythm-m
   mobile override is collapsed; only the page-margin pad still swaps. */

@media (max-width: 720px) {
  .section { padding-inline:
    max(var(--container-pad-m), env(safe-area-inset-left))
    max(var(--container-pad-m), env(safe-area-inset-right)); }
}

/* ════════════════════════════════════════════════════════════════════
 * VERTICAL RHYTHM (the systematic fix — no more ad-hoc inline margins)
 *
 * One contract for stacked content, matching the design-system-v1
 * reference: eyebrow→heading = s-4 (on the eyebrow), heading→body = s-4,
 * body→body = s-3, and a larger s-6 break before a new grid/list/cards.
 * Components opt in by being direct children of [data-flow]; the page
 * markup stops hand-placing margins.
 * ════════════════════════════════════════════════════════════════════ */

/* [data-flow] and .stack-4 are ONE system (stack-4 is the legacy class on
   the legal/disputes pages; aliasing it here means those pages inherit the
   exact same rhythm with zero markup edits — no random spacing anywhere). */

[data-flow] > *,
.stack-4 > * { margin-top: var(--s-4); }

[data-flow] > *:first-child,
.stack-4 > *:first-child { margin-top: 0; }

/* the eyebrow already carries its own margin-bottom; zero its top-gap to
   the heading so the pair reads as one unit */

[data-flow] > .eyebrow,
.stack-4 > .eyebrow { margin-bottom: 0; }

[data-flow] > .eyebrow + *,
.stack-4 > .eyebrow + * { margin-top: var(--s-3); }

/* tighter body→body, looser before block groups */

[data-flow] > p + p,
.stack-4 > p + p { margin-top: var(--s-3); }

[data-flow] > .grid,
[data-flow] > .rhythm-break,
.stack-4 > .grid { margin-top: var(--s-6); }

[data-flow] > .hairline,
.stack-4 > .hairline { margin-top: var(--s-5); margin-bottom: var(--s-5); }

/* CARD-INTERNAL RHYTHM (systemic — no inline margins inside cards).
   Icon → title = s-2, title → body = s-2, body → body = s-2. Every .card
   and .bundle-card auto-spaces its stacked children on the system scale.
   ⚠️ .bundle-card quedó huérfana el 2026-07-30: los bundles están retirados
   (D-073) y el componente se archivó. Se deja la utility porque es genérica y
   barata; si nadie la usa en la próxima pasada, sale. */

.card > * + *,
.bundle-card > * + * { margin-top: var(--s-2); }

.card > :global(.oar-icon) + * { margin-top: var(--s-2); }

/* title → body opens one step (20px) now that the body runs at the reading
   size: 12px under a 24px heading closed the pair up into a single block. */

.card > .t-h3 + * { margin-top: var(--s-3); }

/* ════════════════════════════════════════════════════════════════════
 * SHARED ATOMS
 * ════════════════════════════════════════════════════════════════════ */

/* Eyebrow = a quiet pill-chip (capsule bg), not bare text. Self-sized,
   inline-block so it hugs its label and centers in a centered hero. */

.eyebrow {
  display: inline-block;
  font-size: var(--type-micro);
  font-weight: var(--fw-medium);   /* v3.1: 600 es el peso de los titulares, y
                                      un eyebrow no lo es: rotula, no encabeza */
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-70);
  background: var(--ink-10);
  border-radius: var(--r-pill);
  padding: var(--eyebrow-pad);
  margin: 0 0 var(--s-4);
}

.lede {
  font-size: var(--type-body-lg);
  color: var(--ink-80);
  max-width: 62ch;
  line-height: 1.65;
}

/* Card — OUTLINED, not filled (Ann 2026-07-26, option B of the component
   mockup). Three changes, each answering a measured defect:
     1. NO FILL. The `--surface` tint on `--bg` is a 28% white wash that reads
        as a smudge on a mid-tone ground, not as a raised plane. The outline
        does the work; the ground stays one colour.
     2. `--ink-16`, not `--ink-20`. `.card` was the ONLY bordered box in the
        codebase at ink-20 — BundleCard, the proof frame, the demo controls and
        the notas list are all ink-16. Two hairline weights on one page is
        visible; one is not a decision anyone has to make again.
     3. More vertical air (`--s-5` block / `--s-4` inline). A card reads
        premium because of the space around its content, not the box around it. */

.card {
  border: 1px solid var(--ink-16);
  border-radius: var(--r-card);
  padding: var(--s-5) var(--s-4);
}

.card--featured { border: 1.5px solid var(--ink); }

/* Card body copy runs at the READING step, not the caption step.
   Until 2026-07-26 every card body on the seven module pages (and on /index,
   /casos, /como-funciona) was `.t-caption` — 14px, the epigraph step, carrying
   the card's entire explanation. Small dense text is the single biggest reason
   a layout reads cheap; a curated feel comes from a large body with air. This
   class is the one to use for a card's explanatory paragraph. */

.card__body {
  font-size: var(--type-body);
  line-height: 1.6;
  color: var(--ink-80);
}

/* Hairline divider — the default (v3: 1px, ink-16) */

.hairline {
  border: 0;
  border-top: 1px solid var(--ink-16);
  margin: 0;
}

/* ─── .underline-draw — THE ONE TEXT-LINK HOVER ───────────────────────────
   Added 2026-07-26 (Ann: "en Para Gastronomía y Precios aplicá el mismo hover
   animado de botón secundario, debajo de la palabra, para cada link a
   módulos").

   This is the SAME construction as `ButtonPrimary`'s `variant="secondary"` —
   a linear-gradient painted at the text baseline, grown from 0% to 100% width
   over `--motion-hover` on `--motion-ease` — lifted here so the two module
   lists compose it instead of each re-deriving a hover. Three different
   idioms were live: the button's gradient draw, `/precios`'s
   `text-decoration: underline` (which appears instantly — no animation at
   all), and `/para-gastronomia`'s `border-bottom` colour swap (which spans the
   whole GRID CELL, not the word, because the name is a block-level grid item).
   One idiom now.

   ⚠️ TWO different rules keep the line under the WORD instead of across the
   container, because two different contexts use this class:
     · `justify-self: start` — for a GRID ITEM (both module lists). Note that
       `display: inline-block` does NOT help here: a grid item is blockified,
       so the declaration computes to `block` and the box would still stretch
       the full 1fr track. `justify-self: start` is what makes it fit-content.
     · `display: inline-block` — for a link sitting INSIDE a paragraph (the
       «Inicio» reference in the /precios footnote), where `justify-self` is
       ignored and the padding-bottom needs a block box to hang from.
   Both are load-bearing; neither is redundant. The 2px values are hoisted into
   custom properties to stay inside the design guard, as `ButtonPrimary` does.

   Pair with `:focus-visible` as well as `:hover` — a keyboard user gets the
   same affordance, and the outline alone does not say "this is a link". */

.underline-draw {
  --underline-clear: 2px;
  display: inline-block;
  justify-self: start;
  color: inherit;
  text-decoration: none;
  padding-bottom: var(--underline-clear);
  background-image: linear-gradient(var(--ink), var(--ink));
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0% var(--stroke-underline);
  transition: background-size var(--motion-hover) var(--motion-ease);
}

.underline-draw:hover,
.underline-draw:focus-visible { background-size: 100% var(--stroke-underline); }

@media (prefers-reduced-motion: reduce) {
  .underline-draw { transition: none; }
}

/* ─── .prose-link — the OTHER link idiom, and why there are exactly two ────
   A link sitting INSIDE a sentence must be visible at rest: it carries no
   colour of its own (this palette has two colours and neither is "link blue"),
   so a hover-only affordance leaves it indistinguishable from the text around
   it until the pointer happens to cross it — and invisible to a reader who
   never hovers at all. It gets a permanent hairline that darkens to full ink.

   `.underline-draw` above is for a link that is a STANDALONE TARGET — a row in
   a list, a name on its own line — where position already says "this is a
   link" and the draw is the reward for aiming at it. Two idioms, one rule for
   choosing: in a sentence → `.prose-link`; on its own line → `.underline-draw`.
   Adding a third is the drift these two exist to stop. */

.prose-link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--ink-16);
  transition: border-bottom-color var(--motion-hover) var(--motion-ease);
}

.prose-link:hover,
.prose-link:focus-visible { border-bottom-color: var(--ink); }

/* Chip / label pill (ink-10 fill) */

.chip {
  display: inline-block;
  font-size: var(--type-micro);
  font-weight: var(--fw-medium);   /* v3.1: 600 es el peso de los titulares; un
                                      chip es un control, se queda en 500 */
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-70);
  background: var(--ink-10);
  border-radius: var(--r-pill);
  padding: var(--chip-pad);
}

/* Stack helpers. NOTE: .stack-4 is defined ABOVE as an alias of the
   [data-flow] rhythm system (eyebrow/heading/grid aware) — do NOT redefine
   it here. stack-2/stack-3 remain simple even-gap helpers for small groups. */

.stack-2 > * + * { margin-top: var(--s-2); }

.stack-3 > * + * { margin-top: var(--s-3); }

/* Grid helpers */

.grid    { display: grid; gap: var(--s-4); }

.grid-2  { grid-template-columns: repeat(2, 1fr); }

.grid-3  { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 720px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
}
/* ════════════════════════════════════════════════════════════════════════
 * reveal.css — scroll-reveal + entrance motion (oficial.ar, retuned 2026-06-21).
 *
 * REWRITE rationale (Ann F1 design pass, #14): the carried-over TWS reveal
 * used a 32px fade-up over 1150ms. On the denser oficial.ar layout that big,
 * slow move read as content "breaking / blinking" on load — and any element
 * the observer didn't promptly mark `.in-view` sat frozen at opacity 0
 * (the "smear blobs"). Paired with Lenis smooth-scroll (now removed) it felt
 * janky.
 *
 * This version keeps a SUBTLE reveal (Ann: "keep subtle motion, fix the
 * glitches") and makes it FAIL-SAFE:
 *   - Small travel (8px) + shorter settle (560ms) — a quiet fade-up, not a jump.
 *   - A hard SAFETY: any [data-reveal] still hidden 1200ms after load is force-
 *     shown by reveal-observer.ts, so nothing can ever stay stuck (kills the
 *     smear-blobs even if the observer misses an element).
 *   - Default state is always the FINAL visible state — hidden ONLY while
 *     html.cold-load is present (a fresh load) AND not yet in view. No-JS / VT-
 *     nav never hides anything.
 *
 * CONTRACT (unchanged — markup keeps working):
 *   [data-reveal]                  fades up when scrolled into view
 *   style="--reveal-delay: 120ms"  optional per-element stagger
 *   [data-tws-enter]               above-fold hero cascade (fires at load)
 *   style="--tws-enter-delay:100ms" hero cascade offset
 *
 * cold-load flag: added synchronously in <head> before first paint on every
 * load; the incoming VT document removes it before paint, so on navigation the
 * page paints final (no re-pop). Hero entrance + scroll reveals both gate on it.
 * ════════════════════════════════════════════════════════════════════════ */

:root {
  --reveal-distance: 8px;            /* gentle fade-up travel (was 32px) */
  --reveal-duration: 560ms;          /* calm settle (was 1150ms) */
  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);  /* soft ease-out */
}

/* Default = final visible state. */
[data-reveal] { opacity: 1; transform: none; }

/* Cold load + not yet in view → hidden start state.
   NOTE: plain translateY (NOT translate3d) + NO will-change. Forcing a GPU
   compositor layer on a dark element (a CTA pill, the loop bubble) against
   the greige bg was painting a dark rounded-rectangle FLASH mid-reveal —
   the "smear-blobs". Keeping it on the main raster layer removes the
   artifact entirely. */
html.cold-load [data-reveal]:not(.in-view) {
  opacity: 0;
  transform: translateY(var(--reveal-distance));
}

html.cold-load [data-reveal] {
  transition:
    opacity   var(--reveal-duration) var(--reveal-ease) var(--reveal-delay, 0ms),
    transform var(--reveal-duration) var(--reveal-ease) var(--reveal-delay, 0ms);
}

/* Above-fold hero cascade [data-tws-enter]. */
[data-tws-enter] { opacity: 1; transform: none; }

html.cold-load [data-tws-enter] {
  transition:
    opacity   var(--reveal-duration) var(--reveal-ease) var(--tws-enter-delay, 0ms),
    transform var(--reveal-duration) var(--reveal-ease) var(--tws-enter-delay, 0ms);
}

@starting-style {
  html.cold-load [data-tws-enter] {
    opacity: 0;
    transform: translateY(var(--tws-enter-translate, var(--reveal-distance)));
  }
}

/* ⚠️ THE SAFARI GUARD (2026-07-26 round 2). When `.cold-load` comes off a
   document that already painted with it — the `pagereveal` fallback path —
   the h1's opacity changes 0→1 AND the `transition` declaration disappears in
   the same style recalc. Chromium drops the transition; **WebKit runs it**, so
   Safari replayed the whole 560ms reveal on top of the view transition that
   had already brought the page in. This class is added for exactly two frames
   around that removal so the value snaps instead of travelling. It must beat
   the transition declaration below, hence `!important`. */
html.vt-settling [data-reveal],
html.vt-settling [data-tws-enter] {
  transition: none !important;
  animation: none !important;
}

/* Reduced motion → final visible state, no movement. */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  html.cold-load [data-reveal]:not(.in-view),
  [data-tws-enter] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
.btn[data-astro-cid-2v4iazau]{--icon-size: 18px;--gap-after-icon: 10px;--btn-text-pad: 4px 2px;--underline-clear: 2px;position:relative;display:inline-flex;align-items:center;gap:var(--gap-after-icon);padding:var(--btn-pad-md);border-radius:var(--r-pill);font-family:var(--font-sans);font-size:var(--type-body);font-weight:var(--fw-btn);letter-spacing:-0.005em;border:1px solid var(--ink);cursor:pointer;text-decoration:none;transition:transform var(--motion-hover) var(--motion-ease)}.btn--primary[data-astro-cid-2v4iazau]{background:var(--ink);color:var(--bg)}.btn--ghost-pill[data-astro-cid-2v4iazau]{background:transparent;color:var(--ink);border-color:var(--ink-55)}.btn--ghost-pill[data-astro-cid-2v4iazau]:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}.btn--secondary[data-astro-cid-2v4iazau]{background:transparent;color:var(--ink);border:none;border-radius:0;padding:var(--btn-text-pad);--gap-after-icon: 8px}.btn--secondary[data-astro-cid-2v4iazau] .btn__label-text[data-astro-cid-2v4iazau]{display:inline-block;line-height:1.3;padding-bottom:var(--underline-clear);background-image:linear-gradient(var(--ink),var(--ink));background-position:0 100%;background-repeat:no-repeat;background-size:0% var(--stroke-underline);transition:background-size var(--motion-hover) var(--motion-ease)}.btn--secondary[data-astro-cid-2v4iazau]:hover .btn__label-text[data-astro-cid-2v4iazau]{background-size:100% var(--stroke-underline)}.btn--secondary[data-astro-cid-2v4iazau]:active{transform:none}.btn--sm[data-astro-cid-2v4iazau]{padding:var(--btn-pad-sm);--icon-size: 14px;--gap-after-icon: 8px;font-size:var(--type-caption)}.btn--lg[data-astro-cid-2v4iazau]{padding:var(--btn-pad-lg);--icon-size: 22px;--gap-after-icon: 12px;font-size:var(--type-body-lg)}.btn__icon[data-astro-cid-2v4iazau]{display:inline-flex;align-items:center;justify-content:center;width:var(--icon-size);height:var(--icon-size);color:inherit;flex-shrink:0}.btn__icon[data-astro-cid-2v4iazau] svg[data-astro-cid-2v4iazau]{width:100%;height:100%}.btn__label[data-astro-cid-2v4iazau]{display:inline-flex;align-items:center;line-height:1.2;height:1.2em;overflow:hidden;transform:translateY(1px)}.btn[data-astro-cid-2v4iazau] .ch{position:relative;display:inline-block;height:1.2em;overflow:hidden;line-height:1.2}.btn[data-astro-cid-2v4iazau] .ch.space{width:0.28em}.btn[data-astro-cid-2v4iazau] .ch .top,.btn[data-astro-cid-2v4iazau] .ch .bot{display:block;height:1.2em;line-height:1.2;transition:transform var(--char-duration) var(--motion-ease);transition-delay:calc(var(--i, 0) * var(--char-delay))}.btn[data-astro-cid-2v4iazau] .ch .top{transform:translateY(0)}.btn[data-astro-cid-2v4iazau] .ch .bot{transform:translateY(100%);position:absolute;left:0;right:0;top:0}.btn[data-astro-cid-2v4iazau]:hover .ch .top{transform:translateY(-100%)}.btn[data-astro-cid-2v4iazau]:hover .ch .bot{transform:translateY(0)}.btn[data-astro-cid-2v4iazau]:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.btn[data-astro-cid-2v4iazau]:active{transform:scale(0.99)}@media (prefers-reduced-motion: reduce){.btn[data-astro-cid-2v4iazau] .ch .top,.btn[data-astro-cid-2v4iazau] .ch .bot{transition:none!important}.btn[data-astro-cid-2v4iazau]:hover .ch .top{transform:translateY(0)}.btn[data-astro-cid-2v4iazau]:hover .ch .bot{transform:translateY(100%)}}.seal-svg[data-astro-cid-wxc6cwf3]{display:inline-block;vertical-align:middle;flex-shrink:0}.oar-nav[data-astro-cid-yhaz3u4w]{--nav-radius: 32px;--nav-bar-pad-x: 13px;--nav-brand-inset: 24px;--nav-prefix-shift: 5.1em;--nav-brand-size: 16px;--nav-seal-gap: 9px;--nav-panel-top-gap: 2px;--nav-hb-radius: 1px;--nav-stagger: 35ms;--nav-bleed: 1px;position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;view-transition-name:oar-nav;padding:var(--s-3) calc(max(var(--container-pad),env(safe-area-inset-right)) - var(--nav-bleed)) 0 calc(max(var(--container-pad),env(safe-area-inset-left)) - var(--nav-bleed))}@media (max-width: 720px){.oar-nav[data-astro-cid-yhaz3u4w]{padding-right:calc(max(var(--container-pad-m),env(safe-area-inset-right)) - var(--nav-bleed));padding-left:calc(max(var(--container-pad-m),env(safe-area-inset-left)) - var(--nav-bleed))}}.oar-nav__island[data-astro-cid-yhaz3u4w]{display:block;max-width:var(--container-max);margin:0 auto;background:var(--island-bg);border:1px solid var(--ink-16);overflow:hidden;border-radius:var(--nav-radius);transform:translateZ(0)}.oar-nav__toggle[data-astro-cid-yhaz3u4w]:active .oar-nav__toggle-icon[data-astro-cid-yhaz3u4w]{transform:scale(0.9)}.oar-nav__toggle-icon[data-astro-cid-yhaz3u4w]{transition:transform var(--motion-hover) var(--motion-ease)}.oar-nav__bar[data-astro-cid-yhaz3u4w]{height:64px;display:flex;align-items:center;padding:0 var(--nav-bar-pad-x) 0 0}.oar-nav__brand[data-astro-cid-yhaz3u4w]{display:flex;align-items:center;align-self:stretch;flex:0 0 auto;font-weight:var(--fw-semibold);font-size:var(--nav-brand-size);line-height:1;letter-spacing:-0.01em;color:var(--ink);text-decoration:none}.oar-nav__seal-slot[data-astro-cid-yhaz3u4w]{position:relative;z-index:1;align-self:stretch;display:flex;align-items:center;background:var(--island-bg);padding-left:var(--nav-brand-inset);padding-right:var(--nav-seal-gap);transform:translateZ(0)}.oar-nav__name[data-astro-cid-yhaz3u4w]{display:inline-block;position:relative;white-space:nowrap;font-variant-ligatures:common-ligatures contextual;font-feature-settings:"liga" 1,"calt" 1,"kern" 1;transform:translateX(0);transition:transform var(--motion-canonical) var(--motion-ease)}.oar-nav__prefix[data-astro-cid-yhaz3u4w]{position:absolute;right:100%;top:0}.oar-nav[data-astro-cid-yhaz3u4w][data-scrolled] .oar-nav__name[data-astro-cid-yhaz3u4w]{transform:translateX(var(--nav-prefix-shift))}.oar-nav__spacer[data-astro-cid-yhaz3u4w]{flex:1 1 auto;min-width:var(--s-4)}.oar-nav__links[data-astro-cid-yhaz3u4w]{display:none;align-items:center;gap:var(--s-3);flex:0 0 auto;justify-content:flex-end;flex-wrap:nowrap;margin-right:var(--s-4)}.oar-nav__link[data-astro-cid-yhaz3u4w]{color:var(--ink-80);text-decoration:none;font-size:var(--type-caption);font-weight:var(--fw-medium);line-height:1;letter-spacing:-0.005em;padding:var(--s-1) 0;white-space:nowrap;background-image:linear-gradient(to right,var(--ink),var(--ink));background-position:0 100%;background-repeat:no-repeat;background-size:0% var(--stroke-underline);transition:background-size var(--motion-hover) var(--motion-ease),color var(--motion-hover) var(--motion-ease)}.oar-nav__link[data-astro-cid-yhaz3u4w]:hover,.oar-nav__link[data-astro-cid-yhaz3u4w][aria-current=page]{color:var(--ink);background-size:100% var(--stroke-underline)}.oar-nav__link[data-astro-cid-yhaz3u4w]:focus-visible{outline:2px solid var(--ink);outline-offset:var(--s-1);border-radius:var(--r-focus)}.oar-nav__cta-desktop[data-astro-cid-yhaz3u4w]{display:none;flex:0 0 auto}.oar-nav__toggle[data-astro-cid-yhaz3u4w]{margin-left:auto;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;background:transparent;border:none;border-radius:var(--r-pill);padding:0;-webkit-appearance:none;appearance:none;color:var(--ink)}.oar-nav__toggle[data-astro-cid-yhaz3u4w]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.oar-nav__toggle-icon[data-astro-cid-yhaz3u4w]{position:relative;width:22px;height:22px}.oar-nav__hb[data-astro-cid-yhaz3u4w]{position:absolute;left:50%;top:50%;width:16px;height:2px;background:var(--ink);border-radius:var(--nav-hb-radius);transform-origin:center;transition:transform var(--motion-canonical) var(--motion-ease)}.oar-nav__hb--top[data-astro-cid-yhaz3u4w]{transform:translate(-50%,-4px)}.oar-nav__hb--bottom[data-astro-cid-yhaz3u4w]{transform:translate(-50%,4px)}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open] .oar-nav__hb--top[data-astro-cid-yhaz3u4w]{transform:translate(-50%,0) rotate(45deg)}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open] .oar-nav__hb--bottom[data-astro-cid-yhaz3u4w]{transform:translate(-50%,0) rotate(-45deg)}.oar-nav__panel[data-astro-cid-yhaz3u4w]{height:0;overflow:hidden;will-change:height;transition:height var(--motion-open) var(--motion-ease)}.oar-nav__panel-inner[data-astro-cid-yhaz3u4w]{display:flex;flex-direction:column}.oar-nav__panel-scroll[data-astro-cid-yhaz3u4w]{overflow-y:auto;overscroll-behavior:contain;flex:1 1 auto;min-height:0;padding:var(--nav-panel-top-gap) var(--s-2) var(--s-2)}.oar-nav__panel-cta[data-astro-cid-yhaz3u4w]{flex:0 0 auto;padding:var(--s-2) var(--s-2) var(--s-3);background:var(--island-bg)}.oar-nav__panel-cta[data-astro-cid-yhaz3u4w] .btn{width:100%;justify-content:center}.oar-nav__mlink[data-astro-cid-yhaz3u4w]{display:flex;align-items:center;justify-content:space-between;padding:var(--s-2);font-size:var(--type-body-lg);font-weight:var(--fw-medium);letter-spacing:-0.01em;color:var(--ink);text-decoration:none;border-radius:var(--r-card)}.oar-nav__mlink[data-astro-cid-yhaz3u4w]:active{background:var(--ink-10)}.oar-nav__mlink[data-astro-cid-yhaz3u4w],.oar-nav__panel-cta[data-astro-cid-yhaz3u4w]{opacity:0;transition:opacity var(--motion-fade) var(--motion-ease)}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w],.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__panel-cta[data-astro-cid-yhaz3u4w]{opacity:1;transition:opacity var(--motion-fade-in) var(--motion-ease) var(--nav-reveal-delay, var(--motion-fade-delay))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w]:nth-child(1){--nav-reveal-delay: calc(var(--motion-fade-delay) + 0 * var(--nav-stagger))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w]:nth-child(2){--nav-reveal-delay: calc(var(--motion-fade-delay) + 1 * var(--nav-stagger))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w]:nth-child(3){--nav-reveal-delay: calc(var(--motion-fade-delay) + 2 * var(--nav-stagger))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w]:nth-child(4){--nav-reveal-delay: calc(var(--motion-fade-delay) + 3 * var(--nav-stagger))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__mlink[data-astro-cid-yhaz3u4w]:nth-child(5){--nav-reveal-delay: calc(var(--motion-fade-delay) + 4 * var(--nav-stagger))}.oar-nav__island[data-astro-cid-yhaz3u4w][data-open]:not(.is-closing) .oar-nav__panel-cta[data-astro-cid-yhaz3u4w]{--nav-reveal-delay: calc(var(--motion-fade-delay) + 5 * var(--nav-stagger))}html[data-mobile-nav-open]{overflow:hidden}@media (prefers-reduced-motion: reduce){.oar-nav__name[data-astro-cid-yhaz3u4w],.oar-nav__panel[data-astro-cid-yhaz3u4w],.oar-nav__hb[data-astro-cid-yhaz3u4w],.oar-nav__toggle-icon[data-astro-cid-yhaz3u4w],.oar-nav__mlink[data-astro-cid-yhaz3u4w],.oar-nav__panel-cta[data-astro-cid-yhaz3u4w]{transition:none}}@media (min-width: 900px){.oar-nav__links[data-astro-cid-yhaz3u4w]{display:inline-flex}.oar-nav__cta-desktop[data-astro-cid-yhaz3u4w]{display:inline-flex}.oar-nav__toggle[data-astro-cid-yhaz3u4w]{display:none}.oar-nav__panel[data-astro-cid-yhaz3u4w]{display:none}}.newsletter[data-astro-cid-zevmejei]{padding-block:var(--s-7)}.newsletter--compact[data-astro-cid-zevmejei]{padding-block:var(--s-5)}.newsletter__inner[data-astro-cid-zevmejei]{margin-inline:auto}.newsletter__title[data-astro-cid-zevmejei]{color:var(--ink)}.newsletter__lede[data-astro-cid-zevmejei]{color:var(--text-dim)}.newsletter__form[data-astro-cid-zevmejei]{margin-top:var(--s-3)}.newsletter__label[data-astro-cid-zevmejei]{display:block;font-size:var(--type-caption);color:var(--text-faint);margin-bottom:var(--s-1)}.newsletter__row[data-astro-cid-zevmejei]{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:stretch}.newsletter__input[data-astro-cid-zevmejei]{flex:1 1 16rem;min-width:0;padding:var(--field-pad);font:inherit;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--field-line);border-radius:0}.newsletter__input[data-astro-cid-zevmejei]::placeholder{color:var(--ink-55)}.newsletter__input[data-astro-cid-zevmejei]:focus,.newsletter__input[data-astro-cid-zevmejei]:focus-visible{outline:none;border-bottom-color:var(--ink)}.newsletter__submit[data-astro-cid-zevmejei]{--nl-fill: var(--ink);flex:0 0 auto;padding:var(--btn-pad-md);font:inherit;font-weight:var(--fw-btn);color:var(--text-on-ink);background:var(--nl-fill);border:1px solid var(--nl-fill);border-radius:var(--r-pill);cursor:pointer;transition:opacity 120ms ease}.newsletter__btn-label[data-astro-cid-zevmejei]{display:inline-flex;align-items:center;line-height:1.2;height:1.2em;overflow:hidden}.newsletter__btn-label[data-astro-cid-zevmejei] .ch{position:relative;display:inline-block;height:1.2em;overflow:hidden}.newsletter__btn-label[data-astro-cid-zevmejei] .ch.space{width:0.28em}.newsletter__btn-label[data-astro-cid-zevmejei] .ch .top,.newsletter__btn-label[data-astro-cid-zevmejei] .ch .bot{display:block;height:1.2em;line-height:1.2;transition:transform var(--char-duration) var(--motion-ease);transition-delay:calc(var(--i, 0) * var(--char-delay))}.newsletter__btn-label[data-astro-cid-zevmejei] .ch .top{transform:translateY(0)}.newsletter__btn-label[data-astro-cid-zevmejei] .ch .bot{transform:translateY(100%);position:absolute;left:0;right:0;top:0}.newsletter__btn-label[data-astro-cid-zevmejei][data-rolling] .ch .top{transform:translateY(-100%)}.newsletter__btn-label[data-astro-cid-zevmejei][data-rolling] .ch .bot{transform:translateY(0)}@media (prefers-reduced-motion: reduce){.newsletter__btn-label[data-astro-cid-zevmejei] .ch .top,.newsletter__btn-label[data-astro-cid-zevmejei] .ch .bot{transition:none}}.newsletter__form[data-astro-cid-zevmejei]:has(.newsletter__status[data-state="ok"]) .newsletter__fine[data-astro-cid-zevmejei]{display:none}.newsletter__form[data-astro-cid-zevmejei][data-done] .newsletter__submit[data-astro-cid-zevmejei],.newsletter__form[data-astro-cid-zevmejei][data-done] .newsletter__submit[data-astro-cid-zevmejei]:disabled{background:transparent;color:var(--nl-fill);border-color:color-mix(in srgb,var(--nl-fill) 40%,transparent);opacity:1;cursor:default}.newsletter__submit[data-astro-cid-zevmejei]:hover{opacity:0.88}.newsletter__submit[data-astro-cid-zevmejei]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.newsletter__submit[data-astro-cid-zevmejei]:active{transform:scale(0.99)}.newsletter__submit[data-astro-cid-zevmejei]:disabled{opacity:0.5;cursor:default}.newsletter__fine[data-astro-cid-zevmejei]{margin-top:var(--s-2);font-size:var(--type-caption);color:var(--text-faint)}.newsletter__status[data-astro-cid-zevmejei]{margin-top:var(--s-2);min-height:1.25em}.newsletter__status[data-astro-cid-zevmejei][data-state=ok]{color:var(--ink)}.newsletter__status[data-astro-cid-zevmejei][data-state=error]{color:var(--ink-80)}.newsletter__hp[data-astro-cid-zevmejei]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media (prefers-reduced-motion: reduce){.newsletter__submit[data-astro-cid-zevmejei]{transition:none}.newsletter__submit[data-astro-cid-zevmejei]:active{transform:none}}.oar-footer[data-astro-cid-7fdv3abq]{--wordmark-fit-fallback: clamp(40px, 14vw, 168px);--sub-card-radius: 40px;--ink: #D0C8B8;--bg: #171612;--ink-80: rgba(208,200,184,0.80);--ink-70: rgba(208,200,184,0.70);--ink-55: rgba(208,200,184,0.55);--ink-20: rgba(208,200,184,0.20);--ink-16: rgba(208,200,184,0.16);--ink-10: rgba(208,200,184,0.10);--ink-60: var(--ink-70);--ink-40: var(--ink-55);--surface: rgba(255,255,255,0.06);background-color:var(--bg);color:var(--ink-70);padding-inline:max(var(--container-pad),env(safe-area-inset-left)) max(var(--container-pad),env(safe-area-inset-right))}@media (max-width: 720px){.oar-footer[data-astro-cid-7fdv3abq]{padding-inline:max(var(--container-pad-m),env(safe-area-inset-left)) max(var(--container-pad-m),env(safe-area-inset-right))}}.oar-footer__sub[data-astro-cid-7fdv3abq]{padding-block:var(--section-rhythm) 0}.oar-footer__sub-inner[data-astro-cid-7fdv3abq]{max-width:var(--container-max);margin:0 auto}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__inner{text-align:center;max-width:46ch}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__title{color:var(--ink);font-size:var(--type-h3);text-wrap:balance}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__lede{color:var(--ink-70);font-size:var(--type-body);margin-inline:auto}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__row{flex-direction:column;flex-wrap:nowrap;max-width:24rem;margin-inline:auto;background:var(--ink);border-radius:var(--sub-card-radius);padding:var(--s-2);gap:var(--s-2)}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__input{flex:1 1 auto;width:100%;text-align:center;color:var(--bg);border-bottom-color:transparent}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__input::placeholder{color:color-mix(in srgb,var(--bg) 55%,transparent)}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__input:focus{border-bottom-color:color-mix(in srgb,var(--bg) 20%,transparent)}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__submit{--nl-fill: var(--bg);width:100%;border-radius:var(--r-pill);background:var(--nl-fill);color:var(--ink)}.oar-footer__sub-inner[data-astro-cid-7fdv3abq] .newsletter__fine{color:var(--ink-55);font-size:var(--type-micro);margin-inline:auto;max-width:none;text-wrap:nowrap}.oar-footer__prefooter[data-astro-cid-7fdv3abq]{padding-block:var(--section-rhythm) calc(var(--section-rhythm) * 2)}.oar-footer__prefooter-inner[data-astro-cid-7fdv3abq]{max-width:var(--container-max);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--s-5);text-align:center}.oar-footer__cta-setup[data-astro-cid-7fdv3abq]{color:var(--ink);margin:0;text-wrap:balance}.oar-footer__cta-access[data-astro-cid-7fdv3abq]{margin:calc(var(--s-3) - var(--s-5)) 0 0;font-size:var(--type-caption);line-height:1.55;color:var(--ink-70);max-width:52ch;text-wrap:balance}.oar-footer__main[data-astro-cid-7fdv3abq]{border-top:1px solid var(--ink-16);padding-block:var(--section-rhythm) var(--s-4)}.oar-footer__main-inner[data-astro-cid-7fdv3abq]{max-width:var(--container-max);margin:0 auto}.oar-footer__cols[data-astro-cid-7fdv3abq]{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-5) var(--s-3);margin-bottom:var(--s-6)}.oar-footer__col[data-astro-cid-7fdv3abq]{display:flex;flex-direction:column;gap:var(--s-2)}.oar-footer__col-label[data-astro-cid-7fdv3abq]{color:var(--ink);font-size:var(--type-caption);font-weight:var(--fw-medium);letter-spacing:0.02em;margin:0}.oar-footer__list[data-astro-cid-7fdv3abq]{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--s-1)}.footer-link[data-astro-cid-7fdv3abq]{color:var(--ink-70);text-decoration:none;font-size:var(--type-caption);line-height:1.5;transition:color var(--motion-hover) var(--motion-ease)}.footer-link[data-astro-cid-7fdv3abq]:hover{color:var(--ink)}.footer-link[data-astro-cid-7fdv3abq]:focus-visible{outline:2px solid var(--ink);outline-offset:2px;color:var(--ink)}.footer-link--external[data-astro-cid-7fdv3abq]{display:inline-flex;align-items:center;gap:var(--s-1)}.footer-link__ext[data-astro-cid-7fdv3abq]{font-size:var(--type-micro);line-height:1;opacity:0.7;transition:transform var(--motion-hover) var(--motion-ease)}.footer-link--external[data-astro-cid-7fdv3abq]:hover .footer-link__ext[data-astro-cid-7fdv3abq]{transform:translate(2px,-2px);opacity:1}.oar-footer__firewall[data-astro-cid-7fdv3abq]{border-top:1px solid var(--ink-16);padding-top:var(--s-4);margin-bottom:var(--s-4);display:flex;flex-direction:column;gap:var(--s-1)}.oar-footer__state-negation[data-astro-cid-7fdv3abq]{font-size:var(--type-micro);font-weight:var(--fw-medium);letter-spacing:0.04em;color:var(--ink-70);margin:0}.oar-footer__report[data-astro-cid-7fdv3abq]{font-size:var(--type-micro);color:var(--ink-70);margin:0}.oar-footer__report-link[data-astro-cid-7fdv3abq]{color:var(--ink);text-decoration:underline;text-underline-offset:2px}.oar-footer__bottom-row[data-astro-cid-7fdv3abq]{display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start}.oar-footer__voice[data-astro-cid-7fdv3abq]{font-size:var(--type-caption);color:var(--ink-80);margin:0}.oar-footer__copyright[data-astro-cid-7fdv3abq]{font-size:var(--type-micro);color:var(--ink-55);margin:0;line-height:1.5}@media (min-width: 720px){.oar-footer__cols[data-astro-cid-7fdv3abq]{grid-template-columns:repeat(4,1fr);gap:var(--s-5)}.oar-footer__bottom-row[data-astro-cid-7fdv3abq]{flex-direction:row;justify-content:space-between;align-items:baseline}}.oar-footer__policy[data-astro-cid-7fdv3abq]{margin:0;font-size:var(--type-caption);color:var(--ink-70)}.oar-footer__policy[data-astro-cid-7fdv3abq] a[data-astro-cid-7fdv3abq]{color:var(--ink)}.oar-footer__close[data-astro-cid-7fdv3abq]{padding-block:var(--s-5) var(--section-rhythm)}.oar-footer__close-inner[data-astro-cid-7fdv3abq]{max-width:var(--container-max);margin:0 auto;text-align:center}.oar-footer__firewall-line[data-astro-cid-7fdv3abq]{margin:0;font-size:var(--type-micro);line-height:1.6;color:var(--ink-55)}.oar-footer__firewall-line[data-astro-cid-7fdv3abq] .oar-footer__report-link[data-astro-cid-7fdv3abq]{color:var(--ink-70)}.oar-footer__wordmark-row[data-astro-cid-7fdv3abq]{padding-block:var(--s-6) var(--s-3)}.oar-footer__wordmark-ch--dim[data-astro-cid-7fdv3abq]{color:var(--ink-55)}.oar-footer__wordmark[data-astro-cid-7fdv3abq]{display:block;text-decoration:none;font-family:var(--font-sans);font-weight:var(--fw-semibold);font-size:var(--fit-size, var(--wordmark-fit-fallback));line-height:0.9;letter-spacing:-0.03em;color:var(--ink);white-space:nowrap;text-align:center;font-variant-ligatures:common-ligatures contextual}.oar-footer__wordmark-ch[data-astro-cid-7fdv3abq]{display:inline-block;opacity:0;transform:translateY(20px);transition:opacity var(--motion-canonical) var(--motion-ease),transform var(--motion-canonical) var(--motion-ease);transition-delay:calc(var(--i, 0) * 40ms)}.oar-footer__wordmark[data-astro-cid-7fdv3abq][data-ready] .oar-footer__wordmark-ch[data-astro-cid-7fdv3abq]{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion: reduce){.oar-footer__wordmark-ch[data-astro-cid-7fdv3abq]{opacity:1;transform:none;transition:none}}