:root {
  --font-display: 'Staatliches', 'Arial Narrow', system-ui, sans-serif;
  --font-body: 'Bricolage Grotesque', 'Arial Narrow', system-ui, sans-serif;
  --c-paper: oklch(94.5% 0.018 82);
  --c-paper-deep: oklch(86.5% 0.024 82);
  --c-paper-soft: oklch(97% 0.012 82);
  --c-shell: oklch(89.5% 0.022 82);
  --c-ink: oklch(18% 0.008 70);
  --c-muted: oklch(39% 0.014 70);
  --c-dim: oklch(50% 0.014 70);
  --c-charcoal: oklch(18% 0.008 70);
  --c-charcoal-soft: oklch(22% 0.008 70);
  --c-feature-bg: var(--c-charcoal-soft);
  --c-on-dark: var(--c-paper);
  --c-feature-ink: var(--c-on-dark);
  --c-rule: rgba(93, 86, 77, 0.34);
  --c-rule-strong: rgba(21, 20, 18, 0.54);
  --c-shell-rule: rgba(21, 20, 18, 0.34);
  --c-accent: oklch(56.8% 0.208 27.1);
  --c-accent-dark: oklch(45.4% 0.169 27.3);
  --rule-inset: clamp(24px, 3.6vw, 72px);
  --b: 1px solid var(--c-rule);
  --b-strong: 1px solid var(--c-rule-strong);
}

[data-theme="dark"] {
  --c-paper: oklch(18% 0.008 70);
  --c-paper-deep: oklch(24% 0.01 70);
  --c-paper-soft: oklch(15% 0.006 70);
  --c-shell: oklch(21% 0.008 70);
  --c-ink: oklch(94.5% 0.018 82);
  --c-muted: oklch(77% 0.018 82);
  --c-dim: oklch(66% 0.016 82);
  --c-charcoal: oklch(15.5% 0.006 70);
  --c-charcoal-soft: oklch(20% 0.008 70);
  --c-feature-bg: var(--c-charcoal-soft);
  --c-on-dark: var(--c-ink);
  --c-feature-ink: var(--c-ink);
  --c-rule: rgba(242, 238, 228, 0.24);
  --c-rule-strong: rgba(242, 238, 228, 0.44);
  --c-shell-rule: rgba(242, 238, 228, 0.3);
  --c-accent: oklch(62% 0.21 27.1);
  --c-accent-dark: oklch(54% 0.18 27.3);
}

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

html {
  background: var(--c-paper);
  color: var(--c-ink);
  font-size: 16px;
  scrollbar-color: var(--c-rule-strong) var(--c-paper);
  scrollbar-width: thin;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    linear-gradient(0deg, rgba(21, 20, 18, 0.025) 1px, transparent 1px),
    var(--c-paper);
  background-size: 100% 42px, auto;
  color: var(--c-ink);
  font-family: var(--font-body);
  font-weight: 500;
  line-height: 1.58;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--c-paper); }
::-webkit-scrollbar-thumb {
  background: var(--c-rule-strong);
  border: 3px solid var(--c-paper);
}
::-webkit-scrollbar-thumb:hover { background: var(--c-accent); }

::selection {
  background: var(--c-accent);
  color: var(--c-on-dark);
}

:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--c-accent);
  outline-offset: 3px;
}

a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button, input, select { font: inherit; }
p { margin: 0 0 1em; }

h1, h2, h3 {
  margin: 0;
  color: inherit;
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 0.9;
  text-transform: uppercase;
}

[data-fit-text] {
  display: block;
  max-width: 100%;
  text-wrap: balance;
}

.icon { width: 1.18em; height: 1.18em; }
.editorial-mark {
  display: block;
  width: clamp(44px, 5vw, 88px);
  height: 5px;
  margin: 0 0 16px;
  background: var(--c-accent);
}

.skip-link {
  position: fixed;
  top: -100px;
  left: 16px;
  z-index: 40;
  background: var(--c-accent);
  color: var(--c-on-dark);
  padding: 10px 14px;
  font-family: var(--font-display);
  text-transform: uppercase;
}
.skip-link:focus { top: 12px; }

.daorde-shell {
  min-height: 100svh;
  color: var(--c-ink);
  background: var(--c-paper);
  display: grid;
  grid-template-areas:
    "header"
    "content"
    "contact";
}

.ds-header {
  grid-area: header;
  position: relative;
  display: grid;
  grid-template-columns: minmax(380px, 0.42fr) 1px minmax(460px, 0.58fr);
  grid-template-areas:
    "brand divider panel";
  gap: clamp(38px, 5.6vw, 122px);
  padding: clamp(16px, 1.8vw, 48px) clamp(34px, 4.6vw, 116px) clamp(14px, 1.6vw, 30px);
  background: var(--c-shell);
  color: var(--c-ink);
  border-bottom: 1px solid var(--c-shell-rule);
}

.ds-header::before {
  content: "";
  grid-area: divider;
  width: 1px;
  min-height: clamp(118px, 10vw, 190px);
  align-self: center;
  background: var(--c-shell-rule);
}

.ds-brand-block {
  --ds-brand-mark: clamp(10px, 0.9vw, 18px);
  --ds-brand-gap: clamp(18px, 1.8vw, 36px);
  grid-area: brand;
  display: grid;
  align-self: center;
  gap: clamp(10px, 1.1vw, 18px);
  min-width: 0;
}

.ds-brand {
  display: flex;
  align-items: stretch;
  gap: var(--ds-brand-gap);
  min-width: 0;
  width: 100%;
  color: var(--c-ink);
  overflow: hidden;
}

