/* ============================================================================
   Downloads page — "release ledger" design system.
   The page reads like a printed release manifest: machine data (versions,
   sizes, dates, architectures) is set in monospace with dotted leaders,
   statuses are stamped, sections are numbered like manual chapters, and
   product captures sit inside a quiet desktop-window frame. Palette is
   derived from the Everabyte logo (navy ink, brand teal, brand blue).
   ========================================================================== */

.desktop-downloads-page {
  /* Brand-derived palette (logo: teal #25a48c, blue #247cb6, sky #359fc7).
     Text-facing teal/muted tones are darkened to keep WCAG AA (>= 4.5:1)
     on every surface of the page (white, paper, paper-blue, teal tint);
     #25a48c stays reserved for non-text rules and markers. */
  --dl-ink: #0a2438;
  --dl-ink-soft: #2b4a63;
  --dl-text: #46607a;
  --dl-muted: #536884;
  --dl-rule: #d7e2e8;
  --dl-rule-strong: #b9ccd6;
  --dl-teal: #17705f;
  --dl-teal-bright: #25a48c;
  --dl-teal-tint: #e9f5f1;
  --dl-blue: #1e6da3;
  --dl-sky: #359fc7;
  --dl-paper: #f6f9f8;
  --dl-paper-blue: #f3f7fa;
  --dl-font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
  color: var(--dl-ink);
  background: #fff;
  font-family: Inter, sans-serif;
  overflow-wrap: anywhere;
}

.desktop-downloads-page *,
.desktop-downloads-page *::before,
.desktop-downloads-page *::after { box-sizing: border-box; }

.desktop-downloads-page :is(section, article, h2, h3) {
  scroll-margin-top: calc(var(--header-h, 67px) + 16px);
}

.desktop-downloads-page :is(h1, h2, h3) {
  color: var(--dl-ink);
  font-family: 'Space Grotesk', Inter, sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
  text-wrap: balance;
  margin: 0;
}

.desktop-downloads-page h1 { font-size: clamp(2.1rem, 3.6vw, 3.3rem); line-height: 1.08; }
.desktop-downloads-page h2 { font-size: clamp(1.6rem, 2.5vw, 2.3rem); line-height: 1.15; }
.desktop-downloads-page h3 { font-size: 1.2rem; line-height: 1.3; }
/* :where keeps this base rule at class-only specificity so every .dl-*
   paragraph treatment (and its media-query overrides) can win by source
   order without extra scoping. */
.desktop-downloads-page :where(p) { color: var(--dl-text); margin: 0; line-height: 1.65; }
.desktop-downloads-page :is(ul, ol) { margin: 0; padding: 0; list-style: none; }
/* :where on the generic anchor rules (same pattern as the p base above):
   a plain class like .dl-button must override the link color by source order
   alone — at (0,1,1) the bare `a` rule beat .dl-button (0,1,0), painting the
   ink CTA blue at rest and teal-on-navy on hover (unreadable). */
.desktop-downloads-page :where(a) { color: var(--dl-blue); }
.desktop-downloads-page :where(a):hover { color: var(--dl-teal); }
.desktop-downloads-page :is(a, button):focus-visible { outline: 3px solid var(--dl-blue); outline-offset: 3px; }

/* Layout container — narrower than the homepage for a reading-ledger feel. */
.dl-container { width: min(100% - 64px, 1160px); margin-inline: auto; }

/* Mono annotations used across the page (indexes, data, stamps).
   Labels never drop below 0.7rem so the data voice stays readable. */
