/* Hallmark · macrostructure: custom collage catalogue (owner's sketch) · tone: austere, classic · anchor hue: 29 (E30 vermilion)
 * nav: logo left, search + two links right · footer: three-part address line
 * Hallmark · pre-emit critique: P4 H4 E4 S5 R5 V4
 */

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-color: var(--color-rule-strong) var(--color-paper);
  scrollbar-width: thin;
}
html.lenis, html.lenis body { height: auto; }
.lenis:not(.lenis-autoToggle).lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }

body {
  margin: 0;
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  font-weight: 500;
  font-kerning: normal;
  min-width: 75rem; /* PC only for this preview: 1200 px and up */
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
button, input { font: inherit; color: inherit; }
::selection { background: var(--color-accent-fill); color: var(--color-on-accent); }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
[tabindex="-1"]:focus { outline: none; }
h1, h2, h3, h4, p, dl, dd, figure, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
address { font-style: normal; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.skip {
  position: absolute; left: var(--space-md); top: -4rem; z-index: 50;
  background: var(--color-ink); color: var(--color-paper); padding: var(--space-xs) var(--space-md);
}
.skip:focus { top: var(--space-md); }

.wrap {
  width: 100%;
  max-width: calc(var(--page-max) + 2 * var(--page-margin));
  margin-inline: auto;
  padding-inline: var(--page-margin);
}
.grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter);
}

/* ---------- type roles ---------- */
.display {
  font-family: var(--font-display);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--track-display);
  line-height: var(--leading-display);
  font-style: normal;
  text-wrap: balance;
  font-variant-numeric: lining-nums;
}
.t-hero { font-size: var(--text-hero); }
.t-h1 { font-size: var(--text-h1); }
.t-h2 { font-size: var(--text-h2); }
.t-h3 { font-size: var(--text-h3); letter-spacing: var(--track-display-s); line-height: 1.15; }
.t-h4 { font-size: var(--text-h4); letter-spacing: var(--track-display-s); line-height: 1.15; }

.lead { font-size: var(--text-lead); line-height: 1.55; color: var(--color-ink); }
.muted { color: var(--color-ink-2); }
.meta { font-size: var(--text-meta); line-height: 1.45; color: var(--color-ink-2); }
.small { font-size: var(--text-small); line-height: 1.55; }
.indent { text-indent: 2.5em; }
.bracket { font-size: var(--text-meta); color: var(--color-ink-2); }
.nums { font-variant-numeric: tabular-nums lining-nums; }
.rule-mark {
  display: block; width: var(--rule-mark); height: var(--rule-hair);
  background: var(--color-ink); border: 0; margin: var(--space-lg) 0;
}

