:root {
    --bg: #fffaf3;
    --soft: #eaf8f6;
    --text: #18333a;
    --muted: #668087;
    --accent: #ff7a59;
    --accent-2: #20b8a6;
    --card: #ffffff;
    --shadow: 0 18px 45px rgba(24, 51, 58, 0.12);
    --radius: 18px;
    --header-height: 76px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-height);
    overflow-x: hidden;
}

body {
    margin: 0;
    padding-top: var(--header-height);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: var(--bg);
    color: var(--text);
    overflow-x: hidden;
}

body.menu-open {
    overflow: hidden;
}

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

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

.container {
    width: min(100% - 48px, 1440px);
    margin-inline: auto;
}

@media (max-width: 800px) {
    .container {
        width: min(100% - 32px, 1440px);
    }
}

.section {
    padding: clamp(56px, 2vw, 110px) 0;
}

.soft {
    background: linear-gradient(135deg, var(--soft), #ffffff);
}

.narrow {
    max-width: 820px;
}

.site-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 50;
    background: rgba(255, 250, 243, 0.9);
    backdrop-filter: blur(16px);
    box-shadow: 0 8px 30px rgba(24, 51, 58, 0.06);
}

.header-inner {
    min-height: var(--header-height);
    display: flex;
    align-items: center;
    gap: 18px;
}

.logo {
    position: relative;
    z-index: 65;
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -0.04em;
    white-space: nowrap;
}

.logo img {
    display: block;
    width: 146px;
    height: 40px;
    object-fit: contain;
}

.logo-tagline {
    display: block;
    margin-top: 3px;
    color: rgba(233, 238, 229, .72);
    font-family: Inter, Arial, sans-serif;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1;
    text-transform: lowercase;
    white-space: nowrap;
}