.dl-mono {
  font-family: var(--dl-font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}

/* ============================================================================
   Hero — homepage-family composition on the ledger's paper band: kicker,
   marked title, lead, ink CTA, framed app capture, full-width availability
   strip closing the band like the header row of the release table.
   ========================================================================== */

.dl-hero {
  background: var(--dl-paper);
  border-bottom: 1px solid var(--dl-rule);
  padding: clamp(36px, 4.6vw, 68px) 0 clamp(44px, 5vw, 80px);
}

.dl-hero__layout {
  display: grid;
  grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
  column-gap: clamp(36px, 4.6vw, 80px);
  align-items: center;
}

.dl-hero__copy { min-width: 0; max-width: 640px; }

/* Kicker: small caps + short teal rule, matching the homepage hero voice. */
.dl-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--dl-teal);
  font-family: 'Space Grotesk', Inter, sans-serif;
  font-size: 0.78rem; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  margin-bottom: 20px;
}
.dl-eyebrow::before { content: ''; width: 26px; height: 2px; background: var(--dl-teal-bright); flex-shrink: 0; }

.dl-hero h1 {
  margin: 0 0 16px;
  max-width: 16ch;
  font-size: clamp(2.2rem, 3.5vw, 3.4rem);
}

/* Soft highlighter behind the invariant product name (homepage grammar). */
.dl-hero__mark { box-shadow: inset 0 -0.26em 0 0 rgba(37, 164, 140, 0.18); }

.dl-hero__subtitle {
  color: var(--dl-ink);
  font-family: 'Space Grotesk', Inter, sans-serif;
  font-size: clamp(1.05rem, 1.3vw, 1.15rem); font-weight: 600;
  letter-spacing: -0.01em; line-height: 1.4;
  margin-bottom: 10px;
}
.dl-hero__description { max-width: 54ch; font-size: clamp(1rem, 1.15vw, 1.06rem); }

/* Actions — the site's flat ink button system (homepage hero grammar). ---- */
.dl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 26px; }

.dl-button,
.desktop-downloads-page .desktop-platform__download {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 50px; padding: 13px 26px;
  background: var(--dl-ink);
  border: 1px solid var(--dl-ink);
  border-radius: 10px;
  color: #fff; font: inherit; font-size: 0.94rem; font-weight: 600;
  line-height: 1.35; text-align: center; text-decoration: none;
  box-shadow: none;
  transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease;
}
.dl-button:hover,
.desktop-downloads-page a.desktop-platform__download:hover {
  background: #14395c; border-color: #14395c; color: #fff;
  transform: translateY(-1px);
}
/* Secondary artifact of a platform becomes the outline variant. */
.desktop-downloads-page .desktop-platform__download + .desktop-platform__download {
  background: var(--dl-paper);
  border-color: var(--dl-rule-strong);
  color: var(--dl-ink);
}
.desktop-downloads-page .desktop-platform__download + .desktop-platform__download:hover {
  background: var(--dl-teal-tint);
  border-color: var(--dl-teal);
  color: var(--dl-ink);
}
.desktop-downloads-page .desktop-platform__download:disabled {
  background: var(--dl-paper); color: var(--dl-muted);
  border-color: var(--dl-rule-strong);
  cursor: not-allowed; transform: none;
}

.dl-link {
  display: inline-flex; align-items: center; min-height: 50px;
  font-size: 0.94rem; font-weight: 600; line-height: 1.4;
}
/* Only the label carries the underline: a text decoration set on the anchor
   would paint through the arrow glyph (descendants cannot opt out). */
.dl-link__label { text-decoration: underline; text-underline-offset: 5px; }

/* Platform download buttons live inside dense manifest rows: slightly more
   compact than the hero CTA while keeping the 44px touch-target floor. */
.desktop-downloads-page .desktop-platform__download {
  min-height: 44px;
  padding: 10px 18px;
  font-size: 0.88rem;
}

