.index-list a,
.index-list a:visited,
.index-list a:hover,
.index-list a:active {
    text-decoration: none;
    color: inherit;
}
/* ═══════════════════════════════════════════════════
   TOKEN SYSTEM (Identical to Issue 2)
═══════════════════════════════════════════════════ */
:root {
  --navy:      #01236a;
  --navy-deep: #010f2e;
  --navy-mid:  #0d3885;
  --cobalt:    #1A5EB8;
  --cobalt-lt: #3575d4;
  --gold:      #C9922A;
  --gold-lt:   #E8B84B;
  --gold-pale: #FBF4E8;
  --amber:     #f5a623;
  --cream:     #FAF8F4;
  --white:     #FFFFFF;
  --ink:       #0D0E1A;
  --ink-mid:   #3B3C50;
  --ink-soft:  #6B6C80;
  --rule:      rgba(201,146,42,0.18);
  --rule-hard: #E2DDD5;

  --ff-display: 'DM Sans', system-ui, sans-serif;
  --ff-body:    'DM Sans', system-ui, sans-serif;
  --ff-mono:    'DM Mono', monospace;

  --radius-sm:  6px;
  --radius-md:  14px;
  --radius-lg:  24px;
  --radius-xl:  40px;

  --shadow-sm:  0 2px 8px rgba(1,35,106,.06);
  --shadow-md:  0 6px 24px rgba(1,35,106,.10);
  --shadow-lg:  0 16px 48px rgba(1,35,106,.14);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--ff-body);
  background: var(--cream);
  color: var(--ink);
  line-height: 1.7;
  overflow-x: clip;
}

.page-number{
    text-align:right;
    margin:20px 0;
    font-size:14px;
    color:#666;
}

/* HERO BANNER (Identical to Issue 2) */
.hero-banner{
    width:100%;
    overflow:hidden;
}

.hero-banner img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
}

/* [Navbar CSS moved to navbar.css] */
.shell {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px 80px;
}

.section-head {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 45px 0 40px;
}

.section-head-line {
  flex: 1;
  height: 1px;
  background: var(--rule-hard);
}

.section-head-label {
  font-family: var(--ff-mono);
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  background: var(--gold-pale);
  border: 1px solid rgba(201,146,42,.3);
  padding: 6px 16px;
  border-radius: 100px;
  white-space: nowrap;
}

/* ═══════════════════════════════════════════════════
   OVERVIEW METRICS STRIP
═══════════════════════════════════════════════════ */
.metrics-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  max-width: 1180px;
  margin: -32px auto 30px;
  padding: 0 20px;
  position: relative;
  z-index: 10;
}
.metric-card {
  background: #fff;
  border-radius: 16px;
  padding: 22px 20px;
  text-align: center;
  box-shadow: 0 12px 30px rgba(1,35,106,.10);
  border: 1px solid rgba(201,146,42,.22);
  transition: transform .25s ease, box-shadow .25s ease;
}
.metric-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(1,35,106,.15);
}
.metric-icon {
  font-size: 26px;
  margin-bottom: 6px;
}
.metric-title {
  font-family: var(--ff-body);
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  line-height: 1.2;
}
.metric-sub {
  font-size: 12px;
  color: var(--ink-soft);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
}

@media (max-width: 900px) {
  .metrics-strip {
    grid-template-columns: repeat(2, 1fr);
    margin-top: -20px;
  }
}
@media (max-width: 540px) {
  .metrics-strip {
    grid-template-columns: 1fr;
    margin-top: 20px;
  }
}

/* ═══════════════════════════════════════════════════
   PAGE HEADERS & SECTION DIVIDERS
═══════════════════════════════════════════════════ */
.section-head {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 55px 0 35px;
}
.section-head-line {
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(201,146,42,0.45), transparent);
}
.section-head-label {
  padding: 9px 26px;
  font-family: var(--ff-body);
  font-size: 21px;
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .08em;
  background: #fff;
  border: 1.5px solid var(--gold);
  border-radius: 40px;
  margin: 0 16px;
  box-shadow: 0 4px 18px rgba(201,146,42,.12);
  text-align: center;
  white-space: nowrap;
}

/* ═══════════════════════════════════════════════════
   SECTION 01: INDEX SECTION (Refined Luxury Card)
═══════════════════════════════════════════════════ */
.index-section {
  max-width: 1220px;
  margin: 0 auto 35px;
  padding: 42px 48px;
  background: linear-gradient(145deg, #ffffff 0%, #faf8f3 100%);
  border: 1.5px solid rgba(201, 146, 42, .3);
  border-radius: 26px;
  box-shadow: 0 18px 45px rgba(1, 35, 106, .08);
  position: relative;
  overflow: hidden;
}
.index-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 5px;
  background: linear-gradient(90deg, var(--gold), var(--cobalt), var(--gold));
}
.page-title {
  text-align: center;
  margin-bottom: 25px;
}
.page-title h1 {
  font-family: var(--ff-body);
  font-size: clamp(30px, 4vw, 44px);
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  margin-bottom: 12px;
  letter-spacing: .02em;
}
.title-border {
  width: 90px;
  height: 4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-lt));
  margin: 0 auto;
  border-radius: 6px;
}
.index-list {
  font-size: 16.5px;
  line-height: 1.95;
  color: #303142;
  padding-left: 26px;
  font-family: var(--ff-body);
}
.index-list > li {
  margin-bottom: 15px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(1, 35, 106, .07);
  transition: transform .2s ease;
}
.index-list > li:hover {
  transform: translateX(4px);
}
.index-list > li:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.index-list strong {
  color: var(--navy);
  font-weight: 700;
  font-size: 17px;
}
.index-list a {
  color: var(--navy-mid);
  text-decoration: none;
  transition: color .2s ease;
}
.index-list a:hover {
  color: var(--gold);
}
.index-list ul {
  margin-top: 10px;
  margin-left: 20px;
  padding-left: 10px;
}
.index-list ul li {
  list-style: none;
  position: relative;
  padding-left: 18px;
  margin: 8px 0;
  padding-bottom: 6px;
  border-bottom: 1px dashed rgba(201, 146, 42, .2);
  font-size: 15.5px;
  color: #4f5062;
}
.index-list ul li::before {
  content: '✦';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--gold);
  font-size: 11px;
}
.index-list ul li:last-child {
  border-bottom: none;
}
.index-list ul li a {
  color: #4b4c5d;
}
.index-list ul li a:hover {
  color: var(--gold);
  text-decoration: underline;
}

/* Lightbox Modal */
#lightbox{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.92);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:99999;
  cursor:zoom-out;
  padding:20px;
  backdrop-filter: blur(8px);
}
#lightbox img{
  max-width:94%;
  max-height:92vh;
  border-radius:12px;
  box-shadow:0 10px 40px rgba(0,0,0,.8);
  object-fit:contain;
  border:2px solid rgba(255,255,255,.35);
  transition: transform .2s ease;
}
#lightbox.active{ display:flex; }

/* Interactive zoom on article images */
.leadership-card img,
.ri-card img,
.leader-card img,
.article-image img,
.content-image img,
.photo-item img,
.creative-item img,
.gallery-item img {
  cursor: zoom-in;
  transition: transform .35s ease, box-shadow .35s ease;
}
.leadership-card img:hover,
.ri-card img:hover,
.leader-card img:hover,
.gallery-item img:hover {
  transform: scale(1.02);
}


/* ═══════════════════════════════════════════════════
   PREMIUM ARTICLE & LEADERSHIP CARDS
═══════════════════════════════════════════════════ */
.leadership-card,
.ri-card,
.leader-card {
  display: flex;
  gap: 40px;
  background: #ffffff;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(201,146,42,0.25);
  border-top: 4px solid var(--gold);
  box-shadow: 0 14px 45px rgba(1,35,106,.09);
  position: relative;
  margin-bottom: 40px;
  transition: transform .25s ease, box-shadow .25s ease;
}

.leadership-card:hover,
.ri-card:hover,
.leader-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 55px rgba(1,35,106,.13);
}

.leadership-card::before,
.ri-card::before,
.leader-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold-lt) 50%, var(--cobalt) 100%);
}

.leadership-content,
.ri-content,
.leader-content {
  flex: 1;
  padding: 42px 40px;
  background: #ffffff;
}

.leadership-image,
.ri-image,
.leader-image {
  width: 36%;
  min-width: 280px;
  padding: 26px 20px;
  background: linear-gradient(135deg, rgba(1,35,106,.04), rgba(201,146,42,.07));
  display: flex;
  align-items: flex-start;
  /*justify-content: center;*/
  gap:15px;
}

.leadership-image img,
.ri-image img,
.leader-image img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  border-radius: 18px;
  border: 3px solid rgba(255,255,255,.95);
  box-shadow: 0 14px 34px rgba(1,35,106,.14);
  position: sticky;
  top: 100px;
  transition: transform .35s ease;
}

