/* ============================================================
   RESPONSIVE STYLESHEET — Bharatiya Bhasha Parishad
   Breakpoints follow Bootstrap 5 conventions:
     Mobile     : < 576px
     Small       : 576px – 767px
     Tablet      : 768px – 991px
     Desktop     : 992px – 1199px
     Large       : 1200px – 1399px
     Extra Large : ≥ 1400px
   ============================================================ */
@media (min-width:1600px) {
  .container {
    max-width: 1400px
  }
}

@media (min-width:1800px) {
  .container {
    max-width: 1400px
  }
}

@media only screen and (max-width:1800px) {}

@media only screen and (max-width:1700px) {}

@media only screen and (max-width:1600px) {
  section .vg-hero {
    min-height: 92vh;
    padding-top: 0;
    padding-bottom: 160px;
  }

  .ab-mission__row {
    gap: 100px !important;
  }

  .ab-mission__right {
    padding-right: 62px !important;
  }

  section.ab-hero {
    min-height: 586px;
    padding-top: 0;
  }
}

@media only screen and (max-width:1500px) {}

@media only screen and (max-width:1400px) {
  .hero-content {
    z-index: 10;
    padding: 0px 20px 0px 0;
    position: relative;
  }

  section .dn-hero__title {
    font-size: 50px;
    line-height: 1;
  }

  .ab-mission__title {
    padding-left: 70px !important;
  }

  .ab-mission__intro {
    padding-left: 70px !important;
  }

  .ab-slider {
    height: 690px;
  }

  section.ab-hero {
    min-height: 506px;
    padding-top: 0;
    padding-bottom: 90px;
  }

  section .vg-hero__title {
    font-size: 50px;
    line-height: 1;
  }

  .section-title {
    font-size: 40px;
  }

  section.vg-about {
    border-radius: 25px 25px 0 0;
    margin-top: -40px;
    padding: 60px 0;
  }

  section.vg-hero {
    min-height: 70vh;
    padding-top: 0;
    padding-bottom: 70px;
  }

}

@media only screen and (max-width:1300px) {
  .ab-mission__intro {
    padding-left: 70px !important;
    padding-right: 40px !important;
  }
}

