/* Hallmark · genre: editorial · tone: restrained atelier · palette: warm mineral · macrostructure: Photographic · theme: Atelier · enrichment: supplied photography · nav: N9 · footer: Ft1 · contrast: pass (46–50) · slop: pass (51–55) · honest: pass (56) · chrome: pass (57) · tokens: pass (58) · responsive: pass (59) · icons: pass (60) · mobile: pass (36, 59, 61–69) */
/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V4 */

* {
  box-sizing: border-box;
}

html,
body {
  overflow-x: clip;
}

html {
  scroll-behavior: smooth;
  background: var(--color-paper);
}

body {
  margin: 0;
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.6;
}

main,
header,
footer,
section,
figure,
div {
  min-width: 0;
}

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

button {
  font: inherit;
}

a,
button {
  -webkit-tap-highlight-color: var(--color-transparent);
}

a:focus-visible,
button:focus-visible {
  outline: var(--rule-strong) solid var(--color-focus);
  outline-offset: var(--space-3xs);
}

img {
  display: block;
  height: auto;
  max-width: 100%;
}

figure,
h1,
h2,
h3,
p,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3,
.wordmark,
.footer-wordmark {
  font-family: var(--font-display);
  font-weight: 400;
}

h1,
h2,
h3 {
  overflow-wrap: anywhere;
}

#material,
#wearing,
#motion,
#comparison,
#order {
  scroll-margin-block-start: var(--space-2xl);
}

.site-header {
  position: sticky;
  inset-block-start: 0;
  z-index: var(--z-sticky);
  min-height: 4.5rem;
  padding: var(--space-sm) var(--page-gutter);
  border-block-end: var(--rule-hair) solid var(--color-rule);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  background: var(--color-paper);
  color: var(--color-ink);
}

.wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-xs);
  white-space: nowrap;
}

.wordmark span {
  font-size: var(--text-xl);
  letter-spacing: -0.03em;
  line-height: 1;
}

.wordmark small {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
}

.header-action {
  min-height: 2.75rem;
  padding-inline: var(--space-sm);
  border: var(--rule-hair) solid var(--color-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-sm);
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  transition:
    background-color var(--dur-short) var(--ease-out),
    color var(--dur-short) var(--ease-out),
    transform var(--dur-micro) var(--ease-out);
}

.header-action:active {
  transform: translateY(1px);
}

.hero {
  background: var(--color-paper);
}

.hero-visual {
  background: var(--color-dark);
}