/* ---------- header: sticky, compact (32 + 68 px), no shadow ---------- */
.site-head {
  position: sticky; top: 0; z-index: 30;
  background: var(--color-paper); border-bottom: var(--rule-hair) solid var(--color-rule);
}
.site-util { height: var(--util-h); border-bottom: var(--rule-hair) solid var(--color-rule); font-size: var(--text-util); }
.site-util__in { display: flex; align-items: center; justify-content: space-between; height: 100%; }
.site-util__left { display: flex; align-items: center; gap: var(--space-md); }
.site-util__left a { text-decoration: none; color: var(--color-ink-2); padding: 2px 0; }
.site-util__left a:hover { color: var(--color-accent); }
.site-util__fb { display: inline-flex; align-items: center; font-size: 0.9375rem; }
.site-util__right { display: flex; align-items: center; gap: var(--space-2xs); }
.util-btn {
  display: inline-block; padding: 1px var(--space-xs); line-height: 1.45;
  border: var(--rule-hair) solid transparent; border-radius: var(--radius-control);
  color: var(--color-ink-2); text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.util-btn:hover { border-color: var(--color-rule-strong); color: var(--color-ink); }
.util-btn:not([aria-disabled]):hover { color: var(--color-accent); border-color: currentColor; }
.util-btn[aria-disabled="true"] { cursor: default; }

.site-head__in { display: flex; align-items: center; gap: var(--space-2xl); height: var(--head-h); }
.brand { display: block; flex: none; }
.brand img { height: 2.75rem; width: auto; }
.search { display: flex; align-items: stretch; gap: 0; margin-left: auto; }
.search input {
  width: 18rem; height: 2.5rem; padding: 0 var(--space-sm);
  border: var(--rule-hair) solid var(--color-rule-strong); border-right: 0;
  border-radius: var(--radius-control) 0 0 var(--radius-control);
  background: var(--color-paper); font-size: var(--text-small);
}
.search input::placeholder { color: var(--color-ink-2); opacity: 1; }
.search input:hover { border-color: var(--color-ink-2); }
.search input:focus-visible { outline-offset: 0; }
.search input::-webkit-search-cancel-button { cursor: pointer; }
.search button {
  height: 2.5rem; padding: 0 var(--space-md);
  border: var(--rule-hair) solid var(--color-ink); background: var(--color-ink); color: var(--color-paper);
  border-radius: 0 var(--radius-control) var(--radius-control) 0;
  font-size: var(--text-small); font-weight: 600; cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.search button:hover { background: var(--color-accent-fill); border-color: var(--color-accent-fill); color: var(--color-on-accent); }
.search button:active { background: var(--color-accent-fill-deep); }
.site-nav { display: flex; gap: var(--space-xl); }
.site-nav a {
  font-size: var(--text-small); font-weight: 600; text-decoration: none;
  padding: var(--space-xs) 0; border-bottom: var(--rule-hair) solid transparent;
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.site-nav a:hover { border-color: currentColor; color: var(--color-accent); }

/* small 1 px line icons, 1em */
.icon { width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 1; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.icon--fill { fill: currentColor; stroke: none; }

/* phone and email: About block and footer */
.contact-row { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-xl); }
.contact-row a { display: inline-flex; align-items: center; gap: 0.45em; color: var(--color-ink); text-decoration: none; padding: var(--space-2xs) 0; }
.contact-row a span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
.contact-row a:hover { color: var(--color-accent); }

/* ---------- the chosen car, held at the top on every catalogue step ---------- */
.carbar {
  position: sticky; top: calc(var(--util-h) + var(--head-h) + 1px); z-index: 20;
  background: var(--color-paper);
  border-bottom: var(--rule-hair) solid var(--color-rule);
}
.no-carbar .carbar { display: none; }
.carbar__in { display: flex; align-items: baseline; gap: var(--space-md); height: 3.25rem; align-items: center; }
.carbar__label { font-size: var(--text-meta); color: var(--color-ink-2); }
.carbar__car { font-size: var(--text-small); font-weight: 600; }
.carbar__change {
  font-size: var(--text-small); color: var(--color-accent); margin-left: var(--space-xs);
  padding: var(--space-xs) 0;
}
.carbar__change:hover { color: var(--color-accent-deep); }

/* ---------- page view + crossfade ---------- */
main { display: block; outline: none; min-height: calc(100vh - var(--util-h) - var(--head-h)); } /* footer waits below the fold while the catalogue loads: no layout shift */
.view { transition: opacity var(--dur-page) var(--ease-out); }
.view.is-leaving { opacity: 0; transition-timing-function: var(--ease-in); }
.view-page { padding-bottom: var(--space-6xl); }

/* gentle reveal on scroll: opacity + 12 px, 500 ms */
.can-reveal [data-reveal] {
  opacity: 0; transform: translateY(12px);
  transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);
}
.can-reveal [data-reveal].is-in { opacity: 1; transform: none; }

/* ---------- photos ---------- */
.photo { position: relative; background: var(--color-photo); overflow: hidden; margin: 0; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo--3x2 { aspect-ratio: 3 / 2; }
.photo--4x3 { aspect-ratio: 4 / 3; }
.photo--4x5 { aspect-ratio: 4 / 5; }
.photo--1x1 { aspect-ratio: 1 / 1; }
.photo--empty { display: grid; place-items: center; color: var(--color-ink-2); font-size: var(--text-meta); }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs);
  min-height: 3rem; padding: 0 var(--space-lg);
  border: var(--rule-hair) solid var(--color-accent-fill); border-radius: var(--radius-control);
  background: var(--color-accent-fill); color: var(--color-on-accent);
  font-size: var(--text-small); font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.btn:hover { background: var(--color-accent-fill-deep); border-color: var(--color-accent-fill-deep); }
.btn:active { transform: translateY(1px); }
.btn--line { background: transparent; color: var(--color-ink); border-color: var(--color-ink); }
.btn--line:hover { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }

/* ---------- collage: photos laid out with an offset, as in the owner's sketch ---------- */
.collage__item { margin: 0; position: relative; }
.collage__caption { margin-top: var(--space-xs); font-size: var(--text-meta); line-height: 1.4; color: var(--color-ink-2); }
.spread__years { font-size: var(--text-lead); color: var(--color-accent); margin-top: var(--space-sm); }

/* ---------- home: the hero photo, full width ---------- */
.hero-full {
  position: relative; height: 80vh; min-height: 34rem; max-height: 60rem;
  overflow: hidden; background: var(--color-paper); color: var(--color-on-photo);
}
.hero-full__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
/* soft darkening only on the text side, no plate */
.hero-full__scrim {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to left, oklch(12% 0.005 95 / 0.72) 0%, oklch(12% 0.005 95 / 0.48) 32%, oklch(12% 0.005 95 / 0) 60%);
}
.hero-full__in { position: relative; z-index: 1; height: 100%; }
.hero-full__shade { position: absolute; inset: 0; z-index: 1; background: oklch(0% 0 0 / 0.25); opacity: 0; pointer-events: none; }
.hero-full__img, .hero-full__shade { transform-origin: 50% 40%; will-change: transform; }
.hero-full__scrim { transform-origin: 50% 40%; will-change: transform; }
.home-cover { position: relative; z-index: 1; background: var(--color-paper); padding-top: var(--space-5xl); }
.home-cover .about { margin-top: 0; }
:root[data-theme="night"] .home-cover .model-strip { margin-top: 0; }
:root[data-theme="night"] .home-cover { padding-top: var(--space-2xl); }
:root[data-theme="night"] .home-cover .about { margin-top: var(--space-4xl); }
@media (prefers-reduced-motion: no-preference) {
  .hero-full { position: sticky; top: calc(var(--util-h) + var(--head-h) + 1px); z-index: 0; }
}
.hero-full__text { grid-column: 8 / 13; align-self: start; padding-top: 7vh; text-shadow: 0 1px 12px oklch(0% 0 0 / 0.35); }
.hero-full__text h1 { margin-bottom: var(--space-xl); color: var(--color-on-photo); }
.hero-full__text .lead { color: var(--color-on-photo); max-width: 26rem; }
.hero-full__text p + p { margin-top: var(--space-xs); color: var(--color-on-photo-2); }

/* ---------- home: about, with the shop's garage and three of its cars ---------- */
.about { margin-top: var(--space-5xl); grid-template-rows: auto auto auto; align-items: start; }
.about__main { grid-column: 1 / 6; grid-row: 1 / 4; padding-right: var(--space-md); }
.about__title { margin-bottom: var(--space-xl); }
.about__text { font-size: var(--text-lead); line-height: 1.6; color: var(--color-ink); }
.about__text p { max-width: 34rem; }
.about .contact-row { margin-top: var(--space-lg); font-size: var(--text-lead); }
.about__garage { margin: var(--space-2xl) 0 0; }
.photo--garage { aspect-ratio: 1800 / 816; }
.about__s1 { grid-column: 6 / 9; grid-row: 1; z-index: 2; align-self: start; margin-top: var(--space-4xl); }
.about__big { grid-column: 8 / 13; grid-row: 1 / 3; margin-top: 11rem; }
.about__s2 { grid-column: 10 / 13; grid-row: 3; margin-top: calc(-1 * var(--space-3xl)); z-index: 2; }

/* ---------- home: all models ---------- */
.others { margin-top: var(--space-5xl); }
.models-head { align-items: end; }
.models-head__title { grid-column: 1 / 6; }
.models-head__text { grid-column: 7 / 11; }
.model-grid { margin-top: var(--space-3xl); row-gap: var(--space-3xl); }
.model-tile { grid-column: span 3; }
/* 17 models leave three free cells in the last row: a short way out instead of a gap */
.model-grid__note { grid-column: span 9; align-self: center; padding-left: var(--space-xl); max-width: 40rem; color: var(--color-ink-2); }
.model-grid__note a { color: var(--color-ink); }
.model-grid__note a:hover { color: var(--color-accent); }
.model-tile a { display: block; text-decoration: none; }
.model-tile__photo { display: block; margin-bottom: var(--space-md); }
.model-tile__flag { display: block; margin-top: var(--space-xs); color: var(--color-accent); }
.js-model-photo.is-missing { visibility: hidden; }
.model-row__top { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); }
.model-row__code {
  font-family: var(--font-display); font-weight: 500; font-size: 1.75rem; line-height: 1.1;
  letter-spacing: 0.03em; font-variant-numeric: lining-nums; transition: color var(--dur-fast) var(--ease-out);
}
.model-row__years { font-size: var(--text-meta); color: var(--color-ink-2); white-space: nowrap; }
.model-row__name, .model-row__fact { display: block; }
.model-row__name { font-size: var(--text-small); margin-top: var(--space-2xs); }
.model-row__fact { font-size: var(--text-meta); color: var(--color-ink-2); margin-top: var(--space-2xs); }
.model-tile a:hover .model-row__code { color: var(--color-accent); }
.model-tile a:hover .model-row__name { text-decoration: underline; }
.model-tile .photo img { transition: filter var(--dur-fast) var(--ease-out); }
.model-tile a:hover .photo img { filter: brightness(1.07); }

