/* =========================================================
   TANYA SPECIALITY HOSPITAL
   ABOUT SECTION - 2026 PREMIUM DESIGN
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */

#tsh-about-root {
    --tsh-brown: #9d795d;
    --tsh-brown-dark: #7e5e45;
    --tsh-yellow: #fff9c7;
    --tsh-black: #000000;
    --tsh-white: #ffffff;
    --tsh-text: #252525;
    --tsh-muted: #666666;
    --tsh-border: rgba(157, 121, 93, 0.18);
    --tsh-shadow: 0 18px 50px rgba(0, 0, 0, 0.08);
    --tsh-radius: 24px;
}


/* =========================================================
   SECTION ROOT
========================================================= */

#tsh-about-root {
    width: 100%;
    background: linear-gradient( 180deg, #ffffff 0%, #fffdf9 100% );
    padding: clamp(55px, 7vw, 95px) 0;
    color: var(--tsh-text);
    overflow: hidden;
}


    /* =========================================================
   90% WIDTH CONTAINER
========================================================= */

    #tsh-about-root .tsh-about-container {
        width: 90%;
        max-width: none;
        margin-left: auto;
        margin-right: auto;
    }


    /* =========================================================
   HERO
========================================================= */

    #tsh-about-root .tsh-about-hero {
        position: relative;
        margin: 0;
    }


    /* =========================================================
   LEFT CONTENT
========================================================= */

    #tsh-about-root .tsh-about-main-content {
        padding-right: clamp( 0px, 2vw, 35px );
    }


    /* =========================================================
   TAG
========================================================= */

    #tsh-about-root .tsh-about-tag {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        margin-bottom: 20px;
        padding: 8px 15px;
        border: 1px solid rgba(157, 121, 93, 0.25);
        border-radius: 50px;
        background: rgba(255, 249, 199, 0.65);
        color: var(--tsh-black);
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.8px;
        text-transform: uppercase;
    }


    #tsh-about-root .tsh-about-tag-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        color: var(--tsh-white);
        background: var(--tsh-brown);
    }


    /* =========================================================
   HEADING
========================================================= */

    #tsh-about-root .tsh-about-heading {
        max-width: 800px;
        margin: 0 0 22px;
        color: var(--tsh-black);
        font-size: clamp( 2rem, 4vw, 3.7rem );
        font-weight: 800;
        line-height: 1.08;
        letter-spacing: -1.5px;
    }


        #tsh-about-root .tsh-about-heading span {
            display: block;
            color: var(--tsh-brown);
        }


    /* =========================================================
   DESCRIPTION
========================================================= */

    #tsh-about-root .tsh-about-text {
        max-width: 850px;
        margin: 0 0 15px;
        color: var(--tsh-muted);
        font-size: clamp( 0.91rem, 1.2vw, 1rem );
        line-height: 1.8;
    }


        #tsh-about-root .tsh-about-text strong {
            color: var(--tsh-text);
            font-weight: 700;
        }


    /* =========================================================
   FEATURE CARDS
========================================================= */

    #tsh-about-root .tsh-about-feature-row {
        margin-top: 27px;
    }


    #tsh-about-root .tsh-about-feature-card {
        height: 100%;
        display: flex;
        align-items: flex-start;
        gap: 15px;
        padding: 21px;
        background: rgba(255, 255, 255, 0.95);
        border: 1px solid var(--tsh-border);
        border-radius: 18px;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.045);
        transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    }


        #tsh-about-root .tsh-about-feature-card:hover {
            transform: translateY(-7px);
            border-color: rgba(157, 121, 93, 0.45);
            box-shadow: 0 18px 38px rgba(157, 121, 93, 0.12);
        }


    #tsh-about-root .tsh-about-feature-icon {
        flex: 0 0 48px;
        width: 48px;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 15px;
        color: var(--tsh-yellow);
        background: linear-gradient( 135deg, var(--tsh-brown), var(--tsh-brown-dark) );
        font-size: 19px;
        box-shadow: 0 8px 18px rgba(157, 121, 93, 0.22);
    }


    #tsh-about-root .tsh-about-feature-card h5 {
        margin: 1px 0 6px;
        color: var(--tsh-black);
        font-size: 16px;
        font-weight: 800;
    }


    #tsh-about-root .tsh-about-feature-card p {
        margin: 0;
        color: var(--tsh-muted);
        font-size: 12.5px;
        line-height: 1.6;
    }


    /* =========================================================
   RIGHT VISUAL
========================================================= */

    #tsh-about-root .tsh-about-visual {
        position: relative;
        width: 100%;
        padding: 20px 20px 25px;
    }


    #tsh-about-root .tsh-about-image-frame {
        position: relative;
        width: 100%;
        max-width: 540px;
        margin: 0 auto;
    }


    /* =========================================================
   DECORATION
========================================================= */

    #tsh-about-root .tsh-about-image-decoration {
        position: absolute;
        top: -12px;
        right: -12px;
        width: 72%;
        height: 75%;
        border-radius: 30px;
        background: var(--tsh-yellow);
        z-index: 0;
    }


    /* =========================================================
   IMAGE
========================================================= */

    #tsh-about-root .tsh-about-image-wrapper {
        position: relative;
        z-index: 1;
        overflow: hidden;
        border-radius: 30px;
        background: #f7f3ee;
        box-shadow: 0 25px 60px rgba(0, 0, 0, 0.14);
    }


    #tsh-about-root .tsh-about-photo {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 4.6;
        object-fit: cover;
        transition: transform 0.7s ease;
    }


    #tsh-about-root .tsh-about-image-wrapper:hover
    .tsh-about-photo {
        transform: scale(1.035);
    }


    /* =========================================================
   BADGES
========================================================= */

    #tsh-about-root .tsh-about-badge {
        position: absolute;
        z-index: 4;
        display: flex;
        align-items: center;
        gap: 9px;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
    }


    /* TOP BADGE */

    #tsh-about-root .tsh-about-badge-top {
        top: 5px;
        right: -15px;
        padding: 10px 16px;
        border-radius: 50px;
        background: var(--tsh-yellow);
        color: var(--tsh-black);
        font-size: 12px;
        font-weight: 800;
    }


    /* BOTTOM BADGE */

    #tsh-about-root .tsh-about-badge-bottom {
        left: -18px;
        bottom: 25px;
        padding: 13px 20px;
        border-radius: 18px;
        color: var(--tsh-white);
        background: var(--tsh-brown);
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
    }


        #tsh-about-root .tsh-about-badge-bottom strong {
            color: var(--tsh-yellow);
            font-size: 25px;
            font-weight: 900;
            line-height: 1;
        }


        #tsh-about-root .tsh-about-badge-bottom span {
            margin-top: 4px;
            font-size: 10px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.7px;
        }


    #tsh-about-root .tsh-about-badge-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 29px;
        height: 29px;
        border-radius: 50%;
        color: var(--tsh-white);
        background: var(--tsh-brown);
    }


    /* =========================================================
   FLOATING CARD
========================================================= */

    #tsh-about-root .tsh-about-floating-card {
        position: absolute;
        z-index: 5;
        right: -18px;
        bottom: 5px;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 16px;
        border: 1px solid rgba(157, 121, 93, 0.15);
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
        backdrop-filter: blur(10px);
    }


    #tsh-about-root .tsh-about-floating-icon {
        width: 38px;
        height: 38px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        color: var(--tsh-yellow);
        background: var(--tsh-brown);
    }


    #tsh-about-root .tsh-about-floating-card strong {
        display: block;
        color: var(--tsh-black);
        font-size: 12px;
        font-weight: 800;
    }


    #tsh-about-root .tsh-about-floating-card span {
        display: block;
        margin-top: 2px;
        color: var(--tsh-muted);
        font-size: 10px;
    }


    /* =========================================================
   SPECIALTIES
========================================================= */

    #tsh-about-root .tsh-about-specialties {
        position: relative;
        margin-top: clamp(55px, 7vw, 90px);
        padding: clamp(24px, 4vw, 38px);
        border: 1px solid var(--tsh-border);
        border-radius: clamp(20px, 3vw, 30px);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: var(--tsh-shadow);
    }


    /* =========================================================
   SPECIALTY HEADER
========================================================= */

    #tsh-about-root .tsh-about-specialties-header {
        margin-bottom: 25px;
    }


    #tsh-about-root .tsh-about-section-label {
        display: block;
        margin-bottom: 7px;
        color: var(--tsh-brown);
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 1.8px;
    }


    #tsh-about-root .tsh-about-specialties-header h3 {
        margin: 0;
        color: var(--tsh-black);
        font-size: clamp( 1.35rem, 2.4vw, 2rem );
        font-weight: 800;
    }


    #tsh-about-root .tsh-about-specialties-header p {
        max-width: 650px;
        margin: 7px 0 0;
        color: var(--tsh-muted);
        font-size: 13px;
    }


    /* =========================================================
   TABS
========================================================= */

    #tsh-about-root .tsh-about-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
        padding-bottom: 22px;
        border-bottom: 1px solid #eeeeee;
    }


    #tsh-about-root .tsh-about-tab {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 42px;
        padding: 9px 17px;
        border: 1px solid rgba(157, 121, 93, 0.12);
        border-radius: 50px;
        color: #333333;
        background: #f7f4ef;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
        transition: all 0.3s ease;
    }


        #tsh-about-root .tsh-about-tab i {
            color: var(--tsh-brown);
        }


        #tsh-about-root .tsh-about-tab:hover {
            transform: translateY(-2px);
            color: var(--tsh-brown);
            border-color: rgba(157, 121, 93, 0.3);
        }


        #tsh-about-root .tsh-about-tab.active {
            color: var(--tsh-white);
            background: var(--tsh-brown);
            border-color: var(--tsh-brown);
            box-shadow: 0 8px 20px rgba(157, 121, 93, 0.25);
        }


            #tsh-about-root .tsh-about-tab.active i {
                color: var(--tsh-yellow);
            }


    /* =========================================================
   TAB CONTENT
========================================================= */

    #tsh-about-root .tsh-about-tab-panel-wrapper {
        padding-top: 24px;
    }


    #tsh-about-root .tsh-about-tab-panel {
        display: none;
    }


        #tsh-about-root .tsh-about-tab-panel.active {
            display: block;
            animation: tshAboutFadeUp 0.45s ease both;
        }


    /* =========================================================
   SERVICE ITEMS
========================================================= */

    #tsh-about-root .tsh-about-service-item {
        display: flex;
        align-items: center;
        gap: 11px;
        min-height: 54px;
        padding: 13px 15px;
        border: 1px solid rgba(157, 121, 93, 0.11);
        border-radius: 14px;
        background: #fffdf9;
        color: #333333;
        font-size: 13px;
        font-weight: 600;
        transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
    }


        #tsh-about-root .tsh-about-service-item:hover {
            transform: translateX(5px);
            border-color: rgba(157, 121, 93, 0.3);
            background: #ffffff;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
        }


        #tsh-about-root .tsh-about-service-item i {
            flex: 0 0 auto;
            color: var(--tsh-brown);
            font-size: 15px;
        }


    /* =========================================================
   CTA
========================================================= */

    #tsh-about-root .tsh-about-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        margin-top: 28px;
        padding-top: 22px;
        border-top: 1px solid #eeeeee;
    }


    #tsh-about-root .tsh-about-cta-content {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 7px;
        color: var(--tsh-muted);
        font-size: 13px;
    }


        #tsh-about-root .tsh-about-cta-content strong {
            color: var(--tsh-black);
        }


    /* =========================================================
   CTA BUTTON
========================================================= */

    #tsh-about-root .tsh-about-btn-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        padding: 12px 21px;
        border: 1px solid var(--tsh-brown);
        border-radius: 50px;
        color: var(--tsh-white) !important;
        background: linear-gradient( 135deg, var(--tsh-brown), var(--tsh-brown-dark) );
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.7px;
        text-decoration: none;
        text-transform: uppercase;
        white-space: nowrap;
        transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease, color 0.3s ease;
    }


        #tsh-about-root .tsh-about-btn-action:hover {
            transform: translateY(-3px);
            color: var(--tsh-black) !important;
            background: var(--tsh-yellow);
            box-shadow: 0 10px 25px rgba(157, 121, 93, 0.2);
        }


        #tsh-about-root .tsh-about-btn-action i {
            transition: transform 0.3s ease;
        }


        #tsh-about-root .tsh-about-btn-action:hover i {
            transform: translateX(4px);
        }


    /* =========================================================
   SCROLL ANIMATION INITIAL STATES
========================================================= */

    #tsh-about-root [data-animate] {
        visibility: hidden;
    }


    /* =========================================================
   ANIMATE.CSS VISIBILITY FIX
========================================================= */

    #tsh-about-root .animate__animated {
        visibility: visible;
    }


/* =========================================================
   CUSTOM TAB ANIMATION
========================================================= */

@keyframes tshAboutFadeUp {

    from {
        opacity: 0;
        transform: translateY(15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    #tsh-about-root {
        padding: 55px 0;
    }


        #tsh-about-root .tsh-about-main-content {
            padding-right: 0;
        }


        #tsh-about-root .tsh-about-heading {
            font-size: clamp( 2rem, 6vw, 3rem );
        }


        #tsh-about-root .tsh-about-visual {
            padding: 10px 25px 35px;
        }


        #tsh-about-root .tsh-about-image-frame {
            max-width: 600px;
        }


        #tsh-about-root .tsh-about-specialties {
            margin-top: 35px;
        }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    #tsh-about-root {
        padding: 45px 0;
    }


        /*
       Still 90% of screen
    */

        #tsh-about-root .tsh-about-container {
            width: 90%;
        }


        #tsh-about-root .tsh-about-tag {
            font-size: 10px;
            padding: 7px 11px;
        }


        #tsh-about-root .tsh-about-heading {
            font-size: clamp( 1.8rem, 8vw, 2.5rem );
            letter-spacing: -0.7px;
        }


        #tsh-about-root .tsh-about-text {
            font-size: 13px;
            line-height: 1.7;
        }


        #tsh-about-root .tsh-about-feature-card {
            padding: 17px;
        }


        #tsh-about-root .tsh-about-visual {
            padding: 25px 15px 50px;
        }


        #tsh-about-root .tsh-about-image-frame {
            max-width: 100%;
        }


        #tsh-about-root .tsh-about-image-decoration {
            right: -6px;
            top: -6px;
            border-radius: 22px;
        }


        #tsh-about-root .tsh-about-badge-top {
            top: 0;
            right: 0;
            font-size: 10px;
            padding: 8px 11px;
        }


        #tsh-about-root .tsh-about-badge-bottom {
            left: 0;
            bottom: 18px;
            padding: 11px 15px;
        }


        #tsh-about-root .tsh-about-floating-card {
            right: 0;
            bottom: 0;
            padding: 9px 12px;
        }


        #tsh-about-root .tsh-about-floating-icon {
            width: 32px;
            height: 32px;
        }


        #tsh-about-root .tsh-about-specialties {
            padding: 22px 17px;
        }


        /*
       Horizontal scrolling tabs on mobile
       so they don't become a badly wrapped block.
    */

        #tsh-about-root .tsh-about-tabs {
            flex-wrap: nowrap;
            overflow-x: auto;
            padding-bottom: 15px;
            scrollbar-width: none;
        }


            #tsh-about-root .tsh-about-tabs::-webkit-scrollbar {
                display: none;
            }


        #tsh-about-root .tsh-about-tab {
            flex: 0 0 auto;
        }


        #tsh-about-root .tsh-about-cta {
            align-items: flex-start;
            flex-direction: column;
        }


        #tsh-about-root .tsh-about-btn-action {
            width: 100%;
        }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    #tsh-about-root .tsh-about-tag {
        align-items: flex-start;
    }


    #tsh-about-root .tsh-about-feature-card {
        gap: 11px;
    }


    #tsh-about-root .tsh-about-feature-icon {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
        font-size: 16px;
    }


    #tsh-about-root .tsh-about-feature-card h5 {
        font-size: 14px;
    }


    #tsh-about-root .tsh-about-feature-card p {
        font-size: 11.5px;
    }


    #tsh-about-root .tsh-about-image-wrapper {
        border-radius: 22px;
    }


    #tsh-about-root .tsh-about-badge-top {
        right: -3px;
    }


    #tsh-about-root .tsh-about-floating-card {
        display: none;
    }


    #tsh-about-root .tsh-about-service-item {
        min-height: 50px;
        padding: 11px 12px;
        font-size: 12px;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    #tsh-about-root *,
    #tsh-about-root *::before,
    #tsh-about-root *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* ==========================================================================
   TANYA SPECIALITY HOSPITAL - WHY CHOOSE US SECTION (CENTERED & ANIMATED)
   ========================================================================== */


#tsh-wcu-section {
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 600px;
    padding: 80px 20px;
    /* Parallax Background */
    background-image: linear-gradient( rgba(255, 255, 255, 0.88), rgba(255, 249, 199, 0.88) ), url("/images/HospitalGallery/whyChooseUS.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    /* THIS CREATES THE PARALLAX EFFECT */
    background-attachment: fixed;
    color: #000000;
    overflow: hidden;
}

/* ================================================================
   TANYA SPECIALITY HOSPITAL
   WHY CHOOSE US - PREMIUM 2026
   ================================================================ */

:root {
    --ty26why-brown: #9d795d;
    --ty26why-brown-dark: #795941;
    --ty26why-brown-light: #c7a990;
    --ty26why-yellow: #fff9c7;
    --ty26why-white: #ffffff;
    --ty26why-black: #000000;
    --ty26why-text: #5f554e;
    --ty26why-border: rgba(157, 121, 93, 0.18);
}


/* ================================================================
   MAIN SECTION
   ================================================================ */

.ty26why-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 105px 0 85px;
    background: #ffffff;
}


/* ================================================================
   FIXED PARALLAX BACKGROUND
   ================================================================ */

.ty26why-parallax-bg {
    position: fixed;
    inset: 0;
    z-index: -3;
    background-image: linear-gradient( rgba(255, 255, 255, 0.91), rgba(255, 255, 255, 0.91) ), url("/images/bg/medical-care-bg2.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    pointer-events: none;
}


/* ================================================================
   SOFT SECTION LAYER
   ================================================================ */

.ty26why-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: radial-gradient( circle at 8% 15%, rgba(255, 249, 199, 0.72), transparent 25% ), radial-gradient( circle at 92% 80%, rgba(157, 121, 93, 0.08), transparent 28% );
    pointer-events: none;
}