.hero-visual img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.hero-visual figcaption {
  padding: var(--space-xs) var(--page-gutter);
  color: var(--color-inverse-muted);
  font-size: 0.625rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.hero-copy {
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  display: grid;
  gap: var(--space-xl);
}

.hero-status {
  color: var(--color-accent);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.hero-title-block {
  display: grid;
  gap: var(--space-md);
}

.hero-title-block h1 {
  max-width: 12ch;
  font-size: var(--text-display);
  letter-spacing: -0.045em;
  line-height: 0.96;
}

.hero-title-block > p {
  max-width: var(--measure);
  color: var(--color-ink-2);
  font-size: var(--text-base);
}

.hero-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block-start: var(--rule-hair) solid var(--color-rule);
}

.hero-facts > div {
  padding-block: var(--space-sm);
}

.hero-facts dt,
.order-price span,
legend {
  color: var(--color-muted);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero-facts dd {
  margin-block-start: var(--space-3xs);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
}

.campaign {
  background: var(--color-dark);
  color: var(--color-inverse);
}

.campaign-photo {
  background: var(--color-dark-2);
}

.campaign-photo img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center 40%;
}

.campaign-photo figcaption {
  padding: var(--space-xs) var(--page-gutter);
  color: var(--color-inverse-muted);
  font-size: 0.625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.campaign-note {
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  display: grid;
  align-content: center;
  gap: var(--space-lg);
  background: var(--color-dark);
  color: var(--color-inverse);
}

.campaign-note h2 {
  max-width: 13ch;
  font-size: var(--text-display-small);
  letter-spacing: -0.035em;
  line-height: 1;
}

.campaign-note p {
  max-width: 52ch;
  color: var(--color-inverse-muted);
}

.campaign-note a,
.reference-row a {
  justify-self: start;
  min-height: 2.75rem;
  border-block-end: var(--rule-hair) solid currentColor;
  display: inline-flex;
  align-items: center;
  font-size: var(--text-sm);
  white-space: nowrap;
  transition:
    color var(--dur-short) var(--ease-out),
    transform var(--dur-micro) var(--ease-out);
}

.campaign-note a:active,
.reference-row a:active {
  transform: translateY(1px);
}

.material {
  padding: var(--space-3xl) var(--page-gutter) var(--space-4xl);
  background: var(--color-paper);
  color: var(--color-ink);
}

.material-intro {
  display: grid;
  gap: var(--space-xl);
}

.material-intro h2,
.reference-intro h2,
.order-copy h2 {
  max-width: 15ch;
  font-size: var(--text-display-small);
  letter-spacing: -0.035em;
  line-height: 1;
}

.material-prose {
  display: grid;
  gap: var(--space-md);
  color: var(--color-ink-2);
}

.material-prose p {
  max-width: var(--measure);
}

.material-caution {
  padding-inline-start: var(--space-md);
  border-inline-start: var(--rule-strong) solid var(--color-accent);
  color: var(--color-ink);
}

.material-study {
  margin-block-start: var(--space-2xl);
  display: grid;
  gap: var(--space-lg);
}

.material-study-image {
  background: var(--color-paper-2);
}

.material-study-image img {
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

.material-checks {
  padding-block: var(--space-lg);
  border-block: var(--rule-hair) solid var(--color-rule-strong);
}

.material-checks h3 {
  max-width: 12ch;
  font-size: var(--text-xl);
  line-height: 1.05;
}

.material-checks dl {
  margin-block-start: var(--space-lg);
  display: grid;
  gap: var(--space-md);
}

.material-checks dl > div {
  display: grid;
  gap: var(--space-3xs);
}

.material-checks dt {
  color: var(--color-accent);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.material-checks dd {
  color: var(--color-ink-2);
  font-size: var(--text-sm);
}

.creative-disclosure {
  max-width: 78ch;
  color: var(--color-muted);
  font-size: var(--text-sm);
}

.material-study-disclosure {
  padding-block-start: var(--space-md);
  border-block-start: var(--rule-hair) solid var(--color-rule);
}

.material-ledger {
  margin-block-start: var(--space-2xl);
  border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}

.material-ledger > div {
  min-height: 6.5rem;
  padding-block: var(--space-md);
  border-block-end: var(--rule-hair) solid var(--color-rule);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--space-md);
}

.material-ledger dt {
  color: var(--color-ink-2);
  font-size: var(--text-md);
}

.material-ledger dd {
  color: var(--color-accent);
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-variant-numeric: tabular-nums;
  line-height: 0.9;
}

.material-source {
  max-width: 70ch;
  margin-block-start: var(--space-md);
  color: var(--color-muted);
  font-size: var(--text-sm);
}

.wearing {
  padding: var(--space-4xl) var(--page-gutter);
  background: var(--color-paper);
  color: var(--color-ink);
}

.wearing-intro {
  display: grid;
  gap: var(--space-xl);
}

.wearing-intro h2 {
  max-width: 13ch;
  font-size: var(--text-display-small);
  letter-spacing: -0.035em;
  line-height: 1;
}

.wearing-intro p {
  max-width: var(--measure);
  color: var(--color-ink-2);
}

.wearing-gallery {
  margin-block-start: var(--space-2xl);
  display: grid;
  gap: var(--space-xl);
}

.wearing-look img {
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

.wearing-look figcaption {
  padding-block-start: var(--space-xs);
  color: var(--color-muted);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
}

.wearing-disclosure {
  margin-block-start: var(--space-xl);
  padding-block-start: var(--space-md);
  border-block-start: var(--rule-hair) solid var(--color-rule);
}

.motion {
  padding: var(--space-4xl) var(--page-gutter);
  background: var(--color-dark);
  color: var(--color-inverse);
}

.motion-intro {
  display: grid;
  gap: var(--space-xl);
}

.motion-intro h2 {
  max-width: 13ch;
  font-size: var(--text-display-small);
  letter-spacing: -0.035em;
  line-height: 1;
}

.motion-intro p {
  max-width: var(--measure);
  color: var(--color-inverse-muted);
}

.motion-gallery {
  margin-block-start: var(--space-2xl);
  display: grid;
  gap: var(--space-xl);
}

.motion-card {
  display: grid;
  gap: var(--space-xs);
}

.motion-card video {
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  background: var(--color-dark-2);
}

.motion-card figcaption {
  color: var(--color-inverse-muted);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
}

.motion-disclosure {
  margin-block-start: var(--space-xl);
  padding-block-start: var(--space-md);
  border-block-start: var(--rule-hair) solid var(--color-rule-strong);
  color: var(--color-inverse-muted);
}

.references {
  padding: var(--space-4xl) var(--page-gutter) var(--space-3xl);
  background: var(--color-paper-2);
  color: var(--color-ink);
}

.reference-intro {
  display: grid;
  gap: var(--space-xl);
}

.reference-intro > p {
  max-width: var(--measure);
  color: var(--color-ink-2);
}

.enyu-reference {
  margin-block-start: var(--space-2xl);
  padding: var(--space-lg);
  display: grid;
  gap: var(--space-lg);
  background: var(--color-dark);
  color: var(--color-inverse);
}

.enyu-reference > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-md);
}

.enyu-reference > div p {
  font-family: var(--font-display);
  font-size: var(--text-xl);
}

.enyu-reference strong {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.enyu-reference > p {
  max-width: var(--measure);
  color: var(--color-inverse-muted);
  font-size: var(--text-sm);
}

.reference-list {
  border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}

.reference-row {
  padding-block: var(--space-xl);
  border-block-end: var(--rule-hair) solid var(--color-rule-strong);
  display: grid;
  gap: var(--space-md);
}

.reference-brand {
  display: grid;
  gap: var(--space-3xs);
}

.reference-brand > p {
  color: var(--color-muted);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.reference-brand h3 {
  font-size: var(--text-xl);
  line-height: 1.08;
}

.reference-composition,
.reference-price {
  color: var(--color-ink);
  font-variant-numeric: tabular-nums;
}

.reference-price {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  white-space: nowrap;
}

.reference-reason {
  max-width: 56ch;
  color: var(--color-ink-2);
  font-size: var(--text-sm);
}

.reference-disclosure {
  margin-block-start: var(--space-xl);
  padding-block-start: var(--space-md);
  border-block-start: var(--rule-hair) solid var(--color-rule);
  display: grid;
  gap: var(--space-xs);
}

.reference-disclosure strong {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
}

.reference-disclosure p {
  max-width: 88ch;
  color: var(--color-muted);
  font-size: var(--text-sm);
}

.order {
  padding: var(--space-3xl) var(--page-gutter) var(--space-4xl);
  display: grid;
  gap: var(--space-2xl);
  background: var(--color-dark);
  color: var(--color-inverse);
}

.order-copy {
  display: grid;
  gap: var(--space-lg);
}

.order-copy p {
  max-width: 56ch;
  color: var(--color-inverse-muted);
}

.order-builder {
  padding-block-start: var(--space-lg);
  border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}

.order-price {
  padding-block-end: var(--space-lg);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-md);
}

.order-price span,
.order-builder legend {
  color: var(--color-inverse-muted);
}

.order-price strong {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

fieldset {
  min-width: 0;
  margin: 0 0 var(--space-lg);
  padding: 0;
  border: 0;
}

legend {
  margin-block-end: var(--space-xs);
}

.choice-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-xs);
}

.choice-button,
.primary-action {
  min-height: 3rem;
  border: var(--rule-hair) solid var(--color-rule-strong);
  background: var(--color-dark);
  color: var(--color-inverse);
  cursor: pointer;
  transition:
    background-color var(--dur-short) var(--ease-out),
    color var(--dur-short) var(--ease-out),
    transform var(--dur-micro) var(--ease-out);
}

.choice-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
}

.choice-button.is-selected,
.choice-button[aria-pressed="true"] {
  background: var(--color-inverse);
  color: var(--color-dark);
}

.choice-button:active,
.primary-action:active {
  transform: translateY(1px);
}

.choice-button:disabled,
.primary-action:disabled,
.choice-button[aria-disabled="true"],
.primary-action[aria-disabled="true"] {
  color: var(--color-disabled);
  cursor: not-allowed;
  opacity: 0.55;
}

.choice-button[aria-busy="true"],
.primary-action[aria-busy="true"] {
  cursor: wait;
  opacity: 0.72;
}

.choice-button[data-state="error"],
.primary-action[data-state="error"] {
  border-color: var(--color-error);
}

.choice-button[data-state="success"],
.primary-action[data-state="success"],
.primary-action[data-state="copied"] {
  border-color: var(--color-success);
}

.swatch {
  width: 1rem;
  height: 1rem;
  border: var(--rule-hair) solid currentColor;
  border-radius: var(--radius-round);
}

.swatch-white {
  background: var(--color-swatch-light);
}

.swatch-black {
  background: var(--color-swatch-dark);
}

.selection-summary {
  margin-block: var(--space-xs) var(--space-md);
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-variant-numeric: tabular-nums;
}

.primary-action {
  width: 100%;
  padding-inline: var(--space-md);
  background: var(--color-inverse);
  color: var(--color-dark);
  font-weight: 600;
  white-space: nowrap;
}

.site-footer {
  padding: var(--space-2xl) var(--page-gutter) calc(var(--space-3xl) + env(safe-area-inset-bottom));
  display: grid;
  gap: var(--space-lg);
  background: var(--color-paper);
  color: var(--color-ink);
}

.footer-wordmark {
  justify-self: start;
  font-size: var(--text-2xl);
  white-space: nowrap;
}

.site-footer > p {
  color: var(--color-muted);
  font-size: var(--text-sm);
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-lg);
}

