/* =========================================================
   TADIKELA SUBBAIAH TRUST
   PREMIUM NAVBAR
========================================================= */

:root {

    --sst-maroon: #861f1f;
    --sst-maroon-dark: #5d1518;
    --sst-maroon-deep: #421014;

    --sst-red: #a52a26;

    --sst-gold: #b88938;
    --sst-gold-light: #d8b765;
    --sst-gold-soft: #ead49e;

    --sst-cream: #fffaf1;
    --sst-white: #ffffff;

    --sst-text: #27201e;
    --sst-muted: #6f6762;

}


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

.sst-header {

    position: relative;

    width: 100%;

    z-index: 1000;

    background:
        linear-gradient(
            90deg,
            var(--sst-maroon-deep) 0%,
            var(--sst-maroon) 30%,
            #a72b25 60%,
            var(--sst-maroon-dark) 100%
        );

    padding: 0 14px;

}


/* =========================================================
   NAVBAR
========================================================= */

.sst-navbar {

    position: relative;

    width: 100%;

    min-height: 88px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    padding-right: 22px;

    background:
        linear-gradient(
            90deg,
            #fffdf8 0%,
            #ffffff 48%,
            #fffaf2 100%
        );

    border-radius: 0 0 0 28px;

    box-shadow:
        0 12px 35px rgba(50, 12, 12, .14);

}


/* =========================================================
   BRAND AREA
========================================================= */

.sst-brand {

    position: relative;

    width: 405px;

    height: 88px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    padding-left: 28px;

    background:
        linear-gradient(
            105deg,
            #fffdf8 0%,
            #fffaf0 72%,
            #f8ecd7 100%
        );

    overflow: hidden;

    clip-path:
        polygon(
            0 0,
            94% 0,
            100% 50%,
            94% 100%,
            0 100%
        );

}


/* Gold decorative edge */

.sst-brand::after {

    content: "";

    position: absolute;

    top: -15px;

    right: 16px;

    width: 30px;

    height: 120px;

    background:
        linear-gradient(
            180deg,
            #e2c275,
            #b88938,
            #e8cf8b
        );

    transform:
        rotate(29deg);

    opacity: .95;

}


/* Subtle maroon edge */

.sst-brand::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 55px;

    height: 100%;

    background:
        linear-gradient(
            180deg,
            rgba(134,31,31,.14),
            rgba(134,31,31,0)
        );

    pointer-events: none;

}


/* Logo */

.sst-brand-logo {

    position: relative;

    z-index: 2;

    width: 335px;

    max-width: calc(100% - 35px);

    height: auto;

    object-fit: contain;

    filter:
        drop-shadow(
            0 3px 5px rgba(80, 30, 15, .10)
        );

}


/* =========================================================
   BRAND GLOW
========================================================= */

.sst-brand-glow {

    position: absolute;

    width: 120px;

    height: 120px;

    left: -45px;

    top: -40px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(216,183,101,.24),
            transparent 68%
        );

    pointer-events: none;

}


/* =========================================================
   NAVIGATION
========================================================= */

.sst-navigation {

    display: flex;

    align-items: center;

    justify-content: flex-end;

    gap: 4px;

    flex: 1;

    min-width: 0;

}


/* =========================================================
   NAV LINKS
========================================================= */

.sst-nav-link {

    position: relative;

    height: 88px;

    padding:
        0 17px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    color: #302826;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 14px;

    font-weight: 600;

    white-space: nowrap;

    transition:
        color .25s ease,
        transform .25s ease;

}


/* Gold underline */

.sst-nav-link::after {

    content: "";

    position: absolute;

    left: 17px;

    right: 17px;

    bottom: 21px;

    height: 3px;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            var(--sst-maroon),
            var(--sst-gold)
        );

    transform:
        scaleX(0);

    transform-origin: center;

    transition:
        transform .28s ease;

}


/* Hover */

.sst-nav-link:hover {

    color: var(--sst-maroon);

    transform:
        translateY(-1px);

}


/* Active */

.sst-nav-link.active {

    color:
        var(--sst-maroon);

    font-weight: 700;

}


.sst-nav-link.active::after {

    transform:
        scaleX(1);

}


/* =========================================================
   QUICK LINKS BUTTON
========================================================= */

.sst-quick-btn {

    position: relative;

    height: 48px;

    margin-left: 13px;

    padding:
        0 17px 0 8px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    border-radius: 50px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #741a1c 0%,
            #a52a26 55%,
            #8b1f20 100%
        );

    border:
        1px solid rgba(216,183,101,.55);

    box-shadow:
        0 7px 20px rgba(91, 20, 22, .22);

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 13px;

    font-weight: 700;

    white-space: nowrap;

    transition:
        transform .25s ease,
        box-shadow .25s ease;

}


/* Gold glow */

.sst-quick-btn::before {

    content: "";

    position: absolute;

    inset: 2px;

    border-radius: inherit;

    border:
        1px solid rgba(255,255,255,.13);

    pointer-events: none;

}


/* Hover */

.sst-quick-btn:hover {

    color: #ffffff;

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 27px rgba(91, 20, 22, .30);

}


/* Quick icon */

.sst-quick-icon {

    width: 34px;

    height: 34px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        rgba(255,255,255,.12);

    color:
        var(--sst-gold-soft);

    font-size: 14px;

}


/* Arrow */

.sst-quick-arrow {

    font-size: 10px;

    color:
        var(--sst-gold-soft);

    margin-left: 2px;

}


/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

.sst-menu-toggle {

    display: none;

    width: 45px;

    height: 45px;

    flex-shrink: 0;

    border: 1px solid
        rgba(134,31,31,.18);

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            #fff,
            #f8eee0
        );

    cursor: pointer;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    gap: 5px;

    box-shadow:
        0 5px 15px rgba(80,20,15,.08);

}


/* Hamburger lines */

.sst-menu-toggle span {

    display: block;

    width: 20px;

    height: 2px;

    border-radius: 5px;

    background:
        var(--sst-maroon);

    transition:
        transform .25s ease,
        opacity .25s ease;

}


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

@media (max-width: 1180px) {

    .sst-brand {

        width: 330px;

    }

    .sst-brand-logo {

        width: 275px;

    }

    .sst-nav-link {

        padding:
            0 11px;

        font-size: 13px;

    }

    .sst-nav-link::after {

        left: 11px;

        right: 11px;

    }

    .sst-quick-btn {

        margin-left: 7px;

        padding-right: 13px;

    }

    .sst-quick-text {

        display: none;

    }

    .sst-quick-btn {

        width: 48px;

        padding: 0;

        justify-content: center;

    }

    .sst-quick-arrow {

        display: none;

    }

}


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

@media (max-width: 900px) {

    .sst-header {

        padding:
            0 10px;

    }


    .sst-navbar {

        min-height: 76px;

        padding:
            0 15px 0 0;

        border-radius:
            0 0 0 20px;

    }


    .sst-brand {

        width: 285px;

        height: 76px;

        padding-left: 17px;

    }


    .sst-brand-logo {

        width: 245px;

    }


    /* Mobile button */

    .sst-menu-toggle {

        display: flex;

        margin-left: auto;

    }


    /* Navigation panel */

    .sst-navigation {

        position: absolute;

        left: 12px;

        right: 12px;

        top: calc(100% + 9px);

        display: none;

        flex-direction: column;

        align-items: stretch;

        gap: 3px;

        padding: 10px;

        background:
            rgba(255,253,248,.98);

        border:
            1px solid rgba(134,31,31,.10);

        border-radius: 20px;

        box-shadow:
            0 20px 45px rgba(55,15,15,.18);

        backdrop-filter:
            blur(18px);

    }


    .sst-navigation.active {

        display: flex;

    }


    .sst-nav-link {

        width: 100%;

        height: 48px;

        justify-content: flex-start;

        padding:
            0 17px;

        border-radius: 12px;

    }


    .sst-nav-link::after {

        display: none;

    }


    .sst-nav-link:hover {

        background:
            #f8eee0;

        transform: none;

    }


    .sst-nav-link.active {

        color: #fff;

        background:
            linear-gradient(
                135deg,
                var(--sst-maroon),
                var(--sst-red)
            );

        box-shadow:
            0 5px 14px rgba(134,31,31,.16);

    }


    /* Quick button mobile */

    .sst-quick-btn {

        width: 100%;

        height: 48px;

        margin:
            5px 0 0;

        justify-content:
            center;

        border-radius: 13px;

    }


    .sst-quick-text {

        display: inline;

    }


    .sst-quick-arrow {

        display: inline-block;

    }

}


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

@media (max-width: 600px) {

    .sst-header {

        padding:
            0 7px;

    }


    .sst-navbar {

        min-height: 70px;

        padding-right: 10px;

    }


    .sst-brand {

        width: 235px;

        height: 70px;

        padding-left: 10px;

    }


    .sst-brand-logo {

        width: 205px;

        max-width:
            calc(100% - 20px);

    }


    .sst-menu-toggle {

        width: 42px;

        height: 42px;

    }


    .sst-navigation {

        left: 7px;

        right: 7px;

        top:
            calc(100% + 7px);

        border-radius: 17px;

    }

}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 390px) {

    .sst-brand {

        width: 205px;

    }


    .sst-brand-logo {

        width: 180px;

    }

}

/* =========================================================
   HAMBURGER → CLOSE ANIMATION
========================================================= */

.sst-menu-toggle.open span:nth-child(1) {

    transform:
        translateY(7px)
        rotate(45deg);

}


.sst-menu-toggle.open span:nth-child(2) {

    opacity: 0;

}


.sst-menu-toggle.open span:nth-child(3) {

    transform:
        translateY(-7px)
        rotate(-45deg);

}


/* =========================================================
   TADIKELA SUBBAIAH TRUST
   NAVBAR FINAL POLISH
   - Sticky on scroll
   - Remove black focus box
   - Premium active/click effect
   - Smooth scrolling
========================================================= */


/* =========================================================
   SMOOTH PAGE SCROLL
========================================================= */

html {
    scroll-behavior: smooth;
}


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

.sst-header {

    position: sticky !important;

    top: 0;

    left: 0;

    width: 100%;

    z-index: 9999;

}


/* =========================================================
   REMOVE BROWSER BLACK FOCUS BOX
========================================================= */

.sst-nav-link,
.sst-quick-btn,
.sst-menu-toggle,
.sst-navigation a {

    outline: none !important;

}


/* Remove Bootstrap/browser focus rectangle */

.sst-nav-link:focus,
.sst-nav-link:focus-visible,
.sst-nav-link:active {

    outline: none !important;

    box-shadow: none !important;

}


/* =========================================================
   NAV LINK CLICK / ACTIVE DESIGN
========================================================= */

.sst-nav-link {

    border-radius: 12px;

    transition:
        color .25s ease,
        background .25s ease,
        transform .25s ease;

}


/* Hover */

.sst-nav-link:hover {

    color: var(--sst-maroon) !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,248,235,.95),
            rgba(255,253,248,.65)
        );

}


/* Active */

.sst-nav-link.active {

    color: var(--sst-maroon) !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,248,235,.96),
            rgba(250,242,226,.72)
        );

    box-shadow:
        inset 0 0 0 1px rgba(184,137,56,.12);

}


/* Active underline */

.sst-nav-link.active::after {

    transform: scaleX(1);

}


/* =========================================================
   WHEN USER CLICKS ANCHOR
   REMOVE FOCUS RECTANGLE
========================================================= */

.sst-nav-link:focus:not(:focus-visible) {

    outline: none !important;

    box-shadow:
        inset 0 0 0 1px rgba(184,137,56,.10) !important;

}


/* =========================================================
   QUICK LINKS FOCUS
========================================================= */

.sst-quick-btn:focus,
.sst-quick-btn:focus-visible {

    outline: none !important;

    box-shadow:
        0 7px 20px rgba(91,20,22,.22) !important;

}


/* =========================================================
   MOBILE MENU BUTTON FOCUS
========================================================= */

.sst-menu-toggle:focus,
.sst-menu-toggle:focus-visible {

    outline: none !important;

    box-shadow:
        0 5px 15px rgba(80,20,15,.08) !important;

}


/* =========================================================
   STICKY HEADER SHADOW
========================================================= */

.sst-header {

    box-shadow:
        0 8px 30px rgba(50,12,12,.10);

}


/* =========================================================
   NAVBAR INNER SHADOW
========================================================= */

.sst-navbar {

    transition:
        box-shadow .3s ease,
        background .3s ease;

}


/* =========================================================
   DESKTOP ACTIVE MENU
========================================================= */

@media (min-width: 901px) {

    .sst-nav-link {

        margin:
            0 2px;

    }


    .sst-nav-link.active {

        transform:
            translateY(-1px);

    }


    .sst-nav-link.active::before {

        content: "";

        position: absolute;

        left: 9px;

        right: 9px;

        bottom: 8px;

        height: 1px;

        border-radius: 10px;

        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(184,137,56,.65),
                transparent
            );

        pointer-events: none;

    }

}


/* =========================================================
   MOBILE ACTIVE MENU
========================================================= */

@media (max-width: 900px) {

    .sst-nav-link:focus,
    .sst-nav-link:focus-visible {

        outline: none !important;

        box-shadow: none !important;

    }


    .sst-nav-link.active {

        color: #fff !important;

        background:
            linear-gradient(
                135deg,
                #861f1f,
                #a52a26
            );

        box-shadow:
            0 6px 16px
            rgba(134,31,31,.16);

    }

}


/* =========================================================
   MOBILE NAV PANEL SMOOTH ANIMATION
========================================================= */

@media (max-width: 900px) {

    .sst-navigation {

        transform:
            translateY(-8px);

        opacity: 0;

        visibility: hidden;

        transition:
            opacity .25s ease,
            transform .25s ease,
            visibility .25s ease;

    }


    .sst-navigation.active {

        display: flex;

        transform:
            translateY(0);

        opacity: 1;

        visibility: visible;

    }

}


/* =========================================================
   HEADER LOGO / NAV ALIGNMENT
========================================================= */

.sst-navbar {

    overflow: visible;

}


/* =========================================================
   STICKY HEADER ON SMALL SCREENS
========================================================= */

@media (max-width: 900px) {

    .sst-header {

        position: sticky !important;

        top: 0;

    }

}


/* =========================================================
   ACCESSIBILITY
   Keep keyboard navigation visible without black box
========================================================= */

.sst-nav-link:focus-visible {

    outline:
        2px solid rgba(184,137,56,.45) !important;

    outline-offset:
        -2px;

    border-radius:
        12px;

}


/* =========================================================
   PREVENT ANCHOR JUMP HIDING UNDER STICKY NAVBAR
========================================================= */

section[id],
div[id] {

    scroll-margin-top:
        100px;

}


/* =========================================================
   TADIKELA SUBBAIAH TRUST
   PREMIUM QUICK LINKS DRAWER
========================================================= */


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

.sst-quick-overlay {

    position: fixed;

    inset: 0;

    z-index: 10000;

    background:
        rgba(24, 12, 12, .42);

    backdrop-filter:
        blur(5px);

    -webkit-backdrop-filter:
        blur(5px);

    opacity: 0;

    visibility: hidden;

    transition:
        opacity .35s ease,
        visibility .35s ease;

}


/* OPEN */

.sst-quick-overlay.active {

    opacity: 1;

    visibility: visible;

}


/* =========================================================
   DRAWER
========================================================= */

.sst-quick-drawer {

    position: fixed;

    top: 0;

    right: 0;

    z-index: 10001;

    width:
        min(
            470px,
            92vw
        );

    height: 100vh;

    display: flex;

    flex-direction: column;

    background:

        linear-gradient(
            145deg,
            #fffefd 0%,
            #fffaf3 48%,
            #f8f5f0 100%
        );

    border-left:
        1px solid
        rgba(184,137,56,.18);

    box-shadow:
        -25px 0 70px
        rgba(45,15,15,.18);

    transform:
        translateX(105%);

    visibility: hidden;

    transition:
        transform .45s
        cubic-bezier(.22,.61,.36,1),
        visibility .45s ease;

    overflow:
        hidden;

}


/* OPEN DRAWER */

.sst-quick-drawer.active {

    transform:
        translateX(0);

    visibility:
        visible;

}


/* =========================================================
   TOP DECORATIVE LINE
========================================================= */

.sst-quick-drawer::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    height: 5px;

    background:

        linear-gradient(
            90deg,
            #741a1c,
            #a52a26 45%,
            #b88938 75%,
            #ead49e
        );

}


/* =========================================================
   SOFT BACKGROUND GLOW
========================================================= */

.sst-quick-drawer::after {

    content: "";

    position: absolute;

    width: 280px;

    height: 280px;

    top: -150px;

    right: -120px;

    border-radius: 50%;

    background:

        radial-gradient(
            circle,
            rgba(216,183,101,.18),
            transparent 70%
        );

    pointer-events: none;

}


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

.sst-quick-drawer-head {

    position: relative;

    z-index: 2;

    display: flex;

    justify-content: space-between;

    gap: 20px;

    padding:
        42px 30px 23px;

    border-bottom:
        1px solid
        rgba(120,100,80,.11);

}


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

.sst-quick-drawer-heading {

    min-width: 0;

}


.sst-drawer-mini-line {

    display: block;

    width: 30px;

    height: 2px;

    margin-bottom: 11px;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            #8d302b,
            #c19a50
        );

}


.sst-drawer-label {

    display: block;

    color: #9a7d55;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 2.4px;

}


.sst-quick-drawer-heading h2 {

    margin:
        6px 0 6px;

    color: #302725;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size: 34px;

    font-weight: 600;

    line-height: 1.1;

}


.sst-quick-drawer-heading p {

    max-width: 330px;

    margin: 0;

    color: #77716d;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 11px;

    line-height: 1.6;

}


/* =========================================================
   CLOSE BUTTON
========================================================= */

.sst-quick-close {

    width: 42px;

    height: 42px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid
        rgba(134,31,31,.14);

    border-radius: 13px;

    color: #7f2927;

    background:
        rgba(255,255,255,.75);

    cursor: pointer;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease;

}


.sst-quick-close:hover {

    color: #ffffff;

    background:
        #8d302b;

    transform:
        rotate(90deg);

}


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

.sst-quick-content {

    position: relative;

    z-index: 2;

    flex: 1;

    overflow-y: auto;

    padding:
        20px 22px 25px;

}


/* custom scrollbar */

.sst-quick-content::-webkit-scrollbar {

    width: 5px;

}


.sst-quick-content::-webkit-scrollbar-track {

    background:
        transparent;

}


.sst-quick-content::-webkit-scrollbar-thumb {

    background:
        #dbc9a8;

    border-radius:
        20px;

}


/* =========================================================
   SECTION TITLE
========================================================= */

.sst-quick-section-title {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin:
        0 5px 11px;

    color: #90764f;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 2px;

}


.sst-quick-section-title i {

    color: #b18b46;

    font-size: 9px;

}


/* =========================================================
   INSTITUTION CARD
========================================================= */

.sst-quick-institution {

    position: relative;

    display: flex;

    align-items: center;

    gap: 12px;

    width: 100%;

    min-height: 72px;

    margin-bottom: 8px;

    padding:
        10px 12px;

    color: #352e2a !important;

    text-decoration: none !important;

    border:
        1px solid
        rgba(140,110,70,.12);

    border-radius: 16px;

    background:
        rgba(255,255,255,.78);

    box-shadow:
        0 5px 18px
        rgba(70,45,25,.035);

    transition:
        transform .25s ease,
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;

}