/* ================================================================
   DECORATIVE CIRCLES
   ================================================================ */

.ty26why-decoration-one,
.ty26why-decoration-two {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
}

.ty26why-decoration-one {
    width: 360px;
    height: 360px;
    top: -190px;
    left: -170px;
    border: 75px solid rgba(157, 121, 93, 0.07);
}

.ty26why-decoration-two {
    width: 300px;
    height: 300px;
    right: -160px;
    bottom: -160px;
    border: 60px solid rgba(255, 249, 199, 0.8);
}


/* ================================================================
   LEFT CONTENT
   ================================================================ */

.ty26why-content {
    position: relative;
    z-index: 2;
    padding-right: 35px;
}


/* ================================================================
   SECTION LABEL
   ================================================================ */

.ty26why-label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    color: var(--ty26why-brown);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.ty26why-label-line {
    width: 34px;
    height: 2px;
    background: var(--ty26why-brown);
    display: inline-block;
}

.ty26why-label i {
    font-size: 16px;
}


/* ================================================================
   MAIN HEADING
   ================================================================ */

.ty26why-heading {
    margin: 0 0 22px;
    color: var(--ty26why-black);
    font-size: clamp(38px, 4.4vw, 62px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2px;
}

.ty26why-heading-highlight {
    color: var(--ty26why-brown);
}


/* ================================================================
   DESCRIPTION
   ================================================================ */

.ty26why-description {
    max-width: 650px;
    margin: 0 0 30px;
    color: var(--ty26why-text);
    font-size: 16px;
    line-height: 1.85;
}


/* ================================================================
   FEATURE GRID
   ================================================================ */

.ty26why-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 25px;
}


/* ================================================================
   FEATURE CARD
   ================================================================ */

.ty26why-feature {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-height: 116px;
    padding: 17px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--ty26why-border);
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(65, 45, 32, 0.07);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

    .ty26why-feature:hover {
        transform: translateY(-6px);
        border-color: rgba(157, 121, 93, 0.45);
        box-shadow: 0 20px 45px rgba(65, 45, 32, 0.13);
    }


/* ================================================================
   FEATURE ICON
   ================================================================ */

.ty26why-feature-icon {
    width: 52px;
    height: 52px;
    min-width: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: var(--ty26why-yellow);
    color: var(--ty26why-brown);
    font-size: 20px;
    transition: all 0.35s ease;
}

.ty26why-feature:hover .ty26why-feature-icon {
    background: var(--ty26why-brown);
    color: var(--ty26why-white);
    transform: scale(1.08) rotate(-4deg);
}


/* ================================================================
   FEATURE TEXT
   ================================================================ */

.ty26why-feature-content {
    min-width: 0;
}

.ty26why-feature-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    color: var(--ty26why-black);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
}

.ty26why-feature-content p {
    margin: 7px 0 0;
    color: #766b63;
    font-size: 12.5px;
    line-height: 1.6;
}


/* ================================================================
   24x7 BADGE
   ================================================================ */

.ty26why-247 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    border-radius: 50px;
    background: var(--ty26why-brown);
    color: var(--ty26why-white);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.5px;
}


/* ================================================================
   CALL TO ACTION
   ================================================================ */

.ty26why-bottom {
    margin-top: 28px;
}

.ty26why-call {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 8px 18px 8px 8px;
    border-radius: 60px;
    background: var(--ty26why-brown);
    color: var(--ty26why-white) !important;
    text-decoration: none !important;
    box-shadow: 0 15px 35px rgba(157, 121, 93, 0.27);
    transition: all 0.35s ease;
}

    .ty26why-call:hover {
        color: var(--ty26why-white) !important;
        background: var(--ty26why-brown-dark);
        transform: translateY(-4px);
        box-shadow: 0 20px 45px rgba(157, 121, 93, 0.35);
    }

.ty26why-call-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ty26why-yellow);
    color: var(--ty26why-brown);
    font-size: 15px;
}

.ty26why-call-text small {
    display: block;
    color: rgba(255, 255, 255, 0.75);
    font-size: 9px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.ty26why-call-text strong {
    display: block;
    margin-top: 2px;
    color: #ffffff;
    font-size: 14px;
}

.ty26why-call-arrow {
    margin-left: 7px;
    transition: transform 0.3s ease;
}

.ty26why-call:hover .ty26why-call-arrow {
    transform: translateX(5px);
}


/* ================================================================
   RIGHT VIDEO AREA
   ================================================================ */

.ty26why-video-area {
    position: relative;
    min-height: 590px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}


/* ================================================================
   VIDEO LABEL
   ================================================================ */

.ty26why-video-label {
    position: absolute;
    top: 12px;
    left: 0;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 15px;
    background: #ffffff;
    border: 1px solid rgba(157, 121, 93, 0.15);
    border-radius: 50px;
    color: var(--ty26why-brown);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

    .ty26why-video-label i {
        font-size: 14px;
    }


/* ================================================================
   VIDEO CARD
   ================================================================ */

.ty26why-video-card {
    position: relative;
    width: 100%;
    max-width: 555px;
    height: 570px;
    overflow: hidden;
    border: 7px solid #ffffff;
    border-radius: 34px;
    background: #eeeeee;
    box-shadow: 0 30px 75px rgba(60, 42, 30, 0.18);
}


/* ================================================================
   VIDEO
   ================================================================ */

.ty26why-video {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    display: block;
    object-fit: cover !important;
}


/* ================================================================
   VIDEO OVERLAY
   ================================================================ */

.ty26why-video-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient( to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.03) 48%, rgba(0, 0, 0, 0.58) 100% );
    pointer-events: none;
}


/* ================================================================
   VIDEO PLAY BUTTON
   ================================================================ */

.ty26why-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 4;
    width: 78px;
    height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
    backdrop-filter: blur(10px);
    animation: ty26whyVideoPulse 2s infinite;
    pointer-events: none;
}

    .ty26why-video-play span {
        width: 51px;
        height: 51px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding-left: 3px;
        border-radius: 50%;
        background: #ffffff;
        color: var(--ty26why-brown);
    }

    .ty26why-video-play i {
        font-size: 16px;
    }


/* ================================================================
   VIDEO INFORMATION
   ================================================================ */

.ty26why-video-info {
    position: absolute;
    left: 25px;
    right: 25px;
    bottom: 24px;
    z-index: 5;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 15px;
    color: #ffffff;
}

    .ty26why-video-info small {
        display: block;
        margin-bottom: 5px;
        color: rgba(255, 255, 255, 0.82);
        font-size: 9px;
        font-weight: 700;
        letter-spacing: 1.5px;
    }

    .ty26why-video-info strong {
        display: block;
        color: #ffffff;
        font-size: 20px;
        line-height: 1.2;
    }


/* ================================================================
   24x7 VIDEO INDICATOR
   ================================================================ */

.ty26why-video-live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 50px;
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
    backdrop-filter: blur(8px);
}

.ty26why-video-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b7ffbd;
    box-shadow: 0 0 10px #b7ffbd;
}


/* ================================================================
   FLOATING DOCTOR CARD
   ================================================================ */

.ty26why-floating-card {
    position: absolute;
    left: -25px;
    bottom: 35px;
    z-index: 8;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 245px;
    padding: 14px 17px;
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(157, 121, 93, 0.15);
    border-radius: 18px;
    box-shadow: 0 20px 50px rgba(45, 30, 21, 0.16);
    backdrop-filter: blur(12px);
}

.ty26why-floating-icon {
    width: 46px;
    height: 46px;
    min-width: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: var(--ty26why-yellow);
    color: var(--ty26why-brown);
    font-size: 19px;
}

.ty26why-floating-content strong {
    display: block;
    color: #000000;
    font-size: 13px;
}

.ty26why-floating-content span {
    display: block;
    margin-top: 3px;
    color: #766b63;
    font-size: 10px;
}


/* ================================================================
   DECORATIVE RING
   ================================================================ */

.ty26why-video-ring {
    position: absolute;
    top: 70px;
    right: -25px;
    width: 100px;
    height: 100px;
    border: 18px solid rgba(157, 121, 93, 0.11);
    border-radius: 50%;
    z-index: 1;
}


/* ================================================================
   STATISTICS
   ================================================================ */

.ty26why-stats {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 25px;
    padding: 25px 10px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--ty26why-border);
    border-radius: 22px;
    box-shadow: 0 15px 45px rgba(70, 50, 37, 0.08);
    backdrop-filter: blur(8px);
}

.ty26why-stat {
    position: relative;
    padding: 8px 20px;
    text-align: center;
}

    .ty26why-stat:not(:last-child)::after {
        content: "";
        position: absolute;
        top: 10%;
        right: 0;
        width: 1px;
        height: 80%;
        background: rgba(157, 121, 93, 0.18);
    }

.ty26why-stat-number {
    color: var(--ty26why-brown);
    font-size: 30px;
    font-weight: 900;
    line-height: 1;
}

.ty26why-stat-text {
    margin-top: 8px;
    color: #70645c;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}


/* ================================================================
   VIDEO PULSE
   ================================================================ */

@keyframes ty26whyVideoPulse {

    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.55);
    }

    70% {
        box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}


/* ================================================================
   TABLET
   ================================================================ */

@media (max-width: 991.98px) {

    .ty26why-section {
        padding: 80px 0 70px;
    }

    .ty26why-content {
        padding-right: 0;
    }

    .ty26why-heading {
        font-size: 48px;
    }

    .ty26why-video-area {
        min-height: 520px;
        margin-top: 15px;
    }

    .ty26why-video-card {
        height: 520px;
        max-width: 620px;
    }

    .ty26why-floating-card {
        left: 5px;
    }

    .ty26why-video-ring {
        right: 5px;
    }
}


/* ================================================================
   MOBILE
   ================================================================ */

@media (max-width: 767.98px) {

    .ty26why-section {
        padding: 65px 0 55px;
    }

    .ty26why-heading {
        font-size: 39px;
        letter-spacing: -1px;
    }

    .ty26why-description {
        font-size: 14px;
        line-height: 1.75;
    }

    .ty26why-features {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .ty26why-feature {
        min-height: 105px;
        padding: 15px;
    }

    .ty26why-video-area {
        min-height: 430px;
        margin-top: 15px;
        padding: 10px 5px 20px;
    }

    .ty26why-video-card {
        height: 430px;
        border-width: 5px;
        border-radius: 25px;
    }

    .ty26why-video-label {
        top: 0;
        left: 5px;
        padding: 8px 11px;
        font-size: 8px;
    }

    .ty26why-floating-card {
        left: 0;
        bottom: 15px;
        min-width: 215px;
        padding: 11px 13px;
    }

    .ty26why-floating-icon {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    .ty26why-video-info {
        left: 18px;
        right: 18px;
        bottom: 18px;
    }

        .ty26why-video-info strong {
            font-size: 16px;
        }

    .ty26why-video-live {
        display: none;
    }

    .ty26why-stats {
        grid-template-columns: repeat(2, 1fr);
        padding: 15px 5px;
        border-radius: 18px;
    }

    .ty26why-stat {
        padding: 15px 8px;
    }

        .ty26why-stat:nth-child(2)::after {
            display: none;
        }

    .ty26why-stat-number {
        font-size: 24px;
    }

    .ty26why-stat-text {
        font-size: 9px;
    }
}


/* ================================================================
   SMALL MOBILE
   ================================================================ */

@media (max-width: 420px) {

    .ty26why-heading {
        font-size: 34px;
    }

    .ty26why-label {
        font-size: 10px;
        letter-spacing: 1.4px;
    }

    .ty26why-feature-title {
        font-size: 14px;
    }

    .ty26why-feature-content p {
        font-size: 12px;
    }

    .ty26why-video-area {
        min-height: 370px;
    }

    .ty26why-video-card {
        height: 370px;
    }

    .ty26why-video-info {
        left: 15px;
        right: 15px;
    }

        .ty26why-video-info strong {
            font-size: 14px;
        }

    .ty26why-floating-card {
        min-width: 195px;
    }

    .ty26why-call {
        width: 100%;
        justify-content: center;
    }
}






/* =========================================================
   TANYA SPECIALITY HOSPITAL
   PREMIUM GALLERY
   ========================================================= */

#tanyaPremiumGallery {
    width: 100% !important;
    display: block !important;
    overflow: hidden !important;
    background: #ffffff !important;
}


    /* =========================================================
   MAIN WRAPPER
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-main {
        width: 100% !important;
        max-width: 1280px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
    }


    /* =========================================================
   HEADER
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-header {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        margin: 0 0 45px 0 !important;
        padding: 0 !important;
    }


    #tanyaPremiumGallery .tanya-gallery-header-content {
        width: 100% !important;
        max-width: 900px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
    }


    /* =========================================================
   KICKER
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-kicker {
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 25px auto 18px auto !important;
        padding: 9px 18px !important;
        background: #fff9c7 !important;
        color: #9d795d !important;
        border-radius: 50px !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        letter-spacing: 1.5px !important;
        text-transform: uppercase !important;
        text-align: center !important;
    }


        #tanyaPremiumGallery .tanya-gallery-kicker i {
            margin-right: 9px !important;
            font-size: 16px !important;
        }


    /* =========================================================
   MAIN TITLE
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-title {
        display: block !important;
        width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        color: #000000 !important;
        font-size: clamp(34px, 5vw, 58px) !important;
        font-weight: 800 !important;
        line-height: 1.12 !important;
        text-align: center !important;
        letter-spacing: -1.5px !important;
    }


        #tanyaPremiumGallery .tanya-gallery-title span {
            display: inline !important;
            color: #9d795d !important;
            margin: 0 !important;
            padding: 0 !important;
        }


    /* =========================================================
   DESCRIPTION
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-description {
        display: block !important;
        width: 100% !important;
        max-width: 720px !important;
        margin: 20px auto 0 auto !important;
        padding: 0 !important;
        color: #666666 !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        line-height: 1.8 !important;
        text-align: center !important;
    }


    /* =========================================================
   FILTER AREA
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-filter-area {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 0 45px 0 !important;
        padding: 0 !important;
    }


    #tanyaPremiumGallery .tanya-gallery-filters {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
        margin: 0 !important;
        padding: 0 !important;
    }


    /* =========================================================
   FILTER BUTTON
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-filter {
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        min-height: 46px !important;
        margin: 0 !important;
        padding: 10px 22px !important;
        border: 1px solid #e4e4e4 !important;
        border-radius: 50px !important;
        background: #ffffff !important;
        color: #333333 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        cursor: pointer !important;
        transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease !important;
    }


        #tanyaPremiumGallery .tanya-gallery-filter:hover {
            background: #fff9c7 !important;
            border-color: #9d795d !important;
            color: #000000 !important;
            transform: translateY(-2px) !important;
        }


        #tanyaPremiumGallery .tanya-gallery-filter.active {
            background: #9d795d !important;
            border-color: #9d795d !important;
            color: #ffffff !important;
            box-shadow: 0 8px 22px rgba(157, 121, 93, 0.22) !important;
        }


    /* =========================================================
   GALLERY GRID
   IMPORTANT:
   We are NOT using Bootstrap row/col here.
   gap is controlled directly.
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        column-gap: 28px !important;
        row-gap: 28px !important;
        margin: 0 !important;
        padding: 0 !important;
    }


    /* =========================================================
   GALLERY ITEM
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-item {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        transition: opacity 0.4s ease, transform 0.4s ease !important;
    }


    /* =========================================================
   GALLERY CARD
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-card {
        width: 100% !important;
        height: 350px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 22px !important;
        overflow: hidden !important;
        background: #ffffff !important;
        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.10) !important;
        position: relative !important;
        transition: transform 0.45s ease, box-shadow 0.45s ease !important;
    }


        #tanyaPremiumGallery .tanya-gallery-card:hover {
            transform: translateY(-8px) !important;
            box-shadow: 0 22px 50px rgba(0, 0, 0, 0.17) !important;
        }


    /* =========================================================
   IMAGE BOX
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-image-box {
        width: 100% !important;
        height: 100% !important;
        position: relative !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }


    /* =========================================================
   IMAGE
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-image {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: cover !important;
        transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) !important;
    }


    #tanyaPremiumGallery .tanya-gallery-card:hover .tanya-gallery-image {
        transform: scale(1.08) !important;
    }


    /* =========================================================
   DARK OVERLAY
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-overlay {
        position: absolute !important;
        inset: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: linear-gradient( to top, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.28) 48%, rgba(0, 0, 0, 0.02) 100% ) !important;
        z-index: 2 !important;
    }


    /* =========================================================
   EXPAND ICON
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-expand {
        position: absolute !important;
        top: 20px !important;
        right: 20px !important;
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, 0.92) !important;
        color: #000000 !important;
        font-size: 15px !important;
        z-index: 4 !important;
        opacity: 0 !important;
        transform: translateY(-10px) !important;
        transition: opacity 0.35s ease, transform 0.35s ease !important;
    }


    #tanyaPremiumGallery .tanya-gallery-card:hover .tanya-gallery-expand {
        opacity: 1 !important;
        transform: translateY(0) !important;
    }


    /* =========================================================
   IMAGE TEXT
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-info {
        position: absolute !important;
        left: 25px !important;
        right: 25px !important;
        bottom: 24px !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 3 !important;
    }


    #tanyaPremiumGallery .tanya-gallery-label {
        display: inline-block !important;
        margin: 0 0 9px 0 !important;
        padding: 6px 12px !important;
        border-radius: 50px !important;
        background: #fff9c7 !important;
        color: #000000 !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: 0.5px !important;
        text-transform: uppercase !important;
    }


    #tanyaPremiumGallery .tanya-gallery-info h3 {
        margin: 0 !important;
        padding: 0 !important;
        color: #ffffff !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
    }


    /* =========================================================
   SCROLL ANIMATION INITIAL STATES
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-left {
        opacity: 0 !important;
        transform: translateX(-70px) !important;
    }


    #tanyaPremiumGallery .tanya-gallery-right {
        opacity: 0 !important;
        transform: translateX(70px) !important;
    }


    #tanyaPremiumGallery .tanya-gallery-bottom {
        opacity: 0 !important;
        transform: translateY(70px) !important;
    }


        #tanyaPremiumGallery .tanya-gallery-left.tanya-gallery-visible,
        #tanyaPremiumGallery .tanya-gallery-right.tanya-gallery-visible,
        #tanyaPremiumGallery .tanya-gallery-bottom.tanya-gallery-visible {
            opacity: 1 !important;
            transform: translate(0, 0) !important;
            transition: opacity 0.8s ease, transform 0.8s ease !important;
        }


    /* =========================================================
   FILTER ANIMATION
   ========================================================= */

    #tanyaPremiumGallery .tanya-gallery-item.tanya-gallery-hide {
        display: none !important;
    }


    #tanyaPremiumGallery .tanya-gallery-item.tanya-gallery-show {
        animation: tanyaGalleryAppear 0.45s ease both !important;
    }


