:root {
    --text-color: #ffff;
    --Black-color: #000000;
    --Royal-purple: #4b248c;
    --Primary-Blue: #0047AB;
    --Gold-color: #F3CC3C;
    --Background-color: #f9f9f9;
    --nav-bg: rgba(255, 255, 255, 0.98);

    /* Spacing */
    --space-xs-v2: 0.5rem;
    --space-sm-v2: 1rem;
    --space-md-v2: 1.5rem;
    --space-lg-v2: 2rem;
    --space-xl-v2: 3rem;

    /* Fonts */
    --font-primary-v2: 'Open Sans', sans-serif;
    --font-heading-v2: 'Montserrat', sans-serif;
}
/* Root variables specific to Jewels program */
:root {
    --jm-primary: #4b248c;
    /* Royal Purple */
    --jm-accent: #F3CC3C;
    /* Gold */
    --jm-dark: #000000;
    /* Black */
    --jm-light: #FFFFFF;
    /* White */
    --jm-bg-light: #f9f9f9;
    --jm-text-dark: #333333;
    --jm-text-light: #FFFFFF;

    /* Spacing */
    --jm-space-xs: 0.5rem;
    --jm-space-sm: 1rem;
    --jm-space-md: 1.5rem;
    --jm-space-lg: 2rem;
    --jm-space-xl: 3rem;

    /* Fonts */
    --jm-font-main: 'Open Sans', sans-serif;
    --jm-font-heading: 'Montserrat', sans-serif;
}

/* Base Styles */
.jm-program-container {
    font-family: var(--jm-font-main);
    color: var(--jm-text-dark);
    line-height: 1.6;
}

.jm-content-wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--jm-space-md);
}

.section-spacing {
    padding: var(--jm-space-xl) 0;
}

.jm-light-bg {
    background-color: var(--jm-bg-light);
}

.jm-purple-bg {
    background-color: var(--jm-primary);
    color: var(--jm-text-light);
}

.centered-title {
    text-align: center;
}

.light-heading {
    color: var(--jm-text-light);
}

.jm-section-title {
    font-family: var(--jm-font-heading);
    font-size: 2.25rem;
    margin-bottom: var(--jm-space-md);
    color: var(--jm-primary);
    position: relative;
}

.jm-purple-bg .jm-section-title {
    color: var(--jm-text-light);
}

.jm-section-title:after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--jm-accent);
    margin: var(--jm-space-sm) auto;
}

.centered-title .jm-section-title:after {
    margin: var(--jm-space-sm) auto; }

/* Base Styles */


.tlm-page-v2 {
    font-family: var(--font-primary-v2);
    color: var(--Black-color);
    line-height: 1.6;
}

.container-v2 {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--space-md-v2);
}

.section-padding-v2 {
    padding: var(--space-xl-v2) 0;
}

.bg-light-v2 {
    background-color: var(--Background-color);
}

.bg-royal-purple-v2 {
    background-color: var(--Royal-purple);
    color: var(--text-color);
}

.text-center-v2 {
    text-align: center;
}

.light-text-v2 {
    color: var(--text-color);
}

.section-heading-v2 {
    font-family: var(--font-heading-v2);
    font-size: 2.25rem;
    margin-bottom: var(--space-md-v2);
    color: var(--Royal-purple);
    position: relative;
}

.bg-royal-purple-v2 .section-heading-v2 {
    color: var(--text-color);
}

.section-heading-v2:after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--Gold-color);
    margin: var(--space-sm-v2) auto;
}

.text-center-v2 .section-heading-v2:after {
    margin: var(--space-sm-v2) auto;
}

.section-subtitle-v2 {
    font-size: 1.25rem;
    max-width: 800px;
    margin: 0 auto var(--space-xl-v2);
    color: var(--Black-color);
}

.bg-royal-purple-v2 .section-subtitle-v2 {
    color: rgba(255, 255, 255, 0.9);
}

/* Hero Section Styles */
.tlm-hero-v2 {
    position: relative;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.background-carousel-v2 {
    position: absolute;
    width: 100%;
    height: 100%;
}

.background-slide-v2 {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.background-slide-v2.active {
    opacity: 1;
}

.overlay-v2 {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.tlm-hero-content-v2 {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0 var(--space-md-v2);
    color: var(--text-color);
}

.tlm-hero-content-v2 h1 {
    font-size: 3.5rem;
    margin-bottom: var(--space-md-v2);
    font-weight: 700;
}

.tlm-hero-content-v2 p {
    font-size: 1.5rem;
    max-width: 800px;
    margin-bottom: var(--space-xl-v2);
}

.carousel-nav-v2 {
    position: absolute;
    bottom: var(--space-xl-v2);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 3;
}

.carousel-dot-v2 {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    margin: 0 var(--space-xs-v2);
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.carousel-dot-v2.active {
    background-color: var(--text-color);
}

/* Button Styles */
.cta-btn-primary-v2,
.cta-btn-secondary-v2 {
    padding: var(--space-sm-v2) var(--space-lg-v2);
    border-radius: 50px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
}

.cta-btn-primary-v2 {
    background-color: var(--Gold-color);
    color: var(--Black-color);
}

.cta-btn-primary-v2:hover {
    background-color: #e0b82c;
    transform: translateY(-2px);
}

.cta-btn-secondary-v2 {
    background-color: transparent;
    color: var(--text-color);
    border: 2px solid var(--text-color);
    margin-left: var(--space-md-v2);
}

.cta-btn-secondary-v2:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

/* Intro Section Styles */
.tlm-intro-v2 {
    background-color: var(--text-color);
}

.intro-grid-v2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xl-v2);
    align-items: center;
}

.intro-image-v2 {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.img-elevated-v2 {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.intro-content-v2 h2 {
    margin-bottom: var(--space-md-v2);
}

.intro-text-v2 p {
    margin-bottom: var(--space-md-v2);
    font-size: 1.1rem;
    line-height: 1.8;
}

/* Challenges Section Styles */
.challenges-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-lg-v2);
    margin-top: var(--space-xl-v2);
}

.challenge-card-v2 {
    background-color: var(--text-color);
    border-radius: 8px;
    padding: var(--space-lg-v2);
    text-align: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.challenge-card-v2:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.challenge-icon-v2 {
    font-size: 2.5rem;
    color: var(--Royal-purple);
    margin-bottom: var(--space-md-v2);
}

.challenge-card-v2 h3 {
    color: var(--Royal-purple);
    margin-bottom: var(--space-sm-v2);
}

/* Mission Section Styles */
.mission-statement-v2 {
    font-size: 1.25rem;
    max-width: 800px;
    margin: 0 auto var(--space-xl-v2);
    line-height: 1.8;
}

.mission-points-v2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xl-v2);
    max-width: 1000px;
    margin: 0 auto;
}

.mission-point-v2 {
    background-color: rgba(255, 255, 255, 0.1);
    padding: var(--space-lg-v2);
    border-radius: 8px;
}

.mission-point-v2 h3 {
    color: var(--Gold-color);
    margin-bottom: var(--space-md-v2);
    font-size: 1.5rem;
}

/* Programs Section Styles */
.programs-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-lg-v2);
    margin-top: var(--space-xl-v2);
}

