/* ============================================================
   Cycling4Change — Main Stylesheet  |  Blue & White Theme
   ============================================================ */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Nunito:wght@400;500;600;700&display=swap');

/* ── CSS Variables ─────────────────────────────────────────── */
:root {
    --primary:       #1565C0;
    --primary-dark:  #0D47A1;
    --primary-light: #42A5F5;
    --accent:        #90CAF9;
    --orange:        #FF6D00;
    --dark:          #1a1a2e;
    --gray:          #757575;
    --light:         #F5F5F5;
    --light-green:   #E3F2FD;
    --white:         #FFFFFF;
    --shadow:        0 4px 20px rgba(0,0,0,.10);
    --shadow-hover:  0 8px 30px rgba(0,0,0,.15);
    --transition:    all .3s ease;
    --radius:        10px;
}

/* ── Reset / Base ──────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body   { font-family: 'Nunito', sans-serif; color: #333; overflow-x: hidden; }
h1,h2,h3,h4,h5,h6 { font-family: 'Poppins', sans-serif; font-weight: 700; }
a      { text-decoration: none; color: inherit; transition: var(--transition); }
img    { max-width: 100%; display: block; }

/* ── Utility ───────────────────────────────────────────────── */
.text-green  { color: var(--primary) !important; }
.bg-green    { background-color: var(--primary) !important; }
.bg-light-green { background-color: var(--light-green) !important; }

