/* Homepage hero composition for the Industries landing and detail routes only. */
:where(.industries-hub, .iic-industry-flagship) {
    --ihh-olive: #8aa63a;
    --ihh-olive-deep: #69812f;
    --ihh-ink: #20362a;
    --ihh-muted: #5d6d63;
    --ihh-cream: #faf9f4;
    --ihh-panel: rgba(253, 252, 248, .94);
    --ihh-line: rgba(138, 166, 58, .3);
}

/* Shared image stage. The real industry image remains fully visible on the right. */
body.everklin-transformed .industries-hub__hero,
body.everklin-transformed .iic-industry-flagship .iic-hero {
    min-height: 650px !important;
    color: var(--ihh-ink) !important;
    background-color: var(--ihh-cream) !important;
}

body.everklin-transformed .industries-hub__hero::after,
body.everklin-transformed .iic-industry-flagship .iic-hero::before {
    display: block !important;
    background: linear-gradient(90deg, rgba(250, 249, 244, .42) 0%, rgba(250, 249, 244, .16) 43%, rgba(250, 249, 244, 0) 72%) !important;
}

body.everklin-transformed .iic-industry-flagship .iic-hero::after {
    display: none !important;
}

/* Fixed editorial panel, matching the approved homepage proportions. */
body.everklin-transformed .industries-hub__hero-inner {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 650px !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 40px max(48px, calc((100vw - 1440px) / 2 + 48px)) !important;
}

body.everklin-transformed .industries-hub__hero-inner > div:first-child,
body.everklin-transformed .iic-industry-flagship .iic-hero__content {
    display: flex !important;
    width: min(720px, 56vw) !important;
    max-width: 720px !important;
    min-height: 560px !important;
    flex-direction: column;
    justify-content: center;
    margin: 0 !important;
    padding: 38px 46px !important;
    border: 1px solid var(--ihh-line) !important;
    border-radius: 6px !important;
    background: var(--ihh-panel) !important;
    box-shadow: 0 20px 52px rgba(62, 77, 48, .12) !important;
    backdrop-filter: blur(8px);
}

body.everklin-transformed .iic-industry-flagship .iic-hero {
    align-items: center;
    padding: 40px max(48px, calc((100vw - 1440px) / 2 + 48px));
}

body.everklin-transformed .industries-hub__hero-inner > div:first-child::before,
body.everklin-transformed .iic-industry-flagship .iic-hero__content::before {
    display: block;
    margin-bottom: 18px;
    color: #68756c;
    content: "EVERKLIN / PERFORMANCE CHEMISTRY";
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
}

body.everklin-transformed .industries-hub__crumb,
body.everklin-transformed .iic-industry-flagship .iic-crumb {
    margin-bottom: 20px !important;
    color: #68756c !important;
}

body.everklin-transformed .industries-hub__crumb a,
body.everklin-transformed .iic-industry-flagship .iic-crumb a,
body.everklin-transformed .iic-industry-flagship .iic-crumb strong {
    color: var(--ihh-ink) !important;
}

body.everklin-transformed .industries-hub__hero .industries-hub__kicker,
body.everklin-transformed .iic-industry-flagship .iic-hero .iic-kicker {
    margin-bottom: 14px !important;
    color: var(--ihh-olive-deep) !important;
}

body.everklin-transformed .industries-hub__hero h1,
body.everklin-transformed .iic-industry-flagship .iic-hero h1 {
    max-width: 620px !important;
    margin: 0 0 18px !important;
    color: var(--ihh-ink) !important;
    font-size: clamp(46px, 4.25vw, 58px) !important;
    font-weight: 720 !important;
    line-height: .98 !important;
    letter-spacing: 0 !important;
    text-wrap: balance;
}

body.everklin-transformed .industries-hub__hero-inner > div > p:not(.industries-hub__kicker),
body.everklin-transformed .iic-industry-flagship .iic-hero .iic-lead {
    max-width: 580px;
    margin: 0 !important;
    color: var(--ihh-muted) !important;
    font-size: 16px !important;
    line-height: 1.58 !important;
}