/* LEFT GOLD LINE */

.sst-quick-institution::before {

    content: "";

    position: absolute;

    left: 0;

    top: 15px;

    bottom: 15px;

    width: 3px;

    border-radius:
        0 5px 5px 0;

    background:
        linear-gradient(
            180deg,
            #a52a26,
            #c39a52
        );

    opacity: 0;

    transition:
        opacity .25s ease;

}


/* HOVER */

.sst-quick-institution:hover {

    color: #8d302b !important;

    transform:
        translateX(-4px);

    border-color:
        rgba(184,137,56,.28);

    background:
        rgba(255,253,248,.98);

    box-shadow:
        0 10px 25px
        rgba(70,45,25,.08);

}


.sst-quick-institution:hover::before {

    opacity: 1;

}


/* =========================================================
   INSTITUTION ICON
========================================================= */

.sst-quick-inst-icon {

    width: 43px;

    height: 43px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    font-size: 15px;

    transition:
        transform .25s ease;

}


.sst-quick-institution:hover
.sst-quick-inst-icon {

    transform:
        scale(1.06);

}


/* individual icon backgrounds */

.sst-quick-inst-icon.medical {

    color: #8e302b;

    background:
        linear-gradient(
            145deg,
            #fff0ed,
            #f8ddd8
        );

}


.sst-quick-inst-icon.dental {

    color: #7a5b2e;

    background:
        linear-gradient(
            145deg,
            #fff8e8,
            #f1e5c9
        );

}


.sst-quick-inst-icon.nursing {

    color: #795a31;

    background:
        linear-gradient(
            145deg,
            #fff8eb,
            #f3e6cd
        );

}


.sst-quick-inst-icon.allied {

    color: #8c4237;

    background:
        linear-gradient(
            145deg,
            #fff0ec,
            #f3ddd6
        );

}


.sst-quick-inst-icon.physio {

    color: #65714d;

    background:
        linear-gradient(
            145deg,
            #f4f7ed,
            #e4ebd5
        );

}


.sst-quick-inst-icon.hospital {

    color: #8b302b;

    background:
        linear-gradient(
            145deg,
            #fff0ed,
            #f3d9d5
        );

}


/* =========================================================
   INSTITUTION TEXT
========================================================= */

.sst-quick-inst-info {

    flex:
        1;

    min-width:
        0;

}


.sst-quick-inst-info strong {

    display: block;

    color: #37312d;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 11px;

    font-weight: 700;

    line-height: 1.35;

}


.sst-quick-inst-info small {

    display: block;

    margin-top: 3px;

    color: #8b8580;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8.5px;

    line-height: 1.4;

}


/* =========================================================
   RIGHT ARROW
========================================================= */

.sst-quick-inst-arrow {

    width: 28px;

    height: 28px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color: #a27b42;

    background:
        #fbf5e9;

    font-size: 9px;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease;

}


.sst-quick-institution:hover
.sst-quick-inst-arrow {

    color: #ffffff;

    background:
        #96342e;

    transform:
        translateX(3px);

}


/* =========================================================
   HEALTHCARE TITLE
========================================================= */

.sst-health-title {

    margin-top:
        23px;

}


/* =========================================================
   FOOTER
========================================================= */

.sst-quick-drawer-footer {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 12px;

    padding:
        17px 24px;

    border-top:
        1px solid
        rgba(120,100,80,.11);

    background:
        rgba(255,255,255,.65);

}


.sst-drawer-footer-mark {

    width: 38px;

    height: 38px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #861f1f,
            #b88938
        );

    font-size: 14px;

}


.sst-quick-drawer-footer strong {

    display: block;

    color: #3d3632;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 10px;

    font-weight: 800;

}


.sst-quick-drawer-footer span {

    display: block;

    margin-top: 2px;

    color: #8b8580;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

}


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

@media (max-width: 600px) {

    .sst-quick-drawer {

        width:
            min(
                92vw,
                390px
            );

    }


    .sst-quick-drawer-head {

        padding:
            34px 21px 19px;

    }


    .sst-quick-drawer-heading h2 {

        font-size:
            29px;

    }


    .sst-quick-drawer-heading p {

        font-size:
            10px;

    }


    .sst-quick-close {

        width:
            38px;

        height:
            38px;

    }


    .sst-quick-content {

        padding:
            17px 14px 20px;

    }


    .sst-quick-institution {

        min-height:
            68px;

        padding:
            9px;

        gap:
            9px;

        border-radius:
            14px;

    }


    .sst-quick-inst-icon {

        width:
            39px;

        height:
            39px;

        border-radius:
            11px;

        font-size:
            13px;

    }


    .sst-quick-inst-info strong {

        font-size:
            9.5px;

    }


    .sst-quick-inst-info small {

        font-size:
            7.5px;

    }


    .sst-quick-inst-arrow {

        width:
            25px;

        height:
            25px;

        font-size:
            8px;

    }


    .sst-quick-drawer-footer {

        padding:
            14px 17px;

    }

}


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

@media (max-width: 380px) {

    .sst-quick-drawer {

        width:
            94vw;

    }


    .sst-quick-inst-info strong {

        font-size:
            9px;

    }


    .sst-quick-inst-info small {

        font-size:
            7px;

    }

}




   
     
  
     /* =========================================================
   TADIKELA SUBBAIAH TRUST
   PREMIUM TRUST HERO
   COMPLETE RESPONSIVE CSS
========================================================= */


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

.sst-hero {

    position: relative;

    width: 100%;

    min-height: calc(100vh - 90px);

    overflow: hidden;

    background: #f8fafc;

}


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

.sst-hero-image {

    position: absolute;

    inset: 0;

    z-index: 1;

    overflow: hidden;

}


.sst-hero-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center center;

}


/* =========================================================
   SOFT WHITE SMOKE / IMAGE FADE
========================================================= */

.sst-hero-white-fade {

    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:

        linear-gradient(
            90deg,

            rgba(255,255,255,.99) 0%,

            rgba(255,255,255,.98) 14%,

            rgba(255,255,255,.94) 26%,

            rgba(250,252,253,.82) 39%,

            rgba(247,250,252,.58) 50%,

            rgba(255,255,255,.20) 66%,

            rgba(255,255,255,.04) 82%,

            rgba(255,255,255,0) 100%
        );

}


/* =========================================================
   BOTTOM IMAGE WHITE FADE
========================================================= */

.sst-hero::after {

    content: "";

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    height: 155px;

    z-index: 3;

    pointer-events: none;

    background:

        linear-gradient(
            to top,

            rgba(255,255,255,.99) 0%,

            rgba(255,255,255,.85) 28%,

            rgba(255,255,255,.48) 58%,

            rgba(255,255,255,0) 100%
        );

}


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

.sst-hero-content {

    position: relative;

    z-index: 6;

    width:
        min(
            610px,
            calc(100% - 60px)
        );

    margin-left:
        max(
            5vw,
            calc((100% - 1280px) / 2)
        );

    margin-top: 52px;

    margin-bottom: 145px;

    padding:
        30px 36px 27px;

    border-radius: 26px;

    background:

        linear-gradient(
            135deg,

            rgba(255,255,255,.94),

            rgba(247,250,253,.82)
        );

    border:
        1px solid
        rgba(255,255,255,.96);

    box-shadow:

        0 22px 60px
        rgba(40,55,70,.10),

        inset 0 1px 0
        rgba(255,255,255,.95);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

}


/* =========================================================
   GLASS TOP GOLD DETAIL
========================================================= */

.sst-hero-content::before {

    content: "";

    position: absolute;

    top: 0;

    left: 40px;

    width: 135px;

    height: 2px;

    border-radius: 10px;

    background:

        linear-gradient(
            90deg,

            transparent,

            #c8a65d,

            transparent
        );

    opacity: .85;

}


.sst-hero-content-inner {

    position: relative;

    z-index: 2;

}


/* =========================================================
   EYEBROW
========================================================= */

.sst-hero-eyebrow {

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 17px;

    color: #806f5e;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;

    line-height: 1;

}


.sst-hero-eyebrow span {

    width: 30px;

    height: 1px;

    flex-shrink: 0;

    background: #c6a45b;

}


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

.sst-hero-content h1 {

    margin: 0;

    padding: 0;

    color: #302b27;

    font-family:
        "Playfair Display",
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            48px,
            5vw,
            72px
        );

    font-weight: 600;

    line-height: 1.01;

    letter-spacing: -2px;

}


.sst-hero-content h1 span {

    display: block;

    color: #913a31;

}


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

.sst-hero-content p {

    max-width: 555px;

    margin:
        21px 0 24px;

    padding: 0;

    color: #5d666d;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.75;

}


/* =========================================================
   HERO BUTTON WRAPPER
========================================================= */

.sst-hero-buttons {

    display: flex;

    align-items: center;

    justify-content: flex-start;

    gap: 11px;

    width: 100%;

    margin: 0;

    padding: 0;

    flex-wrap: wrap;

}


/* =========================================================
   BOTH BUTTONS
========================================================= */

.sst-hero-primary,
.sst-hero-secondary {

    min-height: 48px;

    padding:
        0 19px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border-radius: 50px;

    text-decoration: none !important;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 11px;

    font-weight: 700;

    line-height: 1;

    white-space: nowrap;

    cursor: pointer;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease,
        color .25s ease,
        border-color .25s ease;

}


/* =========================================================
   PRIMARY BUTTON
========================================================= */

.sst-hero-primary {

    color: #ffffff !important;

    background:

        linear-gradient(
            135deg,

            #8d332c,

            #aa473d
        );

    border:
        1px solid
        rgba(130,45,38,.20);

    box-shadow:

        0 9px 22px
        rgba(130,50,40,.18);

}


.sst-hero-primary:hover {

    color: #ffffff !important;

    background:

        linear-gradient(
            135deg,

            #7f2d27,

            #9f3e35
        );

    transform:
        translateY(-2px);

    box-shadow:

        0 13px 28px
        rgba(130,50,40,.25);

}


.sst-hero-primary i {

    color: #f2d99b;

    font-size: 10px;

    transition:
        transform .25s ease;

}


.sst-hero-primary:hover i {

    transform:
        translateX(4px);

}


/* =========================================================
   SECONDARY BUTTON
========================================================= */

.sst-hero-secondary {

    color: #67594d !important;

    background:
        rgba(255,255,255,.84);

    border:
        1px solid
        #dbcaa9;

    box-shadow:
        0 4px 15px
        rgba(80,65,50,.04);

}


.sst-hero-secondary:hover {

    color: #8d352e !important;

    background:
        rgba(255,255,255,.98);

    border-color:
        #cdb47e;

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 20px
        rgba(80,65,50,.08);

}


.sst-hero-secondary i {

    color: #a68142;

    font-size: 9px;

    transition:
        transform .25s ease;

}


.sst-hero-secondary:hover i {

    transform:
        translateY(3px);

}


/* =========================================================
   THREE CORE AREA ITEMS
========================================================= */

.sst-hero-mini-info {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 0;

    margin-top: 22px;

    padding-top: 16px;

    border-top:
        1px solid
        rgba(110,100,90,.15);

}


/* individual item */

.sst-hero-mini-info div {

    min-width: 0;

    flex: 1;

    display: flex;

    align-items: center;

    gap: 8px;

    padding:
        0 18px;

    color: #596066;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 9px;

    font-weight: 600;

    line-height: 1.25;

    white-space: nowrap;

}


/* first item */

.sst-hero-mini-info div:first-child {

    padding-left: 0;

}


/* vertical divider */

.sst-hero-mini-info div + div {

    border-left:
        1px solid
        rgba(120,110,100,.14);

}


/* icon box */

.sst-hero-mini-info i {

    width: 28px;

    height: 28px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    color: #a17a3e;

    background:

        linear-gradient(
            145deg,

            #fffdf8,

            #f3eadb
        );

    border:
        1px solid
        #eadcc4;

    font-size: 11px;

    transition:
        transform .25s ease,
        color .25s ease,
        background .25s ease;

}


/* icon hover */

.sst-hero-mini-info div:hover i {

    color: #913a31;

    transform:
        translateY(-2px);

}


/* =========================================================
   RIGHT TRUST CARD
========================================================= */

.sst-hero-trust-card {

    position: absolute;

    z-index: 7;

    right:
        max(
            5vw,
            calc((100% - 1280px) / 2)
        );

    top: 43%;

    width: 270px;

    padding: 25px;

    border-radius: 23px;

    background:

        linear-gradient(
            145deg,

            rgba(255,255,255,.91),

            rgba(242,247,250,.79)
        );

    border:
        1px solid
        rgba(255,255,255,.97);

    box-shadow:

        0 24px 60px
        rgba(45,60,75,.13);

    backdrop-filter:
        blur(20px);

    -webkit-backdrop-filter:
        blur(20px);

}


/* =========================================================
   TRUST CARD MARK
========================================================= */

.sst-trust-card-mark {

    width: 43px;

    height: 43px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    color: #ffffff;

    background:

        linear-gradient(
            135deg,

            #984438,

            #b38a49
        );

    box-shadow:

        0 8px 20px
        rgba(120,70,40,.17);

}


.sst-trust-card-mark i {

    font-size: 16px;

}


/* =========================================================
   TRUST LABEL
========================================================= */

.sst-trust-card-label {

    margin-top: 17px;

    color: #967e59;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 2px;

    line-height: 1;

}


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

.sst-hero-trust-card h2 {

    margin:
        9px 0 12px;

    padding: 0;

    color: #37312d;

    font-family:
        "Playfair Display",
        Georgia,
        "Times New Roman",
        serif;

    font-size: 28px;

    font-weight: 600;

    line-height: 1.13;

}


.sst-hero-trust-card h2 span {

    color: #913a31;

}


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

.sst-hero-trust-card p {

    margin: 0;

    padding: 0;

    color: #737a7e;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 11px;

    font-weight: 400;

    line-height: 1.75;

}


/* =========================================================
   TRUST FOOTER
========================================================= */

.sst-trust-card-footer {

    display: flex;

    align-items: center;

    gap: 8px;

    margin-top: 19px;

    padding-top: 13px;

    border-top:
        1px solid
        rgba(120,110,100,.14);

}


.sst-trust-card-footer span {

    width: 20px;

    height: 2px;

    flex-shrink: 0;

    background: #b18b46;

}


.sst-trust-card-footer strong {

    color: #7b7771;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

    font-weight: 600;

}


/* =========================================================
   BOTTOM ECOSYSTEM CONTAINER
========================================================= */

.sst-hero-bottom {

    position: absolute;

    z-index: 9;

    left: 0;

    right: 0;

    bottom: 0;

    width: 100%;

    padding:
        0 35px 17px;

}


/* =========================================================
   ECOSYSTEM BAR
========================================================= */

.sst-ecosystem {

    width:
        min(
            1220px,
            100%
        );

    min-height: 80px;

    margin:
        0 auto;

    display: flex;

    align-items: center;

    padding:
        8px 13px;

    border:
        1px solid
        rgba(180,160,125,.25);

    border-radius: 20px;

    background:

        linear-gradient(
            135deg,

            rgba(255,255,255,.96),

            rgba(247,250,252,.91)
        );

    box-shadow:

        0 18px 45px
        rgba(55,65,75,.11);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

}


/* =========================================================
   ECOSYSTEM ITEM
========================================================= */

.sst-ecosystem-item {

    flex: 1;

    min-width: 0;

    display: flex;

    align-items: center;

    gap: 10px;

    padding:
        10px 16px;

    color: #36322e !important;

    text-decoration: none !important;

    transition:
        transform .25s ease,
        color .25s ease;

}


.sst-ecosystem-item:hover {

    color: #8d382f !important;

    transform:
        translateY(-2px);

}


/* =========================================================
   ECOSYSTEM ICON
========================================================= */

.sst-ecosystem-icon {

    width: 40px;

    height: 40px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    color: #9b783f;

    background:

        linear-gradient(
            145deg,

            #ffffff,

            #f1f6f9
        );

    border:
        1px solid
        #e4ddd0;

    transition:
        transform .25s ease,
        color .25s ease,
        border-color .25s ease;

}


.sst-ecosystem-item:hover
.sst-ecosystem-icon {

    color: #8d382f;

    border-color:
        #d9c39a;

    transform:
        translateY(-2px);

}


/* =========================================================
   ECOSYSTEM TEXT
========================================================= */

.sst-ecosystem-text {

    min-width: 0;

    flex: 1;

}


.sst-ecosystem-text strong {

    display: block;

    margin: 0;

    padding: 0;

    color: #403a35;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    line-height: 1.25;

    white-space: nowrap;

}


.sst-ecosystem-text span {

    display: block;

    margin-top: 3px;

    color: #85817c;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

    line-height: 1.2;

    white-space: nowrap;

}


/* =========================================================
   ECOSYSTEM ARROW
========================================================= */

.sst-ecosystem-arrow {

    margin-left: auto;

    flex-shrink: 0;

    color: #b18b46;

    font-size: 9px;

    opacity: .75;

    transition:
        transform .25s ease;

}


.sst-ecosystem-item:hover
.sst-ecosystem-arrow {

    transform:
        translateX(4px);

}


/* =========================================================
   ECOSYSTEM DIVIDER
========================================================= */

.sst-ecosystem-divider {

    width: 1px;

    height: 40px;

    flex-shrink: 0;

    background:
        #e8e1d6;

}


/* =========================================================
   SCROLL INDICATOR
========================================================= */

.sst-hero-scroll {

    position: absolute;

    right: 25px;

    bottom: -43px;

    display: flex;

    align-items: center;

    gap: 8px;

    color: #746c65 !important;

    text-decoration: none !important;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.4px;

    text-transform: uppercase;

}


.sst-hero-scroll i {

    width: 31px;

    height: 31px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid
        #d6c5a5;

    border-radius: 50%;

    color: #8e392f;

}


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

@media (max-width: 1100px) {

    .sst-hero-content {

        width: 550px;

        margin-left: 4vw;

    }


    .sst-hero-trust-card {

        right: 3vw;

        width: 225px;

        padding: 20px;

    }


    .sst-hero-mini-info div {

        padding:
            0 10px;

        font-size: 8px;

    }


    .sst-hero-mini-info i {

        width: 26px;

        height: 26px;

    }


    .sst-ecosystem {

        width:
            calc(100% - 10px);

    }


    .sst-ecosystem-item {

        padding:
            9px 10px;

    }


    .sst-ecosystem-text span {

        display: none;

    }

}


/* =========================================================
   TABLET / SMALL LAPTOP
========================================================= */

@media (max-width: 950px) {

    .sst-hero-content {

        width:
            520px;

    }


    .sst-hero-content h1 {

        font-size:
            54px;

    }


    .sst-hero-trust-card {

        width:
            205px;

    }


    .sst-hero-trust-card h2 {

        font-size:
            24px;

    }

}


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