.btn-green {
    background: var(--primary); color: #fff;
    border: 2px solid var(--primary);
    padding: 10px 28px; border-radius: 30px; font-weight: 600;
    transition: var(--transition); display: inline-block;
}
.btn-green:hover {
    background: var(--primary-dark); border-color: var(--primary-dark); color: #fff;
    transform: translateY(-2px); box-shadow: 0 5px 15px rgba(21,101,192,.3);
}
.btn-outline-green {
    background: transparent; color: var(--primary);
    border: 2px solid var(--primary);
    padding: 10px 28px; border-radius: 30px; font-weight: 600;
    transition: var(--transition); display: inline-block;
}
.btn-outline-green:hover { background: var(--primary); color: #fff; transform: translateY(-2px); }

.section-tag {
    display: inline-block; color: var(--primary);
    font-weight: 600; font-size: .85rem; letter-spacing: 2px; text-transform: uppercase;
    margin-bottom: 8px;
}
.section-tag::before {
    content: ''; display: inline-block;
    width: 28px; height: 2px; background: var(--primary);
    margin-right: 8px; vertical-align: middle;
}
.section-title { font-size: 2.1rem; font-weight: 800; color: var(--dark); margin-bottom: 10px; }
.section-title span { color: var(--primary); }
.section-subtitle { color: var(--gray); font-size: 1rem; margin-bottom: 40px; max-width: 560px; }

/* ── Navbar ────────────────────────────────────────────────── */
.navbar {
    background: rgba(13, 71, 161, .96) !important;
    padding: 14px 0; transition: var(--transition);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.navbar.scrolled {
    background: var(--primary-dark) !important;
    box-shadow: 0 2px 20px rgba(0,0,0,.2); padding: 10px 0;
}
.navbar-brand {
    font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 1.45rem;
    color: #fff !important; display: flex; align-items: center; gap: 10px;
}
.brand-icon {
    width: 38px; height: 38px; background: var(--primary-light);
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; color: #fff;
}
.brand-logo-img {
    width: 38px; height: 38px; object-fit: contain; border-radius: 6px;
}
.navbar-nav .nav-link {
    color: rgba(255,255,255,.85) !important;
    font-weight: 600; padding: 8px 14px !important;
    border-radius: 6px; font-size: .95rem;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { color: #fff !important; background: rgba(255,255,255,.14); }
.navbar-toggler { border-color: rgba(255,255,255,.5) !important; }
.navbar-toggler-icon { filter: invert(1); }
.btn-admin-nav {
    background: var(--orange) !important; color: #fff !important;
    padding: 6px 16px !important; border-radius: 20px !important; font-size: .85rem !important;
    margin-left: 8px;
}
.btn-admin-nav:hover { background: #E65100 !important; }

/* ── Hero Carousel ─────────────────────────────────────────── */
#heroCarousel, #heroCarousel .carousel-item {
    height: 88vh; min-height: 540px;
}
.carousel-item {
    background-size: cover; background-position: center;
    position: relative;
}
.slide-bg-1 { background: linear-gradient(135deg,#051e52 0%,#0D47A1 45%,#1565C0 100%); }
.slide-bg-2 { background: linear-gradient(135deg,#1a1a2e 0%,#0a2a6e 50%,#1565C0 100%); }
.slide-bg-3 { background: linear-gradient(135deg,#0D47A1 0%,#1976D2 50%,#42A5F5 100%); }

.carousel-overlay {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.52);
    display: flex; align-items: center;
}
.hero-content { color: #fff; max-width: 680px; }
.hero-tag {
    display: inline-block; background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.3); padding: 5px 16px;
    border-radius: 20px; font-size: .8rem; font-weight: 600;
    letter-spacing: 1px; text-transform: uppercase; margin-bottom: 20px;
}
.hero-content h1 {
    font-size: clamp(1.9rem, 5vw, 3.4rem); font-weight: 800; line-height: 1.2;
    margin-bottom: 18px; text-shadow: 2px 2px 10px rgba(0,0,0,.3);
}
.hero-content p { font-size: 1.05rem; color: rgba(255,255,255,.88); margin-bottom: 28px; max-width: 520px; }
.hero-btns { display: flex; gap: 14px; flex-wrap: wrap; }
.btn-hero-primary {
    background: var(--primary-light); color: #fff; border: none;
    padding: 12px 30px; border-radius: 30px; font-weight: 700; font-size: .95rem;
    transition: var(--transition); display: inline-flex; align-items: center; gap: 8px;
}
.btn-hero-primary:hover {
    background: var(--primary); color: #fff; transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(21,101,192,.4);
}
.btn-hero-outline {
    background: transparent; color: #fff;
    border: 2px solid rgba(255,255,255,.7);
    padding: 11px 30px; border-radius: 30px; font-weight: 700; font-size: .95rem;
    transition: var(--transition); display: inline-flex; align-items: center; gap: 8px;
}
.btn-hero-outline:hover { background: rgba(255,255,255,.14); color: #fff; border-color: #fff; }

.carousel-indicators [data-bs-target] {
    width: 10px; height: 10px; border-radius: 50%;
    background-color: rgba(255,255,255,.55); border: none;
}
.carousel-indicators .active { background-color: var(--primary-light); width: 24px; border-radius: 5px; }
.carousel-control-prev,
.carousel-control-next {
    width: 46px; height: 46px; background: rgba(255,255,255,.14);
    border-radius: 50%; top: 50%; transform: translateY(-50%);
    margin: 0 15px;
}

/* ── Event Finder ──────────────────────────────────────────── */
.finder-wrap { position: relative; z-index: 10; margin-top: -50px; padding: 0 0 20px; }
.event-finder-card {
    background: #fff; border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0,0,0,.14); padding: 28px 32px;
}
.event-finder-card .form-label {
    font-weight: 700; font-size: .78rem; color: var(--gray);
    text-transform: uppercase; letter-spacing: 1.1px; margin-bottom: 6px;
}
.event-finder-card .form-control,
.event-finder-card .form-select {
    border: 1.5px solid #e0e0e0; border-radius: 8px;
    padding: 10px 13px; font-size: .93rem;
}
.event-finder-card .form-control:focus,
.event-finder-card .form-select:focus {
    border-color: var(--primary); box-shadow: 0 0 0 3px rgba(21,101,192,.1);
}
.btn-search {
    background: var(--primary); color: #fff; border: none;
    border-radius: 8px; padding: 11px 26px;
    font-weight: 700; font-size: .95rem;
    width: 100%; margin-top: 26px; transition: var(--transition);
    display: flex; align-items: center; justify-content: center; gap: 8px;
}
.btn-search:hover { background: var(--primary-dark); transform: translateY(-2px); box-shadow: 0 5px 15px rgba(21,101,192,.3); }

/* ── About Section ─────────────────────────────────────────── */
.about-section { padding: 90px 0; }
.about-img-wrap { position: relative; }
.about-img-wrap img { border-radius: 16px; width: 100%; height: 440px; object-fit: cover; }
.about-badge {
    position: absolute; bottom: 25px; right: -18px;
    background: var(--primary); color: #fff;
    padding: 18px 22px; border-radius: 12px; text-align: center;
    box-shadow: var(--shadow);
}
.about-badge .badge-num  { font-size: 2rem; font-weight: 800; line-height: 1; }
.about-badge .badge-txt  { font-size: .8rem; opacity: .9; }
.about-content { padding-left: 28px; }
.about-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; margin-top: 28px; }
.about-stat { background: var(--light-green); border-radius: 12px; padding: 18px; text-align: center; transition: var(--transition); }
.about-stat:hover { background: var(--primary); }
.about-stat:hover .stat-num,
.about-stat:hover .stat-lbl { color: #fff; }
.stat-num  { font-size: 1.8rem; font-weight: 800; color: var(--primary); display: block; }
.stat-lbl  { font-size: .82rem; color: var(--gray); font-weight: 600; transition: var(--transition); }

/* ── Event Cards ───────────────────────────────────────────── */
.events-section { padding: 90px 0; background: var(--light); }

/* ── Event Grid Cards (homepage / detail related) ──────────── */
.event-card {
    background: #fff; border-radius: var(--radius); overflow: hidden;
    box-shadow: var(--shadow); transition: var(--transition);
    display: flex; flex-direction: column; height: 100%;
}
.event-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-4px); }

.ev-img-wrap {
    position: relative; width: 100%; height: 210px; overflow: hidden; flex-shrink: 0;
}
.ev-img-wrap img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .5s ease;
}
.event-card:hover .ev-img-wrap img { transform: scale(1.06); }

.ev-body {
    flex: 1; padding: 18px 20px 12px;
}
.ev-body .ev-title { font-size: 1.05rem; margin-bottom: 10px; }
.ev-body .ev-meta  { margin-bottom: 0; }

.ev-footer {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 20px 16px; border-top: 1px solid #f0f0f0;
}

/* ── Event Row Cards (list layout) ────────────────────────── */
.ev-list { display: flex; flex-direction: column; gap: 18px; }
.ev-row-card {
    background: #fff; border-radius: var(--radius); overflow: hidden;
    box-shadow: var(--shadow); transition: var(--transition);
    display: flex; flex-direction: row; align-items: stretch;
}
.ev-row-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }

.ev-row-img {
    position: relative; flex-shrink: 0;
    width: 220px; overflow: hidden;
}
.ev-row-img img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .5s ease;
}
.ev-row-card:hover .ev-row-img img { transform: scale(1.06); }

.ev-badge {
    position: absolute; top: 10px; left: 10px;
    padding: 4px 11px; border-radius: 20px;
    font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
}
.badge-india         { background: var(--primary); color: #fff; }
.badge-international { background: var(--orange);  color: #fff; }
.badge-featured {
    position: absolute; top: 10px; right: 10px;
    background: #FFD700; color: #333;
    padding: 3px 9px; border-radius: 20px; font-size: .68rem; font-weight: 700;
}

.ev-row-body {
    flex: 1; display: flex; flex-direction: column;
    padding: 18px 22px; min-width: 0;
}
.ev-row-main { flex: 1; }
.ev-title { font-size: 1.08rem; font-weight: 700; color: var(--dark); margin-bottom: 6px; line-height: 1.4; }
.ev-row-desc {
    font-size: .84rem; color: #666; margin-bottom: 10px;
    line-height: 1.55; display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ev-meta  { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 0; }
.ev-meta-item {
    display: flex; align-items: center; gap: 5px;
    font-size: .8rem; color: var(--gray);
}
.ev-meta-item i { color: var(--primary); font-size: .82rem; }

.ev-row-footer {
    display: flex; align-items: center; justify-content: space-between;
    padding-top: 14px; margin-top: 14px; border-top: 1px solid #f0f0f0;
}
.ev-price { font-weight: 700; font-size: 1.08rem; color: var(--primary); }
.ev-price small { font-size: .72rem; color: var(--gray); font-weight: 400; }
.btn-explore {
    background: var(--primary); color: #fff; border: none;
    padding: 7px 20px; border-radius: 20px; font-size: .83rem; font-weight: 600;
    transition: var(--transition); white-space: nowrap;
}
.btn-explore:hover { background: var(--primary-dark); color: #fff; }

@media (max-width: 575px) {
    .ev-row-card { flex-direction: column; }
    .ev-row-img  { width: 100%; height: 180px; }
}

/* ── Calendar Section ──────────────────────────────────────── */
.calendar-section { padding: 90px 0; }
.calendar-section .fc { font-family: 'Nunito', sans-serif; }
.calendar-section .fc-toolbar-title { font-family: 'Poppins', sans-serif; font-weight: 700; }
.calendar-section .fc-button-primary          { background-color: var(--primary) !important; border-color: var(--primary) !important; }
.calendar-section .fc-button-primary:hover    { background-color: var(--primary-dark) !important; border-color: var(--primary-dark) !important; }
.calendar-section .fc-button-primary:not(:disabled).fc-button-active { background-color: var(--primary-dark) !important; }
.calendar-section .fc-daygrid-event { background: var(--primary); border-color: var(--primary); font-size: .74rem; padding: 2px 5px; border-radius: 4px; }
.calendar-section .fc-list-event-title a { color: var(--primary); }

/* ── Stats Counter ─────────────────────────────────────────── */
.stats-section { background: var(--primary); padding: 65px 0; color: #fff; }
.stat-counter { text-align: center; padding: 15px; }
.counter-icon  { font-size: 2.4rem; color: rgba(255,255,255,.28); margin-bottom: 10px; }
.counter-num   { font-size: 2.8rem; font-weight: 800; line-height: 1; font-family: 'Poppins', sans-serif; }
.counter-lbl   { font-size: .9rem; color: rgba(255,255,255,.78); font-weight: 500; margin-top: 6px; }

/* ── Features / Why Cycle ──────────────────────────────────── */
.features-section { padding: 90px 0; background: var(--light); }
.feature-card {
    background: #fff; border-radius: var(--radius);
    padding: 34px 28px; text-align: center;
    box-shadow: var(--shadow); transition: var(--transition); height: 100%;
}
.feature-card:hover { transform: translateY(-5px); background: var(--primary); color: #fff; }
.feature-card:hover .feat-icon,
.feature-card:hover h4,
.feature-card:hover p { color: #fff; }
.feat-icon  { font-size: 2.4rem; color: var(--primary); margin-bottom: 18px; transition: var(--transition); }
.feature-card h4 { font-size: 1.05rem; font-weight: 700; margin-bottom: 10px; transition: var(--transition); }
.feature-card p  { font-size: .88rem; color: var(--gray); line-height: 1.7; margin: 0; transition: var(--transition); }

/* ── CTA Banner ────────────────────────────────────────────── */
.cta-section {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    padding: 78px 0; color: #fff; text-align: center;
}
.cta-section h2 { font-size: 2.1rem; font-weight: 800; margin-bottom: 14px; }
.cta-section p  { font-size: 1.05rem; color: rgba(255,255,255,.85); max-width: 580px; margin: 0 auto 28px; }
.btn-cta {
    background: #fff; color: var(--primary);
    border: 2px solid #fff; padding: 12px 34px;
    border-radius: 30px; font-weight: 700; font-size: .98rem;
    transition: var(--transition); display: inline-block;
}
.btn-cta:hover { background: transparent; color: #fff; }

/* ── Page Header (inner pages) ─────────────────────────────── */
.page-header {
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
    padding: 100px 0 55px; color: #fff; margin-top: 70px;
}
.page-header h1 { font-size: 2.4rem; font-weight: 800; }
.breadcrumb-item a            { color: rgba(255,255,255,.78); }
.breadcrumb-item.active       { color: rgba(255,255,255,.62); }
.breadcrumb-item+.breadcrumb-item::before { color: rgba(255,255,255,.45); }

/* ── Events Listing ────────────────────────────────────────── */
.events-listing { padding: 60px 0; }
.filter-sidebar {
    background: #fff; border-radius: var(--radius); padding: 24px;
    box-shadow: var(--shadow);
}
.filter-sidebar h5 { font-weight: 700; margin-bottom: 18px; color: var(--dark); }
.filter-group { margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid #f0f0f0; }
.filter-group:last-child { border-bottom: none; margin-bottom: 0; }
.filter-group label { font-weight: 600; font-size: .82rem; color: var(--dark); margin-bottom: 6px; display: block; }
.filter-group .form-control,
.filter-group .form-select { font-size: .9rem; border: 1.5px solid #e0e0e0; border-radius: 8px; }
.filter-group .form-control:focus,
.filter-group .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(21,101,192,.1); }
.results-info { color: var(--gray); font-size: .88rem; margin-bottom: 18px; }
.no-events { text-align: center; padding: 55px 20px; color: var(--gray); }
.no-events i { font-size: 3.5rem; color: #e0e0e0; display: block; margin-bottom: 16px; }

/* -- Mumbai Randonneurs Club Hero ----------------------------- */
.club-hero {
    position: relative; min-height: 460px; margin-top: 70px;
    display: flex; align-items: center;
    background: url('https://images.unsplash.com/photo-1571068316344-75bc76f77890?w=1600&q=80')
                center center / cover no-repeat;
}
.club-hero-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(135deg,rgba(5,30,82,.82) 0%,rgba(13,71,161,.70) 50%,rgba(21,101,192,.55) 100%);
}
.club-hero-content {
    position: relative; z-index: 1;
    text-align: center; color: #fff; padding: 60px 20px; width: 100%;
}
.club-hero-logo {
    width: 150px; height: 125px; object-fit: contain; border-radius: 8px;
    background: rgba(255,255,255,.15); padding: 8px; margin-bottom: 18px;
    border: 3px solid rgba(255,255,255,.4);
}
.club-hero-icon {
    width: 90px; height: 90px; border-radius: 50%;
    background: rgba(255,255,255,.15); border: 3px solid rgba(255,255,255,.4);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 2.4rem; margin-bottom: 18px; color: #fff;
}
.club-hero-title {
    font-size: 2.8rem; font-weight: 800; letter-spacing: -.5px;
    margin-bottom: 12px; text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
.club-hero-sub {
    font-size: 1.08rem; opacity: .88;
    max-width: 560px; margin: 0 auto 28px; line-height: 1.6;
}
.club-hero-stats {
    display: inline-flex; align-items: center; gap: 20px;
    background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25);
    border-radius: 50px; padding: 10px 28px; backdrop-filter: blur(6px);
}
.chs-item { text-align: center; }
.chs-num  { display: block; font-size: 1.6rem; font-weight: 800; line-height: 1; }
.chs-label { font-size: .75rem; opacity: .78; text-transform: uppercase; letter-spacing: 1px; }
.chs-link  { color: #fff; text-decoration: none; font-size: .9rem; font-weight: 600; opacity: .9; transition: opacity .2s; }
.chs-link:hover { opacity: 1; color: var(--accent); }
.chs-divider { width: 1px; height: 36px; background: rgba(255,255,255,.3); }
.club-events-section { padding: 60px 0; }
.club-events-heading { font-size: 1.5rem; font-weight: 700; color: var(--dark); margin: 0; }
@media (max-width: 575px) {
    .club-hero-title { font-size: 1.9rem; }
    .club-hero-sub   { font-size: .95rem; }
}

/* ── Event Detail ──────────────────────────────────────────── */
.event-hero {
    height: 440px; background-size: cover; background-position: center;
    position: relative; margin-top: 70px;
}
.event-hero-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.25) 0%, rgba(0,0,0,.7) 100%);
    display: flex; align-items: flex-end; padding-bottom: 36px;
}
.event-hero-overlay .ev-hero-title  { color: #fff; font-size: clamp(1.5rem,4vw,2.4rem); font-weight: 800; margin-bottom: 8px; }
.event-info-bar { background: var(--primary); padding: 18px 0; color: #fff; }
.ev-info-item   { text-align: center; padding: 8px 14px; border-right: 1px solid rgba(255,255,255,.2); }
.ev-info-item:last-child { border-right: none; }
.ev-info-lbl { font-size: .72rem; opacity: .78; text-transform: uppercase; letter-spacing: 1px; display: block; }
.ev-info-val { font-size: 1.05rem; font-weight: 700; display: block; margin-top: 3px; }
.event-detail-body { padding: 55px 0; }
.detail-section-title { font-size: 1.35rem; font-weight: 700; color: var(--dark); margin-bottom: 18px; }

/* Timeline / Itinerary */
.timeline { position: relative; padding-left: 28px; }
.timeline::before { content: ''; position: absolute; left: 13px; top: 0; bottom: 0; width: 2px; background: var(--primary-light); }
.tl-item { position: relative; margin-bottom: 28px; padding-left: 26px; }
.tl-dot  { position: absolute; left: -20px; top: 6px; width: 15px; height: 15px; background: var(--primary); border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px var(--primary); }
.tl-day  { display: inline-block; background: var(--primary); color: #fff; padding: 3px 11px; border-radius: 12px; font-size: .72rem; font-weight: 700; margin-bottom: 7px; }
.tl-card { background: #fff; border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.tl-card h5 { font-size: .98rem; font-weight: 700; color: var(--dark); margin-bottom: 7px; }
.tl-card p  { font-size: .87rem; color: #666; margin-bottom: 9px; line-height: 1.6; }
.tl-meta    { display: flex; gap: 14px; flex-wrap: wrap; }
.tl-meta span { font-size: .8rem; color: var(--gray); display: flex; align-items: center; gap: 5px; }
.tl-meta span i { color: var(--primary); }

/* Gallery */
.gallery-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 12px; }
.gal-item { border-radius: 8px; overflow: hidden; aspect-ratio: 4/3; }
.gal-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.gal-item:hover img { transform: scale(1.05); }

/* Sidebar booking card */
.event-sidebar { position: sticky; top: 90px; }
.book-card { background: #fff; border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); margin-bottom: 18px; }
.price-display { font-size: 1.9rem; font-weight: 800; color: var(--primary); margin-bottom: 14px; }
.price-display small { font-size: .85rem; color: var(--gray); font-weight: 400; }
.btn-register {
    background: var(--primary); color: #fff; border: none;
    width: 100%; padding: 13px; border-radius: 10px;
    font-weight: 700; font-size: .98rem; transition: var(--transition);
}
.btn-register:hover { background: var(--primary-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(21,101,192,.3); }

/* ── About Page ────────────────────────────────────────────── */
.about-page { padding: 65px 0; }
.mission-card { background: var(--light-green); border-radius: var(--radius); padding: 30px; height: 100%; border-left: 4px solid var(--primary); }
.mission-card i { font-size: 2rem; color: var(--primary); margin-bottom: 14px; }
.mission-card h4 { font-size: 1.1rem; font-weight: 700; margin-bottom: 10px; }

/* ── Contact Page ──────────────────────────────────────────── */
.contact-page { padding: 65px 0; }
.contact-form-card { background: #fff; border-radius: var(--radius); padding: 38px; box-shadow: var(--shadow); }
.contact-form-card h3 { font-size: 1.45rem; font-weight: 700; margin-bottom: 22px; }
.contact-info-card { background: var(--primary); border-radius: var(--radius); padding: 38px; color: #fff; height: 100%; }
.contact-info-card h3 { font-size: 1.45rem; font-weight: 700; margin-bottom: 22px; }
.ci-item { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 22px; }
.ci-icon { width: 44px; height: 44px; background: rgba(255,255,255,.14); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.ci-text h6 { font-weight: 700; margin-bottom: 3px; font-size: .9rem; }
.ci-text p  { opacity: .82; font-size: .86rem; margin: 0; }
.form-control, .form-select { border: 1.5px solid #e0e0e0; border-radius: 8px; padding: 11px 14px; font-size: .93rem; transition: var(--transition); }
.form-control:focus, .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(21,101,192,.1); }
.alert-form { border-radius: 8px; padding: 14px 18px; margin-bottom: 18px; display: none; }
.alert-form.alert-success { background: var(--light-green); border: 1px solid var(--primary-light); color: var(--primary); }
.alert-form.alert-danger  { background: #FFEBEE; border: 1px solid #EF9A9A; color: #C62828; }

/* ── Footer ────────────────────────────────────────────────── */
.footer { background: var(--primary-dark); color: rgba(255,255,255,.82); padding: 65px 0 0; }
.footer-brand { font-size: 1.25rem; font-weight: 800; color: #fff; font-family: 'Poppins', sans-serif; margin-bottom: 13px; display: flex; align-items: center; gap: 9px; }
.footer-desc { font-size: .88rem; line-height: 1.7; color: rgba(255,255,255,.65); margin-bottom: 18px; }
.footer h5 { color: #fff; font-weight: 700; font-size: .95rem; margin-bottom: 18px; padding-bottom: 8px; border-bottom: 2px solid var(--primary-light); display: inline-block; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 9px; }
.footer-links a { color: rgba(255,255,255,.65); font-size: .88rem; display: flex; align-items: center; gap: 7px; }
.footer-links a::before { content: '›'; color: var(--primary-light); }
.footer-links a:hover { color: var(--accent); padding-left: 4px; }
.footer-ev { display: flex; gap: 11px; align-items: flex-start; margin-bottom: 13px; }
.footer-ev img { width: 56px; height: 46px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.footer-ev-name { font-size: .83rem; color: rgba(255,255,255,.88); font-weight: 600; line-height: 1.3; }
.footer-ev-date { font-size: .76rem; color: var(--primary-light); margin-top: 3px; }
.footer-ci { display: flex; align-items: center; gap: 11px; margin-bottom: 13px; }
.footer-ci i { color: var(--primary-light); width: 18px; font-size: .95rem; }
.footer-ci span { font-size: .86rem; color: rgba(255,255,255,.65); }
.social-links { display: flex; gap: 9px; margin-top: 13px; }
.social-link {
    width: 36px; height: 36px; background: rgba(255,255,255,.1);
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: .88rem; transition: var(--transition);
}
.social-link:hover { background: var(--primary-light); transform: translateY(-3px); }
.footer-bottom { background: rgba(0,0,0,.22); padding: 14px 0; margin-top: 45px; text-align: center; }
.footer-bottom p { margin: 0; font-size: .82rem; color: rgba(255,255,255,.55); }
.footer-bottom a { color: var(--primary-light); }

/* ── Back to Top ───────────────────────────────────────────── */
#backToTop {
    position: fixed; bottom: 28px; right: 28px;
    width: 44px; height: 44px; background: var(--primary); color: #fff;
    border: none; border-radius: 50%; font-size: 1.05rem; cursor: pointer;
    box-shadow: 0 4px 12px rgba(21,101,192,.35);
    transition: var(--transition); opacity: 0; visibility: hidden; z-index: 999;
}
#backToTop.visible { opacity: 1; visibility: visible; }
#backToTop:hover   { background: var(--primary-dark); transform: translateY(-3px); }

/* ── Pagination ────────────────────────────────────────────── */
.page-link { color: var(--primary); border-radius: 6px; margin: 0 2px; border: 1.5px solid #e0e0e0; }
.page-link:hover, .page-item.active .page-link { background: var(--primary); border-color: var(--primary); color: #fff; }

/* ── Admin ─────────────────────────────────────────────────── */
.admin-body  { background: #f4f6f9; min-height: 100vh; }
.admin-sidebar {
    width: 240px; background: var(--primary-dark); min-height: 100vh;
    position: fixed; top: 0; left: 0; z-index: 1000;
    display: flex; flex-direction: column; padding-top: 0;
}
.admin-sidebar-brand {
    padding: 20px 22px; background: rgba(0,0,0,.2);
    font-family: 'Poppins', sans-serif; font-weight: 800;
    font-size: 1.1rem; color: #fff; display: flex; align-items: center; gap: 9px;
}
.admin-nav { flex: 1; padding: 18px 0; }
.admin-nav-link {
    display: flex; align-items: center; gap: 11px;
    color: rgba(255,255,255,.72); font-size: .9rem; font-weight: 600;
    padding: 11px 22px; transition: var(--transition);
}
.admin-nav-link i { width: 18px; text-align: center; }
.admin-nav-link:hover,
.admin-nav-link.active { color: #fff; background: rgba(255,255,255,.12); }
.admin-nav-section { font-size: .7rem; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.38); padding: 14px 22px 6px; }
.admin-main  { margin-left: 240px; padding: 24px; }
.admin-topbar {
    background: #fff; border-radius: var(--radius); padding: 16px 22px;
    display: flex; align-items: center; justify-content: space-between;
    box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 24px;
}
.admin-topbar h4 { font-size: 1.15rem; font-weight: 700; margin: 0; color: var(--dark); }
.stat-widget {
    background: #fff; border-radius: var(--radius);
    padding: 22px; box-shadow: var(--shadow);
    display: flex; align-items: center; gap: 16px; margin-bottom: 20px;
}
.stat-widget-icon { width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #fff; flex-shrink: 0; }
.stat-widget-num  { font-size: 1.7rem; font-weight: 800; color: var(--dark); line-height: 1; }
.stat-widget-lbl  { font-size: .82rem; color: var(--gray); margin-top: 3px; }
.admin-card { background: #fff; border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); margin-bottom: 20px; }
.admin-card h5 { font-size: 1rem; font-weight: 700; margin-bottom: 18px; color: var(--dark); }
.table th { background: #f8f9fa; font-size: .82rem; text-transform: uppercase; letter-spacing: .8px; color: var(--gray); font-weight: 700; }
.table td { vertical-align: middle; font-size: .9rem; }
.badge-status-active    { background: #E3F2FD; color: #1565C0; }
.badge-status-inactive  { background: #FFF3E0; color: #E65100; }
.badge-status-completed { background: #E3F2FD; color: #1565C0; }
.admin-login-page { min-height: 100vh; background: linear-gradient(135deg, var(--primary-dark), var(--primary)); display: flex; align-items: center; justify-content: center; }
.admin-login-card { background: #fff; border-radius: 16px; padding: 44px 40px; box-shadow: 0 20px 60px rgba(0,0,0,.2); width: 100%; max-width: 400px; }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width:991px) {
    #heroCarousel, #heroCarousel .carousel-item { height: 70vh; }
    .about-content { padding-left: 0; margin-top: 36px; }
    .about-badge   { right: 0; }
    .gallery-grid  { grid-template-columns: repeat(2,1fr); }
    .ev-info-item  { border-right: none; border-bottom: 1px solid rgba(255,255,255,.2); }
    .admin-sidebar { display: none; }
    .admin-main    { margin-left: 0; }
}
@media (max-width:767px) {
    .section-title { font-size: 1.65rem; }
    #heroCarousel, #heroCarousel .carousel-item { height: 60vh; }
    .event-finder-card { padding: 18px; }
    .btn-search { margin-top: 8px; }
    .about-stats { grid-template-columns: repeat(2,1fr); }
    .gallery-grid  { grid-template-columns: 1fr; }
    .event-hero { height: 280px; }
    .contact-info-card { margin-top: 28px; }
    .finder-wrap { margin-top: -20px; }
}
@media (max-width:575px) {
    .hero-content h1 { font-size: 1.65rem; }
    .hero-btns  { flex-direction: column; }
    .about-badge { display: none; }
}