/* =============================================================
   JASHN-E-AMRIT — RESPONSIVE STYLESHEET
   Mobile-first content is handled by fluid clamp() values and the
   Bootstrap grid in style.css. The breakpoints below fine-tune
   spacing, sizing and type scale at each target width so nothing
   overflows or feels cramped between 1920px and 320px.
   ============================================================= */

/* -------------------------------------------------------------
   0. WIDE / ULTRA-WIDE DESKTOP (>=1920px, >=1600px, >=1400px)
   Container is capped at 1240px so large monitors don't need
   different layouts — this just gives a little breathing room.
   ------------------------------------------------------------- */
@media (min-width: 1920px) {
  .container { max-width: 1320px; }
}

@media (min-width: 1600px) {
  .ja-hero-title { font-size: clamp(3rem, 7vw, 6.6rem); }
}

@media (min-width: 1400px) {
  /* Reserved: generous max-widths already enforced via .container */
}

/* -------------------------------------------------------------
   1. LAPTOP / SMALL DESKTOP (<=1440px / <=1366px / <=1199.98px)
   ------------------------------------------------------------- */
@media (max-width: 1440px) {
  .ja-programme-card-lg { height: 440px; }
}

@media (max-width: 1366px) {
  .ja-speakers-panel { padding: 44px 36px; }
}

@media (max-width: 1199.98px) {
  .ja-programme-card-lg { height: 410px; }
}

/* -------------------------------------------------------------
   2. TABLET (<=992px / <=991.98px)
   ------------------------------------------------------------- */
@media (max-width: 991.98px) {
  /* Header / Navbar */
  .ja-site-header-navbar .collapse {
    background: var(--ja-navy);
    margin-top: 16px;
    padding: 18px;
    border-radius: var(--radius-md);
    max-height: 80vh;
    overflow-y: auto;
  }
  .ja-site-header-nav-link::after { display: none; }
  .ja-site-header-nav-list { gap: 2px; }
  .ja-site-header-nav-link { padding: 12px 10px !important; }
  .ja-site-header-nav-list .nav-item.ms-lg-3 { margin-top: 10px; }
  .ja-site-header-nav-list .nav-item.ms-lg-3 .btn { width: 100%; }

  /* Hero */
  .ja-hero { padding-top: 130px; padding-bottom: 80px; min-height: unset; }
  .ja-hero-content { padding: 0 16px; }

  /* Section spacing pulled in slightly so nothing feels cramped */
  .ja-categories,
  .ja-programme,
  .ja-speakers,
  .ja-sponsorship,
  .ja-contact { padding: 80px 0; }

  .ja-programme-card-lg { height: 360px; }
  .ja-programme-card-body { padding: 22px; }
  .ja-programme-card-body h3 { font-size: 1.55rem; }

  .ja-speakers-panel { padding: 32px 26px; }
  .ja-speakers-lede { font-size: 1.25rem; }

  .ja-contact-form-card { padding: 32px; }

  /* About */
  .ja-about { padding: 80px 0; }
  .ja-about-content { padding-left: 0; margin-top: 60px; }
  .ja-about-text { font-size: 17px; }
  .ja-about-quote p { font-size: 22px; }
  .ja-about-card { left: 15px; bottom: -15px; }

  .ja-impact, .ja-dftt, .ja-benefits { padding: 80px 0; }
  .ja-impact-reach-panel { padding: 26px 22px; }
  .ja-sponsorship-target-strip { padding: 22px 24px; }

  .ja-films, .ja-patrons, .ja-gallery, .ja-beyond { padding: 70px 0; }
  .ja-gallery-item { height: 280px; }
}

/* -------------------------------------------------------------
   3. MOBILE / LARGE PHONE (<=768px / <=767.98px)
   ------------------------------------------------------------- */
