/**
 * Shared Manufacturing-family presentation.
 *
 * Page-specific CSS retains only each dosage form's unique copy, tag and grid
 * choices. This late-loaded file is the single source of truth for final Hero
 * height, responsive media treatment and shared component hooks.
 */

.kelrosa-manufacturing-family__hero {
    --kelrosa-internal-hero-height: 620px;
    position: relative;
    display: flex;
    min-height: var(--kelrosa-internal-hero-height);
    padding-top: 0;
    padding-bottom: 0;
    align-items: stretch;
    isolation: isolate;
    overflow: hidden;
}

.kelrosa-manufacturing-family__hero-grid {
    position: relative;
    z-index: 1;
    width: min(calc(100% - 48px), var(--container));
    max-width: var(--container);
    min-height: var(--kelrosa-internal-hero-height);
    margin-inline: auto;
    padding-top: 54px;
    padding-bottom: 54px;
    align-items: center;
}

.kelrosa-manufacturing-family__hero-media {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 620px;
    min-height: 430px;
    margin: 0;
    align-items: center;
    justify-content: center;
    justify-self: end;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.kelrosa-manufacturing-family__hero-media::before,
.kelrosa-manufacturing-family__hero-media::after {
    display: none;
}

.kelrosa-manufacturing-family__hero-image,
.kelrosa-manufacturing-family__hero-media > img,
.kelrosa-manufacturing-family__hero-media > picture.kelrosa-auto-webp > img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    max-width: 620px;
    height: auto;
    min-height: 0;
    max-height: 500px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    object-fit: contain;
    object-position: center;
    box-shadow: none;
    filter: drop-shadow(0 25px 30px rgba(var(--color-primary-rgb), .16));
}

@media (max-width: 1180px) {
    .kelrosa-manufacturing-family__hero,
    .kelrosa-manufacturing-family__hero-grid {
        min-height: auto;
    }

    .kelrosa-manufacturing-family__hero-grid {
        padding-top: 48px;
        padding-bottom: 54px;
    }

    .kelrosa-manufacturing-family__hero-media {
        max-width: 650px;
        min-height: 390px;
        justify-self: center;
    }

    .kelrosa-manufacturing-family__hero-image,
    .kelrosa-manufacturing-family__hero-media > img,
    .kelrosa-manufacturing-family__hero-media > picture.kelrosa-auto-webp > img {
        max-height: 430px;
    }
}

@media (max-width: 960px) {
    .kelrosa-manufacturing-family__hero-grid {
        grid-template-columns: 1fr;
    }

    .kelrosa-manufacturing-family__hero-media {
        min-height: 360px;
    }

    .kelrosa-manufacturing-family__hero-image,
    .kelrosa-manufacturing-family__hero-media > img,
    .kelrosa-manufacturing-family__hero-media > picture.kelrosa-auto-webp > img {
        max-height: 410px;
    }
}

@media (max-width: 767px) {
    .kelrosa-manufacturing-family__hero-grid {
        width: calc(100% - 40px);
        padding-top: 38px;
        padding-bottom: 46px;
        gap: 32px;
    }

    .kelrosa-manufacturing-family__hero-actions {
        align-items: stretch;
    }

    .kelrosa-manufacturing-family__hero-actions .button {
        justify-content: center;
    }

    .kelrosa-manufacturing-family__hero-media {
        min-height: 280px;
    }

    .kelrosa-manufacturing-family__hero-image,
    .kelrosa-manufacturing-family__hero-media > img,
    .kelrosa-manufacturing-family__hero-media > picture.kelrosa-auto-webp > img {
        max-height: 320px;
        filter: drop-shadow(0 17px 20px rgba(var(--color-primary-rgb), .13));
    }
}