/* ---------- model page: facts left, photos right ---------- */
.model-head { padding-top: var(--space-2xl); grid-template-rows: auto auto auto; }
.model-info { grid-column: 1 / 5; grid-row: 1 / 4; align-self: start; padding-top: var(--space-md); padding-right: var(--space-md); }
.model-info__facts { font-size: var(--text-small); line-height: 1.5; }
.model-info__facts li + li { margin-top: var(--space-xs); }
.model-info__count { margin-top: var(--space-lg); font-size: var(--text-body); font-weight: 600; }
.model-info__hint { margin-top: var(--space-xs); max-width: 26rem; }
.model-collage__a { grid-column: 5 / 8; grid-row: 1; z-index: 2; align-self: start; }
.model-collage__big { grid-column: 7 / 13; grid-row: 1 / 3; margin-top: var(--space-3xl); }
.model-collage__b { grid-column: 5 / 7; grid-row: 2; align-self: start; margin-top: var(--space-2xl); }
.model-collage__c { grid-column: 9 / 12; grid-row: 3; margin-top: calc(-1 * var(--space-3xl)); z-index: 2; }
.model-collage__single { grid-column: 6 / 13; grid-row: 1 / 4; }

.groups { margin-top: var(--space-4xl); row-gap: var(--space-3xl); align-items: start; }
.group { display: block; text-decoration: none; }
.group .photo img { transition: opacity var(--dur-fast) var(--ease-out); }
.group__name { margin-top: var(--space-md); transition: color var(--dur-fast) var(--ease-out); }
.group__meta { margin-top: var(--space-2xs); display: flex; gap: var(--space-md); }
.group:hover .group__name { color: var(--color-accent); }
.group:hover .photo img { opacity: 0.92; }
/* the owner's sketch: pictures laid out on purpose, not a uniform grid */
.group:nth-child(8n + 1) { grid-column: 1 / 4; }
.group:nth-child(8n + 2) { grid-column: 4 / 7; margin-top: var(--space-3xl); }
.group:nth-child(8n + 3) { grid-column: 7 / 10; margin-top: var(--space-lg); }
.group:nth-child(8n + 4) { grid-column: 10 / 13; margin-top: var(--space-4xl); }
.group:nth-child(8n + 5) { grid-column: 1 / 4; margin-top: var(--space-2xl); }
.group:nth-child(8n + 6) { grid-column: 4 / 7; }
.group:nth-child(8n + 7) { grid-column: 7 / 10; margin-top: var(--space-4xl); }
.group:nth-child(8n + 8) { grid-column: 10 / 13; margin-top: var(--space-lg); }
.also { margin-top: var(--space-5xl); }
.also p { grid-column: 1 / 9; }