@media (max-width: 767.98px) {
  /* Header / Navbar */
  .ja-site-header { padding: 16px 0; }
  .ja-brand { font-size: 1.25rem; gap: 8px; }
  .ja-brand-mark { width: 34px; height: 34px; font-size: 0.85rem; }

  /* Hero */
  .ja-hero { padding: 120px 0 70px; }
  .ja-hero-actions { flex-direction: column; width: 100%; }
  .ja-hero-actions .btn { width: 100%; }
  .ja-hero-title { font-size: clamp(2.4rem, 11vw, 3.6rem); }
  .ja-hero-subtitle { font-size: clamp(1.2rem, 5vw, 1.6rem); }
  .ja-hero-description { font-size: 0.95rem; padding: 0 4px; }
  .ja-hero-org-badge { font-size: 0.66rem; padding: 5px 12px; }
  .ja-hero-meta { font-size: 0.85rem; }

  /* Section heads */
  .ja-section-heading { margin-bottom: 34px; }
  .ja-section-heading-title { font-size: clamp(1.7rem, 6vw, 2.2rem); }
  .ja-section-heading-subtitle { font-size: 0.7rem; letter-spacing: 0.14em; }

  /* Category cards */
  .ja-categories { padding: 56px 0; }
  .ja-categories-card { padding: 24px 14px; }
  .ja-categories-card i { font-size: 1.55rem; margin-bottom: 10px; }
  .ja-categories-card h3 { font-size: 1.1rem; }
  .ja-categories-card p { font-size: 0.8rem; }

  /* Programme */
  .ja-programme { padding: 60px 0; }
  .ja-programme-card-lg { height: 320px; }
  .ja-programme-card-body { padding: 18px; }
  .ja-programme-card-body h3 { font-size: 1.35rem; }
  .ja-programme-card-body p { font-size: 0.82rem; max-width: 100%; }
  .ja-programme-card-sm { padding: 20px 18px; }
  .ja-featured-badge { top: 14px; left: 14px; padding: 6px 13px; font-size: 0.6rem; }
  .ja-programme-meta { gap: 4px 14px; margin-bottom: 12px; }
  .ja-programme-meta span { font-size: 0.72rem; }
  .ja-programme-link { padding: 10px 20px; font-size: 0.72rem; }

  /* Speakers */
  .ja-speakers { padding: 56px 0; }
  .ja-speakers-panel { padding: 26px 18px; }
  .ja-speakers-lede { font-size: 1.1rem; margin-bottom: 20px; }
  .ja-speakers-tag { padding: 9px 16px; font-size: 0.78rem; }

  /* Sponsorship */
  .ja-sponsorship { padding: 60px 0; }
  .ja-sponsorship-price-card { padding: 30px 22px; }
  .ja-sponsorship-price-card p { min-height: unset; }
  .ja-sponsorship-price-amount { font-size: 1.8rem; }

  /* Contact / Forms */
  .ja-contact { padding: 60px 0; }
  .ja-contact-list li { gap: 12px; margin-bottom: 18px; }
  .ja-contact-form-card { padding: 26px; }
  .ja-contact-form-tabs { flex-wrap: wrap; gap: 4px 0; }
  .ja-contact-form-tab { padding: 8px 4px 12px; margin-right: 14px; font-size: 0.8rem; }
  .ja-contact-form-title { font-size: 1.35rem; }
  .ja-form-check-group { gap: 8px; }
  .ja-form-check { font-size: 0.78rem; padding: 7px 14px; }

  /* Footer */
  .ja-site-footer { padding: 56px 0 0; }
  .ja-site-footer-top { padding-bottom: 34px; }
  .ja-site-footer-heading { margin-bottom: 14px; }
  .ja-contact-list span:not(.ja-contact-label),
  .ja-site-footer-contact li { word-break: break-word; }

  /* Scroll-to-top button — keep clear of content on short screens */
  .ja-scroll-top { width: 40px; height: 40px; bottom: 18px; right: 18px; font-size: 0.9rem; }

  /* Impact / stats */
  .ja-impact { padding: 56px 0; }
  .ja-impact-stat-card { padding: 22px 10px; }
  .ja-impact-stat-card i { font-size: 1.5rem; }
  .ja-impact-stat-number { font-size: 1.5rem; }
  .ja-impact-stat-card p { font-size: 0.72rem; }
  .ja-impact-reach-panel { padding: 22px 18px; }
  .ja-impact-reach-panel h3 { font-size: 1.05rem; }

  /* About DFTT */
  .ja-dftt { padding: 56px 0; }
  .ja-dftt-card { padding: 22px 18px; }

  /* Brand benefits */
  .ja-benefits { padding: 56px 0; }
  .ja-benefits-panel { padding: 26px 22px; }
  .ja-benefits-panel h3 { font-size: 1.1rem; }

  .ja-beyond-item i { width: 50px; height: 50px; font-size: 1.15rem; }
  .ja-beyond-item span { font-size: 0.72rem; }

  /* Sponsorship extras */
  .ja-sponsorship-target-strip { padding: 18px; flex-direction: column; gap: 4px; }
  .ja-sponsorship-target-strip strong { font-size: 1.4rem; }
  .ja-sponsorship-accordion .accordion-button { font-size: 0.85rem; padding: 16px 18px; }
  .ja-sponsorship-accordion .accordion-body { padding: 4px 18px 18px; font-size: 0.85rem; }
  .ja-sponsorship-bank-grid { grid-template-columns: 1fr; padding: 16px; }

  /* Content: films / patrons / gallery / beyond */
  .ja-films, .ja-patrons, .ja-gallery, .ja-beyond { padding: 56px 0; }
  .ja-films-card, .ja-patrons-card { padding: 24px 16px; }
  .ja-films-card p { min-height: unset; }
  .ja-gallery-item { height: 220px; }
  .ja-impact-quote p { font-size: 1.05rem; }
  .ja-beyond-cta h3 { font-size: 1.5rem; }
}

