/* DentalHolding custom styles
   Wersja zgodna z dzialajacym ukladem siger00-promo.
   Style promocyjne sa ograniczone do stron z .hero / body:is(.has-promo-hero, .has-product-hero),
   dzieki czemu nie nadpisuja zwyklych artykulow. */

:root {
    --dh-promo-red: #ed1010;
    --dh-promo-bg: #f6f6f6;
}

/* Zachowanie zwyklych artykulow. */
.article h2 {
    font-size: 1.65rem;
}

/* =========================================================
   PROMO LANDING PAGE - wzorzec siger00-promo
   ========================================================= */
body:is(.has-promo-hero, .has-product-hero) {
    background: #fff;
    color: #111;
}

body:is(.has-promo-hero, .has-product-hero) .hero {
    padding: 8rem 0 5rem;
    color: #fff;
    background:
        radial-gradient(circle at 80% 40%, rgba(20,110,88,.38), transparent 35%),
        linear-gradient(135deg, #031c18 0%, #06382f 55%, #01231d 100%);
}

body:is(.has-promo-hero, .has-product-hero) .hero .kicker {
    display: inline-block;
    padding: .55rem .95rem;
    border-radius: 999px;
    background: var(--dh-promo-red);
    color: #fff;
    font-weight: 900;
}

body:is(.has-promo-hero, .has-product-hero) .hero .title {
    margin: 0;
    font-size: clamp(3rem, 6vw, 5.8rem);
    font-weight: 900;
    line-height: .92;
    color: #fff;
}

body:is(.has-promo-hero, .has-product-hero) .hero .old {
    font-size: 1.4rem;
    text-decoration: line-through;
    text-decoration-color: #f22;
    text-decoration-thickness: 4px;
}

body:is(.has-promo-hero, .has-product-hero) .hero .price {
    display: inline-block;
    margin-top: .8rem;
    padding: .3rem 1rem .5rem;
    background: var(--dh-promo-red);
    color: #fff;
    font-size: clamp(3.2rem, 7vw, 6.5rem);
    font-weight: 900;
    line-height: .95;
}

body:is(.has-promo-hero, .has-product-hero) .hero .lead,
body:is(.has-promo-hero, .has-product-hero) .hero p,
body:is(.has-promo-hero, .has-product-hero) .hero li {
    color: #fff;
}

body:is(.has-promo-hero, .has-product-hero) .poster {
    overflow: hidden;
    border-radius: 1.5rem;
    box-shadow: 0 1.8rem 4rem rgba(0,0,0,.4);
}

body:is(.has-promo-hero, .has-product-hero) .section {
    background: var(--dh-promo-bg);
}

body:is(.has-promo-hero, .has-product-hero) .cardx,
body:is(.has-promo-hero, .has-product-hero) .offer {
    border-radius: 1.5rem;
    padding: 2rem;
}

body:is(.has-promo-hero, .has-product-hero) .cardx {
    background: #fff;
    color: #212529;
}

body:is(.has-promo-hero, .has-product-hero) .offer {
    position: sticky;
    top: 7rem;
    background: #111;
    color: #fff;
}

body:is(.has-promo-hero, .has-product-hero) .promo {
    border: 1px solid rgba(var(--bs-primary-rgb),.25);
    border-radius: 1rem;
    padding: 1rem 1.2rem;
    background: rgba(var(--bs-primary-rgb),.08);
    color: #111;
}

body:is(.has-promo-hero, .has-product-hero) .package {
    border: 1px solid rgba(var(--bs-primary-rgb),.35);
    border-radius: 1rem;
    padding: 1rem 1.2rem;
    background: rgba(var(--bs-primary-rgb),.12);
    color: #111;
}

body:is(.has-promo-hero, .has-product-hero) .cardx,
body:is(.has-promo-hero, .has-product-hero) .cardx label,
body:is(.has-promo-hero, .has-product-hero) .cardx p,
body:is(.has-promo-hero, .has-product-hero) .cardx small,
body:is(.has-promo-hero, .has-product-hero) .cardx .form-check-label {
    color: #212529 !important;
}

body:is(.has-promo-hero, .has-product-hero) .cardx .text-body-secondary {
    color: #6c757d !important;
}

body:is(.has-promo-hero, .has-product-hero) .cardx .form-control,
body:is(.has-promo-hero, .has-product-hero) .cardx .form-select {
    min-height: 3.35rem;
    border-radius: .85rem;
    background: #fff !important;
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    caret-color: #111 !important;
}

body:is(.has-promo-hero, .has-product-hero) .cardx textarea.form-control {
    min-height: 7rem;
}

body:is(.has-promo-hero, .has-product-hero) .cardx .form-control::placeholder,
body:is(.has-promo-hero, .has-product-hero) .cardx .form-control::-webkit-input-placeholder {
    color: #6c757d !important;
    opacity: 1 !important;
    -webkit-text-fill-color: #6c757d !important;
}

body:is(.has-promo-hero, .has-product-hero) .cardx input.form-control:-webkit-autofill,
body:is(.has-promo-hero, .has-product-hero) .cardx input.form-control:-webkit-autofill:hover,
body:is(.has-promo-hero, .has-product-hero) .cardx input.form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: #111 !important;
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}