.ds-brand::before {
  content: "";
  flex: 0 0 var(--ds-brand-mark);
  min-height: 0;
  background: var(--c-accent);
}

.ds-brand span {
  display: block;
  min-width: 0;
  font-family: var(--font-display);
  font-size: clamp(5.1rem, 8.4vw, 13rem);
  letter-spacing: 0.01em;
  line-height: 0.78;
  text-transform: uppercase;
  white-space: nowrap;
}

.ds-tagline {
  min-width: 0;
  margin-left: calc(var(--ds-brand-mark) + var(--ds-brand-gap));
  color: var(--c-ink);
  font-family: var(--font-body);
  font-size: clamp(0.86rem, 0.92vw, 1.24rem);
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.ds-header-panel {
  grid-area: panel;
  display: grid;
  align-self: center;
  justify-self: end;
  gap: clamp(18px, 2.4vw, 38px);
  width: min(100%, 960px);
  min-width: 0;
}

.ds-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(34px, 4.6vw, 78px);
  align-items: end;
  min-width: 0;
}

.ds-nav-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: clamp(54px, 4.8vw, 74px);
  padding: 8px 0 clamp(13px, 1.4vw, 22px);
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: clamp(1.34rem, 1.7vw, 2.32rem);
  letter-spacing: 0.03em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  overflow-wrap: normal;
  white-space: nowrap;
}

.ds-nav-link:hover,
.ds-nav-link.active { color: var(--c-ink); }

.ds-nav-link::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: clamp(42px, 3.7vw, 72px);
  height: clamp(3px, 0.32vw, 5px);
  background: var(--c-accent);
  transform: scaleX(0);
  transform-origin: center;
  translate: -50% 0;
  transition: transform 180ms ease;
}

.ds-nav-link:hover::after,
.ds-nav-link.active::after { transform: scaleX(1); }

.ds-tools {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: stretch;
  min-width: 0;
  border-top: 1px solid color-mix(in oklch, var(--c-rule) 70%, transparent);
}

.ds-sidebar-control {
  display: flex;
  align-items: center;
  gap: clamp(8px, 0.9vw, 14px);
  min-width: 0;
  padding: clamp(8px, 0.8vw, 12px) clamp(10px, 1.2vw, 18px);
  color: var(--c-ink);
  border-right: 1px solid var(--c-rule);
}

.ds-sidebar-control:last-child { border-right: 0; }

.ds-sidebar-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  color: var(--c-ink);
  font-size: clamp(1.05rem, 1.1vw, 1.35rem);
}