.program-card-v2 {
    perspective: 1000px;
    height: 300px;
}

.program-card-inner-v2 {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.program-card-v2:hover .program-card-inner-v2 {
    transform: rotateY(180deg);
}

.program-card-front-v2,
.program-card-back-v2 {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 8px;
    padding: var(--space-lg-v2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.program-card-front-v2 {
    background-color: var(--text-color);
    color: var(--Black-color);
    border: 2px solid var(--Royal-purple);
}

.program-card-back-v2 {
    background-color: var(--Royal-purple);
    color: var(--text-color);
    transform: rotateY(180deg);
}

.program-card-back-v2 h3 {
    color: var(--Gold-color);
    margin-bottom: var(--space-md-v2);
}

.program-card-back-v2 ul {
    text-align: left;
    padding-left: var(--space-md-v2);
}

.program-card-back-v2 li {
    margin-bottom: var(--space-sm-v2);
}

.program-icon-v2 {
    font-size: 3rem;
    color: var(--Royal-purple);
    margin-bottom: var(--space-md-v2);
}

/* Camp Experience Styles */
.camp-features-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-lg-v2);
    margin-bottom: var(--space-xl-v2);
}

.camp-feature-v2 {
    text-align: center;
    padding: var(--space-lg-v2);
    background-color: var(--text-color);
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.feature-icon-v2 {
    font-size: 2rem;
    color: var(--Royal-purple);
    margin-bottom: var(--space-md-v2);
}

.camp-feature-v2 h3 {
    color: var(--Royal-purple);
    margin-bottom: var(--space-sm-v2);
}

.camp-activities-box-v2 {
    background-color: var(--Royal-purple);
    color: var(--text-color);
    padding: var(--space-lg-v2);
    border-radius: 8px;
    margin-top: var(--space-xl-v2);
}

.camp-activities-box-v2 h3 {
    text-align: center;
    margin-bottom: var(--space-lg-v2);
    color: var(--Gold-color);
    font-size: 1.5rem;
}

.activities-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-md-v2);
}

.activity-item-v2 {
    display: flex;
    align-items: center;
    gap: var(--space-sm-v2);
}

.activity-item-v2 i {
    color: var(--Gold-color);
}

/* Testimonials Styles */
.testimonials-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--space-lg-v2);
    margin-top: var(--space-xl-v2);
}