@keyframes tanyaGalleryAppear {

    from {
        opacity: 0;
        transform: scale(0.96);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    #tanyaPremiumGallery .tanya-gallery-main {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 22px !important;
        row-gap: 22px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-card {
        height: 320px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767.98px) {

    #tanyaPremiumGallery .tanya-gallery-main {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-header {
        margin-bottom: 32px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-title {
        font-size: 34px !important;
        letter-spacing: -0.8px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-description {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }

    #tanyaPremiumGallery .tanya-gallery-filter-area {
        margin-bottom: 32px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-filters {
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        padding-bottom: 8px !important;
        gap: 10px !important;
        scrollbar-width: none !important;
    }

        #tanyaPremiumGallery .tanya-gallery-filters::-webkit-scrollbar {
            display: none !important;
        }

    #tanyaPremiumGallery .tanya-gallery-filter {
        min-height: 42px !important;
        padding: 9px 17px !important;
        font-size: 13px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-card {
        height: 330px !important;
        border-radius: 18px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-info {
        left: 20px !important;
        right: 20px !important;
        bottom: 20px !important;
    }

        #tanyaPremiumGallery .tanya-gallery-info h3 {
            font-size: 18px !important;
        }
}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    #tanyaPremiumGallery .tanya-gallery-title {
        font-size: 30px !important;
    }

    #tanyaPremiumGallery .tanya-gallery-card {
        height: 290px !important;
    }
}



















/* ============================================================
   TANYA SPECIALITY HOSPITAL
   PREMIUM UROLOGY PAGE
   95% WIDTH + REDUCED SECTION SPACING
   ============================================================ */

.tyu-page {
    --tyu-brown: #9d795d;
    --tyu-brown-dark: #765642;
    --tyu-yellow: #fff9c7;
    --tyu-white: #ffffff;
    --tyu-black: #000000;
    --tyu-soft: #faf8f4;
    --tyu-border: rgba(157, 121, 93, 0.18);
    font-family: "Work Sans", Arial, sans-serif;
    color: var(--tyu-black);
    background: var(--tyu-white);
    overflow: hidden;
}


    /* ============================================================
   CONTAINER
   95% WIDTH
   IMPORTANT:
   Scoped only to UROLOGY PAGE
   Will NOT affect header / navbar / shared slider
   ============================================================ */

    .tyu-page .container {
        width: 95%;
        max-width: 1600px;
        margin-left: auto;
        margin-right: auto;
    }


    /* ============================================================
   COMMON
   ============================================================ */

    .tyu-page img {
        max-width: 100%;
        display: block;
    }

    .tyu-page a {
        text-decoration: none;
    }


/* ============================================================
   SECTION KICKER
   ============================================================ */

.tyu-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--tyu-brown);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

    .tyu-section-kicker i {
        font-size: 14px;
    }


/* ============================================================
   SECTION HEADING
   ============================================================ */

.tyu-section-heading {
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1.08;
    font-weight: 700;
    color: var(--tyu-black);
    margin: 0 0 20px;
}

    .tyu-section-heading span {
        color: var(--tyu-brown);
        display: inline-block;
    }


/* ============================================================
   SECTION DESCRIPTION
   ============================================================ */

.tyu-section-description {
    max-width: 720px;
    margin: 0 auto;
    color: #666;
    font-size: 16px;
    line-height: 1.8;
}


/* ============================================================
   HERO
   REDUCED TOP / BOTTOM SPACING
   ============================================================ */

.tyu-hero {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: center;
    background: linear-gradient( 135deg, #fff9c7 0%, #ffffff 48%, #f5eee8 100% );
    padding: 55px 0 60px;
    overflow: hidden;
}


/* ============================================================
   HERO PATTERN
   ============================================================ */

.tyu-hero-pattern {
    position: absolute;
    inset: 0;
    background-image: radial-gradient( rgba(157, 121, 93, 0.12) 1px, transparent 1px );
    background-size: 26px 26px;
    pointer-events: none;
}


/* ============================================================
   HERO CIRCLES
   ============================================================ */

.tyu-hero-circle {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.tyu-hero-circle-one {
    width: 420px;
    height: 420px;
    right: -170px;
    top: -130px;
    border: 70px solid rgba(157, 121, 93, 0.07);
}

.tyu-hero-circle-two {
    width: 250px;
    height: 250px;
    left: -120px;
    bottom: -100px;
    border: 50px solid rgba(255, 249, 199, 0.8);
}


/* ============================================================
   HERO CONTENT
   ============================================================ */

.tyu-hero-content {
    position: relative;
    z-index: 2;
}


/* ============================================================
   HERO LABEL
   ============================================================ */

.tyu-mini-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(157, 121, 93, 0.18);
    padding: 9px 16px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.8px;
    color: var(--tyu-brown);
    margin-bottom: 22px;
}

.tyu-label-dot {
    width: 8px;
    height: 8px;
    background: var(--tyu-brown);
    border-radius: 50%;
    animation: tyu-pulse 1.8s infinite;
}


/* ============================================================
   PULSE
   ============================================================ */

@keyframes tyu-pulse {

    0% {
        box-shadow: 0 0 0 0 rgba(157, 121, 93, 0.5);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(157, 121, 93, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(157, 121, 93, 0);
    }
}


/* ============================================================
   HERO TITLE
   ============================================================ */

.tyu-hero-title {
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(42px, 5vw, 72px);
    line-height: 1.02;
    font-weight: 700;
    color: var(--tyu-black);
    max-width: 680px;
    margin: 0 0 25px;
}

    .tyu-hero-title span {
        color: var(--tyu-brown);
        display: block;
    }


/* ============================================================
   HERO TEXT
   ============================================================ */

.tyu-hero-text {
    max-width: 610px;
    font-size: 17px;
    line-height: 1.85;
    color: #555;
    margin-bottom: 30px;
}


/* ============================================================
   HERO BUTTONS
   ============================================================ */

.tyu-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.tyu-primary-btn,
.tyu-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 52px;
    padding: 0 23px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 700;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}


/* PRIMARY */

.tyu-primary-btn {
    background: var(--tyu-brown);
    color: var(--tyu-white);
    box-shadow: 0 12px 30px rgba(157, 121, 93, 0.25);
}

    .tyu-primary-btn:hover {
        color: var(--tyu-white);
        background: var(--tyu-brown-dark);
        transform: translateY(-3px);
        box-shadow: 0 18px 35px rgba(157, 121, 93, 0.32);
    }


/* SECONDARY */

.tyu-secondary-btn {
    color: var(--tyu-black);
    background: var(--tyu-white);
    border: 1px solid var(--tyu-border);
}

    .tyu-secondary-btn:hover {
        color: var(--tyu-brown);
        transform: translateY(-3px);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    }


/* ============================================================
   HERO TRUST
   ============================================================ */

.tyu-hero-trust {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}

.tyu-trust-item {
    display: flex;
    align-items: center;
    gap: 9px;
}

    .tyu-trust-item > i {
        color: var(--tyu-brown);
        font-size: 19px;
    }

    .tyu-trust-item strong,
    .tyu-trust-item small {
        display: block;
    }

    .tyu-trust-item strong {
        font-size: 13px;
    }

    .tyu-trust-item small {
        color: #777;
        font-size: 11px;
        margin-top: 2px;
    }

.tyu-trust-divider {
    height: 32px;
    width: 1px;
    background: rgba(0, 0, 0, 0.12);
}


/* ============================================================
   HERO IMAGE
   ============================================================ */

.tyu-hero-visual {
    position: relative;
    padding: 15px;
}

.tyu-image-frame {
    position: relative;
    height: 500px;
    border-radius: 34px;
    overflow: visible;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.15);
}

.tyu-hero-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 34px;
    transition: transform 0.8s ease;
}

.tyu-image-frame:hover .tyu-hero-image {
    transform: scale(1.04);
}


/* ============================================================
   HERO IMAGE OVERLAY
   ============================================================ */

.tyu-image-overlay {
    position: absolute;
    inset: 0;
    border-radius: 34px;
    background: linear-gradient( 180deg, transparent 45%, rgba(0, 0, 0, 0.38) 100% );
}


/* ============================================================
   FLOATING CARDS
   ============================================================ */

.tyu-floating-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.95);
    padding: 13px 17px;
    border-radius: 15px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.14);
    z-index: 5;
}

.tyu-floating-top {
    top: 30px;
    right: -25px;
}

.tyu-floating-bottom {
    bottom: 35px;
    left: -25px;
}

.tyu-floating-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--tyu-yellow);
    color: var(--tyu-brown);
    font-size: 17px;
}

.tyu-floating-card strong,
.tyu-floating-card span {
    display: block;
}

.tyu-floating-card strong {
    font-size: 13px;
}

.tyu-floating-card span {
    color: #777;
    font-size: 11px;
    margin-top: 2px;
}


/* ============================================================
   INTRODUCTION
   REDUCED SPACING
   ============================================================ */

.tyu-intro {
    padding: 55px 0;
    background: var(--tyu-white);
}


/* ============================================================
   INTRO IMAGE
   ============================================================ */

.tyu-intro-image {
    position: relative;
    padding: 15px;
}

    .tyu-intro-image::before {
        content: "";
        position: absolute;
        width: 170px;
        height: 170px;
        left: -20px;
        bottom: -20px;
        background: var(--tyu-yellow);
        border-radius: 30px;
        z-index: 0;
    }

    .tyu-intro-image img {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 410px;
        object-fit: cover;
        border-radius: 25px;
        box-shadow: 0 25px 55px rgba(0, 0, 0, 0.13);
    }


/* ============================================================
   INTRO BADGE
   ============================================================ */

.tyu-image-badge {
    position: absolute;
    right: -10px;
    bottom: 35px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--tyu-brown);
    color: var(--tyu-white);
    padding: 15px 20px;
    border-radius: 14px;
    box-shadow: 0 15px 35px rgba(157, 121, 93, 0.3);
}

    .tyu-image-badge i {
        font-size: 20px;
    }

    .tyu-image-badge span,
    .tyu-image-badge small {
        display: block;
    }

    .tyu-image-badge span {
        font-size: 13px;
        font-weight: 700;
    }

    .tyu-image-badge small {
        font-size: 11px;
        opacity: 0.75;
        margin-top: 2px;
    }


/* ============================================================
   INTRO CONTENT
   ============================================================ */

.tyu-intro-content {
    max-width: 800px;
}

    .tyu-intro-content p {
        color: #5d5d5d;
        line-height: 1.9;
        font-size: 16px;
    }


/* ============================================================
   INTRO FEATURE ROW
   ============================================================ */

.tyu-feature-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.tyu-feature-box {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 50px;
    background: var(--tyu-yellow);
    font-size: 12px;
    font-weight: 700;
}

    .tyu-feature-box i {
        color: var(--tyu-brown);
    }


/* ============================================================
   SERVICES HEADING
   REDUCED TOP/BOTTOM SPACING
   ============================================================ */

.tyu-services-heading {
    padding: 35px 0 20px;
    background: var(--tyu-soft);
}


/* ============================================================
   SERVICES
   REDUCED BOTTOM SPACE
   ============================================================ */

.tyu-services {
    padding: 20px 0 55px;
    background: var(--tyu-soft);
}


    /* ============================================================
   SERVICE ROW
   EQUAL HEIGHT COLUMNS
   ============================================================ */

    .tyu-services .row {
        display: flex;
        flex-wrap: wrap;
    }

        .tyu-services .row > [class*="col-"] {
            display: flex;
            flex-direction: column;
        }


/* ============================================================
   SERVICE CARD
   ============================================================ */

.tyu-service-card {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--tyu-white);
    border-radius: 24px;
    border: 1px solid rgba(157, 121, 93, 0.12);
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.06);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

    .tyu-service-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 25px 55px rgba(0, 0, 0, 0.13);
    }


/* ============================================================
   SERVICE IMAGE
   ============================================================ */

.tyu-service-image {
    position: relative;
    flex: 0 0 245px;
    height: 245px;
    overflow: hidden;
}

    .tyu-service-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.7s ease;
    }

.tyu-service-card:hover
.tyu-service-image img {
    transform: scale(1.08);
}


/* ============================================================
   SERVICE NUMBER
   ============================================================ */

.tyu-service-number {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255, 249, 199, 0.95);
    color: var(--tyu-brown);
    font-family: "Fraunces", Georgia, serif;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}


/* ============================================================
   SERVICE BODY
   ============================================================ */

.tyu-service-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 27px 25px 28px;
}


/* ============================================================
   SERVICE TAG
   ============================================================ */

.tyu-service-tag {
    display: inline-block;
    color: var(--tyu-brown);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.6px;
    margin-bottom: 10px;
}


/* ============================================================
   SERVICE TITLE
   ============================================================ */

.tyu-service-body h3 {
    font-family: "Fraunces", Georgia, serif;
    font-size: 23px;
    line-height: 1.2;
    margin: 0 0 14px;
    color: var(--tyu-black);
    min-height: 58px;
    display: flex;
    align-items: flex-start;
}


/* ============================================================
   SERVICE DESCRIPTION
   ============================================================ */

.tyu-service-body p {
    color: #686868;
    font-size: 14px;
    line-height: 1.75;
    margin-bottom: 20px;
    min-height: 75px;
}


/* ============================================================
   SERVICE POINTS
   ============================================================ */

.tyu-service-points {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    min-height: 38px;
    align-content: flex-start;
}

    .tyu-service-points span {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: #faf7f3;
        border-radius: 50px;
        padding: 7px 10px;
        color: #555;
        font-size: 10px;
        font-weight: 600;
    }

    .tyu-service-points i {
        color: var(--tyu-brown);
    }


/* ============================================================
   SCROLL REVEAL
   ============================================================ */

.tyu-page .tyu-reveal-left,
.tyu-page .tyu-reveal-right,
.tyu-page .tyu-reveal-up {
    opacity: 0;
    will-change: transform, opacity;
}

.tyu-page .tyu-reveal-left {
    transform: translateX(-70px);
}

.tyu-page .tyu-reveal-right {
    transform: translateX(70px);
}

.tyu-page .tyu-reveal-up {
    transform: translateY(60px);
}


/* ============================================================
   TABLET
   992px AND BELOW
   ============================================================ */

@media (max-width: 991.98px) {

    /* 95% WIDTH */
    .tyu-page .container {
        width: 95%;
        max-width: none;
    }


    /* HERO */

    .tyu-hero {
        min-height: auto;
        padding: 55px 0 50px;
    }

    .tyu-hero-title {
        font-size: clamp(40px, 7vw, 60px);
    }

    .tyu-image-frame {
        height: 440px;
    }

    .tyu-hero-visual {
        padding: 10px;
        margin-top: 15px;
    }

    .tyu-floating-top {
        right: -5px;
    }

    .tyu-floating-bottom {
        left: -5px;
    }


    /* INTRO */

    .tyu-intro {
        padding: 50px 0;
    }


    /* SERVICES HEADING */

    .tyu-services-heading {
        padding: 35px 0 15px;
    }


    /* SERVICES */

    .tyu-services {
        padding: 15px 0 45px;
    }


        /* SERVICE IMAGE */

        .tyu-services .tyu-service-image {
            flex-basis: 230px;
            height: 230px;
        }


        /* SERVICE BODY */

        .tyu-services .tyu-service-body {
            min-height: 340px;
        }

            .tyu-services .tyu-service-body h3 {
                min-height: 60px;
            }

            .tyu-services .tyu-service-body p {
                min-height: 82px;
            }
}


/* ============================================================
   MOBILE
   768px AND BELOW
   ============================================================ */

@media (max-width: 767.98px) {

    /* 95% WIDTH */

    .tyu-page .container {
        width: 95%;
        max-width: none;
    }


    /* HERO */

    .tyu-hero {
        padding: 45px 0 45px;
    }

    .tyu-hero-title {
        font-size: 42px;
    }

    .tyu-hero-text {
        font-size: 15px;
        line-height: 1.75;
    }


    /* BUTTONS */

    .tyu-hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .tyu-primary-btn,
    .tyu-secondary-btn {
        width: 100%;
    }


    /* TRUST */

    .tyu-hero-trust {
        gap: 12px;
        justify-content: space-between;
        margin-top: 25px;
    }

    .tyu-trust-item {
        gap: 6px;
    }

        .tyu-trust-item > i {
            font-size: 15px;
        }

        .tyu-trust-item strong {
            font-size: 11px;
        }

        .tyu-trust-item small {
            font-size: 9px;
        }

    .tyu-trust-divider {
        height: 25px;
    }


    /* HERO IMAGE */

    .tyu-image-frame {
        height: 330px;
        border-radius: 22px;
    }

    .tyu-hero-image,
    .tyu-image-overlay {
        border-radius: 22px;
    }


    /* FLOATING CARDS */

    .tyu-floating-card {
        padding: 9px 12px;
    }

    .tyu-floating-icon {
        width: 35px;
        height: 35px;
    }

    .tyu-floating-card strong {
        font-size: 11px;
    }

    .tyu-floating-card span {
        font-size: 9px;
    }

    .tyu-floating-top {
        top: 15px;
        right: -5px;
    }

    .tyu-floating-bottom {
        bottom: 15px;
        left: -5px;
    }


    /* INTRO */

    .tyu-intro {
        padding: 45px 0;
    }

    .tyu-intro-image img {
        height: 320px;
    }


    /* BADGE */

    .tyu-image-badge {
        right: 0;
        bottom: 20px;
        padding: 11px 14px;
    }


    /* HEADINGS */

    .tyu-section-heading {
        font-size: 34px;
    }

    .tyu-section-description {
        font-size: 14px;
    }


    /* SERVICES HEADING */

    .tyu-services-heading {
        padding: 30px 0 10px;
    }


    /* SERVICES */

    .tyu-services {
        padding: 10px 0 45px;
    }


        /* SERVICE IMAGE */

        .tyu-services .tyu-service-image {
            flex-basis: 220px;
            height: 220px;
        }


        /* SERVICE BODY */

        .tyu-services .tyu-service-body {
            min-height: auto;
            padding: 23px 20px;
        }

            .tyu-services .tyu-service-body h3 {
                min-height: auto;
                display: block;
                font-size: 21px;
            }

            .tyu-services .tyu-service-body p {
                min-height: auto;
            }


        /* SERVICE POINTS */

        .tyu-services .tyu-service-points {
            margin-top: 0;
            min-height: auto;
        }
}


