/* =====================================================
   GMA Navigation — ATA / TANA organization model
   Layout order:
     0. Utility/announcement top bar (TANA-style, above banner)
     1. Header (banner image + logo + org name)
     2. White menu bar (org nav items + dropdowns)
   NOT a sticky event-invitation nav.
   ===================================================== */

/* ══ 0. UTILITY / ANNOUNCEMENT TOP BAR ══════════════
   Sits above the banner so the banner stays clean for branding.
   Row 1: crimson announcement. Row 2: dark utility (helpline + links).
   ═══════════════════════════════════════════════════ */
.gma-topbar { width: 100%; }

/* Row 1 — announcement */
.gma-topbar__announce {
  background: var(--gma-primary, #B11E2F);
  color: #fff;
  font-size: .82rem;
}
.gma-topbar__announce-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .45rem 1.25rem;
  flex-wrap: wrap;
  text-align: center;
}
.gma-topbar__announce strong { color: #fff; font-weight: 700; }
.gma-topbar__announce-sub { color: rgba(255,255,255,.9); }
.gma-topbar__announce-cta {
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.55);
  white-space: nowrap;
}
.gma-topbar__announce-cta:hover { border-bottom-color: #fff; }

/* Utility row — single dark navy bar */
.gma-topbar__utility {
  background: var(--gma-primary-dark);
  color: rgba(255,255,255,.88);
  font-size: .8rem;
  border-bottom: 1px solid rgba(0,0,0,.2);
}
.gma-topbar__utility-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .4rem 1.25rem;
  flex-wrap: wrap;
}