.footer-links a {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  border-block-end: var(--rule-hair) solid var(--color-rule-strong);
  font-size: var(--text-sm);
  white-space: nowrap;
}

.mobile-order-bar {
  position: fixed;
  inset-inline: var(--space-xs);
  inset-block-end: max(var(--space-xs), env(safe-area-inset-bottom));
  z-index: var(--z-sticky);
  min-height: 3.5rem;
  padding: var(--space-xs) var(--space-sm);
  border: var(--rule-hair) solid var(--color-rule-strong);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  background: var(--color-paper);
  color: var(--color-ink);
  font-size: var(--text-sm);
}

.mobile-order-bar span,
.mobile-order-bar a {
  line-height: 1;
  white-space: nowrap;
}

.mobile-order-bar a {
  min-height: 2.75rem;
  padding-inline: var(--space-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-dark);
  color: var(--color-inverse);
  font-weight: 600;
}

@media (hover: hover) and (pointer: fine) {
  .header-action:hover {
    background: var(--color-ink);
    color: var(--color-paper);
  }

  .campaign-note a:hover,
  .reference-row a:hover,
  .footer-links a:hover {
    color: var(--color-accent);
  }

  .choice-button:hover:not(.is-selected):not([aria-pressed="true"]) {
    background: var(--color-dark-2);
  }

  .primary-action:hover {
    background: var(--color-paper-3);
    color: var(--color-dark);
  }
}