@media (max-width: 800px) {

    .sst-hero {

        min-height:
            800px;

    }


    /* -----------------------------------------------------
       MOBILE CAMPUS IMAGE
    ----------------------------------------------------- */

    .sst-hero-image img {

        object-position:
            64% center;

    }


    /* -----------------------------------------------------
       MOBILE WHITE FADE
    ----------------------------------------------------- */

     .sst-hero-white-fade {

        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.97) 0%,
                rgba(255,255,255,.91) 22%,
                rgba(255,255,255,.68) 38%,
                rgba(255,255,255,.30) 53%,
                rgba(255,255,255,.08) 68%,
                rgba(255,255,255,0) 78%
            );

    }
 


    /* -----------------------------------------------------
       HERO CONTENT
    ----------------------------------------------------- */

    .sst-hero-content {

        width:
            calc(100% - 26px);

        margin:
            20px 13px 0;

        margin-bottom:
            155px;

        padding:
            25px 20px 21px;

        border-radius:
            22px;

        background:

            linear-gradient(
                145deg,

                rgba(255,255,255,.94),

                rgba(243,248,252,.84)
            );

        box-shadow:

            0 18px 45px
            rgba(45,65,85,.10);

        backdrop-filter:
            blur(17px);

        -webkit-backdrop-filter:
            blur(17px);

    }


    /* -----------------------------------------------------
       EYEBROW
    ----------------------------------------------------- */

    .sst-hero-eyebrow {

        gap:
            8px;

        margin-bottom:
            14px;

        font-size:
            8px;

        letter-spacing:
            2px;

    }


    .sst-hero-eyebrow span {

        width:
            20px;

    }


    /* -----------------------------------------------------
       HEADING
    ----------------------------------------------------- */

    .sst-hero-content h1 {

        font-size:
            41px;

        line-height:
            1.04;

        letter-spacing:
            -1px;

    }


    /* -----------------------------------------------------
       DESCRIPTION
    ----------------------------------------------------- */

    .sst-hero-content p {

        max-width:
            100%;

        margin:
            17px 0 21px;

        font-size:
            12.5px;

        line-height:
            1.7;

    }


    /* -----------------------------------------------------
       MOBILE BUTTONS
    ----------------------------------------------------- */

    .sst-hero-buttons {

        display:
            flex;

        width:
            100%;

        gap:
            8px;

        flex-wrap:
            nowrap;

    }


    .sst-hero-primary,
    .sst-hero-secondary {

        flex:
            1;

        min-width:
            0;

        min-height:
            44px;

        padding:
            0 10px;

        gap:
            6px;

        font-size:
            9px;

    }


    .sst-hero-primary i,
    .sst-hero-secondary i {

        font-size:
            8px;

    }


    /* -----------------------------------------------------
       THREE CORE AREAS
    ----------------------------------------------------- */

    .sst-hero-mini-info {

        margin-top:
            19px;

        padding-top:
            14px;

        justify-content:
            space-between;

    }


    .sst-hero-mini-info div {

        flex:
            1;

        padding:
            0 5px;

        justify-content:
            center;

        gap:
            5px;

        font-size:
            7px;

        line-height:
            1.2;

        white-space:
            normal;

        text-align:
            center;

    }


    .sst-hero-mini-info div:first-child {

        padding-left:
            0;

    }


    .sst-hero-mini-info i {

        width:
            27px;

        height:
            27px;

        border-radius:
            8px;

        font-size:
            10px;

    }


    /* -----------------------------------------------------
       RIGHT TRUST CARD HIDDEN ON MOBILE
    ----------------------------------------------------- */

    .sst-hero-trust-card {

        display:
            none;

    }


    /* -----------------------------------------------------
       BOTTOM ECOSYSTEM
    ----------------------------------------------------- */

    .sst-hero-bottom {

        padding:
            0 10px 10px;

    }


    .sst-ecosystem {

        display:
            grid;

        grid-template-columns:
            1fr 1fr;

        width:
            100%;

        min-height:
            auto;

        padding:
            5px;

        border-radius:
            17px;

    }


    .sst-ecosystem-item {

        flex:
            none;

        min-height:
            61px;

        padding:
            7px;

        gap:
            7px;

    }


    .sst-ecosystem-divider {

        display:
            none;

    }


    .sst-ecosystem-icon {

        width:
            32px;

        height:
            32px;

        border-radius:
            9px;

        font-size:
            10px;

    }


    .sst-ecosystem-text {

        flex:
            1;

    }


    .sst-ecosystem-text strong {

        font-size:
            8px;

        line-height:
            1.2;

        white-space:
            normal;

    }


    .sst-ecosystem-text span {

        display:
            block;

        margin-top:
            2px;

        font-size:
            6.5px;

        line-height:
            1.2;

        white-space:
            normal;

    }


    .sst-ecosystem-arrow {

        display:
            none;

    }


    /* -----------------------------------------------------
       SCROLL INDICATOR
    ----------------------------------------------------- */

    .sst-hero-scroll {

        display:
            none;

    }

}


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

@media (max-width: 500px) {

    .sst-hero {

        min-height:
            790px;

    }


    .sst-hero-content {

        width:
            calc(100% - 20px);

        margin:
            16px 10px 0;

        margin-bottom:
            145px;

        padding:
            22px 16px 19px;

        border-radius:
            20px;

    }


    .sst-hero-content h1 {

        font-size:
            36px;

        line-height:
            1.04;

    }


    .sst-hero-content p {

        font-size:
            11.5px;

        line-height:
            1.68;

    }


    /* buttons */

    .sst-hero-buttons {

        gap:
            6px;

    }


    .sst-hero-primary,
    .sst-hero-secondary {

        min-height:
            42px;

        padding:
            0 8px;

        font-size:
            8px;

    }


    /* three small icons */

    .sst-hero-mini-info {

        margin-top:
            17px;

    }


    .sst-hero-mini-info div {

        font-size:
            6.5px;

        gap:
            4px;

    }


    .sst-hero-mini-info i {

        width:
            25px;

        height:
            25px;

        font-size:
            9px;

    }


    /* bottom cards */

    .sst-ecosystem-item {

        min-height:
            57px;

        padding:
            6px;

    }


    .sst-ecosystem-icon {

        width:
            29px;

        height:
            29px;

        border-radius:
            8px;

        font-size:
            9px;

    }


    .sst-ecosystem-text strong {

        font-size:
            7.5px;

    }


    .sst-ecosystem-text span {

        font-size:
            6px;

    }

}


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

@media (max-width: 380px) {

    .sst-hero {

        min-height:
            770px;

    }


    .sst-hero-content {

        padding:
            20px 14px 17px;

    }


    .sst-hero-content h1 {

        font-size:
            33px;

    }


    .sst-hero-content p {

        font-size:
            11px;

    }


    .sst-hero-primary,
    .sst-hero-secondary {

        min-height:
            40px;

        padding:
            0 6px;

        font-size:
            7.5px;

    }


    .sst-hero-mini-info div {

        font-size:
            6px;

    }


    .sst-hero-mini-info i {

        width:
            23px;

        height:
            23px;

        font-size:
            8px;

    }


    .sst-ecosystem-item {

        min-height:
            55px;

    }


    .sst-ecosystem-icon {

        width:
            27px;

        height:
            27px;

        font-size:
            8px;

    }


    .sst-ecosystem-text strong {

        font-size:
            7px;

    }


    .sst-ecosystem-text span {

        font-size:
            5.5px;

    }

}


/* =========================================================
   WOW.JS COMPATIBILITY
========================================================= */

.wow {

    visibility:
        hidden;

}


.animated {

    visibility:
        visible;

}


/* =========================================================
   REDUCE MOTION
========================================================= */

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

    .wow {

        animation:
            none !important;

        visibility:
            visible !important;

    }

}
     
 /* =========================================================
   TADIKELA SUBBAIAH TRUST
   ABOUT SECTION — PREMIUM RESPONSIVE UI/UX
========================================================= */

.sst-about {
    --about-maroon: #861f1f;
    --about-dark: #421014;
    --about-red: #a52a26;
    --about-gold: #b88938;
    --about-light-gold: #d8b765;
    --about-soft-gold: #ead49e;
    --about-cream: #fffaf1;
    --about-white: #ffffff;
    --about-text: #27201e;
    --about-muted: #706762;

    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 120px 0 110px;
    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(184, 137, 56, 0.10),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 80%,
            rgba(134, 31, 31, 0.07),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #fffdf9 0%,
            #fffaf1 52%,
            #ffffff 100%
        );
}


/* =========================================================
   BACKGROUND SHAPES
========================================================= */

.sst-about-bg-shape {
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
    filter: blur(1px);
}

.sst-about-shape-one {
    width: 420px;
    height: 420px;
    top: -220px;
    left: -180px;
    border: 1px solid rgba(184, 137, 56, 0.16);
}

.sst-about-shape-two {
    width: 520px;
    height: 520px;
    right: -300px;
    bottom: -260px;
    border: 1px solid rgba(134, 31, 31, 0.10);
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-about-container {
    position: relative;
    z-index: 2;
    width: min(1240px, calc(100% - 40px));
    margin: 0 auto;
}


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

.sst-about-intro {
    max-width: 850px;
    margin: 0 auto 65px;
    text-align: center;
}

.sst-about-kicker {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    margin-bottom: 17px;

    color: var(--about-gold);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2.8px;
}

.sst-about-kicker span {
    width: 34px;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--about-gold)
    );
}

.sst-about-kicker span:last-child {
    background: linear-gradient(
        90deg,
        var(--about-gold),
        transparent
    );
}

.sst-about-intro h2 {
    margin: 0;

    color: var(--about-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 4vw, 58px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -1.4px;
}

.sst-about-intro h2 em {
    display: block;

    color: var(--about-maroon);
    font-style: normal;
}

.sst-about-intro-text {
    max-width: 690px;
    margin: 23px auto 0;

    color: var(--about-muted);
    font-family: "DM Sans", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.8;
}


/* =========================================================
   MAIN ABOUT GRID
========================================================= */

.sst-about-main {
    display: grid;
    grid-template-columns: 1fr 0.92fr;
    gap: 65px;
    align-items: center;
}


/* =========================================================
   STORY
========================================================= */

.sst-about-story {
    position: relative;
}

.sst-about-story-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 22px;

    color: var(--about-maroon);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.sst-about-story-label i {
    width: 34px;
    height: 34px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--about-white);
    background: linear-gradient(
        145deg,
        var(--about-maroon),
        var(--about-dark)
    );

    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(134, 31, 31, 0.18);
}

.sst-about-story h3 {
    margin: 0 0 23px;

    color: var(--about-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(32px, 3vw, 46px);
    font-weight: 500;
    line-height: 1.12;
}

.sst-about-story h3 span {
    color: var(--about-gold);
    font-size: 0.55em;
    vertical-align: top;
}

.sst-about-story p {
    margin: 0 0 17px;

    color: var(--about-muted);
    font-family: "DM Sans", Arial, sans-serif;
    font-size: 15.5px;
    line-height: 1.85;
}

.sst-about-story p strong {
    color: var(--about-text);
    font-weight: 700;
}


/* =========================================================
   FOUNDER CARD
========================================================= */

.sst-founder-card {
    display: flex;
    align-items: center;
    gap: 17px;

    margin-top: 30px;
    padding: 19px 21px;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.96),
            rgba(255,250,241,0.90)
        );

    border: 1px solid rgba(184, 137, 56, 0.25);
    border-radius: 18px;

    box-shadow:
        0 18px 40px rgba(65, 25, 15, 0.07),
        inset 0 1px 0 rgba(255,255,255,0.9);
}

.sst-founder-icon {
    flex: 0 0 52px;

    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--about-white);

    background:
        linear-gradient(
            145deg,
            var(--about-maroon),
            var(--about-dark)
        );

    border-radius: 15px;

    box-shadow:
        0 10px 25px rgba(134, 31, 31, 0.20);
}

.sst-founder-icon i {
    font-size: 19px;
}

.sst-founder-content {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sst-founder-content span {
    color: var(--about-gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.sst-founder-content strong {
    color: var(--about-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
}

.sst-founder-content small {
    color: var(--about-muted);
    font-size: 12px;
}


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

.sst-about-visual {
    position: relative;
}

.sst-about-image-wrap {
    position: relative;
    height: 430px;
    overflow: hidden;

    border-radius: 28px;

    border: 7px solid rgba(255,255,255,0.9);

    box-shadow:
        0 30px 70px rgba(66, 16, 20, 0.16),
        0 4px 15px rgba(0,0,0,0.05);
}

.sst-about-image-wrap::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;

    border: 1px solid rgba(184, 137, 56, 0.35);
    border-radius: 21px;
}

.sst-about-image-wrap img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: center;

    transition: transform 0.8s ease;
}

.sst-about-image-wrap:hover img {
    transform: scale(1.045);
}

.sst-about-image-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            180deg,
            transparent 38%,
            rgba(35, 10, 10, 0.12) 58%,
            rgba(35, 10, 10, 0.82) 100%
        );
}

.sst-about-image-caption {
    position: absolute;
    z-index: 3;
    left: 30px;
    right: 30px;
    bottom: 27px;

    display: flex;
    flex-direction: column;
}

.sst-about-image-caption span {
    color: var(--about-soft-gold);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
}

.sst-about-image-caption strong {
    margin-top: 2px;

    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 40px;
    line-height: 1;
}

.sst-about-image-caption small {
    margin-top: 7px;

    color: rgba(255,255,255,0.78);
    font-size: 12px;
}


/* =========================================================
   STATS
========================================================= */

.sst-about-stats {
    position: relative;
    z-index: 5;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;

    margin: -55px 20px 0;
}

.sst-about-stat {
    min-height: 83px;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 13px 15px;

    background:
        rgba(255,255,255,0.96);

    border: 1px solid rgba(184, 137, 56, 0.20);
    border-radius: 15px;

    box-shadow:
        0 12px 28px rgba(54, 22, 14, 0.09);

    backdrop-filter: blur(15px);
}

.sst-stat-icon {
    flex: 0 0 38px;

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--about-maroon);
    background: var(--about-cream);

    border: 1px solid rgba(184, 137, 56, 0.22);
    border-radius: 11px;
}

.sst-stat-icon i {
    font-size: 14px;
}

.sst-about-stat strong {
    display: block;

    color: var(--about-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    line-height: 1.1;
}

.sst-about-stat span {
    display: block;

    margin-top: 4px;

    color: var(--about-muted);
    font-size: 10px;
    line-height: 1.3;
}


/* =========================================================
   LOWER GRID
========================================================= */

.sst-about-lower {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 24px;

    margin-top: 75px;
}


/* =========================================================
   COMMON LOWER BOX
========================================================= */

.sst-governance,
.sst-institution-box {
    position: relative;

    padding: 32px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.97),
            rgba(255,250,241,0.92)
        );

    border: 1px solid rgba(184, 137, 56, 0.20);
    border-radius: 24px;

    box-shadow:
        0 18px 45px rgba(61, 24, 15, 0.06);
}

.sst-governance::before,
.sst-institution-box::before {
    content: "";

    position: absolute;
    top: 0;
    left: 32px;

    width: 70px;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            var(--about-maroon),
            var(--about-gold)
        );

    border-radius: 0 0 10px 10px;
}


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

.sst-lower-heading {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 19px;
}

.sst-lower-icon {
    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 46px;

    color: var(--about-white);

    background:
        linear-gradient(
            145deg,
            var(--about-maroon),
            var(--about-dark)
        );

    border-radius: 13px;

    box-shadow:
        0 10px 22px rgba(134,31,31,0.17);
}