/* ============================================================
   SMALL MOBILE
   ============================================================ */

@media (max-width: 420px) {

    .tyu-page .container {
        width: 95%;
    }


    /* HERO */

    .tyu-hero-title {
        font-size: 36px;
    }

    .tyu-mini-label {
        font-size: 10px;
        letter-spacing: 1.3px;
    }


    /* TRUST */

    .tyu-hero-trust {
        gap: 7px;
    }

    .tyu-trust-divider {
        display: none;
    }

    .tyu-trust-item {
        flex-direction: column;
        text-align: center;
    }


    /* HERO IMAGE */

    .tyu-image-frame {
        height: 290px;
    }


    /* SERVICE IMAGE */

    .tyu-services .tyu-service-image {
        flex-basis: 200px;
        height: 200px;
    }

    .tyu-services .tyu-service-body {
        padding: 22px 18px 24px;
    }

    .tyu-service-body h3 {
        font-size: 20px;
    }


    /* INTRO FEATURES */

    .tyu-feature-row {
        flex-direction: column;
        align-items: flex-start;
    }
}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .tyu-page *,
    .tyu-page *::before,
    .tyu-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .tyu-page .tyu-reveal-left,
    .tyu-page .tyu-reveal-right,
    .tyu-page .tyu-reveal-up {
        opacity: 1 !important;
        transform: none !important;
    }
}




/* =========================================================
   TANYA SPECIALITY HOSPITAL
   OBG PAGE
   PREMIUM 2026 DESIGN
   UNIQUE PREFIX: tanya-obg
   ========================================================= */


/* =========================================================
   ROOT
   ========================================================= */

#tanya-obg-page {
    --obg-brown: #9d795d;
    --obg-brown-dark: #735540;
    --obg-brown-light: #c5aa96;
    --obg-yellow: #fff9c7;
    --obg-yellow-dark: #e9dc82;
    --obg-white: #ffffff;
    --obg-black: #000000;
    --obg-text: #292929;
    --obg-muted: #6a6a6a;
    color: var(--obg-text);
    background: var(--obg-white);
    overflow: hidden;
}


    /* =========================================================
   COMMON
   ========================================================= */

    #tanya-obg-page *,
    #tanya-obg-page *::before,
    #tanya-obg-page *::after {
        box-sizing: border-box;
    }

    #tanya-obg-page img {
        max-width: 100%;
    }

    #tanya-obg-page a {
        text-decoration: none;
    }


    /* =========================================================
   95% PAGE WIDTH
   IMPORTANT:
   Scoped only to OBG page.
   Does NOT affect header/navbar/slider.
   ========================================================= */

    #tanya-obg-page .container {
        width: 95%;
        max-width: 1600px;
        margin-left: auto;
        margin-right: auto;
    }


/* =========================================================
   HERO
   ========================================================= */

.tanya-obg-hero {
    position: relative;
    /* Reduced from 650px */
    min-height: 620px;
    display: flex;
    align-items: center;
    /* Reduced from 85px */
    padding: 55px 0;
    background: linear-gradient( 110deg, #fff9c7 0%, #ffffff 48%, #f7f1ec 100% );
}

    .tanya-obg-hero::before {
        content: "";
        position: absolute;
        width: 450px;
        height: 450px;
        left: -200px;
        top: -180px;
        border-radius: 50%;
        background: rgba(157, 121, 93, 0.08);
    }

    .tanya-obg-hero::after {
        content: "";
        position: absolute;
        width: 350px;
        height: 350px;
        right: -160px;
        bottom: -160px;
        border-radius: 50%;
        background: rgba(157, 121, 93, 0.08);
    }

.tanya-obg-hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at 80% 30%, rgba(255, 249, 199, 0.65), transparent 35% );
    pointer-events: none;
}

.tanya-obg-hero-content {
    position: relative;
    z-index: 2;
    max-width: 620px;
}

.tanya-obg-hero-label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 20px;
    padding: 9px 17px;
    border-radius: 50px;
    background: var(--obg-yellow);
    color: var(--obg-brown-dark);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

    .tanya-obg-hero-label i {
        color: var(--obg-brown);
        font-size: 16px;
    }

.tanya-obg-hero h1 {
    margin: 0 0 20px;
    color: var(--obg-black);
    font-size: clamp(40px, 5vw, 68px);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -2px;
}

    .tanya-obg-hero h1 span {
        display: block;
        color: var(--obg-brown);
    }

.tanya-obg-hero-content > p {
    max-width: 570px;
    margin: 0;
    color: var(--obg-muted);
    font-size: 16px;
    line-height: 1.8;
}

.tanya-obg-hero-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.tanya-obg-primary-btn,
.tanya-obg-secondary-btn {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 13px 22px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

.tanya-obg-primary-btn {
    background: var(--obg-brown);
    color: #ffffff;
    box-shadow: 0 10px 25px rgba(157, 121, 93, 0.28);
}

    .tanya-obg-primary-btn:hover {
        color: #ffffff;
        transform: translateY(-3px);
        background: var(--obg-brown-dark);
        box-shadow: 0 15px 30px rgba(157, 121, 93, 0.35);
    }

.tanya-obg-secondary-btn {
    border: 1px solid rgba(157, 121, 93, 0.35);
    background: #ffffff;
    color: var(--obg-brown-dark);
}

    .tanya-obg-secondary-btn:hover {
        color: var(--obg-brown-dark);
        transform: translateY(-3px);
        background: var(--obg-yellow);
    }


/* =========================================================
   HERO IMAGE
   ========================================================= */

.tanya-obg-hero-image {
    position: relative;
    height: 470px;
    overflow: hidden;
    border-radius: 28px;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.16);
}

    .tanya-obg-hero-image img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 0.8s ease;
    }

    .tanya-obg-hero-image:hover img {
        transform: scale(1.04);
    }

    .tanya-obg-hero-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( to top, rgba(0, 0, 0, 0.55), transparent 55% );
    }

.tanya-obg-hero-image-badge {
    position: absolute;
    z-index: 2;
    left: 25px;
    right: 25px;
    bottom: 25px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 15px 18px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}

    .tanya-obg-hero-image-badge > i {
        width: 43px;
        height: 43px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        border-radius: 11px;
        background: var(--obg-yellow);
        color: var(--obg-brown);
        font-size: 18px;
    }

    .tanya-obg-hero-image-badge strong {
        display: block;
        color: var(--obg-black);
        font-size: 14px;
    }

    .tanya-obg-hero-image-badge small {
        display: block;
        margin-top: 3px;
        color: var(--obg-muted);
        font-size: 11px;
    }


/* =========================================================
   INTRODUCTION
   ========================================================= */

.tanya-obg-introduction {
    padding: 65px 0;
    background: #ffffff;
}

.tanya-obg-intro-image {
    position: relative;
    height: 450px;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

    .tanya-obg-intro-image img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.tanya-obg-intro-experience {
    position: absolute;
    left: 20px;
    bottom: 20px;
    padding: 17px 21px;
    border-radius: 13px;
    background: var(--obg-yellow);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.14);
}

    .tanya-obg-intro-experience strong {
        display: block;
        color: var(--obg-brown-dark);
        font-size: 18px;
    }

    .tanya-obg-intro-experience span {
        display: block;
        color: var(--obg-black);
        font-size: 11px;
        font-weight: 700;
    }

.tanya-obg-small-title {
    display: block;
    margin-bottom: 12px;
    color: var(--obg-brown);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.tanya-obg-intro-content h2 {
    max-width: 650px;
    margin: 0 0 20px;
    color: var(--obg-black);
    font-size: clamp(31px, 4vw, 48px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -1px;
}

    .tanya-obg-intro-content h2 span {
        color: var(--obg-brown);
    }

.tanya-obg-intro-content p {
    margin-bottom: 14px;
    color: var(--obg-muted);
    font-size: 15px;
    line-height: 1.8;
}

.tanya-obg-intro-points {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
    margin-top: 22px;
}

    .tanya-obg-intro-points div {
        display: flex;
        align-items: center;
        gap: 9px;
        color: var(--obg-text);
        font-size: 13px;
        font-weight: 600;
    }

    .tanya-obg-intro-points i {
        color: var(--obg-brown);
    }


/* =========================================================
   SERVICES SECTION
   ========================================================= */

.tanya-obg-services {
    padding: 35px 0 60px;
    background: linear-gradient( 180deg, #fff9c7 0%, #ffffff 17%, #ffffff 100% );
}

.tanya-obg-section-heading {
    max-width: 800px;
    margin: 0 auto 40px;
    text-align: center;
}

    .tanya-obg-section-heading h2 {
        margin: 0 0 15px;
        color: var(--obg-black);
        font-size: clamp(30px, 4vw, 46px);
        line-height: 1.15;
        font-weight: 800;
    }

        .tanya-obg-section-heading h2 span {
            color: var(--obg-brown);
        }

    .tanya-obg-section-heading p {
        max-width: 700px;
        margin: 0 auto;
        color: var(--obg-muted);
        font-size: 15px;
        line-height: 1.8;
    }


/* =========================================================
   SERVICE GRID
   ========================================================= */

.tanya-obg-service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    align-items: stretch;
}


/* =========================================================
   SERVICE CARD
   ========================================================= */

.tanya-obg-service-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(157, 121, 93, 0.17);
    border-radius: 19px;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.065);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

    .tanya-obg-service-card:hover {
        transform: translateY(-9px);
        border-color: rgba(157, 121, 93, 0.5);
        box-shadow: 0 25px 50px rgba(0, 0, 0, 0.12);
    }


/* =========================================================
   CARD IMAGE
   ========================================================= */

.tanya-obg-card-image {
    position: relative;
    height: 220px;
    flex-shrink: 0;
    overflow: hidden;
    background: var(--obg-yellow);
}

    .tanya-obg-card-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( to top, rgba(0, 0, 0, 0.35), transparent 55% );
    }

    .tanya-obg-card-image img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 0.65s ease;
    }

.tanya-obg-service-card:hover .tanya-obg-card-image img {
    transform: scale(1.07);
}


/* =========================================================
   CARD NUMBER
   ========================================================= */

.tanya-obg-card-number {
    position: absolute;
    z-index: 2;
    top: 15px;
    right: 15px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--obg-yellow);
    color: var(--obg-brown-dark);
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 7px 20px rgba(0, 0, 0, 0.16);
}


/* =========================================================
   CARD CONTENT
   ========================================================= */

.tanya-obg-card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 22px 23px 24px;
}

    .tanya-obg-card-content > span {
        margin-bottom: 8px;
        color: var(--obg-brown);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 1.5px;
    }

    .tanya-obg-card-content h3 {
        min-height: 55px;
        margin: 0 0 11px;
        color: var(--obg-black);
        font-size: 19px;
        line-height: 1.4;
        font-weight: 800;
    }

    .tanya-obg-card-content p {
        margin: auto 0 0;
        color: var(--obg-muted);
        font-size: 13.5px;
        line-height: 1.75;
    }


/* =========================================================
   FEATURED CARD
   ========================================================= */

.tanya-obg-featured-card {
    grid-column: 1 / -1;
    max-width: 760px;
    width: 100%;
    justify-self: center;
    display: grid;
    grid-template-columns: 45% 55%;
}

    .tanya-obg-featured-card .tanya-obg-card-image {
        height: 100%;
        min-height: 260px;
    }

    .tanya-obg-featured-card .tanya-obg-card-content {
        justify-content: center;
        padding: 35px;
    }

        .tanya-obg-featured-card .tanya-obg-card-content h3 {
            min-height: auto;
            font-size: 25px;
        }


/* =========================================================
   DOCTOR SECTION
   ========================================================= */

.tanya-obg-doctor-section {
    padding: 60px 0;
    background: #ffffff;
}

.tanya-obg-doctor-box {
    display: flex;
    align-items: center;
    gap: 25px;
    padding: 32px;
    border-radius: 22px;
    background: linear-gradient( 110deg, #735540, #9d795d );
    box-shadow: 0 25px 55px rgba(115, 85, 64, 0.23);
}

.tanya-obg-doctor-icon {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 18px;
    background: var(--obg-yellow);
    color: var(--obg-brown-dark);
    font-size: 29px;
}

.tanya-obg-doctor-content {
    flex: 1;
}

    .tanya-obg-doctor-content .tanya-obg-small-title {
        color: var(--obg-yellow);
    }

    .tanya-obg-doctor-content h2 {
        margin: 0 0 8px;
        color: #ffffff;
        font-size: 27px;
        font-weight: 800;
    }

    .tanya-obg-doctor-content > p {
        max-width: 680px;
        margin: 0;
        color: rgba(255, 255, 255, 0.82);
        font-size: 13px;
        line-height: 1.7;
    }

.tanya-obg-doctor-details {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 18px;
}

    .tanya-obg-doctor-details > div {
        min-width: 170px;
    }

    .tanya-obg-doctor-details strong,
    .tanya-obg-doctor-details span,
    .tanya-obg-doctor-details a {
        display: block;
    }

    .tanya-obg-doctor-details strong {
        margin-bottom: 4px;
        color: #ffffff;
        font-size: 14px;
    }

    .tanya-obg-doctor-details span {
        color: rgba(255, 255, 255, 0.72);
        font-size: 11px;
    }

    .tanya-obg-doctor-details a {
        margin-top: 5px;
        color: var(--obg-yellow);
        font-size: 11px;
        font-weight: 700;
    }

.tanya-obg-doctor-button {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 20px;
    border-radius: 10px;
    background: var(--obg-yellow);
    color: var(--obg-brown-dark);
    font-size: 12px;
    font-weight: 800;
    transition: transform 0.3s ease, background 0.3s ease;
}

    .tanya-obg-doctor-button:hover {
        color: var(--obg-brown-dark);
        transform: translateY(-3px);
        background: #ffffff;
    }


/* =========================================================
   WHY CHOOSE
   ========================================================= */

.tanya-obg-why-section {
    padding: 60px 0;
    background: #fff9c7;
}

    .tanya-obg-why-section .tanya-obg-section-heading {
        margin-bottom: 40px;
    }

.tanya-obg-why-card {
    height: 100%;
    padding: 28px 25px;
    border: 1px solid rgba(157, 121, 93, 0.18);
    border-radius: 17px;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.055);
    text-align: center;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

    .tanya-obg-why-card:hover {
        transform: translateY(-7px);
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.10);
    }

.tanya-obg-why-icon {
    width: 57px;
    height: 57px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    border-radius: 15px;
    background: var(--obg-yellow);
    color: var(--obg-brown);
    font-size: 22px;
}

.tanya-obg-why-card h3 {
    margin: 0 0 9px;
    color: var(--obg-black);
    font-size: 18px;
    font-weight: 800;
}

.tanya-obg-why-card p {
    margin: 0;
    color: var(--obg-muted);
    font-size: 13px;
    line-height: 1.7;
}


/* =========================================================
   FINAL CTA
   ========================================================= */

.tanya-obg-final-cta {
    padding: 55px 0;
    background: #ffffff;
}

.tanya-obg-final-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 34px 38px;
    border-radius: 21px;
    background: linear-gradient( 110deg, #735540, #9d795d );
    box-shadow: 0 20px 45px rgba(115, 85, 64, 0.20);
}

    .tanya-obg-final-box > div {
        max-width: 720px;
    }

        .tanya-obg-final-box > div > span {
            display: block;
            margin-bottom: 9px;
            color: var(--obg-yellow);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 1.8px;
        }

    .tanya-obg-final-box h2 {
        margin: 0 0 8px;
        color: #ffffff;
        font-size: clamp(25px, 3vw, 36px);
        line-height: 1.2;
        font-weight: 800;
    }

    .tanya-obg-final-box p {
        margin: 0;
        color: rgba(255, 255, 255, 0.78);
        font-size: 13px;
        line-height: 1.6;
    }