@media (min-width: 40rem) {
  .hero-visual img {
    height: min(72svh, 52rem);
    aspect-ratio: auto;
    object-position: center 60%;
  }

  .hero-visual figcaption {
    font-size: var(--text-xs);
  }

  .hero-copy {
    grid-template-columns: minmax(7rem, 0.24fr) minmax(0, 1fr);
  }

  .hero-status {
    padding-block-start: var(--space-xs);
  }

  .hero-facts {
    grid-column: 2;
  }

  .hero-facts > div + div {
    padding-inline-start: var(--space-md);
    border-inline-start: var(--rule-hair) solid var(--color-rule);
  }

  .material-study {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    align-items: start;
    gap: var(--space-xl);
  }

  .material-study-image-a {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  .material-checks {
    grid-column: 2;
    grid-row: 1;
  }

  .material-study-image-b {
    grid-column: 2;
    grid-row: 2;
  }

  .material-study-disclosure {
    grid-column: 1 / -1;
  }

  .wearing-gallery {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: start;
    gap: var(--space-xl) var(--space-lg);
  }

  .wearing-look-commute {
    grid-column: 1 / 7;
  }

  .wearing-look-gallery {
    grid-column: 7 / -1;
    margin-block-start: var(--space-xl);
  }

  .motion-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
  }

  .motion-card:nth-child(2) {
    margin-block-start: var(--space-xl);
  }

  .campaign-photo img {
    aspect-ratio: 4 / 5;
  }

  .material-ledger > div {
    min-height: 7.5rem;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, auto);
  }

  .material-ledger dd {
    font-size: var(--text-4xl);
  }

  .enyu-reference {
    grid-template-columns: minmax(10rem, 0.5fr) minmax(0, 1.25fr) minmax(10rem, 0.5fr);
    align-items: end;
  }

  .enyu-reference > p:last-child {
    text-align: end;
  }

  .site-footer {
    grid-template-columns: minmax(12rem, 0.7fr) minmax(0, 1fr);
    align-items: end;
  }

  .footer-wordmark {
    grid-row: 1 / 3;
    align-self: start;
  }

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