@media (max-width: 480px) {
    .kelrosa-manufacturing-family__hero-grid {
        width: calc(100% - 36px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .kelrosa-manufacturing-family__hero-image,
    .kelrosa-manufacturing-family__hero-media > img,
    .kelrosa-manufacturing-family__hero-media > picture.kelrosa-auto-webp > img {
        transition: none;
    }
}

/*
 * Shared editorial utilities for redesigned dosage-form manufacturing pages.
 * These opt-in classes keep repeated section-head, large-number process, quality
 * footer and wide-FAQ rules out of individual page stylesheets.
 */
.kr-mf-section-head{
    grid-template-columns:1fr;
    gap:18px;
    margin-bottom:clamp(44px,4.5vw,68px);
}
.kr-mf-section-head>div:first-child{padding-top:0}
.kr-mf-section-head>div:first-child::after{display:none}
.kr-mf-section-head>div:last-child{
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
    gap:clamp(44px,6vw,96px);
    align-items:start;
}
.kr-mf-section-head h2{max-width:780px;margin:0}
.kr-mf-section-head p:last-child{max-width:690px;margin:4px 0 0}

.kr-mf-card-grid-lg .kr-card-grid{gap:clamp(22px,2.2vw,32px)}
.kr-mf-card-grid-lg .kr-card{min-height:370px;padding:clamp(34px,3vw,44px)}
.kr-mf-card-grid-lg .kr-card__number{
    width:58px;
    height:58px;
    margin-bottom:42px;
    border-radius:18px;
    font-size:15px;
}

.kr-mf-numbered-list{
    margin:0;
    padding:0;
    border-top:1px solid var(--kr-line);
    list-style:none;
}
.kr-mf-numbered-list li{
    display:grid;
    grid-template-columns:88px minmax(0,1fr);
    gap:24px;
    padding:27px 0 29px;
    border-bottom:1px solid var(--kr-line);
}
.kr-mf-numbered-list__number{
    padding-top:2px;
    color:rgba(88,169,79,.72);
    font-size:clamp(44px,3.5vw,58px);
    font-weight:650;
    line-height:.92;
    letter-spacing:-.06em;
}
.kr-mf-numbered-list .kr-kicker{margin-bottom:8px}
.kr-mf-numbered-list h3{margin:0 0 10px}
.kr-mf-numbered-list li p:last-child{
    max-width:660px;
    margin:0;
    color:var(--kr-slate);
    font-size:var(--kr-type-body-sm);
    line-height:1.68;
}

.kr-mf-quality-footer{
    display:flex;
    gap:32px;
    align-items:center;
    justify-content:space-between;
    margin-top:34px;
    padding-top:28px;
    border-top:1px solid rgba(255,255,255,.14);
}
.kr-mf-quality-footer .kr-chip-list li{
    border-color:rgba(255,255,255,.14);
    background:rgba(255,255,255,.08);
    color:#fff;
}
.kr-mf-faq-wide .kr-faq{
    grid-template-columns:minmax(300px,.56fr) minmax(0,1.44fr);
    gap:clamp(58px,7vw,108px);
}
.kr-mf-cta-wide .kr-callout{padding:clamp(54px,5.2vw,78px)}

@media (max-width: 1180px) {
    .kr-mf-section-head>div:last-child{
        grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);
        gap:42px;
    }
}

@media (max-width: 900px) {
    .kr-mf-section-head>div:last-child,
    .kr-mf-faq-wide .kr-faq{grid-template-columns:1fr}
    .kr-mf-section-head>div:last-child{gap:16px}
}

@media (max-width: 767px) {
    .kr-mf-card-grid-lg .kr-card__number{
        width:52px;
        height:52px;
        margin-bottom:34px;
        border-radius:16px;
    }
    .kr-mf-numbered-list li{
        grid-template-columns:62px minmax(0,1fr);
        gap:16px;
        padding:24px 0;
    }
    .kr-mf-numbered-list__number{font-size:40px}
    .kr-mf-quality-footer{align-items:stretch;flex-direction:column}
    .kr-mf-quality-footer .button{width:100%}
}