.testimonial-card-v2 {
    background-color: var(--text-color);
    border-radius: 8px;
    padding: var(--space-lg-v2);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.testimonial-content-v2 {
    position: relative;
}

.quote-icon-v2 {
    font-size: 2rem;
    color: var(--Royal-purple);
    opacity: 0.3;
    margin-bottom: var(--space-md-v2);
}

.testimonial-author-v2 {
    font-style: italic;
    color: var(--Royal-purple);
    margin-top: var(--space-md-v2);
}

/* CTA Section Styles */
.cta-buttons-v2 {
    display: flex;
    justify-content: center;
    margin-top: var(--space-xl-v2);
}

/* Responsive Styles */
@media (max-width: 992px) {
    .intro-grid-v2 {
        grid-template-columns: 1fr;
    }

    .intro-image-v2 {
        max-width: 600px;
        margin: 0 auto;
    }

    .mission-points-v2 {
        grid-template-columns: 1fr;
        gap: var(--space-lg-v2);
    }
}

@media (max-width: 768px) {
    .tlm-hero-content-v2 h1 {
        font-size: 2.5rem;
    }

    .tlm-hero-content-v2 p {
        font-size: 1.2rem;
    }

    .cta-buttons-v2 {
        flex-direction: column;
        align-items: center;
    }

    .cta-btn-secondary-v2 {
        margin-left: 0;
        margin-top: var(--space-md-v2);
    }
}

@media (max-width: 576px) {
    .section-heading-v2 {
        font-size: 1.75rem;
    }

    .section-subtitle-v2 {
        font-size: 1.1rem;
    }

    .tlm-hero-content-v2 h1 {
        font-size: 2rem;
    }

    .tlm-hero-content-v2 p {
        font-size: 1rem;
    }
}

/*JEWELS PAGE OFFICIAL*/

/* Hero Section Styles */
.jm-hero-banner {
    position: relative;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.jm-slideshow {
    position: absolute;
    width: 100%;
    height: 100%;
}

.jm-slide {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.jm-slide.current-slide {
    opacity: 1;
}

.jm-overlay-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.jm-hero-main {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0 var(--jm-space-md);
    color: var(--jm-text-light);
}

.jm-hero-main h1 {
    font-size: 3.5rem;
    margin-bottom: var(--jm-space-md);
    font-weight: 700;
}

.jm-hero-main p {
    font-size: 1.5rem;
    max-width: 800px;
    margin-bottom: var(--jm-space-xl);
}

.jm-slide-indicators {
    position: absolute;
    bottom: var(--jm-space-xl);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 3;
}

.jm-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    margin: 0 var(--jm-space-xs);
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.jm-indicator.active-dot {
    background-color: var(--jm-text-light);
}

/* Button Styles */
.jm-main-btn,
.jm-light-btn,
.jm-alt-btn {
    padding: var(--jm-space-sm) var(--jm-space-lg);
    border-radius: 50px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
}

.jm-main-btn {
    background-color: var(--jm-accent);
    color: var(--jm-dark);
}

.jm-main-btn:hover {
    background-color: #e0b82c;
    transform: translateY(-2px);
}

.jm-light-btn {
    background-color: var(--jm-text-light);
    color: var(--jm-primary);
}

.jm-light-btn:hover {
    background-color: rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
}

.jm-alt-btn {
    background-color: transparent;
    color: var(--jm-text-light);
    border: 2px solid var(--jm-text-light);
    margin-left: var(--jm-space-md);
}

.jm-alt-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

/* About Section Styles */
.jm-two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--jm-space-xl);
    align-items: center;
}

.jm-image-wrapper {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.jm-raised-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.jm-text-content h2 {
    margin-bottom: var(--jm-space-md);
}

.jm-description p {
    margin-bottom: var(--jm-space-md);
    font-size: 1.1rem;
    line-height: 1.8;
}

.jm-featured-box {
    background-color: rgba(75, 36, 140, 0.1);
    border-left: 4px solid var(--jm-primary);
    padding: var(--jm-space-md);
    margin: var(--jm-space-lg) 0;
}

/* Core Question Section Styles */
.jm-core-question{
    background-color: var(--Primary-Blue);
}
#coree{
    color: gold;
}
#coree-1{
    color: var(--text-color);
}
.jm-large-quote {
    font-size: 2rem;
    color: var(--jm-primary);
    font-weight: 700;
    margin: var(--jm-space-xl) auto;
}

.jm-points-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--jm-space-lg);
    margin-top: var(--jm-space-xl);
}

.jm-feature-card {
    background-color: var(--jm-light);
    border-radius: 8px;
    padding: var(--jm-space-lg);
    text-align: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.jm-feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.jm-feature-card i {
    font-size: 2.5rem;
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-md);
}

.jm-feature-card h3 {
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-sm);
}

/* Method Section Styles */
.jm-approach-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--jm-space-xl);
    max-width: 1000px;
    margin: var(--jm-space-xl) auto;
}

.jm-method-card {
    background-color: var(--jm-light);
    border-radius: 8px;
    padding: var(--jm-space-lg);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.jm-method-card.positive-card {
    border: 2px solid var(--jm-primary);
}

.jm-method-icon {
    font-size: 2.5rem;
    margin-bottom: var(--jm-space-md);
    color: var(--jm-primary);
}

.jm-method-icon.negative-icon {
    color: #dc3545;
}

.jm-method-card h3 {
    margin-bottom: var(--jm-space-md);
    color: var(--jm-primary);
}

.jm-method-card ul {
    padding-left: var(--jm-space-md);
}

.jm-method-card li {
    margin-bottom: var(--jm-space-sm);
}

.jm-method-summary {
    max-width: 800px;
    margin: var(--jm-space-xl) auto 0;
    font-size: 1.1rem;
    line-height: 1.8;
    text-align: center;
}

/* Activities Section Styles */
.jm-activities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--jm-space-lg);
    margin-top: var(--jm-space-xl);
}

.jm-session-card {
    background-color: var(--jm-light);
    border-radius: 8px;
    padding: var(--jm-space-lg);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease;
}

.jm-session-card:hover {
    transform: translateY(-5px);
}

.jm-session-icon {
    font-size: 2.5rem;
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-md);
}

.jm-session-card h3 {
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-md);
}

.jm-skills-list h4 {
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-sm);
}

.jm-skills-list ul {
    padding-left: var(--jm-space-md);
    margin-bottom: var(--jm-space-md);
}

.jm-skills-list li {
    margin-bottom: var(--jm-space-xs);
}

/* Advantages Section Styles */
.jm-benefits-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--jm-space-lg);
    margin-top: var(--jm-space-xl);
}

.jm-benefit-item {
    text-align: center;
    padding: var(--jm-space-md);
}

.jm-benefit-item i {
    font-size: 2rem;
    color: var(--jm-primary);
    margin-bottom: var(--jm-space-sm);
}

/* Closing Section Styles */
.jm-closing-section{
    background-color: var(--jm-primary);
    margin-bottom: 20px;
    height: 80vh;
}
.centered-content {
    text-align: center;
}
.jm-section-title{
    color: var(--bm-accent);
}

