/*
|--------------------------------------------------------------------------
| Mahavir International Trust - Frontend Style
|--------------------------------------------------------------------------
| Main frontend theme
| Primary: #4F1964
| Secondary: #71388A
| Accent: #FF7CB0
| Highlight: #FSC16C
|--------------------------------------------------------------------------
*/

:root
{
    --mit-primary: #4F1964;
    --mit-primary-dark: #381049;
    --mit-secondary: #71388A;
    --mit-accent: #FF7CB0;
    --mit-accent-dark: #e85f9a;
    --mit-gold: #F5C16C;

    --mit-white: #ffffff;
    --mit-black: #17121a;
    --mit-text: #33313a;
    --mit-muted: #77727d;

    --mit-bg: #faf8fb;
    --mit-light-purple: #f6eff8;
    --mit-border: #e9e2ec;

    --mit-container: 1240px;
    --mit-radius: 12px;
    --mit-radius-lg: 18px;

    --mit-shadow:
        0 8px 30px rgba(79, 25, 100, 0.08);

    --mit-shadow-hover:
        0 14px 38px rgba(79, 25, 100, 0.14);

    --mit-transition: all 0.25s ease;
}


/* ==========================================================
   RESET
========================================================== */

*
{
    box-sizing: border-box;
}

html
{
    scroll-behavior: smooth;
}

body
{
    margin: 0;
    padding: 0;

    background: var(--mit-bg);

    color: var(--mit-text);

    font-family:
        "Inter",
        Arial,
        sans-serif;

    font-size: 15px;

    line-height: 1.65;
}

body,
button,
input,
textarea,
select
{
    font-family:
        "Inter",
        Arial,
        sans-serif;
}

img
{
    max-width: 100%;
    height: auto;
    display: block;
}

a
{
    color: inherit;
    text-decoration: none;
}

button
{
    border: 0;
    cursor: pointer;
}