.sst-lower-heading span {
    display: block;

    margin-bottom: 3px;

    color: var(--about-gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.sst-lower-heading h3 {
    margin: 0;

    color: var(--about-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 24px;
    font-weight: 500;
}

.sst-governance > p,
.sst-institution-box > p {
    margin: 0 0 23px;

    color: var(--about-muted);
    font-size: 13.5px;
    line-height: 1.75;
}


/* =========================================================
   TRUSTEES
========================================================= */

.sst-trustees {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.sst-trustee {
    display: flex;
    align-items: center;
    gap: 11px;

    padding: 13px;

    background: rgba(255,255,255,0.72);

    border: 1px solid rgba(184,137,56,0.14);
    border-radius: 13px;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.sst-trustee:hover {
    transform: translateY(-3px);

    border-color: rgba(184,137,56,0.35);

    box-shadow:
        0 10px 22px rgba(70,30,20,0.07);
}

.sst-trustee-number {
    width: 31px;
    height: 31px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 31px;

    color: var(--about-maroon);
    background: var(--about-cream);

    border-radius: 9px;

    font-size: 9px;
    font-weight: 800;
}

.sst-trustee strong {
    display: block;

    color: var(--about-text);
    font-size: 13px;
}

.sst-trustee span {
    display: block;

    margin-top: 2px;

    color: var(--about-gold);
    font-size: 10px;
    font-weight: 700;
}


/* =========================================================
   INSTITUTION LIST
========================================================= */

.sst-institution-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.sst-institution-item {
    display: flex;
    align-items: center;
    gap: 10px;

    min-height: 48px;
    padding: 10px 12px;

    background: rgba(255,255,255,0.70);

    border: 1px solid rgba(184,137,56,0.14);
    border-radius: 12px;
}

.sst-institution-item i {
    width: 28px;
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 28px;

    color: var(--about-maroon);
    background: var(--about-cream);

    border-radius: 8px;

    font-size: 12px;
}

.sst-institution-item span {
    color: var(--about-text);
    font-size: 11.5px;
    font-weight: 650;
    line-height: 1.35;
}


/* =========================================================
   AFFILIATION
========================================================= */

.sst-affiliation {
    display: flex;
    align-items: center;
    gap: 13px;

    margin-top: 18px;
    padding: 15px;

    background:
        linear-gradient(
            135deg,
            rgba(134,31,31,0.06),
            rgba(184,137,56,0.08)
        );

    border: 1px solid rgba(184,137,56,0.20);
    border-radius: 14px;
}

.sst-affiliation-icon {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 38px;

    color: var(--about-white);
    background: var(--about-gold);

    border-radius: 10px;
}

.sst-affiliation span {
    display: block;

    color: var(--about-gold);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.sst-affiliation strong {
    display: block;

    margin-top: 3px;

    color: var(--about-text);
    font-size: 11.5px;
    line-height: 1.4;
}

.sst-affiliation small {
    display: block;

    margin-top: 2px;

    color: var(--about-muted);
    font-size: 9.5px;
}


/* =========================================================
   CLINICAL HIGHLIGHT
========================================================= */

.sst-about-highlight {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;

    margin-top: 24px;
    padding: 30px 32px;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 80% 10%,
            rgba(216,183,101,0.20),
            transparent 35%
        ),
        linear-gradient(
            120deg,
            #421014,
            #68181b 55%,
            #861f1f
        );

    border-radius: 24px;

    box-shadow:
        0 22px 50px rgba(66,16,20,0.18);

    overflow: hidden;
}

.sst-about-highlight::after {
    content: "";

    position: absolute;
    width: 230px;
    height: 230px;

    right: -100px;
    top: -120px;

    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 50%;
}

.sst-highlight-main {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    gap: 17px;

    max-width: 650px;
}

.sst-highlight-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 58px;

    color: var(--about-dark);
    background: var(--about-soft-gold);

    border-radius: 16px;

    box-shadow:
        0 12px 28px rgba(0,0,0,0.15);
}

.sst-highlight-icon i {
    font-size: 22px;
}

.sst-highlight-text > span {
    display: block;

    margin-bottom: 5px;

    color: var(--about-soft-gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.sst-highlight-text h3 {
    margin: 0 0 7px;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 24px;
    font-weight: 500;
}

.sst-highlight-text p {
    margin: 0;

    color: rgba(255,255,255,0.74);
    font-size: 12px;
    line-height: 1.65;
}


/* =========================================================
   HIGHLIGHT POINTS
========================================================= */

.sst-highlight-points {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;

    min-width: 275px;
}

.sst-highlight-points div {
    display: flex;
    align-items: center;
    gap: 8px;

    padding: 10px 12px;

    background: rgba(255,255,255,0.07);

    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 10px;
}

.sst-highlight-points i {
    color: var(--about-soft-gold);
    font-size: 12px;
}

.sst-highlight-points span {
    color: rgba(255,255,255,0.86);
    font-size: 10px;
}


/* =========================================================
   CLOSING STATEMENT
========================================================= */

.sst-about-closing {
    display: grid;
    grid-template-columns: 62px 1fr;
    gap: 20px;
    align-items: start;

    max-width: 920px;

    margin: 65px auto 0;
}

.sst-closing-mark {
    width: 62px;
    height: 62px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--about-gold);

    background:
        linear-gradient(
            145deg,
            rgba(184,137,56,0.10),
            rgba(134,31,31,0.06)
        );

    border: 1px solid rgba(184,137,56,0.22);
    border-radius: 17px;
}

.sst-closing-mark i {
    font-size: 21px;
}

.sst-about-closing p {
    margin: 2px 0 17px;

    color: var(--about-text);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    line-height: 1.65;
}

.sst-closing-line {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sst-closing-line span {
    width: 35px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--about-maroon),
            var(--about-gold)
        );

    border-radius: 5px;
}

.sst-closing-line strong {
    color: var(--about-maroon);
    font-size: 11px;
    letter-spacing: 1px;
}


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

@media (max-width: 1050px) {

    .sst-about {
        padding: 100px 0 90px;
    }

    .sst-about-main {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .sst-about-story {
        max-width: 850px;
    }

    .sst-about-visual {
        max-width: 760px;
        width: 100%;
        margin: 0 auto;
    }

    .sst-about-lower {
        grid-template-columns: 1fr;
    }

    .sst-about-highlight {
        align-items: flex-start;
        flex-direction: column;
    }

    .sst-highlight-points {
        width: 100%;
    }
}


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

@media (max-width: 700px) {

    .sst-about {
        padding: 75px 0 70px;
    }

    .sst-about-container {
        width: min(100% - 26px, 1240px);
    }

    .sst-about-intro {
        margin-bottom: 45px;
    }

    .sst-about-kicker {
        font-size: 9px;
        letter-spacing: 2px;
    }

    .sst-about-kicker span {
        width: 22px;
    }

    .sst-about-intro h2 {
        font-size: 35px;
        letter-spacing: -0.8px;
    }

    .sst-about-intro-text {
        margin-top: 17px;
        font-size: 13.5px;
        line-height: 1.7;
    }

    .sst-about-main {
        gap: 38px;
    }

    .sst-about-story h3 {
        font-size: 31px;
    }

    .sst-about-story p {
        font-size: 14px;
        line-height: 1.8;
    }

    .sst-founder-card {
        padding: 15px;
    }

    .sst-founder-icon {
        width: 45px;
        height: 45px;
        flex-basis: 45px;
    }

    .sst-founder-content strong {
        font-size: 15px;
    }

    .sst-founder-content small {
        font-size: 10px;
        line-height: 1.4;
    }

    .sst-about-image-wrap {
        height: 340px;
        border-width: 5px;
        border-radius: 22px;
    }

    .sst-about-image-caption {
        left: 20px;
        right: 20px;
        bottom: 20px;
    }

    .sst-about-image-caption strong {
        font-size: 34px;
    }

    .sst-about-stats {
        margin: -38px 10px 0;
        gap: 7px;
    }

    .sst-about-stat {
        min-height: 70px;
        padding: 10px;
        gap: 8px;
    }

    .sst-stat-icon {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
    }

    .sst-about-stat strong {
        font-size: 14px;
    }

    .sst-about-stat span {
        font-size: 8.5px;
    }

    .sst-about-lower {
        margin-top: 50px;
        gap: 16px;
    }

    .sst-governance,
    .sst-institution-box {
        padding: 23px 18px;
        border-radius: 20px;
    }

    .sst-governance::before,
    .sst-institution-box::before {
        left: 20px;
    }

    .sst-lower-heading h3 {
        font-size: 21px;
    }

    .sst-trustees {
        grid-template-columns: 1fr;
    }

    .sst-institution-list {
        grid-template-columns: 1fr;
    }

    .sst-about-highlight {
        margin-top: 16px;
        padding: 23px 18px;
        gap: 25px;
        border-radius: 20px;
    }

    .sst-highlight-main {
        align-items: flex-start;
        gap: 12px;
    }

    .sst-highlight-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
        border-radius: 13px;
    }

    .sst-highlight-text h3 {
        font-size: 21px;
    }

    .sst-highlight-text p {
        font-size: 11px;
    }

    .sst-highlight-points {
        min-width: 0;
        width: 100%;
    }

    .sst-highlight-points div {
        padding: 9px;
    }

    .sst-highlight-points span {
        font-size: 9px;
    }

    .sst-about-closing {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 48px;
    }

    .sst-closing-mark {
        width: 48px;
        height: 48px;
        border-radius: 13px;
    }

    .sst-about-closing p {
        font-size: 17px;
        line-height: 1.6;
    }

}


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

@media (max-width: 420px) {

    .sst-about {
        padding-top: 65px;
    }

    .sst-about-intro h2 {
        font-size: 31px;
    }

    .sst-about-story h3 {
        font-size: 28px;
    }

    .sst-about-image-wrap {
        height: 290px;
    }

    .sst-about-stats {
        margin-left: 5px;
        margin-right: 5px;
    }

    .sst-about-stat {
        min-height: 66px;
    }

    .sst-about-stat strong {
        font-size: 12px;
    }

    .sst-about-stat span {
        font-size: 8px;
    }

    .sst-stat-icon {
        display: none;
    }

    .sst-highlight-points {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

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

    .sst-about *,
    .sst-about *::before,
    .sst-about *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }

}

/* =========================================================
   ABOUT SECTION — FIX CONTENT VISIBILITY
   Use this when WOW.js is not enabled
========================================================= */

.sst-about .wow {
    visibility: visible !important;
}




/* =========================================================
   TADIKELA SUBBAIAH TRUST
   MANAGEMENT SECTION
   PREMIUM RESPONSIVE UI/UX
========================================================= */

.sst-management {

    --mg-maroon: #861f1f;
    --mg-dark: #421014;
    --mg-red: #a52a26;
    --mg-gold: #b88938;
    --mg-gold-light: #d8b765;
    --mg-gold-soft: #ead49e;
    --mg-cream: #fffaf1;
    --mg-white: #ffffff;
    --mg-text: #27201e;
    --mg-muted: #716963;

    position: relative;
    width: 100%;
    overflow: hidden;

    padding: 120px 0 110px;

    background:
        radial-gradient(
            circle at 8% 8%,
            rgba(184,137,56,0.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 48%,
            rgba(134,31,31,0.07),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffaf1 55%,
            #ffffff 100%
        );
}


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

.sst-management-bg {

    position: absolute;

    border: 1px solid rgba(184,137,56,0.13);

    border-radius: 50%;

    pointer-events: none;
}

.sst-management-bg-one {

    width: 470px;
    height: 470px;

    left: -290px;
    top: 180px;
}

.sst-management-bg-two {

    width: 620px;
    height: 620px;

    right: -420px;
    bottom: -230px;

    border-color: rgba(134,31,31,0.08);
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-management-container {

    position: relative;
    z-index: 2;

    width: min(1240px, calc(100% - 40px));

    margin: 0 auto;
}


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

.sst-management-intro {

    max-width: 850px;

    margin: 0 auto 65px;

    text-align: center;
}

.sst-management-kicker {

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 17px;

    color: var(--mg-gold);

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 2.7px;
}

.sst-management-kicker span {

    width: 34px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--mg-gold)
        );
}

.sst-management-kicker span:last-child {

    background:
        linear-gradient(
            90deg,
            var(--mg-gold),
            transparent
        );
}

.sst-management-intro h2 {

    margin: 0;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4vw, 58px);

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.5px;
}

.sst-management-intro h2 em {

    display: block;

    color: var(--mg-maroon);

    font-style: normal;
}

.sst-management-intro p {

    max-width: 700px;

    margin: 22px auto 0;

    color: var(--mg-muted);

    font-size: 15px;

    line-height: 1.8;
}


/* =========================================================
   CHAIRMAN FEATURE
========================================================= */

.sst-chairman-feature {

    display: grid;

    grid-template-columns: 390px 1fr;

    gap: 0;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fffaf1 100%
        );

    border: 1px solid rgba(184,137,56,0.22);

    border-radius: 30px;

    box-shadow:
        0 28px 70px rgba(62,24,15,0.09);
}


/* =========================================================
   CHAIRMAN PHOTO
========================================================= */

.sst-chairman-photo {

    position: relative;

    min-height: 610px;

    padding: 25px;

    display: flex;

    align-items: flex-end;

    justify-content: center;

    background:
        radial-gradient(
            circle at 50% 15%,
            rgba(216,183,101,0.30),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            #5d1518,
            #421014
        );
}

.sst-chairman-photo::before {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    top: -120px;
    left: -120px;

    border: 1px solid rgba(255,255,255,0.10);

    border-radius: 50%;
}

.sst-chairman-photo::after {

    content: "";

    position: absolute;

    width: 240px;
    height: 240px;

    right: -120px;
    bottom: 40px;

    border: 1px solid rgba(216,183,101,0.20);

    border-radius: 50%;
}


/* =========================================================
   PHOTO FRAME
========================================================= */

.sst-chairman-photo-frame {

    position: relative;

    width: 100%;
    height: 100%;

    min-height: 560px;

    overflow: hidden;

    border-radius: 22px;

    border: 1px solid rgba(216,183,101,0.38);

    background: #ffffff;

    box-shadow:
        0 25px 55px rgba(0,0,0,0.24);
}

.sst-chairman-photo-frame img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center top;

    transition:
        transform 0.7s ease;
}

.sst-chairman-feature:hover
.sst-chairman-photo-frame img {

    transform: scale(1.025);
}


/* =========================================================
   PHOTO SHINE
========================================================= */

.sst-chairman-photo-shine {

    position: absolute;

    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.16),
            transparent 28%,
            transparent 72%,
            rgba(0,0,0,0.16)
        );
}


/* =========================================================
   CHAIRMAN BADGE
========================================================= */

.sst-chairman-badge {

    position: absolute;

    z-index: 5;

    left: 42px;
    right: 42px;
    bottom: 48px;

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 13px 15px;

    background:
        rgba(255,255,255,0.94);

    border:
        1px solid rgba(216,183,101,0.50);

    border-radius: 15px;

    box-shadow:
        0 15px 35px rgba(0,0,0,0.22);

    backdrop-filter: blur(14px);
}

.sst-chairman-badge > i {

    width: 39px;
    height: 39px;

    flex: 0 0 39px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            var(--mg-maroon),
            var(--mg-dark)
        );

    border-radius: 10px;
}

.sst-chairman-badge span {

    display: block;

    margin-bottom: 2px;

    color: var(--mg-gold);

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.sst-chairman-badge strong {

    display: block;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 15px;
}


/* =========================================================
   CHAIRMAN MESSAGE
========================================================= */

.sst-chairman-message {

    padding: 55px 58px 50px;
}


/* TOP LABEL */

.sst-message-top {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 20px;
}

.sst-message-label {

    display: flex;

    align-items: center;

    gap: 9px;

    color: var(--mg-gold);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.8px;

    white-space: nowrap;
}

.sst-message-label i {

    width: 29px;
    height: 29px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background: var(--mg-maroon);

    border-radius: 8px;

    font-size: 11px;
}

.sst-message-line {

    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(184,137,56,0.35),
            transparent
        );
}


/* HEADING */

.sst-chairman-message h3 {

    max-width: 620px;

    margin: 0 0 25px;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 34px;

    line-height: 1.18;

    font-weight: 500;
}

.sst-chairman-message h3 span {

    display: block;

    color: var(--mg-maroon);
}


/* COPY */

.sst-chairman-copy {

    max-height: 395px;

    overflow-y: auto;

    padding-right: 15px;

    scrollbar-width: thin;

    scrollbar-color:
        rgba(184,137,56,0.45)
        transparent;
}

.sst-chairman-copy::-webkit-scrollbar {

    width: 4px;
}

.sst-chairman-copy::-webkit-scrollbar-track {

    background: transparent;
}

.sst-chairman-copy::-webkit-scrollbar-thumb {

    background:
        linear-gradient(
            var(--mg-maroon),
            var(--mg-gold)
        );

    border-radius: 10px;
}

.sst-chairman-copy p {

    margin: 0 0 15px;

    color: var(--mg-muted);

    font-size: 13.5px;

    line-height: 1.78;
}

.sst-chairman-copy strong {

    color: var(--mg-maroon);

    font-weight: 700;
}


/* =========================================================
   SIGNATURE
========================================================= */

.sst-chairman-signature {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-top: 25px;

    padding-top: 20px;

    border-top:
        1px solid rgba(184,137,56,0.18);
}

.sst-signature-line {

    width: 38px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--mg-maroon),
            var(--mg-gold)
        );

    border-radius: 5px;
}

.sst-chairman-signature strong {

    display: block;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 15px;
}

.sst-chairman-signature span {

    display: block;

    margin-top: 2px;

    color: var(--mg-gold);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.3px;
}


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

.sst-team-heading {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    margin: 80px 0 30px;

    padding-bottom: 18px;

    border-bottom:
        1px solid rgba(184,137,56,0.18);
}

.sst-team-heading > div:first-child > span {

    display: block;

    margin-bottom: 5px;

    color: var(--mg-gold);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}

.sst-team-heading h3 {

    margin: 0;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    font-weight: 500;
}

.sst-team-heading-mark {

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--mg-maroon);

    background: var(--mg-cream);

    border:
        1px solid rgba(184,137,56,0.22);

    border-radius: 13px;
}


/* =========================================================
   MANAGEMENT GRID
========================================================= */

.sst-management-grid {

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 18px;
}


/* =========================================================
   LEADER CARD
========================================================= */

.sst-leader-card {

    position: relative;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffaf1 100%
        );

    border:
        1px solid rgba(184,137,56,0.19);

    border-radius: 22px;

    box-shadow:
        0 15px 38px rgba(62,24,15,0.055);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.sst-leader-card:hover {

    transform: translateY(-8px);

    border-color:
        rgba(184,137,56,0.38);

    box-shadow:
        0 25px 55px rgba(62,24,15,0.12);
}


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

.sst-leader-image {

    position: relative;

    height: 275px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #f5ead7,
            #fffaf1
        );
}

.sst-leader-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(66,16,20,0.15) 100%
        );

    pointer-events: none;
}

.sst-leader-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center top;

    transition:
        transform 0.6s ease;
}

.sst-leader-card:hover
.sst-leader-image img {

    transform: scale(1.04);
}


/* NUMBER */

.sst-leader-number {

    position: absolute;

    z-index: 5;

    top: 14px;
    left: 14px;

    width: 31px;
    height: 31px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--mg-maroon);

    background:
        rgba(255,255,255,0.92);

    border:
        1px solid rgba(184,137,56,0.30);

    border-radius: 9px;

    font-size: 9px;

    font-weight: 800;

    box-shadow:
        0 8px 18px rgba(0,0,0,0.10);

    backdrop-filter: blur(8px);
}


/* =========================================================
   LEADER CONTENT
========================================================= */

.sst-leader-content {

    position: relative;

    padding: 22px 20px 20px;
}

.sst-leader-role {

    display: block;

    margin-bottom: 6px;

    color: var(--mg-gold);

    font-size: 8.5px;

    font-weight: 800;

    letter-spacing: 1.3px;

    line-height: 1.4;
}

.sst-leader-content h4 {

    margin: 0;

    color: var(--mg-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 21px;

    font-weight: 500;
}

.sst-leader-qualification {

    display: inline-flex;

    margin-top: 7px;

    padding: 5px 8px;

    color: var(--mg-maroon);

    background:
        rgba(184,137,56,0.09);

    border:
        1px solid rgba(184,137,56,0.18);

    border-radius: 7px;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 0.6px;
}

.sst-leader-content p {

    min-height: 82px;

    margin: 15px 0 18px;

    color: var(--mg-muted);

    font-size: 11.5px;

    line-height: 1.65;
}


/* =========================================================
   CARD FOOTER
========================================================= */

.sst-leader-footer {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-top: 13px;

    border-top:
        1px solid rgba(184,137,56,0.15);
}

.sst-leader-footer span {

    width: 30px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--mg-maroon),
            var(--mg-gold)
        );

    border-radius: 5px;
}

.sst-leader-footer i {

    color: var(--mg-gold);

    font-size: 13px;
}


/* =========================================================
   CLOSING STRIP
========================================================= */

.sst-management-closing {

    display: flex;

    align-items: center;

    gap: 18px;

    margin-top: 28px;

    padding: 24px 28px;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(216,183,101,0.18),
            transparent 32%
        ),
        linear-gradient(
            120deg,
            var(--mg-dark),
            var(--mg-maroon)
        );

    border-radius: 20px;

    box-shadow:
        0 18px 40px rgba(66,16,20,0.14);
}

.sst-management-closing-icon {

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 48px;

    color: var(--mg-dark);

    background:
        var(--mg-gold-soft);

    border-radius: 13px;
}

.sst-management-closing span {

    display: block;

    margin-bottom: 4px;

    color: var(--mg-gold-soft);

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.8px;
}

.sst-management-closing h3 {

    margin: 0;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 22px;

    font-weight: 500;
}

.sst-management-closing-arrow {

    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-left: auto;

    color: var(--mg-gold-soft);

    border:
        1px solid rgba(255,255,255,0.15);

    border-radius: 50%;
}


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