/* Availability strip — full-width release-table header closing the hero. --- */
.dl-availability {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 2px solid var(--dl-ink);
  margin-top: clamp(28px, 4vw, 48px) !important;
}
.dl-availability a {
  display: flex; align-items: baseline; gap: 10px;
  min-height: 56px;
  padding: 16px 2px;
  font-size: 0.95rem; font-weight: 700; line-height: 1.3;
  color: var(--dl-ink); text-decoration: none;
}
.dl-availability li + li > a { border-left: 1px solid var(--dl-rule-strong); padding-left: 24px; }
.dl-availability__name { flex-shrink: 0; }
.dl-availability__leader { flex: 1 1 auto; min-width: 16px; border-bottom: 1px dotted var(--dl-rule-strong); transform: translateY(-3px); }
.dl-availability__status {
  flex-shrink: 0;
  color: var(--dl-muted);
  font-family: var(--dl-font-mono);
  font-size: 0.75rem; font-weight: 400;
  letter-spacing: 0.02em; text-align: right;
}
.dl-availability a:hover { color: var(--dl-blue); text-decoration: underline; text-underline-offset: 3px; }
.dl-availability a:hover .dl-availability__status { color: var(--dl-blue); }

/* App capture framed as a desktop window (bar + control dots in brand colors). */
.dl-window {
  position: relative;
  border: 1px solid var(--dl-rule-strong);
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}
.dl-window::before {
  content: '';
  display: block;
  height: 30px;
  background: var(--dl-ink);
}
.dl-window::after {
  content: '';
  position: absolute; top: 11px; left: 13px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--dl-sky);
  box-shadow: 14px 0 0 var(--dl-teal-bright), 28px 0 0 var(--dl-rule);
}
.dl-window .desktop-screenshot { margin: 0; }
.dl-window .desktop-screenshot__image { display: block; width: 100%; }
/* Caption becomes an annotation strip pinned under the capture. */
.dl-window .desktop-screenshot__caption {
  margin: 0;
  padding: 10px 14px;
  border-top: 1px solid var(--dl-rule);
  background: var(--dl-paper);
  color: var(--dl-muted);
  font-size: 0.75rem; line-height: 1.55;
}
.dl-hero__visual { min-width: 0; }

/* Nothing in the hero depends on a reveal observer or client-side enhancement. */
.dl-hero,
.dl-hero :is(.animate-in, .fade-in-up, .reveal),
.dl-hero * {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

/* ============================================================================
   Section heading pattern — numbered like manual chapters.
   ========================================================================== */

.dl-section { padding-block: 60px; }

.dl-section__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px 64px;
  align-items: end;
  margin-bottom: 36px;
}
.dl-chapter {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
  color: var(--dl-teal);
  font-family: var(--dl-font-mono);
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
}
/* Chapter tab: a short teal notch that interrupts the section's top rule. */
.dl-chapter::before { content: ''; width: 18px; height: 3px; background: var(--dl-teal-bright); flex-shrink: 0; }
.dl-section__heading p { font-size: 0.95rem; }

/* ============================================================================
   Release manifest — one full-width row per platform (no card grid).
   ========================================================================== */

.dl-manifest { border-top: 2px solid var(--dl-ink); }

.desktop-downloads-page .desktop-platform {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr) 290px 220px;
  gap: 20px 36px;
  padding: 38px 18px;
  border-bottom: 1px solid var(--dl-rule);
  transition: background-color 180ms ease;
}
.desktop-downloads-page .desktop-platform:hover { background: var(--dl-paper); }
.desktop-downloads-page .desktop-platform.is-recommended {
  background: var(--dl-teal-tint);
  border-left: 3px solid var(--dl-teal-bright);
  padding: 18px;
}