.ds-sidebar-control-label {
  color: var(--c-muted);
  font-family: var(--font-display);
  font-size: clamp(0.74rem, 0.74vw, 0.88rem);
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.ds-sidebar-segment {
  display: flex;
  align-items: stretch;
  min-width: 0;
}

.ds-sidebar-option {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  min-width: 0;
  min-height: 34px;
  padding: 0 clamp(9px, 0.8vw, 14px);
  border: 0;
  border-left: 1px solid var(--c-rule);
  background: transparent;
  color: var(--c-ink);
  cursor: pointer;
  font-family: var(--font-display);
  font-size: clamp(0.86rem, 0.9vw, 1.08rem);
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.ds-sidebar-option[aria-current="page"] {
  background: var(--c-accent);
  color: var(--c-on-dark);
}

.ds-sidebar-option:hover,
.ds-sidebar-option:focus-visible {
  color: var(--c-accent);
}
.ds-sidebar-option[aria-pressed="true"] {
  color: var(--c-accent);
}

.ds-sidebar-option[aria-current="page"]:hover,
.ds-sidebar-option[aria-current="page"]:focus-visible {
  color: var(--c-on-dark);
}

.ds-menu { display: none; }
.ds-content { grid-area: content; min-width: 0; }

.front-page {
  display: grid;
  grid-template-columns: minmax(360px, 0.34fr) minmax(330px, 0.28fr) minmax(460px, 0.38fr);
  grid-template-areas:
    "lead feature feature"
    "latest latest latest";
  background: var(--c-paper);
  border-bottom: 0;
}

.front-lead {
  grid-area: lead;
  min-width: 0;
  min-height: 0;
  height: clamp(430px, 34vw, 640px);
  display: grid;
  align-content: start;
  gap: clamp(18px, 2vw, 30px);
  padding: clamp(34px, 3.6vw, 78px) clamp(28px, 3.2vw, 62px) clamp(28px, 3.4vw, 62px);
  border-right: var(--b-strong);
  border-bottom: var(--b-strong);
}

.front-lead h1 {
  max-width: 100%;
  color: var(--c-ink);
  font-size: clamp(2.75rem, 3.25vw, 5rem);
  line-height: 0.96;
  text-wrap: balance;
}

[data-language="en"] .front-lead h1 {
  font-size: clamp(2.45rem, 3.1vw, 4.6rem);
}

.front-lead-copy {
  max-width: 36ch;
  margin: 0;
  padding-top: clamp(10px, 1.2vw, 18px);
  color: var(--c-ink);
  font-size: clamp(1.08rem, 1.22vw, 1.48rem);
  line-height: 1.42;
}

.front-lead-copy::before {
  content: "";
  display: block;
  width: 42px;
  height: 1px;
  margin-bottom: clamp(14px, 1.5vw, 24px);
  background: var(--c-rule-strong);
}

.front-feature {
  grid-area: feature;
  min-width: 0;
  min-height: 0;
  height: clamp(430px, 34vw, 640px);
  display: grid;
  grid-template-columns: minmax(430px, 0.58fr) minmax(280px, 0.42fr);
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  border-bottom: var(--b-strong);
  overflow: hidden;
}

.front-feature-copy {
  position: relative;
  min-width: 0;
  display: grid;
  align-content: center;
  padding: clamp(38px, 4.2vw, 86px) clamp(30px, 4vw, 70px);
  background: var(--c-feature-bg);
  color: var(--c-feature-ink);
  border-right: var(--b-strong);
  overflow: hidden;
  transition: background-color 180ms ease;
}

.front-feature-copy::after {
  content: "";
  position: absolute;
  right: clamp(30px, 4vw, 70px);
  bottom: clamp(22px, 3vw, 48px);
  left: clamp(30px, 4vw, 70px);
  height: 1px;
  background: var(--c-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

.front-feature-copy .editorial-mark {
  margin-bottom: 22px;
  width: 52px;
  height: 3px;
}

.front-feature-copy h2 {
  max-width: 100%;
  color: var(--c-feature-ink);
  font-size: clamp(3.2rem, 3.7vw, 5.35rem);
  line-height: 1;
}

.feature-description {
  max-width: 62ch;
  margin: clamp(16px, 1.8vw, 24px) 0 0;
  color: color-mix(in oklch, var(--c-feature-ink) 78%, transparent);
  font-size: clamp(1rem, 1.06vw, 1.2rem);
  font-weight: 700;
  line-height: 1.42;
}

.front-feature-art {
  display: block;
  min-width: 0;
  min-height: 0;
  height: 100%;
  align-self: stretch;
  overflow: hidden;
  background: var(--c-paper-deep);
}

.front-feature-art .hero-collage,
.front-feature-art .hero-collage-photo,
.front-feature-art img {
  height: 100%;
  min-height: 0;
}

.front-feature-art img { object-position: center 44%; }

.feature-arrow {
  width: fit-content;
  margin-top: clamp(18px, 2vw, 32px);
  color: var(--c-accent);
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 3.2vw, 4.4rem);
  line-height: 1;
  transition: color 180ms ease, transform 180ms ease;
}

.front-feature:hover .front-feature-copy,
.front-feature:focus-within .front-feature-copy {
  background: color-mix(in oklch, var(--c-feature-bg) 90%, var(--c-accent) 10%);
}

.front-feature:hover .front-feature-copy::after,
.front-feature:focus-within .front-feature-copy::after {
  transform: scaleX(1);
}

.front-feature:hover .feature-arrow,
.front-feature:focus-within .feature-arrow {
  color: var(--c-accent);
}

.front-feature:hover .feature-arrow,
.front-feature:focus-within .feature-arrow,
.front-article-card:hover .article-card-arrow,
.front-article-card:focus-visible .article-card-arrow,
.article-card:hover .article-card-arrow,
.article-card:focus-visible .article-card-arrow { transform: translateX(8px); }

.front-latest {
  grid-area: latest;
  min-width: 0;
  background: var(--c-paper);
}

.section-strip {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: clamp(22px, 3vw, 48px);
  min-width: 0;
  padding: clamp(28px, 4vw, 56px) var(--rule-inset) clamp(18px, 2.4vw, 34px);
}

.front-article-card::before,
.article-card::before {
  content: "";
  position: absolute;
  right: var(--rule-inset);
  top: 0;
  left: var(--rule-inset);
  height: 1px;
  background: var(--c-rule-strong);
  transition: background-color 160ms ease;
}

.section-strip h2 {
  display: grid;
  gap: clamp(14px, 1.6vw, 22px);
  min-width: 0;
  color: var(--c-ink);
  font-size: clamp(2.5rem, 4.2vw, 5.2rem);
  line-height: 0.86;
}

.section-strip h2::before {
  content: "";
  width: clamp(72px, 8vw, 150px);
  height: 4px;
  background: var(--c-accent);
}

.section-strip a {
  min-width: 0;
  color: var(--c-accent);
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 1.75vw, 2rem);
  letter-spacing: 0.02em;
  text-align: right;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.section-strip a:hover { color: var(--c-accent-dark); }

.front-article-grid,
.article-list { min-width: 0; }

.front-article-card,
.article-card {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-areas:
    "topic topic topic"
    "image body arrow";
  align-items: center;
  min-width: 0;
  padding-inline: var(--rule-inset);
  color: var(--c-ink);
  background: transparent;
  transition: background-color 160ms ease, color 160ms ease;
}

.front-article-card {
  grid-template-columns: minmax(210px, 280px) minmax(0, 1fr) 70px;
  column-gap: clamp(24px, 3vw, 46px);
  min-height: clamp(160px, 11.5vw, 194px);
}

.front-article-card[hidden],
.article-card[hidden] { display: none; }

.article-card-topic {
  grid-area: topic;
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 0;
  height: auto;
  padding: clamp(18px, 2vw, 30px) 0 0;
  color: var(--c-accent);
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 1.45vw, 1.85rem);
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.article-card-image {
  grid-area: image;
  display: block;
  width: 100%;
  height: clamp(118px, 8.8vw, 150px);
  min-width: 0;
  margin: clamp(14px, 1.8vw, 22px) 0 clamp(18px, 2vw, 26px);
  overflow: hidden;
  background: var(--c-paper-deep);
}

.article-card-image .hero-collage { height: 100%; min-height: 100%; }

.article-card-body {
  grid-area: body;
  display: grid;
  align-content: center;
  gap: 10px;
  min-width: 0;
  padding: clamp(18px, 2.2vw, 32px) 0;
}

.article-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  color: var(--c-dim);
  font-family: var(--font-display);
  font-size: clamp(0.95rem, 1vw, 1.1rem);
  letter-spacing: 0.02em;
  line-height: 1.15;
  text-transform: uppercase;
}

.front-article-card .article-card-meta,
.article-list .article-card-meta { display: flex; }

.front-article-card .article-card-meta > span,
.article-list .article-card-meta > span { display: none; }

.front-article-card strong,
.article-card strong {
  display: block;
  min-width: 0;
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: clamp(2rem, 2.85vw, 3.55rem);
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 0.96;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  text-wrap: balance;
  transition: color 160ms ease;
}

.front-article-card strong {
  font-size: clamp(1.75rem, 2.35vw, 2.95rem);
  line-height: 1;
}

.article-card-description {
  color: var(--c-muted);
  font-size: clamp(0.98rem, 1.02vw, 1.12rem);
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.article-card-arrow {
  grid-area: arrow;
  display: grid;
  place-items: center;
  align-self: center;
  justify-self: end;
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 3.2vw, 4.2rem);
  line-height: 1;
  transition: color 160ms ease, transform 180ms ease;
}

.front-article-card:hover,
.front-article-card:focus-visible,
.article-card:hover,
.article-card:focus-visible {
  background: color-mix(in oklch, var(--c-paper-deep) 36%, transparent);
}

.front-article-card:hover::before,
.front-article-card:focus-visible::before,
.article-card:hover::before,
.article-card:focus-visible::before,
.front-article-card:hover + .front-article-card::before,
.front-article-card:focus-visible + .front-article-card::before,
.article-card:hover + .article-card::before,
.article-card:focus-visible + .article-card::before {
  background: var(--c-accent);
}

.front-article-card:hover .article-card-topic,
.front-article-card:focus-visible .article-card-topic,
.front-article-card:hover .article-card-arrow,
.front-article-card:focus-visible .article-card-arrow,
.article-card:hover .article-card-topic,
.article-card:focus-visible .article-card-topic,
.article-card:hover .article-card-arrow,
.article-card:focus-visible .article-card-arrow {
  color: var(--c-accent);
}

.daorde-shell--home:has(.front-article-grid > .front-article-card:last-child:hover) .ds-footer,
.daorde-shell--home:has(.front-article-grid > .front-article-card:last-child:focus-visible) .ds-footer,
.daorde-shell--articles:has(.article-list > .article-card:last-child:hover) .ds-footer,
.daorde-shell--articles:has(.article-list > .article-card:last-child:focus-visible) .ds-footer {
  border-top-color: var(--c-accent);
}

.button-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-height: 40px;
  padding: 9px 18px;
  border: 1px solid var(--c-rule-strong);
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.button-line:hover {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-on-dark);
}

.button-line:active,
.ds-nav-link:active { transform: translateY(1px); }

.article-index {
  --article-index-inset: clamp(24px, 2.4vw, 48px);
  display: grid;
  grid-template-columns: 1fr;
  border-bottom: 0;
}

.article-index-hero {
  padding: clamp(34px, 4.8vw, 82px) var(--article-index-inset) clamp(28px, 2.6vw, 52px);
  border-bottom: var(--b);
  background: var(--c-paper);
}

.article-index-hero h1 {
  color: var(--c-ink);
  font-size: clamp(4.5rem, 8vw, 9rem);
  max-width: 100%;
  line-height: 0.9;
}

.article-index-hero > p {
  max-width: min(100%, 92ch);
  margin: clamp(18px, 2.4vw, 34px) 0 0;
  color: var(--c-muted);
  font-size: clamp(1.16rem, 1.35vw, 1.55rem);
  line-height: 1.48;
}

.article-tag-filter {
  display: grid;
  grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 18px var(--article-index-inset);
  border-bottom: 0;
  background: var(--c-paper-deep);
}

.article-tag-filter h2 {
  color: var(--c-ink);
  font-size: clamp(1.25rem, 1.35vw, 1.6rem);
}

.article-tag-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.article-tag-options button {
  min-height: 34px;
  border: 1px solid var(--c-rule);
  background: transparent;
  color: var(--c-ink);
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: 0.02em;
  line-height: 1;
  padding: 7px 12px;
  text-align: left;
  text-transform: uppercase;
}

.article-tag-options button[hidden] { display: none; }
.article-tag-options button:hover,
.article-tag-options button[aria-pressed="true"] {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-on-dark);
}