.leadership-image img:hover,
.ri-image img:hover,
.leader-image img:hover {
  transform: scale(1.02);
}

.badge-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--ff-mono);
  font-size: 11.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #fff !important;
  background: linear-gradient(135deg, var(--gold) 0%, #b38420 100%);
  padding: 6px 18px;
  border-radius: 30px;
  margin-bottom: 16px;
  border: none;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(201,146,42,.35);
}

.leadership-content h2,
.ri-content h2,
.leader-content h2 {
  font-family: var(--ff-body);
  font-size: clamp(28px, 3.4vw, 38px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 15px;
  line-height: 1.25;
  letter-spacing: .01em;
}

.leadership-content p,
.ri-content p,
.leader-content p {
  color: #484e5d;
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 16px;
  text-align: justify;
}

/* ═══════════════════════════════════════════════════
   QUOTES & EDITORIAL HIGHLIGHTS
═══════════════════════════════════════════════════ */
blockquote {
  margin: 32px 0;
  padding: 24px 32px;
  background: linear-gradient(135deg, rgba(1,35,106,.97), rgba(12,61,145,.97));
  border-left: 5px solid var(--gold);
  border-radius: 18px;
  color: #fff;
  font-size: 18px;
  line-height: 1.8;
  box-shadow: 0 14px 30px rgba(1,35,106,.14);
}

.highlight-box {
  margin-top: 30px;
  background: linear-gradient(135deg, var(--navy-deep), var(--navy-mid));
  color: #fff;
  padding: 28px 32px;
  border-radius: 18px;
  border: 1px solid rgba(201,146,42,.3);
  box-shadow: 0 16px 35px rgba(1,35,106,.14);
}

.highlight-box strong {
  color: var(--gold-lt);
  display: block;
  font-size: 22px;
  margin-bottom: 10px;
  font-family: var(--ff-body);
}

.highlight-box p {
  color: rgba(255,255,255,.95);
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
}

.quote-box {
  margin: 30px 0;
  background: linear-gradient(135deg, #fffdfa 0%, #fdf8ee 100%);
  border: 1px solid rgba(201,146,42,.25);
  border-left: 5px solid var(--gold);
  border-radius: 18px;
  padding: 26px 30px;
  box-shadow: 0 8px 24px rgba(201,146,42,.06);
}

.quote-box h3,
.quote-box h4 {
  color: var(--navy);
  margin-bottom: 12px;
  font-size: 22px;
  font-weight: 700;
  font-family: var(--ff-body);
}

.quote-box p {
  margin: 0;
  color: #494e5b;
  font-size: 16px;
  line-height: 1.85;
}

/* ═══════════════════════════════════════════════════
   DATA TABLES
═══════════════════════════════════════════════════ */
.data-table-container {
  overflow-x: auto;
  margin: 28px 0;
  border-radius: 16px;
  border: 1px solid rgba(201,146,42,0.25);
  box-shadow: 0 10px 30px rgba(1,35,106,.06);
  background: #fff;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  background: #fff;
  font-family: var(--ff-body);
}

.data-table th {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  color: #fff;
  padding: 14px 20px;
  text-align: left;
  font-family: var(--ff-mono);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.data-table td {
  padding: 14px 20px;
  border-bottom: 1px solid rgba(1,35,106,.07);
  color: #4b5161;
}

.data-table tr:hover {
  background: rgba(201,146,42,.03);
}

.data-table tr.highlight-row {
  background: #fdf6e7;
  font-weight: 600;
}

.data-table tr.highlight-row td {
  color: var(--navy);
}

/* ═══════════════════════════════════════════════════
   STAT METRICS GRID
═══════════════════════════════════════════════════ */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin: 30px 0;
}

.stat-card {
  background: linear-gradient(145deg, #ffffff 0%, #faf8f4 100%);
  border: 1.5px solid rgba(201,146,42,0.3);
  border-radius: 20px;
  padding: 26px 20px;
  text-align: center;
  box-shadow: 0 8px 24px rgba(1,35,106,.05);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  position: relative;
  overflow: hidden;
}

.stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--cobalt));
}

.stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(1,35,106,.12);
}

.stat-number {
  font-family: var(--ff-body);
  font-size: 42px;
  font-weight: 700;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 10px;
}

.stat-label {
  font-size: 13px;
  font-family: var(--ff-mono);
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--navy);
  font-weight: 600;
}

/* ═══════════════════════════════════════════════════
   INFO BULLET LISTS
═══════════════════════════════════════════════════ */
.info-list {
  list-style: none;
  margin: 20px 0;
  padding: 0;
}

.info-list li {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(1,35,106,.06);
  display: flex;
  gap: 14px;
  font-size: 16px;
  color: #4b5161;
  line-height: 1.8;
  background: rgba(255,255,255,.5);
  border-radius: 8px;
  margin-bottom: 6px;
}

.info-list li:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.info-list li::before {
  content: "✦";
  color: var(--gold);
  flex-shrink: 0;
  font-size: 14px;
  margin-top: 2px;
}

/* ═══════════════════════════════════════════════════
   PHOTO GALLERIES & RI PHOTO CARDS
═══════════════════════════════════════════════════ */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 20px;
}

.gallery-grid .gallery-item {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  display: block;
  box-shadow: 0 8px 24px rgba(1,35,106,.08);
  border: 2px solid rgba(255,255,255,.95);
  transition: transform .3s ease, box-shadow .3s ease;
}

.gallery-grid .gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(1,35,106,.16);
}

.gallery-grid .gallery-item img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}

.gallery-grid .gallery-item:hover img {
  transform: scale(1.05);
}

.gallery-grid .gallery-item::after {
  content: '🔍 Zoom';
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(1,35,106,.82);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
  backdrop-filter: blur(4px);
}

.gallery-grid .gallery-item:hover::after {
  opacity: 1;
}

.ri-photo-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  margin-top: 25px;
}

.ri-photo-card {
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
  background: #ffffff;
  border: 1.5px solid rgba(201,146,42,.25);
  box-shadow: 0 8px 24px rgba(1,35,106,.08);
  transition: transform .3s ease, box-shadow .3s ease;
}

.ri-photo-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(1,35,106,.14);
}

