/* FZSAA homepage — restrained, content-led layout for ColorMag */
#fzsaa-home,
#fzsaa-home * { box-sizing: border-box; }

.fzsaa-home {
  --fzsaa-site-width: 1440px;
  --fzsaa-content-width: 1180px;
  --ink: #1e2824;
  --muted: #68736e;
  --line: #e4e8e5;
  --paper: #ffffff;
  --wash: #f5f7f5;
  --green: #13436e;
  --green-dark: #13436e;
  max-width: var(--fzsaa-site-width);
  margin: 0 auto;
  padding: 26px 22px 44px;
  background: transparent;
  color: var(--ink);
  font-family: inherit;
}


/* Typography intentionally inherits ColorMag's font stack.
   This lets any Bengali text use the Bengali font already embedded by the theme. */
.fzsaa-home :lang(bn),
.fzsaa-home [lang="bn"] { font-family: inherit; }

.fzsaa-home a { text-decoration: none; }
.fzsaa-home img { display: block; max-width: 100%; }
.fzsaa-wrap { width: min(100%, var(--fzsaa-content-width)); margin: 0 auto; }

/* Shared boxed sections */
.fzsaa-section { padding: 18px 0; background: transparent; }
.fzsaa-section > .fzsaa-wrap,
.fzsaa-stats > .fzsaa-wrap,
.fzsaa-cta > .fzsaa-wrap {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 42px;
}
.fzsaa-section.soft,
.fzsaa-section.dark { background: transparent; color: inherit; }
.fzsaa-section.dark .section-head.light h2,
.fzsaa-section.dark .section-head.light a,
.fzsaa-section.dark .kicker { color: inherit; }

