/* =========================================================================
   «Спица» — bicycles, scooters, rental and a workshop.

   Retro sport branding of the 70s–80s: livery stripes (ultramarine, yellow,
   red) as on a team jersey, a full-screen photo of an empty road, a slanted
   condensed grotesque «at speed», capsules instead of boxes, wheels that turn
   with the scroll. No lines, no shadows, no paper. Loaded after the parent's
   theme, blocks and chrome styles and the modules' styles: it remaps the
   parent's tokens, then dresses the chrome, the shared blocks, its own blocks
   and the shop.

   1. Fonts   2. Design settings   3. Tokens   4. Base   5. Buttons & forms
   6. Header   7. Footer   8. Section heads & dividers   9. Own blocks
   10. Shared blocks   11. Shop   12. Variants   13. Motion
   ========================================================================= */

/* 1. Fonts — Fira Sans Extra Condensed and Rubik ship with the template (OFL,
   licences in assets/fonts); Onest, Manrope, Inter and Unbounded are the parent's. */
@font-face { font-family: 'Spitsa Fira'; font-style: italic; font-display: swap; font-weight: 800; src: url(../fonts/fira-sans-extra-condensed-cyrillic-800-italic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Fira'; font-style: italic; font-display: swap; font-weight: 800; src: url(../fonts/fira-sans-extra-condensed-latin-800-italic.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Fira'; font-style: italic; font-display: swap; font-weight: 600; src: url(../fonts/fira-sans-extra-condensed-cyrillic-600-italic.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Fira'; font-style: italic; font-display: swap; font-weight: 600; src: url(../fonts/fira-sans-extra-condensed-latin-600-italic.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Fira'; font-style: normal; font-display: swap; font-weight: 600; src: url(../fonts/fira-sans-extra-condensed-cyrillic-600-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Fira'; font-style: normal; font-display: swap; font-weight: 600; src: url(../fonts/fira-sans-extra-condensed-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Rubik'; font-style: normal; font-display: swap; font-weight: 300 900; src: url(../fonts/rubik-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Rubik'; font-style: normal; font-display: swap; font-weight: 300 900; src: url(../fonts/rubik-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Onest'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/onest-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Onest'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/onest-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Manrope'; font-style: normal; font-display: swap; font-weight: 200 800; src: url(/themes/default/assets/fonts/manrope-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Manrope'; font-style: normal; font-display: swap; font-weight: 200 800; src: url(/themes/default/assets/fonts/manrope-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Inter'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/inter-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Inter'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/themes/default/assets/fonts/inter-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Spitsa Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(/themes/default/assets/fonts/unbounded-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Spitsa Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(/themes/default/assets/fonts/unbounded-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* 2. The owner's design settings (theme.json → design.controls). Core
   prints the chosen values as :root{--spitsa-…} after this file. */
:root {
    --spitsa-ultra: #1B3FD6;
    --spitsa-sun: #FFD320;
    --spitsa-red: #E5322D;
    --spitsa-font-display: 'Spitsa Fira', 'Arial Narrow', Impact, sans-serif;
    --spitsa-font-ui: 'Spitsa Rubik', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
    --spitsa-radius: 24px;
}

/* 3. Tokens. */
html.spitsa {
    --sp-ultra: var(--spitsa-ultra);
    --sp-ultra-2: color-mix(in srgb, var(--sp-ultra) 80%, #000);
    --sp-sun: var(--spitsa-sun);
    --sp-red: var(--spitsa-red);
    --sp-white: #fff;
    --sp-ink: #0B0D18;
    --sp-tint: #EEF1FD;
    --sp-ink-2: color-mix(in srgb, var(--sp-ink) 74%, #fff);
    --sp-ink-3: color-mix(in srgb, var(--sp-ink) 52%, #fff);
    --sp-line: color-mix(in srgb, var(--sp-ultra) 14%, transparent);
    --sp-r: var(--spitsa-radius);
    --sp-gap: clamp(1rem, 0.6rem + 1.6vw, 2rem);
    --sp-italic: italic;

    --paper: var(--sp-tint);
    --c-bg: var(--sp-tint);
    --c-surface: var(--sp-white);
    --c-surface-sunk: #e2e7fb;
    --c-text: var(--sp-ink);
    --c-text-strong: var(--sp-ink);
    --c-text-muted: var(--sp-ink-2);
    --c-text-faint: var(--sp-ink-3);
    --c-border: var(--sp-line);
    --c-border-strong: color-mix(in srgb, var(--sp-ultra) 40%, transparent);
    --c-accent: var(--sp-ultra);
    --c-accent-hover: var(--sp-ultra-2);
    --c-accent-soft: color-mix(in srgb, var(--sp-ultra) 10%, transparent);
    --c-accent-contrast: #fff;
    --c-link: var(--sp-ultra);
    --c-link-hover: var(--sp-ultra-2);
    --c-mark: var(--sp-ultra);
    --c-mark-text: var(--sp-ultra);
    --c-mark-soft: color-mix(in srgb, var(--sp-ultra) 10%, transparent);
    --c-slab: var(--sp-ultra);
    --c-slab-text: #fff;
    --c-slab-muted: #d5dcff;
    --c-danger: #b3261e;
    --c-success: #1f6b44;

    --font-ui: var(--spitsa-font-ui);
    --font-display: var(--spitsa-font-display);
    --font-prose: var(--spitsa-font-ui);
    --fw-heading: 800;
    --tr-tight: 0;
    --tr-snug: 0;
    --r-xs: 12px;
    --r-sm: 16px;
    --r-md: 20px;
    --r-lg: var(--sp-r);
    --r-btn: 999px;
    --card-radius: var(--sp-r);
    --card-bg: var(--sp-white);
    --card-border: 0;
    --w-container: 70rem;
    --w-wide: 84rem;
    --shadow-lift: none;
    color-scheme: light;
}
html.spitsa[data-spitsa-slant="off"] { --sp-italic: normal; }

/* Section tones: soft = the light tint, dark/primary = ultramarine, accent = yellow. */
.spitsa .cms-tone-soft { --section-bg: #e2e7fb; --c-bg: #e2e7fb; --c-surface: var(--sp-white); }
.spitsa .cms-tone-dark,
.spitsa .cms-tone-primary,
.spitsa .cms-on-dark {
    --c-bg: var(--sp-ultra); --c-surface: color-mix(in srgb, var(--sp-ultra) 82%, #fff 12%); --c-surface-sunk: var(--sp-ultra-2);
    --c-text: #eef1ff; --c-text-strong: #fff; --c-text-muted: #d5dcff; --c-text-faint: #b0bcf7;
    --c-border: rgb(255 255 255 / 0.28); --c-border-strong: rgb(255 255 255 / 0.5);
    --c-link: var(--sp-sun); --c-link-hover: #fff;
    --c-accent: var(--sp-sun); --c-accent-hover: #ffe36a; --c-accent-contrast: var(--sp-ink);
    color-scheme: dark;
}
.spitsa .cms-tone-dark, .spitsa .cms-tone-primary { --section-bg: var(--sp-ultra); }
.spitsa .cms-tone-accent {
    --section-bg: var(--sp-sun); --c-bg: var(--sp-sun); --c-surface: #fff;
    --c-text: var(--sp-ink); --c-text-strong: var(--sp-ink); --c-text-muted: #3c3a22; --c-text-faint: #5a5636;
    --c-accent: var(--sp-ultra); --c-accent-hover: var(--sp-ultra-2); --c-accent-contrast: #fff;
}
.spitsa .cms-on-light { --c-bg: var(--sp-tint); --c-surface: var(--sp-white); }

/* 4. Base */
html.spitsa,
.spitsa body { background: var(--sp-tint); color: var(--sp-ink); }
.spitsa body { font-family: var(--font-ui); -webkit-font-smoothing: antialiased; overflow-x: clip; }
.spitsa ::selection { background: var(--sp-sun); color: var(--sp-ink); }
.spitsa :focus-visible { outline: 3px solid var(--sp-sun); outline-offset: 3px; border-radius: 12px; box-shadow: 0 0 0 6px var(--sp-ultra); }

.spitsa h1, .spitsa h2, .spitsa h3,
.spitsa .cms-section__title { font-family: var(--font-display); font-weight: var(--fw-heading); font-style: var(--sp-italic); line-height: 0.92; color: var(--c-text-strong); text-wrap: balance; }
.spitsa h1, .spitsa h2, .spitsa .cms-section__title { text-transform: uppercase; }
.spitsa h3 { font-weight: 600; line-height: 1; }

.sp-wrap { width: 100%; max-width: var(--w-wide); margin-inline: auto; padding-inline: var(--gutter); }
.sp-eyebrow {
    display: inline-flex; align-items: center; margin: 0 0 var(--s-5); padding: 0.4rem 1.1rem; border-radius: 999px;
    background: var(--sp-sun); color: var(--sp-ink); font: 600 0.95rem/1 var(--font-display); font-style: var(--sp-italic); letter-spacing: 0.08em; text-transform: uppercase;
}
.sp-link { color: var(--c-text-strong); font-weight: 600; text-decoration: none; padding: 0.3rem 1rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); display: inline-block; transition: transform 160ms var(--ease); }
.sp-link:hover { transform: translateX(4px); color: var(--sp-ink); }
.sp-pill { display: inline-flex; align-items: center; min-height: 52px; padding: 0.5rem 1.6rem; border-radius: 999px; background: rgb(255 255 255 / 0.94); color: var(--sp-ink); font: 800 1.25rem/1 var(--font-display); font-style: var(--sp-italic); text-transform: uppercase; letter-spacing: 0.04em; text-decoration: none; transition: background-color 160ms var(--ease), transform 160ms var(--ease); }
.sp-pill.is-first { background: var(--sp-sun); }
a.sp-pill:hover { background: var(--sp-ultra); color: #fff; transform: translateY(-3px); }

/* 5. Buttons and forms: round, flat. */
.spitsa .cms-btn {
    min-height: 52px; padding: 0.7rem 1.8rem; border-radius: 999px; border: 0;
    font-family: var(--font-display); font-style: var(--sp-italic); font-size: 1.2rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; box-shadow: none;
    transition: background-color 160ms var(--ease), color 160ms var(--ease), transform 160ms var(--ease);
}
.spitsa .cms-btn--primary { background: var(--sp-sun); color: var(--sp-ink); }
.spitsa .cms-btn--primary:hover { background: var(--sp-ultra); color: #fff; transform: translateY(-3px); }
.spitsa .cms-tone-dark .cms-btn--primary:hover, .spitsa .cms-tone-primary .cms-btn--primary:hover { background: #fff; color: var(--sp-ultra); }
.spitsa .cms-btn--ghost { background: transparent; box-shadow: inset 0 0 0 3px currentColor; color: var(--c-text-strong); }
.spitsa .cms-btn--ghost:hover { background: var(--c-text-strong); color: var(--c-bg); }
.spitsa .cms-btn--link { padding-inline: 0.5rem; }

.spitsa .cms-form__label { font: 500 0.9rem/1.3 var(--font-ui); color: var(--c-text-muted); }
.spitsa .cms-form__input,
.spitsa input[type="text"], .spitsa input[type="tel"], .spitsa input[type="email"], .spitsa input[type="number"], .spitsa select, .spitsa textarea {
    min-height: 54px; background: var(--sp-white); border: 3px solid transparent; border-radius: 28px; color: var(--sp-ink); padding-inline: 1.3rem;
}
.spitsa textarea.cms-form__input { border-radius: 24px; }
.spitsa .cms-form__input:focus { border-color: var(--sp-sun); outline: none; box-shadow: 0 0 0 4px var(--sp-ultra); }
.spitsa .cms-form__input::placeholder { color: var(--sp-ink-3); }
.spitsa .cms-form__req { color: var(--sp-red); }
.spitsa .cms-form__check input { accent-color: var(--sp-ultra); }
.spitsa .cms-form__success { border-radius: 24px; background: var(--sp-sun); border: 0; color: var(--sp-ink); }

/* 6. Header: a white capsule floating over the page; a slim ultramarine strip above it. */
.sp-hdr.site-header { position: relative; background: transparent; color: var(--sp-ink); border-bottom: 0; z-index: 40; }
.sp-hdr.site-header--sticky { position: sticky; top: 0; }
.sp-hdr .hdr-row__inner { max-width: var(--w-wide); }
.sp-hdr .hdr-row--top { background: var(--sp-ultra); color: #fff; border-bottom: 0; font: 500 0.82rem/1.2 var(--font-ui); }
.sp-hdr .hdr-row--top a { color: inherit; text-decoration: none; }
.sp-hdr .hdr-row--top a:hover { color: var(--sp-sun); }
.sp-hdr .hdr-row--top .hdr-text:last-child { color: var(--sp-sun); font-weight: 600; }
.sp-hdr .hdr-row--main { padding-block: 0.7rem; background: transparent; border: 0; }
.sp-hdr .hdr-row--main .hdr-row__inner {
    min-height: 68px; margin-inline: auto; padding: 0.3rem 0.8rem 0.3rem 1.3rem; width: calc(100% - 2 * var(--gutter));
    background: var(--sp-white); border-radius: 999px;
}
@media (max-width: 720px) { .sp-hdr .hdr-row--main .hdr-row__inner { width: calc(100% - 1.25rem); padding-inline: 1rem 0.5rem; } }

.sp-hdr .hdr-logo, .sp-drawer .hdr-logo { color: var(--sp-ultra); gap: 0.5rem; text-decoration: none; }
.sp-hdr .hdr-logo__name,
.sp-drawer .hdr-logo__name,
.sp-ftr .sp-ftr__name { font-family: var(--font-display); font-style: italic; font-size: 2rem; font-weight: 800; letter-spacing: 0.02em; text-transform: uppercase; line-height: 1; }
.sp-logo .sp-mark, .sp-ftr__mark { width: 38px; height: 38px; flex: none; color: var(--sp-ultra); }
.sp-hdr .hdr-logo__tagline { font: 500 0.7rem/1.2 var(--font-ui); color: var(--sp-ink-3); }

.sp-hdr .hdr-nav__link { font-family: var(--font-display); font-style: italic; font-size: 1.15rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; padding-inline: 1rem; color: var(--sp-ink); border-radius: 999px; transition: background-color 160ms var(--ease), color 160ms var(--ease); }
.sp-hdr .hdr-nav__link:hover,
.sp-hdr .hdr-nav__item:hover > .hdr-nav__link { background: var(--sp-ultra); color: #fff; }
.sp-hdr .hdr-nav__link.is-active,
.sp-hdr .hdr-nav__link[aria-current="page"] { background: var(--sp-sun); color: var(--sp-ink); }
.sp-hdr .hdr-sub { background: var(--sp-white); border: 0; border-radius: 24px; box-shadow: 0 18px 40px -24px rgb(11 13 24 / 0.5); padding: 0.5rem; }
.sp-hdr .hdr-sub__link { color: var(--sp-ink); border-radius: 999px; font-size: 0.95rem; }
.sp-hdr .hdr-sub__link:hover { background: var(--sp-ultra); color: #fff; }
.sp-hdr .hdr-phone__number { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 1.4rem; letter-spacing: 0.02em; color: var(--sp-ultra); }
.sp-hdr .hdr-phone__caption { color: var(--sp-ink-3); }
.sp-hdr .hdr-button, .sp-hdr .hdr-el--button .cms-btn { white-space: nowrap; min-height: 46px; padding: 0.4rem 1.3rem; }
.sp-hdr .hdr-burger, .sp-hdr .hdr-icon-btn { color: var(--sp-ultra); }

.sp-drawer.hdr-drawer { background: var(--sp-ultra); color: #fff; border-radius: 32px 0 0 32px; }
.sp-drawer .hdr-logo { color: #fff; }
.sp-drawer .hdr-dmenu__link { font-family: var(--font-display); font-style: italic; font-size: 2rem; font-weight: 800; text-transform: uppercase; color: #fff; }
.sp-drawer .hdr-drawer__phone { color: var(--sp-sun); }
.sp-drawer .hdr-drawer__line { color: #d5dcff; }

html.spitsa[data-spitsa-header="flat"] .sp-hdr.site-header { background: var(--sp-ultra); }
html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-row--main .hdr-row__inner { background: transparent; width: auto; border-radius: 0; }
html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-logo, html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-nav__link, html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-phone__number { color: #fff; }
html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-burger, html.spitsa[data-spitsa-header="flat"] .sp-hdr .hdr-icon-btn { color: #fff; }
html.spitsa[data-spitsa-header="flat"] .sp-logo .sp-mark { color: #fff; }

/* 7. Footer: ultramarine, with a row of wheels rolling along its edge. */
.sp-ftr.site-footer {
    position: relative; margin-top: clamp(5rem, 9vw, 8rem); padding-top: 0;
    background: var(--sp-ultra); color: #d5dcff; border-top: 0;
    --c-text: #eef1ff; --c-text-strong: #fff; --c-border: rgb(255 255 255 / 0.28);
}
.sp-ftr__wheels { position: absolute; right: clamp(1rem, 8vw, 8rem); bottom: 100%; display: flex; gap: clamp(1rem, 4vw, 3.5rem); pointer-events: none; }
.sp-ftr__wheel { display: block; width: clamp(54px, 8vw, 96px); aspect-ratio: 1; margin-bottom: -4px; background: url(../img/wheel.svg) center / contain no-repeat; }
.sp-ftr__wheel:nth-child(2) { width: clamp(40px, 6vw, 72px); }
html.spitsa[data-spitsa-wheels="off"] .sp-ftr__wheels { display: none; }
.sp-ftr::after { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 36px; transform: translateY(-100%); pointer-events: none; opacity: 0; }
.sp-ftr__band { padding-block: var(--s-7); border-bottom: 0; }
.sp-ftr__band-inner { display: grid; gap: var(--s-5); align-items: center; padding: var(--s-6); background: var(--sp-sun); color: var(--sp-ink); border-radius: var(--sp-r); }
@media (min-width: 860px) { .sp-ftr__band-inner { grid-template-columns: 1fr 1.2fr; } }
.sp-ftr__band-title { font-size: var(--t-xl); color: var(--sp-ink); }
.sp-ftr__band-lead { margin: 0.5rem 0 0; color: var(--sp-ink); }
.sp-ftr__main { display: grid; gap: var(--s-7); padding-block: var(--s-8) var(--s-7); }
@media (min-width: 960px) { .sp-ftr__main { grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr); } }
.sp-ftr__brand { display: inline-flex; align-items: center; gap: 0.6rem; color: #fff; text-decoration: none; }
.sp-ftr__mark { color: #fff; }
.sp-ftr__name { font-size: 2.4rem; color: #fff; }
.sp-ftr__lead { margin-top: var(--s-4); max-width: 30rem; line-height: 1.65; }
.sp-ftr__grid { display: grid; gap: var(--s-6); grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.sp-ftr__title { display: inline-block; margin: 0 0 var(--s-4); padding: 0.25rem 0.9rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); font: 800 1rem/1.2 var(--font-display); font-style: italic; letter-spacing: 0.06em; text-transform: uppercase; }
.sp-ftr__title--about { background: none; padding: 0; color: #fff; font-size: var(--t-lg); }
.sp-ftr__menu { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.sp-ftr__menu a { color: #fff; text-decoration: none; }
.sp-ftr__menu a:hover { color: var(--sp-sun); }
.sp-ftr__contacts { font-style: normal; display: grid; gap: 0.5rem; }
.sp-ftr__phone a { font-family: var(--font-display); font-style: italic; font-size: 2.3rem; font-weight: 800; color: var(--sp-sun); text-decoration: none; line-height: 1; }
.sp-ftr__phone span { display: block; font-size: var(--t-xs); color: #b0bcf7; }
.sp-ftr__line a { color: #fff; }
.sp-ftr__line--muted { color: #b0bcf7; }
.sp-ftr__socials { margin-top: var(--s-5); }
.sp-ftr .site-socials__link { background: rgb(255 255 255 / 0.16); color: #fff; border-radius: 999px; }
.sp-ftr .site-socials__link:hover { background: var(--sp-sun); color: var(--sp-ink); }
.sp-ftr__bottom { padding-block: var(--s-5); font-size: var(--t-xs); color: #b0bcf7; }
.sp-ftr__bottom-inner { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); align-items: center; }
.sp-ftr__links { display: flex; flex-wrap: wrap; gap: var(--s-4); list-style: none; margin: 0; padding: 0; }
.sp-ftr__links a { color: #fff; }
.sp-ftr__copy, .sp-ftr__company { margin: 0; }
.sp-ftr .site-footer__slot { margin-left: auto; }
.sp-ftr__pay { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; margin: 0; padding: 0; }
.sp-ftr__pay-item { border-radius: 999px; background: rgb(255 255 255 / 0.16); padding: 0.2rem 0.8rem; font-size: var(--t-xs); }

/* 8. Section heads: three livery ribbons over a slanted title, a wheel at the end. */
.spitsa .cms-section__head { position: relative; max-width: none; margin-block-end: clamp(1.75rem, 1rem + 2.5vw, 3rem); padding-top: 3.2rem; padding-right: 5.5rem; }
.spitsa .cms-section__head::before {
    content: ''; position: absolute; left: 0; top: 0; width: clamp(7rem, 16vw, 13rem); height: 34px; transform: skewX(-20deg); transform-origin: left center;
    background: linear-gradient(to bottom, var(--sp-ultra) 0 10px, transparent 10px 12px, var(--sp-sun) 12px 22px, transparent 22px 24px, var(--sp-red) 24px 34px);
}
.spitsa .cms-tone-dark .cms-section__head::before, .spitsa .cms-tone-primary .cms-section__head::before {
    background: linear-gradient(to bottom, #fff 0 10px, transparent 10px 12px, var(--sp-sun) 12px 22px, transparent 22px 24px, var(--sp-red) 24px 34px);
}
html.spitsa[data-spitsa-stripes="off"] .cms-section__head::before { display: none; }
html.spitsa[data-spitsa-stripes="off"] .cms-section__head { padding-top: 0; }
.spitsa .cms-section__head::after { content: ''; position: absolute; right: 0; top: 0.9rem; width: 68px; height: 68px; background: url(../img/wheel.svg) center / contain no-repeat; }
.spitsa .cms-tone-dark .cms-section__head::after, .spitsa .cms-tone-primary .cms-section__head::after { background-image: url(../img/wheel-white.svg); }
html.spitsa[data-spitsa-wheels="off"] .cms-section__head::after { display: none; }
.spitsa .cms-section__head--center { margin-inline: auto; text-align: center; }
.spitsa .cms-section__head--center::before { left: 50%; margin-left: -4rem; }
.spitsa .cms-section__title { font-size: clamp(2.75rem, 1.2rem + 5vw, 6.2rem); }
.spitsa h1.cms-section__title { font-size: clamp(3.5rem, 1.5rem + 7vw, 8rem); }
.spitsa .cms-section__subtitle { margin-top: 1rem; font-size: var(--t-md); color: var(--c-text-muted); max-width: 42rem; line-height: 1.6; }
.spitsa .cms-section__head--center .cms-section__subtitle { margin-inline: auto; }
html.spitsa[data-spitsa-density="airy"] .cms-section { --section-pad: clamp(3.5rem, 2rem + 5vw, 7rem); }

/* 9. Own blocks ---------------------------------------------------------- */

/* 9.1 First screen: the road, three stripes, the huge slanted title. */
.sp-hero { position: relative; isolation: isolate; display: flex; min-height: clamp(34rem, 86svh, 56rem); overflow: clip; background: var(--sp-ultra); color: #fff; }
.sp-hero__bg { position: absolute; inset: 0; z-index: -3; margin: 0; }
.sp-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 40% 60%; display: block; transform: scaleX(-1); }
.sp-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgb(11 13 24 / 0.72) 0%, rgb(11 13 24 / 0.2) 55%, rgb(11 13 24 / 0.05) 100%); pointer-events: none; }
.sp-hero__stripes { position: absolute; left: -10%; width: 120%; top: 52%; z-index: -2; display: grid; gap: 5px; transform: rotate(-12deg); transform-origin: left center; pointer-events: none; }
.sp-hero__stripes i { display: block; height: 10px; transform-origin: left center; }
.sp-hero__stripes i:nth-child(1) { background: var(--sp-ultra); }
.sp-hero__stripes i:nth-child(2) { background: var(--sp-sun); }
.sp-hero__stripes i:nth-child(3) { background: var(--sp-red); }
html.spitsa[data-spitsa-stripes="off"] .sp-hero__stripes { display: none; }
.sp-hero__inner { align-self: flex-end; width: 100%; max-width: var(--w-wide); margin-inline: auto; padding: clamp(5rem, 14vw, 9rem) var(--gutter) clamp(1.75rem, 4vw, 3.25rem); }
.spitsa .sp-hero__title { margin: 0; max-width: 11ch; font-size: clamp(4.5rem, 1rem + 11vw, 11.5rem); font-weight: 800; line-height: 0.86; color: #fff; overflow-wrap: break-word; }
.sp-hero__lead { margin: var(--s-4) 0 0; max-width: 34rem; font-size: var(--t-md); line-height: 1.5; color: #fff; }
.sp-hero__actions { margin-top: var(--s-5); display: flex; flex-wrap: wrap; gap: var(--s-3); }
.sp-hero__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-6); margin-top: var(--s-6); }
.sp-hero__tabs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.sp-hero__facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.sp-hero__facts li { padding: 0.5rem 1rem; border-radius: 999px; background: var(--sp-ultra); font-size: 0.9rem; color: #fff; }
.sp-hero__facts b { font: 800 1.25rem/1 var(--font-display); font-style: var(--sp-italic); color: var(--sp-sun); }
@media (max-width: 520px) {
    .sp-hero { min-height: 36rem; }
    .sp-hero__stripes { top: 40%; }
    .sp-hero__title { max-width: none; font-size: clamp(4.5rem, 22vw, 6rem); }
    .sp-pill { min-height: 46px; padding-inline: 1.15rem; font-size: 1.1rem; }
}

/* 9.2 Size guide: an ultramarine panel, a ruler of capsules. */
.spitsa .cms-block.sp-sizer { display: grid; gap: var(--s-5); padding: clamp(1.25rem, 3vw, 2.5rem); border-radius: var(--sp-r); background: var(--sp-ultra); color: #fff; }
.sp-sizer__tool { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-7); }
.sp-sizer__field { display: grid; gap: 0.5rem; }
.sp-sizer__label { font: 600 0.95rem/1.2 var(--font-ui); color: #d5dcff; }
.spitsa .sp-sizer__input { width: 7.5ch; min-height: 0; padding: 0.15rem 1.4rem; border: 0; border-radius: 999px; background: #fff; color: var(--sp-ink); font-family: var(--font-display); font-style: var(--sp-italic); font-size: clamp(3rem, 2rem + 5vw, 5.5rem); font-weight: 800; line-height: 1.1; -moz-appearance: textfield; }
.sp-sizer__input::-webkit-outer-spin-button, .sp-sizer__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.spitsa .sp-sizer__input:focus { box-shadow: 0 0 0 5px var(--sp-sun); border: 0; }
.sp-sizer__result { margin: 0; padding: 0.4rem 1.4rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); font: 800 clamp(1.6rem, 1.1rem + 1.6vw, 2.6rem)/1.1 var(--font-display); font-style: var(--sp-italic); text-transform: uppercase; }
.sp-sizer__result[hidden] { display: none; }
.sp-sizer__result.is-out { background: var(--sp-red); color: #fff; font-size: 1.05rem; font-family: var(--font-ui); font-style: normal; text-transform: none; font-weight: 500; }
.sp-sizer__scale { position: relative; display: flex; gap: 6px; height: 60px; margin-block: 0.8rem 1.4rem; }
.sp-sizer__seg { position: relative; flex: 1 1 0; display: flex; align-items: center; justify-content: center; border-radius: 999px; background: rgb(255 255 255 / 0.14); }
.sp-sizer__seg b { font: 800 1.7rem/1 var(--font-display); font-style: var(--sp-italic); }
.sp-sizer__seg i { position: absolute; left: 1.1rem; bottom: -1.2rem; font: 500 0.72rem/1 var(--font-ui); font-style: normal; color: #b0bcf7; }
.sp-sizer__end { position: relative; flex: 0 0 0; }
.sp-sizer__end i { position: absolute; right: 0; bottom: -1.2rem; font: 500 0.72rem/1 var(--font-ui); font-style: normal; color: #b0bcf7; }
.sp-sizer__mark { position: absolute; top: -10px; bottom: -10px; width: 12px; margin-left: -6px; border-radius: 999px; background: var(--sp-sun); transition: left 220ms var(--ease); }
.sp-sizer__mark::after { content: attr(data-h); position: absolute; left: 50%; top: -1.9rem; transform: translateX(-50%); padding: 0.1rem 0.6rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); font: 800 0.95rem/1.3 var(--font-display); font-style: var(--sp-italic); }
.sp-sizer__table { width: 100%; border-collapse: separate; border-spacing: 0 6px; }
.sp-sizer__table th, .sp-sizer__table td { padding: 0.75rem 1rem; text-align: left; background: rgb(255 255 255 / 0.1); }
.sp-sizer__table thead th { background: none; padding-block: 0.2rem; font: 500 0.8rem/1.2 var(--font-ui); color: #b0bcf7; }
.sp-sizer__table tbody th { border-radius: 0; font: 800 1.6rem/1 var(--font-display); font-style: var(--sp-italic); }
.sp-sizer__table tbody td { color: #eef1ff; }
.sp-sizer__table tbody td:first-child { padding-left: 1.4rem; border-radius: 999px 0 0 999px; }
.sp-sizer__table tbody td:last-child { border-radius: 0 999px 999px 0; }
.sp-sizer__table tbody tr { transition: transform 160ms var(--ease); }
.sp-sizer__table tbody tr.is-match { transform: scale(1.015); }
.sp-sizer__table tbody tr.is-match th, .sp-sizer__table tbody tr.is-match td { background: var(--sp-sun); color: var(--sp-ink); }
.sp-sizer__note { margin: 0; max-width: 44rem; color: #d5dcff; font-size: var(--t-sm); }
@media (max-width: 639px) {
    .sp-sizer__table thead { display: none; }
    .sp-sizer__table, .sp-sizer__table tbody { display: block; }
    .sp-sizer__table tbody tr { display: grid; grid-template-columns: 4.2rem 1fr; gap: 0 0.5rem; margin-bottom: 8px; padding: 0.55rem 0.4rem; border-radius: 24px; background: rgb(255 255 255 / 0.1); }
    .sp-sizer__table th, .sp-sizer__table td { background: none !important; border-radius: 0 !important; padding: 0.05rem 0.4rem; }
    .sp-sizer__table tbody tr.is-match { background: var(--sp-sun); }
    .sp-sizer__table tbody th { grid-row: span 3; align-self: center; font-size: 2.2rem; }
    .sp-sizer__seg b { font-size: 1.2rem; }
    .sp-sizer__seg i { display: none; }
}

/* 9.3 Group rides: ultramarine start sheets with a number plate. */
.sp-rides__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); }
.sp-ride { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--sp-r); background: var(--sp-ultra); color: #fff; }
.sp-ride__body { display: flex; flex-direction: column; gap: 0.8rem; padding: 1.4rem; flex: 1; }
.sp-ride__no { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0; }
.sp-ride__no span { padding: 0.05rem 1rem; border-radius: 18px; background: #fff; color: var(--sp-ink); font: 800 3.4rem/1.05 var(--font-display); font-style: var(--sp-italic); }
.sp-ride__no time { padding: 0.35rem 0.9rem; border-radius: 999px; background: rgb(255 255 255 / 0.16); font: 500 0.82rem/1.2 var(--font-ui); text-align: right; }
.sp-ride__title { margin: 0.2rem 0 0; font-size: clamp(2rem, 1.5rem + 1.4vw, 2.8rem); font-weight: 800; font-style: var(--sp-italic); text-transform: uppercase; color: #fff; }
.sp-ride__text { margin: 0; color: #d5dcff; font-size: 0.96rem; line-height: 1.5; }
.sp-ride__spec { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.2rem 0 0; }
.sp-ride__spec > div { padding: 0.45rem 1.1rem; border-radius: 999px; background: rgb(255 255 255 / 0.14); }
.sp-ride__spec dt { font: 500 0.66rem/1.2 var(--font-ui); color: #b0bcf7; }
.sp-ride__spec dd { margin: 0.1rem 0 0; font: 800 1.7rem/1 var(--font-display); font-style: var(--sp-italic); color: var(--sp-sun); }
.sp-ride__spec small { margin-left: 0.2em; font: 500 0.72rem var(--font-ui); color: #d5dcff; }
.sp-ride__spec .sp-ride__level { font-size: 1.2rem; text-transform: uppercase; padding-top: 0.2rem; }
.sp-ride--hard .sp-ride__spec > div:last-child { background: var(--sp-red); }
.sp-ride--hard .sp-ride__level { color: #fff; }
.sp-ride__profile { display: block; width: 100%; height: 64px; }
.sp-ride__area { fill: rgb(255 255 255 / 0.14); stroke: none; }
.sp-ride__line { fill: none; stroke: var(--sp-sun); stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.sp-ride__profile * { vector-effect: non-scaling-stroke; }
.sp-ride__facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.3rem; font-size: 0.9rem; color: #eef1ff; }
.sp-ride__facts li::before { content: '→ '; color: var(--sp-sun); }
.sp-ride__price { font-weight: 700; }
.sp-ride__more { margin: auto 0 0; padding-top: 0.5rem; }
.sp-ride--lead { grid-column: 1 / -1; }
@media (min-width: 820px) {
    .sp-ride--lead { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
    .sp-ride--lead .sp-ride__body { padding: 2rem; }
}
.sp-ride__photo { margin: 0; position: relative; min-height: 15rem; }
.sp-ride__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sp-rides__note { margin: var(--s-5) 0 0; max-width: 42rem; color: var(--c-text-muted); font-size: var(--t-sm); }

/* 9.4 Workshop price list: the stage protocol — yellow figures on ultramarine. */
.spitsa .cms-block.sp-prices { padding: clamp(1.25rem, 3vw, 2.5rem); border-radius: var(--sp-r); background: var(--sp-ultra); color: #fff; --c-text-strong: #fff; --c-text-muted: #d5dcff; }
.sp-prices__cols { display: grid; gap: var(--s-7) clamp(2rem, 5vw, 5rem); }
@media (min-width: 900px) { .sp-prices__cols { grid-template-columns: 1fr 1fr; } }
.sp-pgroup__title { display: flex; align-items: center; gap: 0.7rem; margin: 0 0 0.4rem; font-size: 2rem; font-weight: 800; font-style: var(--sp-italic); text-transform: uppercase; color: #fff; }
.sp-pgroup__title span { padding: 0.15rem 0.7rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); font: 800 1rem/1.2 var(--font-display); font-style: var(--sp-italic); }
.sp-pgroup__note { margin: 0 0 0.5rem; font-size: var(--t-sm); color: #d5dcff; }
.sp-pgroup__rows { list-style: none; margin: 0; padding: 0; }
.sp-prow { display: flex; align-items: baseline; gap: 0.6rem; padding: 0.75rem 0; }
.sp-prow__name { flex: 0 1 auto; max-width: 66%; font-weight: 500; line-height: 1.3; }
.sp-prow__name small { display: block; margin-top: 0.15rem; font-size: 0.8rem; font-weight: 400; color: #b0bcf7; }
.sp-prow__lead { flex: 1 1 1rem; min-width: 1rem; align-self: flex-end; margin-bottom: 0.4em; border-bottom: 3px dotted rgb(255 255 255 / 0.35); }
.sp-prow__time { flex: none; padding: 0.15rem 0.7rem; border-radius: 999px; background: rgb(255 255 255 / 0.16); font: 500 0.75rem/1.2 var(--font-ui); color: #eef1ff; }
.sp-prow__price { flex: none; min-width: 5rem; text-align: right; font: 800 1.9rem/1 var(--font-display); font-style: var(--sp-italic); color: var(--sp-sun); white-space: nowrap; }
.sp-prices__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4) var(--s-6); margin-top: var(--s-6); padding-top: var(--s-5); border-top: 3px dotted rgb(255 255 255 / 0.3); }
.sp-prices__note { margin: 0; max-width: 38rem; font-size: var(--t-sm); color: #d5dcff; }

/* 9.5 Catalogue index: starting numbers on capsule rows. */
.sp-types__grid { display: grid; gap: var(--s-6); }
@media (min-width: 960px) { .sp-types__grid { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); align-items: start; } }
.sp-types__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.sp-trow__link { display: grid; grid-template-columns: 5.2rem minmax(0, 1fr) auto auto 2rem; align-items: center; gap: 1rem; padding: 0.7rem 1.4rem 0.7rem 0.7rem; border-radius: 999px; background: var(--sp-ultra); color: #fff; text-decoration: none; transition: background-color 160ms var(--ease), color 160ms var(--ease), transform 160ms var(--ease); }
.sp-trow__link:hover, .sp-trow__link:focus-visible { background: var(--sp-sun); color: var(--sp-ink); transform: translateX(8px); }
.sp-trow__no { display: grid; place-items: center; height: 3.6rem; border-radius: 999px; background: #fff; color: var(--sp-ink); font: 800 2.1rem/1 var(--font-display); font-style: var(--sp-italic); }
.sp-trow__main b { display: block; font: 800 clamp(1.8rem, 1.2rem + 1.5vw, 2.5rem)/0.95 var(--font-display); font-style: var(--sp-italic); text-transform: uppercase; }
.sp-trow__main small { display: block; margin-top: 0.3rem; font-size: 0.85rem; color: #d5dcff; }
.sp-trow__link:hover small, .sp-trow__link:focus-visible small { color: var(--sp-ink); }
.sp-trow__count { font: 500 0.82rem/1 var(--font-ui); white-space: nowrap; opacity: 0.85; }
.sp-trow__price { padding: 0.35rem 1rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); font: 800 1.45rem/1.1 var(--font-display); font-style: var(--sp-italic); white-space: nowrap; }
.sp-trow__link:hover .sp-trow__price { background: var(--sp-ultra); color: #fff; }
.sp-trow__arrow { font-size: 1.5rem; transition: transform 160ms var(--ease); }
.sp-trow__link:hover .sp-trow__arrow { transform: translateX(4px); }
@media (max-width: 719px) {
    .sp-trow__link { grid-template-columns: 3.6rem minmax(0, 1fr) auto; gap: 0.7rem; padding: 0.5rem 1rem 0.5rem 0.5rem; border-radius: 36px; }
    .sp-trow__no { height: 2.8rem; font-size: 1.6rem; }
    .sp-trow__count, .sp-trow__arrow { display: none; }
    .sp-trow__price { font-size: 1.05rem; padding-inline: 0.7rem; }
    .sp-trow__main small { display: none; }
}
.sp-types__frame { display: none; }
@media (min-width: 960px) {
    .sp-types__frame { display: block; position: sticky; top: 7rem; aspect-ratio: 4 / 3; border-radius: var(--sp-r); overflow: hidden; background: var(--sp-ultra); }
    .sp-types__shot { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity 200ms var(--ease); }
    .sp-types__shot:first-child { opacity: 1; }
    .sp-types__shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .sp-types__grid:has(.sp-trow:hover) .sp-types__shot, .sp-types__grid:has(.sp-trow:focus-within) .sp-types__shot { opacity: 0; }
    .sp-types__grid:has(.sp-trow:nth-child(1):hover) .sp-types__shot:nth-child(1), .sp-types__grid:has(.sp-trow:nth-child(1):focus-within) .sp-types__shot:nth-child(1),
    .sp-types__grid:has(.sp-trow:nth-child(2):hover) .sp-types__shot:nth-child(2), .sp-types__grid:has(.sp-trow:nth-child(2):focus-within) .sp-types__shot:nth-child(2),
    .sp-types__grid:has(.sp-trow:nth-child(3):hover) .sp-types__shot:nth-child(3), .sp-types__grid:has(.sp-trow:nth-child(3):focus-within) .sp-types__shot:nth-child(3),
    .sp-types__grid:has(.sp-trow:nth-child(4):hover) .sp-types__shot:nth-child(4), .sp-types__grid:has(.sp-trow:nth-child(4):focus-within) .sp-types__shot:nth-child(4),
    .sp-types__grid:has(.sp-trow:nth-child(5):hover) .sp-types__shot:nth-child(5), .sp-types__grid:has(.sp-trow:nth-child(5):focus-within) .sp-types__shot:nth-child(5),
    .sp-types__grid:has(.sp-trow:nth-child(6):hover) .sp-types__shot:nth-child(6), .sp-types__grid:has(.sp-trow:nth-child(6):focus-within) .sp-types__shot:nth-child(6),
    .sp-types__grid:has(.sp-trow:nth-child(7):hover) .sp-types__shot:nth-child(7), .sp-types__grid:has(.sp-trow:nth-child(7):focus-within) .sp-types__shot:nth-child(7),
    .sp-types__grid:has(.sp-trow:nth-child(8):hover) .sp-types__shot:nth-child(8), .sp-types__grid:has(.sp-trow:nth-child(8):focus-within) .sp-types__shot:nth-child(8) { opacity: 1; }
}

/* 10. Shared blocks ------------------------------------------------------ */
.spitsa .cms-ptable__plan, .spitsa .cms-ptable, .spitsa .cms-card, .spitsa .cms-booking, .spitsa .cms-calc, .spitsa .cms-faq__item, .spitsa .cms-faq details { border-radius: var(--sp-r); border: 0; box-shadow: none; }
.spitsa .cms-ptable__plan { background: var(--sp-white); }
.spitsa .cms-ptable__plan--featured, .spitsa .cms-ptable__plan.is-featured { background: var(--sp-ultra); color: #fff; }
.spitsa .cms-ptable__price { font-family: var(--font-display); font-style: var(--sp-italic); font-weight: 800; font-size: 3rem; }
.spitsa .cms-ptable__plan--featured .cms-ptable__price { color: var(--sp-sun); }
.spitsa .cms-faq summary { font-family: var(--font-display); font-style: var(--sp-italic); font-weight: 600; text-transform: uppercase; font-size: 1.4rem; }
.spitsa .cms-stages__title, .spitsa .cms-stages__duration { font-family: var(--font-display); font-style: var(--sp-italic); }
.spitsa .cms-stages__number, .spitsa .cms-stages__num { border-radius: 999px; background: var(--sp-ultra); color: #fff; }
.spitsa .cms-block img { border-radius: var(--sp-r); }
.spitsa .cms-review { border-radius: 40px; background: var(--sp-red); color: #fff; border: 0; box-shadow: none; }
.spitsa .cms-review__text { font-size: 1.1rem; line-height: 1.4; color: #fff; }
.spitsa .cms-review__name { color: #fff; font-family: var(--font-display); font-style: italic; font-weight: 600; }
.spitsa .cms-review__role, .spitsa .cms-review__source { color: #ffe3e1; }
.spitsa .cms-review__initial { background: #fff; color: var(--sp-red); }
.spitsa .cms-rating-summary__value { font-family: var(--font-display); font-style: italic; font-weight: 800; }

/* 11. Shop: white cards, a yellow price capsule, a livery stripe on the foot. ------------- */
.spitsa .shop-card { position: relative; border-radius: var(--sp-r); background: var(--sp-white); border: 0; box-shadow: none; overflow: hidden; transition: transform 200ms var(--ease); }
.spitsa .shop-card:hover { transform: translateY(-6px) rotate(-0.4deg); box-shadow: none; }
.spitsa .shop-card::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 10px; background: linear-gradient(90deg, var(--sp-ultra) 0 62%, var(--sp-sun) 62% 82%, var(--sp-ultra) 82%); transform: skewX(-20deg); transform-origin: left bottom; margin-left: -12px; width: calc(100% + 24px); }
.spitsa .shop-card:nth-child(3n+2)::after { background: linear-gradient(90deg, var(--sp-sun) 0 38%, var(--sp-ultra) 38% 100%); }
.spitsa .shop-card:nth-child(3n)::after { background: linear-gradient(90deg, var(--sp-ultra) 0 20%, var(--sp-sun) 20% 40%, var(--sp-ultra) 40%); }
.spitsa .shop-card__media, .spitsa .shop-card__image { margin: 0; border-radius: 0; background: #fff; overflow: hidden; }
.spitsa .shop-card__body { padding: 0.9rem 1.1rem 1.4rem; }
.spitsa .shop-card__brand { display: inline-block; padding: 0.1rem 0.6rem; border-radius: 999px; background: var(--sp-tint); font: 500 0.72rem/1.3 var(--font-ui); color: var(--sp-ultra); text-transform: none; letter-spacing: 0; }
.spitsa .shop-card__title { font: 600 1.35rem/1.05 var(--font-display); font-style: italic; text-transform: uppercase; }
.spitsa .shop-card__title a { color: var(--sp-ink); text-decoration: none; }
.spitsa .shop-card__sku { font: 400 0.72rem/1 var(--font-ui); color: var(--sp-ink-3); }
.spitsa .shop-card__foot .shop-price, .spitsa .shop-card__foot .shop-card__price { display: inline-flex; align-items: baseline; gap: 0.4rem; padding: 0.25rem 0.9rem; border-radius: 999px; background: var(--sp-sun); color: var(--sp-ink); }
.spitsa .shop-price, .spitsa .shop-card__price, .spitsa .shop-price__now, .spitsa .shop-price__value { font-family: var(--font-display); font-style: italic; font-weight: 800; }
.spitsa .shop-card__foot .shop-price__now, .spitsa .shop-card__foot .shop-price__value { font-size: 1.55rem; }
.spitsa .shop-price__old, .spitsa .shop-price__was { color: color-mix(in srgb, var(--sp-ink) 55%, transparent); font-style: normal; }
.spitsa .shop-price__off { color: var(--sp-red); }
.spitsa .shop-sticker, .spitsa .shop-badge { border-radius: 999px; font-family: var(--font-display); font-style: italic; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; background: var(--sp-red); color: #fff; }
.spitsa .shop-sticker--hit, .spitsa .shop-sticker--new { background: var(--sp-ultra); color: #fff; }
.spitsa .shop-card__btn, .spitsa .shop-btn { border-radius: 999px; }
.spitsa .shop-card__btn.cms-btn--primary { background: var(--sp-ultra); color: #fff; }
.spitsa .shop-card__btn.cms-btn--primary:hover { background: var(--sp-sun); color: var(--sp-ink); }
.spitsa .shop-pick__chip, .spitsa .shop-pick__label { border-radius: 999px; }
.spitsa .shop-pick__chip { border: 0; background: var(--sp-tint); font: 600 1rem var(--font-display); font-style: italic; }
.spitsa .shop-pick__input:checked + .shop-pick__label { background: var(--sp-ultra); color: #fff; }
.spitsa .shop-filter__title, .spitsa .shop-filter summary { font: 800 1.1rem/1.2 var(--font-display); font-style: italic; text-transform: uppercase; }
.spitsa .shop-head__title, .spitsa .shop-page h1 { font-size: clamp(3rem, 1.5rem + 5vw, 6rem); }
.spitsa .shop-crumbs { font-size: 0.85rem; }
.spitsa .shop-spec-table tr { border-bottom: 0; }
.spitsa .shop-spec-table tr:nth-child(odd) { background: var(--sp-tint); }
.spitsa .shop-summary, .spitsa .shop-buy { border-radius: var(--sp-r); }
.spitsa .shop-summary .shop-price__now, .spitsa .shop-buy .shop-price__now { display: inline-block; padding: 0.1rem 1.2rem; border-radius: 999px; background: var(--sp-sun); font-size: 3.2rem; }
.spitsa .shop-side { border-radius: var(--sp-r); background: var(--sp-white); border: 0; }
.spitsa .shop-tree__link { font-weight: 500; border-radius: 999px; }

/* 12. Variants -------------------------------------------------------------- */
html.spitsa[data-spitsa-density="airy"] .shop-card__body { padding: 1.2rem 1.4rem 1.7rem; }

/* 13. Motion: the stripes are drawn and the wheels turn with the scroll (where the browser can). */
@media (prefers-reduced-motion: no-preference) {
    .sp-hero__stripes i { animation: sp-run-in 1.1s cubic-bezier(.2, .7, .2, 1) both; }
    .sp-hero__stripes i:nth-child(2) { animation-delay: 0.12s; }
    .sp-hero__stripes i:nth-child(3) { animation-delay: 0.24s; }
    @supports (animation-timeline: scroll()) {
        .spitsa .cms-section__head::before { animation: sp-draw linear both; animation-timeline: view(); animation-range: entry 5% entry 70%; }
        .spitsa .cms-section__head::after,
        .sp-ftr__wheel { animation: sp-turn linear both; animation-timeline: scroll(root); }
        .sp-ftr__wheel:nth-child(2) { animation-direction: reverse; }
        .sp-hero__stripes i { animation: sp-run linear both; animation-timeline: scroll(root); animation-range: 0 60vh; }
        .sp-hero__stripes i:nth-child(2) { animation-range: 0 75vh; }
        .sp-hero__stripes i:nth-child(3) { animation-range: 0 90vh; }
    }
}
@keyframes sp-draw { from { transform: skewX(-20deg) scaleX(0.04); } to { transform: skewX(-20deg) scaleX(1); } }
@keyframes sp-turn { from { transform: rotate(0deg); } to { transform: rotate(720deg); } }
@keyframes sp-run { from { transform: scaleX(0.8); } to { transform: scaleX(1); } }
@keyframes sp-run-in { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
    .spitsa .shop-card, .spitsa .cms-btn, .sp-trow__link, .sp-trow__arrow, .sp-pill { transition: none; }
    .spitsa .shop-card:hover, .spitsa .cms-btn--primary:hover, .sp-trow__link:hover { transform: none; }
}
@media (max-width: 720px) { .sp-hdr .hdr-row--main .hdr-row__inner { border-radius: 28px; } }
@media (max-width: 1360px) {
    .sp-hdr .hdr-phone__caption { display: none; }
    .sp-hdr .hdr-nav__link { padding-inline: 0.6rem; font-size: 1.05rem; }
    .sp-hdr .hdr-button, .sp-hdr .hdr-el--button .cms-btn { padding-inline: 0.9rem; }
    .sp-hdr .hdr-phone__number { font-size: 1.2rem; }
}
@media (max-width: 1180px) { .sp-hdr .hdr-el--phone, .sp-hdr .hdr-phone { display: none; } }
.spitsa .sp-ride__title, .spitsa .sp-pgroup__title { color: #fff; }
.spitsa .sp-pgroup__title span { color: var(--sp-ink); }
@media (max-width: 520px) {
    .spitsa h1.cms-section__title { font-size: 2.7rem; }
    .spitsa .cms-section__title { font-size: 2.4rem; }
    .spitsa .cms-section__head { padding-right: 4.5rem; }
    .spitsa .cms-section__head::after { width: 54px; height: 54px; }
}