/* Key stats in the utility row (moved from the old full-width band) */
.gma-topbar__stats {
  display: inline-flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.gma-topbar__stat {
  color: rgba(255,255,255,.82);
  white-space: nowrap;
  font-size: .78rem;
}
.gma-topbar__stat strong { color: #fff; font-weight: 700; }
.gma-topbar__stat + .gma-topbar__stat { position: relative; padding-left: 1.25rem; }
.gma-topbar__stat + .gma-topbar__stat::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 11px; background: rgba(255,255,255,.25);
}
/* Separator dot before Donate */
.gma-topbar__sep {
  color: rgba(255,255,255,.35);
  font-size: .75rem;
  padding: 0 .1rem;
}
/* Gold Donate link */
.gma-topbar__donate {
  /* Brighter gold for contrast on the deep-navy utility bar: #E8C257 ≈ 6.9:1
     (passes WCAG AA). The muted --gma-accent #B8922E was only 4.04:1 (BUG-022). */
  color: #E8C257;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  font-size: .78rem;
}
.gma-topbar__donate:hover { color: #fff; }

/* Member login / account links (right side of the utility row) */
.gma-topbar__account { display: inline-flex; align-items: center; gap: .5rem; }
.gma-topbar__acct-link {
  display: inline-flex; align-items: center; gap: .35rem;
  color: rgba(255,255,255,.9); font-weight: 600; font-size: .78rem;
  text-decoration: none; white-space: nowrap;
}
.gma-topbar__acct-link .gma-icon { color: var(--gma-accent); }
.gma-topbar__acct-link:hover { color: #fff; }
.gma-topbar__acct-link--login {
  border: 1px solid rgba(255,255,255,.3); border-radius: 999px;
  padding: .15rem .7rem;
}
.gma-topbar__acct-link--login:hover { border-color: var(--gma-accent); background: rgba(255,255,255,.06); }
.gma-topbar__utility-right {
  display: inline-flex;
  align-items: center;
  gap: 1.1rem;
  flex-wrap: wrap;
}
.gma-topbar__phone {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  font-size: .8rem;
}
.gma-topbar__phone strong { color: #fff; font-weight: 700; letter-spacing: .01em; }
.gma-topbar__phone:hover { color: var(--gma-accent); }

.gma-topbar__links {
  display: inline-flex;
  align-items: center;
  gap: 1.1rem;
  flex-wrap: wrap;
}
.gma-topbar__link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: rgba(255,238,224,.9);
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
  transition: color .12s;
}
.gma-topbar__link .gma-icon { color: var(--gma-accent, #C8881A); }
.gma-topbar__link:hover { color: #fff; }
.gma-topbar__link:hover .gma-icon { color: #fff; }

@media (max-width: 1100px) {
  /* Drop EIN stat (longest) at medium screens */
  .u-stat--ein { display: none; }
  .gma-topbar__sep { display: none; }
}
@media (max-width: 960px) {
  /* Drop 7 Chapters stat too at smaller screens */
  .gma-topbar__stat:nth-child(3) { display: none; }
}
@media (max-width: 760px) {
  .gma-topbar__announce-sub { display: none; }
  .gma-topbar__utility-inner { justify-content: center; gap: .5rem .9rem; }
  .gma-topbar__phone-label { display: none; }
  /* Keep just the two most useful stats on phones. */
  .gma-topbar__stat:nth-child(n+3) { display: none; }
  /* Apply Membership link is in the nav too — hide here on phones. */
  .gma-topbar__link--apply { display: none; }
}

/* ══ 1. HEADER ══════════════════════════════════════
   The banner is shown DIRECTLY as an <img> that spans the FULL page width and
   scales fluidly with the window — no empty side bands, no cover-crop. The
   banner keeps its aspect ratio (height grows/shrinks with width), so it never
   looks stretched out of proportion; it simply fills the available width.
   ═══════════════════════════════════════════════════ */
.gma-header {
  border-bottom: 4px solid #D4AA30;
  width: 100%;
  background-color: #5C0A10;
  background-image: none !important;
  line-height: 0;            /* remove the inline-image gap below the banner */
  overflow: hidden;
}

/* Full-bleed, undistorted, fluid: width 100% + height auto keeps the ratio. */
.gma-header__banner-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.gma-header__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  padding: .75rem 2rem;
  max-width: 1200px;
  margin: 0 auto;
}

.gma-header__logo {
  height: 72px;
  width: auto;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.4));
}

.gma-header__titles {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}

.gma-header__name-te {
  font-family: 'Noto Serif Telugu', serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #FFE580;
  line-height: 1.3;
}

.gma-header__name-en {
  font-size: 1.25rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: .06em;
}

.gma-header__tagline {
  font-size: .75rem;
  color: rgba(255,220,150,.8);
  letter-spacing: .08em;
  font-style: italic;
}

/* ══ 2. MENU BAR — clean white, crimson links, gold underline on hover.
   The richly-colored banner above is the color moment; the nav stays quiet. ══ */
.gma-menubar {
  background: var(--gma-surface, #fff);
  border-bottom: 1px solid var(--gma-border, #ECE5DD);
  box-shadow: 0 1px 3px rgba(28,26,25,.06);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.gma-menubar__inner {
  max-width: 100%;
  display: flex;
  align-items: center;
  padding: 0 1rem;
}

.gma-menubar__list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
  flex-wrap: nowrap;
}

/* Menu items */
.gma-menubar__item {
  position: relative;
}

.gma-menubar__link {
  display: block;
  padding: .85rem .75rem;
  font-size: .875rem;
  font-weight: 600;
  color: var(--gma-primary-dark);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  transition: color .12s, border-color .12s;
  letter-spacing: .01em;
  text-transform: none;
}

.gma-menubar__link:hover,
.gma-menubar__item:hover > .gma-menubar__link,
.gma-menubar__item--has-drop:focus-within > .gma-menubar__link {
  background: transparent;
  border-bottom-color: var(--gma-accent);
  color: var(--gma-primary-dark);
}

/* Dropdown */
.gma-menubar__drop {
  /* Kept in the DOM and interactive-positioned; hidden via opacity/visibility
     instead of display:none so a CSS transition + hover bridge can keep it
     alive while the cursor travels diagonally toward a submenu item. */
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #e8d5c4;
  border-top: 3px solid #E8860A;
  border-radius: 0 0 6px 6px;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
  min-width: 230px;
  z-index: 1001;
  padding: .35rem 0;
  margin: 0;
  list-style: none;
  /* hidden state */
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease, visibility 0s linear .2s;
}

/* Invisible "hover bridge": a transparent strip that fills the gap between the
   menu link and the dropdown so the cursor never crosses dead space.
   This is the key fix for the hit-or-miss diagonal travel. */
.gma-menubar__item--has-drop::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 230px;          /* at least as wide as the dropdown */
  height: 14px;          /* covers the seam below the link */
  display: none;
}
.gma-menubar__item--has-drop:hover::after,
.gma-menubar__item--has-drop:focus-within::after {
  display: block;
}

.gma-menubar__item--has-drop:hover .gma-menubar__drop,
.gma-menubar__item--has-drop:focus-within .gma-menubar__drop,
.gma-menubar__item--has-drop.is-hovering .gma-menubar__drop {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity .15s ease, transform .15s ease, visibility 0s;
}
/* Keep the hover bridge active during the JS grace period too */
.gma-menubar__item--has-drop.is-hovering::after { display: block; }

/* Keep the last dropdowns from overflowing off the right edge of the viewport */
.gma-menubar__item--has-drop:nth-last-child(-n+3) .gma-menubar__drop {
  left: auto;
  right: 0;
}
.gma-menubar__item--has-drop:nth-last-child(-n+3)::after {
  left: auto;
  right: 0;
}

.gma-menubar__drop li { list-style: none; }

.gma-menubar__drop a {
  display: block;
  padding: .5rem 1.1rem;
  font-size: .85rem;
  color: var(--gma-ink, #1C1A19);
  text-decoration: none;
  border-left: 3px solid transparent;
  transition: background .12s, border-color .12s, color .12s;
}

.gma-menubar__drop a:hover {
  background: var(--gma-primary-tint, #FBEDEE);
  border-left-color: var(--gma-primary, #B11E2F);
  color: var(--gma-primary, #B11E2F);
}

/* Helpline right side */
.gma-menubar__helpline {
  margin-left: auto;
  padding: 0 0 0 .5rem;
  font-size: .78rem;
  font-weight: 600;
  color: var(--gma-text-muted, #6B625E);
  white-space: nowrap;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.gma-menubar__helpline strong { color: var(--gma-primary, #B11E2F); }
.gma-menubar__helpline .gma-icon { color: var(--gma-primary, #B11E2F); }

/* Mobile toggle */
.gma-menubar__toggle {
  display: none;
  background: none;
  border: none;
  font-size: 1.4rem;
  cursor: pointer;
  padding: .5rem;
  color: var(--gma-ink, #1C1A19);
  margin-left: auto;
}

/* ══ RESPONSIVE ══ */

/* ── 1200px: squeeze nav links so they all fit on one row ── */
@media (max-width: 1200px) {
  .gma-menubar__link {
    padding: .85rem .45rem;
    font-size: .8rem;
  }
}

/* ── 1100px: collapse to hamburger before overflow occurs ── */
@media (max-width: 1100px) {
  .gma-menubar__toggle { display: block; }
  .gma-menubar__list {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--gma-surface, #fff);
    border-top: 3px solid var(--gma-accent);
    border-bottom: 2px solid var(--gma-border);
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
    z-index: 998;
  }
  .gma-menubar.open .gma-menubar__list { display: flex; }
  .gma-menubar__link {
    padding: .75rem 1.25rem;
    font-size: .9rem;
    border-bottom: 1px solid var(--gma-border);
    color: var(--gma-primary-dark);
  }
  /* Dropdowns become accordion panels on tablet/mobile */
  .gma-menubar__drop {
    position: static;
    border: none;
    border-top: 1px solid var(--gma-border);
    box-shadow: none;
    border-radius: 0;
    min-width: 0;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    transition: none;
    max-height: 0;
    overflow: hidden;
  }
  .gma-menubar__item--has-drop.open .gma-menubar__drop { max-height: 600px; }
  .gma-menubar__item--has-drop::after { display: none !important; }
  .gma-menubar__item--has-drop:nth-last-child(-n+3) .gma-menubar__drop { left: auto; right: auto; }
}

@media (max-width: 960px) {
  .gma-header__name-te { font-size: .9rem; }
  .gma-header__name-en { font-size: .8rem; }
  .gma-header__logo { height: 56px; }
  .gma-header__dancer { height: 80px; }
}

@media (max-width: 760px) {
  .gma-menubar__helpline { display: none; }
  /* toggle + list already handled at 1100px — keep dropdowns */
  .gma-menubar__list {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--gma-surface, #fff);
    border-top: 3px solid var(--gma-accent);
    border-bottom: 2px solid var(--gma-border);
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
    z-index: 998;
  }
  .gma-menubar.open .gma-menubar__list { display: flex; }
  /* On mobile, dropdowns are accordion panels toggled by tapping the parent.
     Reset the desktop opacity/transform/bridge model entirely. */
  .gma-menubar__drop {
    position: static;
    border: none;
    border-top: 1px solid rgba(0,0,0,.1);
    box-shadow: none;
    border-radius: 0;
    min-width: 0;
    /* hidden by default on mobile via max-height collapse */
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    transition: none;
    max-height: 0;
    overflow: hidden;
  }
  .gma-menubar__item--has-drop.open .gma-menubar__drop {
    max-height: 600px;
  }
  /* No hover bridge on touch devices */
  .gma-menubar__item--has-drop::after { display: none !important; }
  /* Don't right-align dropdowns on mobile — full width accordion */
  .gma-menubar__item--has-drop:nth-last-child(-n+3) .gma-menubar__drop { left: auto; right: auto; }
  .gma-menubar__link { border-bottom: 1px solid rgba(0,0,0,.1); }
}

/* ══ Content page layout utilities ══ */
.gma-page {
  max-width: var(--gma-max-w, 1320px);
  margin-inline: auto;
  padding: 2.5rem 1.25rem;
}
.gma-page__eyebrow {
  display: inline-block;
  background: var(--gma-primary-tint, #EAF1F6);
  color: var(--gma-primary, #154D79);
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  padding: .25rem .7rem;
  border-radius: 999px;
  margin-bottom: .75rem;
}
.gma-page__title { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 800; color: var(--gma-ink, #1C1A19); margin: 0 0 1rem; line-height: 1.2; }
.gma-page__lead { font-size: 1.15rem; color: var(--gma-text-muted, #6B6354); max-width: 680px; line-height: 1.65; margin: 0 0 2rem; }
.gma-page__body { font-size: 1rem; color: var(--gma-ink, #1C1A19); line-height: 1.7; max-width: 760px; }
.gma-page__body h2 { font-size: 1.4rem; font-weight: 700; margin: 1.75rem 0 .75rem; color: var(--gma-primary, #154D79); }
.gma-page__body h3 { font-size: 1.15rem; font-weight: 700; margin: 1.5rem 0 .5rem; }
.gma-page__body ul, .gma-page__body ol { padding-left: 1.4rem; margin: .75rem 0 1.25rem; }
.gma-page__body li { margin-bottom: .4rem; }
.gma-page__body p { margin-bottom: 1rem; }
.gma-page__two-col { display: grid; grid-template-columns: 2fr 1fr; gap: 3rem; align-items: start; }
@media (max-width: 720px) { .gma-page__two-col { grid-template-columns: 1fr; } }

.gma-sidebar-card { background: var(--gma-bg, #FBF8F4); border: 1px solid var(--gma-border, #ECE5DD); border-top: 3px solid var(--gma-primary, #B11E2F); border-radius: var(--gma-radius, 14px); padding: 1.5rem; }
.gma-sidebar-card__title { font-size: 1rem; font-weight: 700; color: var(--gma-ink, #1C1A19); margin: 0 0 1rem; }
.gma-sidebar-card__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .5rem; }
.gma-sidebar-card__list a { color: var(--gma-primary, #B11E2F); font-size: .9rem; text-decoration: none; }
.gma-sidebar-card__list a:hover { text-decoration: underline; }

.gma-info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.25rem; margin: 2rem 0; }
.gma-info-card { background: var(--gma-surface, #fff); border: 1px solid var(--gma-border, #ECE5DD); border-radius: var(--gma-radius, 14px); padding: 1.5rem; box-shadow: var(--gma-shadow-sm, 0 1px 3px rgba(28,26,25,.06)); transition: box-shadow .18s, transform .18s; }
.gma-info-card:hover { box-shadow: var(--gma-shadow, 0 4px 14px rgba(28,26,25,.07)); transform: translateY(-2px); }
/* Icon chip — SVG inherits currentColor (crimson) */
.gma-info-card__icon { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:12px; background: var(--gma-primary-tint, #FBEDEE); color: var(--gma-primary, #B11E2F); margin-bottom: .85rem; font-size: 1.4rem; line-height:1; }
.gma-info-card__title { font-weight: 700; font-size: 1rem; color: var(--gma-ink, #1C1A19); margin: 0 0 .4rem; }
.gma-info-card__body { font-size: .9rem; color: var(--gma-text-muted, #6B625E); line-height: 1.6; margin: 0; }

.gma-page-hero { background: var(--gma-dark, #102E45); color: #fff; padding: 2.25rem 1.25rem; position: relative; }
.gma-page-hero::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background: var(--gma-accent, #B8922E); }
.gma-page-hero__inner { max-width: var(--gma-max-w, 1320px); margin-inline: auto; }
.gma-page-hero__eyebrow { display: inline-block; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3); padding: .2rem .7rem; border-radius: 999px; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin-bottom: .75rem; }
.gma-page-hero__title { font-size: clamp(1.8rem, 4vw, 2.8rem); font-weight: 800; margin: 0 0 .5rem; }
.gma-page-hero__sub { font-size: 1.1rem; opacity: .88; max-width: 560px; margin: 0; }

/* ── Programs page — image card grid ───────────────────────────────── */
.gma-prog-pg-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.5rem;
  padding: 0 0 2rem;
}
.gma-prog-pg-card {
  display: flex;
  flex-direction: column;
  background: var(--gma-surface, #fff);
  border: 1px solid var(--gma-border, #E4E7DD);
  border-radius: var(--gma-radius, 14px);
  overflow: hidden;
  text-decoration: none;
  color: var(--gma-ink, #1C1A19);
  transition: box-shadow .18s, transform .18s;
}
.gma-prog-pg-card:hover {
  box-shadow: var(--gma-shadow-lg);
  transform: translateY(-4px);
  text-decoration: none;
}
.gma-prog-pg-card__img {
  height: 160px;
  overflow: hidden;
  background: var(--gma-primary-tint, #EAF1F6);
}
.gma-prog-pg-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.gma-prog-pg-card:hover .gma-prog-pg-card__img img {
  transform: scale(1.04);
}
.gma-prog-pg-card__body {
  padding: 1.1rem 1.25rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  flex: 1;
}
.gma-prog-pg-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gma-primary, #154D79);
  margin: 0;
  line-height: 1.3;
}
.gma-prog-pg-card__desc {
  font-size: .875rem;
  color: var(--gma-text-muted, #6B6354);
  margin: 0;
  line-height: 1.5;
}
.gma-prog-pg-card__cta {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  color: var(--gma-primary, #154D79);
  margin-top: auto;
  padding-top: .5rem;
}
@media (max-width: 480px) {
  .gma-prog-pg-grid { grid-template-columns: 1fr; }
}

/* ── /about page — compact 2-screen layout ─────────────────────────── */
.gma-about-page { font-size: .925rem; line-height: 1.65; }

/* Compact hero: short dark banner + inline photo side by side */
.gma-about-hero {
  background: var(--gma-dark);
  color: #fff;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  min-height: 200px;
  max-height: 280px;
  overflow: hidden;
  align-items: center;
}
.gma-about-hero__text {
  padding: 1.75rem 2rem 1.75rem 1.5rem;
}
.gma-about-hero__eyebrow {
  display: inline-block;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.3);
  padding: .18rem .65rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  margin-bottom: .6rem;
}
.gma-about-hero__text .gma-about-hero__title,
.gma-about-hero__title {
  font-size: clamp(1.3rem, 2.2vw, 1.9rem);
  font-weight: 800;
  margin: 0 0 .5rem;
  line-height: 1.2;
  color: #fff;
}
.gma-about-hero__text .gma-about-hero__sub,
.gma-about-hero__sub {
  font-size: .82rem;
  opacity: .9;
  margin: 0;
  line-height: 1.5;
  color: #fff;
}
/* Force eyebrow + all hero text white regardless of global heading colors */
.gma-about-hero,
.gma-about-hero__text,
.gma-about-hero :where(h1, h2, p, span) {
  color: #fff;
}

/* 2-column body */
.gma-about-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 2.5rem;
  max-width: var(--gma-max-w);
  margin-inline: auto;
  padding: 1.75rem 1.25rem 2rem;
  align-items: start;
}
.gma-about-main h2 {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--gma-primary);
  margin: 1.25rem 0 .5rem;
  padding-bottom: .25rem;
  border-bottom: 2px solid var(--gma-primary-tint);
}
.gma-about-main h2:first-child { margin-top: 0; }
.gma-about-main p { margin: 0 0 .65rem; font-size: .9rem; }

/* Values: 3-column tight grid */
.gma-values-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .75rem;
  margin: .75rem 0 1rem;
}
.gma-value-card {
  background: var(--gma-primary-tint);
  border-radius: 8px;
  padding: .75rem .9rem;
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.gma-value-card__te {
  font-family: var(--gma-font-telugu, 'Noto Sans Telugu', sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--gma-primary);
}
.gma-value-card strong {
  font-size: .82rem;
  font-weight: 700;
  color: var(--gma-ink);
}
.gma-value-card p {
  font-size: .78rem;
  color: var(--gma-text-muted);
  margin: 0;
  line-height: 1.4;
}

/* Commitments list */
.gma-about-list {
  padding-left: 1.1rem;
  margin: .5rem 0 1rem;
}
.gma-about-list li {
  font-size: .88rem;
  margin-bottom: .4rem;
  line-height: 1.5;
}

/* Sidebar */
.gma-about-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: sticky;
  top: 80px;
}
.gma-about-stats,
.gma-about-presence,
.gma-about-links {
  background: var(--gma-bg);
  border: 1px solid var(--gma-border);
  border-radius: 10px;
  padding: 1rem 1.1rem;
}
.gma-about-stats h3,
.gma-about-presence h3,
.gma-about-links h3 {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--gma-text-muted);
  margin: 0 0 .75rem;
}
.gma-stat-row {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  padding: .35rem 0;
  border-bottom: 1px solid var(--gma-border);
}
.gma-stat-row:last-child { border-bottom: 0; }
.gma-stat-row__n {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--gma-primary);
  min-width: 52px;
}
.gma-stat-row span:last-child {
  font-size: .82rem;
  color: var(--gma-text-muted);
}
.gma-about-presence p { font-size: .85rem; margin: 0; line-height: 1.6; }
.gma-about-links { display: flex; flex-direction: column; gap: .4rem; }
.gma-about-links a:not(.gma-btn) {
  font-size: .85rem;
  color: var(--gma-primary);
  text-decoration: none;
  padding: .2rem 0;
}
.gma-about-links a:not(.gma-btn):hover { text-decoration: underline; }

/* Mobile */
@media (max-width: 860px) {
  .gma-about-hero { grid-template-columns: 1fr; max-height: unset; }
  .gma-about-hero img { display: none; }
  .gma-about-body { grid-template-columns: 1fr; }
  .gma-about-sidebar { position: static; }
  .gma-values-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .gma-values-grid { grid-template-columns: 1fr; }
}

/* ── Members Hub: News Feed ────────────────────────────────────────── */
.gma-news-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0 0 1.5rem;
}
.gma-news-chip {
  border: 1.5px solid var(--gma-border);
  background: var(--gma-surface);
  color: var(--gma-text-muted);
  border-radius: 999px;
  padding: .35rem 1rem;
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .12s;
}
.gma-news-chip:hover { border-color: var(--gma-primary); color: var(--gma-primary); }
.gma-news-chip.is-active { background: var(--gma-primary); border-color: var(--gma-primary); color: #fff; }

.gma-news-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.25rem;
}
.gma-news-item {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  background: var(--gma-surface);
  border: 1px solid var(--gma-border);
  border-left: 3px solid var(--gma-primary);
  border-radius: 8px;
  padding: 1rem 1.15rem;
  text-decoration: none;
  color: var(--gma-ink);
  transition: box-shadow .18s, transform .18s;
}
.gma-news-item:hover { box-shadow: var(--gma-shadow); transform: translateY(-2px); text-decoration: none; }
.gma-news-item__meta { display: flex; gap: .5rem; align-items: center; font-size: .72rem; }
.gma-news-item__cat {
  background: var(--gma-primary-tint); color: var(--gma-primary);
  font-weight: 700; padding: .12rem .5rem; border-radius: 4px; text-transform: uppercase; letter-spacing: .04em;
}
.gma-news-item__src { color: var(--gma-text-muted); }
.gma-news-item__title { font-size: .95rem; font-weight: 700; color: var(--gma-ink); margin: 0; line-height: 1.35; }
.gma-news-item__desc { font-size: .82rem; color: var(--gma-text-muted); margin: 0; line-height: 1.45; }
.gma-news-item__date { font-size: .72rem; color: var(--gma-text-muted); margin-top: auto; padding-top: .3rem; }
.gma-news-disclaimer { font-size: .78rem; color: var(--gma-text-muted); margin-top: 2rem; font-style: italic; }
.gma-news-empty { color: var(--gma-text-muted); padding: 2rem; text-align: center; }

/* ── Members Hub: Jobs search ──────────────────────────────────────── */
.gma-jobs-search { margin: 1rem 0 1.5rem; }
.gma-jobs-search__input {
  width: 100%;
  padding: .75rem 1rem;
  border: 1.5px solid var(--gma-border);
  border-radius: 8px;
  font-size: .95rem;
  font-family: var(--gma-font-sans, inherit);
}
.gma-jobs-search__input:focus { outline: 2px solid var(--gma-primary); border-color: var(--gma-primary); }
.gma-jobs-list { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 1rem; }
.gma-job-row {
  background: var(--gma-surface);
  border: 1px solid var(--gma-border);
  border-radius: 8px;
  padding: 1rem 1.15rem;
}
.gma-job-row__title { font-weight: 700; color: var(--gma-primary); margin: 0 0 .2rem; }
.gma-job-row__meta { font-size: .82rem; color: var(--gma-text-muted); }