.tanya-obg-final-button {
    min-width: 210px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 20px;
    border-radius: 11px;
    background: var(--obg-yellow);
    color: var(--obg-brown-dark);
    font-size: 17px;
    font-weight: 800;
    transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

    .tanya-obg-final-button:hover {
        color: var(--obg-brown-dark);
        transform: translateY(-4px);
        background: #ffffff;
        box-shadow: 0 12px 25px rgba(0, 0, 0, 0.17);
    }

    .tanya-obg-final-button i {
        font-size: 18px;
    }

    .tanya-obg-final-button span {
        display: flex;
        flex-direction: column;
    }

    .tanya-obg-final-button small {
        margin-top: 2px;
        font-size: 10px;
        font-weight: 600;
    }


/* =========================================================
   ANIMATION INITIAL STATE
   SCOPED TO OBG PAGE
   ========================================================= */

#tanya-obg-page [data-obg-animation] {
    opacity: 0;
}

    #tanya-obg-page [data-obg-animation].tanya-obg-animation-active {
        opacity: 1;
    }


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    /* Keep 95% width */
    #tanya-obg-page .container {
        width: 95%;
        max-width: 1600px;
    }

    .tanya-obg-hero {
        min-height: auto;
        padding: 50px 0;
    }

    .tanya-obg-hero-image {
        height: 430px;
    }

    .tanya-obg-introduction {
        padding: 55px 0;
    }

    .tanya-obg-services {
        padding: 50px 0 55px;
    }

    .tanya-obg-doctor-section {
        padding: 55px 0;
    }

    .tanya-obg-why-section {
        padding: 55px 0;
    }

    .tanya-obg-final-cta {
        padding: 50px 0;
    }

    .tanya-obg-service-grid {
        grid-template-columns: repeat( 2, minmax(0, 1fr) );
        gap: 22px;
    }

    .tanya-obg-featured-card {
        grid-column: 1 / -1;
        max-width: none;
    }

    .tanya-obg-doctor-box {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .tanya-obg-doctor-content {
        min-width: calc(100% - 100px);
    }

    .tanya-obg-doctor-button {
        margin-left: 97px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767.98px) {

    #tanya-obg-page .container {
        width: 95%;
        max-width: none;
    }

    .tanya-obg-hero {
        padding: 40px 0 45px;
    }

        .tanya-obg-hero h1 {
            font-size: 40px;
            letter-spacing: -1px;
        }

    .tanya-obg-hero-content > p {
        font-size: 14px;
    }

    .tanya-obg-hero-buttons {
        flex-direction: column;
        align-items: stretch;
        margin-top: 25px;
    }

    .tanya-obg-primary-btn,
    .tanya-obg-secondary-btn {
        width: 100%;
    }

    .tanya-obg-hero-image {
        height: 350px;
        border-radius: 20px;
    }

    .tanya-obg-introduction {
        padding: 50px 0;
    }

    .tanya-obg-services {
        padding: 45px 0 50px;
    }

    .tanya-obg-doctor-section {
        padding: 50px 0;
    }

    .tanya-obg-why-section {
        padding: 50px 0;
    }

    .tanya-obg-final-cta {
        padding: 45px 0;
    }

    .tanya-obg-intro-image {
        height: 350px;
    }

    .tanya-obg-intro-content h2 {
        font-size: 31px;
    }

    .tanya-obg-intro-points {
        grid-template-columns: 1fr;
    }

    .tanya-obg-service-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .tanya-obg-featured-card {
        grid-column: auto;
        max-width: none;
        display: flex;
    }

        .tanya-obg-featured-card .tanya-obg-card-image {
            height: 220px;
            min-height: 0;
        }

        .tanya-obg-featured-card .tanya-obg-card-content {
            padding: 24px 23px 26px;
        }

            .tanya-obg-featured-card
            .tanya-obg-card-content h3 {
                font-size: 19px;
            }

    .tanya-obg-doctor-box {
        padding: 25px 20px;
        flex-direction: column;
    }

    .tanya-obg-doctor-content {
        width: 100%;
        min-width: 0;
    }

    .tanya-obg-doctor-details {
        flex-direction: column;
        gap: 15px;
    }

    .tanya-obg-doctor-button {
        width: 100%;
        margin-left: 0;
    }

    .tanya-obg-final-box {
        padding: 28px 22px;
        flex-direction: column;
        align-items: stretch;
    }

    .tanya-obg-final-button {
        width: 100%;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    #tanya-obg-page .container {
        width: 94%;
    }

    .tanya-obg-hero {
        padding: 35px 0 40px;
    }

        .tanya-obg-hero h1 {
            font-size: 34px;
        }

    .tanya-obg-hero-image {
        height: 300px;
    }

    .tanya-obg-card-image {
        height: 205px;
    }

    .tanya-obg-card-content {
        padding: 21px 19px 24px;
    }

        .tanya-obg-card-content h3 {
            font-size: 18px;
        }

    .tanya-obg-section-heading {
        margin-bottom: 32px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    #tanya-obg-page [data-obg-animation] {
        opacity: 1 !important;
    }

    #tanya-obg-page .tanya-obg-service-card,
    #tanya-obg-page .tanya-obg-card-image img,
    #tanya-obg-page .tanya-obg-hero-image img,
    #tanya-obg-page .tanya-obg-primary-btn,
    #tanya-obg-page .tanya-obg-secondary-btn,
    #tanya-obg-page .tanya-obg-why-card,
    #tanya-obg-page .tanya-obg-final-button {
        transition: none !important;
    }
}












/* =========================================================
   TANYA SPECIALITY HOSPITAL
   PREMIUM GALLERY 2026
   Completely isolated CSS
   Prefix: tyx-
   ========================================================= */
:root {
    --tyx-brown: #9d795d;
    --tyx-brown-dark: #76543d;
    --tyx-brown-light: #c5a88f;
    --tyx-white: #ffffff;
    --tyx-yellow: #fff9c7;
    --tyx-yellow-deep: #f4e889;
    --tyx-black: #000000;
    --tyx-text: #242424;
    --tyx-muted: #6d6d6d;
    --tyx-border: rgba(157, 121, 93, 0.18);
    --tyx-shadow: 0 20px 55px rgba(45, 31, 20, 0.13);
    --tyx-shadow-hover: 0 30px 75px rgba(45, 31, 20, 0.23);
    --tyx-radius: 22px;
}


/* =========================================================
   GLOBAL
   ========================================================= */

.tyx-gallery-page {
    background: var(--tyx-white);
    color: var(--tyx-text);
    overflow: hidden;
}

    .tyx-gallery-page img {
        max-width: 100%;
    }

    .tyx-gallery-page button,
    .tyx-gallery-page a {
        outline: none;
    }


/* =========================================================
   HERO
   ========================================================= */

.tyx-gallery-hero {
    position: relative;
    min-height: 470px;
    display: flex;
    align-items: center;
    background: linear-gradient( 135deg, rgba(0, 0, 0, 0.82), rgba(157, 121, 93, 0.82) ), url("/images/bg/medical-care-bg2.jpg") center center / cover no-repeat;
    overflow: hidden;
}

    .tyx-gallery-hero::before {
        content: "";
        position: absolute;
        width: 430px;
        height: 430px;
        border: 1px solid rgba(255, 249, 199, 0.25);
        border-radius: 50%;
        right: -150px;
        top: -180px;
        animation: tyxHeroRotate 22s linear infinite;
    }

    .tyx-gallery-hero::after {
        content: "";
        position: absolute;
        width: 260px;
        height: 260px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 50%;
        left: -100px;
        bottom: -130px;
    }

.tyx-gallery-hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at center, transparent 0%, rgba(0, 0, 0, 0.35) 100% );
}

.tyx-gallery-hero-content {
    position: relative;
    z-index: 3;
    padding: 100px 0 80px;
}

.tyx-gallery-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 18px;
    color: var(--tyx-yellow);
    border: 1px solid rgba(255, 249, 199, 0.3);
    background: rgba(255, 255, 255, 0.08);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    backdrop-filter: blur(10px);
}

    .tyx-gallery-eyebrow i {
        font-size: 15px;
    }

.tyx-gallery-hero h1 {
    margin: 24px 0 18px;
    color: var(--tyx-white);
    font-size: clamp(42px, 6vw, 78px);
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: -2px;
}

    .tyx-gallery-hero h1 span {
        display: block;
        color: var(--tyx-yellow);
        font-style: italic;
    }

.tyx-gallery-hero p {
    max-width: 700px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.78);
    font-size: 17px;
    line-height: 1.8;
}

.tyx-gallery-hero-shape {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 80px;
    background: var(--tyx-white);
    clip-path: ellipse(65% 60% at 50% 100%);
}


/* =========================================================
   INTRO
   ========================================================= */

.tyx-gallery-intro {
    padding: 80px 0 65px;
    background: var(--tyx-white);
}

.tyx-gallery-section-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--tyx-brown);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

    .tyx-gallery-section-tag i {
        font-size: 14px;
    }

.tyx-gallery-intro-content h2 {
    max-width: 720px;
    margin: 14px 0 16px;
    color: var(--tyx-black);
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -1.5px;
}

    .tyx-gallery-intro-content h2 strong {
        color: var(--tyx-brown);
    }

.tyx-gallery-intro-content p {
    max-width: 720px;
    margin: 0;
    color: var(--tyx-muted);
    font-size: 16px;
    line-height: 1.9;
}

.tyx-gallery-intro-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 25px;
    background: var(--tyx-yellow);
    border: 1px solid rgba(157, 121, 93, 0.12);
    border-radius: 20px;
    box-shadow: var(--tyx-shadow);
}

.tyx-gallery-intro-icon {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tyx-white);
    background: var(--tyx-brown);
    border-radius: 50%;
    font-size: 22px;
}

.tyx-gallery-intro-card strong {
    display: block;
    margin-bottom: 5px;
    color: var(--tyx-black);
    font-size: 17px;
}

.tyx-gallery-intro-card span {
    display: block;
    color: var(--tyx-muted);
    font-size: 13px;
}


/* =========================================================
   FILTER
   ========================================================= */

.tyx-gallery-filter-section {
    padding: 20px 0 40px;
    background: var(--tyx-white);
}

.tyx-gallery-filter-wrapper {
    padding: 28px;
    background: #fffdf1;
    border: 1px solid var(--tyx-border);
    border-radius: 24px;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.05);
}

.tyx-gallery-filter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

    .tyx-gallery-filter-heading span {
        display: flex;
        align-items: center;
        gap: 9px;
        color: var(--tyx-black);
        font-size: 16px;
        font-weight: 800;
    }

        .tyx-gallery-filter-heading span i {
            color: var(--tyx-brown);
        }

    .tyx-gallery-filter-heading small {
        color: var(--tyx-muted);
        font-size: 12px;
    }

.tyx-gallery-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.tyx-gallery-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 10px 17px;
    border: 1px solid var(--tyx-border);
    border-radius: 100px;
    background: var(--tyx-white);
    color: var(--tyx-text);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.3s ease, background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

    .tyx-gallery-filter-btn:hover {
        transform: translateY(-2px);
        color: var(--tyx-white);
        background: var(--tyx-brown);
        box-shadow: 0 10px 25px rgba(157, 121, 93, 0.25);
    }

    .tyx-gallery-filter-btn.active {
        color: var(--tyx-white);
        background: var(--tyx-black);
        border-color: var(--tyx-black);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.16);
    }

        .tyx-gallery-filter-btn.active i {
            color: var(--tyx-yellow);
        }


/* =========================================================
   GALLERY GRID
   ========================================================= */

.tyx-gallery-photo-section {
    padding: 25px 0 95px;
    background: linear-gradient( 180deg, #ffffff 0%, #fffdf5 100% );
}

.tyx-gallery-masonry {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.tyx-gallery-item {
    min-width: 0;
    transition: opacity 0.35s ease, transform 0.35s ease;
}

    .tyx-gallery-item.tyx-hidden {
        display: none;
    }


/* =========================================================
   GALLERY CARD
   ========================================================= */

.tyx-gallery-card {
    height: 100%;
    background: var(--tyx-white);
    border-radius: var(--tyx-radius);
    overflow: hidden;
    box-shadow: var(--tyx-shadow);
    transition: transform 0.45s cubic-bezier(.2,.8,.2,1), box-shadow 0.45s ease;
}

    .tyx-gallery-card:hover {
        transform: translateY(-10px);
        box-shadow: var(--tyx-shadow-hover);
    }

.tyx-gallery-image-wrap {
    position: relative;
    height: 430px;
    overflow: hidden;
    background: #ddd;
}

.tyx-gallery-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(.2,.8,.2,1), filter 0.5s ease;
}

.tyx-gallery-card:hover .tyx-gallery-image {
    transform: scale(1.08);
    filter: saturate(1.08);
}

.tyx-gallery-image-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient( 180deg, rgba(0, 0, 0, 0.08) 15%, transparent 40%, rgba(0, 0, 0, 0.88) 100% );
    pointer-events: none;
}

.tyx-gallery-card-top {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .tyx-gallery-card-top span {
        display: inline-flex;
        align-items: center;
        padding: 7px 12px;
        color: var(--tyx-black);
        background: var(--tyx-yellow);
        border-radius: 100px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .tyx-gallery-card-top i {
        width: 42px;
        height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--tyx-white);
        background: rgba(0, 0, 0, 0.42);
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 50%;
        backdrop-filter: blur(8px);
    }

.tyx-gallery-card-content {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 22px;
    z-index: 2;
}

    .tyx-gallery-card-content small {
        display: block;
        margin-bottom: 6px;
        color: var(--tyx-yellow);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .tyx-gallery-card-content h3 {
        margin: 0 0 15px;
        color: var(--tyx-white);
        font-size: 22px;
        line-height: 1.25;
        font-weight: 750;
    }

.tyx-gallery-view-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    color: var(--tyx-white);
    background: rgba(255, 255, 255, 0.13);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 100px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    backdrop-filter: blur(10px);
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}

    .tyx-gallery-view-btn:hover {
        color: var(--tyx-black);
        background: var(--tyx-yellow);
        transform: translateX(4px);
    }


/* =========================================================
   EMPTY STATE
   ========================================================= */

.tyx-gallery-empty {
    display: none;
    text-align: center;
    padding: 80px 20px;
}

    .tyx-gallery-empty.tyx-show-empty {
        display: block;
    }

.tyx-gallery-empty-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tyx-brown);
    background: var(--tyx-yellow);
    border-radius: 50%;
    font-size: 28px;
}

.tyx-gallery-empty h3 {
    margin: 0 0 8px;
    color: var(--tyx-black);
    font-size: 24px;
}

.tyx-gallery-empty p {
    margin: 0;
    color: var(--tyx-muted);
}


/* =========================================================
   EXPERIENCE
   ========================================================= */

.tyx-gallery-experience {
    padding: 100px 0;
    background: var(--tyx-yellow);
}

.tyx-gallery-experience-image {
    position: relative;
    max-width: 570px;
    margin: auto;
}

    .tyx-gallery-experience-image img {
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        border-radius: 28px;
        box-shadow: 0 25px 60px rgba(80, 60, 30, 0.2);
    }

.tyx-gallery-experience-badge {
    position: absolute;
    right: -20px;
    bottom: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 20px;
    color: var(--tyx-white);
    background: var(--tyx-black);
    border-radius: 15px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}

    .tyx-gallery-experience-badge > i {
        font-size: 23px;
        color: var(--tyx-yellow);
    }

    .tyx-gallery-experience-badge strong {
        display: block;
        font-size: 14px;
    }

    .tyx-gallery-experience-badge span {
        display: block;
        margin-top: 2px;
        color: rgba(255,255,255,0.65);
        font-size: 11px;
    }

.tyx-gallery-experience-content {
    padding-left: 25px;
}

    .tyx-gallery-experience-content h2 {
        margin: 14px 0;
        color: var(--tyx-black);
        font-size: clamp(34px, 4vw, 52px);
        line-height: 1.1;
        font-weight: 800;
    }

        .tyx-gallery-experience-content h2 strong {
            display: block;
            color: var(--tyx-brown);
        }

    .tyx-gallery-experience-content p {
        max-width: 580px;
        color: #5c5147;
        font-size: 15px;
        line-height: 1.9;
    }

.tyx-gallery-experience-points {
    display: grid;
    gap: 12px;
    margin-top: 25px;
}

    .tyx-gallery-experience-points div {
        display: flex;
        align-items: center;
        gap: 11px;
        color: var(--tyx-black);
        font-size: 14px;
        font-weight: 650;
    }

    .tyx-gallery-experience-points i {
        color: var(--tyx-brown);
        font-size: 17px;
    }


/* =========================================================
   VIDEO
   ========================================================= */

.tyx-gallery-video-section {
    padding: 100px 0;
    background: var(--tyx-white);
}

.tyx-gallery-video-heading {
    max-width: 720px;
    margin: 0 auto 40px;
}

    .tyx-gallery-video-heading h2 {
        margin: 14px 0;
        color: var(--tyx-black);
        font-size: clamp(34px, 4vw, 52px);
        font-weight: 800;
    }

        .tyx-gallery-video-heading h2 strong {
            color: var(--tyx-brown);
        }

    .tyx-gallery-video-heading p {
        margin: 0;
        color: var(--tyx-muted);
        line-height: 1.8;
    }

.tyx-gallery-video-card {
    height: 100%;
    overflow: hidden;
    background: var(--tyx-white);
    border: 1px solid var(--tyx-border);
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

    .tyx-gallery-video-card:hover {
        transform: translateY(-8px);
        box-shadow: var(--tyx-shadow-hover);
    }

.tyx-gallery-video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: var(--tyx-black);
    overflow: hidden;
}

    .tyx-gallery-video-frame iframe,
    .tyx-gallery-video-frame video {
        width: 100%;
        height: 100%;
        display: block;
        border: 0;
        object-fit: cover;
    }

.tyx-gallery-video-content {
    padding: 20px;
}

    .tyx-gallery-video-content span {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        color: var(--tyx-brown);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .tyx-gallery-video-content h3 {
        margin: 9px 0 0;
        color: var(--tyx-black);
        font-size: 18px;
        line-height: 1.4;
    }


/* =========================================================
   CTA
   ========================================================= */

.tyx-gallery-cta {
    padding: 80px 0;
    background: linear-gradient( 135deg, var(--tyx-black), #211a15 );
}

.tyx-gallery-cta-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    padding: 55px;
    border: 1px solid rgba(255,249,199,0.18);
    border-radius: 30px;
    background: radial-gradient( circle at 90% 20%, rgba(157,121,93,0.25), transparent 35% );
}

.tyx-gallery-cta-content > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--tyx-yellow);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

.tyx-gallery-cta-content h2 {
    max-width: 700px;
    margin: 14px 0 12px;
    color: var(--tyx-white);
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1.1;
    font-weight: 800;
}

    .tyx-gallery-cta-content h2 strong {
        color: var(--tyx-yellow);
    }

.tyx-gallery-cta-content p {
    max-width: 620px;
    margin: 0;
    color: rgba(255,255,255,0.65);
    line-height: 1.8;
}

.tyx-gallery-cta-button {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    padding: 17px 22px;
    color: var(--tyx-black);
    background: var(--tyx-yellow);
    border-radius: 100px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
    transition: transform 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
}

    .tyx-gallery-cta-button:hover {
        color: var(--tyx-black);
        background: var(--tyx-white);
        transform: translateY(-4px);
        box-shadow: 0 15px 35px rgba(255,249,199,0.18);
    }