.article-list { border-bottom: 0; }

.article-index .article-card {
  padding-inline: var(--article-index-inset);
}

.article-index .article-card::before {
  right: var(--article-index-inset);
  left: var(--article-index-inset);
}

.article-index .article-list > .article-card:first-child::before {
  right: 0;
  left: 0;
}

.article-card {
  grid-template-columns: minmax(270px, 340px) minmax(0, 1fr) 78px;
  column-gap: clamp(28px, 3.2vw, 58px);
  min-height: clamp(188px, 13.5vw, 226px);
}

.article-list .article-card strong {
  font-size: clamp(1.75rem, 2.35vw, 2.95rem);
  line-height: 1;
}

.article-card > .article-card-image {
  height: clamp(144px, 10.5vw, 178px);
  border: 0;
}

.article-card > .article-card-body { padding-block: clamp(22px, 2.7vw, 40px); }

.reading-layout {
  display: grid;
  grid-template-columns:
    minmax(var(--rule-inset), 1fr)
    minmax(0, 70ch)
    minmax(180px, 252px)
    minmax(var(--rule-inset), 1fr);
  grid-template-areas:
    ". hero hero ."
    ". body guide .";
  column-gap: clamp(30px, 4.6vw, 72px);
  border-bottom: var(--b-strong);
  background: var(--c-paper);
}