@media (max-width: 1100px) {

    .sst-chairman-feature {

        grid-template-columns: 340px 1fr;
    }

    .sst-chairman-message {

        padding: 45px 40px;
    }

    .sst-management-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   TABLET / SMALL LAPTOP
========================================================= */

@media (max-width: 850px) {

    .sst-management {

        padding: 95px 0;
    }

    .sst-chairman-feature {

        grid-template-columns: 1fr;
    }

    .sst-chairman-photo {

        min-height: 510px;

        padding: 22px;
    }

    .sst-chairman-photo-frame {

        min-height: 465px;
    }

    .sst-chairman-badge {

        left: 40px;
        right: 40px;
        bottom: 40px;
    }

    .sst-chairman-message {

        padding: 42px 35px 40px;
    }

    .sst-chairman-copy {

        max-height: none;

        overflow: visible;
    }

}


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

@media (max-width: 650px) {

    .sst-management {

        padding: 75px 0 70px;
    }

    .sst-management-container {

        width: min(100% - 26px, 1240px);
    }

    .sst-management-intro {

        margin-bottom: 42px;
    }

    .sst-management-kicker {

        font-size: 9px;

        letter-spacing: 2px;
    }

    .sst-management-kicker span {

        width: 22px;
    }

    .sst-management-intro h2 {

        font-size: 35px;

        letter-spacing: -0.8px;
    }

    .sst-management-intro p {

        margin-top: 17px;

        font-size: 13px;

        line-height: 1.7;
    }


    /* CHAIRMAN */

    .sst-chairman-feature {

        border-radius: 22px;
    }

    .sst-chairman-photo {

        min-height: 430px;

        padding: 15px;
    }

    .sst-chairman-photo-frame {

        min-height: 400px;

        border-radius: 17px;
    }

    .sst-chairman-badge {

        left: 28px;
        right: 28px;
        bottom: 28px;

        padding: 10px 11px;
    }

    .sst-chairman-badge > i {

        width: 34px;
        height: 34px;

        flex-basis: 34px;
    }

    .sst-chairman-badge strong {

        font-size: 13px;
    }

    .sst-chairman-message {

        padding: 30px 20px 28px;
    }

    .sst-message-top {

        gap: 9px;
    }

    .sst-message-label {

        font-size: 8px;

        letter-spacing: 1.2px;
    }

    .sst-message-label i {

        width: 25px;
        height: 25px;
    }

    .sst-chairman-message h3 {

        font-size: 27px;

        margin-bottom: 20px;
    }

    .sst-chairman-copy p {

        font-size: 12.5px;

        line-height: 1.75;
    }


    /* TEAM HEADING */

    .sst-team-heading {

        margin-top: 55px;
    }

    .sst-team-heading h3 {

        font-size: 23px;
    }

    .sst-team-heading-mark {

        width: 42px;
        height: 42px;
    }


    /* TEAM */

    .sst-management-grid {

        grid-template-columns: 1fr;

        gap: 15px;
    }

    .sst-leader-card {

        display: grid;

        grid-template-columns: 135px 1fr;

        border-radius: 18px;
    }

    .sst-leader-image {

        height: 100%;

        min-height: 240px;
    }

    .sst-leader-content {

        padding: 18px 16px;
    }

    .sst-leader-content h4 {

        font-size: 19px;
    }

    .sst-leader-content p {

        min-height: auto;

        font-size: 10.5px;

        line-height: 1.6;
    }

    .sst-leader-number {

        top: 10px;
        left: 10px;
    }


    /* CLOSING */

    .sst-management-closing {

        align-items: flex-start;

        padding: 20px 17px;

        gap: 12px;
    }

    .sst-management-closing-icon {

        width: 42px;
        height: 42px;

        flex-basis: 42px;
    }

    .sst-management-closing h3 {

        font-size: 18px;

        line-height: 1.35;
    }

    .sst-management-closing-arrow {

        display: none;
    }

}


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

@media (max-width: 430px) {

    .sst-management-intro h2 {

        font-size: 31px;
    }

    .sst-chairman-photo {

        min-height: 370px;
    }

    .sst-chairman-photo-frame {

        min-height: 340px;
    }

    .sst-chairman-message h3 {

        font-size: 24px;
    }

    .sst-leader-card {

        grid-template-columns: 115px 1fr;
    }

    .sst-leader-image {

        min-height: 225px;
    }

    .sst-leader-content {

        padding: 15px 13px;
    }

    .sst-leader-role {

        font-size: 7.5px;

        letter-spacing: 1px;
    }

    .sst-leader-content h4 {

        font-size: 17px;
    }

    .sst-leader-qualification {

        font-size: 8px;
    }

    .sst-leader-content p {

        font-size: 9.5px;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

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

    .sst-management *,
    .sst-management *::before,
    .sst-management *::after {

        transition: none !important;
        animation: none !important;
    }

}



/* =========================================================
   TADIKELA SUBBAIAH TRUST
   VISION & MISSION — PREMIUM UI/UX
========================================================= */

.sst-vision {

    --vm-maroon: #861f1f;
    --vm-dark: #421014;
    --vm-red: #a52a26;
    --vm-gold: #b88938;
    --vm-gold-light: #d8b765;
    --vm-gold-soft: #ead49e;
    --vm-cream: #fffaf1;
    --vm-white: #ffffff;
    --vm-text: #27201e;
    --vm-muted: #706762;

    position: relative;

    width: 100%;

    overflow: hidden;

    padding: 115px 0 105px;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(184,137,56,0.10),
            transparent 29%
        ),
        radial-gradient(
            circle at 92% 80%,
            rgba(134,31,31,0.08),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #fffaf1 0%,
            #ffffff 52%,
            #fffaf1 100%
        );
}


/* =========================================================
   DECORATIVE ORBITS
========================================================= */

.sst-vision-orbit {

    position: absolute;

    pointer-events: none;

    border: 1px solid rgba(184,137,56,0.14);

    border-radius: 50%;
}

.sst-vision-orbit-one {

    width: 430px;
    height: 430px;

    top: -230px;
    left: -200px;
}

.sst-vision-orbit-two {

    width: 600px;
    height: 600px;

    right: -380px;
    bottom: -300px;

    border-color:
        rgba(134,31,31,0.08);
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-vision-container {

    position: relative;

    z-index: 2;

    width: min(
        1240px,
        calc(100% - 40px)
    );

    margin: 0 auto;
}


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

.sst-vision-header {

    max-width: 820px;

    margin: 0 auto 62px;

    text-align: center;
}

.sst-vision-kicker {

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 16px;

    color: var(--vm-gold);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2.8px;
}

.sst-vision-kicker span {

    width: 35px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--vm-gold)
        );
}

.sst-vision-kicker span:last-child {

    background:
        linear-gradient(
            90deg,
            var(--vm-gold),
            transparent
        );
}

.sst-vision-header h2 {

    margin: 0;

    color: var(--vm-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4vw, 57px);

    font-weight: 500;

    line-height: 1.08;

    letter-spacing: -1.4px;
}

.sst-vision-header h2 em {

    display: block;

    color: var(--vm-maroon);

    font-style: normal;
}

.sst-vision-header p {

    max-width: 690px;

    margin: 22px auto 0;

    color: var(--vm-muted);

    font-size: 15px;

    line-height: 1.8;
}


/* =========================================================
   VISION / MISSION GRID
========================================================= */

.sst-vision-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 22px;
}


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

.sst-vision-card {

    position: relative;

    min-height: 425px;

    overflow: hidden;

    padding: 38px 38px 32px;

    border-radius: 27px;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;

    box-shadow:
        0 22px 55px rgba(62,24,15,0.08);
}

.sst-vision-card:hover {

    transform: translateY(-7px);

    box-shadow:
        0 30px 70px rgba(62,24,15,0.13);
}


/* =========================================================
   VISION CARD
========================================================= */

.sst-vision-primary {

    color: #ffffff;

    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(216,183,101,0.20),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #421014,
            #721a1d 65%,
            #861f1f
        );

    border:
        1px solid rgba(216,183,101,0.28);
}


/* =========================================================
   MISSION CARD
========================================================= */

.sst-mission-card {

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf1
        );

    border:
        1px solid rgba(184,137,56,0.22);
}


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

.sst-vision-card::before {

    content: "";

    position: absolute;

    width: 270px;
    height: 270px;

    right: -155px;
    top: -155px;

    border: 1px solid
        rgba(255,255,255,0.12);

    border-radius: 50%;
}

.sst-mission-card::before {

    border-color:
        rgba(184,137,56,0.12);
}


/* =========================================================
   CARD TOP
========================================================= */

.sst-vision-card-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 30px;
}

.sst-vision-icon {

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--vm-dark);

    background:
        var(--vm-gold-soft);

    border-radius: 16px;

    box-shadow:
        0 12px 25px rgba(0,0,0,0.10);
}

.sst-vision-icon i {

    font-size: 21px;
}

.sst-vision-card-number {

    color: rgba(255,255,255,0.30);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    line-height: 1;
}

.sst-mission-card
.sst-vision-card-number {

    color: rgba(134,31,31,0.10);
}


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

.sst-vision-card-label {

    margin-bottom: 9px;

    color: var(--vm-gold);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 2px;
}


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

.sst-vision-card h3 {

    max-width: 500px;

    margin: 0 0 19px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    line-height: 1.22;

    font-weight: 500;
}

.sst-vision-primary h3 {

    color: #ffffff;
}

.sst-mission-card h3 {

    color: var(--vm-dark);
}

.sst-mission-card h3 span {

    color: var(--vm-maroon);
}


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

.sst-vision-card p {

    max-width: 530px;

    margin: 0;

    font-size: 13.5px;

    line-height: 1.82;
}

.sst-vision-primary p {

    color:
        rgba(255,255,255,0.76);
}

.sst-mission-card p {

    color: var(--vm-muted);
}


/* =========================================================
   CARD BOTTOM
========================================================= */

.sst-vision-card-bottom {

    position: absolute;

    left: 38px;
    right: 38px;
    bottom: 30px;

    display: flex;

    align-items: center;

    gap: 11px;

    padding-top: 17px;

    border-top:
        1px solid rgba(255,255,255,0.13);
}

.sst-vision-card-bottom span {

    width: 34px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--vm-gold),
            var(--vm-gold-light)
        );

    border-radius: 5px;
}

.sst-vision-card-bottom strong {

    font-size: 10px;

    letter-spacing: 0.7px;
}

.sst-vision-primary
.sst-vision-card-bottom strong {

    color: var(--vm-gold-soft);
}

.sst-mission-card
.sst-vision-card-bottom {

    border-color:
        rgba(184,137,56,0.18);
}

.sst-mission-card
.sst-vision-card-bottom strong {

    color: var(--vm-maroon);
}


/* =========================================================
   PURPOSE STRIP
========================================================= */

.sst-purpose-strip {

    display: grid;

    grid-template-columns: 235px 1fr;

    align-items: center;

    gap: 30px;

    margin-top: 25px;

    padding: 27px 30px;

    background:
        rgba(255,255,255,0.90);

    border:
        1px solid rgba(184,137,56,0.18);

    border-radius: 21px;

    box-shadow:
        0 18px 45px rgba(62,24,15,0.055);

    backdrop-filter: blur(15px);
}


/* INTRO */

.sst-purpose-intro span {

    display: block;

    margin-bottom: 5px;

    color: var(--vm-gold);

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.7px;
}

.sst-purpose-intro h3 {

    margin: 0;

    color: var(--vm-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 23px;

    font-weight: 500;
}


/* =========================================================
   PURPOSE ITEMS
========================================================= */

.sst-purpose-items {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 10px;
}

.sst-purpose-item {

    display: flex;

    align-items: center;

    gap: 10px;

    min-height: 68px;

    padding: 9px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf1
        );

    border:
        1px solid rgba(184,137,56,0.13);

    border-radius: 13px;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease;
}

.sst-purpose-item:hover {

    transform: translateY(-3px);

    border-color:
        rgba(184,137,56,0.32);
}

.sst-purpose-icon {

    width: 37px;
    height: 37px;

    flex: 0 0 37px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--vm-maroon);

    background:
        rgba(184,137,56,0.10);

    border-radius: 10px;
}

.sst-purpose-icon i {

    font-size: 13px;
}

.sst-purpose-item strong {

    display: block;

    color: var(--vm-text);

    font-size: 11px;
}

.sst-purpose-item span {

    display: block;

    margin-top: 3px;

    color: var(--vm-muted);

    font-size: 8.5px;

    line-height: 1.4;
}


/* =========================================================
   FINAL STATEMENT
========================================================= */

.sst-vision-statement {

    display: grid;

    grid-template-columns: 60px 1fr;

    align-items: start;

    gap: 18px;

    max-width: 900px;

    margin: 58px auto 0;
}

.sst-vision-statement-mark {

    width: 60px;
    height: 60px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--vm-gold);

    background:
        linear-gradient(
            145deg,
            rgba(184,137,56,0.11),
            rgba(134,31,31,0.06)
        );

    border:
        1px solid rgba(184,137,56,0.22);

    border-radius: 16px;
}

.sst-vision-statement-mark i {

    font-size: 20px;
}

.sst-vision-statement-content p {

    margin: 1px 0 16px;

    color: var(--vm-text);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 19px;

    line-height: 1.65;
}

.sst-vision-statement-line {

    display: flex;

    align-items: center;

    gap: 10px;
}

.sst-vision-statement-line span {

    width: 35px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--vm-maroon),
            var(--vm-gold)
        );

    border-radius: 5px;
}

.sst-vision-statement-line strong {

    color: var(--vm-maroon);

    font-size: 10px;

    letter-spacing: 1px;
}


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

@media (max-width: 1050px) {

    .sst-purpose-strip {

        grid-template-columns: 1fr;

        gap: 20px;
    }

    .sst-purpose-items {

        grid-template-columns:
            repeat(2, 1fr);
    }

}


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

@media (max-width: 800px) {

    .sst-vision {

        padding: 95px 0 90px;
    }

    .sst-vision-grid {

        grid-template-columns: 1fr;
    }

    .sst-vision-card {

        min-height: 390px;
    }

}


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

@media (max-width: 650px) {

    .sst-vision {

        padding: 75px 0 70px;
    }

    .sst-vision-container {

        width:
            min(
                100% - 26px,
                1240px
            );
    }

    .sst-vision-header {

        margin-bottom: 43px;
    }

    .sst-vision-kicker {

        font-size: 9px;

        letter-spacing: 2px;
    }

    .sst-vision-kicker span {

        width: 22px;
    }

    .sst-vision-header h2 {

        font-size: 35px;

        letter-spacing: -0.8px;
    }

    .sst-vision-header p {

        margin-top: 17px;

        font-size: 13px;

        line-height: 1.7;
    }


    /* CARDS */

    .sst-vision-grid {

        gap: 15px;
    }

    .sst-vision-card {

        min-height: 390px;

        padding: 27px 21px 28px;

        border-radius: 21px;
    }

    .sst-vision-card-top {

        margin-bottom: 25px;
    }

    .sst-vision-icon {

        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .sst-vision-icon i {

        font-size: 17px;
    }

    .sst-vision-card-number {

        font-size: 32px;
    }

    .sst-vision-card h3 {

        font-size: 26px;

        line-height: 1.22;
    }

    .sst-vision-card p {

        font-size: 12px;

        line-height: 1.75;
    }

    .sst-vision-card-bottom {

        left: 21px;
        right: 21px;
        bottom: 25px;
    }


    /* PURPOSE */

    .sst-purpose-strip {

        margin-top: 15px;

        padding: 21px 17px;

        border-radius: 19px;
    }

    .sst-purpose-intro h3 {

        font-size: 21px;
    }

    .sst-purpose-items {

        grid-template-columns: 1fr;

        gap: 7px;
    }

    .sst-purpose-item {

        min-height: 61px;
    }


    /* STATEMENT */

    .sst-vision-statement {

        grid-template-columns: 1fr;

        gap: 13px;

        margin-top: 45px;
    }

    .sst-vision-statement-mark {

        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .sst-vision-statement-content p {

        font-size: 17px;

        line-height: 1.6;
    }

}


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

@media (max-width: 420px) {

    .sst-vision-header h2 {

        font-size: 31px;
    }

    .sst-vision-card {

        min-height: 410px;
    }

    .sst-vision-card h3 {

        font-size: 23px;
    }

    .sst-vision-card p {

        font-size: 11.5px;
    }

}


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

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

    .sst-vision *,
    .sst-vision *::before,
    .sst-vision *::after {

        animation: none !important;
        transition: none !important;
    }

}

/* =========================================================
   TADIKELA SUBBAIAH TRUST
   RESEARCH & INNOVATION
   PREMIUM RESPONSIVE UI/UX
========================================================= */

.sst-research {

    --rs-maroon: #861f1f;
    --rs-dark: #421014;
    --rs-red: #a52a26;
    --rs-gold: #b88938;
    --rs-gold-light: #d8b765;
    --rs-gold-soft: #ead49e;
    --rs-cream: #fffaf1;
    --rs-white: #ffffff;
    --rs-text: #27201e;
    --rs-muted: #706762;

    position: relative;
    width: 100%;
    overflow: hidden;

    padding: 115px 0 105px;

    background:
        radial-gradient(
            circle at 7% 18%,
            rgba(184,137,56,0.09),
            transparent 28%
        ),
        radial-gradient(
            circle at 94% 70%,
            rgba(134,31,31,0.07),
            transparent 31%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffaf1 52%,
            #ffffff 100%
        );
}


/* =========================================================
   BACKGROUND ORBITS
========================================================= */

.sst-research-orbit {

    position: absolute;

    border: 1px solid rgba(184,137,56,0.13);

    border-radius: 50%;

    pointer-events: none;
}

.sst-research-orbit-one {

    width: 430px;
    height: 430px;

    left: -270px;
    top: 120px;
}

.sst-research-orbit-two {

    width: 620px;
    height: 620px;

    right: -430px;
    bottom: -280px;

    border-color:
        rgba(134,31,31,0.08);
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-research-container {

    position: relative;
    z-index: 2;

    width: min(
        1240px,
        calc(100% - 40px)
    );

    margin: 0 auto;
}


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

.sst-research-header {

    max-width: 850px;

    margin: 0 auto 62px;

    text-align: center;
}

.sst-research-kicker {

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 16px;

    color: var(--rs-gold);

    font-size: 10px;
    font-weight: 800;

    letter-spacing: 2.8px;
}

.sst-research-kicker span {

    width: 35px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--rs-gold)
        );
}

.sst-research-kicker span:last-child {

    background:
        linear-gradient(
            90deg,
            var(--rs-gold),
            transparent
        );
}

.sst-research-header h2 {

    margin: 0;

    color: var(--rs-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4vw, 57px);

    font-weight: 500;

    line-height: 1.08;

    letter-spacing: -1.4px;
}

.sst-research-header h2 em {

    display: block;

    color: var(--rs-maroon);

    font-style: normal;
}

.sst-research-header p {

    max-width: 720px;

    margin: 22px auto 0;

    color: var(--rs-muted);

    font-size: 15px;

    line-height: 1.8;
}


/* =========================================================
   MAIN FEATURE
========================================================= */

.sst-research-feature {

    display: grid;

    grid-template-columns: 1.1fr 0.9fr;

    min-height: 445px;

    overflow: hidden;

    border-radius: 29px;

    background:
        linear-gradient(
            135deg,
            #421014,
            #6e181b 60%,
            #861f1f
        );

    box-shadow:
        0 28px 70px rgba(66,16,20,0.17);

    border:
        1px solid rgba(216,183,101,0.25);
}


/* =========================================================
   FEATURE CONTENT
========================================================= */

.sst-research-feature-content {

    position: relative;
    z-index: 3;

    padding: 55px 55px 50px;
}

.sst-research-feature-label {

    display: flex;
    align-items: center;

    gap: 10px;

    color: var(--rs-gold-soft);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.8px;
}

.sst-research-feature-label i {

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--rs-dark);

    background:
        var(--rs-gold-soft);

    border-radius: 9px;
}

.sst-research-feature-content h3 {

    max-width: 600px;

    margin: 24px 0 20px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 39px;

    font-weight: 500;

    line-height: 1.12;
}

