/* Melte OÜ – style.css
   Order: tokens → reset → i18n → base type → layout → components → sections → utilities → media */

/* ---------- 1. Tokens ---------- */
:root {
  color-scheme: light;
  --navy: #064368;
  --navy-900: #042b44;
  --blue: #1272ad;
  --blue-300: #77bbe5;
  --blue-200: #bcdcf2; /* small labels on navy, 7.3:1 */
  --blue-100: #e3eff7;
  --green: #749812;
  --green-700: #475e06;
  --green-300: #a9c84a;
  --green-500: #86ad18;
  --green-100: #eef3dc;
  --paper: #f5f4ef;
  --white: #ffffff;
  --ink: #14212b;
  --ink-2: #4a5863;
  --rule: #d9d6cc;
  --rule-navy: rgba(119, 187, 229, .28);
  --wire-l1: #7a4a2b; --wire-l2: #1b1b1b; --wire-l3: #8a8a8a;
  --wire-n: #3d7fc4; --wire-pe-g: #2f8a3c; --wire-pe-y: #f0c419;

  --font: Archivo, "Helvetica Neue", Arial, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --fs-display: clamp(2rem, 9vw, 5.25rem);
  --fs-h2: clamp(1.75rem, 2.4vw + 1rem, 3rem);
  --fs-h3: clamp(1.25rem, .6vw + 1rem, 1.5rem);
  --fs-lead: clamp(1.125rem, .4vw + 1rem, 1.25rem);
  --fs-body: 1.0625rem;
  --fs-small: .9375rem;
  --fs-label: .75rem;
  --fs-mono: .9375rem;

  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px;

  --gutter: clamp(16px, 4vw, 48px);
  --header-h: 56px;
  --section-pad: clamp(56px, 6vw, 96px);
  --bg: var(--paper);
}

/* ---------- 2. Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body, h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote, address { margin: 0; }
ul, ol { padding: 0; }
svg { display: block; }
button { font: inherit; color: inherit; }
table { border-collapse: collapse; border-spacing: 0; }
address { font-style: normal; }
[hidden] { display: none !important; }

/* ---------- 3. Language switch: hide the inactive language ---------- */
/* fails closed: Estonian unless the page is exactly lang="en" */
html:not([lang="en"]) body [lang="en"],
html[lang="en"] body [lang="et"] { display: none !important; }

/* ---------- 4. Base type ---------- */
html { scroll-behavior: smooth; }

body { min-height: 100vh; background: var(--paper); color: var(--ink); font-family: var(--font); font-size: var(--fs-body); font-stretch: 100%; line-height: 1.6; hyphens: manual; overflow-wrap: break-word; }

h1, h2, h3 { text-wrap: balance; }
p, li, dd { text-wrap: pretty; }
strong { font-weight: 650; }

a { color: var(--blue); text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }

:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.on-navy :focus-visible { outline-color: var(--green-300); }

::selection { background: var(--green); color: var(--ink); }

.side-label, .hero__kicker, .featured__label,
.lineage__when, .contact dt, .company dt, .bank dt,
.ptable th[scope="col"], .price-table th[scope="col"] { font-family: var(--mono); font-size: var(--fs-label); font-weight: 500; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; }

.hero__figure figcaption, .section__note, .section__more, .maplinks, .footer__base { font-family: var(--font); font-size: .9375rem; font-weight: 500; letter-spacing: 0; text-transform: none; }

/* ---------- 5. Layout ---------- */
.container { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: var(--gutter); }

section[id], [id^="teenus-"] { scroll-margin-top: calc(var(--header-h) + 8px); }