.ri-photo-card img {
  width: 100%;
  height: 450px;
  display: block;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.ri-photo-card:hover img {
  transform: scale(1.03);
}

@media (max-width: 992px) {
    .leadership-card,
    .ri-card,
    .leader-card {
        flex-direction: column;
    }
    .leadership-image,
    .ri-image,
    .leader-image {
        width: 100%;
        min-width: auto;
    }
    .index-section {
        padding: 20px 15px;
    }
    .page-title h1 {
        font-size: 34px;
    }
    .index-list {
        font-size: 17px;
        line-height: 1.8;
    }
}
    .district-news-item {
        margin-top: 35px;
        padding: 30px;
        border: 1px solid rgba(201,146,42,.25);
        background: linear-gradient(145deg, #ffffff 0%, #faf8f5 100%);
        border-radius: 20px;
        box-shadow: 0 10px 30px rgba(1,35,106,.05);
        position: relative;
        overflow: hidden;
    }

    .district-news-item::before {
        content: '';
        position: absolute;
        top: 0; left: 0; bottom: 0; width: 5px;
        background: linear-gradient(180deg, var(--gold), var(--cobalt));
    }

    .district-news-item:last-child {
        margin-bottom: 0;
    }

    .district-news-item h2 {
        color: var(--navy);
        margin-bottom: 16px;
        font-size: clamp(22px, 2.8vw, 28px);
        line-height: 1.3;
        font-weight: 700;
        font-family: var(--ff-body);
    }

    .district-news-item h3 {
        color: var(--navy-mid);
        margin-top: 20px;
        margin-bottom: 12px;
        font-size: 21px;
        font-weight: 700;
        font-family: var(--ff-body);
    }

    .district-news-item h4 {
        color: var(--navy);
        margin-top: 18px;
        font-size: 19px;
        font-weight: 700;
    }

    .district-news-item p {
        line-height: 1.85;
        margin-bottom: 15px;
        color: #484e5d;
    }


    /* SINGLE IMAGE */

    .district-single-image {
        width: 100%;
        margin: 25px auto;
        text-align: center;
    }

    .district-single-image img {
        width: 100%;
        object-fit: cover;
        border-radius: 18px;
        display: block;
        margin: auto;
        box-shadow: 0 12px 35px rgba(1,35,106,0.12);
        max-width: 580px;
        border: 3px solid rgba(255,255,255,.95);
        transition: transform 0.35s ease;
    }

    .district-single-image img:hover {
        transform: scale(1.02);
    }

    .district-single-image.small-image img {
        max-width: 500px;
    }


    /* IMAGE GRID */

    .district-image-grid {
        display: grid;
        gap: 20px;
        margin: 25px 0;
    }

    .district-image-grid.two-images {
        grid-template-columns: repeat(2, 1fr);
    }

    .district-image-grid.five-images {
        grid-template-columns: repeat(3, 1fr);
    }

    .district-image-card {
        overflow: hidden;
        border-radius: 16px;
        background: #ffffff;
        border: 1.5px solid rgba(201,146,42,.22);
        box-shadow: 0 8px 24px rgba(1,35,106,.06);
        transition: transform .3s ease, box-shadow .3s ease;
    }

    .district-image-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 16px 36px rgba(1,35,106,.12);
    }

    .district-image-card img {
        width: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.35s ease;
    }

    .district-image-card:hover img {
        transform: scale(1.03);
    }


    /* HIGHLIGHT BOX */

    .district-highlight-box {
        background: linear-gradient(135deg, #f4f8fe 0%, #eaf1fb 100%);
        border-left: 5px solid var(--navy);
        border-radius: 14px;
        padding: 18px 24px;
        margin: 22px 0;
        color: var(--navy);
        line-height: 1.7;
        box-shadow: 0 6px 20px rgba(1,35,106,.05);
    }

    .water-highlight {
        text-align: center;
        font-size: 18px;
    }

    .sur-maitri-box {
        text-align: center;
        font-size: 20px;
        background: #eef7ff;
    }


    /* REGISTRATION */

    .district-registration-box {
        background: linear-gradient(135deg, #fffbf0 0%, #fef5dc 100%);
        border: 1.5px solid rgba(201,146,42,.45);
        border-radius: 16px;
        padding: 22px 26px;
        margin: 22px 0;
        box-shadow: 0 8px 24px rgba(201,146,42,.08);
    }

    .district-registration-box h3 {
        margin-top: 0;
        color: #8a5a00;
        font-family: var(--ff-body);
        font-size: 22px;
    }


    /* LIST */

    .district-info-list {
        padding-left: 25px;
        margin: 15px 0 20px;
    }

    .district-info-list li {
        margin-bottom: 10px;
        line-height: 1.7;
    }

    .interact-list {
        padding-left: 30px;
        margin: 15px 0 20px;
    }

    .interact-list li {
        margin-bottom: 10px;
    }


    /* LINK BOX */

    .district-link-box {
        background: linear-gradient(135deg, #f8faff 0%, #eff4fc 100%);
        border: 1.5px solid #d5e3f5;
        border-radius: 14px;
        padding: 18px 22px;
        margin: 18px 0;
        line-height: 1.8;
        box-shadow: 0 6px 18px rgba(1,35,106,.04);
        overflow-wrap: anywhere;
    }

    .district-link-box a {
        color: var(--navy-mid);
        text-decoration: none;
        font-weight: 600;
        margin-left: 6px;
        transition: color .2s ease;
    }

    .district-link-box a:hover {
        color: var(--gold);
        text-decoration: underline;
    }


    /* OTHER ANNOUNCEMENTS */

    .other-announcement {
        margin-top: 30px;
        padding: 26px 30px;
        background: linear-gradient(145deg, #ffffff 0%, #faf8f5 100%);
        border: 1.5px solid rgba(201,146,42,.25);
        border-radius: 18px;
        box-shadow: 0 8px 24px rgba(1,35,106,.05);
    }

    .other-announcement:first-child {
        margin-top: 10px;
    }


    /* SANJIVANI */

    .sanjivani-content {
        margin-top: 10px;
    }

    .district-closing-message {
        font-size: 18px;
        color: #0c3d91;
        margin-top: 20px;
    }


    .small-note {
        font-size: 14px;
        color: #777;
        font-style: italic;
    }


    /* RESPONSIVE */

    @media (max-width: 992px) {

        .district-image-grid.five-images {
            grid-template-columns: repeat(2, 1fr);
        }

    }


    @media (max-width: 768px) {

        .district-news-item h2 {
            font-size: 21px;
        }

        .district-image-grid.two-images,
        .district-image-grid.five-images {
            grid-template-columns: 1fr;
        }

        .district-image-card img {
            height: 250px;
        }

        .district-single-image img {
            max-height: 450px;
        }

    }
    .leadership-card {
    align-items: flex-start !important;
}

.leadership-image {
    align-self: flex-start !important;
    margin-top: 0 !important;
}


/* --- Next Style Block --- */


/* ═══════════════════════════════════════════════════
   GLOBAL OVERFLOW FIX
═══════════════════════════════════════════════════ */
html, body {
    overflow-x: clip;
    max-width: 100%;
}

*, *::before, *::after {
    box-sizing: border-box;
}

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


/* ═══════════════════════════════════════════════════
   TABLET (max-width: 1024px)
═══════════════════════════════════════════════════ */
@media (max-width: 1024px) {

    .leadership-card,
    .ri-card,
    .leader-card {
        flex-direction: column;
    }

    .leadership-image,
    .ri-image,
    .leader-image {
        width: 100%;
        min-width: auto;
    }

    .leadership-image img,
    .ri-image img,
    .leader-image img {
        position: static;
        max-height: 400px;
        width: 100%;
        object-fit: cover;
    }

    .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
    }

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

    .ri-photo-grid {
        grid-template-columns: 1fr;
    }

    .leader-info {
        grid-template-columns: 1fr 1fr;
    }

    .featured-poem,
    .rangoli-layout {
        grid-template-columns: 1fr;
    }

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

    .photo-contest-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ═══════════════════════════════════════════════════
   SMALL MOBILE (max-width: 480px)
═══════════════════════════════════════════════════ */
@media (max-width: 480px) {
    .shell {
        padding: 0 10px 50px;
    }

    .logo img {
        height: 32px;
    }

    .stat-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

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

    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .leadership-content h2,
    .ri-content h2,
    .leader-content h2 {
        font-size: 19px;
    }

    .page-title h1 {
        font-size: 20px;
    }

    .index-list {
        font-size: 14px;
        padding-left: 10px;
    }

    .section-head-label {
        font-size: 9px;
        white-space: normal;
        text-align: center;
    }

    blockquote {
        font-size: 14px;
        padding: 14px 14px;
    }

    .club-header h2,
    .club-header h3 {
        font-size: 19px;
    }

    .ri-photo-card img {
        height: 220px;
    }

    .contest-image {
        height: 180px;
    }

    .data-table th,
    .data-table td {
        padding: 8px 10px;
        font-size: 12px;
    }
}


/* --- Next Style Block --- */


/* ═══════════════════════════════════════════════════
   PATCH: Fix card content clipping & container overflow
═══════════════════════════════════════════════════ */

/* Ensure all wrapping sections never overflow horizontally */
.shell,
.container,
section,
article,
.creative-section,
.conference-section,
.district-news-item,
.other-announcement,
.index-section {
    overflow-x: clip;
    box-sizing: border-box;
}

/* Fix the left-bar accent cards:
   Remove overflow:hidden on mobile so the ::before bar doesn't clip content.
   Instead, clip only on desktop where there's enough room. */
@media (max-width: 768px) {
    .leadership-card,
    .ri-card,
    .leader-card {
        overflow: visible;
        border-radius: 16px;
        flex-direction: column;
        gap: 0;
        margin: 0 0 20px 0;
        width: 100%;
    }

    /* Rebuild the left bar as a top bar on mobile */
    .leadership-card::before,
    .ri-card::before,
    .leader-card::before {
        inset: 0 0 auto 0;   /* top full-width bar instead of left bar */
        width: auto;
        height: 5px;
    }

    .leadership-content,
    .ri-content,
    .leader-content {
        padding: 20px 16px 20px 16px;
        width: 100%;
        box-sizing: border-box;
        overflow: hidden;
    }

    .leadership-content h2,
    .ri-content h2,
    .leader-content h2 {
        font-size: 20px;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .leadership-content p,
    .ri-content p,
    .leader-content p {
        font-size: 14px;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .leadership-image,
    .ri-image,
    .leader-image {
        width: 100%;
        min-width: auto;
        padding: 14px;
        box-sizing: border-box;
    }

    .leadership-image img,
    .ri-image img,
    .leader-image img {
        position: static !important;
        max-height: 260px;
        width: 100%;
        object-fit: cover;
        border-radius: 12px;
    }

    /* Fix blockquote overflow */
    blockquote {
        margin: 16px 0;
        padding: 14px 14px;
        border-radius: 10px;
        font-size: 14px;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Fix highlight box */
    .highlight-box {
        padding: 14px 14px;
        border-radius: 10px;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Fix district news text overflow */
    .district-news-item h2,
    .district-news-item h3,
    .district-news-item h4,
    .district-news-item p {
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Fix info-list on mobile */
    .info-list li {
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Fix badge-title */
    .badge-title {
        white-space: normal;
        word-break: break-word;
    }

    /* Fix quote box */
    .quote-box {
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Fix photo gallery images */
    .photo-gallery .gallery-grid {
        grid-template-columns: 1fr;
    }

    .photo-gallery .gallery-grid img {
        height: auto;
        max-height: 320px;
        width: 100%;
        border-radius: 10px;
    }

    /* Fix ri-photo-card images */
    .ri-photo-card img {
        height: auto;
        max-height: 280px;
        object-fit: cover;
    }

    /* Fix data table to scroll instead of overflow */
    .data-table-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
        display: block;
    }

    /* Fix stat cards on mobile */
    .stat-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        margin: 16px 0;
    }

    .stat-card {
        padding: 14px 10px;
        border-radius: 12px;
    }

    .stat-number {
        font-size: 26px;
    }

    /* Ensure all text in all headings wraps properly */
    h1, h2, h3, h4, h5, h6 {
        word-break: break-word;
        overflow-wrap: break-word;
    }

    p, li, td, th, span, a {
        overflow-wrap: break-word;
        word-break: break-word;
    }

    /* Shell padding fix */
    .shell {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

}

@media (max-width: 480px) {
    .shell {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .leadership-card,
    .ri-card,
    .leader-card {
        margin: 0 0 14px 0;
        border-radius: 12px;
    }

    .leadership-content,
    .ri-content,
    .leader-content {
        padding: 14px 12px;
    }

    .leadership-content h2,
    .ri-content h2,
    .leader-content h2 {
        font-size: 17px;
    }

    .stat-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .stat-number {
        font-size: 22px;
    }

    .stat-label {
        font-size: 10px;
    }

    .index-section {
        padding: 12px;
        border-radius: 12px;
    }

    blockquote {
        font-size: 13px;
        padding: 12px 12px;
    }
}


/* --- Next Style Block --- */


/* ═══════════════════════════════════════════════════
   PATCH: Single images — full-width on mobile
═══════════════════════════════════════════════════ */

/* On mobile, make single images full-width instead of small centered */
@media (max-width: 768px) {

    .district-single-image {
        width: 100%;
        margin: 18px 0;
        text-align: left;
    }

    .district-single-image img {
        max-width: 100% !important;
        width: 100% !important;
        border-radius: 10px;
        margin: 0;
        display: block;
    }

    .district-single-image.small-image img {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Food art image — full width on mobile */
    .food-art-card {
        max-width: 100%;
    }

    .food-art-image img {
        max-height: none;
        width: 100%;
    }

    /* Trivia image — full width on mobile */
    .trivia-image {
        max-width: 100%;
    }

    .trivia-image img {
        width: 100%;
    }

    /* Rangoli image — full width */
    .rangoli-image img {
        width: 100%;
    }

    /* Featured poem image — full width */
    .featured-poem-image img {
        width: 100%;
    }
}


/* --- Next Style Block --- */



/* ================= CAROUSEL ================= */

.district-carousel-section {
    margin-top: 30px;
}

.district-carousel-title {
    font-family: var(--ff-body);
    font-size: 20px;
    color: #0c3d91;
    margin-bottom: 14px;
}

.district-carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 0 45px;
}

.carousel-track {
    display: flex;
    gap: 15px;
    transition: transform 0.5s ease;
}

.carousel-item {
    flex: 0 0 calc(25% - 12px);
    height: 250px;
    overflow: hidden;
    border-radius: 14px;
    display: block;
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 14px;
    transition: transform 0.3s ease;
}

.carousel-item:hover img {
    transform: scale(1.05);
}


/* ================= ARROWS ================= */

.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;

    width: 40px;
    height: 40px;

    border: none;
    border-radius: 50%;

    background: rgba(12, 61, 145, 0.9);
    color: #fff;

    font-size: 20px;
    cursor: pointer;

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

    transition: 0.3s ease;
}

.carousel-btn:hover {
    background: #082c6b;
    transform: translateY(-50%) scale(1.08);
}

.carousel-prev {
    left: 5px;
}

.carousel-next {
    right: 5px;
}


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

@media (max-width: 992px) {

    .carousel-item {
        flex: 0 0 calc(50% - 8px);
    }

}


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

@media (max-width: 576px) {

    .district-carousel {
        padding: 0 40px;
    }

    .carousel-track {
        gap: 10px;
    }

    .carousel-item {
        flex: 0 0 100%;
        height: 260px;
    }

    .carousel-btn {
        width: 34px;
        height: 34px;
        font-size: 17px;
    }

}


/* --- Next Style Block --- */



/* =========================================
   DG SONG - TWO COLUMN ROW
   ========================================= */

.dg-song-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    align-items: center;
    margin-top: 25px;
}


/* LEFT SONG CONTENT */

.dg-song-content {
    width: 100%;
}

.song-text {
    background: var(--gold-pale);
    padding: 24px;
    border-radius: 16px;
    border: 1px solid rgba(201,146,42,0.3);

    font-family: var(--ff-body);
    line-height: 1.9;
    color: #0c3d91;
    font-size: 16px;
}


/* RIGHT VIDEO */

.dg-song-video {
    width: 100%;
}

.youtube-video-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;

    overflow: hidden;
    border-radius: 16px;
    background: #000;

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

.youtube-video-wrapper iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}


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

@media (max-width: 900px) {

    .dg-song-row {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .dg-song-video {
        max-width: 800px;
        margin: auto;
    }

}


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

@media (max-width: 576px) {

    .song-text {
        padding: 18px;
        font-size: 14px;
        line-height: 1.8;
    }

    .youtube-video-wrapper {
        border-radius: 10px;
    }

}



/* --- Next Style Block --- */



    /* MAIN LESSON CARD */

    .ai-lesson-card {
        margin-top: 35px;
        padding: 28px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 18px;
        box-shadow: 0 5px 18px rgba(0,0,0,0.06);
    }

    .ai-lesson-card h3 {
        color: #0c3d91;
        font-size: 25px;
        line-height: 1.4;
        margin-bottom: 18px;
    }

    .ai-lesson-title {
        color: #c89b2b;
        font-size: 21px;
        margin: 15px 0 20px;
    }


    /* IMAGE */

    .ai-image-box {
        width: 100%;
        margin: 25px auto;
        text-align: center;
    }

    .ai-image-box img {
        width: 100%;
        max-width: 500px;
        /*max-height: 500px;*/
        object-fit: cover;
        display: block;
        margin: auto;
        border-radius: 14px;
        box-shadow: 0 7px 22px rgba(0,0,0,0.12);
    }


    /* SECTION BOX */

    .ai-section-box {
        background: #f7faff;
        border: 1px solid #dfe8f5;
        border-radius: 12px;
        padding: 20px 22px;
        margin: 20px 0;
    }

    .ai-section-box h4 {
        color: #0c3d91;
        font-size: 19px;
        margin-top: 0;
        margin-bottom: 12px;
        font-weight: 700;
    }


    /* CHECK LIST */

    .ai-check-list {
        padding-left: 8px;
        list-style: none;
        margin: 15px 0;
    }

    .ai-check-list li {
        margin-bottom: 10px;
        line-height: 1.6;
    }


    /* EXAMPLES */

    .ai-example-list {
        padding-left: 25px;
    }

    .ai-example-list li {
        margin-bottom: 12px;
        line-height: 1.6;
        font-style: italic;
    }


    /* NUMBER LIST */

    .ai-number-list {
        padding-left: 28px;
        margin: 15px 0;
    }

    .ai-number-list li {
        margin-bottom: 12px;
        line-height: 1.6;
    }


    /* GOLDEN RULE */

    .ai-golden-box {
        background: var(--gold-pale);
        border: 1px solid rgba(201,146,42,0.35);
        border-left: 5px solid #c89b2b;
        border-radius: 10px;
        padding: 18px 20px;
        margin: 22px 0;
        color: #0c3d91;
        font-size: 17px;
        line-height: 1.6;
    }


    /* RESPONSIBLE AI PILLS */

    .ai-pill-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-top: 18px;
    }

    .ai-pill {
        background: #ffffff;
        border: 1px solid #dfe6ef;
        border-radius: 12px;
        padding: 17px;
        color: #0c3d91;
        line-height: 1.5;
    }

    .ai-pill strong {
        display: inline-block;
        margin-left: 4px;
    }

    .ai-pill span {
        display: block;
        color: #555;
        margin-top: 7px;
        font-size: 14px;
    }


    /* HANDS ON */

    .ai-hands-on-box {
        margin-top: 25px;
        padding: 25px;
        border-radius: 15px;
        background: #eef6ff;
        border: 1px solid #cbdff7;
        color: #183b6b;
    }

    .ai-hands-on-box h4 {
        color: #0c3d91;
        font-size: 21px;
        margin-top: 0;
    }

    .ai-no-pressure {
        margin-top: 18px;
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: center;
    }

    .ai-no-pressure strong {
        background: #ffffff;
        border: 1px solid #d5e2f1;
        border-radius: 30px;
        padding: 9px 15px;
        color: #0c3d91;
    }

    .ai-no-pressure p {
        width: 100%;
        margin-bottom: 0;
        font-size: 17px;
    }


    /* FINAL MESSAGE */

    .ai-final-message {
        text-align: center;
        margin-top: 30px;
        padding: 22px;
        background: var(--gold-pale);
        border-radius: 14px;
        color: #0c3d91;
        line-height: 1.7;
    }

    .ai-final-message strong {
        font-size: 18px;
    }


    /* MOBILE */

    @media (max-width: 768px) {

        .ai-lesson-card {
            padding: 20px 16px;
        }

        .ai-lesson-card h3 {
            font-size: 21px;
        }

        .ai-lesson-title {
            font-size: 18px;
        }

        .ai-pill-grid {
            grid-template-columns: 1fr;
        }

        .ai-image-box img {
            max-height: 400px;
        }

        .ai-no-pressure {
            flex-direction: column;
            align-items: stretch;
        }

        .ai-no-pressure strong {
            text-align: center;
        }

    }



/* --- Next Style Block --- */



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

    .creative-intro {
        color: #555;
        font-size: 16px;
        margin-bottom: 30px;
    }


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

    .creative-section {
        margin-top: 38px;
        padding: 28px;
        background: #fff;
        border: 1px solid #e5e9ef;
        border-radius: 18px;
        box-shadow: 0 5px 18px rgba(0,0,0,0.05);
    }


    .creative-section-title {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 25px;
    }

    .creative-section-title span {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 42px;
        height: 42px;

        border-radius: 50%;

        background: #0c3d91;
        color: #fff;

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

    .creative-section-title h3 {
        margin: 0;
        color: #0c3d91;
        font-size: 24px;
    }


    /* ===================================================== */
    /* PAINTINGS */
    /* ===================================================== */

    .painting-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .art-card {
        overflow: hidden;
        border-radius: 15px;
        background: #fafbfc;
        border: 1px solid #e2e7ed;
        transition: transform .25s ease, box-shadow .25s ease;
    }

    .art-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,.10);
    }

    .art-image {
        width: 100%;
        height: 280px;
        background: #f1f1f1;
        overflow: hidden;
    }

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

    .art-details {
        padding: 15px;
    }

    .art-details h4 {
        margin: 0 0 6px;
        color: #0c3d91;
        font-size: 18px;
    }

    .art-details p {
        margin: 0;
        color: #666;
        font-size: 14px;
    }


    /* ===================================================== */
    /* ARTIST INFO */
    /* ===================================================== */

    .artist-info {
        display: flex;
        gap: 15px;
        align-items: center;

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

        background: var(--gold-pale);
        border-radius: 12px;

        color: #0c3d91;
        line-height: 1.7;
    }

    .artist-icon {
        font-size: 30px;
    }


    /* ===================================================== */
    /* POEM LAYOUT */
    /* ===================================================== */

    .poem-layout {
        display: grid;
        grid-template-columns: 40% 60%;
        gap: 25px;
        align-items: start;
    }

    .poem-image {
        width: 100%;
        overflow: hidden;
        border-radius: 15px;
        background: #f3f3f3;
    }

    .poem-image img {
        width: 100%;
        display: block;
        max-height: 650px;
        object-fit: cover;
    }

    .poem-content {
        padding: 5px 10px;
    }

    .poem-content h4 {
        color: #0c3d91;
        font-size: 27px;
        margin-top: 0;
    }

    .gujarati-poem {
        color: #333;
        font-size: 17px;
        line-height: 2;
    }

    .poem-author {
        margin-top: 25px;
        padding: 16px;

        border-left: 4px solid #c89b2b;
        background: var(--gold-pale);

        color: #0c3d91;
        line-height: 1.6;
    }


    /* ===================================================== */
    /* SINGLE POEM */
    /* ===================================================== */

    .single-poem-card {
        max-width: 850px;
        margin: auto;
        text-align: center;
    }

    .single-poem-image {
        width: 100%;
        max-height: 650px;
        overflow: hidden;
        border-radius: 16px;
        background: #f3f3f3;
    }

    .single-poem-image img {
        width: 100%;
        display: block;
        max-height: 650px;
        object-fit: contain;
    }

    .center-author {
        text-align: center;
        border-left: 0;
        border-top: 3px solid #c89b2b;
        border-radius: 10px;
    }


    /* ===================================================== */
    /* FEATURED POEM */
    /* ===================================================== */

    .featured-poem {
        display: grid;
        grid-template-columns: 45% 55%;
        gap: 25px;
        /*align-items: center;*/
    }

    .featured-poem-content h3 {
        color: #0c3d91;
        font-size: 27px;
        margin-top: 0;
    }

    .achievement {
        color: #c89b2b;
        font-weight: 700;
    }

    .featured-poem-image {
        overflow: hidden;
        border-radius: 15px;
    }

    .featured-poem-image img {
        width: 100%;
        display: block;
    }


    /* ===================================================== */
    /* RANGOLI */
    /* ===================================================== */

    .rangoli-layout {
        display: grid;
        grid-template-columns: 50% 50%;
        gap: 30px;
        align-items: center;
    }

    .rangoli-image {
        overflow: hidden;
        border-radius: 16px;
    }

    .rangoli-image img {
        width: 100%;
        display: block;
    }

    .rangoli-content h3 {
        color: #0c3d91;
        font-size: 25px;
    }

    .rangoli-content p {
        line-height: 1.8;
        color: #555;
    }

    .creator-badge {
        margin-top: 20px;
        padding: 16px;

        background: var(--gold-pale);
        border-radius: 12px;

        color: #0c3d91;
        line-height: 1.7;
    }


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

    .food-art-card {
        max-width: 850px;
        margin: auto;
    }

    .food-art-image {
        overflow: hidden;
        border-radius: 16px;
    }

    .food-art-image img {
        width: 100%;
        display: block;
        max-height: 650px;
        object-fit: contain;
    }

    .food-art-author {
        margin-top: 18px;
        padding: 16px;

        text-align: center;

        background: var(--gold-pale);
        border-radius: 12px;

        color: #0c3d91;
        line-height: 1.7;
    }

    .food-art-author span {
        font-size: 24px;
        margin-right: 8px;
    }


    /* ===================================================== */
    /* PHOTO CONTEST */
    /* ===================================================== */

    .photo-contest-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }

    .contest-photo-card {
        overflow: hidden;
        border-radius: 16px;
        background: #fff;
        border: 1px solid #e1e6ec;

        box-shadow: 0 5px 15px rgba(0,0,0,.06);
    }

    .contest-photo-card.winner-card {
        border: 2px solid #FFB800;
        box-shadow: 0 10px 30px rgba(255, 184, 0, 0.28), 0 4px 14px rgba(1, 35, 106, 0.08);
        position: relative;
    }

    .contest-image.winner-image {
        border: 8px solid #FFB800;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 20px rgba(255, 184, 0, 0.45);
        position: relative;
    }

    .winner-card .photography-tag {
        background: linear-gradient(135deg, #01236a 0%, #0c3d91 100%);
        border: 1.5px solid #FFD700;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25), 0 0 10px rgba(255, 215, 0, 0.45);
    }

    .contest-image {
        height: 300px;
        overflow: hidden;
        background: #f2f2f2;
    }

    .contest-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;

        transition: transform .3s ease;
    }

    .contest-photo-card:hover .contest-image img {
        transform: scale(1.04);
    }

    .contest-caption {
        padding: 18px;
    }

    .contest-caption h4 {
        color: #0c3d91;
        font-size: 19px;
        margin: 0 0 8px;
    }

    .contest-caption p {
        color: #666;
        line-height: 1.6;
        margin: 0 0 8px;
    }

    .contest-caption strong {
        color: #0c3d91;
    }

    .contest-caption small {
        display: block;
        color: #777;
        margin-top: 5px;
    }


    /* ===================================================== */
    /* ROTARY TRIVIA */
    /* ===================================================== */

    .trivia-image {
        max-width: 500px;
        margin: 25px auto 0;
        overflow: hidden;
        border-radius: 16px;
    }

    .trivia-image img {
        width: 100%;
        display: block;
    }


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

    @media (max-width: 1000px) {

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

        .photo-contest-grid {
            grid-template-columns: repeat(2, 1fr);
        }

    }


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

    @media (max-width: 768px) {

        .creative-section {
            padding: 20px 16px;
        }

        .creative-section-title h3 {
            font-size: 20px;
        }

        .painting-grid {
            grid-template-columns: 1fr;
        }

        .poem-layout,
        .featured-poem,
        .rangoli-layout {
            grid-template-columns: 1fr;
        }

        .photo-contest-grid {
            grid-template-columns: 1fr;
        }

        .art-image {
            height: auto;
            max-height: 500px;
        }

        .art-image img {
            height: auto;
            object-fit: contain;
        }

        .gujarati-poem {
            font-size: 16px;
            line-height: 1.9;
        }

        .artist-info {
            align-items: flex-start;
        }

    }

    /* ===================================================== */
    /* CONFERENCE SNEH SINDHU 2.0 STYLES */
    /* ===================================================== */

    .club-header {
        text-align: center;
        margin-bottom: 34px;
        position: relative;
        border-radius: 28px;
    }
    
    .club-header {
    background: linear-gradient(135deg, var(--navy-deep), var(--navy-mid));
    padding: 22px 30px;
    color: #fff !important;
}

.club-header,
.club-header h1,
.club-header h2,
.club-header h3,
.club-header h4,
.club-header h5,
.club-header h6,
.club-header p,
.club-header span,
.club-header a {
    color: #fff !important;
}

    .club-name {
        display: inline-block;
        padding: 8px 20px;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--navy) 0%, var(--cobalt) 100%);
        color: #fff;
        font-size: 12px;
        letter-spacing: .16em;
        text-transform: uppercase;
        margin-bottom: 18px;
        box-shadow: 0 10px 24px rgba(26,94,184,.16);
    }

    .club-header h2,
    .club-header h3 {
        font-size: clamp(28px, 3.4vw, 36px);
        margin-bottom: 10px;
        color: var(--navy);
    }

    .club-header p {
        max-width: 720px;
        margin: 0 auto;
        font-size: 16px;
        color: var(--ink-mid);
    }

    .leader-info {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
        margin-top: 28px;
    }

    .info-box {
        background: linear-gradient(135deg, #f8fbff 0%, #fdf7ea 100%);
        border: 1px solid rgba(1,35,106,.08);
        border-radius: 16px;
        padding: 24px;
        box-shadow: 0 12px 24px rgba(1,35,106,.05);
        transition: transform .2s ease, box-shadow .2s ease;
    }

    .info-box:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 30px rgba(1,35,106,.08);
    }

    .info-box h5 {
        color: var(--navy);
        margin-bottom: 12px;
        font-size: 18px;
    }

    .info-box p,
    .info-box li {
        font-size: 14px;
        color: #4d5564;
        line-height: 1.75;
    }

    .info-box ul {
        padding-left: 20px;
        margin: 0;
    }

    .info-box li {
        margin-bottom: 8px;
        line-height: 1.6;
    }

    .resource-box {
        background: linear-gradient(135deg, #f8fbff 0%, #fdf7ea 100%);
        border: 1px solid rgba(1,35,106,.08);
        border-left: 5px solid #c89b2b;
        border-radius: 16px;
        padding: 25px;
        margin-top: 30px;
        box-shadow: 0 12px 24px rgba(1,35,106,.05);
    }

    .resource-box h4 {
        color: #0c3d91;
        margin-bottom: 15px;
        font-size: 20px;
    }

    .resource-box ul {
        padding-left: 18px;
    }

    .resource-box li {
        margin-bottom: 12px;
        color: #4d5564;
    }

    .resource-box a {
        color: #0c3d91;
        text-decoration: none;
        font-weight: 600;
    }

    .resource-box a:hover {
        color: #c89b2b;
    }

    .photo-gallery {
        margin-top: 40px;
    }

    .photo-gallery h4 {
        font-size: 24px;
        color: #16295C;
        margin-bottom: 20px;
        position: relative;
    }

    .photo-gallery h4::after {
        content: "";
        width: 70px;
        height: 3px;
        background: #c89b2b;
        display: block;
        margin-top: 8px;
    }

    .photo-gallery .gallery-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 18px;
    }

    .photo-gallery .gallery-grid img {
        width: 100%;
        height: 530px;
        object-fit: cover;
        object-position: center;
        border-radius: 12px;
        border: 4px solid #fff;
        box-shadow: 0 8px 25px rgba(0, 0, 0, .12);
        transition: .3s;
        display: block;
    }

    .photo-gallery .gallery-grid img:hover {
        transform: translateY(-6px) scale(1.02);
    }

    @media (max-width: 992px) {
        .leader-info {
            grid-template-columns: 1fr 1fr;
        }
    }

    @media (max-width: 768px) {
        .leader-info {
            grid-template-columns: 1fr;
        }
        .photo-gallery .gallery-grid {
            grid-template-columns: 1fr;
        }
        .photo-gallery .gallery-grid img {
            height: auto;
            max-height: 400px;
        }
    }
    
    .photography-tag {
        position: absolute;
        top: 12px;
        left: 12px;
        z-index: 2;
    
        background: #0c3d91;
        color: #fff;
    
        padding: 7px 13px;
        border-radius: 20px;
    
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    
        box-shadow: 0 3px 8px rgba(0,0,0,0.2);
    }
    
    .contest-image {
        position: relative;
    }



/* --- Next Style Block --- */


/* ===================================================== */
/* GUIDELINES, FEEDBACK, CONTACT & FOOTER STYLES */
/* ===================================================== */

.guidelines {
  background: var(--navy-deep);
  border-radius: var(--radius-lg);
  padding: 48px;
  position: relative;
  overflow: hidden;
}

.guidelines::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 10% 50%, rgba(26,94,184,.25) 0%, transparent 60%),
    radial-gradient(ellipse 50% 50% at 90% 20%, rgba(201,146,42,.1) 0%, transparent 55%);
  pointer-events: none;
}

.guidelines h2 {
  font-family: var(--ff-body);
  font-size: 36px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 6px;
  position: relative;
}

.guidelines .subtitle {
  font-size: 13px;
  color: rgba(255,255,255,.45);
  margin-bottom: 36px;
  position: relative;
}

.guide-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  position: relative;
}

.guide-item {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-md);
  padding: 24px;
  transition: background .2s;
}

.guide-item:hover {
  background: rgba(255,255,255,.08);
}

.guide-item-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: rgba(201,146,42,.15);
  border: 1px solid rgba(201,146,42,.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  margin-bottom: 14px;
}

.guide-item h5 {
  font-size: 13px;
  font-weight: 600;
  color: var(--gold-lt);
  letter-spacing: .04em;
  margin-bottom: 8px;
}

.guide-item p {
  font-size: 13px;
  color: rgba(255,255,255,.6);
  line-height: 1.65;
  text-align: justify;
}

.feedback {
  background: linear-gradient(135deg, var(--navy-deep) 0%, var(--navy-mid) 100%);
  border-radius: var(--radius-lg);
  padding: 72px 48px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.feedback::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(ellipse 80% 80% at 50% 50%, rgba(201,146,42,.08) 0%, transparent 60%);
  pointer-events: none;
}

.feedback-inner { position: relative; max-width: 560px; margin: 0 auto; }

.feedback h2 {
  font-family: var(--ff-body);
  font-size: 48px;
  font-weight: 700;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 12px;
}

.feedback .tagline {
  font-family: var(--ff-body);
  font-style: italic;
  font-size: 18px;
  color: var(--gold-lt);
  margin-bottom: 20px;
}

.feedback p {
  font-size: 15px;
  color: rgba(255,255,255,.7);
  line-height: 1.75;
  margin-bottom: 36px;
  text-align: justify;
}

.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--gold);
  color: var(--navy-deep);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .02em;
  text-decoration: none;
  padding: 18px 44px;
  border-radius: 100px;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 8px 32px rgba(201,146,42,.4);
}