.reading-hero {
  grid-area: hero;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 3.2vw, 48px);
  min-width: 0;
  padding: clamp(42px, 6vw, 96px) var(--rule-inset) clamp(32px, 4vw, 62px);
  border-bottom: var(--b-strong);
}

.institutional-hero {
  grid-template-columns: minmax(320px, 0.78fr) minmax(460px, 1.22fr);
  align-items: stretch;
  gap: 0;
  padding: 0;
}

.institutional-heading {
  display: grid;
  align-content: center;
  min-width: 0;
  padding: clamp(42px, 6vw, 96px) var(--rule-inset);
  border-right: var(--b-strong);
}

.institutional-heading h1 {
  font-size: clamp(4.2rem, 7.4vw, 9.2rem);
}

.institutional-deck {
  max-width: 48ch;
  margin: clamp(22px, 2.6vw, 38px) 0 0;
  padding-top: clamp(18px, 2vw, 28px);
  border-top: var(--b);
  color: var(--c-muted);
  font-size: clamp(1.08rem, 1.24vw, 1.38rem);
  font-weight: 700;
  line-height: 1.46;
  text-wrap: pretty;
}

.institutional-art {
  min-width: 0;
  min-height: clamp(430px, 42vw, 720px);
  margin: 0;
  overflow: hidden;
  background: var(--c-paper-deep);
}

.institutional-art img { object-position: center; }

.reading-title-block {
  min-width: 0;
  max-width: 100%;
}

.reading-hero h1 {
  max-width: 100%;
  color: var(--c-ink);
  font-size: clamp(4.8rem, 8.8vw, 10.8rem);
  line-height: 1.02;
  overflow-wrap: anywhere;
}

.reading-deck {
  max-width: 100%;
  margin: clamp(18px, 2vw, 28px) 0 0;
  color: var(--c-muted);
  font-size: clamp(1.16rem, 1.42vw, 1.52rem);
  font-weight: 700;
  line-height: 1.34;
  text-wrap: pretty;
}

.reading-folio {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(18px, 3vw, 48px);
  min-width: 0;
  max-width: min(100%, 1120px);
  margin: 0;
}

.reading-folio div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  padding: 12px 0;
  border-top: var(--b-strong);
  border-bottom: var(--b);
}

.reading-folio dt,
.reading-folio dd {
  min-width: 0;
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.24;
  overflow-wrap: anywhere;
}

.reading-art {
  width: 100%;
  aspect-ratio: 3 / 2;
  max-height: min(68vh, 820px);
  margin: 0;
  overflow: hidden;
  border-top: var(--b-strong);
  border-bottom: var(--b-strong);
  background: var(--c-paper-deep);
}

.reading-art img { object-position: center; }

.reading-folio dt {
  color: var(--c-accent);
  font-family: var(--font-display);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.reading-folio dd {
  color: var(--c-ink);
  font-weight: 700;
}

.reading-content {
  grid-area: body;
  width: 100%;
  max-width: 70ch;
  min-width: 0;
  padding: clamp(48px, 7vw, 92px) 0 72px;
  color: var(--c-ink);
  font-family: var(--font-body);
  font-size: clamp(1.06rem, 1.12vw, 1.2rem);
  line-height: 1.74;
  overflow-wrap: anywhere;
}

.reading-content p,
.reading-content li { overflow-wrap: anywhere; }

.reading-content h2,
.reading-content h3 {
  position: relative;
  margin-top: clamp(56px, 6vw, 86px);
  margin-bottom: 22px;
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: clamp(1.95rem, 2.45vw, 3rem);
  letter-spacing: 0.01em;
  line-height: 1.02;
  text-transform: uppercase;
  text-wrap: balance;
}

.reading-content > h2:first-child,
.article-content > h2:first-child {
  margin-top: 0;
}

.reading-content h2::before {
  content: "";
  display: block;
  width: clamp(42px, 5vw, 82px);
  height: 4px;
  margin-bottom: 14px;
  background: var(--c-accent);
}

.reading-content h2::after,
.reading-content h3::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  margin-top: 6px;
  background: var(--c-rule);
}

.reading-content h3 { font-size: clamp(1.55rem, 2vw, 2.2rem); }

.reading-content h3::before {
  content: "";
  display: block;
  width: 34px;
  height: 3px;
  margin-bottom: 10px;
  background: var(--c-accent);
}

.reading-content a:not(.button-line):not(.share-btn) {
  color: var(--c-accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in oklch, var(--c-accent) 74%, transparent);
  overflow-wrap: anywhere;
  transition: background-color 160ms ease, color 160ms ease, text-decoration-color 160ms ease;
}

.reading-content a:not(.button-line):not(.share-btn):hover,
.reading-content a:not(.button-line):not(.share-btn):focus-visible {
  background: color-mix(in oklch, var(--c-accent) 13%, transparent);
  color: var(--c-accent-dark);
  text-decoration-color: var(--c-accent-dark);
}