/* =========================================================
   LIGHTBOX
   ========================================================= */

.tyx-gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s ease, visibility 0.35s ease;
}

    .tyx-gallery-lightbox.tyx-lightbox-open {
        opacity: 1;
        visibility: visible;
    }

.tyx-gallery-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.92);
    backdrop-filter: blur(8px);
}

.tyx-gallery-lightbox-dialog {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    animation-duration: 0.45s;
}

    .tyx-gallery-lightbox-dialog img {
        max-width: 100%;
        max-height: 78vh;
        object-fit: contain;
        border-radius: 10px;
        box-shadow: 0 25px 70px rgba(0,0,0,0.5);
    }

.tyx-gallery-lightbox-close {
    position: absolute;
    z-index: 5;
    top: -55px;
    right: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tyx-white);
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
}

    .tyx-gallery-lightbox-close:hover {
        background: var(--tyx-brown);
        transform: rotate(90deg);
    }

.tyx-gallery-lightbox-caption {
    margin-top: 15px;
    color: var(--tyx-yellow);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}


/* =========================================================
   SCROLL REVEAL INITIAL STATE
   ========================================================= */

.tyx-gallery-reveal-left,
.tyx-gallery-reveal-right,
.tyx-gallery-reveal-up {
    opacity: 0;
}

    .tyx-gallery-reveal-left.tyx-gallery-visible {
        animation: tyxGalleryLeftReveal 0.9s cubic-bezier(.2,.8,.2,1) both;
    }

    .tyx-gallery-reveal-right.tyx-gallery-visible {
        animation: tyxGalleryRightReveal 0.9s cubic-bezier(.2,.8,.2,1) both;
    }

    .tyx-gallery-reveal-up.tyx-gallery-visible {
        animation: tyxGalleryUpReveal 0.9s cubic-bezier(.2,.8,.2,1) both;
    }


/* =========================================================
   CUSTOM ANIMATIONS
   ========================================================= */