/* ---------- breadcrumb, list ---------- */
.crumbs { padding-top: var(--space-2xl); font-size: var(--text-small); color: var(--color-ink-2); }
.crumbs a { color: var(--color-ink); }
.crumbs a:hover { color: var(--color-accent); }
.crumbs span[aria-hidden] { margin-inline: var(--space-xs); }
.list-head { padding-top: var(--space-xl); align-items: end; }
.list-head h1 { grid-column: 1 / 8; }
.list-head__meta { grid-column: 9 / 13; justify-self: end; text-align: right; }

/* parts as cards: 4 in a row at 1440, 3 below; air and one thin line, no frames or shadows */
.part-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--gutter); row-gap: var(--space-2xl); margin-top: var(--space-2xl);
}
@media (max-width: 1439px) { .part-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.part-card a {
  display: flex; flex-direction: column; height: 100%; text-decoration: none;
  padding-bottom: var(--space-lg); border-bottom: var(--rule-hair) solid var(--color-rule);
}
.part-card__photo { display: block; margin-bottom: var(--space-md); }
.part-card__photo img { transition: filter var(--dur-fast) var(--ease-out); }
.part-card a:hover .part-card__photo img { filter: brightness(1.07); }
.part-card__name { font-size: var(--text-body); font-weight: 600; line-height: 1.35; }
.part-card a:hover .part-card__name { color: var(--color-accent); }
.part-card__num { margin-top: var(--space-2xs); font-size: var(--text-meta); color: var(--color-ink-2); }
.part-card__group { display: block; }
.part-card__price { margin-top: auto; padding-top: var(--space-md); font-size: var(--text-h4); font-weight: 600; line-height: 1.2; }
.part-card__state { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-md); margin-top: var(--space-2xs); font-size: var(--text-small); }
.stock-out { color: var(--color-ink-2); }
.other-groups { margin-top: var(--space-3xl); font-size: var(--text-small); color: var(--color-ink-2); max-width: 56rem; }
.other-groups a { color: var(--color-ink); }
.other-groups a:hover { color: var(--color-accent); }