.reading-content blockquote {
  margin: clamp(30px, 4vw, 48px) 0;
  border: 1px solid var(--c-rule-strong);
  padding: clamp(18px, 2.4vw, 28px);
  background: color-mix(in oklch, var(--c-paper-soft) 70%, var(--c-paper));
  color: var(--c-ink);
  font-size: clamp(1.16rem, 1.25vw, 1.34rem);
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.origin-statement,
.privacy-summary {
  margin: 0 0 clamp(58px, 7vw, 88px);
  padding: clamp(24px, 3.4vw, 40px);
  border-top: 5px solid var(--c-accent);
  border-bottom: var(--b-strong);
  background: color-mix(in oklch, var(--c-paper-deep) 48%, var(--c-paper));
}

.origin-statement h2,
.origin-statement h3,
.privacy-summary h2 {
  margin-top: 0;
}

.origin-statement h3 {
  margin-top: clamp(30px, 4vw, 48px);
}

.origin-statement p:last-child,
.privacy-summary p:last-child { margin-bottom: 0; }

.reading-content ul,
.reading-content ol { padding-left: 1.25em; }

.reading-side {
  grid-area: guide;
  align-self: start;
  min-width: 0;
  padding: clamp(50px, 7vw, 88px) 0 0;
  position: sticky;
  top: clamp(18px, 2vw, 32px);
  max-height: calc(100svh - clamp(36px, 4vw, 64px));
  overflow: auto;
}

.side-section {
  padding: 16px 0 22px;
  margin-bottom: 18px;
  border-bottom: var(--b);
}

.side-section:first-child { border-top: var(--b-strong); }

.side-section h2 {
  margin-bottom: 16px;
  color: var(--c-ink);
  font-size: clamp(1.08rem, 1.1vw, 1.32rem);
  letter-spacing: 0.02em;
}

.toc-list {
  list-style: none;
  display: grid;
  gap: 11px;
  margin: 0;
  padding: 0;
}

.toc-item,
.toc-list li { margin: 0; }

.toc-link,
.toc-list a {
  color: var(--c-muted);
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.toc-link.active,
.toc-link:hover,
.toc-list a:hover { color: var(--c-accent); }

.toc-number {
  color: var(--c-accent);
  font-family: var(--font-display);
  margin-right: 8px;
}

.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 12px;
}

.tag-cloud span {
  min-width: 0;
  border-bottom: 1px solid var(--c-rule);
  padding: 0 0 4px;
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}

.page-actions > * { min-width: 0; }

.share-buttons {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 34px;
  padding-top: 18px;
  border-top: var(--b);
}

.share-label {
  color: var(--c-dim);
  font-family: var(--font-display);
  font-size: 1rem;
  text-transform: uppercase;
}

.share-btn {
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 38px;
  border: 1px solid var(--c-rule);
  background: transparent;
  color: var(--c-ink);
  cursor: pointer;
}

.share-btn:hover {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-on-dark);
}

.article-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 72px);
  padding: clamp(28px, 4vw, 52px) var(--rule-inset);
  background: var(--c-paper);
}

.article-nav-link--next:only-child {
  grid-column: 2;
}

.article-nav-link {
  position: relative;
  display: grid;
  align-content: start;
  gap: clamp(10px, 1vw, 16px);
  min-width: 0;
  color: var(--c-ink);
}

.article-nav-link--next {
  justify-items: end;
  text-align: right;
}

.article-nav-link::after {
  content: "";
  display: block;
  width: clamp(48px, 6vw, 96px);
  height: 4px;
  background: var(--c-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

.article-nav-link--next::after { transform-origin: right; }

.article-nav-link:hover::after,
.article-nav-link:focus-visible::after { transform: scaleX(1); }

.article-nav-label {
  color: var(--c-accent);
  font-family: var(--font-display);
  font-size: 1.02rem;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.article-nav-title {
  font-family: var(--font-display);
  font-size: clamp(2.35rem, 4.4vw, 5.2rem);
  line-height: 0.96;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  text-wrap: balance;
  transition: color 160ms ease;
}

.article-nav-link:hover .article-nav-title,
.article-nav-link:focus-visible .article-nav-title {
  color: color-mix(in oklch, var(--c-ink) 78%, var(--c-accent));
}

.ds-footer {
  grid-area: contact;
  display: grid;
  grid-template-columns:
    minmax(140px, 0.72fr)
    minmax(220px, 1fr)
    minmax(220px, 1fr)
    minmax(260px, 1.2fr);
  align-items: center;
  min-height: clamp(82px, 6vw, 118px);
  padding: clamp(12px, 1.4vw, 20px) clamp(24px, 3.2vw, 64px);
  background: var(--c-shell);
  color: var(--c-ink);
  font-family: var(--font-display);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-top: 1px solid var(--c-shell-rule);
  border-bottom: 1px solid var(--c-shell-rule);
}

.ds-footer > * {
  position: relative;
  min-width: 0;
  padding: 0 clamp(16px, 1.8vw, 30px);
}

.ds-footer > *::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: clamp(30px, 3vw, 48px);
  background: var(--c-rule);
  transform: translateY(-50%);
}

.ds-footer > *:first-child {
  padding-left: 0;
}

.ds-footer > *:first-child::before {
  content: none;
}

.ds-footer-mark {
  color: var(--c-ink);
  font-size: clamp(0.98rem, 1.08vw, 1.25rem);
  white-space: nowrap;
}

.ds-footer-contact {
  display: grid;
  gap: 3px;
  color: var(--c-ink);
  font-family: var(--font-body);
  font-size: clamp(0.9rem, 1vw, 1.08rem);
  font-weight: 700;
  line-height: 1.2;
  text-transform: none;
}

.ds-footer-contact strong {
  color: var(--c-accent);
  font-family: var(--font-display);
  font-size: clamp(0.9rem, 0.98vw, 1.12rem);
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
}

.ds-footer-contact span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ds-footer-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(16px, 2vw, 34px);
  color: var(--c-ink);
  font-size: clamp(0.92rem, 1.02vw, 1.18rem);
}

.ds-footer-links a + a::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 14px;
  margin-right: clamp(16px, 2vw, 34px);
  vertical-align: -3px;
  background: var(--c-rule);
}

.ds-footer a:hover { color: var(--c-accent); }