@media (min-width: 60rem) {
  .site-header {
    min-height: 5.25rem;
  }

  .wordmark span {
    font-size: var(--text-2xl);
  }

  .hero-copy {
    grid-template-columns: minmax(8rem, 0.24fr) minmax(0, 1.06fr) minmax(19rem, 0.7fr);
    align-items: start;
    gap: var(--space-2xl);
    padding-block: var(--space-2xl) var(--space-3xl);
  }

  .hero-facts {
    grid-column: auto;
    align-self: end;
  }

  .campaign {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(22rem, 0.75fr);
  }

  .campaign-photo img {
    height: min(88svh, 56rem);
    aspect-ratio: auto;
  }

  .campaign-photo figcaption {
    padding-inline: var(--space-lg);
  }

  .campaign-note {
    padding-inline: clamp(var(--space-xl), 5vw, var(--space-3xl));
  }

  .material,
  .wearing,
  .motion,
  .references,
  .order {
    padding-inline: max(var(--page-gutter), calc((100% - var(--page-max)) / 2));
  }

  .material-intro,
  .wearing-intro,
  .motion-intro,
  .reference-intro {
    grid-template-columns: minmax(0, 1.12fr) minmax(24rem, 0.62fr);
    align-items: end;
    gap: var(--space-3xl);
  }

  .material-ledger {
    margin-inline-start: 18%;
  }

  .material-study {
    grid-template-columns: minmax(0, 0.92fr) minmax(15rem, 0.5fr) minmax(0, 0.92fr);
    gap: var(--space-2xl);
  }

  .material-study-image-a {
    grid-column: 1;
    grid-row: 1;
  }

  .material-checks {
    grid-column: 2;
    grid-row: 1;
    margin-block-start: var(--space-xl);
  }

  .material-study-image-b {
    grid-column: 3;
    grid-row: 1;
    margin-block-start: var(--space-3xl);
  }

  .material-study-disclosure {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .reference-row {
    grid-template-columns:
      minmax(11rem, 0.8fr)
      minmax(0, 1.2fr)
      minmax(7rem, 0.42fr);
    align-items: start;
    gap: var(--space-lg);
  }

  .reference-reason {
    grid-column: 1 / 3;
  }

  .reference-row a {
    grid-column: 3;
    justify-self: end;
  }

  .reference-disclosure {
    grid-template-columns: minmax(10rem, 0.25fr) minmax(0, 1fr);
    gap: var(--space-lg);
  }

  .order {
    grid-template-columns: minmax(0, 1.1fr) minmax(24rem, 0.7fr);
    align-items: start;
    gap: var(--space-3xl);
  }

  .order-builder {
    max-width: 34rem;
    justify-self: end;
  }

  .mobile-order-bar {
    display: none;
  }
}

@media (min-width: 75rem) {
  .reference-row {
    grid-template-columns:
      minmax(12rem, 1fr)
      minmax(12rem, 0.85fr)
      minmax(7rem, 0.45fr)
      minmax(16rem, 1.2fr)
      auto;
  }

  .reference-reason,
  .reference-row a {
    grid-column: auto;
  }
}

@media (min-width: 90rem) {
  .hero-visual {
    max-width: 110rem;
    margin-inline: auto;
  }

  .hero-visual img {
    height: min(76svh, 58rem);
  }

  .campaign-photo img {
    height: min(92svh, 62rem);
  }
}

@media (max-width: 24rem) {
  .wordmark small {
    display: none;
  }

  .header-action {
    padding-inline: var(--space-xs);
  }

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

  .hero-facts > div:last-child {
    grid-column: 1 / -1;
  }

  .enyu-reference > div {
    align-items: flex-end;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: var(--dur-micro) !important;
    animation-iteration-count: 1 !important;
    transition-duration: var(--dur-micro) !important;
  }
}