/* ---------- part page ---------- */
.back { display: inline-block; margin-top: var(--space-2xl); font-size: var(--text-small); padding: var(--space-xs) 0; text-decoration: none; }
.back:hover { color: var(--color-accent); text-decoration: underline; }
.part { margin-top: var(--space-xl); align-items: start; }
.part__main { grid-column: 1 / 7; }
.part__thumbs { grid-column: 7 / 8; display: grid; gap: var(--gutter); }
.part__thumb {
  display: block; padding: 0; border: 0; background: none; cursor: pointer; width: 100%;
  outline-offset: 2px;
}
.part__thumb .photo { opacity: 0.72; transition: opacity var(--dur-fast) var(--ease-out); }
.part__thumb:hover .photo, .part__thumb[aria-pressed="true"] .photo { opacity: 1; }
.part__thumb[aria-pressed="true"] { box-shadow: 0 2px 0 0 var(--color-ink); }
.part__info { grid-column: 9 / 13; }
.part__number { font-size: var(--text-number); font-weight: 600; line-height: 1.2; margin-top: var(--space-lg); letter-spacing: 0.01em; }
.part__number-label { margin-top: var(--space-xl); }
.part__facts { margin-top: var(--space-xl); border-top: var(--rule-hair) solid var(--color-rule); }
.part__facts div { display: grid; align-items: baseline; grid-template-columns: 8.5rem 1fr; gap: var(--space-md); padding: var(--space-sm) 0; border-bottom: var(--rule-hair) solid var(--color-rule); font-size: var(--text-small); }
.part__facts dt { color: var(--color-ink-2); }
.part__facts dd { font-weight: 600; }
.part__price { font-size: var(--text-h4) !important; }
.part__note { margin-top: var(--space-lg); font-size: var(--text-small); line-height: 1.6; max-width: 34rem; }
.part__actions { display: flex; gap: var(--space-sm); margin-top: var(--space-xl); flex-wrap: wrap; }

/* ---------- plain message pages (search, prepared, not found) ---------- */
.note-page { padding-top: var(--space-3xl); grid-template-rows: auto 1fr; }
.note-page__title { grid-column: 1 / 8; }
.note-page__body { grid-column: 1 / 8; margin-top: var(--space-xl); align-self: start; }
.note-page__body p + p { margin-top: var(--space-md); }
.search-again { display: flex; margin-top: var(--space-xl); }

/* ---------- other model page: the groups to come ---------- */
.prepared-groups { margin-top: var(--space-4xl); }
.prepared-groups h2 { padding-bottom: var(--space-md); border-bottom: var(--rule-hair) solid var(--color-ink); max-width: 100%; }
.prepared-groups__list { columns: 4; column-gap: var(--gutter); margin-top: var(--space-lg); font-size: var(--text-small); }
.prepared-groups__list li { padding: var(--space-2xs) 0; break-inside: avoid; }

