/* ── Top bar ──────────────────────────────────────────── */
.top-bar-logo {
  display: flex; align-items: center; gap: .75rem; text-decoration: none;
}
.top-bar-logo-img-wrap {
  height: 68px; flex-shrink: 0;
  display: flex; align-items: center;
}
.top-bar-logo-img-wrap img {
  height: 68px; width: auto; max-width: 350px;
  display: block; object-fit: contain;
}
.top-bar-contact {
  display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap;
}
.top-bar-contact .social-grp {
  display: flex; align-items: center; gap: .7rem;
}
.top-bar-contact .social-grp a {
  font-size: 1.1rem; transition: transform .2s, opacity .2s;
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.top-bar-contact .social-grp a:hover { transform: scale(1.15); opacity: .85; }
.social-fb  { background:#1877F2; color:#fff !important; }
.social-ig  { background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285AEB 90%); color:#fff !important; }
.social-yt  { background:#FF0000; color:#fff !important; }
.social-wa  { background:#25D366; color:#fff !important; }
.top-bar-contact .sep { opacity: .3; color: var(--text); }
.reg-pill {
  display: inline-block;
  background: var(--secondary); color: var(--primary-dark);
  font-size: .7rem; font-weight: 800; letter-spacing: .06em;
  padding: .28rem .85rem; border-radius: 30px; white-space: nowrap;
}
.top-bar-phone {
  color: var(--text); font-size: .78rem; font-weight: 600; white-space: nowrap;
}
.top-bar-phone i { color: var(--primary); margin-right: .3rem; }

/* ── Navbar menus-only bar ────────────────────────────── */
.navbar-menus-only {
  background: var(--primary);
  box-shadow: 0 3px 14px rgba(14,35,72,.35);
  position: relative; z-index: 200;
}
.navbar-menus-only .nav-link {
  color: rgba(255,255,255,.88) !important;
}
.navbar-menus-only .nav-item:hover > .nav-link,
.navbar-menus-only .nav-link:hover {
  color: var(--secondary) !important;
}
.navbar-menus-only .nav-link.active { color: var(--secondary) !important; }
.navbar-menus-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 1.5rem;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 58px;
}
/* "More" overflow dropdown */
.nav-more-item > .nav-link {
  background: rgba(255,255,255,.12);
  border-radius: var(--radius-full, 20px);
  padding: .38rem .9rem !important;
}
.nav-more-item:hover > .nav-link,
.nav-more-item > .nav-link:hover {
  background: rgba(255,255,255,.22) !important;
  color: #fff !important;
}
.dropdown-more {
  right: 0;
  left: auto;
  min-width: 220px;
  max-height: 70vh;
  overflow-y: auto;
  background: #1e3a8a !important;
}
.dropdown-more a {
  color: rgba(255,255,255,.88) !important;
}
.dropdown-more a.more-child {
  font-size: .8rem;
  color: rgba(255,255,255,.65) !important;
  padding: .45rem .9rem;
}
.dropdown-more a.more-child:hover {
  color: #fff !important;
  background: rgba(255,255,255,.1);
  padding-left: 1.2rem;
}

.all-menus-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--primary); color: #fff;
  font-size: .78rem; font-weight: 700; letter-spacing: .03em;
  padding: .52rem 1.1rem; border-radius: var(--radius-full);
  border: none; cursor: pointer; transition: var(--transition);
  white-space: nowrap; flex-shrink: 0; margin-left: 1rem;
}
.all-menus-btn:hover { background: var(--primary-dark); }

/* ── All Menus overlay ────────────────────────────────── */
.all-menus-overlay {
  display: none;
  position: fixed; inset: 0; z-index: 9000;
  background: #060f22;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 40px 40px;
  overflow-y: auto; padding: 2.5rem 2rem 4rem;
}
.all-menus-overlay.open { display: block; }

.all-menus-overlay-head {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 1200px; margin: 0 auto 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.all-menus-overlay-head h3 {
  color: #fff; font-size: 1.3rem; margin: 0;
  display: flex; align-items: center; gap: .7rem;
}
.all-menus-overlay-head h3::before {
  content: '';
  display: inline-block; width: 4px; height: 22px;
  background: var(--secondary); border-radius: 4px;
}

.all-menus-close-btn {
  background: rgba(255,255,255,.08); border: 1.5px solid rgba(255,255,255,.2);
  color: #fff; width: 40px; height: 40px; border-radius: 50%;
  font-size: 1.2rem; cursor: pointer; display: flex; align-items: center;
  justify-content: center; transition: .2s; flex-shrink: 0;
}
.all-menus-close-btn:hover { background: var(--secondary); color: #0a1f3f; border-color: var(--secondary); }

.all-menus-grid {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1.25rem;
}

.all-menus-col {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 1.1rem 1rem 1.2rem;
  transition: background .2s, transform .2s;
}
.all-menus-col:hover { background: rgba(255,255,255,.07); transform: translateY(-2px); }

/* Per-column accent colors — same palette as dropdowns */
.all-menus-col:nth-child(10n+1)  { border-top: 3px solid #2563EB; }
.all-menus-col:nth-child(10n+2)  { border-top: 3px solid #16A34A; }
.all-menus-col:nth-child(10n+3)  { border-top: 3px solid #9333EA; }
.all-menus-col:nth-child(10n+4)  { border-top: 3px solid #EA580C; }
.all-menus-col:nth-child(10n+5)  { border-top: 3px solid #DC2626; }
.all-menus-col:nth-child(10n+6)  { border-top: 3px solid #0891B2; }
.all-menus-col:nth-child(10n+7)  { border-top: 3px solid #D97706; }
.all-menus-col:nth-child(10n+8)  { border-top: 3px solid #065F46; }
.all-menus-col:nth-child(10n+9)  { border-top: 3px solid #7C3AED; }
.all-menus-col:nth-child(10n+10) { border-top: 3px solid #BE185D; }

/* Per-column heading color matches the accent */
.all-menus-col:nth-child(10n+1)  h4 { color: #60a5fa; }
.all-menus-col:nth-child(10n+2)  h4 { color: #4ade80; }
.all-menus-col:nth-child(10n+3)  h4 { color: #c084fc; }
.all-menus-col:nth-child(10n+4)  h4 { color: #fb923c; }
.all-menus-col:nth-child(10n+5)  h4 { color: #f87171; }
.all-menus-col:nth-child(10n+6)  h4 { color: #22d3ee; }
.all-menus-col:nth-child(10n+7)  h4 { color: #fbbf24; }
.all-menus-col:nth-child(10n+8)  h4 { color: #34d399; }
.all-menus-col:nth-child(10n+9)  h4 { color: #a78bfa; }
.all-menus-col:nth-child(10n+10) h4 { color: #f472b6; }

.all-menus-col h4 {
  font-size: .75rem; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
  margin: 0 0 .8rem; padding-bottom: .55rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.all-menus-col a {
  display: flex; align-items: center; gap: .45rem;
  color: rgba(255,255,255,.72); font-size: .83rem;
  padding: .32rem .5rem; border-radius: 5px;
  text-decoration: none; transition: .18s;
  border-left: 2px solid transparent;
}
.all-menus-col a::before {
  content: '›'; font-size: .9rem; opacity: .5; flex-shrink: 0;
}
.all-menus-col a:hover {
  color: #fff;
  background: rgba(255,255,255,.07);
  padding-left: .85rem;
  border-left-color: currentColor;
}
.all-menus-col > a { color: rgba(255,255,255,.88); font-weight: 600; }

@media (max-width:680px) {
  .top-bar-contact { gap: .65rem; }
  .reg-pill { display: none; }
}
@media (max-width:540px) {
  .all-menus-grid { grid-template-columns: 1fr 1fr; gap: .75rem; }
}

/* ══════════════════════════════════════════════════════
   PAGE BANNER
══════════════════════════════════════════════════════ */
.pg-banner {
  position: relative;
  min-height: 420px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--primary-dark);
}
.pg-banner-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  transform: scale(1);
  transition: transform 8s ease;
}
.pg-banner:hover .pg-banner-bg { transform: scale(1.04); }
.pg-banner-overlay {
  position: absolute;
  inset: 0;
  /* background: linear-gradient(
    to bottom,
    rgba(10,26,58,.20) 0%,
    rgba(10,26,58,.45) 60%,
    rgba(10,26,58,.65) 100%
  ); */
  background: linear-gradient(
    to bottom, 
    rgb(118 126 137 / 22%) 0%, 
    rgb(50 53 56 / 35%) 60%, 
    rgb(10 26 58 / 0%) 100%
  );
}
/* Decorative grid pattern over overlay */
.pg-banner-overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 40px 40px;
}
/* Gold accent bar on the left */
.pg-banner::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 5px;
  background: linear-gradient(to bottom, var(--secondary-light), var(--secondary));
  z-index: 3;
}
/* Wave cut at the bottom */
.pg-banner-wave {
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 56px;
  z-index: 3;
}
.pg-banner-wave svg { display: block; width: 100%; height: 100%; }
.pg-banner-inner {
  position: relative;
  z-index: 4;
  max-width: 1200px;
  margin: 0 auto;
  padding: 3.5rem 1.5rem 5rem;
  width: 100%;
}
/* Breadcrumb */
.pg-breadcrumb {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: 1.5rem;
  font-weight: 500;
  color: rgba(255,255,255,.55);
  margin-bottom: 1.1rem;
  flex-wrap: wrap;
}
.pg-breadcrumb a {
  color: rgba(255,255,255,.6);
  transition: color .2s;
}
.pg-breadcrumb a:hover { color: var(--secondary); }
.pg-breadcrumb i { font-size: .55rem; color: rgba(255,255,255,.35); }
.pg-breadcrumb .pg-bc-current { color: var(--white); }
/* Title */
.pg-banner-title {
  color: #fff;
  font-size: clamp(1.2rem, 2.4vw, 1.9rem);
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 .9rem;
  text-shadow: 0 2px 20px rgba(0,0,0,.35);
  max-width: 750px;
}
/* Gold underline accent */
.pg-banner-underline {
  display: flex;
  align-items: center;
  gap: .6rem;
}
.pg-banner-underline span {
  display: block;
  height: 3px;
  border-radius: 2px;
  background: var(--secondary);
}
.pg-banner-underline span:first-child { width: 48px; }
.pg-banner-underline span:last-child  { width: 14px; opacity: .5; }

/* ══════════════════════════════════════════════════════
   PAGE BODY LAYOUT
══════════════════════════════════════════════════════ */
.pg-section {
  background: #f5f7fb;
  padding: 0 0 5rem;
}
.pg-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  /* display: grid;
  grid-template-columns: 1fr 288px;
  gap: 2.5rem; */
  align-items: start;
}
/* Main content card */
.pg-card {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: 2.5rem 2.75rem;
  position: relative;
}
/* Sidebar */
.pg-sidebar {
  margin-top: -2.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.pg-sb-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.pg-sb-head {
  background: var(--primary);
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .7rem 1.1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.pg-sb-head i { color: var(--secondary); font-size: .8rem; }
.pg-sb-body { padding: 1rem 1.1rem; }
/* Contact items in sidebar */
.pg-sb-contact-item {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  padding: .55rem 0;
  border-bottom: 1px solid var(--border);
  font-size: .82rem;
  color: var(--text-light);
}
.pg-sb-contact-item:last-child { border-bottom: none; }
.pg-sb-contact-item i {
  color: var(--primary);
  width: 14px;
  flex-shrink: 0;
  margin-top: .15rem;
}
.pg-sb-contact-item a { color: var(--primary); font-weight: 500; }
.pg-sb-contact-item a:hover { color: var(--secondary); }
/* TOC / quick links in sidebar */
.pg-toc-link {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .42rem 0;
  font-size: .82rem;
  color: var(--text-light);
  border-bottom: 1px dashed var(--border);
  transition: color .2s, padding-left .2s;
}
.pg-toc-link:last-child { border-bottom: none; }
.pg-toc-link::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--secondary);
  flex-shrink: 0;
}
.pg-toc-link:hover { color: var(--primary); padding-left: .35rem; }
/* Print button */
.pg-print-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  padding: .6rem 1rem;
  background: var(--light);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .8rem;
  font-weight: 600;
  color: var(--text-light);
  cursor: pointer;
  transition: var(--transition);
  margin-top: .5rem;
}
.pg-print-btn:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ══════════════════════════════════════════════════════
   RICH CONTENT TYPOGRAPHY
══════════════════════════════════════════════════════ */
.pg-body-content {
  font-size: 1rem;
  line-height: 1.85;
  color: #374151;
}
.pg-body-content > * + * { margin-top: 1.1rem; }

.pg-body-content p {
  color: #4b5563;
  line-height: 1.85;
  margin: 0;
}
.pg-body-content h2 {
  font-size: clamp(1.25rem, 2.5vw, 1.6rem);
  color: var(--primary-dark);
  font-weight: 800;
  margin-top: 2.25rem;
  margin-bottom: .6rem;
  padding-bottom: .6rem;
  border-bottom: 2px solid #e5e9f4;
  position: relative;
}
.pg-body-content h2::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 52px; height: 2px;
  background: var(--secondary);
  border-radius: 2px;
}
.pg-body-content h3 {
  font-size: 1.15rem;
  color: var(--primary);
  font-weight: 700;
  margin-top: 1.75rem;
  margin-bottom: .5rem;
  padding-left: .9rem;
  border-left: 3px solid var(--secondary);
}
.pg-body-content h4 {
  font-size: 1rem;
  color: var(--primary);
  font-weight: 700;
  margin-top: 1.4rem;
  margin-bottom: .4rem;
}
.pg-body-content h5,
.pg-body-content h6 {
  font-size: .95rem;
  color: var(--text);
  font-weight: 600;
  margin-top: 1rem;
  margin-bottom: .35rem;
}

/* Lists */
.pg-body-content ul {
  list-style: none;
  padding: 0;
  margin: .5rem 0;
}
.pg-body-content ul li {
  position: relative;
  padding: .28rem 0 .28rem 1.4rem;
  color: #4b5563;
}
.pg-body-content ul li::before {
  content: '';
  position: absolute;
  left: 0; top: .82rem;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--secondary);
}
.pg-body-content ol {
  padding-left: 1.5rem;
  margin: .5rem 0;
}
.pg-body-content ol li {
  padding: .25rem 0;
  color: #4b5563;
}
.pg-body-content ol li::marker {
  color: var(--primary);
  font-weight: 700;
}

/* Tables */
.pg-body-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.75rem 0;
  font-size: .88rem;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--border), var(--shadow-sm);
}
.pg-body-content thead tr {
  background: var(--primary);
}
.pg-body-content thead th {
  padding: .75rem 1rem;
  color: #fff;
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .04em;
  text-align: left;
  border: none;
}
.pg-body-content tbody td {
  padding: .65rem 1rem;
  border-bottom: 1px solid #e2e8f0;
  vertical-align: top;
  color: #374151;
  background: #ffffff;
}
.pg-body-content tbody tr:nth-child(even) td {
  background: #eef4fb;
}
.pg-body-content tbody tr:hover td {
  background: #ddeeff !important;
  color: var(--primary-dark);
}
.pg-body-content tbody tr:last-child td {
  border-bottom: none;
}
/* Handle old-style colspan header rows */
.pg-body-content td[colspan], .pg-body-content th[colspan] {
  text-align: center;
}

/* Blockquote */
.pg-body-content blockquote {
  position: relative;
  background: linear-gradient(135deg, #f8fafd, #eef2f9);
  border-left: 4px solid var(--secondary);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 1.4rem 1.5rem 1.4rem 2.25rem;
  margin: 1.75rem 0;
  font-style: italic;
  color: var(--primary-dark);
}
.pg-body-content blockquote::before {
  content: '\201C';
  position: absolute;
  top: -.4rem; left: .85rem;
  font-size: 3.5rem;
  line-height: 1;
  color: var(--secondary);
  opacity: .4;
  font-family: Georgia, serif;
}

/* Images */
.pg-body-content img {
  max-width: 100%;
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  margin: 1.25rem auto;
  display: block;
}
/* Links */
.pg-body-content a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(26,58,107,.3);
}
.pg-body-content a:hover {
  color: var(--secondary-dark);
  text-decoration-color: var(--secondary);
}
.pg-body-content strong, .pg-body-content b { color: var(--primary-dark); font-weight: 700; }
.pg-body-content em, .pg-body-content i { color: inherit; }

/* Horizontal rule */
.pg-body-content hr {
  border: none;
  border-top: 2px solid var(--border);
  margin: 2rem 0;
}

/* Inline code */
.pg-body-content code {
  background: #f0f4ff;
  color: var(--primary);
  padding: .1em .4em;
  border-radius: 4px;
  font-size: .88em;
}

/* First paragraph lead styling */
.pg-body-content > p:first-of-type {
  font-size: 1.05rem;
  color: #374151;
}

/* Responsive table wrapper for old HTML tables */
.pg-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 1.75rem 0;
  border-radius: var(--radius);
  box-shadow: 0 0 0 1px var(--border), var(--shadow-sm);
}
.pg-table-scroll table { margin: 0 !important; box-shadow: none !important; }

/* ══════════════════════════════════════════════════════
   GALLERY GRID (unchanged)
══════════════════════════════════════════════════════ */
.page-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  padding: 2rem 1.5rem 5rem;
  max-width: 1200px;
  margin: 0 auto;
}
.pgg-item {
  border-radius: var(--radius); overflow: hidden;
  aspect-ratio: 4/3; cursor: pointer; position: relative;
}
.pgg-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.pgg-item:hover img { transform: scale(1.06); }
.pgg-overlay {
  position: absolute; inset: 0;
  background: rgba(12,35,64,.55);
  opacity: 0; transition: var(--transition);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .4rem;
}
.pgg-item:hover .pgg-overlay { opacity: 1; }
.pgg-eye { font-size: 1.5rem; color: #fff; text-shadow: 0 2px 8px rgba(0,0,0,.4); }
.pgg-overlay span { color: rgba(255,255,255,.85); font-size: .78rem; text-align: center; padding: 0 .5rem; line-height: 1.3; }

/* Gallery appended inline inside a content page card */
.pg-inline-gallery { margin-top: 2.5rem; border-top: 2px solid #e8f0fb; padding-top: 1.5rem; }
.pg-inline-gallery-title {
  font-size: 1.1rem; font-weight: 700; color: var(--primary-dark);
  margin-bottom: 1rem; display: flex; align-items: center; gap: .5rem;
}
.pg-inline-gallery-title i { color: var(--primary); }
.pg-inline-gallery .page-gallery-grid { padding: 0; max-width: none; margin: 0; }
/* ── Coming Soon — full-page styled ─────────────────────── */
.coming-soon-wrap {
  background: linear-gradient(160deg, var(--primary) 0%, var(--primary-light) 55%, #2d62b8 100%);
  min-height: 68vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.coming-soon-wrap::before {
  content: '';
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.cs-card {
  position: relative; z-index: 1;
  text-align: center; padding: 4rem 2rem 2.5rem;
  max-width: 680px; width: 100%;
}
.cs-badge {
  display: inline-flex; align-items: center; gap: .45rem;
  background: var(--secondary); color: var(--primary-dark);
  font-size: .68rem; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; padding: .32rem .95rem; border-radius: 30px;
  margin-bottom: 1.8rem; box-shadow: 0 4px 15px rgba(212,160,23,.4);
}
.cs-icon-ring {
  width: 96px; height: 96px; border-radius: 50%;
  background: rgba(255,255,255,.10); border: 2px solid rgba(255,255,255,.22);
  display: flex; align-items: center; justify-content: center;
  font-size: 2.4rem; color: var(--secondary);
  margin: 0 auto 1.8rem;
}
.cs-card h1 {
  color: #fff; font-size: clamp(1.75rem,4vw,2.8rem);
  font-weight: 800; line-height: 1.2; margin-bottom: .75rem;
}
.cs-divider { width: 55px; height: 3px; border-radius: 2px; background: var(--secondary); margin: 1rem auto 1.5rem; }
.cs-msg {
  color: rgba(255,255,255,.78); font-size: .97rem;
  line-height: 1.75; max-width: 520px; margin: 0 auto 2.25rem;
}
.cs-actions { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin-bottom: 2.5rem; }
.cs-contact-strip {
  width: 100%; background: rgba(0,0,0,.18);
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 1.2rem 2rem;
}
.cs-contact-inner {
  max-width: 700px; margin: 0 auto;
  display: flex; flex-wrap: wrap; gap: 1.25rem; justify-content: center;
  font-size: .8rem; color: rgba(255,255,255,.65);
}
.cs-contact-inner a { color: rgba(255,255,255,.8); }
.cs-contact-inner a:hover { color: var(--secondary); }
.cs-contact-inner i { color: var(--secondary); margin-right: .3rem; }
/* fallback for inline coming-soon used inside content pages */
.coming-soon {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  min-height: 28vh; text-align: center; padding: 3rem 1.5rem;
}
.coming-soon .icon { font-size: 3rem; color: var(--secondary); margin-bottom: 1rem; }
.coming-soon p { color: var(--text-light); max-width: 500px; }
/* ── 404 ──────────────────────────────────────────────── */
.not-found {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  min-height: 50vh; text-align: center;
  padding: 4rem 1.5rem;
}
.not-found .code { font-size: 6rem; font-weight: 900; color: var(--border); line-height: 1; }

/* ── Page layout responsive ──────────────────────────── */
@media (max-width:900px) {
  .pg-layout { grid-template-columns: 1fr; }
  .pg-sidebar {
    order: -1;
    margin-top: -2rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  .pg-print-btn { grid-column: 1 / -1; }
  #pgTocCard { display: none !important; }
}
@media (max-width:600px) {
  .pg-card { padding: 1.5rem 1.25rem; }
  .pg-sidebar { grid-template-columns: 1fr; }
  .pg-banner-inner { padding: 2.5rem 1rem 4rem; }
  .pg-body-content h2 { font-size: 1.2rem; }
  .pg-body-content h3 { font-size: 1.05rem; }
  .pg-body-content { font-size: .95rem; }
}
@media print {
  .site-header, .pg-sidebar, .pg-banner-wave, footer, .back-to-top { display: none !important; }
  .pg-layout { display: block; }
  .pg-card { box-shadow: none; padding: 0; margin-top: 0; }
  .pg-banner { min-height: 80px; }
  .pg-banner-overlay { background: var(--primary-dark) !important; }
}

.side-by-side {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.side-by-side > * {
    flex: 1 1 300px;
}

div:has(> img + img), p:has(> img + img), h3:has(> img + img) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

div:has(> img + img) > img, p:has(> img + img) > img {
    width: 100%;
    height: auto;
    display: block;
}

/* ═══════════════════════════════════════════════════════════
   Listing pages — Blog / News grid
   ═══════════════════════════════════════════════════════════ */
.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.news-card {
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  border: 1px solid #e8f0fb;
  transition: box-shadow .2s, transform .2s;
}
.news-card:hover {
  box-shadow: 0 8px 32px rgba(14,35,72,.13);
  transform: translateY(-4px);
}
.news-card-img {
  height: 185px;
  background: #e8f0f8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: #b0c8e0;
  overflow: hidden;
}
.news-card-img img { width: 100%; height: 100%; object-fit: cover; }
.news-card-body { padding: 1.3rem; }
.news-card-body .date { font-size: .72rem; color: #888; font-weight: 600; margin-bottom: .4rem; }
.news-card-body h4 { font-size: .95rem; margin: 0 0 .4rem; line-height: 1.4; color: var(--primary); }
.news-card-body p { font-size: .82rem; color: #666; margin: 0; line-height: 1.6; }
.news-card-body .read-more {
  display: inline-block;
  margin-top: .9rem;
  font-size: .8rem;
  font-weight: 700;
  color: var(--primary);
  text-decoration: none;
}
.news-card-body .read-more:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════
   Listing pages — Achievements grid
   ═══════════════════════════════════════════════════════════ */
.achievements-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
.achievement-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  border-top: 3px solid var(--secondary, #f0c040);
  transition: box-shadow .2s, transform .2s;
}
.achievement-card:hover {
  box-shadow: 0 8px 28px rgba(14,35,72,.12);
  transform: translateY(-3px);
}

/* ── Tablet: 2 columns ────────────────────────────────────── */
@media (max-width: 1024px) {
  .news-grid,
  .achievements-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Mobile: 1 column ─────────────────────────────────────── */
@media (max-width: 640px) {
  .news-grid,
  .achievements-grid { grid-template-columns: 1fr; }
}