.cta-btn:hover {
  background: var(--gold-lt);
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(201,146,42,.5);
}

.cta-link {
  display: block;
  margin-top: 18px;
  font-family: var(--ff-mono);
  font-size: 11px;
  color: rgba(255,255,255,.4);
  text-decoration: none;
  letter-spacing: .04em;
}

.cta-link a { color: var(--gold-lt); }

.contact {
  background: var(--ink);
  border-radius: var(--radius-lg);
  padding: 32px 40px;
  display: flex;
  align-items: center;
  gap: 24px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.contact-info h3 {
  font-family: var(--ff-body);
  font-size: 22px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 4px;
}

.contact-info p {
  font-size: 13px;
  color: rgba(255,255,255,.5);
  text-align: justify;
}

.contact-pills {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.contact-pill {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-md);
  padding: 12px 20px;
  text-align: center;
}

.contact-pill-label {
  font-family: var(--ff-mono);
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
  display: block;
  margin-bottom: 4px;
}

.contact-pill-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--gold-lt);
}

.contact-pill-value a {
  color: var(--gold-lt);
  text-decoration: none;
}

.footer {
  background: linear-gradient(135deg, var(--navy) 0%, var(--cobalt) 100%);
  text-align: center;
  padding: 32px 20px;
  font-size: 13.5px;
  color: #fff;
  margin-top: 80px;
  letter-spacing: .03em;
}