.hero-collage,
.hero-collage-photo,
.hero-collage-photo img {
  width: 100%;
  height: 100%;
  min-height: inherit;
}

.hero-collage {
  position: relative;
  overflow: hidden;
  background: var(--c-charcoal);
}

.hero-collage-photo img {
  object-fit: cover;
  transition: transform 240ms ease, filter 240ms ease;
}

.front-feature:hover img,
.front-feature:focus-within img,
.front-feature-art:hover img,
.front-article-card:hover img,
.front-article-card:focus-visible img,
.article-card:hover img,
.article-card:focus-visible img {
  transform: scale(1.03);
}

.error-page {
  min-height: 52vh;
  padding: clamp(36px, 8vw, 96px);
  border-bottom: var(--b-strong);
}

.error-page h1 { font-size: clamp(8rem, 22vw, 18rem); }

.error-page p {
  max-width: 48ch;
  color: var(--c-muted);
  font-size: 1.08rem;
}

.error-page .button-line { margin-top: 18px; }

@media (max-width: 1280px) {
  .ds-header {
    grid-template-columns: minmax(300px, 0.42fr) minmax(0, 0.58fr);
    grid-template-areas:
      "brand panel";
    gap: clamp(30px, 4.2vw, 58px);
    padding: clamp(22px, 3.4vw, 46px) clamp(24px, 3.5vw, 54px) clamp(18px, 2.6vw, 32px);
  }

  .ds-header::before { content: none; }
  .ds-header-panel { width: 100%; }
  .ds-brand span { font-size: clamp(4.8rem, 8.2vw, 7.3rem); }
  .ds-nav { gap: clamp(18px, 3vw, 42px); }
  .ds-nav-link { font-size: clamp(1.22rem, 1.9vw, 1.85rem); }
  .ds-tools { justify-content: flex-start; }
  .ds-sidebar-control { padding-inline: clamp(12px, 1.4vw, 22px); }

  .front-page {
    grid-template-columns: minmax(300px, 0.34fr) minmax(0, 0.66fr);
    grid-template-areas:
      "lead feature"
      "latest latest";
  }

  .front-lead {
    height: auto;
    min-height: 500px;
    border-right: var(--b-strong);
  }

  .front-lead h1 { max-width: 100%; }
  [data-language="en"] .front-lead h1 { font-size: clamp(2.9rem, 6vw, 4.9rem); }
  .front-feature {
    min-height: 500px;
    grid-template-columns: minmax(320px, 0.58fr) minmax(210px, 0.42fr);
  }

  .reading-layout {
    grid-template-columns:
      minmax(28px, 1fr)
      minmax(0, 70ch)
      minmax(180px, 252px)
      minmax(28px, 1fr);
    grid-template-areas:
      ". hero hero ."
      ". body guide .";
    column-gap: clamp(24px, 3.6vw, 46px);
  }

  .reading-hero {
    grid-template-columns: 1fr;
    padding-left: var(--rule-inset);
    padding-right: var(--rule-inset);
  }

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

  .reading-folio div {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 12px 0;
  }

  .side-section,
  .side-section:first-child {
    border-top: 0;
  }
}

@media (max-width: 1040px) {
  .front-page {
    grid-template-columns: 1fr;
    grid-template-areas:
      "lead"
      "feature"
      "latest";
  }

  .front-lead {
    min-height: 0;
    border-right: 0;
  }

  .front-feature { grid-template-columns: minmax(360px, 0.58fr) minmax(260px, 0.42fr); }

  .reading-layout {
    grid-template-columns: minmax(28px, 1fr) minmax(0, 72ch) minmax(28px, 1fr);
    grid-template-areas:
      ". hero ."
      ". body ."
      ". guide .";
  }

  .reading-content {
    max-width: 72ch;
  }

  .institutional-hero {
    grid-template-columns: 1fr;
  }

  .institutional-heading {
    border-right: 0;
    border-bottom: var(--b-strong);
  }

  .institutional-art { min-height: clamp(360px, 64vw, 620px); }

  .reading-side {
    width: 100%;
    position: static;
    min-height: 0;
    max-height: none;
    padding: 0 0 clamp(36px, 5vw, 58px);
    overflow: visible;
  }

  .reading-guide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 0.45fr);
    gap: clamp(22px, 4vw, 44px);
    border-top: var(--b-strong);
  }
}

@media (max-width: 1120px) and (min-width: 821px) {
  .front-article-card,
  .article-card {
    grid-template-columns: minmax(160px, 260px) minmax(0, 1fr) 58px;
    column-gap: clamp(18px, 2.2vw, 28px);
    min-height: 0;
  }

  .front-article-card .article-card-image,
  .article-card .article-card-image {
    height: clamp(124px, 16vw, 170px);
  }

  .ds-footer {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-inline: var(--rule-inset);
  }

  .ds-footer > * {
    padding-inline: clamp(10px, 1.4vw, 18px);
  }

  .ds-footer-links {
    justify-content: flex-start;
  }
}