/* -------------------------------------------------------------
   4. SMALL PHONE (<=576px / <=575.98px)
   ------------------------------------------------------------- */
@media (max-width: 575.98px) {
  .btn { padding: 12px 22px; font-size: 0.8rem; }
  .ja-btn-gold-sm { padding: 9px 18px; font-size: 0.72rem; }

  /* About */
  .ja-about-text { font-size: 16px; line-height: 1.9; }
  .ja-about-quote { padding: 22px; }
  .ja-about-quote p { font-size: 18px; }
  .ja-about-card { padding: 10px 15px; }
  .ja-about-card span { font-size: 12px; }

  .ja-hero-actions { gap: 12px; }
  .ja-hero-orgs { gap: 10px; margin-bottom: 20px; }
  .ja-hero-meta { flex-direction: column; gap: 8px; }
  .ja-hero-meta-dot { display: none; }

  /* two-per-row cards get a bit tighter but never overflow */
  .ja-categories-card { padding-left: 8px; padding-right: 8px; }

  .ja-programme-card-lg { height: 280px; }
  .ja-programme-card-body h3 { font-size: 1.2rem; }

  .ja-sponsorship-price-card { padding: 26px 18px; }
  .ja-sponsorship-price-card p { font-size: 0.82rem; }

  .ja-contact-form-card { padding: 18px; }
  .ja-contact-form-title { font-size: 1.2rem; }

  .ja-site-footer-links, .ja-site-footer-social { flex-wrap: wrap; }
}

/* -------------------------------------------------------------
   5. EXTRA-SMALL PHONES (<=480px / <=414px / <=413.98px)
   Covers 480 / 414 / 390 / 375 / 360 devices
   ------------------------------------------------------------- */
@media (max-width: 480px) {
  .ja-brand-text { font-size: 1rem; }
  .ja-brand { gap: 6px; }
  .ja-brand-mark { width: 30px; height: 30px; font-size: 0.75rem; }
}

@media (max-width: 413.98px) {
  .ja-hero { padding: 110px 0 60px; }
  .ja-hero-title { font-size: clamp(2rem, 12vw, 2.8rem); margin-bottom: 12px; }
  .ja-hero-description { font-size: 0.88rem; }
  .ja-hero-meta { gap: 6px; font-size: 0.8rem; }

  .ja-section-heading-title { font-size: 1.5rem; }
  .ja-section-heading-description { font-size: 0.9rem; }

  .ja-categories-card { padding: 18px 10px; }
  .ja-categories-card i { font-size: 1.35rem; }
  .ja-categories-card h3 { font-size: 1rem; }
  .ja-categories-card p { font-size: 0.76rem; }

  .ja-programme-card-lg { height: 250px; }
  .ja-programme-card-body { padding: 14px; }
  .ja-programme-card-body h3 { font-size: 1.05rem; }
  .ja-programme-card-body p { font-size: 0.78rem; margin-bottom: 8px; }
  .ja-programme-tag { font-size: 0.62rem; }
  .ja-programme-card-sm h4 { font-size: 1.05rem; }
  .ja-programme-card-sm p { font-size: 0.78rem; }
  .ja-featured-badge { font-size: 0.56rem; padding: 5px 11px; gap: 4px; }
  .ja-programme-meta { display: none; }

  .ja-speakers-lede { font-size: 1rem; }
  .ja-speakers-tag { padding: 8px 13px; font-size: 0.72rem; }

  .ja-sponsorship-price-amount { font-size: 1.55rem; }
  .ja-sponsorship-price-card h3 { font-size: 1.2rem; }

  .ja-contact-form-card { padding: 14px; }
  .ja-form-input { padding: 10px 12px; font-size: 0.85rem; }
  .ja-form-check { font-size: 0.72rem; padding: 6px 12px; }

  .ja-site-footer-brand .ja-brand-text { font-size: 1.15rem; }
  .ja-site-footer-tagline { font-size: 1rem; }

  .ja-impact-stat-card { padding: 16px 8px; }
  .ja-impact-stat-number { font-size: 1.3rem; }
  .ja-impact-tag-cloud span { font-size: 0.7rem; padding: 5px 11px; }
  .ja-dftt-card h4 { font-size: 0.95rem; }
  .ja-benefits-list li { font-size: 0.82rem; }
  .ja-beyond-item i { width: 44px; height: 44px; font-size: 1rem; }
}

