/* =========================================================
   HERO-ISO — БАЗА
   ========================================================= */

.hero-iso {
    --title-center-y: 60%;
    --title-lift: 22dvh;
    --intro-offset: 8dvh;
}

.hero-iso__bigtitle {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.hero-iso__bigtitle-word {
    position: absolute;
    top: var(--title-center-y);
    left: 50%;
    transform: translate(-50%, -50%);

    font-family: var(--font-logo);

    /* ↓ Уменьшили верхний предел: 220px → 140px, vw-часть: 14vw → 10vw */
    font-size: clamp(52px, 10vw, 140px);
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 0.9;
    white-space: nowrap;

    /* ↓ Защита от выхода за край */
    max-width: 96vw;
    overflow: hidden;
    text-overflow: ellipsis;

    color: var(--text);

    opacity: 0;
    transition:
        opacity   .5s cubic-bezier(.22,.61,.36,1),
        transform .6s cubic-bezier(.22,.61,.36,1);
}

/* ↓ Логотип — КРУПНЕЕ остальных заголовков */
.hero-iso__bigtitle-word.is-logo {
    font-size: clamp(72px, 13vw, 200px);
    max-width: 90vw;
}

[data-theme="dark"] .hero-iso__bigtitle-word {
    color: var(--text);
}

.hero-iso.is-stage-1 .is-logo {
    opacity: 1;
    transform: translate(-50%, -50%);
}

.hero-iso.is-stage-2 .is-logo,
.hero-iso.is-stage-3 .is-logo {
    opacity: 1;
    transform: translate(-50%, calc(-90% - var(--title-lift, 22dvh)));
}

.hero-iso.is-stage-4 .is-comp,
.hero-iso.is-stage-5 .is-benefits {
    opacity: 1;
    transform: translate(-50%, calc(-90% - var(--title-lift, 22dvh)));
}

.hero-iso__intro {
    position: absolute;
    top: calc(var(--title-center-y) + var(--intro-offset));
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 2;
    text-align: center;
    pointer-events: none;
    opacity: 0;
    transition:
        opacity   .5s cubic-bezier(.22,.61,.36,1),
        transform .5s cubic-bezier(.22,.61,.36,1);
}

.hero-iso__tagline {
    margin: 0;
    font-family: var(--font-heading);
    font-size: clamp(16px, 2.4vw, 34px);
    font-weight: 700;
    letter-spacing: var(--ls-caption, 0.18em);
    text-transform: uppercase;

    color: var(--flavor-accent, var(--accent));
    text-shadow: 0 0 24px
        color-mix(in srgb, var(--flavor-accent, var(--accent)) 45%, transparent);
}

.hero-iso.is-stage-1 .hero-iso__intro {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* ---------------------------------------------------------
   ≤ 1024px
   --------------------------------------------------------- */
@media (max-width: 1024px) {

    .hero-iso {
        --title-lift: 26dvh;
        --intro-offset: 7dvh;
    }

    .hero-iso__bigtitle-word {
        /* ↓ было 18vw/160px — уменьшили */
        font-size: clamp(44px, 11vw, 110px);
        letter-spacing: 0;
        max-width: 96vw;
    }

    /* Логотип на планшете */
    .hero-iso__bigtitle-word.is-logo {
        font-size: clamp(60px, 14vw, 150px);
        max-width: 88vw;
    }

    .hero-iso__tagline {
        font-size: clamp(15px, 3vw, 26px);
        letter-spacing: 0.14em;
    }

    .hero-iso__bottle-container {
        height: 56dvh;
        bottom: 13dvh;
    }

    .hero-iso__flavors-label {
        display: none !important;
    }
    .hero-iso__flavors-list {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 16px;
        flex-wrap: wrap;
    }
    .hero-iso__flavor {
        width: 34px;
        height: 34px;
        min-width: 34px;
        padding: 0 !important;
        border-radius: 50%;
        border: 2px solid transparent;
        background: transparent !important;
        box-shadow: none;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: transform .2s ease, border-color .2s ease;
    }
    .hero-iso__flavor-name,
    .hero-iso__flavor-text {
        display: none !important;
    }
    .hero-iso__flavor-dot {
        width: 22px;
        height: 22px;
        border-radius: 50%;
    }
    .hero-iso__flavor.is-active {
        border-color: var(--dot-color, currentColor);
        transform: scale(1.18);
    }
    .hero-iso__flavor.is-active .hero-iso__flavor-dot {
        box-shadow: 0 0 0 2px #fff;
    }
}

/* ---------------------------------------------------------
   ≤ 768px
   --------------------------------------------------------- */
@media (max-width: 768px) {

    .hero-iso {
        --title-lift: 26dvh;
        --intro-offset: 6dvh;
    }

    .hero-iso__bigtitle-word {
        /* ↓ было 16vw/120px */
        font-size: clamp(36px, 9.5vw, 80px);
        max-width: 95vw;
    }

    .hero-iso__bigtitle-word.is-logo {
        font-size: clamp(52px, 12vw, 110px);
        max-width: 86vw;
    }

    .hero-iso__bottle-container {
        height: 52dvh;
        bottom: 14dvh;
    }

    .hero-iso__stage--desc,
    .hero-iso__stage--composition,
    .hero-iso__stage--benefits {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* ---------------------------------------------------------
   ≤ 600px
   --------------------------------------------------------- */
@media (max-width: 600px) {

    .hero-iso {
        --title-lift: 24dvh;
        --intro-offset: 5dvh;
    }

    .hero-iso__bigtitle-word {
        /* ↓ было 15vw/90px — «ПРЕИМУЩЕСТВА» здесь самое опасное */
        font-size: clamp(28px, 7.5vw, 62px);
        max-width: 95vw;
        letter-spacing: -0.01em;
    }

    .hero-iso__bigtitle-word.is-logo {
        font-size: clamp(46px, 11vw, 90px);
        max-width: 84vw;
    }

    .hero-iso__tagline {
        font-size: clamp(13px, 3.6vw, 20px);
        letter-spacing: 0.1em;
    }

    .hero-iso__bottle-container {
        height: 48dvh;
        bottom: 15dvh;
    }

    .hero-iso__flavors-list {
        gap: 14px;
    }
    .hero-iso__flavor {
        width: 30px;
        height: 30px;
        min-width: 30px;
    }
    .hero-iso__flavor-dot {
        width: 20px;
        height: 20px;
    }
}

/* ---------------------------------------------------------
   ≤ 400px
   --------------------------------------------------------- */
@media (max-width: 400px) {

    .hero-iso {
        --title-lift: 22dvh;
        --intro-offset: 5dvh;
    }

    .hero-iso__bigtitle-word {
        /* ↓ было 14vw/80px */
        font-size: clamp(24px, 6.5vw, 52px);
        max-width: 94vw;
    }

    .hero-iso__bigtitle-word.is-logo {
        font-size: clamp(40px, 10vw, 76px);
        max-width: 82vw;
    }

    .hero-iso__bottle-container {
        height: 44dvh;
        bottom: 16dvh;
    }

    .hero-iso__flavors-list {
        gap: 12px;
    }
    .hero-iso__flavor {
        width: 28px;
        height: 28px;
        min-width: 28px;
    }
    .hero-iso__flavor-dot {
        width: 18px;
        height: 18px;
    }
}

/* ---------------------------------------------------------
   Landscape + низкая высота
   --------------------------------------------------------- */
@media (max-height: 560px) and (orientation: landscape) {

    .hero-iso {
        --title-lift: 16dvh;
        --intro-offset: 6dvh;
    }

    .hero-iso__bigtitle-word {
        /* ↓ было 9vw/72px */
        font-size: clamp(28px, 6vw, 54px);
        max-width: 92vw;
    }

    .hero-iso__bigtitle-word.is-logo {
        font-size: clamp(40px, 8vw, 72px);
    }

    .hero-iso__bottle-container {
        height: 70dvh;
        bottom: 8dvh;
    }
}