@keyframes tyxGalleryLeftReveal {

    from {
        opacity: 0;
        transform: translateX(-90px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes tyxGalleryRightReveal {

    from {
        opacity: 0;
        transform: translateX(90px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes tyxGalleryUpReveal {

    from {
        opacity: 0;
        transform: translateY(60px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes tyxHeroRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    .tyx-gallery-hero {
        min-height: 430px;
    }

    .tyx-gallery-hero-content {
        padding: 90px 0 70px;
    }

    .tyx-gallery-masonry {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tyx-gallery-image-wrap {
        height: 390px;
    }

    .tyx-gallery-experience-content {
        padding-left: 0;
        padding-top: 25px;
    }

    .tyx-gallery-cta-box {
        padding: 40px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767.98px) {

    .tyx-gallery-hero {
        min-height: 390px;
    }

    .tyx-gallery-hero-content {
        padding: 80px 15px 60px;
    }

    .tyx-gallery-hero h1 {
        letter-spacing: -1px;
    }

    .tyx-gallery-hero p {
        font-size: 14px;
    }

    .tyx-gallery-intro {
        padding: 60px 0 45px;
    }

    .tyx-gallery-intro-content h2 {
        font-size: 34px;
    }

    .tyx-gallery-filter-wrapper {
        padding: 20px;
    }

    .tyx-gallery-filter-heading {
        display: block;
    }

        .tyx-gallery-filter-heading small {
            display: block;
            margin-top: 7px;
        }

    .tyx-gallery-filters {
        gap: 8px;
    }

    .tyx-gallery-filter-btn {
        min-height: 42px;
        padding: 8px 12px;
        font-size: 11px;
    }

        .tyx-gallery-filter-btn i {
            display: none;
        }

    .tyx-gallery-masonry {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .tyx-gallery-image-wrap {
        height: 410px;
    }

    .tyx-gallery-experience {
        padding: 70px 0;
    }

    .tyx-gallery-experience-badge {
        right: 15px;
        bottom: 15px;
    }

    .tyx-gallery-video-section {
        padding: 70px 0;
    }

    .tyx-gallery-cta {
        padding: 60px 0;
    }

    .tyx-gallery-cta-box {
        display: block;
        padding: 30px 24px;
        border-radius: 22px;
    }

    .tyx-gallery-cta-action {
        margin-top: 25px;
    }

    .tyx-gallery-cta-button {
        width: 100%;
        justify-content: center;
    }

    .tyx-gallery-lightbox {
        padding: 15px;
    }

    .tyx-gallery-lightbox-close {
        top: -55px;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

    .tyx-gallery-hero h1 {
        font-size: 39px;
    }

    .tyx-gallery-eyebrow {
        font-size: 10px;
        padding: 8px 12px;
    }

    .tyx-gallery-image-wrap {
        height: 350px;
    }

    .tyx-gallery-card-content {
        left: 18px;
        right: 18px;
        bottom: 18px;
    }

        .tyx-gallery-card-content h3 {
            font-size: 19px;
        }

    .tyx-gallery-intro-card {
        padding: 18px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tyx-gallery-page *,
    .tyx-gallery-page *::before,
    .tyx-gallery-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }

    .tyx-gallery-reveal-left,
    .tyx-gallery-reveal-right,
    .tyx-gallery-reveal-up {
        opacity: 1;
        transform: none;
    }
}

























/* =========================================================
   TANYA SPECIALITY HOSPITAL
   PREMIUM ABOUT PAGE
   2026 DESIGN
   ALL CLASSES ARE UNIQUE: tanya-about-*
   ========================================================= */

:root {
    --tanya-brown: #9d795d;
    --tanya-brown-dark: #76563f;
    --tanya-brown-light: #c3a58e;
    --tanya-yellow: #fff9c7;
    --tanya-yellow-dark: #eee29b;
    --tanya-black: #000000;
    --tanya-dark: #111111;
    --tanya-white: #ffffff;
    --tanya-offwhite: #fbfaf7;
    --tanya-gray: #777777;
    --tanya-border: rgba(157, 121, 93, 0.18);
    --tanya-shadow: 0 20px 55px rgba(0, 0, 0, 0.08);
    --tanya-shadow-hover: 0 28px 70px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   GLOBAL
   ========================================================= */

.tanya-about-page {
    width: 100%;
    overflow: hidden;
    background: var(--tanya-white);
    color: var(--tanya-dark);
}

    .tanya-about-page *,
    .tanya-about-page *::before,
    .tanya-about-page *::after {
        box-sizing: border-box;
    }

    .tanya-about-page img {
        max-width: 100%;
    }

    .tanya-about-page a {
        text-decoration: none;
    }

    .tanya-about-page .row {
        align-items: stretch;
    }

.tanya-about-section-label {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    margin-bottom: 15px;
    color: var(--tanya-brown);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 3px;
}

    .tanya-about-section-label::before {
        content: "";
        width: 30px;
        height: 2px;
        flex: 0 0 30px;
        background: var(--tanya-brown);
    }


/* =========================================================
   HERO
   ========================================================= */

.tanya-about-hero {
    position: relative;
    min-height: 570px;
    display: flex;
    align-items: center;
    background: linear-gradient( 90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.70) 45%, rgba(0, 0, 0, 0.18) 100% ), url("/images/TanyaHospital.jpg") center/cover no-repeat;
    color: var(--tanya-white);
}

.tanya-about-hero-row {
    min-height: 570px;
}

.tanya-about-hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at 80% 30%, rgba(255, 249, 199, 0.12), transparent 30% );
}

.tanya-about-hero-content {
    position: relative;
    z-index: 2;
    max-width: 780px;
}

.tanya-about-eyebrow {
    display: inline-block;
    padding: 8px 15px;
    margin-bottom: 22px;
    border: 1px solid #9d795d ;
    color: var(--tanya-brown);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.tanya-about-hero h1 {
    margin: 0 0 22px;
    font-size: clamp(42px, 6vw, 76px);
    line-height: 1.02;
    font-weight: 700;
    letter-spacing: -2px;
}

    .tanya-about-hero h1 span {
        display: block;
        color: var(--tanya-brown);
    }

.tanya-about-hero p {
    max-width: 650px;
    margin: 0 0 32px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 18px;
    line-height: 1.8;
}

.tanya-about-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.tanya-about-primary-btn,
.tanya-about-outline-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 50px;
    padding: 14px 22px;
    font-size: 13px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.tanya-about-primary-btn {
    background: var(--tanya-brown);
    color: var(--tanya-white);
}

    .tanya-about-primary-btn:hover {
        background: var(--tanya-white);
        color: var(--tanya-black);
        transform: translateY(-3px);
    }

.tanya-about-outline-btn {
    border: 1px solid rgba(255, 255, 255, 0.45);
    color: var(--tanya-white);
}

    .tanya-about-outline-btn:hover {
        background: var(--tanya-white);
        color: var(--tanya-black);
        transform: translateY(-3px);
    }

.tanya-about-hero-bottom {
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 65px;
    background: var(--tanya-white);
    clip-path: polygon( 0 100%, 0 60%, 15% 80%, 30% 55%, 45% 78%, 60% 50%, 75% 72%, 90% 48%, 100% 65%, 100% 100% );
}





/* =========================================================
   SPECIALITIES
   ========================================================= */

    .tanya-about-speciality-section .row > [class*="col-"] {
        display: flex;
    }

.tanya-about-speciality-card {
    width: 100%;
/*    min-height: 650px;*/
    display: flex;
    flex-direction: column;
    padding: 35px;
    background: var(--tanya-white);
    border: 1px solid var(--tanya-border);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.035);
    transition: all 0.4s ease;
}

    .tanya-about-speciality-card:hover {
        transform: translateY(-10px);
        box-shadow: var(--tanya-shadow-hover);
    }

.tanya-about-speciality-highlight {
    background: var(--tanya-black);
    color: var(--tanya-white);
}

.tanya-about-speciality-top {
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
/*    margin-bottom: 25px;*/
}

.tanya-about-speciality-icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--tanya-yellow);
    color: var(--tanya-brown);
    font-size: 24px;
}

.tanya-about-speciality-top > span {
    color: var(--tanya-brown);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.tanya-about-speciality-card h3 {
    min-height: 30px;
/*    margin: 0 0 15px;*/
    color: var(--tanya-black);
    font-size: 20px;
/*    line-height: 1.25;*/
}

.tanya-about-speciality-highlight h3 {
    color: var(--tanya-white);
}

.tanya-about-speciality-card h3 span {
    color: var(--tanya-brown);
}

.tanya-about-speciality-highlight h3 span {
    color: var(--tanya-yellow);
}

.tanya-about-speciality-card > p {
    min-height: 40px;
    margin: 0;
    color: #777;
    font-size: 13px;
    line-height: 1.8;
}

.tanya-about-speciality-highlight > p {
    color: rgba(255, 255, 255, 0.65);
}

.tanya-about-speciality-card ul {
    list-style: none;
    padding: 0;
/*    margin: auto 0 0;*/
}

.tanya-about-speciality-card li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px solid rgba(157, 121, 93, 0.10);
    color: #555;
    font-size: 13px;
    line-height: 1.5;
}

.tanya-about-speciality-highlight li {
    color: rgba(255, 255, 255, 0.82);
    border-color: rgba(255, 255, 255, 0.08);
}

.tanya-about-speciality-card li i {
    flex: 0 0 auto;
    margin-top: 3px;
    color: var(--tanya-brown);
}

.tanya-about-speciality-highlight li i {
    color: var(--tanya-yellow);
}


/* =========================================================
   FACILITIES
   ========================================================= */

.tanya-about-facility-section {
    /*    padding: 110px 0;*/
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background-image: linear-gradient( 90deg, rgba(8, 20, 30, 0.78), rgba(8, 20, 30, 0.68) ), url("facilityImg.jpeg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
    .tanya-about-facility-section > .container {
        position: relative;
        z-index: 2;
    }

.tanya-about-facility-heading {
    position: relative;
    z-index: 3;
}

.tanya-about-dark-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 48px;
    margin-top: 20px;
    padding: 14px 22px;
    background: var(--tanya-black);
    color: var(--tanya-white);
    font-size: 13px;
    font-weight: 700;
    transition: all 0.3s ease;
}

    .tanya-about-dark-btn:hover {
        background: var(--tanya-brown);
        color: var(--tanya-white);
        transform: translateY(-3px);
    }

.tanya-about-facility-section .row > [class*="col-"] {
    display: flex;
}

.tanya-about-facility-item {
    width: 100%;
    min-height: 100px;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 22px;
    background: var(--tanya-white);
    border: 1px solid rgba(157, 121, 93, 0.10);
    transition: all 0.35s ease;
    position: relative;
    z-index: 3;
}

    .tanya-about-facility-item:hover {
        transform: translateX(6px);
        box-shadow: var(--tanya-shadow);
    }

    .tanya-about-facility-item > span {
        flex: 0 0 52px;
        width: 52px;
        height: 52px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--tanya-black);
        color: var(--tanya-yellow);
        font-size: 19px;
    }

    .tanya-about-facility-item strong,
    .tanya-about-facility-item small {
        display: block;
    }

    .tanya-about-facility-item strong {
        margin-bottom: 4px;
        color: var(--tanya-black);
        font-size: 14px;
        line-height: 1.4;
    }

    .tanya-about-facility-item small {
        color: #777;
        font-size: 11px;
        line-height: 1.5;
    }

@media(width<1318px) {
    .tanya-about-dark-btn {
        display:none;    
    }
}
/* =========================================================
   DOCTORS - PERFECT ALIGNMENT
   ========================================================= */

.tanya-about-doctors-section {
/*    padding: 110px 0;*/
    background: var(--tanya-offwhite);
}

    .tanya-about-doctors-section .row {
        align-items: stretch;
    }

        .tanya-about-doctors-section .row > [class*="col-"] {
            display: flex;
        }

.tanya-about-doctor-card {
    position: relative;
    width: 100%;
/*    min-height: 390px;*/
    display: flex;
    flex-direction: column;
    padding: 35px;
    overflow: hidden;
    background: var(--tanya-white);
    border: 1px solid var(--tanya-border);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

    .tanya-about-doctor-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: var(--tanya-brown);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.4s ease;
    }

    .tanya-about-doctor-card:hover {
        transform: translateY(-8px);
        border-color: rgba(157, 121, 93, 0.35);
        box-shadow: var(--tanya-shadow-hover);
    }

        .tanya-about-doctor-card:hover::before {
            transform: scaleX(1);
        }

.tanya-about-doctor-number {
    position: absolute;
    top: 12px;
    right: 20px;
    color: rgba(157, 121, 93, 0.06);
    font-size: 55px;
    font-weight: 800;
    line-height: 1;
}

.tanya-about-doctor-icon {
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 65px;
    margin-bottom: 22px;
    border-radius: 50%;
    background: var(--tanya-yellow);
    color: var(--tanya-brown);
    font-size: 25px;
}

.tanya-about-doctor-speciality {
    display: block;
    min-height: 32px;
    margin-bottom: 8px;
    color: var(--tanya-brown);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 1.5px;
}

.tanya-about-doctor-card h3 {
    min-height: 30px;
    display: flex;
    align-items: flex-start;
/*    margin: 0 0 8px;*/
    color: var(--tanya-black);
    font-size: 22px;
    line-height: 1.3;
}

.tanya-about-doctor-card p {
/*    min-height: 45px;*/
    margin: 0 0 8px;
    color: #777;
    font-size: 13px;
    line-height: 1.7;
}

.tanya-about-doctor-card strong {
/*    min-height: 22px;*/
    display: block;
    margin-bottom: 5px;
    color: var(--tanya-black);
    font-size: 12px;
    line-height: 1.5;
}

.tanya-about-doctor-card a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 22px;
    margin-top: auto;
    color: var(--tanya-brown);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

    .tanya-about-doctor-card a:hover {
        color: var(--tanya-brown-dark);
    }

.tanya-about-doctor-no-phone {
    cursor: default;
}


/* =========================================================
   TEAM
   ========================================================= */

.tanya-about-team-section {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    background: linear-gradient( rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.72) ), url("/images/TanyaHospitalTeam.jpg") center/cover no-repeat;
    color: var(--tanya-white);
}

.tanya-about-team-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at center, rgba(157, 121, 93, 0.28), transparent 55% );
}

.tanya-about-team-section .row > [class*="col-"] {
    display: flex;
}

.tanya-about-team-content {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 50px 45px;
}

    .tanya-about-team-content .tanya-about-section-label {
        justify-content: center;
/*        color: var(--tanya-yellow);*/
    }

        .tanya-about-team-content .tanya-about-section-label::before {
/*            background: var(--tanya-yellow);*/
        }

    .tanya-about-team-content h2 {
        width: 100%;
        margin: 0 0 20px;
        color: var(--tanya-white);
        font-size: clamp(35px, 5vw, 60px);
        line-height: 1.1;
        text-align: center;
    }

        .tanya-about-team-content h2 span {
            color: var(--tanya-yellow);
        }

    .tanya-about-team-content p {
        width: 100%;
        max-width: 750px;
        margin: 0 auto;
        color: rgba(255, 255, 255, 0.78);
        font-size: 15px;
        line-height: 1.9;
        text-align: center;
    }


/* =========================================================
   CONTACT
   ========================================================= */

.tanya-about-contact-section {
    padding: 100px 0;
    background: var(--tanya-white);
}

    .tanya-about-contact-section .row > [class*="col-"] {
        display: flex;
    }

.tanya-about-contact-card {
    width: 100%;
    height: 100%;
    padding: 50px;
    background: var(--tanya-offwhite);
    border: 1px solid var(--tanya-border);
}

    .tanya-about-contact-card h2 {
        max-width: 650px;
        margin: 0 0 15px;
        font-size: clamp(34px, 4vw, 52px);
        line-height: 1.1;
    }

        .tanya-about-contact-card h2 span {
            color: var(--tanya-brown);
        }

    .tanya-about-contact-card > p {
        max-width: 650px;
        margin: 0;
        color: #666;
        line-height: 1.8;
    }

.tanya-about-contact-info {
    margin-top: 35px;
}

    .tanya-about-contact-info > div {
        display: flex;
        align-items: flex-start;
        gap: 15px;
        margin-bottom: 20px;
    }

        .tanya-about-contact-info > div > span {
            flex: 0 0 48px;
            width: 48px;
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: var(--tanya-black);
            color: var(--tanya-yellow);
        }

    .tanya-about-contact-info strong {
        display: block;
        margin-bottom: 4px;
        font-size: 13px;
    }

    .tanya-about-contact-info p {
        margin: 0;
        color: #777;
        font-size: 13px;
        line-height: 1.7;
    }

    .tanya-about-contact-info a {
        color: var(--tanya-brown);
        font-weight: 600;
    }


/* =========================================================
   KANNADA
   ========================================================= */

.tanya-about-kannada-card {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 45px 35px;
    overflow: hidden;
    background: var(--tanya-brown);
    color: var(--tanya-white);
}

    .tanya-about-kannada-card::after {
        content: "";
        position: absolute;
        width: 240px;
        height: 240px;
        right: -100px;
        bottom: -100px;
        border: 40px solid rgba(255, 249, 199, 0.08);
        border-radius: 50%;
    }

.tanya-about-kannada-label {
    display: inline-block;
    padding: 7px 14px;
    margin-bottom: 20px;
    background: var(--tanya-yellow);
    color: var(--tanya-black);
    font-size: 12px;
    font-weight: 700;
}

.tanya-about-kannada-card h3 {
    margin: 0 0 12px;
    color: var(--tanya-white);
    font-size: 25px;
}

.tanya-about-kannada-card > p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.8;
}

.tanya-about-kannada-details {
    margin-top: 30px;
}

    .tanya-about-kannada-details > div {
        padding: 15px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .tanya-about-kannada-details strong,
    .tanya-about-kannada-details span,
    .tanya-about-kannada-details small {
        display: block;
    }

    .tanya-about-kannada-details strong {
        color: var(--tanya-yellow);
        font-size: 12px;
    }

    .tanya-about-kannada-details span {
        margin-top: 4px;
        color: var(--tanya-white);
        font-size: 15px;
        font-weight: 600;
    }

    .tanya-about-kannada-details small {
        margin-top: 2px;
        color: rgba(255, 255, 255, 0.65);
    }


/* =========================================================
   FINAL CTA
   ========================================================= */

.tanya-about-final-cta {
    padding: 60px 0;
    background: var(--tanya-black);
    color: var(--tanya-white);
}

    .tanya-about-final-cta span {
        display: block;
        margin-bottom: 10px;
        color: var(--tanya-yellow);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 3px;
    }

    .tanya-about-final-cta h2 {
        margin: 0;
        font-size: clamp(30px, 4vw, 46px);
        line-height: 1.15;
    }

        .tanya-about-final-cta h2 strong {
            color: var(--tanya-yellow);
        }

.tanya-about-call-btn {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 15px 20px;
    background: var(--tanya-yellow);
    color: var(--tanya-black);
    transition: all 0.3s ease;
}

    .tanya-about-call-btn:hover {
        background: var(--tanya-white);
        color: var(--tanya-black);
        transform: translateY(-3px);
    }

    .tanya-about-call-btn > i {
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--tanya-black);
        color: var(--tanya-yellow);
    }

    .tanya-about-call-btn span {
        margin: 0;
        color: var(--tanya-black);
        font-size: 16px;
        letter-spacing: 0;
    }

    .tanya-about-call-btn small {
        display: block;
        margin-bottom: 2px;
        color: var(--tanya-black);
        font-size: 10px;
        letter-spacing: 1px;
    }


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

    .tanya-about-hero {
        min-height: 520px;
        background: linear-gradient( rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0.78) ), url("/images/TanyaHospital.jpg") center/cover no-repeat;
    }

    .tanya-about-hero-row {
        min-height: 520px;
    }

    .tanya-about-intro-section,
  
    
   
/*    .tanya-about-doctors-section {
        padding: 80px 0;
    }*/

/*    .tanya-about-care-section {
        padding: 80px 0;
    }*/

    .tanya-about-contact-section {
        padding: 80px 0;
    }

    .tanya-about-image-frame img {
        height: 420px;
    }

    .tanya-about-speciality-card {
        min-height: 0;
    }

    .tanya-about-doctor-card {
/*        min-height: 370px;*/
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .tanya-about-hero {
        min-height: 600px;
    }

    .tanya-about-hero-row {
        min-height: 600px;
    }

    .tanya-about-hero h1 {
        font-size: 43px;
        letter-spacing: -1px;
    }

    .tanya-about-hero p {
        font-size: 15px;
    }

    .tanya-about-hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .tanya-about-primary-btn,
    .tanya-about-outline-btn {
        width: 100%;
    }

    .tanya-about-intro-section,
    
    
    
/*    .tanya-about-doctors-section {
        padding: 65px 0;
    }*/


    .tanya-about-contact-section {
        padding: 65px 0;
    }

    .tanya-about-image-frame img {
        height: 330px;
    }

    .tanya-about-image-badge {
        width: 115px;
        height: 115px;
        right: 0;
        bottom: 25px;
    }

    .tanya-about-founder-row {
        flex-direction: column;
    }

    .tanya-about-founder {
        width: 100%;
        flex: 1 1 auto;
    }

    .tanya-about-value-card {
        min-height: 0;
    }

    .tanya-about-speciality-card {
        min-height: 0;
    }

        .tanya-about-speciality-card h3,
        .tanya-about-speciality-card > p {
            min-height: auto;
        }

        .tanya-about-speciality-card ul {
            margin-top: 25px;
        }

    .tanya-about-doctor-card {
        min-height: 0;
    }

        .tanya-about-doctor-speciality,
        .tanya-about-doctor-card h3,
        .tanya-about-doctor-card p,
        .tanya-about-doctor-card strong {
            min-height: auto;
        }

        .tanya-about-doctor-card a {
            margin-top: 15px;
        }

    .tanya-about-team-section {
        min-height: 430px;
    }

    .tanya-about-team-content {
        padding: 40px 20px;
    }

        .tanya-about-team-content h2 {
            font-size: 38px;
        }

    .tanya-about-contact-card {
        padding: 35px 25px;
    }

    .tanya-about-kannada-card {
        padding: 35px 25px;
    }

    .tanya-about-final-cta {
        text-align: center;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 575px) {

    .tanya-about-hero h1 {
        font-size: 36px;
    }

    .tanya-about-eyebrow {
        font-size: 9px;
        letter-spacing: 2px;
    }

    .tanya-about-section-label {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .tanya-about-image-area {
        padding: 12px;
    }

        .tanya-about-image-area::before,
        .tanya-about-image-area::after {
            width: 60px;
            height: 60px;
        }

    .tanya-about-image-frame img {
        height: 270px;
    }

    .tanya-about-image-badge {
        width: 95px;
        height: 95px;
        right: -2px;
    }

        .tanya-about-image-badge strong {
            font-size: 15px;
        }

        .tanya-about-image-badge span {
            font-size: 9px;
        }

    .tanya-about-stat-card {
        min-height: 150px;
        padding: 25px 12px;
    }

        .tanya-about-stat-card strong {
            font-size: 29px;
        }

        .tanya-about-stat-card > span:last-child {
            font-size: 9px;
        }

    .tanya-about-care-card {
        width:90%;
        min-height: 175px;
        padding: 23px;
    }

    .tanya-about-value-card {
        padding: 32px 25px;
    }

    .tanya-about-doctor-card {
        padding: 28px;
    }

    .tanya-about-contact-info > div {
        align-items: flex-start;
    }

    .tanya-about-call-btn {
        width: 100%;
        justify-content: center;
    }
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tanya-about-page *,
    .tanya-about-page *::before,
    .tanya-about-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

.textAlignCenter {
    text-align:center;
}








/* =========================================================
   TANYA HOSPITAL
   PREMIUM FACILITIES HERO - 2026
   ========================================================= */

/* =========================================================
   HERO
   ========================================================= */

.th26-facility-hero {
    position: relative;
    width: 100%;
    min-height: 540px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
    text-align: center !important;
    background-image: url("https://images.pexels.com/photos/263402/pexels-photo-263402.jpeg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    /*
       Desktop parallax effect
    */
    background-attachment: fixed;
}


/* =========================================================
   DARK OVERLAY
   ========================================================= */

.th26-facility-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: linear-gradient( 135deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.76) 42%, rgba(157, 121, 93, 0.58) 100% );
}


/* =========================================================
   DECORATIVE CIRCLES
   ========================================================= */

.th26-facility-circle {
    position: absolute;
    border-radius: 50%;
    z-index: 2;
    pointer-events: none;
}


.th26-facility-circle-one {
    width: 260px;
    height: 260px;
    top: -145px;
    right: -80px;
    border: 1px solid rgba(255, 249, 199, 0.25);
    box-shadow: 0 0 70px rgba(255, 249, 199, 0.08);
}


.th26-facility-circle-two {
    width: 200px;
    height: 200px;
    bottom: -120px;
    left: -80px;
    border: 1px solid rgba(157, 121, 93, 0.45);
    box-shadow: 0 0 80px rgba(157, 121, 93, 0.15);
}


/* =========================================================
   MAIN BOOTSTRAP CONTAINER
   ========================================================= */

.th26-facility-container {
    position: relative;
    z-index: 5;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}


/* =========================================================
   BOOTSTRAP ROW
   FORCE CENTER
   ========================================================= */

.th26-facility-row {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* =========================================================
   COLUMN
   ========================================================= */

.th26-facility-column {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* =========================================================
   CONTENT
   ========================================================= */

.th26-facility-content {
    position: relative;
    width: 100% !important;
    max-width: 900px;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.th26-facility-eyebrow {
    width: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row;
    gap: 15px;
    margin: 0 auto 20px auto !important;
    text-align: center !important;
}


.th26-facility-eyebrow-text {
    display: inline-block;
    color: #fff9c7;
    font-size: 11px;
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
    white-space: nowrap;
}


.th26-facility-line {
    display: block;
    width: 50px;
    height: 1px;
    flex: 0 0 50px;
    background: #fff9c7;
    opacity: 0.75;
}


/* =========================================================
   MAIN TITLE
   ========================================================= */

.th26-facility-title {
    display: block !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    color: #ffffff;
    font-size: clamp(50px, 7vw, 50px);
    line-height: 1.05;
    font-weight: 500;
    letter-spacing: -2px;
    text-align: center !important;
    text-transform: none;
    text-shadow: 0 5px 25px rgba(0, 0, 0, 0.45);
}


    /* Highlighted word */

    .th26-facility-title span {
        position: relative;
        display: inline-block;
        color: #fff9c7;
        font-weight: 700;
    }


        /* Underline */

        .th26-facility-title span::after {
            content: "";
            position: absolute;
            left: 5%;
            right: 5%;
            bottom: -9px;
            height: 2px;
            transform: scaleX(0.7);
            transform-origin: center;
        }


/* =========================================================
   SEPARATOR
   ========================================================= */

.th26-facility-separator {
    width: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px;
    margin: 30px auto 22px auto !important;
    text-align: center !important;
}


.th26-facility-separator-line {
    display: block;
    width: 65px;
    height: 1px;
    background: rgba(255, 249, 199, 0.7);
}


.th26-facility-plus {
    width: 30px;
    height: 30px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(255, 249, 199, 0.7);
    border-radius: 50%;
    color: #fff9c7;
    font-size: 18px;
    line-height: 1;
    font-weight: 300;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.th26-facility-description {
    display: block !important;
    width: 100% !important;
    max-width: 760px;
    margin: 0 auto !important;
    padding: 0 !important;
    color: rgba(255, 255, 255, 0.90);
    font-size: 16px;
    line-height: 1.9;
    font-weight: 400;
    letter-spacing: 0.2px;
    text-align: center !important;
}


/* =========================================================
   BREADCRUMB NAVIGATION
   ========================================================= */

.th26-facility-navigation {
    width: 100% !important;
    display: block !important;
    margin: 28px auto 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
}


/* =========================================================
   BREADCRUMB
   ========================================================= */

.th26-facility-breadcrumb {
    list-style: none !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap;
    gap: 11px;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
}


/* =========================================================
   BREADCRUMB ITEM
   ========================================================= */

.th26-facility-breadcrumb-item {
    display: inline-block;
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 0.7px;
}


    /* =========================================================
   BREADCRUMB LINK
   ========================================================= */

    .th26-facility-breadcrumb-item a {
        display: inline-block;
        color: #ffffff !important;
        text-decoration: none !important;
        transition: color 0.3s ease, transform 0.3s ease;
    }


        .th26-facility-breadcrumb-item a:hover {
            color: #fff9c7 !important;
            transform: translateY(-2px);
        }


/* =========================================================
   BREADCRUMB DIVIDER
   ========================================================= */

.th26-facility-breadcrumb-divider {
    color: #9d795d;
    font-size: 15px;
    font-weight: 700;
}


/* =========================================================
   ACTIVE BREADCRUMB
   ========================================================= */

.th26-facility-active {
    color: #fff9c7 !important;
    font-weight: 600;
}


/* =========================================================
   SCROLL INDICATOR
   ========================================================= */

.th26-facility-scroll {
    position: absolute;
    left: 50%;
    bottom: 22px;
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transform: translateX(-50%);
    pointer-events: none;
}


.th26-facility-scroll-label {
    color: #ffffff;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 3px;
}


.th26-facility-scroll-line {
    display: block;
    width: 1px;
    height: 32px;
    background: #fff9c7;
    animation: th26FacilityScrollAnimation 1.8s ease-in-out infinite;
}


@keyframes th26FacilityScrollAnimation {

    0% {
        transform: scaleY(0.35);
        transform-origin: top;
        opacity: 0.3;
    }

    50% {
        transform: scaleY(1);
        transform-origin: top;
        opacity: 1;
    }

    100% {
        transform: scaleY(0.35);
        transform-origin: bottom;
        opacity: 0.3;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991.98px) {

    .th26-facility-hero {
        min-height: 500px;
        background-attachment: scroll;
    }


    .th26-facility-row {
        min-height: 500px;
    }


    .th26-facility-content {
        max-width: 800px;
        padding-top: 65px;
        padding-bottom: 65px;
    }


    .th26-facility-title {
        font-size: clamp(48px, 8vw, 70px);
    }


    .th26-facility-description {
        max-width: 680px;
        font-size: 15px;
        line-height: 1.8;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767.98px) {

    .th26-facility-hero {
        min-height: 470px;
        background-position: center center;
        /*
           Fixed background removed on mobile
           for better compatibility.
        */
        background-attachment: scroll;
    }


    .th26-facility-row {
        min-height: 470px;
    }


    .th26-facility-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }


    .th26-facility-column {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }


    .th26-facility-content {
        max-width: 100%;
        padding: 60px 8px;
    }


    /* Eyebrow */

    .th26-facility-eyebrow {
        gap: 9px;
        margin-bottom: 18px !important;
    }


    .th26-facility-eyebrow-text {
        font-size: 8px;
        letter-spacing: 2.5px;
        white-space: nowrap;
    }


    .th26-facility-line {
        width: 28px;
        flex: 0 0 28px;
    }


    /* Title */

    .th26-facility-title {
        font-size: clamp(43px, 13vw, 62px);
        line-height: 1.08;
        letter-spacing: -1.5px;
    }


    /* Separator */

    .th26-facility-separator {
        gap: 9px;
        margin-top: 25px !important;
        margin-bottom: 18px !important;
    }


    .th26-facility-separator-line {
        width: 40px;
    }


    .th26-facility-plus {
        width: 27px;
        height: 27px;
        font-size: 16px;
    }


    /* Description */

    .th26-facility-description {
        max-width: 100%;
        padding: 0 5px !important;
        font-size: 14px;
        line-height: 1.75;
    }


    /* Breadcrumb */

    .th26-facility-navigation {
        margin-top: 22px !important;
    }


    .th26-facility-breadcrumb {
        gap: 8px;
    }


    .th26-facility-breadcrumb-item {
        font-size: 12px;
    }


    /* Hide scroll indicator */

    .th26-facility-scroll {
        display: none !important;
    }


    /* Decorative circles */

    .th26-facility-circle-one {
        width: 160px;
        height: 160px;
        top: -90px;
        right: -70px;
    }


    .th26-facility-circle-two {
        width: 120px;
        height: 120px;
        bottom: -70px;
        left: -55px;
    }
}


/* =========================================================
   EXTRA SMALL DEVICES
   ========================================================= */

@media (max-width: 400px) {

    .th26-facility-hero {
        min-height: 450px;
    }


    .th26-facility-row {
        min-height: 450px;
    }


    .th26-facility-content {
        padding-top: 52px;
        padding-bottom: 52px;
    }


    .th26-facility-eyebrow-text {
        font-size: 7px;
        letter-spacing: 2px;
    }


    .th26-facility-line {
        width: 20px;
        flex-basis: 20px;
    }


    .th26-facility-title {
        font-size: 43px;
    }


    .th26-facility-description {
        font-size: 13px;
        line-height: 1.7;
    }
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .th26-facility-scroll-line {
        animation: none;
    }
}










@media (max-width: 767px) {

    .tyx-contact-hero {
        min-height: 480px !important;
        height: 480px !important;
        background-attachment: scroll !important;
        background-position: center center !important;
    }

        .tyx-contact-hero p {
            font-size: 15px !important;
            padding: 0 15px;
        }
}











.tanya-about-care-section {
    position: relative;
    background-image: linear-gradient( rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88) ), url('/images/tanya-hospital-background.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    /* Parallax */
    background-attachment: fixed;
}
    






























/* =========================================================
   TANYA 2026 PATIENT VIDEO CAROUSEL
========================================================= */

.tanya26-patient-video-section {
    width: 100%;
    background: #ffffff;
    padding: 25px 0 45px;
    overflow: hidden;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.tanya26-patient-video-container {
    width: 90%;
    max-width: 90%;
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.tanya26-patient-video-heading {
    max-width: 700px;
    margin: 0 auto 32px;
    text-align: center;
}

.tanya26-patient-video-eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: #9d795d;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
}

.tanya26-patient-video-heading h2 {
    margin: 0;
    color: #000000;
    font-size: clamp(26px, 3vw, 42px);
    font-weight: 800;
    line-height: 1.15;
}

.tanya26-patient-video-heading p {
    max-width: 580px;
    margin: 12px auto 0;
    color: #666666;
    font-size: 15px;
    line-height: 1.6;
}


/* =========================================================
   CAROUSEL
========================================================= */

.tanya26-patient-video-carousel {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
}


/* =========================================================
   VIEWPORT
========================================================= */

.tanya26-patient-video-viewport {
    width: 100%;
    overflow: hidden;
}


/* =========================================================
   TRACK
========================================================= */

.tanya26-patient-video-track {
    display: flex;
    width: 100%;
    margin: 0;
    padding: 0;
    will-change: transform;
    transform: translate3d(0, 0, 0);
}


/* =========================================================
   SLIDE
========================================================= */

.tanya26-patient-video-item {
    flex: 0 0 33.333333%;
    width: 33.333333%;
    min-width: 0;
    padding: 0 8px;
    box-sizing: border-box;
}


/* =========================================================
   CARD
========================================================= */

.tanya26-patient-video-card {
    height: 100%;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(157, 121, 93, 0.25);
    border-radius: 22px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .tanya26-patient-video-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 16px 34px rgba(0, 0, 0, 0.13);
    }


/* =========================================================
   INSTAGRAM VIDEO
========================================================= */

.tanya26-instagram-wrapper {
    position: relative;
    width: 100%;
    height: 270px;
    overflow: hidden;
    background: #f4f0ed;
}

    .tanya26-instagram-wrapper iframe {
        display: block;
        width: 100%;
        height: 100%;
        border: 0;
    }


/* =========================================================
   INSTAGRAM OVERLAY
========================================================= */

.tanya26-instagram-overlay {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border-radius: 30px;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.65);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    pointer-events: none;
}

    .tanya26-instagram-overlay i {
        font-size: 14px;
    }


/* =========================================================
   CARD CONTENT
========================================================= */

.tanya26-patient-video-content {
    padding: 18px 18px 20px;
}

.tanya26-video-category {
    display: inline-block;
    margin-bottom: 7px;
    color: #9d795d;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.tanya26-patient-video-content h3 {
    min-height: 44px;
    margin: 0;
    color: #000000;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
}

.tanya26-patient-video-content p {
    min-height: 45px;
    margin: 9px 0 0;
    color: #666666;
    font-size: 13px;
    line-height: 1.55;
}


/* =========================================================
   ARROWS
========================================================= */

.tanya26-video-arrow {
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(157, 121, 93, 0.4);
    border-radius: 50%;
    color: #ffffff;
    background: #9d795d;
    cursor: pointer;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

    .tanya26-video-arrow:hover {
        background: #000000;
        transform: scale(1.06);
        box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    }

    .tanya26-video-arrow:active {
        transform: scale(0.96);
    }

    .tanya26-video-arrow:focus-visible {
        outline: 3px solid #fff9c7;
        outline-offset: 3px;
    }

    .tanya26-video-arrow i {
        font-size: 14px;
    }


/* =========================================================
   DOTS
========================================================= */

.tanya26-patient-video-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
}

.tanya26-patient-video-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #d8d0ca;
    cursor: pointer;
    transition: width 0.25s ease, background 0.25s ease;
}

    .tanya26-patient-video-dot.active {
        width: 25px;
        border-radius: 20px;
        background: #9d795d;
    }

    .tanya26-patient-video-dot:focus-visible {
        outline: 3px solid #fff9c7;
        outline-offset: 3px;
    }


/* =========================================================
   HEADER ANIMATION
========================================================= */

.tanya26-video-header-animation {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

    .tanya26-video-header-animation.tanya26-video-visible {
        opacity: 1;
        transform: translateY(0);
    }


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1200px) {

    .tanya26-instagram-wrapper {
        height: 245px;
    }

    .tanya26-patient-video-content {
        padding: 15px;
    }

        .tanya26-patient-video-content h3 {
            font-size: 17px;
        }

        .tanya26-patient-video-content p {
            font-size: 12px;
        }
}


/* =========================================================
   TABLET
   2 CARDS
========================================================= */

@media (max-width: 991px) {

    .tanya26-patient-video-section {
        padding: 45px 0 38px;
    }

    .tanya26-patient-video-carousel {
        gap: 10px;
    }

    .tanya26-patient-video-item {
        flex: 0 0 50%;
        width: 50%;
        padding: 0 6px;
    }

    .tanya26-instagram-wrapper {
        height: 280px;
    }

    .tanya26-video-arrow {
        flex: 0 0 38px;
        width: 38px;
        height: 38px;
    }
}


/* =========================================================
   MOBILE
   1 CARD
========================================================= */

@media (max-width: 767px) {

    .tanya26-patient-video-section {
        padding: 38px 0 32px;
    }

    .tanya26-patient-video-container {
        width: 92%;
        max-width: 92%;
    }

    .tanya26-patient-video-heading {
        margin-bottom: 22px;
    }

        .tanya26-patient-video-heading h2 {
            font-size: 28px;
        }

        .tanya26-patient-video-heading p {
            font-size: 13px;
        }

    .tanya26-patient-video-carousel {
        gap: 5px;
    }

    .tanya26-patient-video-item {
        flex: 0 0 100%;
        width: 100%;
        padding: 0 3px;
    }

    .tanya26-instagram-wrapper {
        height: 300px;
    }

    .tanya26-patient-video-content {
        padding: 16px 17px 18px;
    }

        .tanya26-patient-video-content h3 {
            min-height: auto;
            font-size: 19px;
        }

        .tanya26-patient-video-content p {
            min-height: auto;
            font-size: 13px;
        }

    .tanya26-video-arrow {
        flex: 0 0 32px;
        width: 32px;
        height: 32px;
    }

        .tanya26-video-arrow i {
            font-size: 11px;
        }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .tanya26-patient-video-container {
        width: 94%;
        max-width: 94%;
    }

    .tanya26-patient-video-heading h2 {
        font-size: 25px;
    }

    .tanya26-patient-video-heading p {
        font-size: 12px;
    }

    .tanya26-instagram-wrapper {
        height: 285px;
    }

    .tanya26-patient-video-content h3 {
        font-size: 18px;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tanya26-patient-video-track,
    .tanya26-patient-video-card,
    .tanya26-video-header-animation {
        transition: none !important;
    }

    .tanya26-video-header-animation {
        opacity: 1;
        transform: none;
    }
}


/* =========================================================
    SECTION HEADER - FORCE TEXT VISIBILITY
 ========================================================= */

.tanya26-patient-video-heading {
    max-width: 700px;
    margin: 0 auto 32px;
    text-align: center;
    color: #000000 !important;
}


    /* Eyebrow */

    .tanya26-patient-video-heading
    .tanya26-patient-video-eyebrow {
        display: inline-block;
        margin-bottom: 8px;
        color: #000000 !important;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 2px;
        opacity: 1 !important;
        visibility: visible !important;
    }


    /* Main heading */

    .tanya26-patient-video-heading h2 {
        display: block;
        margin: 0;
        color: #000000 !important;
        font-size: clamp(26px, 3vw, 42px);
        font-weight: 800;
        line-height: 1.15;
        opacity: 1 !important;
        visibility: visible !important;
    }


    /* Description */

    .tanya26-patient-video-heading p {
        display: block;
        max-width: 580px;
        margin: 12px auto 0;
        color: #000000 !important;
        font-size: 15px;
        line-height: 1.6;
        text-align: center;
        opacity: 1 !important;
        visibility: visible !important;
    }


/* =========================================================
    HEADER ANIMATION
    SAFE VERSION
 ========================================================= */

.tanya26-video-header-animation {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

    .tanya26-video-header-animation.tanya26-video-visible {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0);
    }


/* =========================================================
   PATIENT VIDEO - PREMIUM HEADING
========================================================= */

.tanya26-patient-video-heading {
    max-width: 760px;
    margin: 0 auto 35px;
    text-align: center;
    color: #000000;
    position: relative;
}

/* Small eyebrow text */
.tanya26-patient-video-eyebrow {
    display: inline-block;
    position: relative;
    margin-bottom: 12px;
    padding: 7px 18px;
    color: #9d795d !important;
    background: #fff9c7;
    border: 1px solid rgba(157, 121, 93, 0.25);
    border-radius: 30px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    box-shadow: 0 5px 18px rgba(157, 121, 93, 0.12);
    opacity: 1 !important;
    visibility: visible !important;
}


/* Main heading */
.tanya26-patient-video-heading h2 {
    position: relative;
    display: inline-block;
    margin: 0;
    padding-bottom: 14px;
    color: #000000 !important;
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.8px;
    opacity: 1 !important;
    visibility: visible !important;
}


    /* Premium brown underline */
    .tanya26-patient-video-heading h2::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        width: 70px;
        height: 4px;
        transform: translateX(-50%);
        background: #9d795d;
        border-radius: 10px;
    }


/* Description */
.tanya26-patient-video-heading p {
    max-width: 620px;
    margin: 18px auto 0;
    color: #000000 !important;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.7;
    opacity: 1 !important;
    visibility: visible !important;
}


/* =========================================================
   HEADER ANIMATION
========================================================= */

.tanya26-video-header-animation {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

    .tanya26-video-header-animation.tanya26-video-visible {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0);
    }


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .tanya26-patient-video-heading {
        max-width: 92%;
        margin-bottom: 28px;
    }

    .tanya26-patient-video-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
        padding: 6px 15px;
        margin-bottom: 10px;
    }

    .tanya26-patient-video-heading h2 {
        font-size: 30px;
        letter-spacing: -0.4px;
        padding-bottom: 12px;
    }

        .tanya26-patient-video-heading h2::after {
            width: 55px;
            height: 3px;
        }

    .tanya26-patient-video-heading p {
        font-size: 14px;
        line-height: 1.65;
        margin-top: 15px;
    }
}


/* =========================================================
   TANYA FOOTER - clean & fully responsive
   Save as: wwwroot/css/footer/tanya-footer.css
   ========================================================= */
.tf {
    --tf-bg: #97765d;
    --tf-bg-dark: #00000026;
    --tf-accent: #97765d;
    --tf-cream: #fff9c7;
    --tf-text: #f3ece4;

    /* overlay first, image underneath */
    background-color: var(--tf-bg);
    background-image:
    linear-gradient(rgba(151, 118, 93, .65), rgba(110, 82, 60, .72)),
    url('/images/footer4.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    color: var(--tf-text);
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    line-height: 1.7;
}
.tf-title, .tf-about, .tf-links a, .tf-contact li {
    text-shadow: 0 1px 3px rgba(0,0,0,.35);
}
.tf *,
.tf *::before,
.tf *::after {
    box-sizing: border-box;
}

.tf a {
    color: var(--tf-text);
    text-decoration: none;
    transition: color .25s ease, background .25s ease, transform .25s ease;
}

.tf a:hover,
.tf a:focus-visible {
    color: #fff;
}

.tf ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tf p {
    text-align: left;     /* overrides the global justify rule */
    margin: 0;
    text-align: justify;
}

/* ---------- main grid ---------- */
.tf-main {
    width: 100%;
    max-width: 1500px;                 /* wider = smaller side gaps */
    margin: 0 auto;
    padding: 56px clamp(20px, 4vw, 70px) 40px;   /* side space shrinks on big screens */
    display: grid;
    grid-template-columns: 1.5fr 1fr 1.3fr;
    gap: 40px clamp(30px, 5vw, 90px);
}

.tf-title {
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 18px;
    padding-bottom: 10px;
    position: relative;
}

.tf-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 2px;
    background: var(--tf-cream);
}

/* ---------- brand ---------- */
.tf-logo img {
    max-width: 200px;
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 14px;
}

.tf-about {
    color: var(--tf-cream);
    max-width: 420px;
    margin-bottom: 24px;               /* space between text and social icons */
}

/* stop theme's justify rule from stretching words (address had big gaps) */
.tf,
.tf li,
.tf span,
.tf div {
    text-align: left;
}

.tf-bottom {
    text-align: center !important;
}

/* ---------- social ---------- */
.tf-social {
    display: flex;
    gap: 10px;
}

.tf-social a {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--tf-accent);
    color: #fff;
    border-radius: 50%;
    font-size: 16px;
}

.tf-social a:hover {
    background: #fff;
    color: var(--tf-bg);
    transform: translateY(-3px);
}

/* ---------- quick links ---------- */
.tf-links li a {
    display: inline-block;
    padding: 5px 0;
}

.tf-links li a::before {
    content: "\203A";            /* › */
    color: var(--tf-cream);
    margin-right: 8px;
    font-weight: 700;
}

.tf-links li a:hover {
    transform: translateX(4px);
}

/* ---------- contact ---------- */
.tf-contact li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 14px;
}

.tf-contact i {
    flex: 0 0 18px;
    margin-top: 5px;
    color: var(--tf-cream);
    text-align: center;
}

.tf-contact a,
.tf-contact span {
    word-break: break-word;
}

/* ---------- bottom bar ---------- */
.tf-bottom {
    background: #000;
    text-align: center;
    padding: 16px 20px;
    font-size: 13.5px;
    color: #fff;
}

.tf-bottom a {
    color: #c89c7a;
}

.tf-bottom a:hover {
    color: #fff;
}

.tf-bottom .sep {
    margin: 0 6px;
    opacity: .6;
}

/* ---------- tablet ---------- */
@media (max-width: 991px) {
    .tf-main {
        grid-template-columns: 1fr 1fr;
        gap: 36px 30px;
        padding-top: 44px;
    }

    .tf-brand {
        grid-column: 1 / -1;
    }

    .tf-about {
        max-width: 560px;
    }
}

/* ---------- mobile ---------- */
@media (max-width: 575px) {
    .tf-main {
        grid-template-columns: 1fr;
        gap: 30px;
        padding: 36px 18px 28px;
        text-align: left;
    }

    .tf-logo img {
        max-width: 170px;
    }

    /* links in two compact columns */
    .tf-links {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 16px;
    }

    .tf-bottom {
        font-size: 12.5px;
        line-height: 1.8;
        padding: 14px 16px;
    }

    /* keep the scroll-to-top button clear of the text */
    .tf-bottom {
        padding-bottom: 20px;
    }
}

.footer .styled-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    line-height: 1;
    border-radius: 50%;
    margin: 0 10px 0 0;
}

.footer .styled-icons a i {
    line-height: 1;
    margin: 0;
    transform: none;
}
/* ===== TOPBAR: centre everything, fix icon alignment ===== */
.tanya26-topbar .tanya26-social-list {
    display: flex;
    align-items: center;
    justify-content: flex-end;      /* desktop: right side */
    gap: 10px;
    margin: 0;
    padding: 0;
}

.tanya26-topbar .tanya26-social-list a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    margin: 0;
    line-height: 1;
    border-radius: 50%;
    flex: 0 0 34px;
}

.tanya26-topbar .tanya26-social-list a i {
    display: block;
    margin: 0;
    padding: 0;
    line-height: 1;
    font-size: 15px;
    width: auto;
    height: auto;
    transform: none;
}

/* ===== Tablet / mobile: centre both rows ===== */
@media (max-width: 991px) {
    .tanya26-topbar .tanya26-social-list {
        justify-content: center;    /* centred under the phone numbers */
        margin-top: 8px;
    }

    .tanya26-topbar .tanya26-contact-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 6px 18px;
        text-align: center;
    }

    .tanya26-topbar .tanya26-header-container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .tanya26-topbar .row {
        margin-left: 0;
        margin-right: 0;
        row-gap: 4px;
    }
}
/* ===== TOPBAR: text only, responsive ===== */

/* Tablet (576px - 991px): text numbers on the left, social icons on the right, one line */
@media (max-width: 991px) {

    .tanya26-topbar .row {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        margin: 0;
    }

    .tanya26-topbar .row > [class*="col-"] {
        width: auto;
        max-width: none;
        padding: 0 6px;
    }

    .tanya26-topbar .row > [class*="col-"]:first-child {
        flex: 1 1 auto;
        min-width: 0;
    }

    .tanya26-topbar .row > [class*="col-"]:last-child {
        flex: 0 0 auto;
    }

    .tanya26-topbar .tanya26-contact-list {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        white-space: nowrap;
        overflow: hidden;
        gap: 0;
    }

    /* text only: hide phone / mobile / hospital icons */
    .tanya26-topbar .tanya26-contact-item i {
        display: none;
    }

    .tanya26-topbar .tanya26-contact-item {
        display: inline-flex;
        align-items: center;
        font-size: 12px;
        line-height: 1.3;
        padding: 0 10px;
    }

    .tanya26-topbar .tanya26-contact-item:first-child {
        padding-left: 0;
    }

    .tanya26-topbar .tanya26-contact-item + .tanya26-contact-item {
        border-left: 1px solid rgba(255, 255, 255, .35);
    }

    .tanya26-topbar .tanya26-social-list {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 6px;
        margin: 0;
    }

    .tanya26-topbar .tanya26-social-list a {
        width: 30px;
        height: 30px;
        flex: 0 0 30px;
    }

    .tanya26-topbar .tanya26-social-list a i {
        font-size: 13px;
    }
    
    
}
@media (max-width: 700px) {
   .tanya26-topbar .tanya26-social-list,
    .tanya26-topbar .row > [class*="col-"]:last-child {
        display: none !important;
    }
}  


/* Mobile (575px and below): HIDE social links, show all numbers centred as text */
@media (max-width: 575px) {

    /* hide the social column completely */
    .tanya26-topbar .tanya26-social-list,
    .tanya26-topbar .row > [class*="col-"]:last-child {
        display: none !important;
    }

    .tanya26-topbar .row > [class*="col-"]:first-child {
        flex: 1 1 100%;
        padding: 0 10px;
    }

    .tanya26-topbar .tanya26-contact-list {
        flex-wrap: wrap;             /* wraps neatly on very narrow screens */
        justify-content: center;
        row-gap: 2px;
        white-space: normal;
        overflow: visible;
        text-align: center;
    }

    .tanya26-topbar .tanya26-contact-item,
    .tanya26-topbar .tanya26-contact-item:first-child {
        font-size: 12px;
        padding: 2px 8px;
    }
}


/* ===== Section background ===== */
.tsh-about-specialties {
      background: linear-gradient(135deg, #fff9c7 0%, #ffffff 48%, #f5eee8 100%) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 249, 199, .22),
        0 24px 60px #00000026 !important;
}