/* Hero: one calm image-led block rather than a full-width banner */
.fzsaa-hero { padding: 0 0 18px; background: transparent !important; }
.fzsaa-hero .hero-inner {
  min-height: 440px;
  border-radius: 10px;
  overflow: hidden;
  padding: 58px;
  display: flex;
  align-items: center;
  background-color: var(--green-dark);
  background-size: cover;
  background-position: center;
}
.hero-copy { max-width: 720px; color: #fff; }
.eyebrow,
.kicker {
  margin-bottom: 12px;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #557066;
}
.hero-copy .eyebrow { color: rgba(255,255,255,.78); }
.hero-copy h1 {
  max-width: 760px;
  margin: 0 0 18px;
  font-family: inherit;
  font-size: clamp(36px, 4.4vw, 58px);
  line-height: 1.03;
  font-weight: 500;
  letter-spacing: -.025em;
  color: #fff;
}
.hero-copy p { max-width: 650px; margin: 0; font-size: 17px; line-height: 1.75; color: rgba(255,255,255,.88); }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.hero-mark { margin-left: auto; color: rgba(255,255,255,.82); text-align: center; }
.hero-mark span { display: block; font-family: inherit; font-size: 54px; }
.hero-mark small { font-size: 12px; letter-spacing: .18em; }

.fzsaa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 17px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  transition: opacity .15s ease, background .15s ease;
}
.fzsaa-btn:hover { opacity: .9; }
.fzsaa-btn.primary { background: #fff; color: var(--green-dark); }
.fzsaa-btn.ghost { border: 1px solid rgba(255,255,255,.55); color: #fff; }
.fzsaa-btn.text { padding: 0; min-height: auto; border-radius: 0; color: var(--green); background: transparent; }

/* Stats */
.fzsaa-stats { padding: 0 0 18px; }
.fzsaa-stats > .fzsaa-wrap { padding-top: 28px; padding-bottom: 28px; }
.stats-heading { margin-bottom: 18px; font-size: 13px; font-weight: 600; color: var(--muted); }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.stat { padding: 2px 24px; border-left: 1px solid var(--line); }
.stat:first-child { border-left: 0; padding-left: 0; }
.stat strong { display: block; font-family: inherit; font-size: 30px; line-height: 1.1; font-weight: 500; color: var(--green-dark); }
.stat span { display: block; margin-top: 6px; font-size: 13px; color: var(--muted); }

/* Typography and content */
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.section-head h2,
.section-copy h2,
.cta-copy h2 {
  margin: 0;
  font-family: inherit;
  font-size: clamp(25px,2.7vw,34px);
  line-height: 1.12;
  font-weight: 500;
  letter-spacing: -.015em;
  color: var(--ink);
}
.section-head > a { flex: 0 0 auto; font-size: 13px; font-weight: 600; color: var(--green); }
.split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: center; }
.section-media img,
.media-placeholder { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 7px; background: #e9eeeb; }
.media-placeholder { display: grid; place-items: center; padding: 20px; color: var(--muted); }
.section-copy p { margin: 18px 0 22px; font-size: 16px; line-height: 1.8; color: #4e5b55; }
.section-copy p p { margin: 0 0 12px; }

/* Notice list: deliberately plain */
.notice-list { border-top: 1px solid var(--line); }
.notice-row { display: grid; grid-template-columns: 110px 1fr auto; gap: 20px; align-items: center; padding: 15px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.notice-row time { font-size: 12px; color: var(--muted); }
.notice-row strong { font-size: 15px; font-weight: 600; }
.notice-row span { color: #88938e; }

/* Activities: no faux-icon/AI-looking badges */
.activity-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-top: 1px solid var(--line); }
.activity { padding: 24px 24px 8px 0; }
.activity + .activity { padding-left: 24px; border-left: 1px solid var(--line); }
.activity > span { display: none; }
.activity h3 { margin: 0 0 9px; font-size: 16px; font-weight: 650; color: var(--ink); }
.activity p { margin: 0; font-size: 14px; line-height: 1.65; color: var(--muted); }

/* Posts */
.card-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.event-card,
.news-card { background: transparent; border: 0; border-radius: 0; overflow: visible; }
.event-card a,
.news-card a { display: block; color: inherit; }
.event-card img,
.news-card img,
.thumb-placeholder { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: 7px; background: #e8ece9; }
.card-body { padding: 14px 0 0; }
.card-body time { display: block; margin-bottom: 7px; font-size: 11px; color: var(--muted); }
.card-body h3 { margin: 0; font-size: 18px; line-height: 1.4; font-weight: 650; color: var(--ink); }
.event-card .card-body span { display: inline-block; margin-top: 10px; font-size: 12px; color: var(--green); }
.news-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 24px; }
.news-card.featured { grid-row: span 2; }
.news-card.featured h3 { font-family: inherit; font-size: 24px; font-weight: 600; }
.news-card.featured p { margin: 10px 0 0; font-size: 14px; line-height: 1.65; color: var(--muted); }

/* Leadership */
.leader-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.leader img,
.leader-placeholder { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 7px; background: #edf0ee; }
.leader-placeholder { display: grid; place-items: center; font-family: inherit; font-size: 42px; color: #97a19c; }
.leader h3 { margin: 13px 0 3px; font-size: 16px; font-weight: 650; }
.leader p { margin: 0; font-size: 13px; color: var(--muted); }

/* Gallery */
.gallery-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 10px; }
.gallery-grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 6px; }
.gallery-grid img:first-child { grid-row: span 2; height: 100%; }
.gallery-placeholder { grid-column: 1/-1; padding: 40px; border: 1px dashed #cfd6d2; border-radius: 7px; color: var(--muted); text-align: center; }

/* CTA stays boxed, not a dramatic banner */
.fzsaa-cta { padding: 18px 0 0; }
.fzsaa-cta > .fzsaa-wrap { padding-top: 38px; padding-bottom: 38px; }
.cta-copy { max-width: 840px; }
.cta-copy p { max-width: 720px; margin: 15px 0 23px; font-size: 15px; line-height: 1.75; color: var(--muted); }
.fzsaa-cta .fzsaa-btn.primary { background: var(--green); color: #fff; }
.fzsaa-cta .fzsaa-btn.ghost { margin-left: 8px; border-color: #ccd5d1; color: var(--green); }
.empty-state { padding: 16px 0; color: var(--muted); font-size: 14px; }
.empty-state.light { color: var(--muted); }

/* Optional compact spacing from page settings */
.fzsaa-home.is-compact { padding-top: 18px; }
.fzsaa-home.is-compact .fzsaa-section { padding: 12px 0; }
.fzsaa-home.is-compact .fzsaa-section > .fzsaa-wrap,
.fzsaa-home.is-compact .fzsaa-stats > .fzsaa-wrap,
.fzsaa-home.is-compact .fzsaa-cta > .fzsaa-wrap { padding-top: 32px; padding-bottom: 32px; }

@media (max-width: 980px) {
  .fzsaa-home { padding-left: 14px; padding-right: 14px; }
  .fzsaa-hero .hero-inner { min-height: 400px; padding: 42px; }
  .split { grid-template-columns: 1fr; gap: 28px; }
  .stats-grid { grid-template-columns: repeat(2,1fr); gap: 22px 0; }
  .stat:nth-child(3) { border-left: 0; padding-left: 0; }
  .activity-grid { grid-template-columns: repeat(2,1fr); }
  .activity:nth-child(3) { border-left: 0; padding-left: 0; }
  .card-grid,
  .leader-grid { grid-template-columns: repeat(2,1fr); }
  .news-grid { grid-template-columns: 1fr 1fr; }
  .news-card.featured { grid-column: 1/-1; grid-row: auto; }
}

@media (max-width: 680px) {
  .fzsaa-home { padding: 10px 10px 30px; }
  .fzsaa-hero .hero-inner { min-height: 360px; padding: 30px 24px; }
  .hero-copy h1 { font-size: 38px; }
  .hero-copy p { font-size: 15px; }
  .fzsaa-section { padding: 10px 0; }
  .fzsaa-section > .fzsaa-wrap,
  .fzsaa-stats > .fzsaa-wrap,
  .fzsaa-cta > .fzsaa-wrap { padding: 26px 22px; border-radius: 8px; }
  .section-head { align-items: start; }
  .section-head h2,
  .section-copy h2,
  .cta-copy h2 { font-size: 26px; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat { padding-left: 16px; }
  .activity-grid,
  .card-grid,
  .leader-grid,
  .news-grid,
  .gallery-grid { grid-template-columns: 1fr; }
  .activity + .activity { border-left: 0; border-top: 1px solid var(--line); padding-left: 0; }
  .gallery-grid img:first-child { grid-row: auto; height: auto; }
  .notice-row { grid-template-columns: 1fr auto; gap: 7px 12px; }
  .notice-row time { grid-column: 1/-1; }
}

/* Events + news share one calm 50/50 row. */
.fzsaa-updates .updates-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 44px;
}
.fzsaa-updates .updates-grid.single { grid-template-columns: 1fr; }
.updates-column + .updates-column { border-left: 1px solid var(--line); padding-left: 44px; }
.compact-head { align-items: center; margin-bottom: 18px; }
.compact-head .kicker { margin-bottom: 7px; }
.compact-head h2 { font-size: clamp(22px,2vw,28px); }
.updates-list { border-top: 1px solid var(--line); }
.update-card { border-bottom: 1px solid var(--line); }
.update-card > a { display: grid; grid-template-columns: 126px minmax(0,1fr); gap: 16px; align-items: center; padding: 15px 0; color: inherit; }
.update-thumb img,
.update-thumb .thumb-placeholder { width: 126px; height: 82px; aspect-ratio: auto; border-radius: 5px; object-fit: cover; }
.update-copy time { display: block; margin-bottom: 5px; font-size: 11px; color: var(--muted); }
.update-copy h3 { margin: 0; font-size: 15px; line-height: 1.42; font-weight: 650; color: var(--ink); }

/* Five people in one restrained leadership row. */
.leader-grid { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; }
.leader img,
.leader-placeholder { aspect-ratio: 4/5; }

/* Smaller memory thumbnails with a simple built-in lightbox. */
.gallery-grid { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.gallery-item { display: block; overflow: hidden; border-radius: 6px; background: #edf0ee; }
.gallery-grid .gallery-item img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 0; transition: opacity .15s ease; }
.gallery-item:hover img { opacity: .9; }
.fzsaa-lightbox { position: fixed; inset: 0; z-index: 999999; display: none; align-items: center; justify-content: center; padding: 34px; background: rgba(8,18,27,.88); }
.fzsaa-lightbox.is-open { display: flex; }
.fzsaa-lightbox img { max-width: min(1100px,92vw); max-height: 88vh; width: auto; height: auto; object-fit: contain; border-radius: 4px; box-shadow: 0 18px 60px rgba(0,0,0,.28); }
.fzsaa-lightbox-close { position: absolute; top: 18px; right: 22px; width: 42px; height: 42px; border: 0; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; font: inherit; font-size: 28px; line-height: 1; cursor: pointer; }
body.fzsaa-lightbox-open { overflow: hidden; }

@media (max-width: 980px) {
  .fzsaa-updates .updates-grid { grid-template-columns: 1fr; gap: 34px; }
  .updates-column + .updates-column { border-left: 0; border-top: 1px solid var(--line); padding-left: 0; padding-top: 34px; }
  .leader-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .gallery-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .update-card > a { grid-template-columns: 96px minmax(0,1fr); gap: 12px; }
  .update-thumb img,
  .update-thumb .thumb-placeholder { width: 96px; height: 68px; }
  .leader-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fzsaa-lightbox { padding: 18px; }
}