.sst-research-feature-content h3 span {

    display: block;

    color: var(--rs-gold-light);
}

.sst-research-feature-content p {

    max-width: 650px;

    margin: 0 0 13px;

    color: rgba(255,255,255,0.75);

    font-size: 13px;

    line-height: 1.78;
}


/* =========================================================
   RESEARCH BUTTON
========================================================= */

.sst-research-button {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top: 15px;

    padding: 13px 18px;

    color: var(--rs-dark);

    background:
        linear-gradient(
            135deg,
            #ead49e,
            #d8b765
        );

    border-radius: 11px;

    text-decoration: none;

    font-size: 11px;

    font-weight: 800;

    box-shadow:
        0 12px 25px rgba(0,0,0,0.14);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.sst-research-button:hover {

    transform: translateY(-3px);

    color: var(--rs-dark);

    box-shadow:
        0 17px 32px rgba(0,0,0,0.20);
}

.sst-research-button i {

    font-size: 10px;
}


/* =========================================================
   FEATURE VISUAL
========================================================= */

.sst-research-feature-visual {

    position: relative;

    min-height: 445px;

    display: flex;

    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.sst-research-glow {

    position: absolute;

    width: 340px;
    height: 340px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(216,183,101,0.22),
            rgba(216,183,101,0.03) 58%,
            transparent 72%
        );

    filter: blur(2px);
}


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

.sst-research-circle {

    position: absolute;

    border: 1px solid rgba(216,183,101,0.20);

    border-radius: 50%;
}

.circle-one {

    width: 270px;
    height: 270px;
}

.circle-two {

    width: 195px;
    height: 195px;

    border-color:
        rgba(255,255,255,0.12);
}

.circle-three {

    width: 120px;
    height: 120px;

    border-color:
        rgba(216,183,101,0.28);
}


/* =========================================================
   MAIN ICON
========================================================= */

.sst-research-main-icon {

    position: relative;
    z-index: 3;

    width: 105px;
    height: 105px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--rs-dark);

    background:
        linear-gradient(
            145deg,
            #ead49e,
            #b88938
        );

    border-radius: 30px;

    transform: rotate(-8deg);

    box-shadow:
        0 25px 50px rgba(0,0,0,0.25);
}

.sst-research-main-icon i {

    font-size: 43px;

    transform: rotate(8deg);
}


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

.sst-research-floating-card {

    position: absolute;
    z-index: 5;

    display: flex;
    align-items: center;

    gap: 10px;

    padding: 11px 14px;

    background:
        rgba(255,255,255,0.94);

    border:
        1px solid rgba(216,183,101,0.35);

    border-radius: 12px;

    box-shadow:
        0 15px 35px rgba(0,0,0,0.20);

    backdrop-filter: blur(12px);
}

.sst-research-floating-card > i {

    width: 31px;
    height: 31px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--rs-maroon);

    background: var(--rs-cream);

    border-radius: 8px;

    font-size: 12px;
}

.sst-research-floating-card strong {

    display: block;

    color: var(--rs-dark);

    font-size: 10px;
}

.sst-research-floating-card span {

    display: block;

    margin-top: 2px;

    color: var(--rs-muted);

    font-size: 8px;
}

.card-top {

    top: 75px;
    right: 25px;
}

.card-bottom {

    bottom: 70px;
    left: 20px;
}


/* =========================================================
   RESEARCH PILLARS
========================================================= */

.sst-research-pillars {

    margin-top: 72px;
}

.sst-research-pillar-heading {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    margin-bottom: 25px;
}

.sst-research-pillar-heading span {

    display: block;

    margin-bottom: 5px;

    color: var(--rs-gold);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 2px;
}

.sst-research-pillar-heading h3 {

    margin: 0;

    color: var(--rs-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    font-weight: 500;
}

.sst-research-pillar-heading h3 em {

    color: var(--rs-maroon);

    font-style: normal;
}


/* =========================================================
   PILLAR GRID
========================================================= */

.sst-research-pillar-grid {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 15px;
}

.sst-research-pillar {

    position: relative;

    min-height: 255px;

    padding: 23px 20px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf1
        );

    border:
        1px solid rgba(184,137,56,0.17);

    border-radius: 20px;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.sst-research-pillar:hover {

    transform: translateY(-6px);

    border-color:
        rgba(184,137,56,0.35);

    box-shadow:
        0 20px 42px rgba(62,24,15,0.08);
}

.sst-research-pillar::after {

    content: "";

    position: absolute;

    width: 130px;
    height: 130px;

    right: -75px;
    bottom: -75px;

    border:
        1px solid rgba(184,137,56,0.10);

    border-radius: 50%;
}

.sst-research-pillar-top {

    display: flex;

    align-items: center;
    justify-content: space-between;

    margin-bottom: 25px;
}

.sst-research-pillar-top > span {

    color: rgba(134,31,31,0.13);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 28px;
}

.sst-research-pillar-icon {

    width: 45px;
    height: 45px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 12px;

    font-size: 16px;
}

.sst-research-pillar-icon.clinical {

    color: #861f1f;
    background: rgba(134,31,31,0.09);
}

.sst-research-pillar-icon.health {

    color: #a52a26;
    background: rgba(165,42,38,0.09);
}

.sst-research-pillar-icon.community {

    color: #8b6420;
    background: rgba(184,137,56,0.13);
}

.sst-research-pillar-icon.innovation {

    color: #704516;
    background: rgba(216,183,101,0.16);
}

.sst-research-pillar h4 {

    margin: 0 0 9px;

    color: var(--rs-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 20px;

    font-weight: 500;
}

.sst-research-pillar p {

    margin: 0;

    color: var(--rs-muted);

    font-size: 11px;

    line-height: 1.7;
}

.sst-research-pillar-line {

    width: 30px;
    height: 2px;

    margin-top: 20px;

    background:
        linear-gradient(
            90deg,
            var(--rs-maroon),
            var(--rs-gold)
        );

    border-radius: 5px;
}


/* =========================================================
   RESEARCH ECOSYSTEM
========================================================= */

.sst-research-ecosystem {

    margin-top: 25px;

    padding: 29px 30px;

    background:
        linear-gradient(
            135deg,
            rgba(134,31,31,0.055),
            rgba(184,137,56,0.08)
        );

    border:
        1px solid rgba(184,137,56,0.18);

    border-radius: 22px;
}

.sst-research-eco-intro {

    margin-bottom: 25px;
}

.sst-research-eco-intro span {

    display: block;

    margin-bottom: 5px;

    color: var(--rs-gold);

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.7px;
}

.sst-research-eco-intro h3 {

    margin: 0;

    color: var(--rs-dark);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 23px;

    font-weight: 500;
}

.sst-research-eco-intro h3 strong {

    color: var(--rs-maroon);

    font-weight: 500;
}


/* =========================================================
   FLOW
========================================================= */

.sst-research-flow {

    display: grid;

    grid-template-columns:
        1fr 35px
        1fr 35px
        1fr 35px
        1fr;

    align-items: center;

    gap: 8px;
}

.sst-research-flow-item {

    display: flex;

    align-items: center;

    gap: 9px;

    min-height: 65px;

    padding: 8px 10px;

    background:
        rgba(255,255,255,0.82);

    border:
        1px solid rgba(184,137,56,0.13);

    border-radius: 12px;
}

.sst-flow-icon {

    width: 37px;
    height: 37px;

    flex: 0 0 37px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--rs-maroon);

    background:
        var(--rs-cream);

    border-radius: 9px;
}

.sst-research-flow-item strong {

    display: block;

    color: var(--rs-text);

    font-size: 10px;
}

.sst-research-flow-item span {

    display: block;

    margin-top: 2px;

    color: var(--rs-muted);

    font-size: 8px;
}

.sst-flow-arrow {

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--rs-gold);

    font-size: 11px;
}


/* =========================================================
   CLOSING
========================================================= */

.sst-research-closing {

    display: grid;

    grid-template-columns: 58px 1fr;

    gap: 18px;

    align-items: start;

    max-width: 900px;

    margin: 58px auto 0;
}

.sst-research-closing-icon {

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--rs-gold);

    background:
        linear-gradient(
            145deg,
            rgba(184,137,56,0.11),
            rgba(134,31,31,0.06)
        );

    border:
        1px solid rgba(184,137,56,0.22);

    border-radius: 16px;
}

.sst-research-closing-icon i {

    font-size: 19px;
}

.sst-research-closing p {

    margin: 0 0 15px;

    color: var(--rs-text);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 18px;

    line-height: 1.65;
}

.sst-research-closing-sign {

    display: flex;

    align-items: center;

    gap: 10px;
}

.sst-research-closing-sign span {

    width: 35px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--rs-maroon),
            var(--rs-gold)
        );

    border-radius: 5px;
}

.sst-research-closing-sign strong {

    color: var(--rs-maroon);

    font-size: 10px;

    letter-spacing: 1px;
}


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

@media (max-width: 1050px) {

    .sst-research-feature {

        grid-template-columns: 1fr 0.75fr;
    }

    .sst-research-feature-content {

        padding: 45px;
    }

    .sst-research-pillar-grid {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .sst-research-flow {

        grid-template-columns:
            1fr 30px 1fr;

        gap: 8px;
    }

    .sst-research-flow-item:nth-of-type(3) {
        grid-column: 1;
    }

    .sst-research-flow-item:nth-of-type(4) {
        grid-column: 3;
    }

    .sst-flow-arrow:nth-of-type(3) {
        grid-column: 2;
    }

}


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

@media (max-width: 800px) {

    .sst-research {

        padding: 95px 0 90px;
    }

    .sst-research-feature {

        grid-template-columns: 1fr;
    }

    .sst-research-feature-visual {

        min-height: 300px;
    }

    .sst-research-feature-content {

        padding: 42px 35px 38px;
    }

    .sst-research-flow {

        grid-template-columns:
            1fr 1fr;
    }

    .sst-research-flow-item,
    .sst-research-flow-item:nth-of-type(3),
    .sst-research-flow-item:nth-of-type(4) {

        grid-column: auto;
    }

    .sst-flow-arrow {

        display: none;
    }

}


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

@media (max-width: 650px) {

    .sst-research {

        padding: 75px 0 70px;
    }

    .sst-research-container {

        width:
            min(
                100% - 26px,
                1240px
            );
    }

    .sst-research-header {

        margin-bottom: 43px;
    }

    .sst-research-kicker {

        font-size: 9px;

        letter-spacing: 2px;
    }

    .sst-research-kicker span {

        width: 22px;
    }

    .sst-research-header h2 {

        font-size: 35px;

        letter-spacing: -0.8px;
    }

    .sst-research-header p {

        margin-top: 17px;

        font-size: 13px;

        line-height: 1.7;
    }


    /* FEATURE */

    .sst-research-feature {

        border-radius: 22px;
    }

    .sst-research-feature-content {

        padding: 30px 21px 27px;
    }

    .sst-research-feature-label {

        font-size: 7.5px;

        letter-spacing: 1.2px;
    }

    .sst-research-feature-label i {

        width: 27px;
        height: 27px;
    }

    .sst-research-feature-content h3 {

        margin-top: 20px;

        font-size: 29px;

        line-height: 1.15;
    }

    .sst-research-feature-content p {

        font-size: 11.5px;

        line-height: 1.72;
    }

    .sst-research-button {

        margin-top: 10px;

        padding: 11px 14px;

        font-size: 9px;
    }


    /* VISUAL */

    .sst-research-feature-visual {

        min-height: 290px;
    }

    .sst-research-main-icon {

        width: 82px;
        height: 82px;

        border-radius: 23px;
    }

    .sst-research-main-icon i {

        font-size: 32px;
    }

    .circle-one {

        width: 220px;
        height: 220px;
    }

    .circle-two {

        width: 155px;
        height: 155px;
    }

    .circle-three {

        width: 95px;
        height: 95px;
    }

    .card-top {

        top: 38px;
        right: 12px;
    }

    .card-bottom {

        bottom: 38px;
        left: 12px;
    }

    .sst-research-floating-card {

        padding: 8px 10px;
    }

    .sst-research-floating-card > i {

        width: 27px;
        height: 27px;
    }


    /* PILLARS */

    .sst-research-pillars {

        margin-top: 52px;
    }

    .sst-research-pillar-heading {

        display: block;

        margin-bottom: 20px;
    }

    .sst-research-pillar-heading h3 {

        font-size: 24px;
    }

    .sst-research-pillar-grid {

        grid-template-columns: 1fr;

        gap: 10px;
    }

    .sst-research-pillar {

        min-height: 205px;

        padding: 20px 18px;

        border-radius: 17px;
    }

    .sst-research-pillar-top {

        margin-bottom: 20px;
    }


    /* ECOSYSTEM */

    .sst-research-ecosystem {

        margin-top: 15px;

        padding: 21px 17px;

        border-radius: 19px;
    }

    .sst-research-eco-intro h3 {

        font-size: 20px;
    }

    .sst-research-flow {

        grid-template-columns: 1fr;

        gap: 7px;
    }

    .sst-research-flow-item {

        min-height: 57px;
    }


    /* CLOSING */

    .sst-research-closing {

        grid-template-columns: 1fr;

        gap: 13px;

        margin-top: 45px;
    }

    .sst-research-closing-icon {

        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .sst-research-closing p {

        font-size: 16px;

        line-height: 1.6;
    }

}


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

@media (max-width: 420px) {

    .sst-research-header h2 {

        font-size: 31px;
    }

    .sst-research-feature-content h3 {

        font-size: 26px;
    }

    .sst-research-pillar-heading h3 {

        font-size: 22px;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

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

    .sst-research *,
    .sst-research *::before,
    .sst-research *::after {

        animation: none !important;
        transition: none !important;
    }

}



/* =========================================================
   TADIKELA SUBBAIAH TRUST
   INSTITUTIONS — PREMIUM UI / UX
========================================================= */

.sst-institutions {
    position: relative;
    padding: 110px 0 105px;
    background:
        radial-gradient(
            circle at 8% 12%,
            rgba(184, 137, 56, 0.09),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 82%,
            rgba(134, 31, 31, 0.07),
            transparent 30%
        ),
        #fffaf1;

    overflow: hidden;
}


/* Decorative background */

.sst-institutions::before {
    content: "";
    position: absolute;

    width: 420px;
    height: 420px;

    border: 1px solid rgba(184, 137, 56, 0.12);
    border-radius: 50%;

    top: -210px;
    right: -150px;

    pointer-events: none;
}

.sst-institutions::after {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    border: 1px solid rgba(134, 31, 31, 0.08);
    border-radius: 50%;

    bottom: -170px;
    left: -130px;

    pointer-events: none;
}


/* Container */

.sst-inst-container {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;

    position: relative;
    z-index: 2;
}


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

.sst-inst-heading {
    max-width: 760px;
    margin: 0 auto 55px;

    text-align: center;
}

.sst-inst-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 16px;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 3px;
    text-transform: uppercase;

    color: #861f1f;
}

.sst-inst-eyebrow::before,
.sst-inst-eyebrow::after {
    content: "";

    width: 28px;
    height: 1px;

    background: #b88938;
}


.sst-inst-heading h2 {
    margin: 0;

    color: #421014;

    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.12;

    font-weight: 700;
    letter-spacing: -1.3px;
}

.sst-inst-heading h2 span {
    display: block;

    margin-top: 5px;

    color: #a52a26;
}


.sst-inst-heading p {
    max-width: 680px;

    margin: 20px auto 0;

    color: #6f6762;

    font-size: 15px;
    line-height: 1.85;
}


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

.sst-inst-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 24px;
}


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

.sst-inst-card {
    position: relative;

    min-height: 465px;

    display: flex;
    flex-direction: column;

    padding: 28px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.98),
            rgba(255,250,241,0.96)
        );

    border: 1px solid rgba(134,31,31,0.10);

    border-radius: 24px;

    box-shadow:
        0 14px 40px rgba(66,16,20,0.06);

    overflow: hidden;

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.sst-inst-card::before {
    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(216,183,101,0.16),
            transparent 68%
        );

    top: -45px;
    right: -35px;

    transition: transform .5s ease;
}


.sst-inst-card::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #861f1f,
            #b88938,
            transparent
        );

    transform: scaleX(0);
    transform-origin: left;

    transition: transform .45s ease;
}


.sst-inst-card:hover {
    transform: translateY(-8px);

    border-color:
        rgba(184,137,56,0.35);

    box-shadow:
        0 25px 55px rgba(66,16,20,0.12);
}


.sst-inst-card:hover::before {
    transform: scale(1.5);
}


.sst-inst-card:hover::after {
    transform: scaleX(1);
}


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

.sst-inst-number {
    position: absolute;

    top: 22px;
    right: 25px;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 1.5px;

    color: rgba(134,31,31,0.35);
}


/* =========================================================
   LOGO AREA
========================================================= */

.sst-inst-logo {
    position: relative;

    width: 112px;
    height: 112px;

    margin-bottom: 27px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #ffffff;

    border-radius: 20px;

    border: 1px solid rgba(184,137,56,0.20);

    box-shadow:
        0 10px 25px rgba(66,16,20,0.07);

    overflow: hidden;
}


.sst-inst-logo::after {
    content: "";

    position: absolute;
    inset: 6px;

    border: 1px solid rgba(184,137,56,0.12);

    border-radius: 15px;

    pointer-events: none;
}


.sst-inst-logo img {
    width: 78%;
    height: 78%;

    object-fit: contain;

    position: relative;
    z-index: 1;

    transition: transform .4s ease;
}


.sst-inst-card:hover .sst-inst-logo img {
    transform: scale(1.06);
}


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

.sst-inst-content {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    flex: 1;
}


.sst-inst-tag {
    width: fit-content;

    display: inline-flex;

    margin-bottom: 13px;

    padding: 6px 10px;

    border-radius: 50px;

    background: rgba(134,31,31,0.07);

    color: #861f1f;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: 1.3px;
    text-transform: uppercase;
}


.sst-inst-content h3 {
    margin: 0 0 13px;

    color: #421014;

    font-size: 21px;
    line-height: 1.35;

    font-weight: 700;

    letter-spacing: -.3px;
}


.sst-inst-content p {
    margin: 0;

    color: #6f6762;

    font-size: 13.5px;
    line-height: 1.75;
}


/* =========================================================
   LINK
========================================================= */

.sst-inst-link {
    margin-top: auto;
    padding-top: 25px;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    width: fit-content;

    color: #861f1f;

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;

    transition:
        color .3s ease,
        gap .3s ease;
}


.sst-inst-link i {
    font-size: 11px;

    transition: transform .3s ease;
}


.sst-inst-link:hover {
    color: #b88938;
    gap: 13px;
}


.sst-inst-link:hover i {
    transform: translate(2px,-2px);
}


/* Coming Soon */

.sst-inst-disabled {
    color: #9b928c;
    cursor: default;
}

.sst-inst-disabled:hover {
    color: #9b928c;
    gap: 10px;
}

.sst-inst-disabled:hover i {
    transform: none;
}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.sst-inst-bottom {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 22px;

    margin-top: 58px;
}


.sst-inst-bottom-line {
    width: 80px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #b88938
        );
}


