/* =====================================================================================================
   Base: reset, RTL defaults, typography, focus, skip link, utilities, reduced motion.
   Logical properties only (start = right in this RTL site). Fonts: css/fonts.css.
   ===================================================================================================== */

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-gutter: stable;            /* no layout shift when a dialog locks the page scroll */
  scroll-padding-block-start: calc(var(--header-h) + var(--s-4));
  hanging-punctuation: first last;
}

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--bg-page);
  color: var(--text);
  font-family: var(--font-text);
  font-size: var(--fs-16);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  text-align: start;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

img, svg, video, canvas, picture { display: block; max-inline-size: 100%; }
img, video { block-size: auto; }
svg { flex-shrink: 0; }
input, button, textarea, select { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; text-align: inherit; }
button:disabled, [aria-disabled="true"] { cursor: not-allowed; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
p, h1, h2, h3, h4, h5, h6, figure, blockquote, dl, dd { margin: 0; }
ul[role="list"], ol[role="list"], .list-reset { list-style: none; margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset { margin: 0; padding: 0; border: 0; min-inline-size: 0; }
legend { padding: 0; }
hr { border: 0; border-block-start: 1px solid var(--c-line); margin: 0; }
abbr[title] { text-decoration: none; cursor: help; }
[hidden] { display: none !important; }
::selection { background: var(--selection); }

/* ---- Typography ----------------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { color: var(--text); text-wrap: balance; }
h1 { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-display); line-height: var(--lh-display); letter-spacing: 0; }
h2 { font-weight: var(--fw-semibold); font-size: var(--fs-h2); line-height: 1.25; }
h3 { font-weight: var(--fw-semibold); font-size: var(--fs-h3); line-height: var(--lh-snug); }
h4 { font-weight: var(--fw-semibold); font-size: var(--fs-16); line-height: var(--lh-snug); }
p { text-wrap: pretty; }
strong, b { font-weight: var(--fw-semibold); }
small { font-size: var(--fs-14); }

.t-display { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-display); line-height: var(--lh-display); }
.t-figure { font-family: var(--font-display); font-weight: var(--fw-bold); line-height: 0.9; font-size: var(--fs-figure); }
.t-lead { font-size: var(--fs-lead); line-height: 1.55; color: var(--text-2); max-inline-size: 62ch; }
.t-body { font-size: var(--fs-16); line-height: var(--lh-body); }
.t-small { font-size: var(--fs-14); line-height: 1.5; }
.t-micro { font-size: var(--fs-13); line-height: 1.45; }
.t-label { font-size: var(--fs-14); font-weight: var(--fw-medium); line-height: 1.3; }
.t-muted { color: var(--text-2); }
.t-faint { color: var(--text-3); }
.t-measure { max-inline-size: 68ch; }

/* Numbers, times, gaps, prices: LTR-isolated with equal-width digits (Plex digits are 600 units wide). */
.num, .ltr {
  direction: ltr;
  unicode-bidi: isolate;
  font-variant-numeric: tabular-nums lining-nums;
}
.ltr-plain { direction: ltr; unicode-bidi: isolate; }
bdi { unicode-bidi: isolate; }

/* Prose blocks (event descriptions, info pages) */
.prose { max-inline-size: 68ch; }
.prose > * + * { margin-block-start: 1em; }
.prose ul, .prose ol { padding-inline-start: 1.25em; margin-block: 0; }
.prose li + li { margin-block-start: 0.35em; }
.prose a { color: var(--link); text-decoration: underline; }
.prose a:hover { text-decoration-thickness: 2px; }

/* ---- Links ---------------------------------------------------------------------------------------- */
.link {
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
  transition: text-decoration-color var(--dur-1) ease;
}
.link:hover { text-decoration-color: currentColor; }
.link--quiet { text-decoration: none; }
.link--quiet:hover { text-decoration: underline; }

/* ---- Focus ---------------------------------------------------------------------------------------- */
:focus { outline: none; }
:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: var(--r-xs);
}
/* Programmatic focus targets (route H1, dialog titles) do not show a ring. */
[tabindex="-1"]:focus, [tabindex="-1"]:focus-visible { outline: none; }

/* ---- Skip link ------------------------------------------------------------------------------------ */
.skip-link {
  position: fixed;
  inset-block-start: var(--s-3);
  inset-inline-start: var(--s-3);
  z-index: var(--z-skip);
  padding: var(--s-3) var(--s-5);
  border-radius: var(--r-pill);
  background: var(--c-night);
  color: var(--c-on-night);
  font-weight: var(--fw-semibold);
  text-decoration: none;
  transform: translateY(-200%);
  transition: transform var(--dur-2) var(--ease-out);
  --focus-ring: var(--c-cyan);
}
.skip-link:focus, .skip-link:focus-visible { transform: none; outline: 3px solid var(--c-cyan); outline-offset: 2px; }

/* ---- Layout helpers ------------------------------------------------------------------------------- */
.container {
  inline-size: 100%;
  max-inline-size: calc(var(--container) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.container--wide { max-inline-size: calc(var(--container-wide) + 2 * var(--gutter)); }
.container--text { max-inline-size: calc(var(--container-text) + 2 * var(--gutter)); }
.grid-12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s-6); }
.stack > * + * { margin-block-start: var(--stack-gap, var(--s-4)); }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cluster-gap, var(--s-2)); }
.section { margin-block-start: var(--section-gap); }
.section:first-child { margin-block-start: 0; }

.visually-hidden, .sr-only {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Lock page scroll while a dialog / drawer is open (set by js/interop/dialog.js). */
html.is-scroll-locked, html.is-scroll-locked body { overflow: hidden; }

/* ---- Reduced motion: no movement, instant state changes ------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0ms !important;
    transition-duration: 1ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }
}