/* -------------------------------------------------------------
   6. VERY NARROW PHONES (<=360px / <=359.98px / down to 320px)
   ------------------------------------------------------------- */
@media (max-width: 359.98px) {
  .ja-hero-title { font-size: clamp(1.8rem, 12vw, 2.4rem); }
  .ja-hero-org-badge { font-size: 0.6rem; padding: 4px 10px; }
  .btn { padding: 11px 18px; font-size: 0.75rem; }
  .ja-categories-card p { font-size: 0.72rem; }
}

@media (max-width: 320px) {
  .ja-hero-content { padding: 0 12px; }
  .ja-contact-form-card { padding: 12px; }
}

/* -------------------------------------------------------------
   7. DESIGN REFRESH — new sections and components
   ------------------------------------------------------------- */
@media (max-width: 1199.98px) {
  .ja-hero-side,
  .ja-hero-script { display: none; }
  .ja-orn-l { left: -280px; }
  .ja-about-inset { right: -14px; }
  .ja-tiles { gap: 16px; }
  .ja-tile-body h3 { font-size: 1.4rem; }
}
@media (max-width: 991.98px) {
  .ja-about-main { padding: 80px 0; }
  .ja-about-main .ja-about-content { margin-top: 0; }
  .ja-arch { max-width: 440px; }
  #impact { padding: 100px 0 90px; }
  #why-partner { padding-top: 70px; }
  .ja-voices { padding: 110px 0 100px; }
  .ja-tiles { grid-template-columns: repeat(2, 1fr); }
  .ja-tile { aspect-ratio: 1 / 1; }
  .ja-tile-body h3 { font-size: 1.55rem; }
  .ja-mosaic { grid-auto-rows: 150px; }
  .ja-venue { padding: 80px 0; }
  .ja-cta { padding: 110px 0; }
  .ja-site-footer { padding-top: 90px; }
}
@media (max-width: 767.98px) {
  .ja-hero-scroll-cue { display: none; }
  .ja-cd { margin-bottom: 26px; }
  .ja-cd-box { min-width: 70px; padding: 4px 14px; }
  .ja-about-main { padding: 60px 0; }
  .ja-about-stat { padding: 0 18px; }
  .ja-about-stat strong { font-size: 2rem; }
  #impact { padding: 80px 0 70px; }
  #why-partner { padding-top: 56px; }
  .ja-voices { padding: 90px 0 80px; }
  .ja-voice-mark { font-size: 2.6rem; }
  .ja-tile-body { padding: 16px 14px; }
  .ja-tile-body h3 { font-size: 1.3rem; }
  .ja-tile-body p { font-size: 0.76rem; }
  .ja-tile-ic { width: 38px; height: 38px; top: 12px; left: 12px; font-size: 1rem; }
  .ja-mosaic { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 140px; gap: 10px; }
  .ja-g1 { grid-column: 1 / 3; grid-row: auto / span 2; }
  .ja-g2 { grid-column: auto; grid-row: auto / span 2; }
  .ja-g3,
  .ja-g4 { grid-column: auto; grid-row: auto; }
  .ja-g5,
  .ja-g6 { grid-column: 1 / 3; grid-row: auto; }
  .ja-venue { padding: 56px 0; }
  .ja-venue-card { padding: 28px 22px 16px; }
  .ja-cta { padding: 84px 0; }
  .ja-site-footer { padding-top: 64px; }
}
@media (max-width: 575.98px) {
  .ja-cd-box { min-width: 58px; padding: 4px 9px; }
  .ja-cd-num { font-size: 1.85rem; }
  .ja-cd-lbl { font-size: 0.56rem; letter-spacing: 0.14em; }
  .ja-arch { max-width: 100%; margin-bottom: 44px; }
  .ja-about-inset { width: 38%; right: -6px; bottom: -30px; border-width: 4px; }
  .ja-about-stats { flex-wrap: wrap; row-gap: 14px; }
  .ja-about-stat { padding: 0 14px; }
  .ja-tiles { gap: 10px; }
  .ja-tile { aspect-ratio: 4 / 5; }
  .ja-tile-body p { display: none; }
  .ja-cta-actions .btn { width: 100%; }
}