.section { background: var(--bg); }
.section--paper { --bg: var(--paper); }
.section--white { --bg: var(--white); }
.section--navy { --bg: var(--navy); color: var(--white); }
.section--tint { --bg: var(--blue-100); --rule: #c3d5e4; }
.section--tint .featured__label { color: var(--navy); }
.section--tint .ptable tbody tr:hover td { background: #d3e5f2; }
.section > .container { position: relative; padding-block: var(--section-pad); }

.section__head { margin-bottom: var(--s-7); }
.section__head h2 { font-size: var(--fs-h2); font-weight: 700; font-stretch: 112%; line-height: 1.05; letter-spacing: -.005em; margin-top: 0; }
.section__intro { margin-top: var(--s-6); max-width: 52ch; }
.section__note { margin-top: var(--s-5); line-height: 1.5; color: var(--ink-2); }
.section__intro + .section__note { margin-top: var(--s-4); }
.section__more { margin-top: var(--s-4); }
.section__more a { display: inline-block; padding-block: 12px; }

.prose p + p { margin-top: 1em; }
.prose p { max-width: 62ch; }

/* ---------- 6. Components ---------- */

.skip { position: absolute; left: var(--s-4); top: -200px; z-index: 30; padding: var(--s-3) var(--s-4); background: var(--ink); color: var(--white); font-weight: 600; text-decoration: none; }
.skip:focus { top: var(--s-2); }

.logo { height: 100%; width: auto; }
.logo__plate { fill: var(--logo-plate, #749812); }
.logo__type { fill: var(--logo-type, #fff); }

.site-header { position: sticky; top: 0; z-index: 10; background: var(--paper); border-bottom: 1px solid var(--rule); }
.header__bar { display: flex; align-items: center; gap: var(--s-2); height: var(--header-h); }
.header__logo { display: flex; align-items: center; height: 44px; padding-block: 8px; margin-right: auto; }
.header__logo .logo { height: 28px; }
.nav { display: none; }
.header__tools { display: flex; align-items: center; gap: 0; }

.lang { display: flex; align-items: center; font-size: .9375rem; font-weight: 500; }
.lang__btn { min-width: 44px; min-height: 44px; padding: 0 6px; background: none; border: 0; cursor: pointer; color: var(--ink-2); text-decoration: none; }
.lang__btn:hover { color: var(--ink); text-decoration: underline 1px; text-underline-offset: 6px; }
.lang__btn[aria-pressed="true"] { color: var(--ink); font-weight: 650; text-decoration: underline 2px var(--green); text-underline-offset: 6px; }
.lang__sep { color: var(--rule); }

.header__tel { display: none; align-items: center; justify-content: center; gap: var(--s-2); min-width: 44px; min-height: 44px; font-family: var(--mono); font-size: .875rem; font-weight: 500; color: var(--navy); text-decoration: none; white-space: nowrap; }
.header__tel:hover { text-decoration: underline 1px; text-underline-offset: 4px; }
.header__tel-label { font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); }
.header__tel-icon { width: 20px; height: 20px; fill: none; stroke: var(--navy); stroke-width: 1.5; stroke-linejoin: round; }
html:not(.js) .header__tel { display: inline-flex; }

.menu-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0; background: none; border: 0; cursor: pointer; color: var(--ink); }
html:not(.js) .menu-btn { display: none; }
.menu-btn__text--close, .menu-btn[aria-expanded="true"] .menu-btn__text--open { display: none; }
.menu-btn[aria-expanded="true"] .menu-btn__text--close { display: block; }
.menu-btn__icon, .menu-btn__icon::before, .menu-btn__icon::after, .menu-btn__icon span { display: block; width: 16px; height: 1.5px; background: currentColor; }
.menu-btn__icon { position: relative; background: none; }
.menu-btn__icon::before, .menu-btn__icon::after { content: ""; position: absolute; left: 0; }
.menu-btn__icon::before { top: -5px; }
.menu-btn__icon::after { top: 5px; }
.menu-btn[aria-expanded="true"] .menu-btn__icon span { opacity: 0; }
.menu-btn[aria-expanded="true"] .menu-btn__icon::before { top: 0; transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-btn__icon::after { top: 0; transform: rotate(-45deg); }

.menu { position: absolute; top: 100%; left: 0; right: 0; max-height: calc(100vh - var(--header-h)); max-height: calc(100dvh - var(--header-h)); overflow-y: auto; background: var(--paper); border-bottom: 1px solid var(--rule); }
.menu__list { list-style: none; border-top: 1px solid var(--rule); }
.menu__link { display: flex; align-items: center; gap: var(--s-4); min-height: 56px; border-bottom: 1px solid var(--rule); font-size: 1.25rem; font-weight: 600; color: var(--ink); text-decoration: none; }
.menu__link:hover { color: var(--blue); }
.menu__contact { display: grid; gap: var(--s-2); padding: var(--s-5) 0 var(--s-6); }
.menu__contact a { display: flex; align-items: center; gap: var(--s-4); min-height: 56px; padding: 0 var(--s-4); border: 1px solid var(--ink); border-radius: 2px; font-family: var(--mono); font-size: 1.0625rem; font-weight: 500; color: var(--navy); text-decoration: none; }
.menu__contact a:hover { background: var(--blue-100); }
.menu__label { width: 7ch; white-space: nowrap; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 var(--s-5); border-radius: 2px; border: 1px solid transparent; font-size: 1rem; font-weight: 600; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background-color .15s, border-color .15s; }
.btn--primary { background: var(--green); border-color: var(--green); color: var(--ink); }
.btn--primary:hover { background: var(--green-500); border-color: var(--green-500); }
.btn--secondary { border-color: var(--blue-300); color: var(--white); }
.btn--secondary:hover { background: rgba(119, 187, 229, .12); }

.schematic { width: 100%; max-width: 480px; height: auto; overflow: visible; color: var(--blue-300); }
.schematic .w, .schematic .term { stroke: currentColor; stroke-width: 1.5; fill: none; stroke-linecap: square; }
.schematic .bus { stroke-width: 5; stroke-linecap: square; fill: none; }
.schematic text { fill: currentColor; font-family: var(--mono); font-size: 11px; letter-spacing: .04em; }
.schematic .no { font-size: 12px; font-weight: 500; }
.schematic .svc { font-size: 13px; letter-spacing: .02em; }
.schematic text { fill: var(--blue-200); }
.feeder:hover text { fill: var(--green-300); }
.schematic .hit { fill: transparent; stroke: none; }
.feeder { color: var(--blue-300); cursor: pointer; text-decoration: none; }
.feeder .w, .feeder .term, .feeder text { transition: stroke .15s, fill .15s; }
.feeder:hover { color: var(--green-300); }
.feeder:hover .term { fill: var(--green-300); }

@media (prefers-reduced-motion: no-preference) {
  .schematic .bus, .schematic .w { stroke-dasharray: 1 2; stroke-dashoffset: 1.001; animation: draw .9s cubic-bezier(.3, 0, .2, 1) forwards; }
  .schematic > .w { animation-duration: .4s; }
  .schematic .bus { animation-duration: .6s; animation-delay: .3s; }
  .feeder .w { animation-delay: calc(.75s + var(--i) * 60ms); }
  .feeder .term, .feeder text, .schematic .dot { opacity: 0; animation: appear .3s ease-out forwards; }
  .schematic .dot { animation-delay: .8s; }
  .feeder .term, .feeder text { animation-delay: calc(1.4s + var(--i) * 60ms); }
}
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes appear { to { opacity: 1; } }

/* ---------- 7. Sections ---------- */

.hero { background: var(--navy); color: var(--white); --bg: var(--navy); }
.hero__grid { display: grid; gap: var(--s-7); padding-block: 56px 64px; }
.hero__kicker { color: var(--blue-200); margin-bottom: var(--s-5); text-transform: none; letter-spacing: .02em; }
.hero h1 { font-size: var(--fs-display); font-weight: 800; font-stretch: 100%; line-height: .98; letter-spacing: -.01em; margin-bottom: var(--s-6); text-wrap: initial; }
.hero__lead { font-size: var(--fs-lead); line-height: 1.5; max-width: 44ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-6); }

.hero__figure { max-width: 480px; }
.hero__figure figcaption { margin-top: var(--s-3); padding-top: var(--s-3); border-top: 1px solid var(--rule-navy); color: var(--blue-200); }

.about__lineage { margin-top: var(--s-7); }

.lineage { list-style: none; max-width: 24rem; }
.lineage__item { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 0 0 var(--s-6) 28px; }
.lineage__item:last-child { padding-bottom: 0; }
.lineage__item:not(:last-child)::before { content: ""; position: absolute; left: 5.25px; top: 8px; bottom: -8px; width: 1.5px; background: var(--ink); }
.lineage__node { position: absolute; left: 0; top: 2px; width: 12px; height: 12px; z-index: 1; }
.lineage__node circle { fill: var(--bg); stroke: var(--ink); stroke-width: 1.5; }
.lineage__item--now .lineage__node circle { fill: var(--green); }
.lineage__when { color: var(--blue); }
.lineage__what { font-size: var(--fs-small); font-weight: 500; line-height: 1.4; }

.circuits { list-style: none; border-top: 1px solid var(--ink); }
.circuit { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-1) var(--s-5); padding: var(--s-5) 0 var(--s-5) var(--s-4); border-bottom: 1px solid var(--rule); transition: background-color .2s; }
.circuit::before { content: ""; position: absolute; left: 0; top: -1px; bottom: -1px; width: 3px; background: var(--green); opacity: 0; transition: opacity .15s; }
.circuit:hover::before, .circuit:target::before { opacity: 1; }
.circuit:target { background: var(--green-100); }
.circuit__code { font-family: var(--mono); font-size: .8125rem; font-weight: 400; color: var(--ink-2); transition: color .15s; }
.circuit:hover .circuit__code, .circuit:target .circuit__code { color: var(--green-700); }
.circuit__title, .price-table caption, .conditions__title { font-size: var(--fs-h3); font-weight: 650; font-stretch: 105%; line-height: 1.2; }
.circuit__desc { color: var(--ink-2); max-width: 62ch; }

.featured { padding: var(--s-5) 0 var(--s-6); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); }
.featured__label { color: var(--blue); margin-bottom: var(--s-3); }
.featured__title { font-size: clamp(1.375rem, 1vw + 1rem, 1.75rem); font-weight: 700; font-stretch: 112%; line-height: 1.15; text-wrap: balance; }

.ptable { width: 100%; margin-top: var(--s-7); }
.ptable th[scope="col"] { padding: 0 var(--s-4) var(--s-3) 0; border-bottom: 2px solid var(--ink); color: var(--ink-2); text-align: left; }
.ptable td { padding: var(--s-4) var(--s-4) var(--s-4) 0; border-bottom: 1px solid var(--rule); vertical-align: baseline; }
.ptable__name { font-weight: 600; line-height: 1.4; }
.ptable__scope { color: var(--ink-2); font-size: .875rem; line-height: 1.45; }
.ptable tbody tr:hover td { background: var(--blue-100); }

.price-table { width: 100%; }
.price-table + .price-table { margin-top: var(--s-8); }
.price-table caption { caption-side: top; text-align: left; padding-bottom: var(--s-4); }
.price-table th, .price-table td { text-align: left; vertical-align: baseline; }
.price-table th[scope="col"] { padding: 0 0 var(--s-3); border-bottom: 2px solid var(--ink); color: var(--ink-2); }
.price-table th[scope="row"] { padding: var(--s-4) var(--s-5) var(--s-4) 0; border-bottom: 1px solid var(--rule); font-weight: 400; line-height: 1.45; }
.price-table td { padding: var(--s-4) 0; border-bottom: 1px solid var(--rule); }
.price-table .num { text-align: right; white-space: nowrap; }
.price-table td.num { font-family: var(--mono); font-size: var(--fs-mono); font-variant-numeric: tabular-nums; font-weight: 500; }
.price-table .unit { font-weight: 400; color: var(--ink-2); }
.price-table--units .unit { display: inline-block; min-width: 12ch; padding-left: .6ch; text-align: left; }
.price-table .unit:empty { padding: 0; }
html[lang="en"] .price-table--units .unit { min-width: 15ch; }

.price-help { margin-top: var(--s-4); max-width: 68ch; font-size: var(--fs-small); line-height: 1.55; color: var(--ink-2); }
.conditions__title { margin-top: var(--s-8); }
.conditions { list-style: none; margin-top: var(--s-4); font-size: var(--fs-small); line-height: 1.55; border-top: 1px solid var(--rule); padding-top: var(--s-4); }
.conditions li { position: relative; padding-left: 2.25em; max-width: 68ch; }
.conditions li + li { margin-top: var(--s-2); }
.conditions li::before { content: "—"; position: absolute; left: 0; font-family: var(--mono); color: var(--ink-2); }

.section--navy .section__intro { color: var(--white); }
.contact__row { padding: var(--s-4) 0 var(--s-3); border-top: 1px solid var(--rule-navy); }
.contact__row:last-child { border-bottom: 1px solid var(--rule-navy); }
.contact dt, .company dt, .side-label { color: var(--blue-200); }
.contact dd { margin-top: 0; }
.contact a { display: inline-block; font-size: clamp(1.5rem, 2vw + 1rem, 2.25rem); font-weight: 600; font-stretch: 112%; line-height: 1.2; padding-block: 8px; color: var(--white); text-decoration: none; white-space: nowrap; }
.contact a:hover { text-decoration: underline 2px var(--green-300); text-underline-offset: 6px; }

.contact__side { margin-top: var(--s-7); }
.address address { margin-top: var(--s-2); font-size: var(--fs-body); line-height: 1.5; }
.maplinks { list-style: none; margin-top: var(--s-2); }
.maplinks a { display: inline-block; padding-block: 12px; color: var(--white); text-decoration-color: var(--blue-300); }
.company { margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--rule-navy); font-family: var(--mono); font-size: .8125rem; }
.company div { display: grid; grid-template-columns: 9.5em 1fr; gap: var(--s-4); align-items: baseline; padding: 4px 0; }
.company dd { color: var(--white); }

.site-footer { position: relative; background: var(--navy-900); color: var(--blue-300); }
.site-footer::before { content: ""; display: block; height: 4px; background: linear-gradient(90deg, var(--wire-l1) 0 20%, var(--wire-l2) 20% 40%, var(--wire-l3) 40% 60%, var(--wire-n) 60% 80%, transparent 80%); }
.site-footer::after { content: ""; position: absolute; top: 0; right: 0; width: 20%; height: 4px; background: repeating-linear-gradient(135deg, var(--wire-pe-g) 0 6px, var(--wire-pe-y) 6px 12px); }
.footer__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6); padding-block: var(--s-7) var(--s-6); }
.footer__brand .logo { height: 40px; }
.footer__tagline { margin-top: var(--s-3); font-size: .875rem; font-weight: 500; line-height: 1.5; color: var(--white); }
.bank { margin-top: var(--s-3); font-family: var(--mono); font-size: .8125rem; }
.bank div { display: grid; grid-template-columns: 6em minmax(0, 1fr); gap: var(--s-3); padding: 4px 0; }
.bank dt { font-size: .75rem; }
.bank dd { color: var(--white); font-variant-numeric: tabular-nums; white-space: nowrap; }
.footer__nav ul { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-5); }
.footer__nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--white); text-decoration: none; font-size: var(--fs-small); }
.footer__nav a:hover { text-decoration: underline 1px var(--green-300); text-underline-offset: 4px; }
.footer__top a { color: var(--green-300); }
.footer__base { padding-block: var(--s-4) var(--s-6); border-top: 1px solid var(--rule-navy); font-weight: 400; line-height: 1.6; }
.footer__base a { color: var(--blue-300); }