.footer-copyright {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

@media (min-width: 1024px) {
    .footer-grid > .footer-brand { order: 1; margin-left: 0; }
}

@media (min-width: 1200px) {
    .footer-grid > .footer-brand { grid-column: 1; justify-self: start; }
}

.logo span {
    color: var(--accent-2);
}

.title {
    line-height: 24px;
    min-height: 48px;
    font-size: 1.3rem;
    padding-top: 15px;
}

.title-block {
    display: grid;
    font-weight: bold;
}

.nav {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 65;
    width: min(88vw, 380px);
    height: 100dvh;
    padding: max(24px, env(safe-area-inset-top)) 22px 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    background: #ffffff;
    border-radius: 22px 0 0 22px;
    box-shadow: -26px 0 60px rgba(24, 51, 58, 0.18);
    transform: translateX(110%);
    visibility: hidden;
    transition: transform 0.35s ease, visibility 0.35s ease;
}

.nav.is-open {
    transform: translateX(0);
    visibility: visible;
}

.nav a:not(.logo):not(.mobile-phone) {
    display: flex;
    align-items: center;
    min-height: 52px;
    padding: 14px 16px;
    border-radius: 16px;
    background: #f7fbfa;
    font-weight: 800;
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.nav a:not(.logo):not(.mobile-phone):hover {
    transform: translateX(4px);
    background: #e7fff7;
    color: #078675;
}

.menu-close {
    position: absolute;
    top: max(18px, env(safe-area-inset-top));
    right: 18px;
    z-index: 80;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 14px;
    background: #fff4e6;
    color: var(--text);
    font-size: 34px;
    line-height: 1;
    box-shadow: 0 12px 26px rgba(24, 51, 58, 0.12);
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease;
}

.menu-close:hover {
    transform: rotate(90deg) scale(1.04);
    background: #ffe2d6;
}

.mobile-menu-head {
    display: grid;
    gap: 8px;
    padding: 2px 56px 18px 0;
    margin-bottom: 4px;
    border-bottom: 1px solid #e7efed;
}

.mobile-phone {
    color: var(--accent);
    font-weight: 900;
}

.mobile-menu-note {
    margin: auto 0 0;
    padding: 18px 12px 0;
    border-top: 1px solid rgba(156, 255, 0, 0.28);
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}

.menu-overlay {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(24, 51, 58, 0.42);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.menu-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.header-phone,
.header-cta {
    display: none;
}

.header-mobile-phone {
    min-height: 44px;
    margin-left: auto;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: clamp(12px, 3.5vw, 15px);
    white-space: nowrap;
}

.header-address {
    display: none;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.25;
}

@media (max-width: 480px) {
    .header-inner {
        gap: 8px;
    }

    .header-mobile-phone {
        padding-inline: 10px;
    }
}

@media (max-width: 360px) {
    .site-header .logo {
        font-size: 20px;
    }

    .site-header .logo img {
        width: 120px;
        height: 33px;
    }

    .header-mobile-phone {
        padding-inline: 8px;
        font-size: 11px;
    }

    .site-header .burger {
        width: 42px;
        height: 42px;
    }
}

.burger {
    position: relative;
    z-index: 75;
    width: 46px;
    height: 46px;
    margin-left: 0;
    display: grid;
    place-content: center;
    gap: 5px;
    border: 0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: var(--shadow);
    cursor: pointer;
}

.burger span {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 99px;
    background: var(--text);
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.burger.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.burger.is-open span:nth-child(2) {
    opacity: 0;
}

.burger.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 15px 24px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--accent), #ffb057);
    color: #ffffff;
    font-weight: 900;
    box-shadow: 0 14px 28px rgba(255, 122, 89, 0.28);
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.btn:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 20px 36px rgba(255, 122, 89, 0.36);
}

.btn-small {
    padding: 12px 18px;
}

.hero {
    background: radial-gradient(circle at 20% 10%, #ffffff 0 20%, transparent 35%), linear-gradient(160deg, #fff7df, #dff8f4);
}

.hero-copy {
    max-width: 820px;
    margin-bottom: 34px;
    margin-top: 34px;
}

.eyebrow {
    color: var(--accent-2);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1 {
    margin-bottom: 20px;
    font-size: clamp(42px, 8vw, 86px);
    line-height: 0.96;
    letter-spacing: -0.07em;
}

h2 {
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1;
    letter-spacing: -0.055em;
}

h3 {
    font-size: 22px;
}

.hero-copy p:not(.eyebrow),
.about p,
.contact-card p {
    color: var(--muted);
    font-size: clamp(17px, 2.5vw, 22px);
    line-height: 1.6;
}

.about__inline-editor {
    display: none;
    color: var(--muted);
    font-size: clamp(17px, 2.5vw, 22px);
    line-height: 1.6;
    white-space: pre-wrap;
}

/* The text inside the collapsed "Read more" section is entered as rich HTML,
   so it may be wrapped in a div, paragraphs or lists.  Keep every variant
   visually identical to the introductory paragraph above the spoiler. */
.about__spoiler,
.about__spoiler > div,
.about__spoiler p,
.about__spoiler li {
  color: var(--muted);
  font-family: inherit;
  font-size: clamp(17px, 2.5vw, 22px);
  line-height: 1.6;
}

.about__spoiler > div > :first-child {
  margin-top: 0;
}

/* Inline file manager for authenticated administrators. */
.inline-file-toggle{position:fixed;z-index:10001;top:124px;left:18px;width:54px;height:54px;border:1px solid #56644a;border-radius:4px;background:#080b08;color:#fff;font:800 24px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.inline-file-toggle:hover,.inline-file-toggle.is-open{border-color:#9bff00;color:#9bff00}
.inline-file-panel{position:fixed;z-index:10002;top:0;bottom:0;left:0;display:flex;flex-direction:column;width:min(68vw,980px);padding:26px;background:#090d09;border-right:1px solid #50633d;color:#eef1e9;box-shadow:30px 0 80px rgba(0,0,0,.55);transform:translateX(-105%);transition:transform .22s ease;overflow:auto}
.inline-file-panel.is-open{transform:translateX(0)}
.inline-file-panel header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:16px;border-bottom:1px solid #435138;font-size:22px}.inline-file-panel header button{border:0;background:transparent;color:#fff;font-size:32px;line-height:1;cursor:pointer}.inline-file-panel>p{margin:18px 0;color:#b5bbaa}.inline-file-manager__toolbar{display:flex;align-items:center;gap:16px;margin-bottom:15px}.inline-file-manager__toolbar button,.inline-file-manager__editor button{border:1px solid #77a843;background:#121912;color:#eff5e8;padding:10px 14px;font:700 14px/1.2 Arial,sans-serif;cursor:pointer}.inline-file-manager__toolbar button:hover,.inline-file-manager__editor button:hover{border-color:#9bff00;color:#9bff00}.inline-file-manager__toolbar span{min-width:0;color:#a8ff3d;overflow-wrap:anywhere}.inline-file-manager__layout{display:grid;grid-template-columns:minmax(220px,34%) 1fr;gap:18px;min-height:0;flex:1}.inline-file-manager__list{display:flex;flex-direction:column;gap:6px;overflow:auto;border:1px solid #3f5135;background:#070a07;padding:10px}.inline-file-manager__list button{border:0;background:transparent;color:#e5eadf;padding:9px;text-align:left;overflow-wrap:anywhere;cursor:pointer}.inline-file-manager__list button:hover{background:#182014;color:#9bff00}.inline-file-manager__list button:disabled{color:#7d837a;cursor:not-allowed}.inline-file-manager__list .is-directory{font-weight:800}.inline-file-manager__editor{display:flex;min-width:0;flex-direction:column;gap:10px}.inline-file-manager__editor label{font-weight:800}.inline-file-manager__editor textarea{min-height:52vh;width:100%;resize:vertical;border:1px solid #536445;background:#050805;color:#edf2e8;padding:14px;font:14px/1.5 Consolas,Monaco,monospace}.inline-file-manager__editor>div{display:flex;align-items:center;justify-content:space-between;gap:14px}.inline-file-manager__editor span{color:#b4bbaa;overflow-wrap:anywhere}.inline-file-manager__editor button:disabled{opacity:.45;cursor:not-allowed}.inline-file-manager__editor kbd{font:inherit;font-size:12px;opacity:.72}
@media (max-width:700px){.inline-file-toggle{top:116px;left:10px;width:46px;height:46px;font-size:20px}.inline-file-panel{width:100%;padding:18px 14px}.inline-file-manager__layout{grid-template-columns:1fr}.inline-file-manager__list{max-height:24vh}.inline-file-manager__editor textarea{min-height:35vh}.inline-file-manager__editor>div{align-items:flex-start;flex-direction:column}}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 20px;
    margin-bottom: 28px;
}

.product-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.product-card,
.benefit-card,
.review,
.promo-card,
.contact-card {
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.product-card:hover,
.benefit-card:hover,
.review:hover {
    transform: translateY(-7px);
    box-shadow: 0 24px 55px rgba(24, 51, 58, 0.17);
}

.product-image {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius) var(--radius) 0 0;
    background: #e5efef;
    min-height: 15rem;
    padding-top: 25px;
}

.product-image img {
    width: 100%;
    aspect-ratio: 640 / 430;
    object-fit: contain;
    transition: transform 0.45s ease;
}

.product-card:hover img {
    transform: scale(1.06);
}

.badge {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #e7fff7;
    color: #078675;
    font-weight: 900;
}

.product-body {
    padding: 18px;
}

.weight,
.delivery,
.price-row span {
    color: var(--muted);
}

.price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin: 12px 0;
}

.price-row b {
    font-size: 26px;
}

.btn-card {
    width: 100%;
    margin-top: 8px;
}

.promo-grid,
.benefit-grid,
.review-grid,
.footer-grid {
    display: grid;
    gap: 20px;
}

.promo-card {
    min-height: 220px;
    padding: 28px;
}

.promo-card.accent {
    background: linear-gradient(135deg, var(--accent-2), #7be5d8);
    color: #ffffff;
}

.benefit-card,
.review {
    padding: 24px;
}

.faq-item {
    margin-bottom: 14px;
    overflow: hidden;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: var(--shadow);
}

.faq-question {
    width: 100%;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    border: 0;
    background: none;
    font: inherit;
    font-weight: 900;
    text-align: left;
    cursor: pointer;
}

.faq-question span {
    transition: transform 0.25s ease;
}

.faq-item.is-open .faq-question span {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-answer p {
    padding: 0 20px 20px;
    color: var(--muted);
    line-height: 1.6;
}

/* Выравнивание основного смыслового текста: элементы управления и заголовки не затрагиваются. */
.hero-copy p:not(.eyebrow),
.about p,
.contact-card p,
.benefit-card p,
.review p,
.faq-answer p,
.seo-content__body p,
.seo-content__body li,
.product-detail__text,
.blog-hero > p:last-child,
.blog-card > p:not(.blog-card__key),
.blog-article__body p,
.blog-article__body li,
.blog-article__faq dd {
    text-align: justify;
    text-align-last: left;
    hyphens: auto;
}

.contact-card {
    padding: 24px;
    display: grid;
    gap: 24px;
    background: linear-gradient(135deg, #ffffff, #fff4e6);
}

.form {
    display: grid;
    gap: 14px;
}

.form label {
    display: grid;
    gap: 8px;
    font-weight: 800;
}

.form input,
.form textarea {
    width: 100%;
    padding: 15px;
    border: 2px solid transparent;
    border-radius: 16px;
    background: #ffffff;
    font: inherit;
    outline: none;
}

.form input:focus,
.form textarea:focus {
    border-color: var(--accent-2);
}

.form .error {
    border-color: #f04438;
}

.form-message {
    min-height: 24px;
    font-weight: 800;
}

.footer {
    padding: 42px 0;
    background: #123038;
    color: #ffffff;
}

.footer-grid a {
    display: block;
    margin: 8px 0;
    color: #d8f4ef;
}

.footer-grid .footer-phone {
    display: inline-flex;
    margin: 8px 0;
    color: #0a0c08;
    white-space: nowrap;
}

.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.is-visible {
    opacity: 1;
    transform: none;
}

@media (min-width: 560px) {
    .product-grid,
    .benefit-grid,
    .review-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .promo-grid,
    .contact-card,
    .footer-grid {
        grid-template-columns: 1.2fr 0.8fr;
    }

    .section-head {
        margin-bottom: 38px;
    }
}

@media (min-width: 1024px) {
    body.menu-open {
        overflow: auto;
    }

    .burger,
    .menu-close,
    .mobile-menu-head,
    .mobile-menu-note,
    .menu-overlay {
        display: none;
    }

    .nav {
        position: static;
        z-index: auto;
        width: auto;
        height: auto;
        padding: 0;
        margin-left: auto;
        flex-direction: row;
        align-items: center;
        gap: 20px;
        overflow: visible;
        visibility: visible;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        transform: none;
        font-size: 0.79rem;
    }

    .nav a:not(.logo):not(.mobile-phone) {
        min-height: auto;
        padding: 0;
        border-radius: 0;
        background: transparent;
    }

    .nav a:not(.logo):not(.mobile-phone):hover {
        transform: translateY(-2px);
        background: transparent;
        color: var(--accent-2);
    }

    .header-phone,
    .header-cta {
        display: inline-flex;
    }

    .header-mobile-phone {
        display: none;
    }

    .product-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .benefit-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .review-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}








/* =========================
   HERO — ПЛЯЖНАЯ ТЕМАТИКА
========================= */

:root {
    --hero-dark: #15343b;
    --hero-text: #68828a;
    --hero-turquoise: #1bb6aa;
    --hero-orange: #ff835d;
    --hero-yellow: #ffb34f;
    --hero-white: #ffffff;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--hero-dark);
    background: #effbf7;
}




/* =========================================
   ПЛЯЖНЫЙ ПЕРВЫЙ ЭКРАН
========================================= */

* {
    box-sizing: border-box;
}

:root {
    --beach-dark: #12343b;
    --beach-text: #668089;
    --beach-accent: #18b3a7;
    --beach-orange: #ff7658;
    --beach-yellow: #ffae4b;
    --beach-bg: #eefaf6;
}

.beach-hero {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 46%) minmax(0, 54%);

    width: 100%;
    min-height: 680px;

    overflow: hidden;

    background:
            radial-gradient(
                    circle at 15% 35%,
                    rgba(255, 255, 255, 0.95) 0%,
                    rgba(255, 255, 255, 0.35) 42%,
                    transparent 70%
            ),
            linear-gradient(
                    120deg,
                    #f8fff9 0%,
                    #effaf6 48%,
                    #dff4f1 100%
            );

    isolation: isolate;
}


/* =========================================
   ЛЕВАЯ ЧАСТЬ
========================================= */

.beach-hero__content {
    position: relative;
    z-index: 4;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    padding:
            80px
            50px
            120px
            max(6vw, 40px);
}

.beach-hero__label {
    margin-bottom: 24px;

    color: var(--beach-accent);

    font-size: 15px;
    font-weight: 800;
    line-height: 1.4;

    letter-spacing: 4px;
    text-transform: uppercase;
}

.beach-hero__title {
    max-width: 720px;
    margin: 0 0 28px;

    color: var(--beach-dark);

    font-size: clamp(52px, 5.3vw, 86px);
    font-weight: 900;
    line-height: 0.98;

    letter-spacing: -4px;
}

.beach-hero__text {
    max-width: 650px;
    margin: 0 0 34px;

    color: var(--beach-text);

    font-size: clamp(19px, 1.55vw, 27px);
    font-weight: 400;
    line-height: 1.55;
}

.beach-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;

    min-height: 64px;
    padding: 0 30px;

    color: #ffffff;

    font-size: 18px;
    font-weight: 800;
    line-height: 1;

    text-decoration: none;

    border-radius: 20px;

    background:
            linear-gradient(
                    135deg,
                    var(--beach-orange),
                    var(--beach-yellow)
            );

    box-shadow:
            0 18px 35px rgba(255, 118, 88, 0.3),
            inset 0 1px 0 rgba(255, 255, 255, 0.35);

    transition:
            transform 0.25s ease,
            box-shadow 0.25s ease;
}

.beach-hero__button::after {
    content: "→";

    font-size: 24px;
    font-weight: 400;

    transition: transform 0.25s ease;
}

.beach-hero__button:hover {
    transform: translateY(-4px);

    box-shadow:
            0 24px 42px rgba(255, 118, 88, 0.4),
            inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.beach-hero__button:hover::after {
    transform: translateX(5px);
}


/* =========================================
   ПРАВАЯ ЧАСТЬ С ИЗОБРАЖЕНИЕМ
========================================= */

.beach-hero__picture {
    position: relative;
    z-index: 1;

    min-width: 0;
    min-height: 680px;

    overflow: hidden;
}

/*
Плавный переход между текстом и фотографией
*/
.beach-hero__picture::before {
    content: "";

    position: absolute;
    z-index: 2;

    top: 0;
    bottom: 0;
    left: 0;

    width: 230px;

    pointer-events: none;

    background:
            linear-gradient(
                    90deg,
                    var(--beach-bg) 0%,
                    rgba(238, 250, 246, 0.92) 18%,
                    rgba(238, 250, 246, 0.55) 48%,
                    rgba(238, 250, 246, 0) 100%
            );
}

/*
Небольшое затемнение справа,
чтобы фотография выглядела глубже
*/
.beach-hero__picture::after {
    content: "";

    position: absolute;
    z-index: 2;

    inset: 0;

    pointer-events: none;

    background:
            linear-gradient(
                    180deg,
                    rgba(15, 60, 70, 0.03) 0%,
                    rgba(15, 60, 70, 0) 55%,
                    rgba(15, 60, 70, 0.12) 100%
            );
}

.beach-hero__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    /*
    Основная настройка кадрирования.

    38% — показывает больше девушки.
    50% — центр изображения.
    65% — показывает больше баллона.
    */
    object-position: 38% center;
}


/* =========================================
   БЕЛАЯ ВОЛНА СНИЗУ
========================================= */

.beach-hero__wave {
    position: absolute;
    z-index: 5;

    left: -5%;
    bottom: -110px;

    width: 110%;
    height: 190px;

    pointer-events: none;

    background: rgba(255, 255, 255, 0.94);

    border-radius:
            50% 50% 0 0 /
        70% 70% 0 0;

    transform: rotate(-1deg);
}


/* =========================================
   ПЛАНШЕТ
========================================= */

@media (max-width: 1100px) {

    .beach-hero {
        grid-template-columns: minmax(0, 52%) minmax(0, 48%);
        min-height: 620px;
    }

    .beach-hero__content {
        padding:
                65px
                30px
                100px
                35px;
    }

    .beach-hero__picture {
        min-height: 620px;
    }

    .beach-hero__title {
        font-size: clamp(48px, 6vw, 68px);
        letter-spacing: -2.5px;
    }

    .beach-hero__text {
        font-size: 20px;
    }

    .beach-hero__picture::before {
        width: 150px;
    }

    .beach-hero__image {
        object-position: 42% center;
    }
}


/* =========================================
   МОБИЛЬНАЯ ВЕРСИЯ
========================================= */

@media (max-width: 800px) {

    .beach-hero {
        display: flex;
        flex-direction: column;

        min-height: auto;
    }

    .beach-hero__content {
        padding:
                55px
                22px
                40px;

        background:
                linear-gradient(
                        180deg,
                        #f8fff9 0%,
                        #eefaf6 100%
                );
    }

    .beach-hero__label {
        margin-bottom: 18px;

        font-size: 13px;
        letter-spacing: 3px;
    }

    .beach-hero__title {
        max-width: 650px;
        margin-bottom: 20px;

        font-size: clamp(44px, 11vw, 64px);
        line-height: 1;

        letter-spacing: -2px;
    }

    .beach-hero__text {
        margin-bottom: 28px;

        font-size: 19px;
        line-height: 1.5;
    }

    .beach-hero__picture {
        width: 100%;
        min-height: 0;
        height: 500px;
    }

    .beach-hero__picture::before {
        top: 0;
        right: 0;
        bottom: auto;
        left: 0;

        width: 100%;
        height: 110px;

        background:
                linear-gradient(
                        180deg,
                        #eefaf6 0%,
                        rgba(238, 250, 246, 0.7) 35%,
                        rgba(238, 250, 246, 0) 100%
                );
    }

    .beach-hero__image {
        object-position: 42% center;
    }

    .beach-hero__wave {
        bottom: -135px;
    }
}


/* =========================================
   МАЛЕНЬКИЕ ТЕЛЕФОНЫ
========================================= */

@media (max-width: 480px) {

    .beach-hero__content {
        padding:
                42px
                18px
                32px;
    }

    .beach-hero__label {
        font-size: 12px;
        letter-spacing: 2.5px;
    }

    .beach-hero__title {
        font-size: 43px;
        letter-spacing: -1.5px;
    }

    .beach-hero__text {
        font-size: 17px;
    }

    .beach-hero__button {
        width: 100%;
        min-height: 60px;
        padding: 0 20px;
    }

    .beach-hero__picture {
        height: 390px;
    }

    .beach-hero__image {
        object-position: 45% center;
    }
}

/* =========================================
   HERO — MODERN VINTAGE POSTCARD
========================================= */

.beach-hero {
    --vintage-ink: #19393a;
    --vintage-paper: #f4ead4;
    --vintage-paper-light: #fffaf0;
    --vintage-coral: #dc6048;
    --vintage-mustard: #d7a73d;
    --vintage-teal: #2e7771;

    position: relative;
    display: grid;
    grid-template-columns: minmax(440px, 0.92fr) minmax(520px, 1.08fr);
    gap: clamp(18px, 2.2vw, 42px);
    width: min(calc(100% - 48px), 1480px);
    min-height: 690px;
    margin: clamp(22px, 3vw, 52px) auto clamp(58px, 7vw, 110px);
    padding: clamp(18px, 2vw, 30px);
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(25, 57, 58, 0.26);
    border-radius: 34px;
    background:
        repeating-linear-gradient(0deg, rgba(25, 57, 58, 0.025) 0 1px, transparent 1px 4px),
        radial-gradient(circle at 8% 10%, rgba(255, 255, 255, 0.85), transparent 32%),
        var(--vintage-paper);
    box-shadow:
        0 28px 70px rgba(49, 48, 38, 0.16),
        inset 0 0 0 8px rgba(255, 250, 240, 0.72);
}

.beach-hero::before {
    content: "Доставка 24/7";
    position: absolute;
    z-index: 5;
    top: 28px;
    right: -57px;
    width: 260px;
    padding: 9px 0;
    color: var(--vintage-paper-light);
    font: 700 10px/1.2 Arial, sans-serif;
    letter-spacing: 2px;
    text-align: center;
    background: var(--vintage-coral);
    transform: rotate(45deg);
    box-shadow: 0 5px 15px rgba(82, 43, 31, 0.2);
}

.beach-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 11px;
    pointer-events: none;
    border: 1px dashed rgba(25, 57, 58, 0.25);
    border-radius: 25px;
}

.beach-hero__content {
    position: relative;
    z-index: 4;
    justify-content: center;
    padding: clamp(70px, 7vw, 108px) clamp(26px, 4.5vw, 72px);
}

.beach-hero__content::before {
    content: "N₂O";
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    margin-bottom: 28px;
    color: var(--vintage-coral);
    font: 700 22px/1 Georgia, "Times New Roman", serif;
    border: 2px solid currentColor;
    border-radius: 50%;
    outline: 1px dashed currentColor;
    outline-offset: 5px;
    transform: rotate(-7deg);
}

.beach-hero__label {
    position: absolute;
    top: clamp(32px, 3vw, 48px);
    left: clamp(26px, 4.5vw, 72px);
    margin: 0;
    color: var(--vintage-teal);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3.2px;
}

.beach-hero__title {
    max-width: 680px;
    margin: 0 0 26px;
    color: var(--vintage-ink);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(52px, 5vw, 78px);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -3px;
    text-wrap: balance;
}

.beach-hero__title::after {
    content: "";
    display: block;
    width: 92px;
    height: 5px;
    margin-top: 27px;
    border-radius: 99px;
    background: var(--vintage-mustard);
    box-shadow: 25px 0 0 var(--vintage-paper-light);
}

.beach-hero__text {
    max-width: 590px;
    margin: 0 0 34px;
    color: #566c68;
    font-size: clamp(17px, 1.3vw, 20px);
    line-height: 1.65;
}

.beach-hero__button {
    min-height: 58px;
    padding: 0 26px;
    color: var(--vintage-paper-light);
    font-size: 16px;
    letter-spacing: 0.3px;
    border: 1px solid var(--vintage-ink);
    border-radius: 4px;
    background: var(--vintage-ink);
    box-shadow: 7px 7px 0 var(--vintage-mustard);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.beach-hero__button::after {
    content: "↗";
    font-size: 20px;
}

.beach-hero__button:hover {
    background: var(--vintage-teal);
    transform: translate(3px, 3px);
    box-shadow: 4px 4px 0 var(--vintage-mustard);
}

.beach-hero__picture {
    position: relative;
    z-index: 2;
    min-height: 630px;
    overflow: hidden;
    border: 10px solid var(--vintage-paper-light);
    border-radius: 24px;
    box-shadow:
        0 16px 35px rgba(44, 53, 45, 0.18),
        0 0 0 1px rgba(25, 57, 58, 0.2);
    transform: rotate(1.1deg);
}

.beach-hero__picture::before {
    content: "Закись • Азота • Москва";
    z-index: 4;
    top: auto;
    right: 22px;
    bottom: 22px;
    left: auto;
    width: auto;
    height: auto;
    padding: 10px 14px 8px;
    color: var(--vintage-paper-light);
    font: 700 11px/1 Arial, sans-serif;
    letter-spacing: 2px;
    border: 1px solid rgba(255, 250, 240, 0.7);
    border-radius: 2px;
    background: rgba(25, 57, 58, 0.72);
    backdrop-filter: blur(8px);
}

.beach-hero__picture::after {
    z-index: 3;
    background:
        linear-gradient(180deg, rgba(215, 167, 61, 0.07), transparent 38%, rgba(61, 40, 23, 0.2)),
        radial-gradient(circle at 50% 40%, transparent 48%, rgba(44, 33, 20, 0.2) 120%);
    mix-blend-mode: multiply;
}

.beach-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 43% center;
    filter: saturate(0.84) sepia(0.12) contrast(1.04);
    transform: scale(1.015);
}

.beach-hero__wave {
    display: none;
}

@media (max-width: 1100px) {
    .beach-hero {
        grid-template-columns: minmax(360px, 0.9fr) minmax(430px, 1.1fr);
        gap: 18px;
        min-height: 610px;
    }

    .beach-hero__content {
        padding: 72px 34px 58px;
    }

    .beach-hero__label {
        top: 30px;
        left: 34px;
    }

    .beach-hero__content::before {
        width: 58px;
        height: 58px;
        margin-bottom: 24px;
        font-size: 19px;
    }

    .beach-hero__title {
        font-size: clamp(44px, 5.4vw, 62px);
        letter-spacing: -2px;
    }

    .beach-hero__picture {
        min-height: 550px;
    }
}

@media (max-width: 800px) {
    .beach-hero {
        display: flex;
        flex-direction: column;
        width: min(calc(100% - 28px), 680px);
        min-height: auto;
        padding: 14px;
        border-radius: 25px;
    }

    .beach-hero::before {
        top: 30px;
        right: -80px;
    }

    .beach-hero::after {
        inset: 7px;
        border-radius: 19px;
    }

    .beach-hero__content {
        padding: 74px 24px 36px;
        background: transparent;
    }

    .beach-hero__label {
        top: 28px;
        left: 24px;
        max-width: 230px;
        font-size: 11px;
        letter-spacing: 2.4px;
    }

    .beach-hero__content::before {
        width: 54px;
        height: 54px;
        margin-bottom: 22px;
    }

    .beach-hero__title {
        font-size: clamp(42px, 10.5vw, 62px);
        line-height: 1;
    }

    .beach-hero__text {
        font-size: 17px;
        line-height: 1.55;
    }

    .beach-hero__picture {
        order: 2;
        width: 100%;
        height: clamp(390px, 115vw, 580px);
        min-height: 0;
        border-width: 7px;
        border-radius: 18px;
        transform: none;
    }

    .beach-hero__picture::before {
        top: auto;
        right: 15px;
        bottom: 15px;
        left: auto;
        width: auto;
        height: auto;
        background: rgba(25, 57, 58, 0.72);
    }

    .beach-hero__image {
        object-position: 43% center;
    }
}

@media (max-width: 480px) {
    .beach-hero {
        width: calc(100% - 20px);
        margin-top: 14px;
        margin-bottom: 48px;
    }

    .beach-hero__content {
        padding: 68px 16px 32px;
    }

    .beach-hero__label {
        left: 16px;
        letter-spacing: 1.8px;
    }

    .beach-hero__title {
        font-size: clamp(38px, 12vw, 52px);
        letter-spacing: -1.5px;
    }

    .beach-hero__title::after {
        margin-top: 22px;
    }

    .beach-hero__button {
        width: 100%;
    }

    .beach-hero__picture {
        height: 390px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .beach-hero__button,
    .beach-hero__button::after {
        transition: none;
    }
}

/* Выкуп баллонов */
.buyback-section { position: relative; overflow: hidden; }
.buyback-section::before { content: ''; position: absolute; inset: 12% 0 auto; height: 360px; pointer-events: none; background: radial-gradient(ellipse at 50% 50%, rgba(156, 255, 0, .1), transparent 68%); }
.buyback-section .container { position: relative; }
.buyback-intro { max-width: 620px; margin: 16px 0 0; color: var(--muted); }
.buyback-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.buyback-card { position: relative; display: flex; flex-direction: column; min-height: 430px; overflow: hidden; border: 1px solid rgba(156, 255, 0, .33); background: #000; box-shadow: 10px 14px 0 rgba(0, 0, 0, .2), inset 0 0 42px rgba(156, 255, 0, .035); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.buyback-card::before { content: ''; position: absolute; inset: 0; opacity: .52; background-image: linear-gradient(rgba(156,255,0,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(156,255,0,.1) 1px, transparent 1px); background-size: 26px 26px; mask-image: linear-gradient(#000, transparent 62%); }
.buyback-card:hover { z-index: 2; border-color: rgba(202, 255, 120, .92); box-shadow: 0 0 32px rgba(156, 255, 0, .18), 12px 16px 0 rgba(0, 0, 0, .24); transform: translateY(-8px); }
.buyback-card__scan { position: absolute; top: -40%; left: -34%; width: 36%; height: 190%; pointer-events: none; opacity: .28; background: linear-gradient(90deg, transparent, rgba(220, 255, 165, .7), transparent); transform: rotate(18deg); animation: buyback-scan 5.2s ease-in-out infinite; animation-delay: calc(var(--buyback-delay) * .35s); }
.buyback-card__visual { position: relative; z-index: 0; width: 100%; height: 236px; flex: 0 0 236px; overflow: hidden; background: #000; border-bottom: 1px solid rgba(156, 255, 0, .33); }
.buyback-card__visual::after { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, .22) 100%); }
.buyback-card__visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transform-origin: 50% 50%; filter: saturate(1.08) contrast(1.05); animation: buyback-float 5.2s ease-in-out infinite; animation-delay: calc(var(--buyback-delay) * .18s); }
.buyback-card__body { position: relative; z-index: 2; display: flex; flex: 1; flex-direction: column; justify-content: flex-start; min-height: 0; padding: 20px 18px 18px; background: #000; text-shadow: 0 2px 10px rgba(0, 0, 0, .95); }
.buyback-card h3 { margin: 0; color: var(--text); font-size: 19px; line-height: 1.14; }
.buyback-card p { margin: 10px 0 18px; color: var(--muted); line-height: 1.35; }
.buyback-card__action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: fit-content; min-height: 42px; margin-top: auto; padding: 0 17px; border: 1px solid rgba(156, 255, 0, .72); border-radius: 8px; background: linear-gradient(135deg, var(--accent), #75d900); box-shadow: 0 6px 0 #487d00, 0 12px 24px rgba(156, 255, 0, .18); color: #071000; font-weight: 900; text-decoration: none; text-transform: uppercase; letter-spacing: .045em; font-size: 12px; line-height: 1; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.buyback-card__action:hover { color: #071000; filter: brightness(1.08); transform: translateY(-2px); box-shadow: 0 8px 0 #487d00, 0 16px 28px rgba(156, 255, 0, .26); }.buyback-card__action:active { transform: translateY(4px); box-shadow: 0 2px 0 #487d00; }.buyback-card__action:focus-visible { outline: 3px solid rgba(255, 255, 255, .8); outline-offset: 3px; }.buyback-card__action span { display: inline-block; transition: transform .2s ease; }.buyback-card__action:hover span { transform: translate(3px, -3px); }
@keyframes buyback-float { 50% { transform: translateY(-8px) rotate(-1.5deg); filter: drop-shadow(0 21px 17px rgba(0, 0, 0, .78)) brightness(1.1); } }
@keyframes buyback-scan { 0%, 24% { transform: translateX(-180%) rotate(18deg); opacity: 0; } 36% { opacity: .3; } 67% { transform: translateX(620%) rotate(18deg); opacity: .3; } 78%, 100% { transform: translateX(620%) rotate(18deg); opacity: 0; } }
@media (max-width: 1120px) { .buyback-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) {
    .buyback-section .section-head { display: block; }
    .buyback-section .section-head .eyebrow { margin-bottom: 12px; }
    .buyback-section .section-head h2 { max-width: 100%; font-size: clamp(34px, 10vw, 48px); }
    .buyback-intro { max-width: none; margin-top: 16px; }
    .buyback-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .buyback-card { min-height: 400px; }
    .buyback-card__visual { height: 190px; flex-basis: 190px; }
    .buyback-card__body { padding: 15px; }
    .buyback-card h3 { font-size: 17px; }
}
@media (max-width: 540px) {
    .buyback-grid { grid-template-columns: 1fr; }
    .buyback-card { min-height: 440px; }
    .buyback-card__visual { height: 250px; flex-basis: 250px; }
    .buyback-card__body { min-height: 0; padding: 20px; }
    .buyback-card h3 { font-size: 21px; }
    .buyback-card p { margin-bottom: 24px; font-size: 18px; }
    .buyback-card__action { width: 100%; min-height: 52px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .buyback-card__scan, .buyback-card__visual img { animation: none; } }

/* AZOT24: ночной космический режим */
:root {
    --bg: #0d0e0d;
    --soft: #121512;
    --text: #f4f5ef;
    --muted: #afb4aa;
    --accent: #9cff00;
    --accent-2: #9cff00;
    --card: #151815;
    --shadow: 0 22px 60px rgba(0, 0, 0, 0.52);
    --radius: 4px;
}

body {
    background: #0d0e0d;
    background-size: auto, 44px 44px, 44px 44px;
    color: var(--text);
}

.site-header { background: rgba(10, 11, 10, .88); border-bottom: 1px solid rgba(156, 255, 0, .22); box-shadow: none; }
.logo, h1, h2, h3 { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-weight: 900; text-transform: uppercase; }
.logo { letter-spacing: .08em; }
.logo span, .eyebrow, .mobile-phone { color: var(--accent); }
.nav { background: #101210; border-left: 1px solid rgba(156,255,0,.28); }
.nav a:not(.logo):not(.mobile-phone) { background: #171a17; color: #e9eee5; border-left: 2px solid transparent; }
.nav a:not(.logo):not(.mobile-phone):hover { background: #1c211a; color: var(--accent); border-left-color: var(--accent); }
.burger { background: #181c17; border: 1px solid rgba(156,255,0,.4); box-shadow: none; }
.burger span { background: var(--accent); }
.hero, .soft { background: transparent; }
.section { padding-block: clamp(54px, 7vw, 112px); }
.hero-copy p:not(.eyebrow), .about p, .contact-card p, .weight, .delivery, .price-row span, .faq-answer p { color: var(--muted); }

.btn, .beach-hero__button {
    border-radius: 0; background: var(--accent); color: #0c0e0b; box-shadow: 5px 5px 0 #4d6700;
    text-transform: uppercase; letter-spacing: .06em;
}
.btn:hover, .beach-hero__button:hover { background: #c2ff4a; box-shadow: 8px 8px 0 #4d6700; }

.product-card, .benefit-card, .review, .promo-card, .contact-card, .faq-item {
    background: linear-gradient(145deg, #191d18, #101210); border: 1px solid rgba(240, 255, 226, .12); border-radius: 3px; box-shadow: var(--shadow);
}
.product-card:hover, .benefit-card:hover, .review:hover { border-color: rgba(156,255,0,.68); box-shadow: 0 0 0 1px rgba(156,255,0,.16), var(--shadow); }
.product-image { background: #090a09; border-bottom: 1px solid rgba(156,255,0,.18); }
.badge { border-radius: 0; background: var(--accent); color: #0c0e0b; }
.promo-card.accent { background: #9cff00; color: #0d0e0d; }
.promo-card.accent p { color: #27301f; }

.beach-hero {
    position: relative; isolation: isolate; min-height: min(720px, 86vh); margin-top: clamp(34px, 7vw, 88px);
    padding: clamp(76px, 10vw, 150px) max(28px, calc((100vw - 1180px) / 2)); display: flex; align-items: center; overflow: hidden;
    background: #080908;
    border: 0;
}
.beach-hero::before, .beach-hero::after, .beach-hero__picture, .beach-hero__wave { display: none; }
.beach-hero__content { position: relative; z-index: 2; max-width: min(680px, 65vw); padding: 0; }
.beach-hero__content::before { display: none; }
.beach-hero__label { color: var(--accent); border: 1px solid rgba(156,255,0,.5); background: rgba(11,13,10,.8); border-radius: 0; padding: 8px 12px; }
.beach-hero__title { color: #f5f7f0; text-shadow: none; font-size: clamp(48px, 6.4vw, 98px); }
.beach-hero__title::after { content: ""; display: block; width: 88px; height: 6px; margin-top: 28px; background: var(--accent); }
.beach-hero__text { color: #d0d6ca; max-width: 570px; }
.form input, .form textarea { background: #0c0e0c; border: 1px solid #394034; color: var(--text); border-radius: 2px; }
.form input:focus, .form textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(156,255,0,.13); }
.faq-question { color: var(--text); }
.footer { background: #070807; border-top: 1px solid rgba(156,255,0,.35); }
.footer-grid a { color: #c7d7bc; }

@media (max-width: 767px) {
    .beach-hero { min-height: 660px; align-items: flex-start; }
    .beach-hero__content { max-width: 100%; padding-right: 0; }
}

/* Финальная компоновка hero: без перекрытия заголовка и метки. */
.beach-hero {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    gap: 0 !important;
    margin-inline: 0 !important;
    border-radius: 0 !important;
}

.beach-hero__content {
    display: block !important;
    width: 100% !important;
    max-width: min(620px, 100%) !important;
}

.beach-hero__label {
    position: static !important;
    display: inline-block !important;
    margin: 0 0 22px !important;
    font-family: Inter, Arial, sans-serif !important;
    line-height: 1.2 !important;
}

.beach-hero__title {
    max-width: 620px !important;
    margin: 0 0 26px !important;
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", Arial, sans-serif !important;
    font-size: clamp(42px, 6vw, 78px) !important;
    font-weight: 900 !important;
    line-height: 1.04 !important;
    letter-spacing: .01em !important;
    overflow-wrap: normal !important;
    text-wrap: wrap !important;
}

@media (max-width: 767px) {
    .beach-hero { padding: 36px 24px 310px !important; }
    .beach-hero__title { font-size: clamp(42px, 12vw, 64px) !important; }
    .beach-hero__label { margin-bottom: 18px !important; font-size: 11px !important; letter-spacing: .18em !important; }
}

/* Карточки каталога: действие всегда на одной линии. */
.product-card {
    display: flex;
    flex-direction: column;
}

.product-body {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.product-body .btn-card {
    margin-top: auto;
}

/* Никаких рамок вокруг космического героя. */
.beach-hero {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.beach-hero::before,
.beach-hero::after,
.beach-hero__content::before {
    content: none !important;
    display: none !important;
}

/* Палитра: графит и приглушённый красный вместо кислотного зелёного. */
:root {
    --accent: #d74747;
    --accent-2: #d74747;
}

.site-header { border-bottom-color: rgba(215, 71, 71, .28); }
.nav { border-left-color: rgba(215, 71, 71, .32); }
.nav a:not(.logo):not(.mobile-phone):hover { background: #231818; color: #f06a6a; border-left-color: var(--accent); }
.burger { border-color: rgba(215, 71, 71, .55); }
.product-card:hover, .benefit-card:hover, .review:hover { border-color: rgba(215, 71, 71, .74); box-shadow: 0 0 0 1px rgba(215,71,71,.14), var(--shadow); }
.product-image { border-bottom-color: rgba(215,71,71,.24); }

.btn, .beach-hero__button {
    background: var(--accent);
    color: #fffafa;
    box-shadow: 5px 5px 0 #681d23;
}

.btn:hover, .beach-hero__button:hover { background: #ee6464; box-shadow: 8px 8px 0 #681d23; }
.badge, .promo-card.accent { background: var(--accent); color: #fffafa; }
.promo-card.accent p { color: #ffe3e3; }

.beach-hero {
    background-image: none;
    border-color: rgba(215,71,71,.32);
}

.beach-hero__label { border-color: rgba(215,71,71,.58); }
.beach-hero__title::after { background: var(--accent); }
.form input:focus, .form textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(215,71,71,.14); }
.footer { border-top-color: rgba(215,71,71,.4); }

@media (max-width: 767px) {
    .beach-hero { background-image: none; }
}

/* Возвращаем фирменный неоново-зелёный космический режим. */
:root {
    --accent: #9cff00;
    --accent-2: #9cff00;
}

.site-header { border-bottom-color: rgba(156,255,0,.22); }
.nav { border-left-color: rgba(156,255,0,.28); }
.nav a:not(.logo):not(.mobile-phone):hover { background: #1c211a; color: var(--accent); border-left-color: var(--accent); }
.burger { border-color: rgba(156,255,0,.4); }
.product-card:hover, .benefit-card:hover, .review:hover { border-color: rgba(156,255,0,.68); box-shadow: 0 0 0 1px rgba(156,255,0,.16), var(--shadow); }
.product-image { border-bottom-color: rgba(156,255,0,.18); }
.badge, .promo-card.accent { background: var(--accent); color: #0a0c08; }
.promo-card.accent p { color: #27301f; }

.btn, .beach-hero__button {
    position: relative;
    overflow: hidden;
    border: 1px solid #c8ff69;
    border-radius: 7px;
    background: linear-gradient(135deg, #c4ff57 0%, #9cff00 46%, #7fe000 100%);
    color: #090b08;
    box-shadow: 0 7px 0 #3d6500, 0 12px 26px rgba(100, 204, 0, .18), inset 0 1px 0 rgba(255,255,255,.66);
}

.btn::before, .beach-hero__button::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.42) 50%, transparent 62%);
    transform: translateX(-115%);
    transition: transform .45s ease;
}

.btn:hover, .beach-hero__button:hover {
    background: linear-gradient(135deg, #d7ff85, #aaff13 48%, #87ec00);
    box-shadow: 0 4px 0 #3d6500, 0 14px 28px rgba(100, 204, 0, .27), inset 0 1px 0 rgba(255,255,255,.7);
    transform: translateY(3px);
}

.btn:hover::before, .beach-hero__button:hover::before { transform: translateX(115%); }

.beach-hero {
    background-image: none;
    border-color: rgba(156,255,0,.32);
}

.beach-hero__label { border-color: rgba(156,255,0,.55); }
.beach-hero__title::after { background: var(--accent); }
.form input:focus, .form textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(156,255,0,.13); }
.footer { border-top-color: rgba(156,255,0,.35); }

@media (max-width: 767px) {
    .beach-hero { background-image: none; }
}

/* Мягкое растворение hero-иллюстрации в фоне страницы. */
.beach-hero {
    margin-top: 0 !important;
}

.beach-hero::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    left: 0;
    height: clamp(180px, 16vw, 280px);
    pointer-events: none;
    border: 0 !important;
    border-radius: 0 !important;
    background-image:
        linear-gradient(180deg, #11180d 0%, rgba(16, 23, 13, .98) 18%, rgba(13, 17, 12, .78) 48%, rgba(13, 14, 13, .18) 82%, transparent 100%),
        linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
}

@media (max-width: 767px) {
    .beach-hero::after { height: 180px; }
}

/* Мобильная шапка: телефон строго по центру экрана. */
@media (max-width: 767px) {
    .header-inner {
        position: relative;
    }

    .site-header .burger {
        flex: 0 0 auto;
        margin-left: auto;
    }

    .header-mobile-phone {
        position: absolute;
        left: 63%;
        margin: 0;
        transform: translateX(-50%);
    }
}

@media (max-width: 430px) {
    .header-mobile-phone {
        right: 64px;
        left: auto;
        padding-inline: 8px;
        transform: none;
    }
}

/* На десктопе используем ту же кнопку телефона, что и в мобильной шапке. */
@media (min-width: 1024px) {
    .header-address {
        display: block;
        max-width: 230px;
        margin-left: 8px;
    }

    .header-phone {
        display: none;
    }

    .header-mobile-phone {
        display: inline-flex;
        margin-left: 18px;
        font-size: 15px;
    }
}

/* Нейтральная чёрная плитка фона: цвет остаётся только в акцентах. */
body {
    background-color: #080908;
    background-size: 44px 44px;
}

.beach-hero::after {
    background-image:
        linear-gradient(180deg, #080908 0%, rgba(8, 9, 8, .86) 18%, rgba(8, 9, 8, .57) 48%, rgba(8, 9, 8, .10) 82%, transparent 100%),
        linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
}

/* Нижний край баннера растворяется в основную сетку страницы. */
.beach-hero::before {
    content: "" !important;
    position: absolute;
    z-index: 3;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    display: block !important;
    width: auto;
    height: clamp(170px, 16vw, 310px);
    margin: 0 !important;
    pointer-events: none;
    transform: none !important;
    rotate: none !important;
    translate: none !important;
    scale: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    background-color: transparent !important;
    background-image:
        linear-gradient(180deg, transparent 0%, rgba(8, 9, 8, .34) 30%, rgba(8, 9, 8, .88) 77%, #080908 100%),
        linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
    background-size: auto, 44px 44px, 44px 44px;
}

/* Белая нижняя граница шапки. */
.site-header {
    border-bottom-color: rgba(255, 255, 255, .88);
}

/* Текущий раздел меню: салатовый текст и компактный индикатор. */
.nav a:not(.logo):not(.mobile-phone).is-current {
    position: relative;
    color: #9cff00;
}

.nav a:not(.logo):not(.mobile-phone).is-current::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -7px;
    left: 0;
    height: 2px;
    background: #9cff00;
    box-shadow: 0 0 10px rgba(156, 255, 0, .75);
}

@media (max-width: 1023px) {
    .nav a:not(.logo):not(.mobile-phone).is-current {
        background: #1c211a;
        border-left-color: #9cff00;
    }

    .nav a:not(.logo):not(.mobile-phone).is-current::after {
        display: none;
    }
}

/* Живой индикатор под заголовком. */
@keyframes hero-indicator-drift {
    from { transform: translateX(0); }
    to { transform: translateX(82px); }
}

.beach-hero__title::after {
    animation: hero-indicator-drift .85s ease-in-out infinite alternate;
}

@media (prefers-reduced-motion: reduce) {
    .beach-hero__title::after {
        animation: none;
    }
}

/* Полная навигация в подвале. */
.footer-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 20px;
    font-size: .79rem;
    font-weight: 800;
}

.footer-menu h3 {
    display: none;
}

.footer-menu a {
    display: inline;
    margin: 0;
    color: #e9eee5;
    transition: color .2s ease, transform .2s ease;
}

.footer-menu a:hover {
    color: #9cff00;
    transform: translateY(-2px);
}

@media (min-width: 1024px) {
    .footer-grid {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .footer-menu {
        flex: initial;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 20px;
        line-height: normal;
        white-space: nowrap;
        order: 2;
    }

    .footer-grid > div {
        order: 3;
        margin-left: auto;
        white-space: nowrap;
    }

    .footer-menu a {
        display: flex;
        align-items: center;
        min-height: auto;
        padding: 0;
    }
}

/* Единая сетка для навигации в шапке и подвале. */
@media (min-width: 1200px) {
    .header-inner,
    .footer-grid {
        display: grid;
        grid-template-columns: 120px minmax(0, 1fr) 198px;
        align-items: center;
        gap: 18px;
    }

    .header-inner .nav,
    .footer-menu {
        grid-column: 2;
        justify-self: end;
        margin-left: 0;
    }

    .header-mobile-phone,
    .footer-grid > div {
        grid-column: 3;
        justify-self: end;
        margin-left: 0;
    }
}

.footer-menu a.is-current {
    position: relative;
    color: #9cff00;
}

.footer-menu a.is-current::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -7px;
    left: 0;
    height: 2px;
    background: #9cff00;
    box-shadow: 0 0 10px rgba(156, 255, 0, .75);
}

/* Карточка товара: единая линия цены и доставки. */
.product-body .title {
    min-height: 63px;
}

.product-body .delivery {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin: 14px 0 18px;
    padding: 8px 12px;
    color: #c8cec2;
    text-align: center;
    border: 1px solid rgba(230, 255, 210, .16);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .035), rgba(0, 0, 0, .24));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 8px 18px rgba(0, 0, 0, .16);
}

.product-body .delivery span {
    margin-left: 5px;
    color: #9cff00;
    font-weight: 800;
}

.product-body .weight {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 32px;
    margin-bottom: 10px;
    padding: 6px 10px;
    color: #d7ddd0;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.1;
    border: 1px solid rgba(230, 255, 210, .17);
    border-left: 3px solid #9cff00;
    border-radius: 6px;
    background:
        linear-gradient(90deg, rgba(156, 255, 0, .28), rgba(156, 255, 0, .05)) 0 0 / 0% 100% no-repeat,
        linear-gradient(90deg, rgba(156, 255, 0, .08), rgba(255, 255, 255, .025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
    animation: weight-battery-charge 4.2s ease-in-out infinite;
}

.product-body .weight::after {
    position: absolute;
    right: 3px;
    bottom: 12px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 8px rgba(156, 255, 0, .9);
    content: '';
    animation: weight-battery-light 4.2s ease-in-out infinite;
}

@keyframes weight-battery-charge {
    0%, 10% { background-size: 0% 100%, auto; }
    58%, 74% { background-size: 100% 100%, auto; }
    100% { background-size: 0% 100%, auto; }
}

@keyframes weight-battery-light {
    0%, 10%, 100% { opacity: .22; transform: scale(.75); }
    58%, 74% { opacity: 1; transform: scale(1.2); }
}

.product-body .price-row span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 10px;
    color: #d8ddd3;
    font-size: .9rem;
    font-weight: 700;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 7px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(0, 0, 0, .18));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}

.product-body .price-row span::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 7px;
    border-radius: 50%;
    background: #9cff00;
    box-shadow: 0 0 8px rgba(156, 255, 0, .8);
}

/* Живые космические эффекты первого экрана. */
.beach-hero .hero-fx {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.hero-fx--stars {
    inset: 0;
    opacity: .55;
    background-image:
        radial-gradient(circle at 8% 18%, #fff 0 1px, transparent 1.8px),
        radial-gradient(circle at 24% 66%, rgba(156, 255, 0, .9) 0 1px, transparent 1.8px),
        radial-gradient(circle at 51% 28%, #fff 0 1px, transparent 1.7px),
        radial-gradient(circle at 76% 17%, rgba(156, 255, 0, .8) 0 1.2px, transparent 2px),
        radial-gradient(circle at 91% 55%, #fff 0 1px, transparent 1.7px);
    animation: hero-stars-flicker 2.8s ease-in-out infinite alternate;
}

.hero-fx--beam {
    top: -30%;
    right: 10%;
    width: 15%;
    height: 160%;
    opacity: .24;
    transform: rotate(20deg);
    background: linear-gradient(90deg, transparent, rgba(156, 255, 0, .7), transparent);
    filter: blur(7px);
    animation: hero-beam-sweep 3.6s ease-in-out infinite alternate;
}

.hero-fx--scan {
    right: 0;
    bottom: 10%;
    left: 0;
    height: 1px;
    opacity: .7;
    background: linear-gradient(90deg, transparent, rgba(156, 255, 0, .95), transparent);
    box-shadow: 0 0 14px rgba(156, 255, 0, .65);
    animation: hero-scanline 4.4s linear infinite;
}

@keyframes hero-stars-flicker {
    from { opacity: .28; transform: translateY(0); }
    to { opacity: .68; transform: translateY(-6px); }
}

@keyframes hero-beam-sweep {
    from { translate: -120px 0; opacity: .08; }
    to { translate: 170px 0; opacity: .34; }
}

@keyframes hero-scanline {
    from { transform: translateY(0); opacity: .1; }
    20% { opacity: .8; }
    to { transform: translateY(-520px); opacity: .05; }
}

@media (prefers-reduced-motion: reduce) {
    .beach-hero .hero-fx {
        animation: none;
    }
}

/* Космическое поле каталога. */
.catalog-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 82% 16%, rgba(123, 255, 0, .18), transparent 26%),
        radial-gradient(ellipse at 12% 72%, rgba(62, 100, 28, .2), transparent 31%),
        linear-gradient(90deg, rgba(8, 9, 8, .32), rgba(8, 9, 8, .12) 55%, rgba(8, 9, 8, .24));
}

.catalog-hero > .container {
    position: relative;
    z-index: 2;
}

.catalog-hero--plain {
    padding-top: 38px;
    background: #000;
}

.catalog-page-title {
    margin: 0 0 28px;
}

.catalog-hero .catalog-transition {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 0;
    left: 0;
    height: clamp(160px, 16vw, 300px);
    pointer-events: none;
    background: linear-gradient(180deg, transparent 0%, rgba(8, 9, 8, .38) 36%, #080908 100%);
}

.catalog-hero::before,
.catalog-hero::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.catalog-hero::before {
    inset: 0;
    opacity: .8;
    background-image:
        radial-gradient(circle at 5% 15%, #fff 0 1px, transparent 1.8px),
        radial-gradient(circle at 16% 42%, rgba(156,255,0,.9) 0 1px, transparent 1.7px),
        radial-gradient(circle at 31% 8%, #fff 0 1px, transparent 1.8px),
        radial-gradient(circle at 48% 58%, #fff 0 1px, transparent 1.7px),
        radial-gradient(circle at 63% 24%, rgba(156,255,0,.85) 0 1px, transparent 1.8px),
        radial-gradient(circle at 77% 66%, #fff 0 1px, transparent 1.7px),
        radial-gradient(circle at 91% 36%, #fff 0 1px, transparent 1.8px);
    animation: catalog-stars-flicker 3.2s ease-in-out infinite alternate;
}

.catalog-hero::after {
    top: -70%;
    right: 16%;
    width: 22%;
    height: 220%;
    opacity: .46;
    transform: rotate(28deg);
    background: linear-gradient(90deg, transparent, rgba(156,255,0,.7), transparent);
    filter: blur(10px);
    animation: catalog-hyperspace 5s ease-in-out infinite alternate;
}

.catalog-hero .hero__sun,
.catalog-hero .hero__bubble {
    position: absolute;
    z-index: 0;
    display: block;
    pointer-events: none;
    border-radius: 50%;
}

.catalog-hero .hero__sun {
    top: 16%;
    right: -150px;
    width: 430px;
    height: 430px;
    opacity: .5;
    background: radial-gradient(circle, rgba(156,255,0,.36) 0%, rgba(93,178,0,.13) 31%, transparent 69%);
    filter: blur(3px);
    animation: catalog-nebula-pulse 4.6s ease-in-out infinite alternate;
}

.catalog-hero .hero__bubble {
    bottom: 8%;
    left: -90px;
    width: 260px;
    height: 260px;
    opacity: .3;
    border: 1px solid rgba(230,255,210,.26);
    background: radial-gradient(circle at 36% 31%, rgba(255,255,255,.16), rgba(156,255,0,.07) 26%, rgba(0,0,0,.1) 54%, transparent 70%);
    box-shadow: 0 0 70px rgba(156,255,0,.13), inset -24px -18px 35px rgba(0,0,0,.42);
    animation: catalog-orbit 13s linear infinite;
}

.catalog-hero .first-grid::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 10%;
    right: -24%;
    width: 64%;
    height: 1px;
    pointer-events: none;
    opacity: .55;
    transform: rotate(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.8), rgba(156,255,0,.95), transparent);
    box-shadow: 0 0 16px rgba(156,255,0,.7), 0 0 34px rgba(156,255,0,.35);
    animation: catalog-comet 4.8s ease-in-out infinite;
}

@keyframes catalog-stars-flicker {
    from { opacity: .35; transform: translateY(0); }
    to { opacity: .9; transform: translateY(-12px); }
}

@keyframes catalog-hyperspace {
    from { translate: -160px 0; opacity: .08; }
    to { translate: 230px 0; opacity: .36; }
}

@keyframes catalog-nebula-pulse {
    from { scale: .85; opacity: .18; }
    to { scale: 1.16; opacity: .48; }
}

@keyframes catalog-orbit {
    to { transform: rotate(360deg); }
}

@keyframes catalog-comet {
    0%, 100% { translate: 38% -70px; opacity: 0; }
    18% { opacity: .65; }
    52% { translate: -118% 370px; opacity: .82; }
    72% { opacity: 0; }
}

@media (min-width: 1024px) {
    .catalog-hero {
        background-position: center, center, center, 62% center;
    }

    .catalog-hero::before {
        opacity: 1;
    }

    .catalog-hero .hero__sun {
        opacity: .62;
    }
}

@media (prefers-reduced-motion: reduce) {
    .catalog-hero::before,
    .catalog-hero::after,
    .catalog-hero .hero__sun,
    .catalog-hero .hero__bubble,
    .catalog-hero .first-grid::after {
        animation: none;
    }
}

/* Фоны подключаются через Image::render(), а не CSS url(). */
.beach-hero {
    background: #080908 !important;
}

.beach-hero__background,
.catalog-background {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.beach-hero__background picture,
.beach-hero__background-image,
.catalog-background picture,
.catalog-background-image {
    display: block;
    width: 100%;
    height: 100%;
}

.beach-hero__background-image,
.catalog-background-image {
    object-fit: cover;
}

.beach-hero__background-image {
    object-position: center;
}


/* Горящие линзы тёмного генерала: эффект расположен поверх hero-иллюстрации. */
.beach-hero__general-eyes {
    position: absolute;
    z-index: 1;
    top: 25.8%;
    left: 72.05%;
    width: 27px;
    height: 9px;
    transform: rotate(-3deg);
    filter: drop-shadow(0 0 5px rgba(255, 26, 26, .96));
    animation: general-eyes-burn 1.7s ease-in-out infinite alternate;
}

.beach-hero__general-eyes i {
    position: absolute;
    top: 1px;
    display: block;
    width: 10px;
    height: 5px;
    background: #ff2424;
    border-radius: 70% 30% 60% 35%;
    box-shadow: 0 0 3px #fff1e8, 0 0 9px #ff2020, 0 0 17px rgba(255, 0, 0, .72);
}

.beach-hero__general-eyes i:first-child {
    left: 1px;
    transform: skewX(-18deg);
}

.beach-hero__general-eyes i:last-child {
    right: 1px;
    transform: skewX(18deg) scaleX(-1);
}

@keyframes general-eyes-burn {
    from { opacity: .74; filter: drop-shadow(0 0 3px rgba(255, 24, 24, .68)); }
    to { opacity: 1; filter: drop-shadow(0 0 9px rgba(255, 32, 32, 1)); }
}

@media (max-width: 767px) {
    .beach-hero__general-eyes {
        top: 28%;
        left: 86.5%;
        transform: translateX(-50%) scale(.68) rotate(-3deg);
    }
}

/* В узком окне кадр фоновой иллюстрации смещается вправо, поэтому линзы
   привязаны к лицу генерала, а не к прежней desktop-координате. */
@media (max-width: 900px) {
    .beach-hero__general-eyes {
        top: 20.5%;
        left: 90.5%;
        transform: translateX(-50%) scale(.68) rotate(-3deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .beach-hero__general-eyes { animation: none; }
}

.catalog-background-image {
    object-position: 62% center;
}

.catalog-hero {
    background:
        radial-gradient(ellipse at 82% 16%, rgba(123, 255, 0, .18), transparent 26%),
        radial-gradient(ellipse at 12% 72%, rgba(62, 100, 28, .2), transparent 31%),
        linear-gradient(90deg, rgba(8, 9, 8, .32), rgba(8, 9, 8, .12) 55%, rgba(8, 9, 8, .24));
}

@media (max-width: 767px) {
    .beach-hero__background-image {
        object-position: 64% center;
    }

}

/* Карточки товаров: цельный чёрный фон для читаемости контента. */
.product-card {
    background: #000;
    backdrop-filter: none;
}

.product-image,
.product-body {
    background: transparent;
}

.product-image {
    border-bottom-color: rgba(156, 255, 0, .28);
}

/* Материал под главным баннером. */
.seo-content {
    position: relative;
    overflow: hidden;
}

.seo-content .section-head {
    display: block;
    margin-bottom: 28px;
}

.seo-content .section-head .eyebrow {
    margin: 0 0 12px;
}

.seo-content .section-head h2 {
    max-width: 900px;
}

.seo-content::before {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
}

.seo-content__body {
    position: relative;
    display: grid;
    gap: 20px;
    padding: clamp(24px, 4vw, 52px);
    border: 0;
    background: rgba(9, 12, 8, .72);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.seo-content__body h3 {
    margin: 20px 0 -4px;
    color: var(--text);
    font-size: clamp(22px, 2.4vw, 32px);
    line-height: 1.12;
}

.seo-content__body p,
.seo-content__body li {
    color: var(--muted);
    font-size: 17px;
    line-height: 1.72;
}

.seo-content__body p,
.seo-content__body ul,
.seo-content__body ol,
.seo-content__body h3 {
    margin: 0;
}

.seo-content__body ul,
.seo-content__body ol {
    display: grid;
    gap: 10px;
    padding-left: 24px;
}

.seo-content__body li::marker {
    color: var(--accent);
    font-weight: 800;
}

.text-strong {
    font-weight: 700;
}

.seo-content__body .text-strong {
    color: var(--text);
}

.seo-content__spoiler {
    margin-top: 4px;
}

/* Keep the long SEO content closed until the native details control is opened. */
.seo-content__spoiler:not([open]) > :not(summary) {
    display: none;
}

.seo-content__spoiler[open] > :not(summary) {
    margin-top: 20px;
}

.seo-content__spoiler summary {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    cursor: pointer;
    color: var(--accent);
    font-weight: 800;
    list-style: none;
}

.seo-content__spoiler summary::-webkit-details-marker {
    display: none;
}

.seo-content__spoiler summary::after {
    margin-left: 10px;
    content: '+';
    font-size: 20px;
    line-height: 1;
}

.seo-content__spoiler[open] summary::after {
    content: '−';
}

.seo-note {
    margin: 4px 0;
    padding: 18px 20px;
    color: #e5ebdf;
    line-height: 1.6;
    border-left: 3px solid var(--accent);
    background: linear-gradient(90deg, rgba(156, 255, 0, .12), rgba(156, 255, 0, .02));
}

/* Статус наличия в карточке товара. */
.product-image .badge {
    top: 16px;
    left: 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px 8px 10px;
    border: 1px solid rgba(168, 255, 74, .54);
    border-radius: 999px;
    background: rgba(7, 10, 6, .78);
    color: #eff8e9;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .03em;
    line-height: 1;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .08);
    backdrop-filter: blur(8px);
}

.product-image .badge::before {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 4px rgba(156, 255, 0, .16), 0 0 12px rgba(156, 255, 0, .84);
    animation: availability-indicator 3.2s ease-in-out infinite;
    content: "";
}

@keyframes availability-indicator {
    0%, 100% {
        opacity: .48;
        box-shadow: 0 0 0 3px rgba(156, 255, 0, .09), 0 0 7px rgba(156, 255, 0, .35);
        transform: scale(.88);
    }

    50% {
        opacity: 1;
        box-shadow: 0 0 0 5px rgba(156, 255, 0, .2), 0 0 16px rgba(156, 255, 0, .95);
        transform: scale(1.08);
    }
}

/* Единая предметная подача аксессуаров и упаковки. */
.product-image {
    isolation: isolate;
    min-height: 0;
    padding-top: 0;
    aspect-ratio: 640 / 430;
    background:
        radial-gradient(circle at 50% 76%, rgba(156, 255, 0, .18), transparent 32%),
        radial-gradient(circle at 50% 35%, rgba(255, 255, 255, .055), transparent 48%),
        #050705;
}

.product-image::before {
    display: none;
}

.product-image img,
.product-image picture {
    position: relative;
    z-index: 1;
}

.product-image picture {
    display: block;
    width: 100%;
    height: 100%;
}

.product-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: contain;
    padding: 0;
    filter: drop-shadow(0 18px 20px rgba(0, 0, 0, .45));
}

.product-image img[src*="goldgaz-balloons-gemar"] {
    mix-blend-mode: multiply;
}

.product-image .badge {
    z-index: 2;
}

.product-card__link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.product-card__link:focus-visible,
.product-title-link:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
}

.product-title-link {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: color .2s ease;
}

.product-title-link:hover {
    color: var(--accent);
}

.product-page {
    padding-top: clamp(40px, 7vw, 100px);
    padding-bottom: clamp(64px, 9vw, 130px);
}

.site-breadcrumbs {
    position: relative;
    z-index: 3;
    border-bottom: 1px solid rgba(227, 239, 220, .13);
    background: rgba(5, 7, 5, .94);
}

.site-breadcrumbs ol {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    min-height: 42px;
    margin: 0;
    padding: 0;
    color: var(--muted);
    font-size: 13px;
    list-style: none;
}

.site-breadcrumbs a {
    color: var(--accent);
    text-decoration: none;
}

.site-breadcrumbs a:hover {
    color: var(--text);
}

.product-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 26px;
    color: var(--muted);
    font-size: 14px;
}

.product-breadcrumbs a {
    color: var(--accent);
    text-decoration: none;
}

/* Blog */
.price-page {
    padding-top: clamp(42px, 7vw, 96px);
    padding-bottom: clamp(72px, 10vw, 138px);
}

.price-hero {
    width: 100%;
    margin: 0 0 clamp(38px, 6vw, 72px);
    padding: clamp(28px, 5vw, 58px);
    border: 1px solid rgba(156, 255, 0, .4);
    background: linear-gradient(120deg, rgba(8, 14, 7, .98), rgba(18, 34, 12, .84));
    box-shadow: 22px 24px 0 rgba(156, 255, 0, .1);
}

.price-hero h1 {
    margin: 10px 0 20px;
    font-size: clamp(38px, 6vw, 82px);
    line-height: .94;
    text-transform: uppercase;
}

.price-hero > p:last-child {
    max-width: 920px;
    margin: 0;
    color: var(--muted);
    font-size: clamp(17px, 2vw, 22px);
    line-height: 1.55;
}

.price-list {
    border: 1px solid rgba(240, 255, 226, .16);
    background: #000;
}

.price-list--other { margin-top: clamp(28px, 5vw, 54px); }

.price-list__heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    padding: 28px clamp(22px, 3vw, 42px);
    border-bottom: 1px solid rgba(156, 255, 0, .3);
}

.price-list__heading h2 { margin: 0; font-size: clamp(28px, 3.2vw, 46px); text-transform: uppercase; }
.price-list__heading span { color: var(--muted); font-size: 14px; }
.price-list__labels,
.price-list__row {
    display: grid;
    /* Колонки заголовка и строки имеют одну геометрию — значения не съезжают. */
    grid-template-columns: minmax(150px, 1.45fr) minmax(72px, .62fr) minmax(118px, .92fr) minmax(118px, .92fr) minmax(88px, .68fr) minmax(92px, auto);
    align-items: center;
    gap: clamp(10px, 1.4vw, 18px);
}
.price-list__labels { padding: 16px clamp(22px, 3vw, 42px); border-bottom: 1px solid rgba(240, 255, 226, .12); color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.price-list__labels span { min-width: 0; }
.price-list__row { min-height: 104px; padding: 18px clamp(22px, 3vw, 42px); border-bottom: 1px solid rgba(240, 255, 226, .1); transition: background .2s ease; }
.price-list__row:last-child { border-bottom: 0; }
.price-list__row:hover { background: linear-gradient(90deg, rgba(156, 255, 0, .1), transparent 54%); }
.price-list__row [role="cell"] { color: var(--muted); }
.price-list__row .text-strong { color: var(--text); font-size: clamp(18px, 2vw, 25px); }
.price-list__product a { color: var(--text); font-size: clamp(18px, 2vw, 25px); font-weight: 900; line-height: 1.08; text-decoration: none; }
.price-list__product a:hover { color: var(--accent); }
.price-list__accent { color: var(--accent) !important; }
.price-list__action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 16px; border: 1px solid rgba(156, 255, 0, .75); background: var(--accent); box-shadow: 0 5px 0 #487d00; color: #071000; font-size: 12px; font-weight: 900; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; transition: transform .2s ease, box-shadow .2s ease; }
.price-list__action:hover { color: #071000; transform: translateY(-2px); box-shadow: 0 7px 0 #487d00; }
.price-list__action:active { transform: translateY(3px); box-shadow: 0 2px 0 #487d00; }
.price-list__mobile-label { display: none; }

/* Contacts */
.contacts-page { padding-top: clamp(42px, 7vw, 96px); padding-bottom: 0; }
.contacts-hero { max-width: 100%; margin: 0 0 clamp(34px, 5vw, 64px); padding: clamp(28px, 5vw, 58px); border: 1px solid rgba(156, 255, 0, .4); background: linear-gradient(120deg, rgba(8, 14, 7, .98), rgba(18, 34, 12, .84)); box-shadow: 22px 24px 0 rgba(156, 255, 0, .1); }
.contacts-hero h1 { margin: 10px 0 20px; font-size: clamp(42px, 7vw, 86px); line-height: .94; text-transform: uppercase; }
.contacts-hero > p:last-child { max-width: 920px; margin: 0; color: var(--muted); font-size: clamp(17px, 2vw, 22px); line-height: 1.55; }
.contacts-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: clamp(58px, 8vw, 100px); }
.contacts-card { min-height: 242px; padding: 26px; border: 1px solid rgba(230, 244, 219, .2); background: linear-gradient(145deg, rgba(20, 26, 19, .98), rgba(5, 8, 5, .98)); box-shadow: inset 0 0 45px rgba(156, 255, 0, .035), 10px 12px 0 rgba(0, 0, 0, .16); }
.contacts-card__icon { display: grid; width: 43px; height: 43px; margin-bottom: 26px; place-items: center; border: 1px solid rgba(156, 255, 0, .68); border-radius: 50%; color: var(--accent); box-shadow: 0 0 20px rgba(156, 255, 0, .12); }
.contacts-card__icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.contacts-card__label { margin: 0 0 8px; color: var(--muted); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.contacts-card a, .contacts-card strong { display: block; min-height: 50px; color: var(--text); font-size: clamp(19px, 1.6vw, 25px); font-weight: 900; line-height: 1.12; text-decoration: none; overflow-wrap: anywhere; }
.contacts-card a:hover { color: var(--accent); }
.contacts-card > span:last-child { display: block; margin-top: 14px; color: var(--muted); font-size: 14px; line-height: 1.35; }
.contacts-card--hours strong { color: var(--accent); }
.contacts-map { width: 100vw; margin-left: calc(50% - 50vw); border-top: 1px solid rgba(156, 255, 0, .36); border-bottom: 1px solid rgba(156, 255, 0, .36); background: #050705; }
.contacts-map iframe { display: block; width: 100%; height: min(54vw, 560px); min-height: 360px; border: 0; filter: grayscale(.75) contrast(1.2) brightness(.7) hue-rotate(42deg); }

@media (max-width: 880px) {
    .price-list__labels { display: none; }
    .price-list__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 22px; }
    .price-list__product { grid-column: 1 / -1; }
    .price-list__mobile-label { display: block; margin-bottom: 4px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
    .price-list__action { grid-column: 1 / -1; width: fit-content; }
    .contacts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 540px) {
    .price-hero { box-shadow: 12px 13px 0 rgba(156, 255, 0, .1); }
    .price-list__heading { align-items: start; flex-direction: column; gap: 8px; }
    .price-list__row { grid-template-columns: 1fr; }
    .price-list__product, .price-list__action { grid-column: auto; }
    .price-list__action { width: 100%; }
    .contacts-hero { box-shadow: 12px 13px 0 rgba(156, 255, 0, .1); }
    .contacts-grid { grid-template-columns: 1fr; }
    .contacts-card { min-height: 0; }
    .contacts-map iframe { min-height: 330px; height: 105vw; }
}

.blog-page,
.blog-article-page {
    padding-top: clamp(42px, 7vw, 96px);
    padding-bottom: clamp(72px, 10vw, 138px);
}

.blog-hero {
    width: 100%;
    max-width: none;
    margin: 0 0 clamp(54px, 8vw, 100px);
    padding: clamp(28px, 5vw, 60px);
    border: 1px solid rgba(156, 255, 0, .35);
    background: linear-gradient(120deg, rgba(7, 10, 7, .96), rgba(19, 34, 10, .78));
    box-shadow: 22px 24px 0 rgba(156, 255, 0, .1);
}

.blog-hero h1,
.blog-article h1 {
    margin: 10px 0 20px;
    font-size: clamp(38px, 6vw, 82px);
    line-height: .95;
    text-transform: uppercase;
}

@media (min-width: 769px) {
    .blog-article h1 {
        font-size: 60px;
    }
}

.blog-hero > p:last-child {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.55;
}

.blog-cluster + .blog-cluster { margin-top: clamp(64px, 9vw, 120px); }

.blog-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 clamp(34px, 5vw, 58px);
}

.blog-categories a {
    padding: 11px 15px;
    color: var(--text);
    font-weight: 750;
    line-height: 1.1;
    text-decoration: none;
    border: 1px solid rgba(226, 236, 220, .2);
    background: rgba(8, 12, 8, .76);
    transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}

.blog-categories a:hover,
.blog-categories a.is-active {
    color: #071000;
    border-color: var(--accent);
    background: var(--accent);
}

.blog-categories a:hover { transform: translateY(-2px); }

.whatsapp-float {
    position: fixed;
    z-index: 71;
    right: clamp(18px, 2vw, 32px);
    bottom: clamp(18px, 2vw, 32px);
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .26);
    animation: whatsapp-pulse 1.8s ease-out infinite;
    transition: transform .2s ease, box-shadow .2s ease;
}

.whatsapp-float img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.whatsapp-float:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .46), 0 0 20px rgba(37, 211, 102, .42);
}

.whatsapp-float:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 4px;
}

.phone-float {
    position: fixed;
    z-index: 72;
    right: clamp(18px, 2vw, 32px);
    bottom: calc(clamp(18px, 2vw, 32px) + 78px);
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    overflow: hidden;
    box-sizing: border-box;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .26);
    animation: whatsapp-pulse 1.8s ease-out infinite;
    transition: transform .2s ease, box-shadow .2s ease;
}

.phone-float img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.phone-float:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .46), 0 0 20px rgba(156, 255, 0, .38);
}

.phone-float:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 4px;
}

@keyframes whatsapp-pulse {
    0%, 58%, 100% { box-shadow: 0 10px 28px rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .26), 0 0 0 0 rgba(37, 211, 102, .64); }
    72% { box-shadow: 0 10px 28px rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .26), 0 0 0 22px rgba(37, 211, 102, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .whatsapp-float,
    .phone-float { animation: none; }
}

@media (max-width: 700px) {
    .whatsapp-float {
        right: 16px;
        bottom: 16px;
        width: 56px;
        height: 56px;
    }

    .phone-float {
        right: 16px;
        bottom: 84px;
        width: 56px;
        height: 56px;
    }
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.blog-feed__status {
    min-height: 26px;
    margin: 28px 0 0;
    color: var(--muted);
    text-align: center;
}

.blog-feed__sentinel {
    height: 1px;
    margin-top: 1px;
}

.blog-card {
    display: flex;
    min-height: 250px;
    flex-direction: column;
    padding: 26px;
    border: 1px solid rgba(226, 236, 220, .18);
    background: linear-gradient(145deg, rgba(10, 14, 10, .94), rgba(13, 20, 11, .8));
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.blog-card__image {
    display: block;
    margin: -26px -26px 22px;
    overflow: hidden;
    border-bottom: 1px solid rgba(156, 255, 0, .32);
    background: #050705;
}

.blog-card__image picture,
.blog-card__cover {
    display: block;
    width: 100%;
}

.blog-card__cover {
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform .45s ease, filter .3s ease;
}

.blog-card:hover .blog-card__cover { transform: scale(1.035); filter: saturate(1.08); }

.blog-card:hover {
    transform: translateY(-5px);
    border-color: rgba(156, 255, 0, .62);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .3), 0 0 28px rgba(156, 255, 0, .08);
}

.blog-card__key {
    margin: 0 0 16px;
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.blog-card h3 { margin: 0; font-size: clamp(20px, 2vw, 28px); line-height: 1.08; }
.blog-card h3 a { color: var(--text); text-decoration: none; }
.blog-card h3 a:hover { color: var(--accent); }
.blog-card > p:not(.blog-card__key) { color: var(--muted); line-height: 1.48; }
.blog-card__excerpt {
    min-height: calc(1.48em * 4);
    margin-bottom: 24px;
}
.blog-card__more { margin-top: auto; color: var(--accent); font-weight: 800; text-decoration: none; text-transform: uppercase; }
.blog-card__more span { display: inline-block; margin-left: 6px; transition: transform .2s ease; }
.blog-card__more:hover span { transform: translate(3px, -3px); }

.blog-article-wrap { max-width: none; }
.blog-article {
    overflow: hidden;
    border: 1px solid rgba(226, 236, 220, .18);
    background: rgba(7, 10, 7, .9);
    box-shadow: 0 26px 70px rgba(0, 0, 0, .28);
}

.blog-article__header { padding: clamp(30px, 6vw, 72px) clamp(24px, 6vw, 76px) clamp(26px, 5vw, 56px); background: radial-gradient(circle at 85% 0, rgba(156, 255, 0, .15), transparent 36%), linear-gradient(135deg, #0e160c, #080a08); }
.blog-article__cover { margin-top: clamp(25px, 4vw, 48px); overflow: hidden; border: 1px solid rgba(156, 255, 0, .3); background: #050705; }
.blog-article__cover picture, .blog-article__image { display: block; width: 100%; }
.blog-article__image { aspect-ratio: 16 / 9; object-fit: cover; }
@media (min-width: 769px) {
    .blog-article__cover { width: 33.333%; }
}
.blog-article__body { padding: clamp(24px, 6vw, 76px); font-size: clamp(16px, 1.5vw, 19px); line-height: 1.7; }
.blog-article__body h2 { margin: 52px 0 18px; font-size: clamp(26px, 3.4vw, 42px); line-height: 1.08; }
.blog-article__body p { margin: 0 0 20px; }
.blog-article__body table { width: 100%; margin: 28px 0; border-collapse: collapse; background: rgba(4, 8, 4, .72); }
.blog-article__body th, .blog-article__body td { padding: 12px 14px; border: 1px solid rgba(207, 255, 76, .32); text-align: left; vertical-align: top; }
.blog-article__body th { color: #b5ff27; font-weight: 800; }
.blog-article__lead { margin-bottom: 30px !important; color: var(--text); font-size: clamp(19px, 2.1vw, 24px); line-height: 1.55; }
.blog-article__lead a { color: var(--accent); font-weight: 800; }
.blog-article__list { display: grid; gap: 10px; margin: 0 0 22px; padding: 24px 24px 24px 46px; border-left: 3px solid var(--accent); background: rgba(156, 255, 0, .055); }
.blog-article__faq { display: grid; gap: 12px; }
.blog-article__faq div { padding: 18px 20px; border: 1px solid rgba(226, 236, 220, .16); background: rgba(255, 255, 255, .02); }
.blog-article__faq dt { margin-bottom: 7px; color: var(--accent); font-weight: 800; }
.blog-article__faq dd { margin: 0; color: var(--muted); }
.blog-article__notice { margin: 42px 0; padding: 22px 24px; border: 1px solid rgba(156, 255, 0, .45); background: rgba(156, 255, 0, .09); }
.blog-related { margin-top: 58px; padding-top: 30px; border-top: 1px solid rgba(226, 236, 220, .18); }
.blog-related h2 { margin: 0 0 16px; }
.blog-related div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.blog-related a { padding: 14px; border: 1px solid rgba(156, 255, 0, .25); color: var(--text); font-size: 14px; line-height: 1.35; text-decoration: none; }
.blog-related a:hover { border-color: var(--accent); color: var(--accent); }

@media (max-width: 900px) {
    .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
    .blog-grid, .blog-related div { grid-template-columns: 1fr; }
    .blog-card { min-height: 0; padding: 22px; }
    .blog-card__image { margin: -22px -22px 20px; }
    .blog-hero { box-shadow: 12px 13px 0 rgba(156, 255, 0, .1); }
    .blog-article__body h2 { margin-top: 40px; }
}

.product-detail {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
    overflow: hidden;
    border: 1px solid rgba(226, 236, 220, .18);
    background: rgba(8, 10, 7, .8);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .35);
}

.product-detail__media {
    display: grid;
    min-height: 460px;
    place-items: center;
    padding: clamp(8px, 1.25vw, 20px);
    background: radial-gradient(circle at 50% 72%, rgba(156, 255, 0, .18), transparent 34%), #050705;
}

.product-detail__media picture,
.product-detail__media img { width: 100%; }

.product-image-slider { width: 100%; max-width: 760px; overflow: hidden; }
.product-image-slider__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.product-image-slider__track::-webkit-scrollbar { display: none; }
.product-image-slider__item { display: grid; flex: 0 0 100%; min-width: 0; margin: 0; place-items: center; scroll-snap-align: start; }
.product-image-slider__item picture,
.product-image-slider__item img { width: 100%; }
.product-image-slider__dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.product-image-slider__dot { width: 9px; height: 9px; padding: 0; border: 1px solid var(--accent); border-radius: 50%; background: transparent; cursor: pointer; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.product-image-slider__dot:hover, .product-image-slider__dot.is-active { background: var(--accent); box-shadow: 0 0 12px rgba(156,255,0,.8); transform: scale(1.2); }

.product-detail__placeholder {
    width: min(64%, 300px);
    aspect-ratio: 1;
    border: 1px solid rgba(156, 255, 0, .38);
    border-radius: 50%;
    background: radial-gradient(circle at 38% 32%, rgba(255, 255, 255, .18), transparent 8%), radial-gradient(circle, rgba(156, 255, 0, .18), rgba(5, 7, 5, .2) 62%);
    box-shadow: 0 0 0 26px rgba(156, 255, 0, .035), 0 28px 42px rgba(0, 0, 0, .42);
}

.product-detail__media img {
    display: block;
    aspect-ratio: 640 / 430;
    object-fit: contain;
    filter: drop-shadow(0 24px 28px rgba(0, 0, 0, .52));
}

.product-detail__info {
    align-self: center;
    padding: clamp(28px, 5vw, 64px);
}

.product-detail__info h1 {
    margin: 12px 0 30px;
    color: var(--text);
    font-size: clamp(34px, 4vw, 60px);
    line-height: .98;
}

.product-detail__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 0;
    border: 1px solid rgba(226, 236, 220, .15);
    background: rgba(226, 236, 220, .15);
}

.product-detail__specs div {
    padding: 16px;
    background: rgba(8, 10, 7, .96);
}

.product-detail__specs dt {
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 13px;
}

.product-detail__specs dd {
    margin: 0;
    color: var(--text);
    font-weight: 800;
}

.product-detail__text {
    margin: 24px 0;
    color: var(--muted);
    line-height: 1.6;
}

.product-detail__content {
    margin-top: 28px;
    padding: clamp(24px, 4vw, 52px);
    border: 1px solid rgba(226, 236, 220, .18);
    background: rgba(8, 10, 7, .8);
    color: var(--muted);
    line-height: 1.7;
}

.product-detail__content > :first-child { margin-top: 0; }
.product-detail__content > :last-child { margin-bottom: 0; }
.product-detail__content h1,
.product-detail__content h2,
.product-detail__content h3 { color: var(--text); }
.product-detail__content img { max-width: 100%; height: auto; }

.product-gallery { position: relative; margin-top: 28px; padding: clamp(24px, 4vw, 46px); border: 1px solid rgba(226, 236, 220, .18); background: rgba(8, 10, 7, .8); }
.product-gallery__head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.product-gallery__head .eyebrow { margin: 0 0 8px; }
.product-gallery__head h2 { margin: 0; font-size: clamp(28px, 4vw, 48px); }
.product-gallery__controls { position: absolute; top: 38px; right: clamp(24px, 4vw, 46px); display: flex; gap: 8px; }
.product-gallery__arrow { width: 44px; height: 42px; border: 1px solid var(--accent); background: #0b1009; color: var(--accent); font-size: 24px; font-weight: 900; cursor: pointer; transition: background .2s ease, color .2s ease, transform .2s ease; }
.product-gallery__arrow:hover { background: var(--accent); color: #071006; transform: translateY(-2px); }
.product-gallery__track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 42%); gap: 16px; overflow-x: auto; overscroll-behavior-x: contain; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-color: var(--accent) #10140e; padding: 2px 1px 14px; }
.product-gallery__item { overflow: hidden; margin: 0; scroll-snap-align: start; border: 1px solid rgba(156,255,0,.28); background: #000; }
.product-gallery__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
@media (max-width: 640px) { .product-gallery__head { padding-right: 98px; } .product-gallery__controls { top: 27px; right: 24px; } .product-gallery__track { grid-auto-columns: 84%; } }

/* Системная прокрутка в ночном салатовом стиле Azot24. */
html {
    scrollbar-color: var(--accent) #070907;
    scrollbar-width: thin;
}

::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    border-left: 1px solid rgba(156, 255, 0, .15);
    background: #070907;
}

::-webkit-scrollbar-thumb {
    min-height: 44px;
    border: 3px solid #070907;
    border-radius: 999px;
    background: linear-gradient(180deg, #b8ff43 0%, var(--accent) 48%, #70ce00 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35), 0 0 10px rgba(156, 255, 0, .4);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #d4ff7d 0%, #a9ff16 48%, #82e900 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55), 0 0 16px rgba(156, 255, 0, .68);
}

::-webkit-scrollbar-corner {
    background: #070907;
}

.inline-gallery-upload, .inline-slider-upload { display: grid; grid-template-columns: 1.1fr 1fr 1fr auto; gap: 10px; margin: 0 0 20px; padding: 14px; border: 1px dashed rgba(156,255,0,.55); background: rgba(4,8,3,.76); }
.product-detail__media > .inline-slider-upload { width: min(100%, 640px); margin: 16px 0 0; }
.inline-slider-manager { width: min(100%, 640px); margin-top: 16px; padding: 14px; border: 1px solid rgba(156,255,0,.34); background: rgba(4,8,3,.76); }
.inline-slider-manager h2 { margin: 0; font: 800 17px/1.2 Arial; letter-spacing: .02em; }
.inline-slider-manager > p { margin: 8px 0 12px; color: #b8c5b1; font: 14px/1.4 Arial; }
.inline-slider-manager__list { display: grid; gap: 10px; }
.inline-slider-manager__item { display: grid; grid-template-columns: 76px minmax(0,1fr) auto; gap: 10px; align-items: end; padding: 10px; border: 1px solid rgba(156,255,0,.24); background: #070b06; }
.inline-slider-manager__item > img { width: 76px; height: 58px; object-fit: cover; align-self: stretch; border: 1px solid rgba(156,255,0,.28); }
.inline-slider-manager__fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.inline-slider-manager__fields label { display: grid; gap: 5px; color: #d9ead1; font: 700 12px/1 Arial; }
.inline-slider-manager__fields input { width: 100%; min-width: 0; padding: 9px; border: 1px solid rgba(156,255,0,.45); background: #070b06; color: #fff; transition: width .18s ease, border-color .18s ease, box-shadow .18s ease; }
.inline-slider-manager__fields input:focus { position: relative; z-index: 3; width: min(420px, calc(100vw - 110px)); border-color: #9cff00; box-shadow: 0 0 0 2px rgba(156,255,0,.22), 0 10px 24px rgba(0,0,0,.48); outline: 0; }
.inline-slider-manager__actions { display: flex; gap: 6px; }
.inline-slider-manager__actions button { min-height: 36px; padding: 9px 11px; border: 1px solid #9cff00; background: #9cff00; color: #000; font: 800 13px Arial; cursor: pointer; }
.inline-slider-manager__actions button[data-move] { min-width: 36px; padding: 8px; background: transparent; color: #9cff00; }
.inline-slider-manager__actions button[data-primary] { background: transparent; color: #9cff00; }
.inline-slider-manager__actions button[data-delete] { min-width: 36px; padding: 8px; border-color: #d65858; background: transparent; color: #ff9b9b; font-size: 20px; line-height: 1; }
.inline-slider-manager__actions button:disabled { opacity: .3; cursor: not-allowed; }
.inline-slider-manager__empty { margin: 0; color: #b8c5b1; }
.inline-gallery-upload label, .inline-gallery-editor label, .inline-slider-upload label, .inline-slider-editor label { display: grid; gap: 5px; color: #d9ead1; font: 700 12px/1 Arial; }
.inline-gallery-upload input, .inline-gallery-editor input, .inline-slider-upload input, .inline-slider-editor input { min-width: 0; padding: 9px; border: 1px solid rgba(156,255,0,.45); background: #070b06; color: #fff; }
.inline-gallery-upload button, .inline-gallery-editor button, .inline-slider-upload button, .inline-slider-editor button { align-self: end; padding: 11px 13px; border: 1px solid #9cff00; background: #9cff00; color: #000; font: 800 13px Arial; cursor: pointer; }
.inline-gallery-editor, .inline-slider-editor { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; padding: 10px; border-top: 1px solid rgba(156,255,0,.26); background: #0a0e08; }
@media (max-width: 760px) { .inline-gallery-upload, .inline-gallery-editor, .inline-slider-upload, .inline-slider-editor { grid-template-columns: 1fr; } .inline-gallery-upload button, .inline-gallery-editor button, .inline-slider-upload button, .inline-slider-editor button { width: 100%; } .inline-slider-manager__item { grid-template-columns: 64px minmax(0,1fr); } .inline-slider-manager__item > img { width: 64px; height: 64px; } .inline-slider-manager__fields { grid-template-columns: 1fr; } .inline-slider-manager__actions { grid-column: 1 / -1; } }

.product-detail__buy {
    display: inline-flex;
}

.product-detail__prices {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.product-price {
    position: relative;
    overflow: hidden;
    padding: 16px 18px;
    border: 1px solid rgba(231, 245, 221, .18);
    background: rgba(7, 10, 6, .86);
}

.product-price::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 42px;
    height: 2px;
    background: var(--accent);
    content: '';
    animation: product-price-indicator 2.8s ease-in-out infinite alternate;
}

@keyframes product-price-indicator {
    from { transform: translateX(0); }
    to { transform: translateX(-92px); }
}

@media (prefers-reduced-motion: reduce) {
    .product-price::after { animation: none; }
}

.product-price span {
    display: block;
    margin-bottom: 7px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.product-price .text-strong {
    color: var(--text);
    font-size: clamp(25px, 3vw, 38px);
    line-height: 1;
}

.product-price--replacement .text-strong {
    color: var(--accent);
}

.product-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.product-detail__secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 24px;
    border: 1px solid rgba(156, 255, 0, .52);
    color: var(--text);
    font-weight: 800;
    text-decoration: none;
    transition: background .2s ease, color .2s ease;
}

.product-detail__secondary:hover {
    background: rgba(156, 255, 0, .14);
    color: var(--accent);
}

/* Акционные комплекты */
.promo-grid--offers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.promo-offer {
    position: relative;
    isolation: isolate;
    min-height: 420px;
    overflow: hidden;
    padding: clamp(26px, 3vw, 44px);
    border: 1px solid rgba(156, 255, 0, .42);
    background:
        radial-gradient(circle at 84% 22%, rgba(156, 255, 0, .2), transparent 22%),
        linear-gradient(140deg, #151b13 0%, #0a0d09 58%, #11190d 100%);
    box-shadow: inset 0 0 45px rgba(156, 255, 0, .04), 0 22px 45px rgba(0, 0, 0, .28);
    animation: promo-frame-glow 2.8s ease-in-out infinite;
}

.promo-offer::before,
.promo-offer::after {
    position: absolute;
    z-index: -1;
    content: '';
    pointer-events: none;
}

.promo-offer::before {
    inset: 0;
    opacity: .45;
    background-image: linear-gradient(rgba(156, 255, 0, .13) 1px, transparent 1px), linear-gradient(90deg, rgba(156, 255, 0, .13) 1px, transparent 1px);
    background-size: 32px 32px;
    mask-image: linear-gradient(90deg, transparent 0%, #000 35%, #000 100%);
}

.promo-offer::after {
    right: -92px;
    bottom: -110px;
    width: 300px;
    height: 300px;
    border: 1px solid rgba(156, 255, 0, .34);
    border-radius: 50%;
    box-shadow: 0 0 0 26px rgba(156, 255, 0, .025), 0 0 70px rgba(156, 255, 0, .14);
    animation: promo-orbit 8s linear infinite;
}

.promo-offer--trio {
    background:
        radial-gradient(circle at 76% 18%, rgba(187, 255, 83, .24), transparent 22%),
        linear-gradient(140deg, #17200f 0%, #080b07 60%, #10190c 100%);
}

.promo-offer__copy {
    position: relative;
    z-index: 3;
    max-width: 56%;
}

.promo-offer__copy .eyebrow {
    margin-bottom: 14px;
}

.promo-offer__copy h3 {
    margin: 0;
    color: var(--text);
    font-size: clamp(38px, 4vw, 64px);
    line-height: .92;
    text-shadow: 3px 0 0 rgba(156, 255, 0, .18);
}

.promo-offer__copy p:not(.eyebrow) {
    max-width: 320px;
    margin: 24px 0;
    color: var(--muted);
    line-height: 1.45;
}

.promo-offer__scan {
    position: absolute;
    z-index: 2;
    top: -10%;
    bottom: -10%;
    width: 80px;
    opacity: .64;
    background: linear-gradient(90deg, transparent, rgba(211, 255, 143, .7), transparent);
    transform: skewX(-20deg) translateX(-520px);
    animation: promo-scan 3.6s ease-in-out infinite;
    pointer-events: none;
}

.promo-offer__visual {
    position: absolute;
    z-index: 1;
    top: auto;
    right: 18px;
    bottom: 16px;
    width: min(42%, 250px);
    height: 220px;
    filter: drop-shadow(0 24px 20px rgba(0, 0, 0, .56));
}

.promo-offer__copy .btn {
    position: relative;
    z-index: 4;
    margin-top: 8px;
    white-space: nowrap;
}

.promo-offer__delivery {
    position: absolute;
    z-index: 4;
    bottom: clamp(24px, 3vw, 42px);
    left: clamp(26px, 3vw, 44px);
    margin: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}

.promo-offer__visual img {
    position: absolute;
    bottom: 0;
    width: 44%;
    height: auto;
    object-fit: contain;
    transform-origin: 50% 100%;
    will-change: transform, filter;
}

.promo-offer__visual--two img:nth-of-type(1) {
    left: 10%;
    transform: rotate(-10deg);
    animation: promo-cylinder-left 2.4s ease-in-out infinite;
}

.promo-offer__visual--two img:nth-of-type(2) {
    right: 8%;
    transform: rotate(10deg);
    animation: promo-cylinder-right 2.8s ease-in-out infinite .18s;
}

.promo-offer__visual--three img {
    width: 36%;
}

.promo-offer__visual--three img:nth-of-type(1) {
    left: 0;
    transform: rotate(-13deg) scale(.86);
    animation: promo-cylinder-left 2.6s ease-in-out infinite .1s;
}

.promo-offer__visual--three img:nth-of-type(2) {
    left: 32%;
    z-index: 2;
    transform: translateY(-7px);
    animation: promo-cylinder-center 2.3s ease-in-out infinite;
}

.promo-offer__visual--three img:nth-of-type(3) {
    right: 0;
    transform: rotate(13deg) scale(.86);
    animation: promo-cylinder-right 2.7s ease-in-out infinite .25s;
}

.promo-offer__orb {
    position: absolute;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 18px 5px rgba(156, 255, 0, .72);
}

.promo-offer__orb--one {
    top: 19%;
    left: 13%;
    width: 6px;
    height: 6px;
    animation: promo-spark 1.8s ease-in-out infinite;
}

.promo-offer__orb--two {
    top: 8%;
    right: 12%;
    width: 4px;
    height: 4px;
    animation: promo-spark 1.6s ease-in-out infinite .65s;
}

.promo-offer__price {
    position: absolute;
    z-index: 4;
    right: clamp(20px, 3vw, 42px);
    top: clamp(22px, 3vw, 38px);
    bottom: auto;
    min-width: 175px;
    padding: 12px 14px 10px;
    border: 1px solid rgba(156, 255, 0, .52);
    background: rgba(5, 8, 4, .82);
    box-shadow: 0 0 26px rgba(156, 255, 0, .18);
    text-align: right;
    animation: promo-price-pulse 2.2s ease-in-out infinite;
}

.promo-offer__price span {
    display: block;
    margin-bottom: 2px;
    color: var(--accent);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.promo-offer__price .text-strong {
    color: var(--text);
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    font-size: clamp(42px, 5vw, 74px);
    font-weight: 900;
    letter-spacing: .015em;
    line-height: .8;
}

.promo-offer__price small {
    color: var(--accent);
    font-family: Inter, Arial, sans-serif;
    font-size: .4em;
    vertical-align: top;
}

.promo-offer:hover .promo-offer__visual img {
    filter: brightness(1.2) drop-shadow(0 0 13px rgba(156, 255, 0, .38));
}

/* Отзывы и форма оценки. */
.review-stars { margin-bottom: 14px; color: var(--accent); font-size: 21px; letter-spacing: .11em; line-height: 1; text-shadow: 0 0 13px rgba(156, 255, 0, .32); }
.review-form-wrap { margin-top: 30px; padding: clamp(24px, 4vw, 42px); border: 1px solid rgba(156, 255, 0, .35); background: linear-gradient(135deg, rgba(18, 25, 14, .94), rgba(7, 10, 7, .94)); box-shadow: inset 0 0 45px rgba(156, 255, 0, .035), 0 22px 46px rgba(0, 0, 0, .22); }
.review-form-wrap h3 { margin: 0; color: var(--text); font-size: clamp(28px, 4vw, 46px); }
.review-form-wrap > div > p:last-child { color: var(--muted); }
.review-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 26px; }
.review-form > label { display: grid; gap: 8px; color: var(--muted); font-weight: 800; }
.review-form input, .review-form textarea { width: 100%; border: 1px solid rgba(184, 226, 124, .35); border-radius: 0; background: rgba(2, 4, 2, .65); color: var(--text); padding: 13px 14px; font: inherit; resize: vertical; }
.review-form input:focus, .review-form textarea:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
.review-form__wide { grid-column: 1 / -1; }
.review-form .btn { width: fit-content; }
.review-captcha { min-height: 78px; }

.inline-seo-panel { position: relative; z-index: 45; border-bottom: 1px solid rgba(156, 255, 0, .38); background: #050705; color: var(--text); }
.inline-seo-panel > .container { padding-block: 16px; }
.inline-seo-panel__fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.inline-seo-panel label { display: grid; gap: 6px; color: var(--accent); font: 800 12px/1 Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.inline-seo-panel input { width: 100%; min-width: 0; border: 1px solid rgba(156, 255, 0, .4); background: #0b0d0a; color: var(--text); padding: 10px 12px; font: 600 14px/1.3 Arial, sans-serif; }
.inline-seo-panel input:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
body.is-inline-admin .inline-seo-panel { margin-top: calc(var(--header-height) - 52px); padding-top: 40px; }
.review-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.review-rating { margin: 0; padding: 0; border: 0; }
.review-rating legend { margin-bottom: 8px; color: var(--muted); font-weight: 800; }
.review-rating > div { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.review-rating input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; }
.review-rating label { color: rgba(238, 245, 229, .28); font-size: 34px; line-height: 1; cursor: pointer; transition: color .18s ease, transform .18s ease; }
.review-rating input:checked ~ label, .review-rating label:hover, .review-rating label:hover ~ label { color: var(--accent); text-shadow: 0 0 14px rgba(156, 255, 0, .48); }
.review-rating label:hover { transform: translateY(-2px); }
.review-form-notice { margin: 18px 0 0; padding: 12px 14px; border-left: 3px solid; }
.review-form-notice.is-success { border-color: var(--accent); background: rgba(156, 255, 0, .08); }
.review-form-notice.is-error { border-color: #ff7c71; background: rgba(255, 87, 67, .08); }

@media (max-width: 560px) {
    .review-form { grid-template-columns: 1fr; }
}

@keyframes promo-frame-glow {
    0%, 100% { border-color: rgba(156, 255, 0, .36); box-shadow: inset 0 0 45px rgba(156, 255, 0, .04), 0 22px 45px rgba(0, 0, 0, .28); }
    50% { border-color: rgba(205, 255, 130, .85); box-shadow: inset 0 0 55px rgba(156, 255, 0, .1), 0 0 30px rgba(156, 255, 0, .13), 0 22px 45px rgba(0, 0, 0, .28); }
}

@keyframes promo-scan {
    0%, 18% { transform: skewX(-20deg) translateX(-520px); opacity: 0; }
    28% { opacity: .64; }
    62% { transform: skewX(-20deg) translateX(760px); opacity: .64; }
    70%, 100% { transform: skewX(-20deg) translateX(760px); opacity: 0; }
}

@keyframes promo-orbit { to { transform: rotate(360deg); } }
@keyframes promo-cylinder-left { 50% { transform: translate(-6px, -15px) rotate(-5deg) scale(1.04); } }
@keyframes promo-cylinder-right { 50% { transform: translate(7px, -20px) rotate(5deg) scale(1.04); } }
@keyframes promo-cylinder-center { 50% { transform: translateY(-24px) scale(1.06); } }
@keyframes promo-spark { 50% { opacity: .2; transform: scale(2.6); } }
@keyframes promo-price-pulse { 50% { transform: translateY(-3px); box-shadow: 0 0 38px rgba(156, 255, 0, .4); } }

@media (max-width: 900px) {
    .promo-grid--offers {
        grid-template-columns: 1fr;
    }

    .promo-offer__copy {
        max-width: 60%;
    }
}

@media (max-width: 560px) {
    .promo-offer {
        min-height: 620px;
    }

    .promo-offer__copy {
        position: static;
        max-width: 100%;
    }

    .promo-offer__copy > .eyebrow,
    .promo-offer__copy > h3,
    .promo-offer__copy > p:not(.eyebrow) {
        position: relative;
        z-index: 3;
    }

    .promo-offer__copy h3 {
        font-size: clamp(39px, 12vw, 59px);
    }

    .promo-offer__visual {
        top: auto;
        right: 22px;
        bottom: 200px;
        width: 48%;
        opacity: .82;
    }

    .promo-offer__price {
        top: auto;
        left: 26px;
        right: auto;
        bottom: 100px;
        text-align: left;
    }

    .promo-offer__copy .promo-offer__action {
        position: absolute;
        z-index: 5;
        right: 26px;
        bottom: 58px;
        left: 26px;
        display: inline-flex;
        justify-content: center;
        width: calc(100% - 52px);
        margin: 0;
    }

    .promo-offer__delivery {
        right: 26px;
        bottom: 24px;
        left: 26px;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .promo-offer,
    .promo-offer__scan,
    .promo-offer__visual img,
    .promo-offer__orb,
    .promo-offer__price,
    .product-image .badge::before {
        animation: none !important;
    }
}

.product-related {
    margin-top: clamp(64px, 9vw, 120px);
}

.product-related .section-heading {
    margin-bottom: 28px;
}

@media (max-width: 800px) {
    .product-detail {
        grid-template-columns: 1fr;
    }

    .product-detail__media {
        min-height: 330px;
    }

    .product-detail__prices {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .product-image .badge {
        top: 12px;
        left: 12px;
        padding: 7px 10px 7px 9px;
        font-size: 12px;
    }
}

@media (max-width: 640px) {
    .seo-content__body {
        padding: 22px 18px;
    }

    .seo-content__body p,
    .seo-content__body li {
        font-size: 16px;
    }
}

/* Десктоп: навигация шапки и подвала всегда относительно центра окна. */
@media (min-width: 1280px) {
    .header-inner {
        display: grid;
        grid-template-columns: minmax(170px, 1fr) auto minmax(170px, 1fr);
        gap: 24px;
    }

    .header-inner > .logo {
        grid-column: 1;
        justify-self: start;
        min-width: 146px;
        margin: 0;
    }

    .header-inner .nav {
        position: static;
        grid-column: 2;
        justify-self: center;
        margin: 0;
        transform: none;
        white-space: nowrap;
    }

    .header-inner .header-mobile-phone {
        grid-column: 3;
        justify-self: end;
        margin: 0;
    }

    .footer-grid {
        position: relative;
    }

    .footer-menu {
        position: absolute;
        left: 50%;
        margin: 0;
        transform: translateX(-50%);
        white-space: nowrap;
    }
}

/* На мобильном фоне каталога иллюстрация занимает только верхний кадр:
   она не растягивается на всю длинную ленту карточек и плавно затухает. */
@media (max-width: 767px) {
    .catalog-hero .catalog-background {
        inset: 0 0 auto;
        height: min(640px, 100svh);
        opacity: .72;
    }

    .catalog-hero .catalog-background-image {
        object-position: 68% top;
    }

    .catalog-hero .catalog-background::after {
        position: absolute;
        inset: 0;
        content: "";
        background: linear-gradient(180deg, rgba(5, 7, 5, .14) 0%, rgba(5, 7, 5, .48) 34%, #080908 92%, #080908 100%);
    }

    .catalog-hero .product-body {
        background: linear-gradient(180deg, rgba(8, 9, 8, .48), rgba(8, 9, 8, .82));
    }
}

/* Единое белое неоновое свечение логотипа: шапка, футер и мобильное меню. */
.logo img {
    filter: drop-shadow(0 0 1px rgba(255, 255, 255, .76)) drop-shadow(0 0 5px rgba(255, 255, 255, .38));
    transition: filter .24s ease, transform .24s ease;
    animation: logo-neon-breathe 3.6s ease-in-out infinite;
}

.logo:hover img,
.logo:focus-visible img {
    filter: drop-shadow(0 0 2px rgba(255, 255, 255, .88)) drop-shadow(0 0 8px rgba(255, 255, 255, .5));
    transform: translateY(-1px);
}

h1 {
    letter-spacing: 1px;
}

h2 {
    letter-spacing: 1px;
}

.logo .logo-tagline {
    text-shadow: 0 0 4px rgba(255, 255, 255, .34);
}

@keyframes logo-neon-breathe {
    0%, 100% { filter: drop-shadow(0 0 1px rgba(255, 255, 255, .66)) drop-shadow(0 0 4px rgba(255, 255, 255, .28)); }
    50% { filter: drop-shadow(0 0 1px rgba(255, 255, 255, .9)) drop-shadow(0 0 7px rgba(255, 255, 255, .52)); }
}

@media (prefers-reduced-motion: reduce) {
    .logo img { animation: none; }
}

/* Страница 404 */
.not-found-page { min-height: min(760px, calc(100vh - 110px)); display: grid; align-items: center; }
.not-found { position: relative; overflow: hidden; isolation: isolate; padding: clamp(48px, 8vw, 110px) clamp(26px, 7vw, 112px); background: linear-gradient(125deg, rgba(7, 11, 8, .97), rgba(9, 20, 8, .86)); border: 1px solid rgba(151, 255, 0, .42); box-shadow: 18px 20px 0 rgba(117, 185, 0, .13), inset 0 0 80px rgba(145, 255, 0, .05); }
.not-found::before { position: absolute; inset: 0; z-index: -1; content: ''; opacity: .55; background: linear-gradient(rgba(180, 255, 132, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(180, 255, 132, .12) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(90deg, #000, transparent); }
.not-found__stars { position: absolute; inset: 0; z-index: -1; opacity: .75; background: radial-gradient(circle at 12% 24%, #d8ffb0 0 1px, transparent 2px), radial-gradient(circle at 73% 13%, #b9ff68 0 1px, transparent 2px), radial-gradient(circle at 86% 66%, #fff 0 1px, transparent 2px), radial-gradient(circle at 63% 84%, #d8ffb0 0 1px, transparent 2px); animation: not-found-stars 5s ease-in-out infinite alternate; }
.not-found__code { color: #9cff00; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-size: clamp(104px, 22vw, 310px); line-height: .75; letter-spacing: -.06em; text-shadow: 3px 0 #fff, 8px 0 rgba(156, 255, 0, .55); }
.not-found h1 { max-width: 800px; margin: 28px 0 16px; font-size: clamp(36px, 6vw, 76px); text-transform: uppercase; }
.not-found > p:not(.eyebrow) { max-width: 650px; margin: 0; color: #d2d6ce; font-size: clamp(18px, 2.1vw, 24px); line-height: 1.5; }
.not-found__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 38px; }
.not-found__link { padding: 15px 4px; color: #fff; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid #9cff00; }
.not-found__link:hover { color: #9cff00; }
@keyframes not-found-stars { from { transform: translate3d(0, 0, 0); opacity: .45; } to { transform: translate3d(-10px, 6px, 0); opacity: .9; } }
@media (max-width: 640px) { .not-found-page { min-height: 620px; } .not-found { box-shadow: 9px 10px 0 rgba(117, 185, 0, .13); } .not-found__actions { align-items: stretch; flex-direction: column; } .not-found__actions .btn { text-align: center; } .not-found__link { text-align: center; } }

/* Управление отзывами на главной для авторизованного администратора. */
.inline-review-add,
.inline-review-controls button,
.inline-review-editor button { appearance: none; border: 1px solid var(--accent); background: #090c08; color: var(--accent); font: 800 13px/1 Arial, sans-serif; letter-spacing: .04em; cursor: pointer; }
.inline-review-add { margin: 0 0 18px; padding: 12px 16px; }
.inline-review-controls { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.inline-review-controls button,
.inline-review-editor button { padding: 9px 11px; }
.inline-review-controls .is-delete { border-color: #ff7770; color: #ff9d98; }
.inline-review-add:hover,
.inline-review-controls button:hover,
.inline-review-editor button:hover { background: var(--accent); color: #050705; }
.inline-review-controls .is-delete:hover { background: #ff7770; color: #120606; }
.inline-review-editor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .45fr); gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(156,255,0,.28); }
.inline-review-editor label { display: grid; gap: 7px; color: var(--muted); font-weight: 800; }
.inline-review-editor label:nth-of-type(3) { grid-column: 1 / -1; }
.inline-review-editor input,
.inline-review-editor select,
.inline-review-editor textarea { width: 100%; min-width: 0; border: 1px solid rgba(184,226,124,.4); background: #050705; color: var(--text); padding: 10px; font: inherit; }
.inline-review-editor textarea { resize: vertical; }
.inline-review-editor__actions { display: flex; flex-wrap: wrap; gap: 8px; grid-column: 1 / -1; }
@media (max-width: 560px) { .inline-review-editor { grid-template-columns: 1fr; } }

/* Адрес магазина — вторичная строка в брендовом блоке шапки. */
.header-brand { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
.header-brand .header-address { display: none; margin: 0; color: rgba(233, 238, 229, .68); font-family: Inter, Arial, sans-serif; font-size: 11px; font-style: normal; font-weight: 700; letter-spacing: .025em; line-height: 1.25; white-space: nowrap; }
@media (min-width: 1200px) {
    .header-inner { grid-template-columns: 180px minmax(0, 1fr) 198px; }
    .header-brand { grid-column: 1; }
    .header-phone { grid-column: 3; justify-self: end; }
}
@media (min-width: 1360px) {
    .header-inner { grid-template-columns: 250px minmax(0, 1fr) 198px; }
    .header-brand .header-address { display: block; }
}

/* Dynamic sitemap page */
.site-map__hero{max-width:760px;margin:0 0 34px}.site-map__hero h1{margin:8px 0 14px}.site-map__hero>p:last-child{max-width:680px;color:#c7d7bc;font-size:18px;line-height:1.55}.site-map__groups{display:grid;gap:18px}.site-map__group{padding:24px;border:1px solid rgba(156,255,0,.32);background:linear-gradient(135deg,rgba(15,22,12,.94),rgba(5,8,4,.96));box-shadow:0 18px 42px rgba(0,0,0,.2)}.site-map__group h2{margin:0 0 16px;color:#fff;font-size:clamp(22px,3vw,31px)}.site-map__links{columns:3 230px;gap:24px;margin:0;padding:0;list-style:none}.site-map__links li{break-inside:avoid;margin:0 0 9px}.site-map__links a{color:#c7d7bc;text-decoration:none;line-height:1.42}.site-map__links a:hover,.site-map__links a:focus-visible{color:#9cff00;text-decoration:underline;text-underline-offset:4px}@media (max-width:620px){.site-map__group{padding:19px}.site-map__hero>p:last-child{font-size:16px}.site-map__links{columns:1;gap:0}}