/* ---------- footer ---------- */
.site-foot { border-top: var(--rule-hair) solid var(--color-rule); }
.site-foot__in {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter);
  padding-block: var(--space-3xl) var(--space-4xl); font-size: var(--text-small); align-items: start;
}
.site-foot__logo { grid-column: 1 / 3; width: 7.5rem; height: auto; }
.site-foot__addr { grid-column: 5 / 9; display: grid; gap: var(--space-2xs); }
.site-foot__talk { grid-column: 9 / 13; }

/* ---------- theme switch: Day / Night ---------- */
.theme-toggle {
  min-height: 2.75rem; padding: 0; border: 0; background: none; cursor: pointer;
  font-size: var(--text-meta); color: var(--color-ink-2); white-space: nowrap;
}
.theme-toggle__day { color: var(--color-ink); }
.theme-toggle:hover .theme-toggle__night { color: var(--color-accent); text-decoration: underline; text-underline-offset: 0.22em; }
:root[data-theme="night"] .theme-toggle__day { color: var(--color-ink-2); }
:root[data-theme="night"] .theme-toggle__night { color: var(--color-ink); }
:root[data-theme="night"] .theme-toggle:hover .theme-toggle__night { color: var(--color-ink); text-decoration: none; }
:root[data-theme="night"] .theme-toggle:hover .theme-toggle__day { color: var(--color-accent); text-decoration: underline; text-underline-offset: 0.22em; }

/* the wordmark is type: no logo filter at night */

/* night only: the model line under the hero */
.model-strip { display: none; }
:root[data-theme="night"] .model-strip {
  display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: var(--space-xs);
  margin-top: var(--space-2xl); padding-block: var(--space-md);
  border-block: var(--rule-hair) solid var(--color-rule);
  font-size: var(--text-small);
}
.model-strip a { text-decoration: none; padding: var(--space-2xs) 0; white-space: nowrap; }
.model-strip a:hover { color: var(--color-accent); }
.model-strip a[aria-current] { color: var(--color-accent); }
.model-strip ul { display: flex; width: 100%; }
.model-strip li { flex: 1 1 auto; display: flex; justify-content: center; position: relative; }
.model-strip li:first-child { justify-content: flex-start; }
.model-strip li:last-child { justify-content: flex-end; }
.model-strip li + li::before {
  content: "·"; position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%);
  color: var(--color-ink-3); pointer-events: none;
}

/* ---------- 1920 and up: a touch more air, same composition ---------- */
@media (min-width: 1800px) {
  :root { --page-max: 90rem; --text-hero: 4.5rem; }
}

/* ---------- reduced motion: no reveals, no smooth scroll, instant page swap ---------- */
@media (prefers-reduced-motion: reduce) {
  .view, .view.is-leaving { transition: none; }
  .can-reveal [data-reveal] { opacity: 1; transform: none; transition: none; }
  .btn, .site-nav a, .search button, .group__name, .model-row__code { transition: none; }
}

/* подпись владельца под About */
.about__sign { margin-top: var(--space-m, 1rem); font-style: italic; color: var(--color-ink-2); }

/* ---------- Erbstück: the wordmark is type, not an image; the slogan sits under it ---------- */
.brand { display: flex; flex-direction: column; gap: 0.15rem; text-decoration: none; color: var(--color-ink); line-height: 1; }
.brand__word { font-family: var(--font-display); font-weight: 500; font-size: 1.75rem; letter-spacing: 0.01em; }
.brand__tag { font-size: var(--text-meta); color: var(--color-ink-2); letter-spacing: 0.02em; }
.brand:hover .brand__word { color: var(--color-accent); }
.site-foot__logo { display: flex; flex-direction: column; gap: 0.2rem; grid-column: 1 / 4; width: auto; }
.site-foot__logo .brand__word { font-size: 1.5rem; }
.hero-full__slogan { font-family: var(--font-display); font-size: var(--text-lead); color: var(--color-on-photo-2); margin-bottom: var(--space-sm); }
.site-foot__note { grid-column: 1 / 13; margin-top: var(--space-xl); font-size: var(--text-meta); color: var(--color-ink-2); }