/* ---------- 8. Utilities ---------- */
.nowrap { white-space: nowrap; }
[tabindex="-1"]:focus:not(:focus-visible) { outline: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* ---------- 9. Media queries (mobile-first, grouped per component) ---------- */

@media (min-width: 40em) {
  :root { --header-h: 64px; }
  .ptable td { padding-block: 12px; }
  .header__logo .logo { height: 32px; }
  .header__tools { gap: var(--s-4); }

  .circuit { grid-template-columns: 64px minmax(0, 2fr) minmax(0, 3fr); padding-left: 0; align-items: baseline; }
  .circuit__code { padding-left: var(--s-4); }

  .footer__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 59.99em) {
  .header__tel-text { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

@media (min-width: 22.5em) {
  .header__tel { display: inline-flex; }
}

@media (max-width: 39.99em) {
  .hero__figure { display: none; }
  .hero__actions .btn { flex: 1 1 100%; }
  .ptable thead, .price-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ptable, .ptable tbody, .ptable tr, .ptable td { display: block; }
  .ptable tr { display: grid; grid-template-columns: minmax(0, 1fr); padding: var(--s-4) 0; border-bottom: 1px solid var(--rule); }
  .ptable tbody tr:first-child { border-top: 2px solid var(--ink); }
  .ptable td { padding: 0; border: 0; }
  .ptable__scope { margin-top: 2px; }
  .ptable__scope:empty { display: none; }

  .price-table, .price-table tbody { display: block; }
  .price-table caption { display: block; }
  .price-table tbody { border-top: 2px solid var(--ink); }
  .price-table tr { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--s-1) var(--s-4); padding: var(--s-4) 0; border-bottom: 1px solid var(--rule); }
  .price-table th[scope="row"], .price-table td { display: block; padding: 0; border: 0; }
  .price-table th[scope="row"] { flex: 1 1 13em; }
  .price-table td.num { margin-left: auto; }
  .price-table--units .unit, html[lang="en"] .price-table--units .unit { min-width: 0; }
}

@media (min-width: 60em) {
  .nav { display: block; margin-right: var(--s-2); }
  .nav ul { display: flex; gap: var(--s-6); list-style: none; }
  .nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: .9375rem; font-weight: 500; color: var(--ink); text-decoration: none; }
  .nav a:hover { color: var(--blue); text-decoration: underline 1px var(--blue); text-underline-offset: 6px; }
  .nav a[aria-current="true"] { text-decoration: underline 2px var(--green); text-underline-offset: 6px; }
  .header__tools { gap: var(--s-5); padding-left: var(--s-5); border-left: 1px solid var(--rule); }
  .header__tel { display: inline-flex; }
  .header__tel-icon { display: none; }
  .menu-btn, .menu { display: none !important; }

  .section__grid, .hero__grid, .footer__row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
  .section__grid { align-items: start; }
  .section__head { grid-column: 1 / 4; margin-bottom: 0; }
  .section__head h2 { font-size: clamp(1.5rem, 1.6vw + .5rem, 2.25rem); font-stretch: 100%; }

  .hero__grid { padding-block: 88px 96px; row-gap: var(--s-6); align-items: start; }
  .hero__text { grid-column: 1 / 8; grid-row: 1; }
  .hero h1 { font-stretch: 112%; font-size: clamp(2.75rem, 4.4vw, 4rem); }
  .hero__figure { grid-column: 8 / 13; grid-row: 1; justify-self: end; width: 100%; margin-top: var(--s-2); }

  .about__text { grid-column: 4 / 10; }
  .about__lineage { grid-column: 10 / 13; margin-top: 0; padding-left: var(--s-2); }
  .lineage__item:not(:last-child) { padding-bottom: var(--s-7); }

  .section__head--sticky { position: sticky; top: 96px; }
  .circuits, .projects, .prices { grid-column: 4 / 13; }

  .contact { grid-column: 4 / 9; }
  .contact__side { grid-column: 9 / 13; margin-top: 0; padding-left: var(--s-5); }

  .footer__brand { grid-column: 1 / 6; }
  .footer__bank { grid-column: 6 / 10; }
  .footer__nav { grid-column: 10 / 13; }
  .footer__nav ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}