.footer strong { color: var(--gold-lt); }

.sp { height: 32px; }
.sp-sm { height: 16px; }

#lightbox{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.9);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:99999;
    padding:20px;
}

#lightbox img{
    max-width:95%;
    max-height:95%;
    border-radius:10px;
}

#lightbox.active{
    display:flex;
}

@media (max-width: 900px) {
  .guide-grid { grid-template-columns: 1fr; }
  .guidelines { padding: 32px 24px; }
  .feedback { padding: 48px 24px; }
  .contact { flex-direction: column; text-align: center; }
}


/* --- Next Style Block --- */


    /* ==========================================
   PODCAST TWO COLUMN LAYOUT
========================================== */

.podcast-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 45px;
    align-items: center;
}


/* LEFT CONTENT */

.podcast-content {
    width: 100%;
}

.podcast-content h2 {
    margin: 12px 0 15px;
}

.podcast-content h4 {
    margin-bottom: 20px;
    line-height: 1.5;
}

.podcast-content p {
    line-height: 1.8;
}


/* RIGHT VIDEO */

.podcast-video {
    width: 100%;
}

.youtube-video {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.youtube-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}


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

@media (max-width: 900px) {

    .podcast-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .podcast-video {
        order: 2;
    }

}


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

@media (max-width: 576px) {

    .podcast-layout {
        gap: 25px;
    }

    .youtube-video {
        border-radius: 10px;
    }

}