body.everklin-transformed .industries-hub__hero .industries-hub__actions,
body.everklin-transformed .iic-industry-flagship .iic-hero .iic-actions {
    margin-top: 26px !important;
}

body.everklin-transformed .industries-hub__hero .industries-hub__button--outline,
body.everklin-transformed .iic-industry-flagship .iic-hero .iic-button--outline {
    border-color: #cfd8c2 !important;
    background: rgba(255, 255, 255, .72) !important;
    color: var(--ihh-ink) !important;
}

body.everklin-transformed .industries-hub__hero .industries-hub__button--outline:hover,
body.everklin-transformed .iic-industry-flagship .iic-hero .iic-button--outline:hover {
    border-color: var(--ihh-olive) !important;
    background: #fff !important;
}

/* The homepage composition does not use an extra floating note card. */
body.everklin-transformed .industries-hub__hero-note {
    display: none !important;
}

@media (max-width: 960px) {
    body.everklin-transformed .industries-hub__hero,
    body.everklin-transformed .iic-industry-flagship .iic-hero,
    body.everklin-transformed .industries-hub__hero-inner {
        min-height: 640px !important;
    }

    body.everklin-transformed .industries-hub__hero-inner {
        padding: 32px !important;
    }

    body.everklin-transformed .iic-industry-flagship .iic-hero {
        padding: 32px !important;
    }

    body.everklin-transformed .industries-hub__hero-inner > div:first-child,
    body.everklin-transformed .iic-industry-flagship .iic-hero__content {
        width: min(690px, 72vw) !important;
        min-height: 576px !important;
        padding: 34px 38px !important;
    }

    body.everklin-transformed .industries-hub__hero h1,
    body.everklin-transformed .iic-industry-flagship .iic-hero h1 {
        font-size: clamp(43px, 6vw, 54px) !important;
    }
}

@media (max-width: 640px) {
    body.everklin-transformed .industries-hub__hero,
    body.everklin-transformed .iic-industry-flagship .iic-hero {
        min-height: 650px !important;
        padding: 20px !important;
        background-position: center !important;
    }

    body.everklin-transformed .industries-hub__hero::after,
    body.everklin-transformed .iic-industry-flagship .iic-hero::before {
        background: linear-gradient(180deg, rgba(250, 249, 244, .2), rgba(250, 249, 244, .08)) !important;
    }

    body.everklin-transformed .industries-hub__hero-inner {
        min-height: 610px !important;
        padding: 0 !important;
    }

    body.everklin-transformed .industries-hub__hero-inner > div:first-child,
    body.everklin-transformed .iic-industry-flagship .iic-hero__content {
        width: 100% !important;
        max-width: none !important;
        min-height: 610px !important;
        padding: 27px 24px !important;
        background: rgba(253, 252, 248, .95) !important;
    }

    body.everklin-transformed .industries-hub__hero-inner > div:first-child::before,
    body.everklin-transformed .iic-industry-flagship .iic-hero__content::before {
        margin-bottom: 14px;
        font-size: 9px;
    }

    body.everklin-transformed .industries-hub__crumb,
    body.everklin-transformed .iic-industry-flagship .iic-crumb {
        margin-bottom: 16px !important;
        font-size: 10px !important;
    }

    body.everklin-transformed .industries-hub__hero h1,
    body.everklin-transformed .iic-industry-flagship .iic-hero h1 {
        font-size: clamp(38px, 11vw, 46px) !important;
    }

    body.everklin-transformed .industries-hub__hero .industries-hub__actions,
    body.everklin-transformed .iic-industry-flagship .iic-hero .iic-actions {
        display: grid !important;
        width: 100%;
        gap: 10px;
    }

    body.everklin-transformed .industries-hub__hero .industries-hub__actions > *,
    body.everklin-transformed .iic-industry-flagship .iic-hero .iic-actions > * {
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    :where(.industries-hub, .iic-industry-flagship) .iic-hero,
    :where(.industries-hub, .iic-industry-flagship) .industries-hub__hero {
        scroll-behavior: auto;
    }
}