body:is(.has-promo-hero, .has-product-hero) .offer,
body:is(.has-promo-hero, .has-product-hero) .offer p,
body:is(.has-promo-hero, .has-product-hero) .offer strong,
body:is(.has-promo-hero, .has-product-hero) .offer h3 {
    color: #fff !important;
}

body:is(.has-promo-hero, .has-product-hero) .offer .text-white-50 {
    color: rgba(255,255,255,.55) !important;
}

/* CTA jak w siger00-promo. */
body:is(.has-promo-hero, .has-product-hero) .btn.cta,
body:is(.has-promo-hero, .has-product-hero) a.btn.cta,
body:is(.has-promo-hero, .has-product-hero) input.btn.cta,
body:is(.has-promo-hero, .has-product-hero) button.btn.cta {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--dh-promo-red);
    --bs-btn-border-color: var(--dh-promo-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c90000;
    --bs-btn-hover-border-color: #c90000;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #b80000;
    --bs-btn-active-border-color: #b80000;
    background-color: var(--dh-promo-red) !important;
    border-color: var(--dh-promo-red) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-weight: 900;
    border-radius: 999px;
}

body:is(.has-promo-hero, .has-product-hero) .btn.cta:hover,
body:is(.has-promo-hero, .has-product-hero) .btn.cta:focus,
body:is(.has-promo-hero, .has-product-hero) .btn.cta:active {
    background-color: #c90000 !important;
    border-color: #c90000 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

body:is(.has-promo-hero, .has-product-hero) .btn.cta:disabled {
    background-color: var(--dh-promo-red) !important;
    border-color: var(--dh-promo-red) !important;
    color: #fff !important;
    opacity: .65;
}

/* =========================================================
   NAVBAR - ten sam sposob jak w dzialajacym siger00-promo
   ========================================================= */
html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero):not(.nav-scrolled)
.header-transparent .navbar .navbar-nav > .nav-item > .nav-link {
    color: #fff !important;
}

html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero).nav-scrolled
.header-transparent .navbar .navbar-nav > .nav-item > .nav-link {
    color: #111 !important;
}

html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero).nav-scrolled
.header-transparent .navbar .navbar-nav > .nav-item > .nav-link.text-success {
    color: var(--bs-success) !important;
}

html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero):not(.nav-scrolled)
.header-transparent .navbar .navbar-toggler {
    color: #fff !important;
    border-color: rgba(255,255,255,.45) !important;
}

html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero):not(.nav-scrolled)
.header-transparent .navbar .navbar-toggler-icon i,
html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero):not(.nav-scrolled)
.header-transparent .navbar .navbar-toggler-icon i::before,
html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero):not(.nav-scrolled)
.header-transparent .navbar .navbar-toggler-icon i::after {
    background-color: #fff !important;
}

html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero).nav-scrolled
.header-transparent .navbar .navbar-toggler {
    color: #111 !important;
    border-color: rgba(0,0,0,.2) !important;
}

/* Dropdowny pozostaja czytelne niezaleznie od pozycji strony. */
html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .dropdown-menu,
html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .dropdown-menu .dropdown-item {
    color: #111 !important;
}

@media (max-width: 991.98px) {
    body:is(.has-promo-hero, .has-product-hero) .hero {
        padding-top: 6.5rem;
    }

    body:is(.has-promo-hero, .has-product-hero) .offer {
        position: static;
        margin-top: 1rem;
    }

    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.show,
    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.collapsing {
        background: #fff !important;
        padding: 1rem;
        border-radius: 0 0 1rem 1rem;
        box-shadow: 0 .75rem 2rem rgba(0,0,0,.12);
    }

    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.show .nav-link,
    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.collapsing .nav-link {
        color: #111 !important;
    }

    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.show .nav-link.text-success,
    html[data-bs-theme="light"] body:is(.has-promo-hero, .has-product-hero) .header-transparent .navbar-collapse.collapsing .nav-link.text-success {
        color: var(--bs-success) !important;
    }
}


/* =========================================================
   PRODUCT HERO / MEDPARK - przeniesione z wersji referencyjnej
   ========================================================= */