/* --- Next Style Block --- */


    /* ==========================================
   NEW FEATURES IN GML
========================================== */

.gml-features-section {
    /*padding: 70px 0;*/
    background: #f7f9fc;
}


/* HEADER */

.gml-features-section .club-header {
    text-align: center;
    margin-bottom: 45px;
}

.gml-features-section .club-header h2 {
    margin: 12px 0;
}

.gml-features-section .club-header p {
    max-width: 750px;
    margin: 0 auto;
    line-height: 1.7;
}


/* GRID */

.gml-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}


/* CARD */

.gml-feature-card {
    position: relative;
    background: #ffffff;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid #e5e9ef;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
    display: flex;
    gap: 20px;
    transition: all 0.3s ease;
    overflow: hidden;
}

.gml-feature-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.10);
}


/* ICON */

.gml-feature-icon {
    min-width: 60px;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
}


/* CONTENT */

.gml-feature-content {
    flex: 1;
}

.gml-feature-number {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 6px;
    opacity: 0.6;
}

.gml-feature-content h3 {
    margin: 0 0 12px;
    font-size: 20px;
    line-height: 1.35;
}

.gml-feature-content p {
    margin: 0;
    line-height: 1.7;
    font-size: 14px;
    color: #555;
}


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

@media (max-width: 992px) {

    .gml-features-grid {
        grid-template-columns: 1fr 1fr;
    }

}


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