.jm-final-content blockquote {
    font-size: 1.25rem;
    max-width: 800px;
    color: var(--text-color);
    margin: var(--jm-space-xl) auto;
    line-height: 1.8;
    font-style: italic;
}

.jm-action-buttons {
    display: flex;
    justify-content: center;
    margin-top: var(--jm-space-xl);
}

/* Responsive Styles */
@media (max-width: 992px) {
    .jm-two-column {
        grid-template-columns: 1fr;
    }

    .jm-image-wrapper {
        max-width: 600px;
        margin: 0 auto;
    }

    .jm-approach-cards {
        grid-template-columns: 1fr;
        gap: var(--jm-space-lg);
    }
}

@media (max-width: 768px) {
    .jm-hero-main h1 {
        font-size: 2.5rem;
    }

    .jm-hero-main p {
        font-size: 1.2rem;
    }

    .jm-action-buttons {
        flex-direction: column;
        align-items: center;
    }

    .jm-alt-btn {
        margin-left: 0;
        margin-top: var(--jm-space-md);
    }
}

@media (max-width: 576px) {
    .jm-section-title {
        font-size: 1.75rem;
    }

    .jm-large-quote {
        font-size: 1.5rem;
    }

    .jm-hero-main h1 {
        font-size: 2rem;
    }

    .jm-hero-main p {
        font-size: 1rem;
    } }

        /* Root variables specific to BRANCH program */
        :root {
            --bm-primary: #4b248c;
            /* Royal Purple */
            --bm-accent: #F3CC3C;
            /* Gold */
            --bm-dark: #000000;
            /* Black */
            --bm-light: #FFFFFF;
            /* White */
            --bm-bg-light: #f9f9f9;
            --bm-text-dark: #333333;
            --bm-text-light: #FFFFFF;
    
            /* Spacing */
            --bm-space-xs: 0.5rem;
            --bm-space-sm: 1rem;
            --bm-space-md: 1.5rem;
            --bm-space-lg: 2rem;
            --bm-space-xl: 3rem;
    
            /* Fonts */
            --bm-font-main: 'Open Sans', sans-serif;
            --bm-font-heading: 'Montserrat', sans-serif;
        }
    
        /* Base Styles */
        .bm-program-wrapper {
            font-family: var(--bm-font-main);
            color: var(--bm-text-dark);
            line-height: 1.6;
        }
    
        .bm-container {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 var(--bm-space-md);
        }
    
        .section-spacing {
            padding: var(--bm-space-xl) 0;
        }
    
        .bm-light-background {
            background-color: var(--bm-bg-light);
        }
    
        .bm-primary-background {
            background-color: var(--bm-primary);
            color: var(--bm-text-light);
        }
    
        .text-center {
            text-align: center;
        }
    
        .light-text {
            color: var(--bm-text-light);
        }
    
        .bm-heading {
            font-family: var(--bm-font-heading);
            font-size: 2.25rem;
            margin-bottom: var(--bm-space-md);
            color: var(--bm-primary);
            position: relative;
        }
    
        .bm-primary-background .bm-heading {
            color: var(--bm-text-light);
        }
    
        .bm-heading:after {
            content: '';
            display: block;
            width: 60px;
            height: 4px;
            background: var(--bm-accent);
            margin: var(--bm-space-sm) auto;
        }
    
        .text-center .bm-heading:after {
            margin: var(--bm-space-sm) auto;
        }
    
        .bm-subheading {
            font-size: 1.25rem;
            max-width: 800px;
            margin: 0 auto var(--bm-space-xl);
            color: var(--bm-text-dark);
        }
    
        .bm-primary-background .bm-subheading {
            color: rgba(255, 255, 255, 0.9);
        }
    
        /* Hero Section Styles */
        .bm-main-banner {
            position: relative;
            height: 100vh;
            min-height: 600px;
            overflow: hidden;
        }
    
        .bm-slider-container {
            position: absolute;
            width: 100%;
            height: 100%;
        }
    
        .bm-slide {
            position: absolute;
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: center;
            opacity: 0;
            transition: opacity 1s ease-in-out;
        }
    
        .bm-slide.active-slide {
            opacity: 1;
        }
    
        .bm-overlay {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }
    
        .bm-banner-content {
            position: relative;
            z-index: 2;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
            padding: 0 var(--bm-space-md);
            color: var(--bm-text-light);
        }
    
        .bm-banner-content h1 {
            font-size: 3.5rem;
            margin-bottom: var(--bm-space-md);
            font-weight: 700;
        }
    
        .bm-banner-content p {
            font-size: 1.5rem;
            max-width: 800px;
            margin-bottom: var(--bm-space-xl);
        }
    
        .bm-slide-controls {
            position: absolute;
            bottom: var(--bm-space-xl);
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            z-index: 3;
        }
    
        .bm-control-dot {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: rgba(255, 255, 255, 0.5);
            margin: 0 var(--bm-space-xs);
            cursor: pointer;
            transition: background-color 0.3s ease;
        }
    
        .bm-control-dot.active-dot {
            background-color: var(--bm-text-light);
        }
    
        /* Button Styles */
        .bm-primary-button,
        .bm-light-button,
        .bm-secondary-button {
            padding: var(--bm-space-sm) var(--bm-space-lg);
            border-radius: 50px;
            font-size: 1rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            border: none;
        }
    
        .bm-primary-button {
            background-color: var(--bm-accent);
            color: var(--bm-dark);
        }
    
        .bm-primary-button:hover {
            background-color: #e0b82c;
            transform: translateY(-2px);
        }
    
        .bm-light-button {
            background-color: var(--bm-text-light);
            color: var(--bm-primary);
        }
    
        .bm-light-button:hover {
            background-color: rgba(255, 255, 255, 0.9);
            transform: translateY(-2px);
        }
    
        .bm-secondary-button {
            background-color: transparent;
            color: var(--bm-text-light);
            border: 2px solid var(--bm-text-light);
            margin-left: var(--bm-space-md);
        }
    
        .bm-secondary-button:hover {
            background-color: rgba(255, 255, 255, 0.1);
            transform: translateY(-2px);
        }
    
        /* Intro Section Styles */
        .bm-intro-layout {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: var(--bm-space-xl);
            align-items: center;
        }
    
        .bm-image-container {
            position: relative;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
        }
    
        .bm-shadow-image {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 8px;
        }
    
        .bm-text-block h2 {
            margin-bottom: var(--bm-space-md);
        }
    
        .bm-description p {
            margin-bottom: var(--bm-space-md);
            font-size: 1.1rem;
            line-height: 1.8;
        }
    
        .bm-feature-box {
            background-color: rgba(75, 36, 140, 0.1);
            border-left: 4px solid var(--bm-primary);
            padding: var(--bm-space-md);
            margin: var(--bm-space-lg) 0;
        }
    
        /* Vision & Mission Styles */
        .bm-vision-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: var(--bm-space-xl);
        }
    
        .bm-vision-card,
        .bm-mission-card {
            background-color: var(--bm-light);
            border-radius: 8px;
            padding: var(--bm-space-lg);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        }
    
        .bm-vision-card {
            border-top: 5px solid var(--bm-primary);
        }
    
        .bm-mission-card {
            border-top: 5px solid var(--bm-accent);
        }
    
        /* About Section Styles */
        .bm-about-layout {
            display: grid;
            grid-template-columns: 1fr 2fr;
            gap: var(--bm-space-xl);
            align-items: center;
        }
    
        .bm-logo-wrapper {
            padding: var(--bm-space-md);
            background-color: var(--bm-light);
            border-radius: 8px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        }
    
        .bm-logo-image {
            width: 100%;
            height: auto;
            display: block;
        }
    
        /* Audience Section Styles */
        .bm-reasons-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: var(--bm-space-lg);
            margin-top: var(--bm-space-xl);
        }
    
        .bm-reason-item {
            background-color: var(--bm-light);
            border-radius: 8px;
            padding: var(--bm-space-lg);
            text-align: center;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
    
        .bm-reason-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
        }
    
        .bm-reason-icon {
            font-size: 2.5rem;
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-md);
        }
    
        .bm-reason-item h3 {
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-sm);
        }
    
        /* Overview Section Styles */
        .bm-overview-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: var(--bm-space-lg);
            margin-top: var(--bm-space-xl);
        }
    
        .bm-overview-item {
            background-color: var(--bm-light);
            border-radius: 8px;
            padding: var(--bm-space-lg);
            text-align: center;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
            transition: transform 0.3s ease;
        }
    
        .bm-overview-item:hover {
            transform: translateY(-5px);
        }
    
        .bm-number-circle {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background-color: var(--bm-primary);
            color: var(--bm-text-light);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            font-weight: bold;
            margin: 0 auto var(--bm-space-md);
        }
    
        .bm-overview-item h3 {
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-sm);
        }
    
        /* Objectives Section Styles */
        .bm-objectives-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: var(--bm-space-lg);
            margin-top: var(--bm-space-xl);
        }
    
        .bm-objective-card {
            background-color: var(--bm-light);
            border-radius: 8px;
            padding: var(--bm-space-lg);
            text-align: center;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
            transition: transform 0.3s ease;
        }
    
        .bm-objective-card:hover {
            transform: translateY(-5px);
        }
    
        .bm-obj-icon {
            font-size: 2.5rem;
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-md);
        }
    
        .bm-objective-card h3 {
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-sm);
        }
    
        /* Structure Section Styles */
        .bm-timeline {
            max-width: 800px;
            margin: var(--bm-space-xl) auto 0;
        }
    
        .bm-timeline-step {
            display: flex;
            margin-bottom: var(--bm-space-lg);
            align-items: flex-start;
        }
    
        .bm-step-number {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background-color: var(--bm-primary);
            color: var(--bm-text-light);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            font-weight: bold;
            margin-right: var(--bm-space-md);
            flex-shrink: 0;
        }
    
        .bm-step-content {
            background-color: var(--bm-light);
            border-radius: 8px;
            padding: var(--bm-space-md);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
            flex-grow: 1;
        }
    
        .bm-step-content h3 {
            color: var(--bm-primary);
            margin-bottom: var(--bm-space-xs);
        }
    
        /* CTA Section Styles */
        .bm-cta-content {
            max-width: 1000px;
            margin: 0 auto;
            text-align: center;
        }
    
        .bm-cta-content p {
            max-width: 800px;
            margin: 0 auto var(--bm-space-xl);
            font-size: 1.1rem;
            line-height: 1.8;
        }
    
        .bm-contact-box {
            background-color: rgba(255, 255, 255, 0.1);
            border-radius: 8px;
            padding: var(--bm-space-lg);
            margin-top: var(--bm-space-xl);
        }
    
        .bm-contact-box h3 {
            color: var(--bm-accent);
            margin-bottom: var(--bm-space-md);
        }
    
        .bm-contact-info {
            display: flex;
            justify-content: center;
            gap: var(--bm-space-xl);
            margin: var(--bm-space-lg) 0;
        }
    
        .bm-contact-detail {
            display: flex;
            align-items: center;
            gap: var(--bm-space-sm);
        }
    
        .bm-contact-detail i {
            color: var(--bm-accent);
        }
    
        .bm-action-buttons {
            display: flex;
            justify-content: center;
            margin-top: var(--bm-space-xl);
        }
    
        /* Responsive Styles */
        @media (max-width: 992px) {
    
            .bm-intro-layout,
            .bm-about-layout,
            .bm-vision-grid {
                grid-template-columns: 1fr;
            }
    
            .bm-image-container,
            .bm-logo-column {
                max-width: 600px;
                margin: 0 auto;
            }
        }
    
        @media (max-width: 768px) {
            .bm-banner-content h1 {
                font-size: 2.5rem;
            }
    
            .bm-banner-content p {
                font-size: 1.2rem;
            }
    
            .bm-action-buttons {
                flex-direction: column;
                align-items: center;
            }
    
            .bm-secondary-button {
                margin-left: 0;
                margin-top: var(--bm-space-md);
            }
    
            .bm-contact-info {
                flex-direction: column;
                gap: var(--bm-space-sm);
            }
        }
    
        @media (max-width: 576px) {
            .bm-heading {
                font-size: 1.75rem;
            }
    
            .bm-banner-content h1 {
                font-size: 2rem;
            }
    
            .bm-banner-content p {
                font-size: 1rem;
            }
    
            .bm-timeline-step {
                flex-direction: column;
            }
    
            .bm-step-number {
                margin-right: 0;
                margin-bottom: var(--bm-space-sm);
            } }