/* ============================================================
               DentalHolding / product hero slider – układ jak na referencji
               ============================================================ */
            .product-hero {
                --hero-bg: #626269;
                --hero-accent: #58c45f;
                background: var(--hero-bg);
                min-height: 760px;

                /* Navbar jest fixed-top, więc rezerwujemy dla niego miejsce.
                   Tło hero nadal dochodzi pod menu, ale treść slidera już nie. */
                padding-top: 88px;
                box-sizing: border-box;
            }

            /* Menu zawsze nad sliderem i jego animacjami */
            .header-transparent,
            .header-transparent .navbar.fixed-top {
                z-index: 1050;
            }

            .product-hero .swiper-classic,
            .product-hero .swiper-classic .swiper-wrapper,
            .product-hero .swiper-classic .swiper-slide {
                min-height: 760px;
            }

            .product-hero .swiper-slide {
                background: var(--hero-bg);
                display: flex;
                align-items: center;
                padding: 64px 0 130px;
            }

            .product-hero .product-slide-row {
                min-height: 540px;
            }

            .product-hero .product-copy {
                color: #fff;
            }

            .product-hero .product-copy h2 {
                color: #fff;
                font-size: clamp(1.65rem, 2.25vw, 2.25rem);
                line-height: 1.12;
                letter-spacing: -0.02em;
                margin-bottom: 1.15rem;
                font-weight: 600;
            }

            .product-hero .product-copy .hero-lead {
                color: var(--hero-accent);
                font-size: 1.05rem;
                line-height: 1.55;
                font-weight: 500;
                margin-bottom: 1rem;
                max-width: 690px;
            }

            .product-hero .product-copy .benefits-title {
                display: block;
                margin-bottom: .55rem;
                font-weight: 700;
                color: #fff;
            }

            .product-hero .product-copy ul {
                margin-bottom: 1.35rem;
                padding-left: 1.35rem;
                color: #fff;
                line-height: 1.55;
            }

            .product-hero .product-copy .btn {
                background: #fff;
                color: #273042;
                border-color: #fff;
                border-radius: .28rem;
                font-weight: 500;
                padding: .8rem 1.45rem;
                box-shadow: none;
            }

            .product-hero .product-copy .btn:hover {
                background: #f2f2f2;
                border-color: #f2f2f2;
                color: #111827;
            }

            .product-hero .product-image-wrap {
                display: flex;
                justify-content: center;
                align-items: center;
            }

            .product-hero .product-image {
                display: block;
                width: min(100%, 585px);
                max-height: 585px;
                object-fit: contain;
            }

            .product-hero .progress-swiper-thumbs {
                left: 50% !important;
                transform: translateX(-50%);
                width: min(1180px, calc(100% - 48px)) !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
                padding-bottom: 28px !important;
                z-index: 5;
            }

            .product-hero .progress-swiper-thumbs .swiper-slide {
                min-height: 0;
                padding: 0;
                display: block;
                opacity: .48;
                cursor: pointer;
                transition: opacity .2s ease;
            }

            .product-hero .progress-swiper-thumbs .swiper-slide-thumb-active {
                opacity: 1;
            }

            .product-hero .progress-swiper-thumbs .swiper-pagination-progress-bar {
                height: 2px;
                background: rgba(255,255,255,.22);
                margin-bottom: .75rem !important;
                overflow: hidden;
            }

            .product-hero .progress-swiper-thumbs .swiper-pagination-progress-inner {
                height: 100%;
                width: 0;
                background: #fff;
            }

            .product-hero .progress-swiper-thumbs .swiper-slide-thumb-active .swiper-pagination-progress-inner {
                width: 100%;
            }

            .product-hero .progress-swiper-thumbs span {
                color: #fff;
                font-size: .98rem;
                line-height: 1.35;
                white-space: normal;
            }

            @media (max-width: 991.98px) {
                .product-hero,
                .product-hero .swiper-classic,
                .product-hero .swiper-classic .swiper-wrapper,
                .product-hero .swiper-classic .swiper-slide {
                    min-height: 900px;
                }

                .product-hero .swiper-slide {
                    padding: 55px 0 150px;
                }

                .product-hero .product-slide-row {
                    min-height: auto;
                }

                .product-hero .product-copy {
                    margin-top: 1rem;
                }

                .product-hero .product-image {
                    width: min(100%, 470px);
                    max-height: 470px;
                }
            }

            @media (max-width: 575.98px) {
                .product-hero {
                    padding-top: 76px;
                }

                .product-hero,
                .product-hero .swiper-classic,
                .product-hero .swiper-classic .swiper-wrapper,
                .product-hero .swiper-classic .swiper-slide {
                    min-height: 980px;
                }

                .product-hero .swiper-slide {
                    padding: 38px 0 160px;
                }

                .product-hero .product-copy h2 {
                    font-size: 1.55rem;
                }

                .product-hero .product-copy .hero-lead {
                    font-size: .98rem;
                }

                .product-hero .product-copy ul {
                    font-size: .92rem;
                }

                .product-hero .progress-swiper-thumbs {
                    width: calc(100% - 28px) !important;
                }
            }