@media (max-width: 600px) {

    .gml-features-section {
        padding: 50px 0;
    }

    .gml-features-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .gml-feature-card {
        padding: 22px;
    }

    .gml-feature-content h3 {
        font-size: 18px;
    }

}


/* --- Next Style Block --- */


        .feedback-ratings-card {
            max-width: 1020px;
            margin: 0 auto 38px auto;
            background: #ffffff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 16px 45px rgba(1, 35, 106, 0.12);
            border: 1px solid rgba(1, 35, 106, 0.08);
        }
        .ratings-card-header {
            position: relative;
            background: linear-gradient(135deg, #022b82 0%, #0947b5 50%, #022b82 100%);
            padding: 42px 24px;
            text-align: center;
            overflow: hidden;
        }
        .ratings-wave-svg {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            opacity: 0.55;
        }
        .ratings-card-header h3 {
            position: relative;
            z-index: 2;
            margin: 0;
            font-family: var(--ff-body);
            font-size: clamp(24px, 3.6vw, 40px);
            font-weight: 800;
            color: #ffd23f;
            letter-spacing: 0.02em;
            text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
        }
        .ratings-card-body {
            padding: 38px 50px 32px 50px;
            background: #ffffff;
        }
        .rating-metric-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 22px 0;
            border-bottom: 1.5px solid #edf0f5;
        }
        .rating-metric-row:last-child {
            border-bottom: none;
            padding-bottom: 8px;
        }
        .rating-metric-left {
            display: flex;
            align-items: center;
            gap: 18px;
        }
        .rating-metric-icon {
            width: 46px;
            height: 46px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
        }
        .rating-metric-icon.icon-content {
            background: #186ade;
        }
        .rating-metric-icon.icon-visual {
            background: #df2a6d;
        }
        .rating-metric-icon.icon-nav {
            background: #319a4a;
        }
        .rating-metric-icon svg {
            width: 24px;
            height: 24px;
            fill: #ffffff;
        }
        .rating-metric-title {
            font-family: var(--ff-body);
            font-size: 21px;
            font-weight: 700;
            color: #1e2433;
            letter-spacing: 0.06em;
            text-transform: uppercase;
        }
        .rating-stars-grid {
            display: grid;
            grid-template-columns: repeat(5, 52px);
            justify-items: center;
            align-items: center;
            gap: 16px;
        }
        .star-item {
            width: 38px;
            height: 38px;
            display: flex;
            align-items: center;
            justify-content: center;
            filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.05));
        }
        .star-item.active svg {
            fill: #ffd13b;
        }
        .star-item.inactive svg {
            fill: #d5d9e2;
        }
        .star-item svg {
            width: 100%;
            height: 100%;
        }
        @media (max-width: 820px) {
            .ratings-card-body {
                padding: 24px 20px;
            }
            .rating-metric-row {
                padding: 16px 0;
            }
            .rating-metric-title {
                font-size: 16px;
            }
            .rating-metric-icon {
                width: 38px;
                height: 38px;
            }
            .rating-metric-icon svg {
                width: 20px;
                height: 20px;
            }
            .rating-stars-grid {
                grid-template-columns: repeat(5, 34px);
                gap: 8px;
            }
            .star-item {
                width: 26px;
                height: 26px;
            }
        }
        @media (max-width: 540px) {
            .rating-metric-row {
                flex-direction: column;
                align-items: flex-start;
                gap: 14px;
            }
            .rating-stars-grid {
                align-self: flex-start;
                margin-left: 56px;
                grid-template-columns: repeat(5, 30px);
                gap: 8px;
            }
        }
        

/* --- Next Style Block --- */


    .thought-section{
    max-width:1100px;
    margin:60px auto;
    padding:0 15px;
}

.section-title{
    text-align:center;
    margin-bottom:50px;
}

.section-title h2{
    font-size:42px;
    color:#0c3d91;
    margin-bottom:15px;
}

.section-title p{
    max-width:700px;
    margin:auto;
    color:#666;
    line-height:1.8;
}

.thought-card{
    background:#fff;
    border-radius:15px;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
    margin-bottom:50px;
    padding:40px;
}

.author-box{
    display:flex;
    align-items:center;
    gap:20px;
    margin-bottom:30px;
}

.author-box img{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:cover;
    border:4px solid #c89b2b;
}

.author-box span{
    color:#c89b2b;
    font-weight:700;
    text-transform:uppercase;
    font-size:13px;
    letter-spacing:1px;
}

.author-box h3{
    margin:6px 0;
    color:#0c3d91;
}

.author-box p{
    margin:0;
    color:#777;
}

.thought-card h2{
    color:#0c3d91;
    margin-bottom:20px;
    font-size:32px;
}

.thought-card p{
    font-size:17px;
    line-height:1.9;
    color:#444;
    margin-bottom:18px;
}

blockquote {
    background: linear-gradient(135deg, rgba(1,35,106,.97), rgba(12,61,145,.97));
    border-left: 5px solid var(--gold);
    padding: 24px 32px;
    margin: 30px 0;
    border-radius: 16px;
    font-style: italic;
    color: #fff;
    font-size: 18px;
    line-height: 1.8;
    box-shadow: 0 12px 30px rgba(1,35,106,.12);
}

