/* ============================================================
   Shared across all pages: blog-style news cards, the full-post
   reading page, and the breaking-news popup.
   ============================================================ */

/* ---------- Sticky footer ----------
   On pages with little content (About, Facilities, Contact, etc.),
   the footer would otherwise end where the content ends, leaving
   blank space below it instead of sitting at the bottom of the
   screen. This pins it to the bottom on short pages while still
   pushing down normally on long ones. */
html, body{ height:100%; }
body{ display:flex; flex-direction:column; min-height:100vh; }
body > footer{ margin-top:auto; }

/* ---------- Footer social media links ---------- */
.social-links{
  display:flex;
  gap:10px;
  margin-top:14px;
}
.social-links a{
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(246,242,233,.08);
  border:1px solid rgba(246,242,233,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(246,242,233,.85);
  transition:background .15s ease, color .15s ease, transform .15s ease;
}
.social-links a:hover, .social-links a:focus-visible{
  background:var(--gold, #b8945f);
  color:var(--navy-deep, #12172F);
  transform:translateY(-2px);
}
.social-links svg{
  width:17px;
  height:17px;
}

/* ---------- Loading spinner (news feed, article page) ---------- */
.spinner{
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  border:3px solid rgba(27,35,80,.12);
  border-top-color:var(--navy, #1b2350);
  animation:spin .8s linear infinite;
}
.spinner.sm{ width:18px; height:18px; border-width:2px; }
@keyframes spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .spinner{ animation-duration:1.8s; } }

.news-loading{
  grid-column:1/-1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; padding:60px 20px; color:#7a7a8a; font-size:14px;
}

/* ---------- Blog-style news cards (news.html) ---------- */
.news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:20px;
  margin-top:24px;
}
.news-empty{
  grid-column:1/-1;
  text-align:center;
  padding:50px 20px;
  color:#7a7a8a;
  font-size:14.5px;
  border:1px dashed rgba(27,35,80,.18);
  border-radius:var(--radius-lg, 14px);
}
.news-empty svg{ margin:0 auto 14px; opacity:0.35; }
.news-card{
  background:var(--white, #fff);
  border:1px solid rgba(27,35,80,.1);
  border-radius:var(--radius-lg, 14px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:inherit;
  transition:transform .15s ease, box-shadow .15s ease;
}
.news-card:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 24px rgba(27,35,80,.12);
}
.news-card .news-card-img{
  width:100%;
  height:160px;
  background:var(--blue-light, #F1E7D3) linear-gradient(135deg, rgba(27,35,80,.08), rgba(184,148,95,.12));
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--navy, #1b2350);
  overflow:hidden;
}
.news-card .news-card-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.news-card .news-card-body{
  padding:16px 18px 20px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1;
}
.news-card .news-card-date{
  font-size:12px;
  color:var(--gold, #b8945f);
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.news-card .news-card-badge{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  color:#7A2E3D;
  background:rgba(179,71,71,.1);
  border-radius:999px;
  padding:2px 10px;
  width:fit-content;
  margin-bottom:2px;
}
.news-card h4{
  font-size:16.5px;
  color:var(--navy, #1b2350);
  line-height:1.3;
}
.news-card p{
  font-size:13.5px;
  color:#5c6580;
  line-height:1.5;
  flex:1;
}
.news-card .read-more{
  margin-top:6px;
  font-size:13px;
  font-weight:700;
  color:var(--navy, #1b2350);
}
.news-card:hover .read-more{ color:var(--gold, #b8945f); }

/* ---------- Full article / blog post page (post.html) ---------- */
.post-hero{
  width:100%;
  max-height:420px;
  overflow:hidden;
  background:var(--blue-light, #F1E7D3);
}
.post-hero img{
  width:100%;
  max-height:420px;
  object-fit:cover;
  display:block;
}
.post-wrap{
  max-width:760px;
  margin:0 auto;
  padding:44px 20px 90px;
}
.post-back{
  font-size:13px;
  color:var(--navy, #1b2350);
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:22px;
}
.post-badge{
  display:inline-block;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  padding:3px 12px;
  border-radius:999px;
  margin-bottom:14px;
}
.post-badge.primary{ background:rgba(27,35,80,.1); color:var(--navy, #1b2350); }
.post-badge.secondary{ background:rgba(184,148,95,.18); color:#7a5c2e; }
.post-badge.group{ background:rgba(122,46,61,.1); color:#7A2E3D; }
.post-date{ font-size:13px; color:#7a7a8a; margin-bottom:10px; }
.post-title{ font-size:clamp(24px,4vw,34px); color:var(--navy, #1b2350); line-height:1.25; margin-bottom:18px; font-family:'Fraunces', serif; }
.post-body{ font-size:16px; line-height:1.75; color:#3a3a44; white-space:pre-line; }
.post-loading, .post-error{ text-align:center; padding:80px 20px; color:#7a7a8a; }
.post-loading{ display:flex; flex-direction:column; align-items:center; gap:16px; }
.post-error a{ color:var(--navy, #1b2350); font-weight:700; }

/* ---------- Breaking-news popup ---------- */
.bn-overlay{
  position:fixed; inset:0; background:rgba(15,18,40,.6);
  display:none; align-items:center; justify-content:center;
  z-index:9999; padding:20px;
}
.bn-overlay.open{ display:flex; }
.bn-modal{
  background:#fff; border-radius:16px; max-width:440px; width:100%;
  overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.35);
  position:relative; animation:bnIn .2s ease;
}
@keyframes bnIn{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:translateY(0);} }
.bn-modal .bn-close{
  position:absolute; top:10px; right:10px; width:30px; height:30px; border-radius:50%;
  background:rgba(0,0,0,.35); color:#fff; border:none; cursor:pointer; font-size:16px;
  display:flex; align-items:center; justify-content:center; z-index:2;
}
.bn-modal .bn-img{ width:100%; height:170px; object-fit:cover; display:block; background:var(--blue-light,#F1E7D3); }
.bn-modal .bn-body{ padding:20px 22px 24px; }
.bn-modal .bn-eyebrow{
  font-size:11.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase;
  color:#7A2E3D; margin-bottom:8px;
}
.bn-modal h3{ font-size:19px; color:var(--navy,#1b2350); margin-bottom:8px; line-height:1.3; }
.bn-modal p{ font-size:14px; color:#4a4a55; line-height:1.55; margin-bottom:18px; }
.bn-modal .bn-actions{ display:flex; gap:10px; }
.bn-modal .bn-actions a, .bn-modal .bn-actions button{
  font-size:13.5px; font-weight:700; padding:10px 16px; border-radius:999px; cursor:pointer; border:none;
  text-decoration:none; display:inline-flex; align-items:center;
}
.bn-modal .bn-read{ background:var(--navy,#1b2350); color:#f6f2e9; }
.bn-modal .bn-dismiss{ background:none; color:#5c6580; border:1px solid rgba(27,35,80,.2) !important; }