ul,
ol
{
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6
{
    margin-top: 0;

    color: var(--mit-black);

    font-family:
        "Poppins",
        "Inter",
        Arial,
        sans-serif;

    line-height: 1.25;
}

p
{
    margin-top: 0;
}


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

.mit-container
{
    width: min(
        calc(100% - 40px),
        var(--mit-container)
    );

    margin-left: auto;
    margin-right: auto;
}


/* ==========================================================
   TOP BAR
========================================================== */

.mit-topbar
{
    background: var(--mit-primary);

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

    font-size: 13px;
}

.mit-topbar .mit-container
{
    min-height: 38px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;
}

.mit-topbar-left,
.mit-topbar-right
{
    display: flex;

    align-items: center;

    gap: 18px;
}

.mit-topbar a
{
    display: inline-flex;

    align-items: center;

    gap: 7px;

    transition: var(--mit-transition);
}

.mit-topbar a:hover
{
    color: var(--mit-accent);
}

.mit-topbar-right a
{
    width: 28px;
    height: 28px;

    justify-content: center;

    border-radius: 50%;
}

.mit-topbar-right a:hover
{
    background: rgba(255,255,255,0.12);
}


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

.mit-header
{
    position: sticky;

    top: 0;

    z-index: 1000;

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

    border-bottom: 1px solid var(--mit-border);

    box-shadow:
        0 4px 20px rgba(40, 15, 50, 0.06);
}

.mit-header-inner
{
    min-height: 82px;

    display: flex;

    align-items: center;

    gap: 28px;
}


/* ==========================================================
   LOGO
========================================================== */

.mit-logo
{
    flex-shrink: 0;

    display: inline-flex;

    align-items: center;

    gap: 10px;
}

.mit-logo img
{
    width: 52px;
    height: 52px;

    object-fit: contain;
}

.mit-logo-text
{
    display: flex;

    flex-direction: column;

    line-height: 1.05;
}

.mit-logo-text strong
{
    color: var(--mit-primary);

    font-family:
        "Poppins",
        sans-serif;

    font-size: 17px;

    font-weight: 700;

    letter-spacing: 0.3px;
}

.mit-logo-text span
{
    margin-top: 4px;

    color: var(--mit-muted);

    font-size: 9.5px;

    font-weight: 600;

    letter-spacing: 1.15px;
}


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

.mit-navigation
{
    flex: 1;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 4px;
}

.mit-navigation > a,
.mit-nav-dropdown > a
{
    position: relative;

    display: inline-flex;

    align-items: center;

    gap: 5px;

    min-height: 42px;

    padding: 8px 11px;

    color: #403b44;

    font-size: 13.5px;

    font-weight: 600;

    border-radius: 8px;

    transition: var(--mit-transition);
}

.mit-navigation > a::after,
.mit-nav-dropdown > a::after
{
    content: "";

    position: absolute;

    left: 11px;
    right: 11px;
    bottom: 3px;

    height: 2px;

    background: var(--mit-accent);

    transform: scaleX(0);

    transform-origin: center;

    transition: var(--mit-transition);
}

.mit-navigation > a:hover,
.mit-nav-dropdown > a:hover,
.mit-navigation > a.active
{
    color: var(--mit-primary);
}

.mit-navigation > a:hover::after,
.mit-nav-dropdown > a:hover::after,
.mit-navigation > a.active::after
{
    transform: scaleX(1);
}

.mit-nav-dropdown
{
    position: relative;
}

.mit-nav-dropdown > a i
{
    font-size: 10px;
}


/* ==========================================================
   DROPDOWN
========================================================== */

.mit-dropdown-menu
{
    position: absolute;

    top: calc(100% + 9px);

    left: 0;

    min-width: 210px;

    padding: 8px;

    background: var(--mit-white);

    border: 1px solid var(--mit-border);

    border-radius: 10px;

    box-shadow: var(--mit-shadow);

    opacity: 0;

    visibility: hidden;

    transform: translateY(8px);

    transition: var(--mit-transition);
}

.mit-nav-dropdown:hover .mit-dropdown-menu
{
    opacity: 1;

    visibility: visible;

    transform: translateY(0);
}

.mit-dropdown-menu a
{
    display: block;

    padding: 10px 12px;

    border-radius: 7px;

    color: var(--mit-text);

    font-size: 13px;

    font-weight: 500;

    transition: var(--mit-transition);
}

.mit-dropdown-menu a:hover
{
    background: var(--mit-light-purple);

    color: var(--mit-primary);

    padding-left: 16px;
}


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

.mit-header-actions
{
    display: flex;

    align-items: center;

    gap: 8px;

    flex-shrink: 0;
}


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

.mit-btn
{
    min-height: 40px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    padding: 8px 15px;

    border: 1px solid transparent;

    border-radius: 8px;

    font-size: 12.5px;

    font-weight: 600;

    white-space: nowrap;

    transition: var(--mit-transition);
}

.mit-btn-primary
{
    color: var(--mit-white);

    background:
        linear-gradient(
            135deg,
            var(--mit-primary),
            var(--mit-secondary)
        );

    box-shadow:
        0 5px 16px rgba(79,25,100,0.18);
}

.mit-btn-primary:hover
{
    color: var(--mit-white);

    transform: translateY(-1px);

    box-shadow:
        0 8px 22px rgba(79,25,100,0.24);
}

.mit-btn-outline
{
    color: var(--mit-primary);

    background: var(--mit-white);

    border-color: var(--mit-primary);
}

.mit-btn-outline:hover
{
    color: var(--mit-white);

    background: var(--mit-primary);
}


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

.mit-mobile-menu-btn
{
    display: none;

    width: 42px;
    height: 42px;

    align-items: center;

    justify-content: center;

    color: var(--mit-primary);

    background: var(--mit-light-purple);

    border-radius: 8px;

    font-size: 23px;
}

.mit-mobile-menu
{
    display: none;
}


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

.mit-main
{
    min-height: 500px;
}


/* ==========================================================
   COMMON PAGE SECTIONS
========================================================== */

.mit-section
{
    padding: 80px 0;
}

.mit-section-light
{
    background: var(--mit-white);
}

.mit-section-soft
{
    background: var(--mit-light-purple);
}

.mit-section-heading
{
    max-width: 760px;

    margin: 0 auto 42px;

    text-align: center;
}

.mit-section-heading .eyebrow
{
    display: inline-block;

    margin-bottom: 9px;

    color: var(--mit-accent-dark);

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}

.mit-section-heading h2
{
    margin-bottom: 12px;

    color: var(--mit-primary);

    font-size: clamp(28px, 4vw, 40px);
}

.mit-section-heading p
{
    margin-bottom: 0;

    color: var(--mit-muted);

    font-size: 15px;
}


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

.mit-card
{
    background: var(--mit-white);

    border: 1px solid var(--mit-border);

    border-radius: var(--mit-radius);

    box-shadow: var(--mit-shadow);

    transition: var(--mit-transition);
}

.mit-card:hover
{
    transform: translateY(-4px);

    box-shadow: var(--mit-shadow-hover);
}


/* ==========================================================
   PAGE BANNER
========================================================== */

.mit-page-banner
{
    position: relative;

    min-height: 250px;

    display: flex;

    align-items: center;

    background:
        linear-gradient(
            120deg,
            rgba(79,25,100,0.96),
            rgba(113,56,138,0.88)
        );

    overflow: hidden;
}

.mit-page-banner::before
{
    content: "";

    position: absolute;

    width: 380px;
    height: 380px;

    top: -220px;
    right: -80px;

    background: rgba(255,124,176,0.18);

    border-radius: 50%;
}

.mit-page-banner::after
{
    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    bottom: -210px;
    left: 8%;

    background: rgba(245,193,108,0.12);

    border-radius: 50%;
}

.mit-page-banner-content
{
    position: relative;

    z-index: 1;

    color: var(--mit-white);
}

.mit-page-banner h1
{
    margin-bottom: 8px;

    color: var(--mit-white);

    font-size: clamp(30px, 4vw, 48px);
}

.mit-breadcrumb
{
    display: flex;

    align-items: center;

    gap: 8px;

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

    font-size: 13px;
}

.mit-breadcrumb a:hover
{
    color: var(--mit-accent);
}


/* ==========================================================
   FORMS
========================================================== */

.mit-form-group
{
    margin-bottom: 18px;
}

.mit-form-label
{
    display: block;

    margin-bottom: 7px;

    color: var(--mit-black);

    font-size: 13px;

    font-weight: 600;
}

.mit-form-control
{
    width: 100%;

    min-height: 45px;

    padding: 10px 13px;

    color: var(--mit-text);

    background: var(--mit-white);

    border: 1px solid #dcd5df;

    border-radius: 8px;

    outline: none;

    transition: var(--mit-transition);
}

.mit-form-control:focus
{
    border-color: var(--mit-secondary);

    box-shadow:
        0 0 0 3px rgba(113,56,138,0.10);
}


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

.mit-badge
{
    display: inline-flex;

    align-items: center;

    padding: 5px 10px;

    border-radius: 30px;

    font-size: 11px;

    font-weight: 700;
}

.mit-badge-primary
{
    color: var(--mit-primary);

    background: #f1e6f5;
}

.mit-badge-success
{
    color: #157347;

    background: #e7f6ec;
}

.mit-badge-warning
{
    color: #8a5a00;

    background: #fff4d8;
}


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

.mit-footer
{
    background:
        linear-gradient(
            135deg,
            var(--mit-primary-dark),
            var(--mit-primary)
        );

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

.mit-footer a
{
    transition: var(--mit-transition);
}

.mit-footer a:hover
{
    color: var(--mit-accent);
}


/* ==========================================================
   UTILITY
========================================================== */

.mit-text-primary
{
    color: var(--mit-primary) !important;
}

.mit-text-accent
{
    color: var(--mit-accent-dark) !important;
}

.mit-bg-primary
{
    background: var(--mit-primary) !important;
}

.mit-bg-soft
{
    background: var(--mit-light-purple) !important;
}

.mit-text-center
{
    text-align: center;
}


/* ==========================================================
   RESPONSIVE - TABLET
========================================================== */

@media(max-width:1150px)
{

    .mit-header-inner
    {
        gap: 16px;
    }

    .mit-navigation
    {
        gap: 0;
    }

    .mit-navigation > a,
    .mit-nav-dropdown > a
    {
        padding-left: 8px;
        padding-right: 8px;

        font-size: 12.5px;
    }

    .mit-logo-text strong
    {
        font-size: 15px;
    }

    .mit-logo img
    {
        width: 47px;
        height: 47px;
    }

    .mit-header-actions .mit-btn
    {
        padding-left: 11px;
        padding-right: 11px;
    }

}


/* ==========================================================
   RESPONSIVE - MOBILE
========================================================== */

@media(max-width:900px)
{

    .mit-container
    {
        width: min(
            calc(100% - 30px),
            var(--mit-container)
        );
    }

    .mit-topbar-left a:not(:first-child)
    {
        display: none;
    }

    .mit-topbar-right
    {
        gap: 4px;
    }

    .mit-header-inner
    {
        min-height: 70px;

        justify-content: space-between;
    }

    .mit-navigation,
    .mit-header-actions
    {
        display: none;
    }

    .mit-mobile-menu-btn
    {
        display: inline-flex;
    }

    .mit-mobile-menu
    {
        position: absolute;

        top: 100%;
        left: 0;
        right: 0;

        display: block;

        max-height: 0;

        overflow: hidden;

        background: var(--mit-white);

        border-top: 1px solid transparent;

        box-shadow:
            0 12px 25px rgba(40,15,50,0.10);

        transition:
            max-height 0.35s ease,
            border-color 0.35s ease;
    }

    .mit-mobile-menu.open
    {
        max-height: 620px;

        border-top-color: var(--mit-border);
    }

    .mit-mobile-menu > a
    {
        display: block;

        padding: 13px 20px;

        border-bottom: 1px solid #f0ebf2;

        color: var(--mit-text);

        font-size: 14px;

        font-weight: 600;
    }

    .mit-mobile-menu > a:hover
    {
        color: var(--mit-primary);

        background: var(--mit-light-purple);
    }

    .mit-mobile-actions
    {
        display: flex;

        gap: 8px;

        padding: 15px 20px 20px;
    }

    .mit-mobile-actions .mit-btn
    {
        flex: 1;
    }

    .mit-section
    {
        padding: 60px 0;
    }

}


/* ==========================================================
   RESPONSIVE - SMALL MOBILE
========================================================== */

@media(max-width:576px)
{

    body
    {
        font-size: 14px;
    }

    .mit-topbar
    {
        font-size: 11px;
    }

    .mit-topbar .mit-container
    {
        min-height: 34px;
    }

    .mit-topbar-right a
    {
        width: 24px;
        height: 24px;
    }

    .mit-logo img
    {
        width: 43px;
        height: 43px;
    }

    .mit-logo-text strong
    {
        font-size: 13px;
    }

    .mit-logo-text span
    {
        font-size: 7.5px;

        letter-spacing: 0.8px;
    }

    .mit-mobile-menu-btn
    {
        width: 39px;
        height: 39px;
    }

    .mit-section
    {
        padding: 48px 0;
    }

    .mit-section-heading
    {
        margin-bottom: 30px;
    }

    .mit-section-heading h2
    {
        font-size: 27px;
    }

    .mit-page-banner
    {
        min-height: 210px;
    }

}


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

:focus-visible
{
    outline: 3px solid rgba(255,124,176,0.55);

    outline-offset: 2px;
}


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

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

    html
    {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after
    {
        transition:none !important;
        animation:none !important;
    }

}

/* ==========================================================
   HOMEPAGE
========================================================== */

.mit-home-hero
{
    position: relative;
    min-height: 520px;

    display: flex;
    align-items: center;

    background:
        linear-gradient(
            120deg,
            rgba(79,25,100,0.97),
            rgba(113,56,138,0.90)
        );

    overflow: hidden;
}

.mit-home-hero::before
{
    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    right: -180px;
    top: -180px;

    background: rgba(255,124,176,0.12);

    border-radius: 50%;
}

.mit-home-hero::after
{
    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    left: -140px;
    bottom: -180px;

    background: rgba(245,193,108,0.10);

    border-radius: 50%;
}

.mit-home-hero .mit-container
{
    position: relative;
    z-index: 2;
}

.mit-home-hero-content
{
    max-width: 720px;

    padding: 90px 0;
}

.mit-hero-eyebrow
{
    display: inline-block;

    margin-bottom: 14px;

    color: var(--mit-accent);

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;
}

.mit-home-hero h1
{
    margin-bottom: 20px;

    color: var(--mit-white);

    font-size: clamp(40px, 5vw, 68px);

    line-height: 1.08;
}

.mit-home-hero h1 span
{
    display: block;

    color: var(--mit-gold);
}

.mit-home-hero p
{
    max-width: 650px;

    margin-bottom: 30px;

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

    font-size: 17px;
}

.mit-hero-actions
{
    display: flex;

    align-items: center;

    gap: 12px;
}

.mit-btn-large
{
    min-height: 48px;

    padding: 11px 20px;

    font-size: 13px;
}

.mit-btn-light
{
    color: var(--mit-primary);

    background: var(--mit-white);

    border-color: var(--mit-white);
}

.mit-btn-light:hover
{
    color: var(--mit-primary);

    background: #f8f1fa;

    transform: translateY(-1px);
}


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

.mit-home-intro
{
    display: grid;

    grid-template-columns:
        minmax(0, 1.5fr)
        minmax(280px, 0.8fr);

    gap: 60px;

    align-items: center;
}

.mit-home-intro-content
{
    max-width: 760px;
}

.eyebrow
{
    display: inline-block;

    margin-bottom: 9px;

    color: var(--mit-accent-dark);

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 1.5px;
}

.mit-home-intro-content h2
{
    margin-bottom: 18px;

    color: var(--mit-primary);

    font-size: clamp(30px, 4vw, 44px);
}

.mit-home-intro-content p
{
    margin-bottom: 16px;

    color: var(--mit-muted);

    font-size: 15px;
}

.mit-home-intro-content .mit-btn
{
    margin-top: 10px;
}

.mit-home-intro-highlight
{
    padding: 38px 32px;

    text-align: center;

    background:
        linear-gradient(
            145deg,
            var(--mit-primary),
            var(--mit-secondary)
        );

    border-radius: var(--mit-radius-lg);

    box-shadow: var(--mit-shadow);
}

.mit-intro-icon
{
    width: 70px;
    height: 70px;

    display: flex;

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

    margin: 0 auto 20px;

    color: var(--mit-primary);

    background: var(--mit-white);

    border-radius: 50%;

    font-size: 28px;
}

.mit-home-intro-highlight h3
{
    margin-bottom: 12px;

    color: var(--mit-white);

    font-size: 24px;
}

.mit-home-intro-highlight p
{
    margin-bottom: 0;

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


/* ==========================================================
   HOME ACTIVITIES
========================================================== */

.mit-home-activity-grid
{
    display: grid;

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

    gap: 20px;
}

.mit-home-activity-card
{
    display: block;

    padding: 28px 24px;

    color: inherit;

    background: var(--mit-white);

    border: 1px solid var(--mit-border);

    border-radius: var(--mit-radius);

    box-shadow: var(--mit-shadow);

    transition: var(--mit-transition);
}

.mit-home-activity-card:hover
{
    transform: translateY(-6px);

    border-color: rgba(113,56,138,0.25);

    box-shadow: var(--mit-shadow-hover);
}

.mit-activity-icon
{
    width: 56px;
    height: 56px;

    display: flex;

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

    margin-bottom: 20px;

    color: var(--mit-white);

    background:
        linear-gradient(
            135deg,
            var(--mit-primary),
            var(--mit-secondary)
        );

    border-radius: 14px;

    font-size: 23px;
}

.mit-home-activity-card h3
{
    margin-bottom: 10px;

    color: var(--mit-primary);

    font-size: 20px;
}

.mit-home-activity-card p
{
    min-height: 70px;

    margin-bottom: 18px;

    color: var(--mit-muted);

    font-size: 14px;
}

.mit-home-activity-card span
{
    color: var(--mit-secondary);

    font-size: 13px;

    font-weight: 700;
}

.mit-home-activity-card span i
{
    margin-left: 5px;

    transition: var(--mit-transition);
}

.mit-home-activity-card:hover span i
{
    margin-left: 9px;
}

.mit-home-centered-button
{
    margin-top: 35px;

    text-align: center;
}


/* ==========================================================
   EVENTS
========================================================== */

.mit-home-events-placeholder
{
    max-width: 850px;

    margin: 0 auto;

    padding: 55px 30px;

    text-align: center;

    background: var(--mit-white);

    border: 1px solid var(--mit-border);

    border-radius: var(--mit-radius-lg);

    box-shadow: var(--mit-shadow);
}

.mit-event-placeholder-icon
{
    width: 70px;
    height: 70px;

    display: flex;

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

    margin: 0 auto 20px;

    color: var(--mit-white);

    background:
        linear-gradient(
            135deg,
            var(--mit-primary),
            var(--mit-secondary)
        );

    border-radius: 50%;

    font-size: 28px;
}

.mit-home-events-placeholder h3
{
    margin-bottom: 10px;

    color: var(--mit-primary);

    font-size: 24px;
}

.mit-home-events-placeholder p
{
    max-width: 600px;

    margin: 0 auto 22px;

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


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

.mit-home-membership
{
    padding: 70px 0;

    background:
        linear-gradient(
            135deg,
            var(--mit-primary),
            var(--mit-primary-dark)
        );
}

.mit-home-membership-inner
{
    display: flex;

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

    gap: 40px;
}

.mit-membership-eyebrow
{
    display: block;

    margin-bottom: 10px;

    color: var(--mit-accent);

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 1.5px;
}

.mit-home-membership h2
{
    margin-bottom: 10px;

    color: var(--mit-white);

    font-size: clamp(28px, 4vw, 40px);
}

.mit-home-membership p
{
    margin-bottom: 0;

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


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

.mit-footer
{
    padding-top: 65px;
}

.mit-footer-main
{
    display: grid;

    grid-template-columns:
        1.6fr
        1fr
        1fr
        1.25fr;

    gap: 45px;

    padding-bottom: 45px;
}

/* ==========================================================
   FOOTER CONTACT + GOOGLE MAP ROW
========================================================== */

.mit-footer-contact-map
{
    display: grid;

    grid-template-columns:
        minmax(300px, 0.85fr)
        minmax(0, 1.75fr);

    gap: 45px;

    align-items: start;

    padding: 0 0 45px;
}

.mit-footer-contact
{
    min-width: 0;
}

.mit-footer-contact h3
{
    margin-bottom: 22px;

    color: var(--mit-white);

    font-size: 16px;
}

.mit-footer-contact .mit-contact-item
{
    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-bottom: 18px;
}

.mit-footer-contact .mit-contact-item:last-child
{
    margin-bottom: 0;
}


.mit-footer-brand
{
    max-width: 350px;
}

.mit-footer-logo
{
    display: inline-flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 18px;
}

.mit-footer-logo img
{
    width: 58px;
    height: 58px;

    object-fit: contain;
}

.mit-footer-logo strong
{
    display: block;

    color: var(--mit-white);

    font-family: "Poppins", sans-serif;

    font-size: 18px;
}

.mit-footer-logo span
{
    display: block;

    margin-top: 3px;

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

    font-size: 9px;

    font-weight: 600;

    letter-spacing: 1px;
}

.mit-footer-description
{
    margin-bottom: 22px;

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

    font-size: 13px;
}

.mit-footer-social
{
    display: flex;

    gap: 8px;
}

.mit-footer-social a
{
    width: 34px;
    height: 34px;

    display: flex;

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

    color: var(--mit-white);

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

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

    border-radius: 50%;

    transition: var(--mit-transition);
}

.mit-footer-social a:hover
{
    color: var(--mit-white);

    background: var(--mit-secondary);

    transform: translateY(-2px);
}

.mit-footer-column h3
{
    margin-bottom: 18px;

    color: var(--mit-white);

    font-size: 16px;
}

.mit-footer-column ul li
{
    margin-bottom: 9px;
}

.mit-footer-column ul li a
{
    color: rgba(255,255,255,0.70);

    font-size: 13px;
}

.mit-footer-column ul li a:hover
{
    color: var(--mit-accent);

    padding-left: 3px;
}

.mit-footer-contact .mit-contact-item
{
    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-bottom: 18px;
}

.mit-contact-icon
{
    flex-shrink: 0;

    width: 32px;
    height: 32px;

    display: flex;

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

    color: var(--mit-accent);

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

    border-radius: 8px;
}

.mit-footer-contact strong
{
    display: block;

    margin-bottom: 3px;

    color: var(--mit-white);

    font-size: 12px;
}

.mit-footer-contact p,
.mit-footer-contact a
{
    margin: 0;

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

    font-size: 13px;
}

.mit-footer-contact a:hover
{
    color: var(--mit-accent);
}

.mit-footer-bottom
{
    display: flex;

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

    gap: 20px;

    padding: 18px 0;

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

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

    font-size: 12px;
}

.mit-footer-heart
{
    color: var(--mit-accent);

    margin: 0 3px;
}


/* ==========================================================
   HOMEPAGE RESPONSIVE
========================================================== */

@media(max-width:1000px)
{
    .mit-home-activity-grid
    {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mit-home-intro
    {
        grid-template-columns: 1fr;
    }

    .mit-home-intro-highlight
    {
        max-width: 500px;

        margin: 0 auto;
    }

    .mit-footer-main
    {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mit-footer-contact-map
    {
        grid-template-columns:
            minmax(260px, 0.8fr)
            minmax(0, 1.2fr);

        gap: 30px;
    }
}


@media(max-width:700px)
{
    .mit-home-hero
    {
        min-height: 480px;
    }

    .mit-home-hero-content
    {
        padding: 70px 0;
    }

    .mit-home-hero h1
    {
        font-size: 42px;
    }

    .mit-hero-actions
    {
        flex-wrap: wrap;
    }

    .mit-home-activity-grid
    {
        grid-template-columns: 1fr;
    }

    .mit-home-membership-inner
    {
        flex-direction: column;

        align-items: flex-start;
    }

    .mit-footer-main
    {
        grid-template-columns: 1fr;

        gap: 30px;
    }

    .mit-footer-contact-map
    {
        grid-template-columns: 1fr;

        gap: 30px;

        padding-bottom: 35px;
    }
    
    .mit-footer-map
{
    grid-column: 1 / -1;
}

    .mit-footer-brand
    {
        max-width: none;
    }

    .mit-footer-bottom
    {
        flex-direction: column;

        align-items: flex-start;

        gap: 7px;
    }
}


@media(max-width:576px)
{
    .mit-home-hero h1
    {
        font-size: 36px;
    }

    .mit-home-hero p
    {
        font-size: 15px;
    }

    .mit-home-intro-highlight
    {
        padding: 30px 22px;
    }

    .mit-home-events-placeholder
    {
        padding: 40px 20px;
    }
}

/* ==========================================================
   FOOTER GOOGLE MAP
========================================================== */

.mit-footer-map
{
    width: 100%;

    min-width: 0;

    margin-top: 0;

    padding-top: 32px;

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

.mit-footer-map-heading
{
    margin-bottom: 16px;
}

.mit-footer-map-heading h3
{
    margin: 0 0 5px;

    color: #ffffff;

    font-family:
        "Poppins",
        sans-serif;

    font-size: 18px;

    font-weight: 600;
}

.mit-footer-map-heading p
{
    margin: 0;

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

    font-size: 12px;
}

.mit-footer-map-frame
{
    width: 100%;

    height: 300px;

    overflow: hidden;

    border-radius: 12px;

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

    box-shadow:
        0 10px 30px rgba(0,0,0,0.16);
}

.mit-footer-map-frame iframe
{
    width: 100%;

    height: 100%;

    display: block;

    border: 0;
}


/* ==========================================================
   FOOTER MAP MOBILE
========================================================== */

@media(max-width:576px)
{
    .mit-footer-map
    {
        margin-top: 0;

        padding-top: 25px;
    }

    .mit-footer-map-frame
    {
        height: 250px;

        border-radius: 9px;
    }
}

/* ==========================================================
   HOMEPAGE HERO - BANNER IMAGE
   Uses: /img/banner.jpg
========================================================== */

.mit-home-hero
{
    min-height: 560px;
    background-image:
        linear-gradient(
            90deg,
            rgba(34, 12, 45, 0.82) 0%,
            rgba(79, 25, 100, 0.62) 45%,
            rgba(79, 25, 100, 0.18) 100%
        ),
        url('/img/banner.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.mit-home-hero::before,
.mit-home-hero::after
{
    z-index: 0;
}

.mit-home-hero-content
{
    position: relative;
    z-index: 3;
}

/* ==========================================================
   HOMEPAGE - MAHAVIR VICHAR
========================================================== */

.mit-home-vichar
{
    background: var(--mit-light-purple);
}

.mit-home-vichar-card
{
    max-width: 1000px;
    margin: 0 auto;
    overflow: hidden;
    background: var(--mit-white);
    border: 1px solid var(--mit-border);
    border-radius: var(--mit-radius-lg);
    box-shadow: var(--mit-shadow);
}

.mit-home-vichar-preview
{
    width: 100%;
    height: 650px;
    background: #eee;
}

.mit-home-vichar-preview iframe
{
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}

.mit-home-vichar-info
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 22px 25px;
    border-top: 1px solid var(--mit-border);
}

.mit-home-vichar-heading
{
    display: flex;
    align-items: center;
    gap: 14px;
}

.mit-home-vichar-icon
{
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--mit-primary), var(--mit-secondary));
    border-radius: 12px;
    font-size: 23px;
}

.mit-home-vichar-label
{
    display: block;
    margin-bottom: 3px;
    color: var(--mit-accent-dark);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.mit-home-vichar-info h3
{
    margin: 0 0 2px;
    color: var(--mit-primary);
    font-size: 21px;
}

.mit-home-vichar-info p
{
    margin: 0;
    color: var(--mit-muted);
    font-size: 13px;
}

.mit-home-vichar-empty
{
    padding: 70px 30px;
    text-align: center;
}

.mit-home-vichar-empty-icon
{
    width: 72px;
    height: 72px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--mit-primary), var(--mit-secondary));
    border-radius: 50%;
    font-size: 30px;
}

.mit-home-vichar-empty h3
{
    margin-bottom: 8px;
    color: var(--mit-primary);
}

.mit-home-vichar-empty p
{
    max-width: 620px;
    margin: 0 auto 22px;
    color: var(--mit-muted);
}

/* ==========================================================
   HOMEPAGE RESPONSIVE - VICHAR / HERO
========================================================== */

@media(max-width:700px)
{
    .mit-home-hero
    {
        min-height: 500px;
        background-position: 60% center;
    }

    .mit-home-vichar-preview
    {
        height: 480px;
    }

    .mit-home-vichar-info
    {
        align-items: flex-start;
        flex-direction: column;
    }

    .mit-home-vichar-info .mit-btn
    {
        width: 100%;
    }
}

@media(max-width:576px)
{
    .mit-home-vichar-preview
    {
        height: 420px;
    }

    .mit-home-vichar-info
    {
        padding: 18px;
    }
}


/* ==========================================================
   HOMEPAGE - ABOUT COMMITMENT CARD
   ADD ONLY - DO NOT REMOVE EXISTING CSS
========================================================== */

.mit-home-intro-highlight
{
    position: relative;
    overflow: hidden;

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

    min-height: 320px;
    padding: 38px 30px;

    text-align: center;

    background: linear-gradient(
        145deg,
        #55206f 0%,
        #6f2d86 55%,
        #7b3a91 100%
    );

    border-radius: 20px;

    color: #ffffff;

    box-shadow:
        0 18px 45px rgba(79, 25, 100, 0.18);
}


/* Decorative glow */

.mit-intro-card-glow
{
    position: absolute;

    width: 230px;
    height: 230px;

    top: -100px;
    right: -80px;

    border-radius: 50%;

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

    pointer-events: none;
}

.mit-intro-card-glow::after
{
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    bottom: -190px;
    left: -190px;

    border-radius: 50%;

    background: rgba(255,124,176,0.10);
}


/* Icon */

.mit-home-intro-highlight .mit-intro-icon
{
    position: relative;
    z-index: 2;

    width: 70px;
    height: 70px;

    margin-bottom: 18px;

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

    border-radius: 50%;

    background: #ffffff;

    color: #5b2273;

    font-size: 28px;

    box-shadow:
        0 8px 25px rgba(0,0,0,0.12);
}


/* Small heading */

.mit-intro-card-label
{
    position: relative;
    z-index: 2;

    display: block;

    margin-bottom: 6px;

    color: #ff7cb0;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 1.8px;
}


/* Hindi heading */

.mit-home-intro-highlight h3
{
    position: relative;
    z-index: 2;

    margin: 0 0 12px;

    color: #ffffff;

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

    line-height: 1.25;
}


/* Description */

.mit-home-intro-highlight p
{
    position: relative;
    z-index: 2;

    max-width: 390px;

    margin: 0 auto;

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

    font-size: 15px;
    line-height: 1.7;
}


/* Commitment pills */

.mit-intro-pill-row
{
    position: relative;
    z-index: 2;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: 8px;

    margin-top: 20px;
}

.mit-intro-pill-row span
{
    display: inline-flex;
    align-items: center;
    gap: 6px;

    padding: 7px 12px;

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

    border-radius: 50px;

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

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

    font-size: 12px;
    font-weight: 600;
}

.mit-intro-pill-row i
{
    color: #ff7cb0;
}


/* ==========================================================
   HOMEPAGE - ACTIVITY IMAGE CARDS
   ADD ONLY - DO NOT REMOVE EXISTING CSS
========================================================== */

.mit-home-activity-card
{
    overflow: hidden;

    padding: 0 !important;

    display: flex;
    flex-direction: column;

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


/* Image wrapper */

.mit-activity-image
{
    position: relative;

    width: 100%;
    height: 190px;

    overflow: hidden;

    background: #eee8f0;
}


/* Activity image */

.mit-activity-image img
{
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.45s ease;
}


/* Soft image overlay */

.mit-activity-image::after
{
    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(
        to bottom,
        rgba(40,15,50,0.02),
        rgba(40,15,50,0.20)
    );

    pointer-events: none;
}


/* Icon overlapping image */

.mit-activity-image .mit-activity-icon
{
    position: absolute;

    z-index: 3;

    left: 22px;
    bottom: -25px;

    width: 58px;
    height: 58px;

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

    border-radius: 14px;

    background: linear-gradient(
        145deg,
        #54206d,
        #73308b
    );

    color: #ffffff;

    font-size: 22px;

    border: 4px solid #ffffff;

    box-shadow:
        0 7px 20px rgba(79,25,100,0.20);
}


/* Card content */

.mit-activity-card-content
{
    display: flex;
    flex-direction: column;

    flex: 1;

    padding: 48px 24px 24px;
}


/* Title */

.mit-activity-card-content h3
{
    margin: 0 0 10px;

    color: #4f1964;

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

    line-height: 1.25;
}


/* Description */

.mit-activity-card-content p
{
    margin: 0;

    color: #667085;

    font-size: 14px;
    line-height: 1.65;
}


/* Explore */

.mit-activity-card-content > span
{
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-top: auto;
    padding-top: 25px;

    color: #64227c;

    font-size: 13px;
    font-weight: 700;
}

.mit-activity-card-content > span i
{
    transition: transform 0.25s ease;
}


/* Hover */

.mit-home-activity-card:hover
{
    transform: translateY(-6px);

    box-shadow:
        0 18px 35px rgba(79,25,100,0.13);
}

.mit-home-activity-card:hover .mit-activity-image img
{
    transform: scale(1.06);
}

.mit-home-activity-card:hover
.mit-activity-card-content > span i
{
    transform: translateX(5px);
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:768px)
{
    .mit-home-intro-highlight
    {
        min-height: 290px;

        padding: 32px 24px;
    }

    .mit-home-intro-highlight h3
    {
        font-size: 23px;
    }

    .mit-activity-image
    {
        height: 200px;
    }
}


@media(max-width:576px)
{
    .mit-home-intro-highlight
    {
        min-height: 280px;

        padding: 30px 20px;

        border-radius: 16px;
    }

    .mit-home-intro-highlight .mit-intro-icon
    {
        width: 62px;
        height: 62px;

        font-size: 24px;
    }

    .mit-home-intro-highlight h3
    {
        font-size: 21px;
    }

    .mit-home-intro-highlight p
    {
        font-size: 14px;
    }

    .mit-intro-pill-row
    {
        gap: 6px;
    }

    .mit-intro-pill-row span
    {
        padding: 6px 9px;

        font-size: 11px;
    }

    .mit-activity-image
    {
        height: 190px;
    }

    .mit-activity-card-content
    {
        padding: 46px 20px 22px;
    }
}

/* ==========================================================
   ABOUT PAGE
========================================================== */


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

.mit-about-hero
{
    position: relative;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #4f1964 0%,
            #64247b 52%,
            #78388f 100%
        );

    color: #ffffff;
}

.mit-about-hero::before
{
    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    top: -260px;
    right: -120px;

    border-radius: 50%;

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

.mit-about-hero::after
{
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    bottom: -230px;
    left: -130px;

    border-radius: 50%;

    background:
        rgba(255,124,176,0.10);
}

.mit-about-hero-inner
{
    position: relative;
    z-index: 2;

    min-height: 420px;

    display: flex;

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

    gap: 50px;

    padding: 70px 0;
}

.mit-about-hero-content
{
    max-width: 700px;
}

.mit-about-eyebrow
{
    display: inline-block;

    margin-bottom: 14px;

    color: #ffb7d2;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 2px;
}

.mit-about-hero h1
{
    margin: 0 0 18px;

    color: #ffffff;

    font-size: clamp(40px, 5vw, 64px);

    line-height: 1.08;
}

.mit-about-hero h1 span
{
    display: block;

    color: #ffcb65;
}

.mit-about-hero p
{
    max-width: 620px;

    margin: 0;

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

    font-size: 17px;

    line-height: 1.7;
}


/* ==========================================================
   YEARS CARD
========================================================== */

.mit-about-years-card
{
    flex-shrink: 0;

    width: 225px;
    height: 225px;

    display: flex;

    flex-direction: column;

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

    text-align: center;

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

    border-radius: 50%;

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

    box-shadow:
        0 20px 50px rgba(0,0,0,0.14);

    backdrop-filter: blur(8px);
}

.mit-about-years-label
{
    color: rgba(255,255,255,0.72);

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.5px;
}

.mit-about-years-card strong
{
    margin: 4px 0;

    color: #ffcb65;

    font-size: 55px;

    line-height: 1;
}

.mit-about-years-text
{
    color: #ffffff;

    font-size: 16px;

    font-weight: 700;
}

.mit-about-years-card small
{
    margin-top: 5px;

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

    font-size: 11px;
}


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

.mit-about-story
{
    background: #ffffff;
}

.mit-about-story-grid
{
    display: grid;

    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(300px, 0.75fr);

    gap: 65px;

    align-items: center;
}

.mit-about-story-content h2
{
    max-width: 650px;

    margin-bottom: 20px;

    color: #4f1964;

    font-size: clamp(30px, 4vw, 44px);

    line-height: 1.15;
}

.mit-about-story-content p
{
    max-width: 760px;

    margin-bottom: 16px;

    color: #667085;

    font-size: 15px;

    line-height: 1.8;
}


/* ==========================================================
   STORY COMMITMENT CARD
========================================================== */

.mit-about-story-card
{
    position: relative;

    overflow: hidden;

    padding: 38px 30px;

    text-align: center;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #55206f,
            #77378e
        );

    box-shadow:
        0 20px 45px rgba(79,25,100,0.18);
}

.mit-about-story-card::before
{
    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    top: -95px;
    right: -70px;

    border-radius: 50%;

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

.mit-about-story-icon
{
    position: relative;
    z-index: 2;

    width: 68px;
    height: 68px;

    display: flex;

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

    margin: 0 auto 18px;

    border-radius: 50%;

    background: #ffffff;

    color: #5b2273;

    font-size: 27px;
}

.mit-about-story-card > span
{
    position: relative;
    z-index: 2;

    display: block;

    margin-bottom: 7px;

    color: #ffb4cf;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.7px;
}

.mit-about-story-card h3
{
    position: relative;
    z-index: 2;

    margin-bottom: 12px;

    color: #ffffff;

    font-size: 26px;
}

.mit-about-story-card p
{
    position: relative;
    z-index: 2;

    margin: 0;

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

    font-size: 14px;

    line-height: 1.75;
}

.mit-about-story-pills
{
    position: relative;
    z-index: 2;

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

    gap: 7px;

    margin-top: 22px;
}

.mit-about-story-pills span
{
    display: inline-flex;

    align-items: center;

    gap: 5px;

    padding: 7px 11px;

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

    border-radius: 50px;

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

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

    font-size: 11px;
}

.mit-about-story-pills i
{
    color: #ff7cb0;
}


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

.mit-about-mission
{
    background: #faf7fb;
}

.mit-about-purpose-grid
{
    display: grid;

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

    gap: 22px;
}

.mit-about-purpose-card
{
    display: flex;

    align-items: flex-start;

    gap: 20px;

    padding: 30px;

    background: #ffffff;

    border:
        1px solid
        rgba(79,25,100,0.09);

    border-radius: 16px;

    box-shadow:
        0 8px 25px rgba(79,25,100,0.06);
}

.mit-about-purpose-icon
{
    flex-shrink: 0;

    width: 58px;
    height: 58px;

    display: flex;

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

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #4f1964,
            #78388f
        );

    color: #ffffff;

    font-size: 23px;
}

.mit-about-purpose-card > div:last-child > span
{
    display: block;

    margin-bottom: 5px;

    color: #7b3a91;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.4px;
}

.mit-about-purpose-card h3
{
    margin-bottom: 9px;

    color: #4f1964;

    font-size: 21px;
}

.mit-about-purpose-card p
{
    margin: 0;

    color: #667085;

    font-size: 14px;

    line-height: 1.7;
}


/* ==========================================================
   OFFICE BEARERS
========================================================== */

.mit-about-office-bearers
{
    background: #ffffff;
}

.mit-office-bearer-grid
{
    display: grid;

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

    gap: 22px;
}

.mit-office-bearer-card
{
    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        rgba(79,25,100,0.10);

    border-radius: 18px;

    box-shadow:
        0 8px 28px rgba(79,25,100,0.07);

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

.mit-office-bearer-card:hover
{
    transform: translateY(-5px);

    box-shadow:
        0 16px 35px rgba(79,25,100,0.13);
}

.mit-office-bearer-photo
{
    height: 255px;

    overflow: hidden;

    background: #f3edf5;
}

.mit-office-bearer-photo img
{
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center top;
}

.mit-office-bearer-content
{
    padding: 22px;
}

.mit-office-bearer-post
{
    display: inline-block;

    margin-bottom: 7px;

    color: #7b3a91;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}

.mit-office-bearer-content h3
{
    margin-bottom: 13px;

    color: #4f1964;

    font-size: 21px;
}

.mit-office-contact
{
    display: block;

    margin-bottom: 7px;

    color: #667085;

    font-size: 12px;
}

.mit-office-contact:hover
{
    color: #71388a;
}

.mit-office-contact i
{
    width: 18px;

    display: inline-block;

    color: #71388a;
}

.mit-office-not-found
{
    margin: 0;

    color: #98a2b3;

    font-size: 13px;
}

.mit-about-office-link
{
    margin-top: 35px;

    text-align: center;
}


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

.mit-about-join
{
    padding: 70px 0;

    background:
        linear-gradient(
            135deg,
            #4f1964,
            #68267e
        );
}

.mit-about-join-inner
{
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;
}

.mit-about-join-inner > div > span
{
    display: block;

    margin-bottom: 8px;

    color: #ffb4cf;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.6px;
}

.mit-about-join h2
{
    margin-bottom: 9px;

    color: #ffffff;

    font-size: clamp(28px, 4vw, 40px);
}

.mit-about-join p
{
    margin: 0;

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

    font-size: 14px;
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:900px)
{
    .mit-about-hero-inner
    {
        min-height: auto;

        padding: 65px 0;

        flex-direction: column;

        align-items: flex-start;
    }

    .mit-about-years-card
    {
        width: 190px;
        height: 190px;

        align-self: center;
    }

    .mit-about-story-grid
    {
        grid-template-columns: 1fr;

        gap: 40px;
    }

    .mit-about-story-card
    {
        max-width: 520px;

        margin: 0 auto;
    }

    .mit-office-bearer-grid
    {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mit-about-join-inner
    {
        flex-direction: column;

        align-items: flex-start;
    }
}


@media(max-width:600px)
{
    .mit-about-hero-inner
    {
        padding: 50px 0;
    }

    .mit-about-hero h1
    {
        font-size: 38px;
    }

    .mit-about-hero p
    {
        font-size: 15px;
    }

    .mit-about-years-card
    {
        width: 175px;
        height: 175px;
    }

    .mit-about-years-card strong
    {
        font-size: 45px;
    }

    .mit-about-story-card
    {
        padding: 32px 22px;
    }

    .mit-about-purpose-grid
    {
        grid-template-columns: 1fr;
    }

    .mit-about-purpose-card
    {
        padding: 24px;

        gap: 15px;
    }

    .mit-office-bearer-grid
    {
        grid-template-columns: 1fr;
    }

    .mit-office-bearer-photo
    {
        height: 280px;
    }

    .mit-about-join
    {
        padding: 55px 0;
    }
}