/* SPECIAL HIGHLIGHTS BUTTON*/
.highlights-section {
    max-width: 1200px;
    margin: 0 auto;
  
}
.highlights-carousel{
    background-color: var(--jm-primary);
    padding-top: 10px;
    margin-top: 15px;

}

.section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.2rem;
    color: var(--Gold-color);
    text-decoration: underline;
    
    text-align: center;
    margin-bottom: 1.5rem;
}

.categories-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 2rem;
}

.category-card {
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s;
}

.category-card:hover {
    transform: translateY(-5px);
}

.category-header {
    padding: 1rem;
    background: var(--primary);
    color: white;
    text-align: center;
    font-weight: 600;
}

.category-carousel {
    position: relative;
    height: 250px;
    overflow: hidden;
}

.carousel-inner {
    display: flex;
    height: 100%;
    transition: transform 0.5s ease;
}

.carousel-item {
    min-width: 100%;
    height: 100%;
    position: relative;
}

.carousel-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.protect-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.carousel-controls {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 8px;
    z-index: 3;
}

.carousel-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s;
}

.carousel-indicator.active {
    background: white;
    transform: scale(1.2);
}

.view-more-btn {
    display: block;
    width: 100%;
    padding: 0.75rem;
    background: var(--accent);
    color: var(--text-dark);
    border: none;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s;
    text-align: center;
    text-decoration: none;
}

