@layer reset, tokens, base, layout, components, utilities;
@view-transition { navigation: auto; }

@font-face { font-family: "MSD Display"; src: url("fonts/Tektur-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "MSD Light"; src: url("fonts/Jura-Light.ttf") format("truetype"); font-weight: 300; font-display: swap; }
@font-face { font-family: "MSD Mono"; src: url("fonts/IBMPlexMono-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; }
  body, h1, h2, h3, p, ul, ol, dl, dd, figure, fieldset { margin: 0; padding: 0; }
  h4 { margin: 0; padding: 0; }
  ul, ol { list-style: none; }
  fieldset { border: 0; min-width: 0; }
  img, svg { display: block; max-width: 100%; }
  img { height: auto; }
  button, input, select, textarea { font: inherit; color: inherit; }
  button { cursor: pointer; }
  [hidden]:not(#pl) { display: none !important; }
}

@layer tokens {
  :root {
    color-scheme: dark;

    --bg: #040505; --bg-2: #070909; --surface: #0a0c0c; --surface-2: #121414; --plate: #141616;
    --line: #1c1e1e; --line-2: #2b2c2c; --line-3: #404242; --line-4: #727575; --rule: #262727;
    --tile: #1a1c1c;
    --grp-gap: clamp(64px, 7vw, 120px);
    --text: #f4f5f5; --text-2: #a2a3a4; --text-3: #8b8d8d; --text-4: #828485; --text-5: #8a8d8d;
    --red: #e31b23; --red-hover: #ab1117; --red-active: #96100f; --red-deep: #9a1314; --red-ink: #f5202c;
    --red-calm: #5e0d10;
    --focus: #f4f5f5;

    --bg2: var(--surface); --tx: var(--text); --dim: var(--text-2); --red2: var(--red-ink); --m-red: var(--red); --m-focus: var(--focus);
    --f-display: "MSD Display", "Arial Black", sans-serif;
    --f-light: "MSD Light", "Segoe UI Light", sans-serif;
    --f-text: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --f-mono: "MSD Mono", ui-monospace, Consolas, monospace;
    --font-eyebrow: var(--f-mono);

    --gutter: clamp(16px, calc(5.333vw - 4.8px), 128px);
    --edge: var(--gutter);

    --pan-w: clamp(440px, 34vw, 720px); --pan-pad: clamp(20px, 1.8vw, 40px); --pan-gap: clamp(16px, 1.6vw, 28px);
    --hdr-h: 60px;
    --sec-pad: clamp(32px, calc(45.94px - .6vw), 48px);
    --ease-out: cubic-bezier(.16, 1, .3, 1); --ease-standard: cubic-bezier(.4, 0, .2, 1);
    --dur-fast: 220ms; --dur-mid: 480ms; --dur-slow: 850ms;
  }
  @media (min-width: 1024px) { :root { --hdr-h: 64px; } }
}

@layer base {
  html { background: var(--bg); scroll-behavior: smooth; scroll-padding-top: calc(var(--hdr-h) + 16px); }
  body { background: var(--bg); color: var(--text); font-family: var(--f-text); font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased; }
  a { color: inherit; text-decoration: none; }
  :focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
  ::selection { background: var(--red); color: #fff; }
  h1, h2, h3 { text-wrap: balance; }
  p { text-wrap: pretty; }
  .sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
  .ico { width: 20px; height: 20px; flex: none; }
  .nowrap, .nw { white-space: nowrap; }
  .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .skip { position: absolute; left: 8px; top: -60px; z-index: 300; padding: 12px 16px; background: var(--text); color: var(--bg); font-weight: 600; }
  .skip:focus { top: 8px; }
  html.is-locked { overflow: hidden; }
}

@layer layout {
  .wrap { width: calc(100% - 2 * var(--gutter)); margin-inline: auto; }
  .sec { padding-block: var(--sec-pad); border-top: 1px solid var(--rule); }
  .sec__top { display: grid; gap: 10px 48px; margin-bottom: clamp(18px, 2vw, 32px); }
  @media (min-width: 900px) {
    .sec__top { grid-template-columns: minmax(0, 1fr) minmax(0, 46ch); align-items: end; }
    .sec__top .sec__text { justify-self: end; text-align: right; }
  }
}

@layer components {

  .kicker { font-family: var(--f-mono); font-size: 11px; line-height: 1.3; letter-spacing: .14em; text-transform: uppercase; color: var(--red-ink); }
  .h1 { font-family: var(--f-display); font-weight: 800; text-transform: uppercase; color: var(--text); line-height: 1.0; letter-spacing: .005em;
    font-size: min(calc(34.29px + .9524vw), calc((100vw - 2 * var(--gutter)) / 9.2), 60px); }
  .h1 > span { display: block; }
  .h1__light { font-family: var(--f-light); font-weight: 300; color: #ebecec; }
  .h2 { font-family: var(--f-display); font-weight: 750; text-transform: uppercase; color: #fff; line-height: 1.15; font-size: clamp(26px, calc(23.4px + .67vw), 40px); }
  .sec__text { font-size: 15px; line-height: 1.45; color: var(--text-4); max-width: 46ch; }
  .ph { display: grid; place-items: center; width: 100%; height: 100%; padding: 10px; text-align: center; font-family: var(--f-mono); font-size: 11px;
    line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); background: var(--surface-2); border: 1px dashed var(--line-3); }
  .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border: 1px solid transparent; border-radius: 0;
    font-family: var(--f-text); font-size: 14px; font-weight: 600; line-height: 1.1; letter-spacing: .01em; text-align: center; white-space: nowrap;
    transition: background-color var(--dur-fast) linear, border-color var(--dur-fast) linear, color var(--dur-fast) linear; }
  .btn--red { background: var(--red); color: #fff; }
  .btn--red:hover { background: var(--red-hover); }
  .btn--red:active { background: var(--red-active); }
  .btn--line { border-color: var(--line-4); color: var(--text); background: transparent; }
  .btn--line:hover { border-color: var(--text); background: rgb(255 255 255 / .06); }
  .btn--line:active { background: rgb(255 255 255 / .1); }
  .btn--sm { min-height: 44px; padding: 0 16px; font-size: 13px; }
  .btn--block { width: 100%; }
  @media (min-width: 1024px) { .btn { min-height: 44px; } }

  .reach { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px; border: 1px solid var(--line-4); color: var(--text); font-size: 14px; font-weight: 600;
    transition: border-color var(--dur-fast) linear, background-color var(--dur-fast) linear; }
  .reach:hover { border-color: var(--text); background: rgb(255 255 255 / .06); }
  .reach .ico { width: 18px; height: 18px; color: var(--red-ink); }
  .reach--ico { width: 40px; min-height: 40px; padding: 0; justify-content: center; }

  .fld { position: relative; min-width: 0; }
  .fld input, .fld select, .fld textarea { display: block; width: 100%; min-width: 0; height: 48px; padding: 18px 14px 4px; border: 1px solid var(--line); border-radius: 0;
    background: var(--surface); color: var(--text); font-size: 16px; line-height: 1.2; appearance: none; -webkit-appearance: none; transition: border-color var(--dur-fast) linear; }
  .fld select { padding-right: 34px; cursor: pointer; }
  .fld textarea { height: auto; min-height: 76px; padding-top: 22px; resize: vertical; field-sizing: content; max-height: 200px; }
  .fld label { position: absolute; left: 15px; top: 24px; transform: translateY(-50%); font-size: 15px; color: var(--text-3); pointer-events: none;
    transition: top var(--dur-fast) var(--ease-out), font-size var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); }
  .fld--area label { top: 14px; transform: none; }
  .fld input:hover, .fld select:hover, .fld textarea:hover { border-color: var(--line-2); }
  .fld input:focus, .fld select:focus, .fld textarea:focus { outline: 1px solid var(--red-ink); outline-offset: -2px; border-color: var(--red-ink); }
  .fld input:focus + label, .fld input:not(:placeholder-shown) + label, .fld textarea:focus + label, .fld textarea:not(:placeholder-shown) + label,
  .fld select:focus + label, .fld select:valid + label, .fld--date label { top: 5px; transform: none; font-size: 11px; letter-spacing: .02em; }
  .fld--select select { border-color: var(--red); }
  .fld--select select:hover { border-color: var(--red-ink); }
  .fld--select label { color: var(--text); font-weight: 600; }
  .fld--select::after { content: ""; position: absolute; right: 16px; top: 21px; width: 6px; height: 6px; background: var(--red-ink); pointer-events: none; }
  .fld [aria-invalid="true"], .agree [aria-invalid="true"] { border-color: var(--red-ink); outline: 1px solid var(--red-ink); outline-offset: -2px; }
  .fld__err { margin-top: 4px; font-size: 13px; line-height: 1.3; color: #ff6b70; }
  .fld__err::before { content: "! "; font-weight: 700; }

  .hdr { position: fixed; z-index: 50; left: 0; right: 0; top: 0; height: var(--hdr-h); isolation: isolate; transition: top var(--dur-fast) var(--ease-standard); }
  .hdr.is-hidden { top: calc(-1 * var(--hdr-h) - 2px); }
  .hdr::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bg); border-bottom: 1px solid var(--rule); }
  @supports (animation-timeline: scroll()) { .hdr::before { opacity: 0; animation: msd-hdr linear both; animation-timeline: scroll(root); animation-range: 0 80px; } }
  .hdr__in { height: 100%; display: flex; align-items: center; gap: 4px; }
  .hdr__logo { display: block; flex: none; margin-right: auto; }
  .hdr__logo img { width: auto; height: 40px; }
  .hdr__logo:focus-visible, .ftr__logo:focus-visible { outline-color: var(--red-ink); outline-offset: 3px; }
  .hdr__nav, .hdr__reach, .hdr__cta, .hdr__lang { display: none; }
  .hdr__icon { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border: 0; background: transparent; color: var(--text); }
  .hdr__icon:hover { background: rgb(255 255 255 / .05); }
  .hdr__burger { margin-right: -10px; }
  .ico--menu { width: 24px; height: 24px; }
  .hdr__globe { display: flex; align-items: center; gap: 5px; width: auto; padding: 0 8px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .06em; cursor: pointer; }
  .hdr__globe .ico { width: 18px; height: 18px; }
  .langs { position: fixed; inset: var(--hdr-h) var(--gutter) auto auto; margin: 0; width: 220px; max-width: calc(100vw - 2 * var(--gutter)); height: auto; padding: 0;
    border: 1px solid var(--line-3); background: var(--bg); color: var(--text); }
  .langs nav { display: grid; }
  .langs a { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; min-height: 48px; padding: 0 16px; border-bottom: 1px solid var(--line); font-size: 15px; }
  .langs a:last-child { border-bottom: 0; }
  .langs a b { font-family: var(--f-mono); font-weight: 400; font-size: 12px; letter-spacing: .06em; color: var(--text-3); }
  .langs a:hover { background: rgb(255 255 255 / .05); }
  .langs a[aria-current], .langs a[aria-current] b { color: var(--red-ink); }
  @supports not selector(:popover-open) { .langs { display: none; } .langs.is-open { display: block; } }
  .menu { position: fixed; inset: var(--hdr-h) 0 auto; margin: 0; width: 100%; max-width: none; height: auto; max-height: calc(100dvh - var(--hdr-h)); overflow-y: auto;
    padding: 8px var(--gutter) 24px; border: 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: var(--bg); color: var(--text); }
  .menu nav { display: grid; }
  .menu nav a { padding: 14px 0; border-bottom: 1px solid var(--line); font-family: var(--f-display); font-weight: 700; font-size: 18px; text-transform: uppercase; }
  .menu nav a:hover { color: var(--red-ink); }
  @supports not selector(:popover-open) { .menu { display: none; } .menu.is-open { display: block; } }
  .menu__reach { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
  .menu__reach .reach { justify-content: center; padding: 0 8px; font-size: 13px; }
  .menu__foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 12px; }
  .menu__tel { font-weight: 600; font-size: 16px; }
  .menu__lang { display: flex; gap: 4px; font-family: var(--f-mono); font-size: 13px; }
  .menu__lang a { padding: 10px 8px; color: var(--text-3); }
  .menu__lang a[aria-current] { color: var(--red-ink); }
  @media (min-width: 1024px) {
    .hdr__icon { display: none; }
    .hdr__logo { margin-right: 0; }
    .hdr__logo img { height: 44px; }
    .hdr__nav { display: flex; gap: clamp(16px, 2vw, 40px); margin-left: clamp(24px, 3.5vw, 64px); margin-right: auto; }
    .hdr__nav a { padding-block: 10px; font-size: 14px; font-weight: 500; color: var(--text-2); }
    .hdr__nav a:hover { color: var(--text); text-decoration: underline 1px var(--red-ink); text-underline-offset: 8px; }
    .hdr__reach { display: flex; align-items: center; gap: 4px; }
    .hdr__tel { display: none; padding: 10px 10px 10px 0; font-size: 15px; font-weight: 600; white-space: nowrap; }
    .hdr__tel:hover { text-decoration: underline 1px var(--red-ink); text-underline-offset: 6px; }
    .hdr__cta { display: inline-flex; margin-left: 16px; min-height: 40px; min-width: 150px; }
    .hdr__lang { display: flex; gap: 2px; margin-left: 20px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .06em; }
    .hdr__lang a { padding: 10px 6px; color: var(--text-3); }
    .hdr__lang a:hover { color: var(--text); }
    .hdr__lang a[aria-current] { color: var(--red-ink); }
    .hdr__lang a:last-child { padding-right: 0; }
  }
  @media (min-width: 1280px) { .hdr__tel { display: inline; } }

  .hero { position: relative; display: flex; flex-direction: column; }
  .hero__panel { display: contents; }
  .hero__copy { order: 1; position: relative; z-index: 2; padding-top: calc(var(--hdr-h) + clamp(8px, calc(2.476vw - 1.66px), 40px)); }
  .hero__lead { margin-top: clamp(12px, calc(8.29px + .952vw), 22px); font-size: clamp(15px, calc(14.63px + .095vw), 17px); line-height: 1.42; color: var(--text-2); max-width: 30em; }
  .hero__media { order: 2; position: relative; z-index: 0; margin: 14px 0 -36px; height: clamp(150px, calc(100svh - 476px - env(safe-area-inset-bottom, 0px)), 40svh);
    overflow: hidden; container-type: size; --ox: 1; --oy: .55; }

  .hero__stage { position: absolute; width: max(100cqw, calc(100cqh * 16 / 9)); height: max(100cqh, calc(100cqw * 9 / 16));
    left: calc((100cqw - max(100cqw, calc(100cqh * 16 / 9))) * var(--ox)); top: calc((100cqh - max(100cqh, calc(100cqw * 9 / 16))) * var(--oy)); }
  .hero__stage picture { display: block; width: 100%; height: 100%; }
  .hero__img { width: 100%; height: 100%; }
  .hero__act { order: 4; position: relative; z-index: 2; }
  .hero__index { display: none; order: 3; }
  .hix { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .hix__a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 14px; border: 1px solid var(--line-2); background: var(--surface);
    transition: border-color var(--dur-fast) linear, background-color var(--dur-fast) linear; }
  .hix__name { grid-column: 1; font-family: var(--f-display); font-weight: 700; font-size: clamp(13px, calc(10.6px + .19vw), 15px); line-height: 1.2; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  .hix__from { font-family: var(--f-display); font-weight: 700; font-size: clamp(15px, calc(12.4px + .2vw), 18px); line-height: 1; color: var(--text); white-space: nowrap; }
  .hix__a:hover { border-color: var(--text-2); background: #0d0f0f; }
  .hix__a:hover .hix__name { text-decoration: underline 1px var(--red-ink); text-underline-offset: 4px; }
  .qform__fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .qform__fields .fld--select { grid-column: 1 / -1; }
  .qform__actions { display: grid; margin-top: 8px; }
  .qform__actions .btn--red { min-height: 52px; font-size: 15px; }
  .qform__note { display: none; }
  .meta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; margin-top: 16px; }
  .meta__item { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; column-gap: 8px; min-height: 56px; padding: 8px 10px; border: 1px solid var(--line-2); }
  .meta__ico { grid-row: 1 / span 2; color: var(--red-ink); }
  .meta__val { font-size: clamp(12px, calc(1px + 3.333vw), 14px); font-weight: 600; line-height: 1.25; color: var(--text); }
  a.meta__val:hover { text-decoration: underline 1px var(--red-ink); text-underline-offset: 4px; }
  .meta__sub { font-size: 12px; color: #8a8b8b; }
  .meta__item--hours { display: none; }
  @media (max-width: 359.98px) { .meta__item { padding-inline: 8px; } }

  .hz { position: absolute; inset: 0; pointer-events: none; }
  .hz.is-under { visibility: hidden; }
  .hz__box { position: absolute; left: var(--bx); top: var(--by); width: var(--bw); height: var(--bh); opacity: 0; transition: opacity var(--dur-mid) var(--ease-out); }
  .hz__box i { position: absolute; width: 14px; height: 14px; border: 0 solid var(--red-ink); }
  .hz__box i:nth-child(1) { left: 0; top: 0; border-width: 1px 0 0 1px; } .hz__box i:nth-child(2) { right: 0; top: 0; border-width: 1px 1px 0 0; }
  .hz__box i:nth-child(3) { left: 0; bottom: 0; border-width: 0 0 1px 1px; } .hz__box i:nth-child(4) { right: 0; bottom: 0; border-width: 0 1px 1px 0; }
  .hz__pin { position: absolute; left: var(--x); top: var(--y); width: 32px; height: 32px; margin: -16px 0 0 -16px; padding: 0; border: 0; background: transparent; pointer-events: auto; }
  .hz__pin::before { content: ""; position: absolute; inset: 9px; border: 1px solid var(--red-ink); background: rgb(4 5 5 / .55); transition: inset var(--dur-fast) var(--ease-out), background-color var(--dur-fast) linear; }
  .hz__pin::after { content: ""; position: absolute; left: 13px; top: 13px; width: 6px; height: 6px; background: var(--red-ink); }
  .hz__card { position: absolute; left: var(--x); top: var(--y); display: grid; gap: 2px; width: max-content; max-width: min(260px, 60cqw); padding: 10px 12px;
    margin: 22px 0 0 -16px; background: var(--bg); border: 1px solid var(--line-3); pointer-events: auto; opacity: 0; visibility: hidden;
    transform: translateY(6px); transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard), visibility 0s linear var(--dur-fast); }
  .hz--l .hz__card { margin-left: 0; translate: calc(-100% + 16px) 0; }
  .hz__zone { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--red-ink); }
  .hz__svc { font-size: 15px; font-weight: 600; line-height: 1.25; color: var(--text); text-decoration: underline 1px transparent; text-underline-offset: 3px; }
  .hz__svc:hover { text-decoration-color: var(--red-ink); }
  .hz__price { font-size: 13px; color: var(--text-2); }
  .hz.is-on .hz__box { opacity: 1; }
  .hz.is-on .hz__pin::before, .hz__pin:hover::before, .hz__pin[aria-expanded="true"]::before { inset: 6px; background: var(--red); border-color: var(--red); }
  .hz.is-on .hz__pin::after, .hz__pin[aria-expanded="true"]::after { background: #fff; }
  .hz.is-on .hz__card, .hz:focus-within .hz__card, .hz__pin[aria-expanded="true"] + .hz__card { opacity: 1; visibility: visible; transform: none;
    transition: opacity var(--dur-mid) var(--ease-out), transform var(--dur-mid) var(--ease-out), visibility 0s; }
  @media (hover: hover) and (pointer: fine) { .hero__stage.is-done .hz:hover .hz__card { opacity: 1; visibility: visible; transform: none; transition: opacity var(--dur-mid) var(--ease-out), transform var(--dur-mid) var(--ease-out), visibility 0s; } }

  .hz--salons { --x: 65.3%; --y: 31.6%; --bx: 57.5%; --by: 24.6%; --bw: 24%; --bh: 11.6%; }
  .hz--durvis { --x: 80.3%; --y: 46.6%; --bx: 74.4%; --by: 33.9%; --bw: 11.7%; --bh: 24.3%; }
  .hz--lukturi { --x: 59.8%; --y: 46.6%; --bx: 54.9%; --by: 43.1%; --bw: 9.7%; --bh: 6.4%; }
  .hz--riteni { --x: 70.5%; --y: 55.9%; --bx: 66.3%; --by: 44.9%; --bw: 8.5%; --bh: 21.4%; }
  .hz--sparns { --x: 90%; --y: 48.4%; --bx: 85.8%; --by: 37.4%; --bw: 8.5%; --bh: 21.4%; }
  .hz--sparns .hz__card, .hz--durvis .hz__card { margin-left: 0; translate: calc(-100% + 16px) 0; }
  @media (max-width: 1023.98px) {
    .hz__box { display: none; }
    .hz__card, .hz--l .hz__card, .hz--sparns .hz__card, .hz--durvis .hz__card { margin: 0; translate: none; padding: 6px 10px;
      left: calc(var(--gutter) - (100cqw - max(100cqw, calc(100cqh * 16 / 9))) * var(--ox));
      top: calc(8px - (100cqh - max(100cqh, calc(100cqw * 9 / 16))) * var(--oy)); max-width: calc(100cqw - 2 * var(--gutter)); }
    .hz__svc { font-size: 14px; }
  }

  @media (min-width: 768px) {
    .hero__media { height: clamp(300px, 46vw, 440px); margin-bottom: -48px; }
    .qform__fields { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); }
    .qform__fields .fld--select { grid-column: auto; }
    .qform__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
    .qform__actions .btn--red { min-height: 44px; font-size: 14px; min-width: 178px; }
    .qform__note { display: block; font-size: 13px; color: var(--text-3); }
    .meta { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 20px; }
    .meta__item { grid-template-columns: 36px minmax(0, auto); column-gap: 14px; min-height: 0; padding: 0; border: 0; }
    .meta__ico { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); }
    .meta__ico .ico { width: 18px; height: 18px; }
    .meta__val { font-size: clamp(14px, calc(11.71px + .298vw), 16px); }
    .meta__item--hours { display: grid; }
  }
  @media (min-width: 1024px) {

    .hero { min-height: max(600px, min(100svh, 38vw)); justify-content: flex-end; }
    .hero__media { position: absolute; inset: 0; height: auto; margin: 0; --oy: .55; }
    .hero__stage { left: min(0px, calc(100cqw - .95 * max(100cqw, calc(100cqh * 16 / 9)))); }
    .hero__panel { position: relative; z-index: 2; display: flex; flex-direction: column; gap: var(--pan-gap); width: var(--pan-w);
      margin-top: calc(var(--hdr-h) + clamp(12px, 1.4vw, 32px)); margin-bottom: clamp(20px, 2.4vw, 48px); margin-left: calc(var(--edge) - var(--pan-pad) - 1px);
      padding: var(--pan-pad); background: var(--bg); border: 1px solid var(--line-2); }
    .hero__copy, .hero__act, .hero__index { width: auto; max-width: none; margin-inline: 0; padding: 0; }
    .hero__index { display: block; }
    .hero__panel .h1 { font-size: min(calc(26px + 1.6vw), calc((var(--pan-w) - 2 * var(--pan-pad) - 2px) / 8.4), 62px); }
    .meta { display: none; }
    .qform__fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .qform__fields .fld--select { grid-column: 1 / -1; }
    .qform__fields .fld input, .qform__fields .fld select { height: clamp(48px, 3.4vw, 56px); }
    .qform__fields .fld label { top: clamp(24px, 1.7vw, 28px); }
  }

  .hero__base { order: 5; padding-bottom: 8px; }
  .hero__facts { --fb-line: rgb(244 245 245 / .4); }
  .fact { position: relative; display: grid; align-content: start; align-items: start; gap: 6px; min-width: 150px; padding: 12px 14px; background: var(--bg); border: 1px solid var(--line-3); }
  .fact__v { font-family: var(--f-display); font-weight: 750; line-height: .95; text-transform: uppercase; color: #fff; white-space: nowrap; }
  .fact__l { contain: inline-size; font-size: 11px; font-weight: 600; letter-spacing: .1em; line-height: 1.35; text-transform: uppercase; color: var(--red-ink); }
  @media (max-width: 767.98px) {

    .hero__facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 12px; margin-top: 16px; padding: 10px 12px; background: var(--bg); border: 1px solid var(--line-3); }
    .fact { grid-column: 1 / -1; grid-template-columns: subgrid; align-items: center; gap: normal; min-width: 0; padding: 0; background: none; border: 0; }
    .fact__v { font-size: clamp(18px, 5.6vw, 22px); }
  }
  @media (min-width: 768px) and (max-width: 1023.98px) {

    .hero__facts { display: grid; grid-auto-flow: column; grid-auto-columns: max-content; gap: 8px; margin: 16px calc(-1 * var(--gutter)) 0;
      padding: 0 var(--gutter) 2px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); scrollbar-width: none; }
    .hero__facts::-webkit-scrollbar { display: none; }
    .fact { scroll-snap-align: start; }
    .fact__v { font-size: clamp(22px, 5.6vw, 26px); }
  }
  @media (min-width: 1024px) {
    .hero {
      --fb-v: clamp(22px, min(calc(2.34vw - 2px), calc(1.6vw + 8px)), 44px);
      --fb-l: clamp(11px, calc(9.4px + .13vw), 13px);
      --fb-lead: clamp(20px, 2vw, 44px);
      --fb-px: clamp(12px, 1.1vw, 22px);
      --fb-py: clamp(12px, .9vw, 18px);
      --fb-min: clamp(132px, 10vw, 220px);
      --fb-gap: clamp(16px, 1.6vw, 32px);
    }
    .hero__base { display: contents; }
    .hero__facts { position: absolute; z-index: 2; bottom: clamp(20px, 2.4vw, 48px);
      left: calc(var(--edge) - var(--pan-pad) - 1px + var(--pan-w) + var(--pan-gap));
      right: calc(var(--edge) - var(--pan-pad) - 1px);
      padding: var(--fb-lead) 0 0; display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; align-items: stretch; gap: 0 var(--fb-gap); }

    .hero__facts::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--fb-line); }
    .fact { min-width: var(--fb-min); padding: var(--fb-py) var(--fb-px); }
    .fact::before { content: ""; position: absolute; left: 15px; bottom: 100%; width: 1px; height: var(--fb-lead); background: var(--fb-line); }
    .fact::after { content: ""; position: absolute; left: 12px; bottom: calc(100% + var(--fb-lead) - 3px); width: 7px; height: 7px; background: var(--red-ink); }
    .fact__v { font-size: var(--fb-v); }
    .fact__l { font-size: var(--fb-l); }
  }

  .svc .sec__top { margin-bottom: clamp(16px, 1.6vw, 24px); padding: clamp(14px, 1.6vw, 22px) clamp(16px, 2vw, 28px); background: var(--text); }
  .svc .sec__top .h2 { color: var(--bg); }
  .svc__groups { display: grid; gap: var(--grp-gap); }
  .svc__ghead { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 88px auto; margin-bottom: 8px;
    background: var(--plate); border: 1px solid var(--line-2); overflow: hidden; }
  .svc__ghead > picture { position: relative; display: block; grid-row: 1; min-width: 0; }
  .svc__gimg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

  .svc__gstrip { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: max-content; grid-template-rows: 100%; gap: 2px; grid-row: 1; min-width: 0;
    overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; background: var(--bg); }
  .svc__gstrip::-webkit-scrollbar { display: none; }
  .svc__gcell { height: 100%; aspect-ratio: 1 / 1; scroll-snap-align: start; }
  .svc__gcell .gal__fig { height: 100%; }
  .svc__gcell .gal__cap { display: none; }
  .svc__gopen { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: var(--surface-2); cursor: zoom-in; }
  .svc__gopen picture { display: block; height: 100%; }
  .svc__gopen:focus-visible { outline-offset: -3px; }
  .svc__gsq { width: 100%; height: 100%; object-fit: cover; transition: opacity var(--dur-mid) var(--ease-out); }
  .svc__gopen:hover .svc__gsq { opacity: .86; }
  .svc__gname { grid-row: 2; position: relative; z-index: 1; display: flex; align-items: center; min-width: 0; padding: 12px clamp(16px, 2vw, 28px); background: var(--plate);
    font-family: var(--f-display); font-weight: 750; font-size: clamp(24px, calc(21.4px + .67vw), 36px); line-height: 1.15; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  @media (min-width: 768px) {

    .svc__ghead { grid-template-columns: fit-content(64%) minmax(0, 1fr); grid-template-rows: minmax(clamp(64px, 6vw, 96px), auto); }
    .svc__gname { grid-row: 1; grid-column: 1; }
    .svc__ghead > picture { grid-row: 1; grid-column: 2; border-left: 1px solid var(--line-2); }
    .svc__gstrip { grid-column: 2; border-left: 1px solid var(--line-2); }
  }
  .svc__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 560px), 1fr)); gap: 8px; align-items: start; }
  .svc__item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: start; border: 1px solid transparent; background: var(--tile);
    transition: border-color var(--dur-fast) linear, background-color var(--dur-fast) linear; scroll-margin-top: calc(var(--hdr-h) + 16px); }
  .svc__num { align-self: stretch; display: grid; place-items: center; background: var(--bg-2); font-family: var(--f-display); font-weight: 700;
    font-size: 18px; line-height: 1; color: var(--red-ink); transition: background-color var(--dur-fast) linear, color var(--dur-fast) linear; }
  .svc__det { min-width: 0; }
  .svc__sum { display: grid; grid-template-columns: minmax(0, 1fr) 16px; column-gap: 10px; align-items: center; min-height: 62px; padding: 10px 6px 10px 12px; cursor: pointer; list-style: none; }
  .svc__sum::-webkit-details-marker { display: none; }
  .svc__sum--static { cursor: default; grid-template-columns: minmax(0, 1fr); }
  .svc__title { grid-column: 1; font-size: clamp(14px, calc(12.9px + .29vw), 16px); font-weight: 600; line-height: 1.25; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  .svc__price { grid-column: 1; display: grid; justify-items: start; gap: 2px; font-size: 12px; line-height: 1.3; color: var(--text-3); overflow-wrap: anywhere; }
  .svc__price b { font-family: var(--f-display); font-weight: 700; font-size: 17px; line-height: 1.1; color: #fff; }
  .svc__price b:not(.nw) { font-family: var(--f-text); font-weight: 600; font-size: 14px; line-height: 1.3; }
  .svc__price--none b { font-family: var(--f-text); font-weight: 400; font-size: 14px; color: var(--text-2); }
  .svc__price--var { gap: 4px; }
  .pv { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; }
  .pv small { font-size: 12px; color: var(--text-3); }
  .svc__tog { grid-column: 2; grid-row: 1 / span 2; position: relative; width: 16px; height: 16px; border: 1px solid var(--line-3); }
  .svc__tog::before, .svc__tog::after { content: ""; position: absolute; left: 3px; right: 3px; top: 6.5px; height: 1px; background: var(--text-2); }
  .svc__tog::after { transform: rotate(90deg); }
  .svc__det[open] .svc__tog::after { display: none; }
  .svc__more { display: grid; gap: 12px; padding: 0 12px 14px; }
  .svc__opis { font-size: 14px; line-height: 1.45; color: var(--text-2); max-width: 46ch; }
  .svc__info { display: grid; gap: 10px; min-width: 0; }
  .svc__dl { display: grid; gap: 12px; }
  .svc__dl dt { font-family: var(--f-mono); font-size: 11px; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; color: var(--red-ink); }
  .svc__dl dd { margin-top: 3px; font-size: 14px; line-height: 1.45; color: var(--text-2); max-width: 46ch; }
  .svc__rel a { color: var(--text); text-decoration: underline 1px var(--line-3); text-underline-offset: 3px; }
  .svc__rel a:hover { text-decoration-color: var(--red-ink); }
  .svc__book { align-self: start; margin: 9px 8px 0 0; min-height: 44px; padding: 0 12px; font-size: 13px; }
  .svc__item:hover, .svc__item:has(details[open]) { border-color: #5c5f5f; }

  .svc__item:has(details[open]) .svc__book, .svc__item:focus-within .svc__book { background: var(--red); border-color: var(--red); color: #fff; }
  @media (hover: hover) and (pointer: fine) { .svc__item:hover .svc__book { background: var(--red); border-color: var(--red); color: #fff; } }
  .svc__item .svc__book:hover { background: var(--red-hover); border-color: var(--red); }
  .svc__item .svc__book:active { background: var(--red-active); border-color: var(--red); }
  .svc__item:target { border-color: var(--red-ink); }
  @media (max-width: 399.98px) { .svc__book { padding: 0 10px; font-size: 12px; } }
  @media (min-width: 768px) {
    .svc__item { grid-template-columns: 48px minmax(0, 1fr) auto; } .svc__num { font-size: 20px; } .svc__book { min-height: 40px; margin-top: 11px; }

    .svc__sum { grid-template-columns: minmax(0, 1fr) auto 16px; column-gap: 14px; }
    .svc__price { grid-column: 2; grid-row: 1; justify-items: end; text-align: right; min-width: 6.5em; max-width: 13em; padding-left: 14px; border-left: 1px solid var(--bg); }
    .svc__price b.nw { font-size: clamp(17px, calc(15.6px + .18vw), 20px); }
    .svc__price--var { max-width: none; }
    .svc__tog { grid-column: 3; grid-row: 1; }
    .svc__sum--static { grid-template-columns: minmax(0, 1fr) auto; }
    .pv { justify-content: flex-end; flex-wrap: nowrap; white-space: nowrap; }
  }

  .rc__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .rc__fig { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--surface-2); }
  .rc__fig img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .rc__fig--main { grid-column: 1 / -1; }

  .rc__spec { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; column-gap: clamp(16px, 4vw, 96px); margin-top: clamp(24px, 3vw, 48px); }
  .rc__item { display: grid; gap: 6px; align-content: start; }
  .rc__v { order: -1; font-family: var(--f-display); font-weight: 750; font-size: clamp(32px, calc(4px + 3.4vw), 88px); line-height: .95; text-transform: uppercase; color: #fff; white-space: nowrap; }
  .rc__l { font-size: clamp(14px, calc(12.9px + .29vw), 17px); line-height: 1.35; color: var(--text-2); }
  @media (min-width: 1024px) {

    .rc__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); grid-template-rows: repeat(3, minmax(0, 1fr)); }
    .rc__fig--main { grid-column: 1; grid-row: 1 / span 3; }
    .rc__fig:not(.rc__fig--main) { aspect-ratio: auto; }
  }

  .gal__top { margin-bottom: clamp(18px, 2vw, 32px); }
  .gal__all { justify-self: start; }
  @media (min-width: 900px) { .gal__all { justify-self: end; } }
  .gal__row { display: grid; grid-auto-flow: column; grid-auto-columns: min(80vw, 420px); gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    padding-inline: var(--edge); scroll-padding-inline: var(--edge); scrollbar-width: thin; }
  .gal__item { min-width: 0; scroll-snap-align: start; }
  .gal__open { display: block; width: 100%; padding: 0; border: 0; background: var(--surface-2); aspect-ratio: 1 / 1; overflow: hidden; cursor: zoom-in; }
  .gal__open img { width: 100%; height: 100%; object-fit: cover; transition: opacity var(--dur-mid) var(--ease-out); }
  .gal__open:hover img { opacity: .86; }
  .gal__cap { display: grid; gap: 6px; padding: 10px 2px 0; }
  .gal__label { font-family: var(--f-display); font-weight: 700; font-size: 15px; text-transform: uppercase; color: #fff; }
  .gal__brand { font-size: 13px; color: var(--text-2); }
  .gal__dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 10px; font-size: 13px; }
  .gal__dl dt { color: var(--text-2); font-weight: 600; }
  .gal__dl dd { color: var(--text-3); }

  .gal__open, .wk__open { position: relative; }
  .gal__tag { position: absolute; left: 0; top: 0; padding: 7px 10px 6px; background: var(--bg); color: var(--text); font-family: var(--f-mono); font-size: 12px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; pointer-events: none; }
  .gal__faza { font-family: var(--f-mono); font-size: 13px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--red-ink); }
  .gal__cap .gal__faza { display: none; }
  @media (min-width: 1024px) { .gal__row { grid-auto-flow: row; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: visible; } }

  .lb { position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--bg); color: var(--text); }
  .lb[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
  .lb::backdrop { background: var(--bg); }
  .lb__bar, .lb__nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px var(--gutter); }
  .lb__count { font-family: var(--f-mono); font-size: 13px; color: var(--text-2); }
  .lb__count b { font-weight: 400; color: var(--red-ink); }
  .lb__close { min-height: 44px; padding: 0 10px; border: 0; background: none; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-2); }
  .lb__close:hover { color: #fff; text-decoration: underline 1px var(--red-ink); text-underline-offset: 5px; }
  .lb__fig { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 10px; min-height: 0; padding: 0 var(--gutter); touch-action: pan-y; }
  .lb__img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
  .lb__cap { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 14px; color: var(--text-2); }
  .lb__cap b { color: var(--text); }
  .lb__step { min-width: 0; }
  @media (max-width: 479.98px) { .lb__step { padding: 0 10px; font-size: 13px; } }

  .wk { border-top: 0; padding-top: calc(var(--hdr-h) + var(--sec-pad)); }
  .wk__idx { margin-bottom: var(--grp-gap); }
  .wk__idxl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  @media (max-width: 359.98px) { .wk__idxl { grid-template-columns: minmax(0, 1fr); } }
  @media (min-width: 768px) { .wk__idxl { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .wk__ia { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 48px; padding: 10px 14px; border: 1px solid transparent; background: var(--tile);
    transition: border-color var(--dur-fast) linear; }
  .wk__ia:hover { border-color: #5c5f5f; }
  .wk__in { font-family: var(--f-display); font-weight: 700; font-size: clamp(13px, calc(11.6px + .19vw), 15px); line-height: 1.2; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  .wk__ic, .wk__n { font-family: var(--f-mono); font-size: 13px; line-height: 1; color: var(--red-ink); }
  .wk__sec { scroll-margin-top: calc(var(--hdr-h) + 16px); }
  .wk__sec + .wk__sec { margin-top: var(--grp-gap); }
  .wk__top { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; column-gap: 14px; margin-bottom: 8px; padding: 10px 8px 10px clamp(16px, 2vw, 28px); background: var(--plate); }
  .wk__title { font-family: var(--f-display); font-weight: 750; font-size: clamp(20px, calc(17.7px + .6vw), 32px); line-height: 1.15; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  .wk__book { min-height: 44px; padding: 0 12px; font-size: 13px; }
  .wk__book:hover, .wk__book:focus-visible { background: var(--red); border-color: var(--red); color: #fff; }
  .wk__book:active { background: var(--red-active); border-color: var(--red); }
  .wk__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px, 46%), 1fr)); gap: 8px; }
  .wk__open { display: block; width: 100%; padding: 0; border: 0; background: var(--surface-2); aspect-ratio: 1 / 1; overflow: hidden; cursor: zoom-in; }
  .wk__open img { width: 100%; height: 100%; object-fit: cover; transition: opacity var(--dur-mid) var(--ease-out); }
  .wk__open:hover img { opacity: .86; }
  .wk__cell .gal__cap { display: none; }
  @media (max-width: 479.98px) { .wk__top { grid-template-columns: minmax(0, 1fr) auto; row-gap: 6px; } .wk__title { grid-column: 1 / -1; } }
  @media (max-width: 399.98px) { .wk__top { padding-right: 6px; column-gap: 10px; } .wk__book { padding: 0 10px; font-size: 12px; } }
  @media (min-width: 768px) { .wk__book { min-height: 40px; } }

  .prv { border-top: 0; padding-top: calc(var(--hdr-h) + var(--sec-pad)); }
  .pv__in > * { max-width: 46rem; }
  .pv__h1 { font-size: clamp(22px, calc(20.4px + .67vw), 40px); overflow-wrap: anywhere; }
  .pv__date { margin-top: 8px; font-size: 14px; color: var(--text-3); }
  .pv__sec { margin-top: clamp(28px, 3vw, 40px); }
  .pv__h2 { font-family: var(--f-display); font-weight: 750; font-size: clamp(18px, calc(16.4px + .4vw), 24px); line-height: 1.2; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; hyphens: auto; }
  .pv__sec p, .pv__ul { margin-top: 10px; font-size: 16px; line-height: 1.55; color: var(--text-2); overflow-wrap: anywhere; }
  .pv__ul { padding-left: 1.2em; list-style: disc; }
  .pv__ul li + li { margin-top: 4px; }
  .pv__sec a { color: var(--text); text-decoration: underline 1px var(--line-3); text-underline-offset: 3px; }
  .pv__sec a:hover { text-decoration-color: var(--red-ink); }
  .agree a { color: var(--text-2); text-decoration: underline 1px var(--line-3); text-underline-offset: 3px; }
  .agree a:hover { color: var(--text); text-decoration-color: var(--red-ink); }

  .mat__fig { margin: 0 calc(-1 * var(--gutter)) 18px; height: 170px; overflow: hidden; }
  .mat__fig img { width: 100%; height: 100%; object-fit: cover; }
  .mat .h2 { margin-bottom: 12px; }
  .mat__cta { margin-top: 18px; width: 100%; }
  @media (min-width: 768px) { .mat { display: none; } }

  .cta { border-top: 1px solid var(--rule); padding-block: var(--sec-pad); }
  .cta__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cta__copy .h2 { margin-bottom: 14px; font-size: clamp(30px, calc(25.3px + 1.2vw), 52px); }
  .cta__text { font-size: clamp(17px, calc(15.9px + .29vw), 21px); line-height: 1.45; color: #fff; max-width: 32em; }
  .cta__btns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .cta__btns .reach { justify-content: center; padding: 0 8px; }
  @media (max-width: 399.98px) { .menu__reach, .cta__btns { grid-template-columns: minmax(0, 1fr); } }
  .cta__list { display: grid; gap: 14px; margin-top: 18px; }
  .cta__list li { display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 14px; align-items: center; }
  .cta__list .ico { grid-row: 1 / span 2; width: 22px; height: 22px; color: var(--red-ink); }
  .cta__val { font-size: 15px; font-weight: 600; color: #f3f1f1; }
  a.cta__val:hover { text-decoration: underline 1px currentColor; text-underline-offset: 4px; }
  .cta__sub { font-size: 12px; color: var(--text-3); }
  .cform { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; align-content: start; }
  .cform .btn { min-height: 52px; font-size: 15px; }
  @media (min-width: 1024px) {
    .cta { padding-block: 0; }
    .cta__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) clamp(280px, 22vw, 420px); column-gap: clamp(24px, 3vw, 64px); align-items: center; }
    .cta__copy { align-self: stretch; display: grid; align-content: center; margin-left: calc(-1 * var(--edge)); padding: var(--sec-pad) clamp(24px, 3vw, 56px) var(--sec-pad) var(--edge); background: var(--red-calm); }
    .cta__reach, .cform { padding-block: var(--sec-pad); }
    .cform .btn { min-height: 48px; font-size: 14px; }
  }

  .ftr { border-top: 1px solid var(--rule); padding-block: 28px calc(96px + env(safe-area-inset-bottom, 0px)); }
  .ftr__in { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 40px; }
  .ftr__logo img { height: 36px; width: auto; }
  .ftr__sub { flex: 1 1 220px; font-size: 13px; color: var(--text-5); }
  .ftr__nav { display: flex; flex-wrap: wrap; gap: 4px 28px; width: 100%; }
  .ftr__nav a { padding-block: 12px; font-size: 13px; font-weight: 500; color: #a1a4a1; }
  .ftr__nav a:hover { color: var(--text); text-decoration: underline 1px var(--red-ink); text-underline-offset: 6px; }
  .ftr__social { display: flex; gap: 4px; }
  .ftr__social a { display: grid; place-items: center; width: 44px; height: 44px; color: var(--text); }
  .ftr__social a:hover { color: var(--red-ink); }
  .ftr__copy { font-size: 12px; color: var(--text-5); }
  .ftr__imprint { display: grid; gap: 2px; }
  .ftr__dev { font-size: 11px; line-height: 1.35; color: var(--text-4); }
  .ftr__top { display: inline-grid; place-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--line-2); font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); }
  .ftr__top:hover { border-color: var(--text-2); color: var(--text); }
  @media (min-width: 768px) { .ftr { padding-bottom: 28px; } }
  @media (min-width: 1200px) { .ftr__in { gap: 16px 48px; min-height: 76px; } .ftr__sub { flex: 0 1 auto; } .ftr__nav { width: auto; margin-inline: auto; } }

  .mbar { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    padding-bottom: env(safe-area-inset-bottom, 0px); background: var(--bg); border-top: 1px solid var(--line-2); transition: transform var(--dur-fast) var(--ease-standard); }
  .mbar a { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; font-size: 15px; font-weight: 600; }
  .mbar__call { color: var(--text); background: var(--surface); }
  .mbar__call .ico { width: 18px; height: 18px; }
  .mbar__book { background: var(--red); color: #fff; }
  .mbar__book:active { background: var(--red-active); }
  .is-typing .mbar { transform: translateY(110%); }
  @media (min-width: 768px) { .mbar { display: none; } }

  .book { position: fixed; inset: auto 0 0 0; width: 100%; max-width: 100%; max-height: 92dvh; margin: 0; padding: 0; border: 0; border-top: 1px solid var(--line-2);
    background: var(--surface); color: var(--text); overflow: hidden; transition: transform var(--dur-mid) var(--ease-out); }
  .book[open] { transform: none; }
  @starting-style { .book[open] { transform: translateY(100%); } }
  .book::backdrop { background: rgb(4 5 5 / .72); }
  .book__form, .book__ok { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; max-height: 92dvh; }
  .book__head { position: relative; padding: 18px var(--gutter) 14px; border-bottom: 1px solid var(--line); }
  .book__head .kicker { margin-bottom: 6px; }
  .book__title { font-family: var(--f-display); font-weight: 750; font-size: 22px; line-height: 1.15; text-transform: uppercase; }
  .book__title:focus { outline: none; }
  .book__close { position: absolute; right: calc(var(--gutter) - 10px); top: 10px; min-height: 44px; padding: 0 10px; border: 0; background: none; font-family: var(--f-mono); font-size: 12px;
    letter-spacing: .1em; text-transform: uppercase; color: var(--text-2); }
  .book__close:hover { color: #fff; text-decoration: underline 1px var(--red-ink); text-underline-offset: 5px; }
  .book__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 16px var(--gutter); overflow-y: auto; overscroll-behavior: contain; }
  .book__two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: start; }
  .slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 4px; }
  .slots legend { margin-bottom: 6px; font-size: 13px; color: var(--text-3); }
  .slot { position: relative; }
  .slot input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
  .slot span { display: grid; place-items: center; min-height: 44px; border: 1px solid var(--line); font-size: 15px; font-weight: 600; color: var(--text-2);
    transition: background-color var(--dur-fast) linear, border-color var(--dur-fast) linear, color var(--dur-fast) linear; }
  .slot input:hover + span { border-color: var(--line-3); }
  .slot input:checked + span { background: var(--red-deep); border-color: var(--red-deep); color: #fff; }
  .slot input:focus-visible + span { outline: 2px solid var(--focus); outline-offset: 2px; }
  .agree { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: start; padding-block: 6px; font-size: 13px; line-height: 1.4; color: var(--text-3); cursor: pointer; }
  .agree input { width: 20px; height: 20px; margin: 0; accent-color: var(--red); }
  .book__foot { display: grid; gap: 8px; padding: 12px var(--gutter) calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); background: var(--surface); }
  .book__note { font-size: 12px; line-height: 1.4; color: var(--text-3); }
  .book__okbody { display: grid; align-content: start; gap: 16px; padding: 24px var(--gutter) calc(24px + env(safe-area-inset-bottom, 0px)); }
  .ok__next { font-size: 15px; line-height: 1.45; color: var(--text-2); }
  .ok__reach { display: grid; gap: 8px; }
  .book__ok .book__head { border-bottom-color: var(--red-ink); }
  @media (min-width: 768px) {
    .book { inset: 0 0 0 auto; width: min(460px, 100vw); height: 100dvh; max-height: 100dvh; border-top: 0; border-left: 1px solid var(--line-2); }
    @starting-style { .book[open] { transform: translateX(100%); } }
    .book__form, .book__ok { height: 100dvh; max-height: 100dvh; }
    .book__head, .book__body, .book__foot, .book__okbody { padding-inline: 24px; }
    .book__close { right: 14px; }
  }

  .pl-run .pl[hidden] { --pl-k: 1; position: fixed; inset: 0; z-index: 100; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px;
    background: var(--bg); cursor: pointer; animation: pl-safe 300ms cubic-bezier(.7, 0, .3, 1) 3000ms forwards; }
  .pl-run.pl-go .pl[hidden] { animation: pl-out calc(var(--pl-k) * 300ms) cubic-bezier(.7, 0, .3, 1) calc(var(--pl-k) * 900ms) forwards; }
  .pl-run.pl-solo .pl[hidden] { animation: pl-out 300ms cubic-bezier(.7, 0, .3, 1) 600ms forwards; }
  .pl-run.pl-skip .pl[hidden] { animation: pl-skip 180ms cubic-bezier(.4, 0, .2, 1) forwards; }
  .pll { position: absolute; left: 50%; top: 50%; width: max(100vw, calc(100vh * var(--ar, 1.6))); height: max(100vh, calc(100vw / var(--ar, 1.6))); transform: translate(-50%, -50%); overflow: hidden; pointer-events: none; }
  .pll canvas { position: absolute; display: block; opacity: 0; }
  .pll__a, .pll__room { left: 0; top: 0; width: 100%; height: 100%; }
  .pll__room { -webkit-mask-image: linear-gradient(to bottom, #000 var(--y0), transparent calc(var(--y0) + var(--f)), transparent calc(var(--y1) - var(--f)), #000 var(--y1));
    mask-image: linear-gradient(to bottom, #000 var(--y0), transparent calc(var(--y0) + var(--f)), transparent calc(var(--y1) - var(--f)), #000 var(--y1)); }
  .pl-go .pll__a { animation: pl-in calc(var(--pl-k, 1) * 200ms) linear forwards; }
  .pl-go .pll__room { animation: pll-room calc(var(--pl-k, 1) * 500ms) steps(5, end) calc(var(--pl-k, 1) * 150ms) forwards; }
  .pl-go .pll__z { animation: pl-flick calc(var(--pl-k, 1) * 420ms) steps(1) forwards; }
  .pl-go .pll__z--1 { animation-delay: calc(var(--pl-k, 1) * 30ms); } .pl-go .pll__z--3 { animation-delay: calc(var(--pl-k, 1) * 80ms); } .pl-go .pll__z--2 { animation-delay: calc(var(--pl-k, 1) * 120ms); }
  .pl-go .pll__z--5 { animation-delay: calc(var(--pl-k, 1) * 160ms); } .pl-go .pll__z--4 { animation-delay: calc(var(--pl-k, 1) * 200ms); }
  .pl__logo { position: relative; z-index: 1; width: min(430px, 74vw); margin-top: var(--pl-logo-y, clamp(96px, 24vh, 260px)); opacity: 0; }
  .pl-go .pl .pl__logo { animation: pl-in calc(var(--pl-k, 1) * 240ms) ease-out calc(var(--pl-k, 1) * 380ms) forwards; }
  .pl-solo .pl .pl__logo { animation: pl-in 240ms ease-out forwards; }
  .pl__logo-img { display: block; width: 100%; height: auto; opacity: 0; transition: opacity 240ms ease-out; filter: drop-shadow(0 0 26px rgba(255, 255, 255, .30)) drop-shadow(0 0 3px rgba(255, 255, 255, .35)); }
  .pl-logo .pl__logo-img { opacity: 1; }
  .pl__shine { position: absolute; inset: 0; pointer-events: none; visibility: hidden; -webkit-mask: url("img/msd-logo-clean-mask-430.webp") center / contain no-repeat; mask: url("img/msd-logo-clean-mask-430.webp") center / contain no-repeat;
    background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .95) 50%, transparent 58%); background-size: 260% 100%; background-position: 130% 0; }
  .pl-logo .pl__shine { visibility: visible; }
  .pl-go .pl .pl__shine { animation: pl-sweep calc(var(--pl-k, 1) * 340ms) cubic-bezier(.4, 0, .2, 1) calc(var(--pl-k, 1) * 560ms) forwards; }
  .pl-solo .pl .pl__shine { animation: pl-sweep 340ms cubic-bezier(.4, 0, .2, 1) 180ms forwards; }
  .pl__tag { position: relative; z-index: 1; margin: 0; padding-left: .55em; font-family: var(--font-eyebrow); font-size: 12px; letter-spacing: .55em; text-transform: uppercase; color: var(--dim); opacity: 0; }
  @media (max-width: 419.98px) { .pl__tag { letter-spacing: .3em; padding-left: .3em; } }
  .pl-go .pl .pl__tag { animation: pl-in calc(var(--pl-k, 1) * 200ms) ease-out calc(var(--pl-k, 1) * 520ms) forwards; }
  .pl-solo .pl .pl__tag { animation: pl-in 200ms ease-out 140ms forwards; }
  .pl__hint { position: absolute; z-index: 1; bottom: 26px; left: 0; right: 0; margin: 0; text-align: center; font-family: var(--font-eyebrow); font-size: 11px; letter-spacing: .2em;
    text-transform: uppercase; color: #6f7477; opacity: 0; animation: pl-in calc(var(--pl-k, 1) * 300ms) ease-out calc(var(--pl-k, 1) * 300ms) forwards; }
}

@keyframes msd-hdr { to { opacity: 1; } }
@keyframes pl-flick { 0% { opacity: 0; } 30% { opacity: .7; } 45% { opacity: .1; } 60% { opacity: .9; } 75% { opacity: .3; } 100% { opacity: 1; } }
@keyframes pl-in { to { opacity: 1; } }
@keyframes pll-room { from { opacity: 0; } to { opacity: 1; } }
@keyframes pl-sweep { to { background-position: -30% 0; } }
@keyframes pl-out { to { transform: translateY(-100%); visibility: hidden; pointer-events: none; } }
@keyframes pl-skip { to { transform: translateY(-100%); visibility: hidden; pointer-events: none; } }
@keyframes pl-safe { to { transform: translateY(-100%); visibility: hidden; pointer-events: none; } }

@layer utilities {
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    .pl-run .pl[hidden] { display: none; }
  }
  @media print { .pl-run .pl[hidden] { display: none; } }
  @media (forced-colors: active) { .btn, .slot span, .reach, .svc__item, .fact { border: 1px solid CanvasText; } .hero__facts::before, .fact::before, .fact::after { background: CanvasText; } }
}

@layer components {
  .rate { --rv: 4.7; --rs: 14px; --rg: 2px; color: var(--text); }
  .rate__v { font-family: var(--f-display); font-weight: 700; line-height: 1; white-space: nowrap; }
  .rate__stars { position: relative; display: flex; flex: none; gap: var(--rg); width: calc(5 * var(--rs) + 4 * var(--rg)); height: var(--rs); }
  .rate__on { position: absolute; left: 0; top: 0; display: flex; gap: var(--rg); width: calc(var(--rv) * var(--rs) + 4 * var(--rg)); height: 100%; overflow: hidden; }
  .rate__s { flex: none; width: var(--rs); height: var(--rs); fill: none; stroke: currentColor; color: var(--line-4); }
  .rate__on .rate__s { fill: currentColor; color: var(--text); }
  .rate__src { min-width: 0; }
  .rate:hover .rate__src { text-decoration: underline 1px var(--red-ink); text-underline-offset: 4px; }

  .meta__item--rate { grid-column: 1 / -1; display: block; padding: 0; transition: border-color var(--dur-fast) linear; }
  .meta__item--rate:hover { border-color: var(--line-4); }
  .meta .rate { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 8px 10px; }
  .meta .rate__v { font-size: clamp(18px, 5.6vw, 22px); }
  .meta .rate__src { margin-left: auto; text-align: right; font-size: 11px; font-weight: 600; letter-spacing: .1em; line-height: 1.35; text-transform: uppercase; color: var(--red-ink); }

  .cta__list .cta__rate { display: block; }
  .cta__list .rate { --rs: 16px; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; row-gap: 3px; margin-block: -4px; padding-block: 4px; }
  .cta__list .rate__v { grid-row: 1 / span 2; font-size: 18px; }
  .cta__list .rate__stars, .cta__list .rate__src { grid-column: 2; }
  .cta__list .rate__src { font-size: 12px; color: var(--text-3); }

  @media (min-width: 768px) {
    .meta .rate { min-height: 44px; padding: 0; }
    .meta .rate__src { margin-left: 0; }
  }
}