.sst-inst-bottom-line:last-child {
    background:
        linear-gradient(
            90deg,
            #b88938,
            transparent
        );
}


.sst-inst-bottom p {
    margin: 0;

    color: #6f6762;

    text-align: center;

    font-size: 13px;
    line-height: 1.6;
}


.sst-inst-bottom strong {
    color: #861f1f;
}


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

@media (max-width: 1050px) {

    .sst-inst-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .sst-inst-card {
        min-height: 445px;
    }
}


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

@media (max-width: 680px) {

    .sst-institutions {
        padding: 75px 0 70px;
    }

    .sst-inst-container {
        width: min(100% - 28px, 520px);
    }

    .sst-inst-heading {
        margin-bottom: 38px;
    }

    .sst-inst-eyebrow {
        font-size: 9px;
        letter-spacing: 2px;
    }

    .sst-inst-eyebrow::before,
    .sst-inst-eyebrow::after {
        width: 18px;
    }

    .sst-inst-heading h2 {
        font-size: 32px;
        letter-spacing: -.8px;
    }

    .sst-inst-heading p {
        font-size: 13px;
        line-height: 1.75;
        margin-top: 15px;
    }

    .sst-inst-grid {
        grid-template-columns: 1fr;
        gap: 17px;
    }

    .sst-inst-card {
        min-height: auto;

        padding: 21px;

        border-radius: 19px;
    }

    .sst-inst-number {
        top: 18px;
        right: 20px;

        font-size: 10px;
    }

    .sst-inst-logo {
        width: 82px;
        height: 82px;

        margin-bottom: 19px;

        border-radius: 16px;
    }

    .sst-inst-logo img {
        width: 72%;
        height: 72%;
    }

    .sst-inst-tag {
        font-size: 8px;
        letter-spacing: 1px;

        padding: 5px 8px;
    }

    .sst-inst-content h3 {
        font-size: 18px;
        line-height: 1.35;

        margin-bottom: 9px;
    }

    .sst-inst-content p {
        font-size: 12.5px;
        line-height: 1.7;
    }

    .sst-inst-link {
        padding-top: 20px;

        font-size: 11px;
    }

    .sst-inst-bottom {
        margin-top: 38px;
        gap: 12px;
    }

    .sst-inst-bottom-line {
        width: 35px;
    }

    .sst-inst-bottom p {
        font-size: 11px;
    }
}


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

@media (max-width: 380px) {

    .sst-inst-heading h2 {
        font-size: 29px;
    }

    .sst-inst-card {
        padding: 18px;
    }

    .sst-inst-content h3 {
        font-size: 17px;
    }

    .sst-inst-content p {
        font-size: 12px;
    }
}



/* =========================================================
   TADIKELA SUBBAIAH TRUST
   HOSPITALS & HEALTHCARE
   PREMIUM RESPONSIVE UI/UX
========================================================= */

.sst-hospitals {
    position: relative;

    padding: 115px 0 110px;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(184,137,56,0.09),
            transparent 28%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(134,31,31,0.10),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #421014 0%,
            #521419 45%,
            #341012 100%
        );

    overflow: hidden;
}


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

.sst-hospitals::before {
    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    border: 1px solid rgba(216,183,101,0.12);

    border-radius: 50%;

    top: -280px;
    right: -170px;

    pointer-events: none;
}


.sst-hospitals::after {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    border: 1px solid rgba(255,255,255,0.05);

    border-radius: 50%;

    bottom: -220px;
    left: -170px;

    pointer-events: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-hospital-container {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    position: relative;

    z-index: 2;
}


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

.sst-hospital-heading {
    max-width: 790px;

    margin: 0 auto 58px;

    text-align: center;
}


.sst-hospital-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 17px;

    color: #d8b765;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.sst-hospital-eyebrow::before,
.sst-hospital-eyebrow::after {
    content: "";

    width: 28px;
    height: 1px;

    background: #b88938;
}


.sst-hospital-heading h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(35px, 4vw, 52px);

    line-height: 1.12;

    letter-spacing: -1.4px;

    font-weight: 700;
}


.sst-hospital-heading h2 span {
    display: block;

    margin-top: 5px;

    color: #d8b765;
}


.sst-hospital-heading p {
    max-width: 690px;

    margin: 20px auto 0;

    color: rgba(255,255,255,0.68);

    font-size: 14px;

    line-height: 1.85;
}


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

.sst-hospital-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 22px;
}


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

.sst-hospital-card {
    position: relative;

    min-height: 385px;

    display: flex;
    flex-direction: column;

    padding: 29px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.095),
            rgba(255,255,255,0.045)
        );

    border: 1px solid rgba(216,183,101,0.20);

    border-radius: 23px;

    box-shadow:
        0 20px 45px rgba(0,0,0,0.18);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    overflow: hidden;

    transition:
        transform .4s ease,
        border-color .4s ease,
        box-shadow .4s ease;
}


.sst-hospital-card::before {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    right: -70px;
    top: -70px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(216,183,101,0.17),
            transparent 70%
        );

    transition: transform .5s ease;
}


.sst-hospital-card::after {
    content: "";

    position: absolute;

    bottom: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #b88938,
            #ead49e,
            transparent
        );

    transform: scaleX(0);

    transform-origin: left;

    transition: transform .45s ease;
}


.sst-hospital-card:hover {
    transform: translateY(-8px);

    border-color:
        rgba(216,183,101,0.48);

    box-shadow:
        0 30px 60px rgba(0,0,0,0.25);
}


.sst-hospital-card:hover::before {
    transform: scale(1.45);
}


.sst-hospital-card:hover::after {
    transform: scaleX(1);
}


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

.sst-hospital-featured {
    background:
        linear-gradient(
            145deg,
            rgba(184,137,56,0.18),
            rgba(255,255,255,0.055)
        );

    border-color:
        rgba(216,183,101,0.34);
}


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

.sst-hospital-number {
    position: absolute;

    top: 21px;
    right: 25px;

    color: rgba(216,183,101,0.45);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;
}


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

.sst-hospital-icon {
    position: relative;

    width: 66px;
    height: 66px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 24px;

    color: #d8b765;

    background:
        rgba(255,255,255,0.08);

    border:
        1px solid rgba(216,183,101,0.25);

    border-radius: 18px;

    font-size: 25px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.08),
        0 12px 25px rgba(0,0,0,0.13);

    transition:
        transform .4s ease,
        background .4s ease;
}


.sst-hospital-card:hover .sst-hospital-icon {
    transform: translateY(-3px) scale(1.04);

    background:
        rgba(184,137,56,0.16);
}


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

.sst-hospital-content {
    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    flex: 1;
}


.sst-hospital-tag {
    width: fit-content;

    display: inline-flex;

    margin-bottom: 12px;

    padding: 6px 10px;

    border-radius: 50px;

    background:
        rgba(216,183,101,0.10);

    border:
        1px solid rgba(216,183,101,0.13);

    color: #d8b765;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.4px;

    text-transform: uppercase;
}


.sst-hospital-content h3 {
    margin: 0 0 13px;

    color: #ffffff;

    font-size: 20px;

    line-height: 1.4;

    font-weight: 700;

    letter-spacing: -.25px;
}


.sst-hospital-content p {
    margin: 0;

    color: rgba(255,255,255,0.64);

    font-size: 13px;

    line-height: 1.75;
}


/* =========================================================
   META
========================================================= */

.sst-hospital-meta {
    display: flex;

    flex-wrap: wrap;

    gap: 9px;

    margin-top: 19px;
}


.sst-hospital-meta span {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    color: rgba(255,255,255,0.60);

    font-size: 9px;

    font-weight: 600;
}


.sst-hospital-meta i {
    color: #d8b765;

    font-size: 10px;
}


/* =========================================================
   LINK
========================================================= */

.sst-hospital-link {
    width: fit-content;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top: auto;

    padding-top: 24px;

    color: #d8b765;

    font-size: 11px;

    font-weight: 800;

    text-decoration: none;

    transition:
        color .3s ease,
        gap .3s ease;
}


.sst-hospital-link i {
    font-size: 10px;

    transition: transform .3s ease;
}


.sst-hospital-link:hover {
    color: #ffffff;

    gap: 14px;
}


.sst-hospital-link:hover i {
    transform: translateX(3px);
}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.sst-hospital-bottom {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 17px;

    max-width: 750px;

    margin: 57px auto 0;

    padding: 20px 25px;

    background:
        rgba(255,255,255,0.045);

    border:
        1px solid rgba(216,183,101,0.14);

    border-radius: 16px;
}


.sst-hospital-bottom-icon {
    flex: 0 0 auto;

    width: 39px;
    height: 39px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background:
        rgba(184,137,56,0.14);

    border:
        1px solid rgba(216,183,101,0.20);

    color: #d8b765;

    font-size: 15px;
}


.sst-hospital-bottom strong {
    display: block;

    margin-bottom: 3px;

    color: #ffffff;

    font-size: 13px;
}


.sst-hospital-bottom span {
    color: rgba(255,255,255,0.55);

    font-size: 11px;

    line-height: 1.6;
}


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

@media (max-width: 1050px) {

    .sst-hospital-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .sst-hospital-card {
        min-height: 370px;
    }
}


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

@media (max-width: 680px) {

    .sst-hospitals {
        padding: 78px 0 72px;
    }

    .sst-hospital-container {
        width: min(100% - 28px, 520px);
    }

    .sst-hospital-heading {
        margin-bottom: 39px;
    }

    .sst-hospital-eyebrow {
        font-size: 8px;

        letter-spacing: 2px;
    }

    .sst-hospital-eyebrow::before,
    .sst-hospital-eyebrow::after {
        width: 18px;
    }

    .sst-hospital-heading h2 {
        font-size: 32px;

        letter-spacing: -.8px;
    }

    .sst-hospital-heading p {
        margin-top: 15px;

        font-size: 12.5px;

        line-height: 1.75;
    }

    .sst-hospital-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }

    .sst-hospital-card {
        min-height: auto;

        padding: 22px;

        border-radius: 19px;
    }

    .sst-hospital-number {
        top: 18px;
        right: 20px;

        font-size: 9px;
    }

    .sst-hospital-icon {
        width: 55px;
        height: 55px;

        margin-bottom: 18px;

        border-radius: 15px;

        font-size: 21px;
    }

    .sst-hospital-tag {
        padding: 5px 8px;

        margin-bottom: 9px;

        font-size: 7.5px;

        letter-spacing: 1px;
    }

    .sst-hospital-content h3 {
        font-size: 18px;

        line-height: 1.35;

        margin-bottom: 9px;
    }

    .sst-hospital-content p {
        font-size: 12px;

        line-height: 1.7;
    }

    .sst-hospital-meta {
        margin-top: 15px;

        gap: 7px;
    }

    .sst-hospital-meta span {
        font-size: 8px;
    }

    .sst-hospital-link {
        padding-top: 19px;

        font-size: 10px;
    }

    .sst-hospital-bottom {
        align-items: flex-start;

        margin-top: 38px;

        padding: 17px;

        gap: 12px;
    }

    .sst-hospital-bottom-icon {
        width: 34px;
        height: 34px;

        border-radius: 10px;

        font-size: 12px;
    }

    .sst-hospital-bottom strong {
        font-size: 11px;
    }

    .sst-hospital-bottom span {
        font-size: 9.5px;
    }
}


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

@media (max-width: 380px) {

    .sst-hospital-heading h2 {
        font-size: 29px;
    }

    .sst-hospital-card {
        padding: 19px;
    }

    .sst-hospital-content h3 {
        font-size: 17px;
    }

    .sst-hospital-content p {
        font-size: 11.5px;
    }
}


/* =========================================================
   TADIKELA SUBBAIAH TRUST
   OUR IMPACT & JOURNEY
   PREMIUM RESPONSIVE UI/UX
========================================================= */

.sst-impact {
    position: relative;

    padding: 95px 0 90px;

    background:
        radial-gradient(
            circle at 12% 15%,
            rgba(184,137,56,0.10),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 85%,
            rgba(134,31,31,0.07),
            transparent 30%
        ),
        #fffaf1;

    overflow: hidden;
}


/* Decorative circles */

.sst-impact::before {
    content: "";

    position: absolute;

    width: 380px;
    height: 380px;

    border: 1px solid rgba(184,137,56,0.12);

    border-radius: 50%;

    top: -220px;
    left: -160px;

    pointer-events: none;
}


.sst-impact::after {
    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    border: 1px solid rgba(134,31,31,0.08);

    border-radius: 50%;

    bottom: -180px;
    right: -130px;

    pointer-events: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.sst-impact-container {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    position: relative;

    z-index: 2;
}


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

.sst-impact-heading {
    max-width: 750px;

    margin: 0 auto 48px;

    text-align: center;
}


.sst-impact-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 15px;

    color: #861f1f;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2.8px;

    text-transform: uppercase;
}


.sst-impact-eyebrow::before,
.sst-impact-eyebrow::after {
    content: "";

    width: 26px;
    height: 1px;

    background: #b88938;
}


.sst-impact-heading h2 {
    margin: 0;

    color: #421014;

    font-size: clamp(33px, 4vw, 48px);

    line-height: 1.13;

    letter-spacing: -1.1px;

    font-weight: 700;
}


.sst-impact-heading h2 span {
    display: block;

    margin-top: 4px;

    color: #a52a26;
}


.sst-impact-heading p {
    max-width: 650px;

    margin: 17px auto 0;

    color: #6f6762;

    font-size: 13.5px;

    line-height: 1.8;
}


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

.sst-impact-grid {
    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 14px;
}


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

.sst-impact-card {
    position: relative;

    min-height: 310px;

    display: flex;

    flex-direction: column;

    padding: 23px 20px;

    background:
        rgba(255,255,255,0.82);

    border: 1px solid rgba(134,31,31,0.10);

    border-radius: 19px;

    box-shadow:
        0 12px 32px rgba(66,16,20,0.055);

    overflow: hidden;

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.sst-impact-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #861f1f,
            #b88938,
            transparent
        );

    transform: scaleX(0);

    transform-origin: left;

    transition: transform .45s ease;
}


.sst-impact-card:hover {
    transform: translateY(-7px);

    border-color:
        rgba(184,137,56,0.32);

    box-shadow:
        0 22px 45px rgba(66,16,20,0.11);
}


.sst-impact-card:hover::before {
    transform: scaleX(1);
}


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

.sst-impact-icon {
    width: 54px;
    height: 54px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 23px;

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            rgba(134,31,31,0.08),
            rgba(184,137,56,0.13)
        );

    border:
        1px solid rgba(184,137,56,0.18);

    color: #861f1f;

    font-size: 21px;

    transition:
        transform .35s ease,
        background .35s ease;
}


.sst-impact-card:hover .sst-impact-icon {
    transform: scale(1.06);

    background:
        linear-gradient(
            145deg,
            rgba(134,31,31,0.13),
            rgba(184,137,56,0.18)
        );
}


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

.sst-impact-content {
    position: relative;

    flex: 1;
}


.sst-impact-number {
    position: absolute;

    top: -3px;
    right: 0;

    color: rgba(134,31,31,0.22);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.sst-impact-content h3 {
    max-width: 150px;

    margin: 0 0 12px;

    padding-right: 15px;

    color: #421014;

    font-size: 17px;

    line-height: 1.35;

    font-weight: 700;
}


.sst-impact-content p {
    margin: 0;

    color: #746b66;

    font-size: 11.5px;

    line-height: 1.75;
}


/* =========================================================
   ARROW
========================================================= */

.sst-impact-arrow {
    width: 30px;
    height: 30px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-top: 20px;

    border-radius: 50%;

    background: #fffaf1;

    border: 1px solid rgba(184,137,56,0.22);

    color: #861f1f;

    font-size: 9px;

    transition:
        transform .35s ease,
        background .35s ease,
        color .35s ease;
}


.sst-impact-card:hover .sst-impact-arrow {
    transform: translateX(4px);

    background: #861f1f;

    color: #ffffff;
}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.sst-impact-bottom {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 18px;

    margin-top: 42px;
}


.sst-impact-bottom-line {
    width: 65px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #b88938
        );
}


.sst-impact-bottom-line:last-child {
    background:
        linear-gradient(
            90deg,
            #b88938,
            transparent
        );
}