@media (max-width: 820px) {
  body { background-size: 100% 32px, auto; }

  .ds-header {
    grid-template-columns: minmax(0, 1fr) 58px;
    grid-template-areas:
      "brand menu"
      "panel panel";
    gap: 18px 0;
    min-height: 0;
    padding: 18px 20px 20px;
  }

  .ds-brand-block {
    --ds-brand-mark: 7px;
    --ds-brand-gap: 14px;
    gap: 8px;
    align-self: center;
  }

  .ds-brand span {
    font-size: clamp(3.55rem, 18vw, 4.8rem);
  }

  .ds-tagline {
    margin-left: calc(var(--ds-brand-mark) + var(--ds-brand-gap));
    font-size: clamp(0.78rem, 3.1vw, 0.98rem);
    letter-spacing: 0.08em;
  }

  .ds-header-panel { display: none; }

  .nav-open .ds-header-panel {
    display: grid;
    gap: 0;
    grid-template-columns: 1fr;
    padding-top: 8px;
    border-top: 1px solid var(--c-rule);
  }

  .ds-nav {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .ds-nav-link {
    justify-content: flex-start;
    min-height: 48px;
    padding: 12px 0 10px;
    border-bottom: 1px solid var(--c-rule);
    font-size: 1.38rem;
  }

  .ds-nav-link::after {
    left: 0;
    bottom: -1px;
    width: 72px;
    height: 4px;
    translate: 0;
  }

  .ds-menu {
    grid-area: menu;
    display: grid;
    place-items: center;
    align-self: stretch;
    border: 0;
    border-left: 1px solid var(--c-rule);
    background: transparent;
    color: var(--c-ink);
    cursor: pointer;
    font-size: 2rem;
  }

  .ds-menu[aria-expanded="true"] { color: var(--c-accent); }

  .ds-tools {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
    border-top: 0;
  }

  .ds-sidebar-control {
    flex-wrap: wrap;
    padding: 12px 0;
    border-right: 0;
    border-bottom: 1px solid var(--c-rule);
  }

  .ds-sidebar-control:last-child { border-bottom: 0; }
  .ds-sidebar-segment { width: 100%; }
  .ds-sidebar-option { flex: 1 1 auto; }

  .front-lead {
    min-height: 360px;
    padding: 28px 28px 22px;
  }

  .front-lead h1 {
    max-width: 100%;
    font-size: clamp(2.85rem, 11.6vw, 4.25rem);
  }

  [data-language="en"] .front-lead h1 {
    font-size: clamp(2.55rem, 10.4vw, 3.7rem);
  }

  .front-feature {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
  }

  .institutional-heading { padding: 34px 28px; }
  .institutional-heading h1 { font-size: clamp(3.8rem, 18vw, 6rem); }
  .institutional-art { min-height: 280px; }
  .institutional-deck { font-size: 1.08rem; }

  .front-feature-copy {
    min-height: 320px;
    border-right: 0;
    border-bottom: var(--b-strong);
    padding: 32px 28px;
  }

  .front-feature-copy h2 {
    max-width: 12ch;
    font-size: clamp(2.8rem, 12vw, 4.35rem);
    line-height: 1;
  }

  .front-feature-art { min-height: 280px; }

  .section-strip {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px 28px 14px;
  }

  .section-strip a { text-align: left; }

  .front-article-card,
  .article-card {
    grid-template-columns: minmax(0, 1fr) 54px;
    grid-template-areas:
      "topic topic"
      "image image"
      "body arrow";
    min-height: 0;
    align-items: stretch;
  }

  .front-article-card .article-card-topic,
  .article-card .article-card-topic {
    grid-column: 1 / -1;
    min-height: 42px;
    padding: 14px 28px 0;
  }

  .front-article-card .article-card-image,
  .article-card .article-card-image {
    grid-column: 1 / -1;
    width: auto;
    height: 210px;
    margin: 14px 28px 0;
  }

  .article-card > .article-card-image { border: 1px solid var(--c-rule); }

  .front-article-card .article-card-body,
  .article-card .article-card-body {
    grid-column: 1;
    padding: 16px 28px 24px;
  }

  .front-article-card .article-card-arrow,
  .article-card .article-card-arrow {
    grid-column: 2;
    grid-row: 3;
    align-self: center;
    padding-bottom: 22px;
  }

  .front-article-card strong,
  .article-card strong {
    font-size: clamp(1.75rem, 8.4vw, 2.6rem);
    line-height: 0.98;
  }

  .article-index-hero { padding: 34px 28px; }
  .article-index-hero h1 { font-size: clamp(4.2rem, 19vw, 7rem); }

  .article-tag-filter {
    grid-template-columns: 1fr;
    padding: 18px 28px;
  }

  .reading-layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "hero"
      "body"
      "guide";
  }

  .reading-hero,
  .reading-content,
  .reading-side {
    padding-left: 28px;
    padding-right: 28px;
  }

  .reading-hero {
    gap: 24px;
    padding-top: 34px;
  }

  .reading-hero h1 {
    max-width: 100%;
    font-size: clamp(3.2rem, 15vw, 5.3rem);
  }

  .reading-deck {
    font-size: clamp(1.08rem, 4.6vw, 1.28rem);
    line-height: 1.36;
  }

  .reading-folio {
    grid-template-columns: 1fr;
  }

  .reading-folio div,
  .reading-folio div:first-child {
    grid-template-columns: minmax(72px, 0.34fr) minmax(0, 1fr);
    gap: 12px;
    padding: 10px 0;
  }

  .reading-guide {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .reading-content h2::before,
  .reading-content h3::before { margin-bottom: 10px; }

  .article-nav {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 28px;
  }

  .article-nav-link--next:only-child {
    grid-column: 1;
  }

  .article-nav-link,
  .article-nav-link:last-child {
    justify-items: start;
    text-align: left;
  }

  .article-nav-link--next::after { transform-origin: left; }

  .ds-footer {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 0;
    padding: 16px 22px;
  }

  .ds-footer > * {
    width: 100%;
    padding: 10px 0;
    border-bottom: 1px solid var(--c-rule);
  }

  .ds-footer > *::before {
    content: none;
  }

  .ds-footer > *:last-child {
    border-bottom: 0;
  }

  .ds-footer-links {
    justify-content: flex-start;
  }
}

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