.quote-box {
    background: linear-gradient(135deg, #fffdfa 0%, #fdf8ee 100%);
    border: 1px solid rgba(201,146,42,.28);
    border-left: 5px solid var(--gold);
    padding: 26px 30px;
    border-radius: 16px;
    margin: 30px 0;
    box-shadow: 0 8px 24px rgba(201,146,42,.07);
}

.quote-box h4 {
    color: var(--navy);
    margin-bottom: 12px;
    font-family: var(--ff-body);
    font-size: 22px;
    font-weight: 700;
}

.quote-box ul {
    margin: 0;
    padding-left: 20px;
}

.quote-box li {
    margin-bottom: 10px;
    line-height: 1.8;
    color: #4b5161;
}

.signature {
    margin-top: 30px;
    font-size: 18px;
    color: var(--navy);
    font-family: var(--ff-body);
    font-weight: 700;
}

/* ═══════════════════════════════════════════════════
   FINAL SECTION DESIGN
═══════════════════════════════════════════════════ */
.action-section,
.gml-section,
.editorial-note,
.guest-byline,
.calendar-section,
.knowledge-hub,
.trivia-section,
.announcement-section {
    max-width: 1180px;
    margin: 70px auto 0;
    padding: 0 18px;
}

.action-section .container,
.gml-section .container,
.editorial-note .container,
.guest-byline .container,
.calendar-section .container,
.knowledge-hub .container,
.trivia-section .container,
.announcement-section .container {
    background: #ffffff;
    border: 1px solid rgba(201,146,42,.25);
    border-top: 4px solid var(--gold);
    border-radius: 24px;
    padding: 38px 36px;
    box-shadow: 0 14px 45px rgba(1,35,106,.09);
    position: relative;
    overflow: hidden;
}

.action-section .container::before,
.gml-section .container::before,
.editorial-note .container::before,
.guest-byline .container::before,
.calendar-section .container::before,
.knowledge-hub .container::before,
.trivia-section .container::before,
.announcement-section .container::before {
    content: '';
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--gold), var(--cobalt));
}

.section-header {
    margin-bottom: 26px;
}

.section-header span {
    display: inline-block;
    padding: 8px 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--navy) 0%, var(--cobalt) 100%);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin-bottom: 14px;
    box-shadow: 0 6px 18px rgba(1,35,106,.20);
    border: 1px solid rgba(201,146,42,.35);
}

.section-header h2 {
    font-family: var(--ff-body);
    font-size: clamp(28px, 3.2vw, 36px);
    color: var(--navy);
    margin-bottom: 8px;
}

.section-header p {
    color: var(--ink-mid);
    font-size: 15.5px;
    line-height: 1.8;
    max-width: 760px;
}

.club-layout {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    align-items: center;
    padding: 24px;
}

.club-layout.reverse {
    grid-template-columns: 1fr 320px;
}

.club-media img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 18px;
    box-shadow: 0 16px 34px rgba(1,35,106,.12);
}

.club-body-content {
    padding: 8px 6px;
}

.club-body-content h3 {
    color: var(--navy);
    font-size: 24px;
    margin: 14px 0 10px;
}

.club-body-content p,
.club-body-content li {
    color: var(--ink-mid);
    line-height: 1.85;
    font-size: 15px;
}

.club-body-content .impact-box,
.club-body-content .project-highlight,
.club-body-content .mini-card {
    margin-top: 18px;
    border-radius: 16px;
    background: linear-gradient(135deg, #f7fbff 0%, #fcf6e8 100%);
    padding: 20px 22px;
    border: 1px solid rgba(201,146,42,.22);
}

.club-body-content .club-name {
    background: linear-gradient(135deg, var(--navy) 0%, var(--cobalt) 100%);
    color: #fff;
    padding: 8px 16px;
    border-radius: 999px;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.news-grid,
.announcement-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.news-card,
.announcement-card,
.knowledge-card,
.trivia-box,
.empty-box,
.event {
    padding: 26px 26px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid rgba(201,146,42,.25);
    border-left: 5px solid var(--gold);
    box-shadow: 0 10px 28px rgba(1,35,106,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}

.news-card:hover,
.announcement-card:hover,
.knowledge-card:hover,
.event:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(1,35,106,.12);
}

.news-card h3,
.announcement-card h4,
.knowledge-card h3 {
    color: var(--navy);
    margin-bottom: 10px;
    font-size: 20px;
}

.news-card p,
.announcement-card p,
.knowledge-card p,
.trivia-box,
.event p,
.empty-box {
    color: var(--ink-mid);
    line-height: 1.8;
    font-size: 15px;
}

.news-number {
    display: inline-block;
    font-family: var(--ff-mono);
    font-size: 11px;
    letter-spacing: .16em;
    color: var(--gold);
    margin-bottom: 10px;
}

.news-card a {
    color: var(--cobalt);
    text-decoration: none;
    font-weight: 700;
}

.editorial-note blockquote {
    padding: 30px 34px;
    border-left: 0;
    border-radius: 20px;
    background: linear-gradient(135deg, #fff8e9 0%, #f7fbff 100%);
    color: var(--navy);
    font-size: 17px;
    line-height: 1.9;
    box-shadow: 0 16px 36px rgba(1,35,106,.08);
}

.guest-byline .quote-box {
    padding: 24px 28px;
    border-radius: 20px;
    background: linear-gradient(135deg, #fff7e7 0%, #fdf4e6 100%);
    border-left: 4px solid var(--gold);
    margin: 24px 0;
}

.guest-byline .quote-box p {
    font-size: 17px;
    font-style: italic;
    color: var(--navy);
    margin: 0;
}

.guest-byline .content {
    padding: 24px 26px;
    border-radius: 20px;
    background: linear-gradient(135deg, #ffffff 0%, #fbf8f1 100%);
    box-shadow: 0 12px 24px rgba(1,35,106,.05);
    margin-top: 20px;
}

.guest-byline .content h3 {
    color: var(--navy);
    margin: 18px 0 8px;
    font-size: 20px;
}

.guest-byline .content p,
.guest-byline .content h4 {
    color: var(--ink-mid);
    line-height: 1.85;
}

.story-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.story-grid > div {
    padding: 16px 18px;
    border-radius: 14px;
    background: #f8fbff;
    border: 1px solid rgba(1,35,106,.08);
}

.calendar-section .calendar-list {
    display: grid;
    gap: 14px;
}

.knowledge-hub .knowledge-card ul,
.announcement-card ul {
    padding-left: 18px;
    color: var(--ink-mid);
    line-height: 1.75;
}

.trivia-section .trivia-box {
    text-align: center;
    font-size: 16px;
}

@media(max-width:768px){

    .thought-card{
        padding:25px;
    }

    .author-box{
        flex-direction:column;
        text-align:center;
    }

    .thought-card h2{
        font-size:24px;
    }

    .section-title h2{
        font-size:30px;
    }

    .thought-card p{
        font-size:15px;
    }

    blockquote{
        font-size:16px;
    }

    .news-grid,
    .announcement-grid,
    .story-grid {
        grid-template-columns: 1fr;
    }

    .action-section .container,
    .gml-section .container,
    .editorial-note .container,
    .guest-byline .container,
    .calendar-section .container,
    .knowledge-hub .container,
    .trivia-section .container,
    .announcement-section .container {
        padding: 24px 18px;
    }

    .club-layout,
    .club-layout.reverse {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .club-media img {
        height: 220px;
    }

}


/* --- Next Style Block --- */


    /* ==========================================
   GML EDITORIAL TEAM
========================================== */

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 35px;
}

.team-card {
    text-align: center;
    background: #fff;
    padding: 24px 20px;
    border-radius: 20px;
    border: 1px solid rgba(201,146,42,.25);
    border-top: 4px solid var(--gold);
    box-shadow: 0 10px 30px rgba(1,35,106,.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.team-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(1,35,106,.15);
}

.team-card-image {
    width: 100%;
    height: 480px;
    overflow: hidden;
    border-radius: 14px;
    margin-bottom: 18px;
    border: 2px solid rgba(201,146,42,.2);
    box-shadow: 0 8px 24px rgba(1,35,106,.08);
}

.team-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    transition: transform .35s ease;
    cursor: zoom-in;
}

.team-card:hover .team-card-image img {
    transform: scale(1.03);
}

.team-card-name {
    font-family: var(--ff-body);
    font-size: 24px;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 6px;
}

.team-card-role {
    font-family: var(--ff-mono);
    font-size: 13px;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    line-height: 1.5;
}


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

@media (max-width: 900px) {

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

}


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

@media (max-width: 576px) {

    .team-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .team-card-image {
        height: 350px;
    }

}


/* --- Next Style Block --- */


    .gml-disclaimer {
    margin: 50px auto 20px;
    padding: 22px 25px;
    /*max-width: 1000px;*/
    border-top: 2px solid #c89b2b;
    border-bottom: 1px solid #ddd;
    background: #f8f8f8;
    text-align: center;
}

.gml-disclaimer h3 {
    margin: 0 0 12px;
    color: #0c3d91;
    font-family: var(--ff-body);
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 1px;
}

.gml-disclaimer p {
    margin: 6px 0;
    color: #555;
    font-size: 16px;
    line-height: 1.7;
}