.view-more-btn:hover {
    background: #f78fb3;
}

@media (max-width: 768px) {
    .categories-container {
        grid-template-columns: 1fr;
    }

    .category-carousel {
        height: 200px;
    }
}

/*Branch Specific Oriented*/
 /* BRANCH-SPECIFIC STYLES (prefix with bp-) */
 :root {
     --bp-primary: #4b248c;
     --bp-light-bg: #f9f9f9;
     --bp-text-dark: #333;
     --bp-text-light: #fff;
 }

 .bp-highlights-section {
     max-width: 1200px;
     margin: 0 auto;
     padding: 2rem;
     font-family: 'Poppins', sans-serif;
 }

 .bp-section-title {
     font-family: 'Montserrat', sans-serif;
     font-size: 2.2rem;
     color: var(--bp-primary);
     text-align: center;
     margin-bottom: 1.5rem;
 }

 .bp-categories-container {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
     gap: 2rem;
     margin-top: 2rem;
 }

 .bp-category-card {
     background: white;
     border-radius: 12px;
     overflow: hidden;
     box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
     transition: transform 0.3s;
 }

 .bp-category-card:hover {
     transform: translateY(-8px);
 }

 .bp-category-header {
     padding: 1.2rem;
     background: var(--bp-primary);
     color: white;
     text-align: center;
     font-weight: 600;
     font-size: 1.1rem;
 }

 .bp-carousel-container {
     position: relative;
     height: 280px;
     overflow: hidden;
 }

 .bp-carousel-track {
     display: flex;
     height: 100%;
     transition: transform 0.6s ease;
 }

 .bp-carousel-slide {
     min-width: 100%;
     height: 100%;
     position: relative;
 }

 .bp-carousel-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .bp-protect-overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: 2;
 }

 .bp-carousel-nav {
     position: absolute;
     bottom: 15px;
     left: 0;
     right: 0;
     display: flex;
     justify-content: center;
     gap: 8px;
     z-index: 3;
 }

 .bp-carousel-dot {
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.4);
     cursor: pointer;
     transition: all 0.3s;
 }

 .bp-carousel-dot.active {
     background: white;
     transform: scale(1.2);
 }

 .bp-view-more-btn {
     display: block;
     width: 100%;
     padding: 0.9rem;
     background: var(--bp-accent);
     color: var(--bp-text-dark);
     border: none;
     font-weight: 600;
     cursor: pointer;
     transition: background 0.3s;
     text-align: center;
     font-size: 1rem;
 }

 .bp-view-more-btn:hover {
     background: #6ab495;
 }

 @media (max-width: 768px) {
     .bp-categories-container {
         grid-template-columns: 1fr;
     }

     .bp-carousel-container {
         height: 240px;
     }

     .bp-section-title {
         font-size: 1.8rem;
     }
 }

 /* Branch Testimonials - Unique Styling */
 .branch-testimonials {
     padding: 3rem 1.5rem;
     background-color: #f8fafc;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
 }

 .branch-section-title {
     text-align: center;
     font-size: 1.8rem;
     color: #2c5282;
     margin-bottom: 2.5rem;
     position: relative;
     font-weight: 700;
 }

 .branch-section-title::after {
     content: '';
     display: block;
     width: 80px;
     height: 4px;
     background: #4299e1;
     margin: 0.8rem auto 0;
 }

 .branch-testimonial-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     gap: 2rem;
     max-width: 1200px;
     margin: 0 auto;
 }

 .branch-testimonial-card {
     background: white;
     border-radius: 10px;
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
     padding: 2rem;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     border-top: 4px solid #4299e1;
     position: relative;
     overflow: hidden;
 }

 .branch-testimonial-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 25px rgba(66, 153, 225, 0.15);
 }

 .branch-testimonial-content {
     color: #4a5568;
     font-size: 1rem;
     line-height: 1.7;
     margin-bottom: 1.5rem;
     font-style: italic;
     position: relative;
     padding-left: 1.5rem;
 }

 .branch-testimonial-content::before {
     content: '"';
     font-size: 4rem;
     color: #ebf8ff;
     position: absolute;
     left: -0.8rem;
     top: -1.5rem;
     z-index: 0;
     font-family: Georgia, serif;
     line-height: 1;
 }

 .branch-testimonial-author {
     display: flex;
     align-items: center;
     position: relative;
     z-index: 1;
 }

 .branch-testimonial-author-info h4 {
     color: #2b6cb0;
     font-size: 1.1rem;
     margin-bottom: 0.3rem;
     font-weight: 600;
 }

 .branch-testimonial-author-info p {
     color: #718096;
     font-size: 0.9rem;
     margin: 0;
 }

 /* Responsive Design */
 @media (max-width: 768px) {
     .branch-testimonial-grid {
         grid-template-columns: 1fr;
     }

     .branch-testimonial-card {
         padding: 1.5rem;
     }

     .branch-section-title {
         font-size: 1.5rem;
     }
 }

 /* Unique Branch Elements */
 .branch-testimonial-card::after {
     content: '';
     position: absolute;
     bottom: 0;
     right: 0;
     width: 50px;
     height: 50px;
     background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ebf8ff"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
     background-size: contain;
     opacity: 0.7;
 }

 /*A PLAY OF MODERN AND STYLISH CSS*/
 .program-style-socials{
    background: #0f0c29;
    color: white;
     overflow-x: hidden;
 }
   /* Cosmic Background Animation */
   .programs-socials-v2 {
       position: relative;
       min-height: 100vh;
       overflow: hidden;
       padding: 4rem 2rem;
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
   }

   .cosmic-bg {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background:
           radial-gradient(circle at 20% 30%, rgba(255, 88, 88, 0.15) 0%, transparent 40%),
           radial-gradient(circle at 80% 70%, rgba(136, 96, 255, 0.15) 0%, transparent 40%),
           radial-gradient(circle at 40% 60%, rgba(88, 255, 232, 0.15) 0%, transparent 40%);
       animation: cosmic-pulse 16s infinite alternate;
       z-index: 0;
   }

   @keyframes cosmic-pulse {
       0% {
           opacity: 0.7;
           transform: scale(1);
       }

       50% {
           opacity: 1;
       }

       100% {
           opacity: 0.7;
           transform: scale(1.05);
       }
   }

   /* Section Heading */
   .section-heading {
       text-align: center;
       margin-bottom: 4rem;
       position: relative;
       z-index: 2;
   }

   /* Glitch Text Effect */
   .title-glitch {
       font-size: 4rem;
       background: linear-gradient(45deg, #f8c537, #ff6b6b, #48dbfb);
       -webkit-background-clip: text;
       background-clip: text;
       color: transparent;
       position: relative;
       animation: glitch-effect 3s infinite;
       margin-bottom: 1rem;
       font-weight: 700;
   }

   @keyframes glitch-effect {
       0% {
           text-shadow: 0.05em 0 0 #ff6b6b, -0.05em -0.025em 0 #48dbfb;
       }

       14% {
           text-shadow: 0.05em 0 0 #ff6b6b, -0.05em -0.025em 0 #48dbfb;
       }

       15% {
           text-shadow: -0.05em -0.025em 0 #ff6b6b, 0.025em 0.025em 0 #48dbfb;
       }

       49% {
           text-shadow: -0.05em -0.025em 0 #ff6b6b, 0.025em 0.025em 0 #48dbfb;
       }

       50% {
           text-shadow: 0.025em 0.05em 0 #ff6b6b, 0.05em 0 0 #48dbfb;
       }

       99% {
           text-shadow: 0.025em 0.05em 0 #ff6b6b, 0.05em 0 0 #48dbfb;
       }

       100% {
           text-shadow: -0.025em 0 0 #ff6b6b, -0.025em -0.025em 0 #48dbfb;
       }
   }

   .subtitle-shine {
       font-size: 1.2rem;
       color: rgba(255, 255, 255, 0.7);
       position: relative;
       display: inline-block;
   }

   .subtitle-shine::after {
       content: '';
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
       animation: shine 3s infinite;
   }

   @keyframes shine {
       0% {
           transform: translateX(-100%);
       }

       20% {
           transform: translateX(100%);
       }

       100% {
           transform: translateX(100%);
       }
   }

   /* Social Matrix Grid */
   .social-matrix {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 2rem;
       max-width: 1200px;
       margin: 0 auto;
       position: relative;
       z-index: 2;
   }

   /* Social Tiles - Holographic Effect */
   .social-tile {
       position: relative;
       border-radius: 16px;
       padding: 2.5rem;
       backdrop-filter: blur(12px);
       background: rgba(255, 255, 255, 0.03);
       border: 1px solid rgba(255, 255, 255, 0.1);
       transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
       overflow: hidden;
       transform-style: preserve-3d;
       perspective: 1000px;
       min-height: 350px;
       display: flex;
       flex-direction: column;
   }

   .tile-content {
       position: relative;
       z-index: 2;
       height: 100%;
       display: flex;
       flex-direction: column;
   }

   .tile-glow {
       position: absolute;
       top: -50%;
       left: -50%;
       width: 200%;
       height: 200%;
       background: conic-gradient(from 0deg,
               transparent 0%,
               rgba(255, 255, 255, 0.1) 30%,
               transparent 70%);
       animation: rotate-glow 8s linear infinite;
       z-index: 1;
   }

   @keyframes rotate-glow {
       from {
           transform: rotate(0deg);
       }

       to {
           transform: rotate(360deg);
       }
   }

   /* Platform Logos */
   .platform-logo {
       font-size: 3.5rem;
       margin-bottom: 1.5rem;
       transition: transform 0.3s ease;
   }

   .social-tile:hover .platform-logo {
       transform: scale(1.1);
   }

   .social-tile h3 {
       font-size: 1.8rem;
       margin-bottom: 1rem;
       font-weight: 600;
   }

   .social-tile p {
       color: rgba(255, 255, 255, 0.7);
       margin-bottom: 2rem;
       line-height: 1.6;
       flex-grow: 1;
   }

   /* Platform-Specific Styles */
   .insta-tile .platform-logo {
       background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
       -webkit-background-clip: text;
       background-clip: text;
       -webkit-text-fill-color: transparent;
   }

   .fb-tile .platform-logo {
       color: #1877f2;
   }

   .tiktok-tile .platform-logo {
       color: #000000;
       text-shadow: 0.5px 0.5px 0 #25f4ee, -0.5px -0.5px 0 #fe2c55;
   }

   /* Neon Hover Effects */
   .insta-tile:hover {
       box-shadow: 0 0 30px rgba(225, 48, 108, 0.6);
       transform: translateY(-10px);
   }

   .fb-tile:hover {
       box-shadow: 0 0 30px rgba(66, 103, 178, 0.6);
       transform: translateY(-10px);
   }

   .tiktok-tile:hover {
       box-shadow: 0 0 30px rgba(0, 242, 234, 0.6);
       transform: translateY(-10px);
   }

   /* CTA Button - Liquid Fill Effect */
   .social-cta {
       position: relative;
       overflow: hidden;
       z-index: 2;
       display: inline-flex;
       align-items: center;
       color: white;
       text-decoration: none;
       padding: 0.8rem 1.5rem;
       border-radius: 50px;
       background: rgba(255, 255, 255, 0.1);
       border: 1px solid rgba(255, 255, 255, 0.2);
       width: fit-content;
       transition: all 0.3s ease;
   }

   .social-cta span {
       position: relative;
       z-index: 2;
   }

   .cta-arrow {
       margin-left: 0.5rem;
       transform: translateX(0);
       transition: transform 0.3s ease;
   }

   .social-cta::before {
       content: '';
       position: absolute;
       top: 0;
       left: -100%;
       width: 100%;
       height: 100%;
       background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
       transition: 0.6s;
   }

   .social-cta:hover {
       background: rgba(255, 255, 255, 0.2);
   }

   .social-cta:hover::before {
       left: 100%;
   }

   .social-cta:hover .cta-arrow {
       transform: translateX(5px);
   }

   /* Platform-Specific CTA Colors */
   .insta-tile .social-cta:hover {
       background: rgba(225, 48, 108, 0.2);
       border-color: rgba(225, 48, 108, 0.4);
   }

   .fb-tile .social-cta:hover {
       background: rgba(66, 103, 178, 0.2);
       border-color: rgba(66, 103, 178, 0.4);
   }

   .tiktok-tile .social-cta:hover {
       background: rgba(0, 242, 234, 0.2);
       border-color: rgba(0, 242, 234, 0.4);
   }

   /* Click Particles */
   .click-particles {
       position: fixed;
       width: 10px;
       height: 10px;
       border-radius: 50%;
       pointer-events: none;
       z-index: 100;
       animation: particles-explode 1s ease-out forwards;
   }

   @keyframes particles-explode {
       0% {
           transform: scale(1);
           opacity: 1;
           box-shadow:
               0 0 0 0 rgba(255, 255, 255, 0.8),
               0 0 0 0 rgba(255, 255, 255, 0.8);
       }

       100% {
           transform: scale(20);
           opacity: 0;
           box-shadow:
               -100px 0 20px 10px rgba(255, 88, 88, 0),
               100px 0 20px 10px rgba(136, 96, 255, 0);
       }
   }

   /* Responsive Design */
   @media (max-width: 992px) {
       .social-matrix {
           grid-template-columns: repeat(2, 1fr);
       }
   }

   @media (max-width: 768px) {
       .title-glitch {
           font-size: 2.5rem;
       }

       .subtitle-shine {
           font-size: 1rem;
       }

       .social-matrix {
           grid-template-columns: 1fr;
           max-width: 500px;
       }

       .social-tile {
           min-height: 300px;
           padding: 2rem;
       }
   }

   @media (max-width: 480px) {
       .programs-socials-v2 {
           padding: 4rem 1rem;
       }

       .title-glitch {
           font-size: 2rem;
       }
   }