/* Identity cell ----------------------------------------------------------- */
.dl-platform__id { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.dl-platform__system {
  color: var(--dl-teal);
  font-family: var(--dl-font-mono);
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  margin: 0;
}
.desktop-downloads-page .dl-platform__title { font-size: 1.35rem; line-height: 1.2; }
/* Artifact formats the installer ships as — real data, styled as mono tags. */
.dl-formats { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.dl-formats__tag {
  display: inline-block;
  padding: 3px 7px;
  border: 1px solid var(--dl-rule-strong);
  border-radius: 3px;
  color: var(--dl-muted);
  font-family: var(--dl-font-mono);
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
}

/* Recommended badge is revealed by desktop-downloads.js. */
.desktop-downloads-page .desktop-platform__recommended {
  display: inline-flex; align-items: center; gap: 6px;
  align-self: flex-start;
  color: var(--dl-teal);
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.04em;
}
.desktop-downloads-page .desktop-platform__recommended::before {
  content: '';
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--dl-teal-bright);
}
.desktop-downloads-page .desktop-platform__recommended[hidden] { display: none; }

/* Description + status cell ------------------------------------------------ */
.dl-platform__body { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.dl-platform__body .desktop-platform__description { font-size: 0.92rem; }

/* Honest unavailability note replacing the spec list on coming-soon rows. */
.desktop-downloads-page .dl-platform__unavailable {
  color: var(--dl-muted);
  font-size: 0.85rem;
  line-height: 1.6;
}

/* Status stamps — printed-label treatment. */
.dl-stamp {
  display: inline-flex; align-items: center; align-self: flex-start;
  padding: 5px 10px;
  border: 1px solid var(--dl-teal-bright);
  border-radius: 3px;
  background: var(--dl-teal-tint);
  color: var(--dl-teal);
  font-family: var(--dl-font-mono);
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
}
.dl-stamp--waiting {
  border-color: var(--dl-rule-strong);
  background: #fff;
  color: var(--dl-muted);
}
/* Coming-soon rows are muted but never below readable contrast. */
.desktop-downloads-page .desktop-platform[data-desktop-status='comingSoon'] .dl-platform__title { color: var(--dl-ink-soft); }
.desktop-downloads-page .desktop-platform[data-desktop-status='comingSoon'] .dl-platform__system { color: var(--dl-muted); }

/* Spec cell — dotted leaders between each label and value. ----------------- */
.dl-spec { margin: 0; min-width: 0; }
.dl-spec__row {
  display: flex; align-items: baseline; gap: 8px;
  padding-block: 7px;
}
.dl-spec__row + .dl-spec__row { border-top: 1px dotted var(--dl-rule-strong); }
.dl-spec dt { color: var(--dl-ink-soft); font-size: 0.78rem; font-weight: 700; flex-shrink: 0; }
.dl-spec__leader { flex: 1 1 auto; min-width: 12px; border-bottom: 1px dotted var(--dl-rule-strong); transform: translateY(-3px); }
.dl-spec dd { margin: 0; color: var(--dl-text); font-family: var(--dl-font-mono); font-size: 0.78rem; text-align: right; overflow-wrap: anywhere; }

/* Actions cell ------------------------------------------------------------- */
/* Button styling lives with the hero actions block (shared ink-button system). */
.desktop-downloads-page .desktop-platform__actions { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.desktop-downloads-page .desktop-platform__notes {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px;
  font-size: 0.82rem;
  text-decoration: underline; text-underline-offset: 4px;
}

/* ============================================================================
   Setup guide — numbered rail on a blue-paper band.
   ========================================================================== */

.dl-guide { background: var(--dl-paper-blue); border-block: 1px solid var(--dl-rule); }

.dl-steps { border-top: 1px solid var(--dl-rule); }
.dl-step {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
  padding-block: 36px;
}
.dl-step + .dl-step { border-top: 1px solid var(--dl-rule); }
.dl-step:last-child { padding-bottom: 4px; }

.dl-step__copy { min-width: 0; }
/* Ordinal set in a ruled square — the ledger's index card. */
.dl-step__index {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px;
  border: 1px solid var(--dl-rule-strong);
  border-radius: 3px;
  color: var(--dl-teal);
  font-family: var(--dl-font-mono);
  font-size: 0.95rem; font-weight: 700;
}
.dl-step__copy h3 { margin-top: 14px; font-size: 1.45rem; }
.dl-step__copy p { margin-top: 8px; }
.dl-step .dl-window { justify-self: center; width: 100%; max-width: 520px; }

/* ============================================================================
   Features — two-column ruled index.
   ========================================================================== */

.dl-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px; border-top: 1px solid var(--dl-rule); }
.dl-features li {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  padding-block: 24px;
  border-bottom: 1px solid var(--dl-rule);
}
/* The mono index is the scanning anchor of the register: it carries the
   vertical rhythm so six short entries read as an index, not a card grid. */
.dl-features__index {
  color: var(--dl-teal);
  font-family: var(--dl-font-mono);
  font-size: 1rem; font-weight: 700;
  line-height: 1.2;
  padding-top: 2px;
}
.dl-features h3 { font-size: 1.06rem; }
.dl-features p { margin-top: 6px; font-size: 0.9rem; }

/* ============================================================================
   FAQ — editorial split: question index on the left, ruled answers right.
   ========================================================================== */

.dl-faq {
  display: grid;
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 1.45fr);
  gap: 24px 64px;
  border-top: 2px solid var(--dl-ink);
  padding-top: 36px;
}
.dl-faq__index { display: flex; flex-direction: column; gap: 8px; }
.dl-faq__item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  padding-block: 18px;
  border-bottom: 1px solid var(--dl-rule);
}
.dl-faq__item:last-child { border-bottom: 0; }
.dl-faq__item h3 { font-size: 1rem; line-height: 1.4; }
.dl-faq__item p { margin-top: 7px; font-size: 0.9rem; }
.dl-faq__index-item { color: var(--dl-teal); font-size: 0.78rem; font-weight: 700; padding-top: 3px; }