.sst-impact-bottom > span:nth-child(2) {
    display: flex;

    align-items: center;

    gap: 10px;

    color: #6f6762;

    font-size: 11px;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.sst-impact-bottom strong {
    color: #861f1f;

    font-weight: 800;
}


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

@media (max-width: 1050px) {

    .sst-impact-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .sst-impact-card {
        min-height: 285px;
    }
}


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

@media (max-width: 680px) {

    .sst-impact {
        padding: 75px 0 70px;
    }

    .sst-impact-container {
        width: min(100% - 28px, 520px);
    }

    .sst-impact-heading {
        margin-bottom: 34px;
    }

    .sst-impact-eyebrow {
        font-size: 8px;

        letter-spacing: 2px;
    }

    .sst-impact-eyebrow::before,
    .sst-impact-eyebrow::after {
        width: 18px;
    }

    .sst-impact-heading h2 {
        font-size: 31px;

        letter-spacing: -.8px;
    }

    .sst-impact-heading p {
        margin-top: 14px;

        font-size: 12px;

        line-height: 1.75;
    }

    .sst-impact-grid {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .sst-impact-card {
        min-height: auto;

        display: grid;

        grid-template-columns: 52px 1fr 30px;

        column-gap: 14px;

        align-items: start;

        padding: 18px;

        border-radius: 17px;
    }

    .sst-impact-icon {
        width: 52px;
        height: 52px;

        margin: 0;

        border-radius: 14px;

        font-size: 19px;
    }

    .sst-impact-content {
        min-width: 0;
    }

    .sst-impact-number {
        display: none;
    }

    .sst-impact-content h3 {
        max-width: none;

        margin: 0 0 6px;

        padding: 0;

        font-size: 16px;
    }

    .sst-impact-content p {
        font-size: 11px;

        line-height: 1.65;
    }

    .sst-impact-arrow {
        margin: 10px 0 0;

        width: 28px;
        height: 28px;
    }

    .sst-impact-bottom {
        margin-top: 32px;

        gap: 10px;
    }

    .sst-impact-bottom-line {
        width: 25px;
    }

    .sst-impact-bottom > span:nth-child(2) {
        gap: 6px;

        font-size: 8px;
    }
}


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

@media (max-width: 380px) {

    .sst-impact-heading h2 {
        font-size: 28px;
    }

    .sst-impact-card {
        grid-template-columns: 46px 1fr 28px;

        column-gap: 11px;

        padding: 15px;
    }

    .sst-impact-icon {
        width: 46px;
        height: 46px;

        font-size: 17px;
    }

    .sst-impact-content h3 {
        font-size: 14px;
    }

    .sst-impact-content p {
        font-size: 10px;
    }
}

/* =========================================================
   TADIKELA SUBBAIAH TRUST
   PREMIUM FOOTER
========================================================= */

.sst-footer {
    position: relative;

    background:
        linear-gradient(
            145deg,
            #2d0b0e 0%,
            #421014 45%,
            #26090c 100%
        );

    color: #ffffff;

    overflow: hidden;
}


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

.sst-footer::before {
    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    top: -300px;
    right: -160px;

    border:
        1px solid rgba(216,183,101,0.10);

    border-radius: 50%;

    pointer-events: none;
}


.sst-footer::after {
    content: "";

    position: absolute;

    width: 320px;
    height: 320px;

    bottom: -230px;
    left: -150px;

    border:
        1px solid rgba(216,183,101,0.07);

    border-radius: 50%;

    pointer-events: none;
}


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

.sst-footer-main {
    position: relative;

    padding: 75px 0 62px;

    z-index: 2;
}


.sst-footer-container {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        1.45fr
        .8fr
        1fr
        1fr;

    gap: 55px;
}


/* =========================================================
   BRAND
========================================================= */

.sst-footer-brand {
    max-width: 310px;
}


.sst-footer-logo {
    display: inline-flex;

    align-items: center;

    gap: 13px;

    text-decoration: none;
}


.sst-footer-logo-mark {
    width: 54px;
    height: 54px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background:
        linear-gradient(
            145deg,
            #d8b765,
            #a8792d
        );

    color: #421014;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.20);
}


.sst-footer-logo-mark span {
    font-family: Georgia, serif;

    font-size: 18px;

    font-weight: 800;

    letter-spacing: -1px;
}


.sst-footer-logo-text {
    display: flex;

    flex-direction: column;
}


.sst-footer-logo-text strong {
    color: #ffffff;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: .8px;
}


.sst-footer-logo-text span {
    margin-top: 3px;

    color: #d8b765;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 3px;
}


.sst-footer-description {
    margin: 22px 0 25px;

    color:
        rgba(255,255,255,0.60);

    font-size: 12px;

    line-height: 1.8;
}


/* =========================================================
   SOCIAL
========================================================= */

.sst-footer-social {
    display: flex;

    align-items: center;

    gap: 9px;
}


.sst-footer-social a {
    width: 36px;
    height: 36px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background:
        rgba(255,255,255,0.06);

    border:
        1px solid rgba(216,183,101,0.17);

    color: #d8b765;

    font-size: 13px;

    text-decoration: none;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease;
}


.sst-footer-social a:hover {
    transform: translateY(-3px);

    background: #b88938;

    color: #421014;

    border-color: #b88938;
}


/* =========================================================
   COLUMNS
========================================================= */

.sst-footer-column h3 {
    margin: 2px 0 10px;

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;

    letter-spacing: .3px;
}


.sst-footer-heading-line {
    display: block;

    width: 32px;
    height: 2px;

    margin-bottom: 20px;

    background:
        linear-gradient(
            90deg,
            #b88938,
            transparent
        );
}


/* =========================================================
   NAVIGATION
========================================================= */

.sst-footer-column ul {
    margin: 0;
    padding: 0;

    list-style: none;
}


.sst-footer-column li {
    margin-bottom: 10px;
}


.sst-footer-column li a {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color:
        rgba(255,255,255,0.57);

    font-size: 11px;

    text-decoration: none;

    transition:
        color .3s ease,
        transform .3s ease;
}


.sst-footer-column li a i {
    color: #b88938;

    font-size: 8px;
}


.sst-footer-column li a:hover {
    color: #ffffff;

    transform: translateX(4px);
}


/* =========================================================
   ADDRESS
========================================================= */

.sst-footer-contact-item {
    display: flex;

    align-items: flex-start;

    gap: 12px;
}


.sst-footer-contact-icon {
    flex: 0 0 auto;

    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background:
        rgba(216,183,101,0.09);

    border:
        1px solid rgba(216,183,101,0.15);

    color: #d8b765;

    font-size: 11px;
}


.sst-footer-contact-item strong {
    display: block;

    margin-bottom: 6px;

    color: #ffffff;

    font-size: 11px;
}


.sst-footer-contact-item p {
    margin: 0;

    color:
        rgba(255,255,255,0.56);

    font-size: 11px;

    line-height: 1.75;
}


/* =========================================================
   PHONE
========================================================= */

.sst-footer-phone {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    margin-bottom: 22px;
}


.sst-footer-phone-icon {
    flex: 0 0 auto;

    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background:
        rgba(216,183,101,0.09);

    border:
        1px solid rgba(216,183,101,0.15);

    color: #d8b765;

    font-size: 11px;
}


.sst-footer-phone span {
    display: block;

    margin-bottom: 5px;

    color: #ffffff;

    font-size: 10px;

    font-weight: 700;
}


.sst-footer-phone span small {
    color: #d8b765;

    font-size: 8px;

    font-weight: 600;
}


.sst-footer-phone a {
    display: block;

    width: fit-content;

    margin-bottom: 2px;

    color:
        rgba(255,255,255,0.57);

    font-size: 10.5px;

    text-decoration: none;

    transition: color .3s ease;
}


.sst-footer-phone a:hover {
    color: #d8b765;
}


/* =========================================================
   DIVIDER
========================================================= */

.sst-footer-divider {
    position: relative;

    z-index: 2;

    width: min(1180px, calc(100% - 40px));

    height: 1px;

    margin: 0 auto;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(216,183,101,0.38),
            transparent
        );
}


/* =========================================================
   BOTTOM
========================================================= */

.sst-footer-bottom {
    position: relative;

    z-index: 2;

    padding: 19px 0;

    background:
        rgba(0,0,0,0.14);
}


.sst-footer-bottom-container {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;
}


.sst-footer-bottom p {
    margin: 0;

    color:
        rgba(255,255,255,0.42);

    font-size: 9.5px;
}


.sst-footer-bottom strong {
    color:
        rgba(255,255,255,0.70);
}


.sst-footer-location {
    display: flex;

    align-items: center;

    gap: 6px;
}


.sst-footer-location i {
    color: #b88938;

    font-size: 9px;
}


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

@media (max-width: 1000px) {

    .sst-footer-container {
        grid-template-columns:
            1.3fr 1fr 1fr;

        gap: 38px;
    }

    .sst-footer-brand {
        grid-column: 1 / -1;

        max-width: 600px;
    }
}


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

@media (max-width: 680px) {

    .sst-footer-main {
        padding: 55px 0 42px;
    }

    .sst-footer-container {
        width: min(100% - 30px, 520px);

        grid-template-columns: 1fr;

        gap: 31px;
    }

    .sst-footer-brand {
        max-width: 100%;
    }

    .sst-footer-description {
        margin: 17px 0 20px;

        font-size: 11px;

        line-height: 1.75;
    }

    .sst-footer-logo-mark {
        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .sst-footer-logo-text strong {
        font-size: 12px;
    }

    .sst-footer-logo-text span {
        font-size: 8px;
    }

    .sst-footer-column h3 {
        font-size: 13px;
    }

    .sst-footer-heading-line {
        margin-bottom: 14px;
    }

    .sst-footer-column li {
        margin-bottom: 8px;
    }

    .sst-footer-column li a {
        font-size: 10.5px;
    }

    .sst-footer-contact-item {
        gap: 10px;
    }

    .sst-footer-contact-item p {
        font-size: 10.5px;
    }

    .sst-footer-phone {
        margin-bottom: 17px;
    }

    .sst-footer-phone a {
        font-size: 10px;
    }

    .sst-footer-divider {
        width: calc(100% - 30px);
    }

    .sst-footer-bottom {
        padding: 16px 0;
    }

    .sst-footer-bottom-container {
        width: calc(100% - 30px);

        flex-direction: column;

        justify-content: center;

        text-align: center;

        gap: 7px;
    }

    .sst-footer-bottom p {
        font-size: 8.5px;
    }
}

/* =========================================================
   HEGSAR SOFTWARE CREDIT
========================================================= */

.sst-footer-credit {
    display: flex;

    align-items: center;

    gap: 5px;

    white-space: nowrap;

    font-size: 9.5px;

    color: rgba(255,255,255,0.38);
}


.sst-footer-credit a {
    display: inline-flex;

    align-items: center;

    gap: 5px;

    color: #d8b765;

    text-decoration: none;

    font-weight: 700;

    transition:
        color .3s ease,
        transform .3s ease;
}


.sst-footer-credit a i {
    font-size: 8px;
}


.sst-footer-credit a:hover {
    color: #ffffff;

    transform: translateY(-1px);
}


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

@media (max-width: 680px) {

    .sst-footer-credit {
        justify-content: center;

        font-size: 8.5px;

        white-space: normal;

        text-align: center;
    }

    .sst-footer-credit a {
        font-size: 9px;
    }

}




/* =========================================================
   MOBILE / TABLET QUICK LINKS
   SEPARATE FROM HEADER QUICK LINKS
========================================================= */


/* Desktop — completely hidden */

.sst-mobile-quick {
    display: none;
}


/* =========================================================
   TABLET + MOBILE
========================================================= */

@media (max-width: 768px) {

    .sst-mobile-quick {

        display: block;

        position: fixed;

        left: 0;
        top: 50%;

        transform: translateY(-50%);

        z-index: 10001;
    }


    /* =====================================================
       FLOATING BUTTON
    ===================================================== */

    .sst-mobile-quick-btn {

        position: relative;

        width: 43px;

        min-height: 116px;

        padding: 9px 7px;

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

        gap: 7px;

        border: 1px solid rgba(216,183,101,0.65);

        border-left: 0;

        border-radius: 0 15px 15px 0;

        background:
            linear-gradient(
                145deg,
                #861f1f,
                #5d1518
            );

        color: #ffffff;

        box-shadow:
            5px 8px 25px rgba(66,16,20,0.25);

        cursor: pointer;

        transition:
            width .3s ease,
            background .3s ease,
            box-shadow .3s ease;
    }


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

    .sst-mobile-quick-icon {

        width: 27px;
        height: 27px;

        display: flex;

        align-items: center;
        justify-content: center;

        border-radius: 9px;

        background:
            rgba(255,255,255,0.13);

        color: #d8b765;

        font-size: 12px;
    }


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

    .sst-mobile-quick-text {

        writing-mode: vertical-rl;

        transform: rotate(180deg);

        color: #ffffff;

        font-size: 9px;

        font-weight: 800;

        letter-spacing: 1px;

        text-transform: uppercase;
    }


    /* =====================================================
       ARROW
    ===================================================== */

    .sst-mobile-quick-arrow {

        color: #d8b765;

        font-size: 7px;

        transition:
            transform .3s ease;
    }


    /* =====================================================
       HOVER
    ===================================================== */

    .sst-mobile-quick-btn:hover {

        width: 48px;

        background:
            linear-gradient(
                145deg,
                #a52a26,
                #6d171a
            );

        box-shadow:
            7px 10px 30px rgba(66,16,20,0.32);
    }


    /* =====================================================
       OPEN STATE
    ===================================================== */

    .sst-mobile-quick-btn[aria-expanded="true"] {

        background:
            linear-gradient(
                145deg,
                #5d1518,
                #421014
            );
    }


    .sst-mobile-quick-btn[aria-expanded="true"]
    .sst-mobile-quick-arrow {

        transform: rotate(180deg);
    }


    /* =====================================================
       HIDE DESKTOP HEADER QUICK BUTTON
       ON MOBILE / TABLET
    ===================================================== */

    #sstQuickOpen {

        display: none !important;
    }


    /* =====================================================
       EXISTING DRAWER
       KEEP IT RIGHT SIDE
    ===================================================== */

    #sstQuickDrawer {

        position: fixed !important;

        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;

        left: auto !important;

        width: min(88vw, 360px);

        height: 100vh;

        z-index: 10000 !important;

        transform: translateX(100%);

        transition:
            transform .4s cubic-bezier(.22,.61,.36,1);

        overflow-y: auto;

        -webkit-overflow-scrolling: touch;
    }


    /* Drawer open */

    #sstQuickDrawer.sst-quick-drawer-open,
    #sstQuickDrawer.active {

        transform: translateX(0);
    }


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

    #sstQuickOverlay {

        position: fixed !important;

        inset: 0 !important;

        z-index: 9999 !important;

        opacity: 0;

        visibility: hidden;

        background:
            rgba(35,8,11,0.55);

        backdrop-filter: blur(4px);

        -webkit-backdrop-filter: blur(4px);

        transition:
            opacity .3s ease,
            visibility .3s ease;
    }


    #sstQuickOverlay.active {

        opacity: 1;

        visibility: visible;
    }

}


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

@media (max-width: 480px) {

    .sst-mobile-quick {

        left: 0;
    }


    .sst-mobile-quick-btn {

        width: 40px;

        min-height: 105px;

        padding: 8px 6px;

        border-radius: 0 13px 13px 0;
    }


    .sst-mobile-quick-icon {

        width: 25px;
        height: 25px;

        font-size: 11px;
    }


    .sst-mobile-quick-text {

        font-size: 8px;

        letter-spacing: .8px;
    }


    .sst-mobile-quick-arrow {

        font-size: 6px;
    }

}


/* =========================================================
   HEALTHCARE QUICK LINK ICONS
========================================================= */

.sst-health-link .sst-quick-inst-icon {
    background: rgba(134, 31, 31, 0.07);
    color: #861f1f;
    border-color: rgba(134, 31, 31, 0.12);
}

.sst-health-link:hover .sst-quick-inst-icon {
    background: #861f1f;
    color: #ffffff;
}

.sst-health-title {
    margin-top: 24px;
}


/* Slightly smaller text for long hospital names */

.sst-health-link .sst-quick-inst-info strong {
    line-height: 1.3;
}

.sst-health-link .sst-quick-inst-info small {
    line-height: 1.4;
}


/* =========================================================
   TADIKELA SUBBAIAH TRUST
   PREMIUM COMING SOON MODAL
========================================================= */

.sst-coming-modal {

    position: fixed;

    inset: 0;

    z-index: 99999;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 20px;

    visibility: hidden;

    opacity: 0;

    transition:
        opacity .3s ease,
        visibility .3s ease;
}


/* =========================================================
   ACTIVE
========================================================= */

.sst-coming-modal.active {

    visibility: visible;

    opacity: 1;
}


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

.sst-coming-overlay {

    position: absolute;

    inset: 0;

    background:
        rgba(35, 8, 11, 0.72);

    backdrop-filter:
        blur(7px);

    -webkit-backdrop-filter:
        blur(7px);
}


/* =========================================================
   MODAL BOX
========================================================= */

.sst-coming-box {

    position: relative;

    z-index: 2;

    width: min(430px, 100%);

    padding: 38px 34px 32px;

    text-align: center;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #fff8ed
        );

    border:
        1px solid rgba(184,137,56,0.32);

    border-radius: 25px;

    box-shadow:
        0 35px 90px rgba(0,0,0,0.30),
        0 0 0 6px rgba(255,255,255,0.08);

    transform:
        translateY(18px) scale(.96);

    transition:
        transform .4s cubic-bezier(.22,.61,.36,1);
}


.sst-coming-modal.active
.sst-coming-box {

    transform:
        translateY(0) scale(1);
}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.sst-coming-box::before {

    content: "";

    position: absolute;

    top: 0;
    left: 12%;

    width: 76%;

    height: 3px;

    border-radius: 0 0 10px 10px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #b88938,
            #d8b765,
            #b88938,
            transparent
        );
}


/* =========================================================
   DECORATIVE CIRCLE
========================================================= */

.sst-coming-box::after {

    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    top: -100px;
    right: -100px;

    border:
        1px solid rgba(184,137,56,0.10);

    border-radius: 50%;

    pointer-events: none;
}


/* =========================================================
   CLOSE BUTTON
========================================================= */

.sst-coming-close {

    position: absolute;

    top: 15px;
    right: 15px;

    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(134,31,31,0.12);

    border-radius: 10px;

    background:
        rgba(134,31,31,0.045);

    color: #861f1f;

    font-size: 12px;

    cursor: pointer;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}


.sst-coming-close:hover {

    background: #861f1f;

    color: #ffffff;

    transform: rotate(90deg);
}


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

.sst-coming-icon {

    width: 78px;
    height: 78px;

    margin: 0 auto 20px;

    padding: 6px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(184,137,56,0.28);

    border-radius: 23px;

    background:
        linear-gradient(
            145deg,
            rgba(134,31,31,0.06),
            rgba(184,137,56,0.12)
        );

    box-shadow:
        0 12px 28px rgba(66,16,20,0.08);
}


.sst-coming-icon-inner {

    width: 100%;
    height: 100%;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #861f1f,
            #5d1518
        );

    color: #d8b765;

    font-size: 25px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.15);
}


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

.sst-coming-content {

    position: relative;

    z-index: 2;
}


.sst-coming-label {

    display: block;

    margin-bottom: 9px;

    color: #b88938;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


.sst-coming-content h3 {

    margin: 0;

    color: #421014;

    font-family: Georgia, "Times New Roman", serif;

    font-size: 29px;

    line-height: 1.2;

    font-weight: 700;
}


.sst-coming-content p {

    max-width: 320px;

    margin: 12px auto 0;

    color: #746b66;

    font-size: 12px;

    line-height: 1.75;
}


/* =========================================================
   DIVIDER
========================================================= */

.sst-coming-divider {

    width: 65px;

    height: 1px;

    margin: 22px auto;

    background:
        linear-gradient(
            90deg,
            transparent,
            #b88938,
            transparent
        );
}


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

.sst-coming-button {

    min-width: 190px;

    min-height: 43px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 10px 20px;

    border: 0;

    border-radius: 50px;

    background:
        linear-gradient(
            135deg,
            #861f1f,
            #5d1518
        );

    color: #ffffff;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .3px;

    cursor: pointer;

    box-shadow:
        0 10px 22px rgba(134,31,31,0.20);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.sst-coming-button i {

    color: #d8b765;

    font-size: 9px;

    transition:
        transform .3s ease;
}


.sst-coming-button:hover {

    transform: translateY(-2px);

    box-shadow:
        0 14px 28px rgba(134,31,31,0.28);
}


.sst-coming-button:hover i {

    transform: translateX(3px);
}


/* =========================================================
   BODY LOCK
========================================================= */

body.sst-modal-open {

    overflow: hidden;
}


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

@media (max-width: 480px) {

    .sst-coming-modal {

        padding: 16px;
    }


    .sst-coming-box {

        width: 100%;

        padding: 34px 23px 25px;

        border-radius: 21px;
    }


    .sst-coming-close {

        width: 31px;
        height: 31px;

        top: 12px;
        right: 12px;

        font-size: 11px;
    }


    .sst-coming-icon {

        width: 68px;
        height: 68px;

        margin-bottom: 17px;

        border-radius: 20px;
    }


    .sst-coming-icon-inner {

        border-radius: 15px;

        font-size: 22px;
    }


    .sst-coming-label {

        font-size: 7px;

        letter-spacing: 2px;
    }


    .sst-coming-content h3 {

        font-size: 25px;
    }


    .sst-coming-content p {

        font-size: 11px;

        line-height: 1.7;
    }


    .sst-coming-divider {

        margin: 19px auto;
    }


    .sst-coming-button {

        width: 100%;

        min-height: 42px;
    }

}



/* =========================================================
   RESEARCH QUICK LINK
========================================================= */

.sst-research-title {
    margin-top: 24px;
}


.sst-research-link .sst-quick-inst-icon {

    background:
        rgba(184,137,56,0.10);

    color: #b88938;

    border-color:
        rgba(184,137,56,0.20);
}


.sst-research-link:hover .sst-quick-inst-icon {

    background: #b88938;

    color: #421014;
}