@media only screen and (max-width:1200px) {
  body section {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .ab-mission__row {
    gap: 60px !important;
  }

  .ab-mission-item {
    padding: 20px 0 !important;
  }

  .ab-mission__intro {
    padding-left: 70px !important;
    padding-right: 30px !important;
  }

  h2 {
    font-size: 40px;
    line-height: 50px;
  }

  body h2 {
    font-size: 40px;
    line-height: 50px;
  }

  .about-heading {
    line-height: 50px;
  }

  section.ab-hero {
    min-height: 486px;
    padding-top: 0;
  }

  .ab-hero .ab-hero__title {
    font-size: 50px;
    line-height: 1.2;
  }

  section .vg-hero__title {
    font-size: 50px;
    line-height: 1;
  }

  section.dn-hero {
    min-height: 66vh;
  }

  section.vg-hero {
    min-height: 64vh;
    padding-top: 0;
    padding-bottom: 72px;
  }

  .hero-title {
    color: #ffca19;
    margin-bottom: 16px;
    font-size: 50px;
    font-weight: 600;
    line-height: 55px;
  }

  .ab-intro .ab-slider {
    height: 560px;
  }

  .dn-hero .dn-hero__title {
    font-size: 50px;
    line-height: 1;
  }

  .section-title {
    font-size: 40px;
  }

  .about-section {
    border-radius: 80px 80px 0 0;
    margin-top: -105px;
    padding: 100px 0;
  }

  .hero-section {
    min-height: 556px;
    padding-top: 80px;
  }

  section.vg-about {
    border-radius: 25px 25px 0 0;
    margin-top: -40px;
    padding: 60px 0;
  }
}

@media only screen and (max-width:1100px) {}

/* ── Mobile + Tablet: Poets horizontal scroll-snap slider ── */
@media (max-width: 991px) {
  .poets-slider-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 8px;
  }

  .poets-slider-row::-webkit-scrollbar {
    display: none;
  }

  .poets-slider-item {
    scroll-snap-align: start;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* ── Tablet only: 2 cards visible ── */
@media screen and (max-width: 991px) {
  .poets-slider-item {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .ab-mission__row {
    gap: 20px !important;
  }

  .ab-mission__title,
  .ab-mission__intro {
    padding-left: 12px !important;
  }

  .ab-mission-item {
    padding: 10px 0 !important;
  }

  .ab-mission__right {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .ab-mission__photo-wrap {
    margin-top: 10px;
    padding: 0 12px !important;
  }

  .post-card-img {
    object-fit: cover;
    width: 100%;
    height: 242px;
  }

  .ab-intro .ab-slider {
    height: 420px;
  }

  .ab-team .ab-team__title {
    margin-bottom: 11px;
  }

  .ab-mission__photo {
    height: 450px;
    object-fit: cover;
  }

  .header-topbar .topbar-center img {
    width: 70px;
    height: 70px;
  }

  section.ab-hero {
    align-items: start;
    min-height: 426px;
    padding-top: 100px;
    padding-bottom: 90px;
    display: flex;
    position: relative;
  }

  .event-padding-1 {
    --bs-gutter-x: 2.5rem;
    --bs-gutter-y: 2.5rem;
  }

  .post-date {
    background-color: #f2f2f2;
    border-radius: 5px;
    margin-top: 10px;
    margin-bottom: 20px;
    padding: 10px 14px;
    font-size: 15px;
  }

  .tab-btn {
    padding: 8px 18px 10px;
    font-size: 18px;
  }

  .grid-col {
    justify-content: center;
    gap: 40px;
    display: flex;
  }

  section.dn-hero {
    align-items: start;
    min-height: 67vh;
    padding-top: 100px;
    padding-bottom: 160px;
  }

  .grid-img img {
    border-radius: 30px;
    width: 100%;
    display: block;
  }

  .footer-heading {
    font-size: 20px;
  }

  .footer-link {
    font-size: 14px;
  }

  .hero-title {
    line-height: 42px;
  }

  .hero-content {
    z-index: 10;
    padding: 0px 20px 60px 0;
    position: relative;
  }

  .hero-section {
    min-height: 413px;
  }

  .about-section {
    border-radius: 50px 50px 0 0;
    margin-top: -75px;
  }

  .donations-section {
    padding-top: 0 !important;
  }

  .footer-social-btn {
    width: 32px;
    height: 32px;
  }

  .footer-social-btn i {
    font-size: 17px;
  }

  .footer-shell {
    background: #ea5800;
    border-radius: 50px 50px 0 0;
    margin-top: -40px;
    padding-top: 60px;
  }

  .news-card-img {
    height: 220px;
    min-height: 140px;
    width: 100%;
  }

  .news-card-title {
    color: #000;
    margin-bottom: 11px;
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
  }

  .media-padding {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
  }

  .news-card-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 27px;
  }

  .news-card-img {
    min-height: 140px;
    height: 220px;
  }

  .news-card {
    flex-direction: column;
  }

  section.vg-hero {
    min-height: 57vh;
  }

  section.vg-hero .vg-hero__subtitle {
    margin-bottom: 16px;
  }

  section.vg-about {
    border-radius: 25px 25px 0 0;
    margin-top: -40px;
    padding: 60px 0;
  }

}

/* ── Tablet / Small screens — max 820px ─────────────────── */
@media only screen and (max-width: 820px) {

  body section {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  body h2 {
    font-size: 32px;
  }

  body p {
    font-size: 16px;
  }

  .btn-red,
  .btn-gold {
    padding: 12px 28px;
    font-size: 16px;
  }

  .section-title {
    font-size: 32px;
  }

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

  .gallery-item.large {
    grid-column: span 2;
    grid-row: span 1;
    height: 220px;
  }

  .news-card {
    flex-direction: column;
  }

  .news-card-img {
    width: 100%;
    height: 220px;
  }
}

/* ── Tablet only ─────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 991px) {
  h1 {
    font-size: 40px !important;
  }

  h2 {
    font-size: 33px !important;
  }

  body section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }

  /* News card text — 2-line clamp */
  .news-card-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Poets — 2 items visible */
  .poets-slider-item {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }

  /* Donations — hide outermost 2 circles, show 3 */
  .hide-new {
    display: none !important;
  }

  /* Gallery — 2×2 grid */
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px;
  }

  .gallery-item,
  .gallery-item.large,
  .gallery-item.small,
  .gallery-item.mid-height,
  .gallery-item:last-child {
    grid-column: span 1 !important;
    grid-row: auto !important;
    height: 260px !important;
    margin-top: 0 !important;
  }

  .sangam-header {
    z-index: 2;
    padding-top: 50px;
  }

  .video-container {
    margin-top: -160px;
  }

  .sangam-poets {
    padding-bottom: 0;
  }
}

/* ── Mobile — max 767px ─────────────────────────────────── */
@media (max-width: 767px) {

  /* globals.css pushes the Previous/Upcoming tab group to the right
     (margin-left: auto) so it sits opposite the "कार्यक्रम" heading on a
     wide desktop row — on mobile, where the heading and tabs stack instead
     of sitting side by side, that same right-push shoves the tab group out
     of alignment with the heading above it and skews the active-tab
     underline. Restore normal centered flow on mobile. */
  .eventPage .eventTabs .event-tabs {
    margin: 0 auto;
  }

  /* Poets — 1 item at a time on mobile */
  .poets-slider-item {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  body h2 {
    font-size: 32px !important;
  }

  .event-padding-1 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
  }

  .ab-mission .ab-mission-item {
    align-items: start;
    flex-direction: column;
  }

  .ab-mission .ab-mission-sep {
    margin: 4px 0 4px 0;
  }

  .header-topbar .topbar-center img {
    width: 100px;
    height: 100px;
  }

  section.dn-hero {
    min-height: 683px;
    align-items: start;
  }

  .tab-btn {
    font-size: 15px;
    padding: 8px 17px 10px;
  }

  .eventTabs {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 35px;
    display: flex;
  }

  .post-date {
    margin-bottom: 24px;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    display: inline-block;
  }

  section.vg-about {
    border-radius: 25px 25px 0 0;
    margin-top: -40px;
    padding: 60px 0;
  }

  section.vg-hero {
    text-align: center;
    align-items: start;
    min-height: 683px;
    background-size: cover;
    background-position: center;
  }

  .vg-plan-row__left {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    width: 100%;
  }

  /* Sangam — swap to mobile background */
  .sangam-section {
    background-image: url(../../images/bbp-bg-1.png);
  }

  .footer-shell {
    background: #ea5800;
    border-radius: 25px 25px 0 0;
    margin-top: -30px;
    padding-top: 50px;
  }

  .donations-section {
    padding-top: 50px !important;
  }

  .donations-section .section-title,
  .section-title.vg-about__title {
    line-height: 41px;
  }

  .footer-text {
    font-size: 13px;
  }

  .footer-heading {
    font-size: 20px;
    margin-bottom: 1.5rem;

  }

  .footer-link {
    font-size: 14px;
  }

  .footerSpacing {
    margin-bottom: 10px;
  }

  .news-card-body {
    border-left: 0px solid var(--gold);
  }

  /* Media — swap to mobile background */
  .media-section {
    background-image: url(../../images/yellow-bg-bbp-2.png);
    padding-bottom: 110px !important;
  }

  .about-heading {
    line-height: 40px;
  }

  .news-card-text {
    font-size: 16px;
    line-height: 27px;
  }

  .news-card-title {
    font-size: 19px;
    line-height: 1.6;
  }

  .vagarth-img {
    margin-top: 30px;
  }

  .sangam-header {
    z-index: 2;
    padding-top: 0;
  }

  .adjust-posi {
    margin-top: 0;
  }

  .video-section {
    padding-bottom: 0 !important;
  }

  .video-play-icon i {
    font-size: 60px;
  }

  .video-container {
    margin-top: -120px;
  }

  .sangam-poets {
    z-index: 2;
    margin-top: 190px;
    padding-bottom: 0;
  }

  body section {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }

  .about-section {
    margin-top: 0;

  }

  .about-section .row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 3.5rem;
  }

  .fab.fabVertical {
    display: none;
  }

  .hero-title {
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 0px;
  }

  .hero-content {
    z-index: 10;
    padding: 0px 0px 0px 0;
    position: relative;
    text-align: center;
  }

  /* Hero — swap to mobile banner */
  .hero-section {
    background-image: url(../../images/banner-home-mobile.png);
    background-position: bottom;
    background-size: cover;
    min-height: 530px;
  }

  /* Header desktop nav hidden */
  .hdr-desktop-nav {
    display: none !important;
  }

  /* Logo size */
  .logo-img {
    width: 70px !important;
    height: 70px !important;
  }

  /* Global button overrides for mobile */
  .glink {
    padding: 14px 30px;
    font-size: 15px;
  }

  .btn-red {
    padding: 14px 30px;
    font-size: 15px;
  }

  /* Topbar language buttons (scoped — overrides global above) */
  .topbar-left .btn-red {
    padding: 10px 18px;
    font-size: 13px;
  }

  .topbar-left .glink {
    padding: 10px 18px;
    font-size: 13px;
  }

  /* Container padding on mobile */
  .media-padding {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    padding-right: calc(var(--bs-gutter-x) * 0.5);
  }

  /* Donations — show only center card on mobile */
  .hide-new,
  .hide-1 {
    display: none !important;
  }

  .grid-gal {
    margin: 0 20px;
  }

  .grid-col {
    gap: 0;
    justify-content: center;
  }

  .grid-col .grid-img:nth-child(3) {
    max-width: 260px;
    flex: 0 0 260px;
  }

  /* Vagarth — center-align text col on mobile */
  .vagarth-section .col-lg-6:first-child {
    text-align: center;
  }

  .vagarth-section .col-lg-6:first-child .btn-red {
    margin: 0 auto;
  }

  /* About — slider height + center-align text */
  .about-slider {
    height: 440px;
  }

  .about-text-col {
    text-align: center;
  }

  /* Gallery — single column */
  .gallery-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .gallery-item.large,
  .gallery-item.small,
  .gallery-item.mid-height {
    grid-column: span 1;
    grid-row: span 1;
    height: 300px;
  }
}
/* ── Sanskrit Uday — responsive ── */
@media (max-width: 991px) {
  .sanskrit-uday-title {
    font-size: 36px;
  }
}

@media (max-width: 767px) {
  .sanskrit-uday-section {
    padding: 50px 0 60px;
  }
  .sanskrit-uday-title {
    font-size: 28px;
  }
}