/* ============================================================================
   Closing band — teal paper, actions aligned right.
   ========================================================================== */

.dl-close { background: var(--dl-teal-tint); border-top: 1px solid var(--dl-rule); padding-block: 46px; }
.dl-close__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px 48px;
  align-items: center;
}
.dl-close h2 { font-size: clamp(1.5rem, 2.2vw, 2rem); }
.dl-close p { margin-top: 8px; max-width: 52ch; }
.dl-close .dl-actions { margin-top: 0; justify-content: flex-end; }
/* Teal-tint band needs its own quiet button treatment to stay in family. */
.dl-close .dl-button { background: var(--dl-ink); border-color: var(--dl-ink); }
.dl-close .dl-button:hover { background: var(--dl-teal); border-color: var(--dl-teal); }

/* ============================================================================
   Responsive — desktop (≥1025), tablet (769–1024), mobile (≤768), small (≤480).
   ========================================================================== */

@media (min-width: 1440px) {
  .dl-hero { padding-bottom: 48px; }
  .dl-section { padding-block: 76px; }
}

@media (max-width: 1024px) {
  .dl-container { width: calc(100% - 48px); }

  /* Manifest rows collapse to identity column + stacked details. */
  .desktop-downloads-page .desktop-platform {
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 16px 28px;
  }
  .dl-platform__spec { grid-column: 2; }
  .desktop-downloads-page .desktop-platform__actions { grid-column: 2; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .desktop-downloads-page .desktop-platform__download { flex: 0 1 auto; }
  .desktop-downloads-page .desktop-platform__notes { flex: 0 0 auto; }
}

@media (max-width: 768px) {
  .dl-hero { padding: 28px 0 36px; }
  .dl-hero__layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .dl-hero__visual { width: min(100%, 460px); justify-self: center; }
  .dl-hero h1 { font-size: clamp(1.9rem, 7.2vw, 2.4rem); }

  /* Availability becomes a stacked ledger, one platform per ruled row. */
  .dl-availability { grid-template-columns: minmax(0, 1fr); }
  .dl-availability li + li > a { border-left: 0; border-top: 1px solid var(--dl-rule); padding-left: 0; }
  .dl-availability a { min-height: 48px; padding: 12px 0; }

  .dl-section { padding-block: 42px; }
  .dl-section__heading { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-bottom: 24px; }

  .desktop-downloads-page .desktop-platform { grid-template-columns: minmax(0, 1fr); padding: 32px 0; gap: 14px; }
  .dl-platform__spec { grid-column: auto; }
  .desktop-downloads-page .desktop-platform__actions { grid-column: auto; flex-direction: column; align-items: stretch; }
  .desktop-downloads-page .desktop-platform__download { align-self: stretch; }
  .desktop-downloads-page .desktop-platform__notes { align-self: center; }

  .dl-step { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-block: 28px; }
  .dl-step .dl-window { max-width: 100%; }

  .dl-features { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  .dl-faq { grid-template-columns: minmax(0, 1fr); gap: 20px; border-top-width: 1px; padding-top: 24px; }
  .dl-faq__index { flex-direction: row; align-items: baseline; gap: 14px; }

  .dl-close { padding-block: 36px; }
  .dl-close__layout { grid-template-columns: minmax(0, 1fr); }
  .dl-close .dl-actions { justify-content: flex-start; }
}

@media (max-width: 480px) {
  .dl-container { width: calc(100% - 32px); }
  .dl-hero h1 { font-size: clamp(1.75rem, 7.6vw, 2.1rem); }
  .dl-hero__subtitle { font-size: 1rem; }
  .dl-hero__description { font-size: 0.92rem; line-height: 1.55; }
  .dl-eyebrow { font-size: 0.7rem; margin-bottom: 12px; }
  .dl-actions { gap: 6px 14px; margin-top: 18px; }
  .dl-button { width: 100%; }
  .dl-link { width: 100%; }
  .dl-availability { margin-top: 20px !important; }
  .dl-availability a { font-size: 0.9rem; }
  .dl-availability__status { font-size: 0.72rem; }
  .dl-step__copy h3 { font-size: 1.25rem; }
  .dl-features li { grid-template-columns: 40px minmax(0, 1fr); }
  .dl-faq__item { grid-template-columns: 34px minmax(0, 1fr); }
  /* Long localized labels (FR/ES minimum-OS strings) stack label over value
     instead of squeezing the dotted leader on a narrow column. */
  .dl-spec__row { flex-direction: column; align-items: flex-start; gap: 2px; padding-block: 9px; }
  .dl-spec__leader { display: none; }
  .dl-spec dd { text-align: left; }
}

/* Short landscape phones: hero uses a side rail instead of a stacked capture. */
@media (orientation: landscape) and (max-height: 480px) {
  .dl-hero { padding-block: 10px; }
  .dl-hero > .dl-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(120px, 18vw, 180px);
    gap: 6px 18px;
    align-items: center;
  }
  .dl-hero__layout { display: contents; }
  .dl-hero__copy { grid-column: 1; grid-row: 1; }
  .dl-hero__visual { grid-column: 2; grid-row: 1; align-self: center; }
  .dl-availability { grid-column: 1 / -1; grid-row: 2; margin-top: 6px !important; }
  .dl-hero h1 { font-size: 1.6rem; margin-bottom: 8px; }
  .dl-hero__subtitle { margin-bottom: 4px; font-size: 0.85rem; }
  .dl-hero__description { font-size: 0.8rem; line-height: 1.4; }
  .dl-hero .dl-actions { margin-top: 8px; gap: 4px 12px; }
  .dl-hero .dl-button { padding: 8px 12px; font-size: 0.75rem; min-height: 38px; }
  .dl-hero .dl-link { font-size: 0.75rem; min-height: 38px; }
  .dl-availability a { min-height: 38px; padding: 8px 0; }
}

/* Respect reduced-motion preferences across the whole page. */
@media (prefers-reduced-motion: reduce) {
  .desktop-downloads-page *,
  .desktop-downloads-page *::before,
  .desktop-downloads-page *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}