:root{--blue:#0a3161;--gold:#c8a550;--ink:#111;}
html,body{margin:0;background:#fff;color:var(--ink);font:400 18px/1.6 ui-serif,Georgia,serif}
a{color:var(--gold)} a:hover{text-decoration:underline}
.site-header{background:var(--blue);color:#fff;display:flex;align-items:center;gap:16px;padding:12px 16px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.brand-logo{height:52px;width:auto}
.nav{margin-left:auto;display:flex;gap:18px} .nav a{color:#fff} .nav a:hover{color:var(--gold)}
@media(max-width:900px){.nav{display:none}}
.page .wrap{max-width:1120px;margin:0 auto;padding:28px 16px}
.hero .wrap{text-align:center;padding:40px 16px 28px}
.hero img{height:110px}
.hero h1{font-size:44px;margin:10px 0 6px}
.hero .tag{font-family:'Great Vibes',cursive;font-size:28px;color:var(--blue);margin:0}
.hero .divider{height:2px;width:160px;background:linear-gradient(to right,var(--gold),transparent);margin:14px auto 0;border-radius:2px}
.cards{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{grid-column:span 12;background:#fff;border:1px solid #ececec;border-radius:14px;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.card .card-body{padding:18px 18px 24px}
.card h2{font-size:26px;margin:10px 0 2px;font-weight:800}
.rule{height:2px;background:linear-gradient(to right,var(--gold),transparent);border:0;margin:8px 0 16px}
/* Unified gold buttons */
.btn{display:inline-block;background:var(--gold);color:#000;padding:12px 18px;border-radius:12px;border:2px solid #a88538;font-weight:700;text-decoration:none}
.btn:hover{background:#b8963c;color:#000;border-color:#8c6f2a}
.btn.alt{background:var(--gold);border-color:#a88538;color:#000}
/* Gallery grid */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery figure{margin:0;background:#fff;border-radius:12px;overflow:hidden;border:1px solid #eee;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.gallery img{width:100%;height:200px;object-fit:cover;display:block}
.gallery figcaption{padding:8px 10px;font-size:14px;color:#333;background:#fafafa}
/* Quote plaque */
blockquote.big{font-size:20px;margin:0;background:#fff;border-left:6px solid var(--gold);padding:16px;border-radius:12px;border:1px solid #eee;position:relative;overflow:hidden}
blockquote.big::after{content:'';position:absolute;right:-20px;bottom:-20px;width:160px;height:160px;background:url('/assets/img/logo-round-watermark.png') no-repeat center/contain;opacity:.2}
/* Footer */
.site-footer{background:#fff;color:#111;border-top:1px solid #eee;margin-top:28px}
.site-footer .wrap{max-width:1120px;margin:0 auto;display:flex;gap:24px;align-items:flex-start;padding:22px 16px}
.site-footer img{height:48px;width:auto;margin-right:8px}.footer-brand{display:flex;gap:10px;align-items:center}
.footer-meta{margin-left:auto;display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:16px}
.footer-meta a{color:var(--gold)}
@media(max-width:900px){.footer-meta{grid-template-columns:1fr 1fr}}
/* About */
.about-grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:start}  /* single column now */
.about-photo img{display:block;width:100%;height:340px;object-fit:cover;object-position:center 35%;border-radius:10px}
.about-photo figcaption{font-size:.95rem;color:#555;margin-top:8px}
.about-copy h2{margin:8px 0 10px} .about-copy h3{margin:22px 0 8px} .about-copy p, .about-copy ul{line-height:1.65} .about-copy ul{padding-left:18px}
.about-quote{margin:24px 0 0;font-weight:700;color:#0f2d5c}
/* Officers */
.officer-card{text-align:center;margin:20px auto;max-width:220px}
.officer-card img{width:100%;height:auto;border-radius:8px;margin-bottom:10px}
.officer-card h3, .officer-text h3{margin:6px 0 4px;font-size:1.1rem}
.officer-card p, .officer-text p{margin:0 0 16px;font-weight:500}
/* IG placeholder */
.instagram-feed{border:2px dashed #ccc;border-radius:6px;padding:40px;color:#666;font-style:italic;background:#f9f9f9;text-align:center}


/* --- Mobile Navigation (Hamburger) --- */
.nav-toggle { display:none; }
.nav-btn {
  display:none;
  margin-left:auto;
  background:transparent;
  border:0;
  width:40px; height:40px;
  position:relative;
}
.nav-btn span, .nav-btn::before, .nav-btn::after {
  content:''; display:block; height:2px; width:24px; background:#fff; position:absolute; left:8px; transition:.2s;
}
.nav-btn span { top:19px; }
.nav-btn::before { top:12px; }
.nav-btn::after { top:26px; }

/* The drawer */
.nav-drawer {
  display:none;
  position:absolute; left:0; right:0; top:64px;
  background:#0a3161; border-top:1px solid rgba(255,255,255,.15);
  padding:8px 0;
}
.nav-drawer a { display:block; padding:12px 16px; color:#fff; text-decoration:none; }
.nav-drawer a:hover { background:rgba(255,255,255,.08); color:#c8a550; }

/* Toggle behavior */
#menu-toggle:checked ~ .nav-drawer { display:block; }
#menu-toggle:checked ~ .nav-btn span { opacity:0; }
#menu-toggle:checked ~ .nav-btn::before { transform:rotate(45deg); top:19px; }
#menu-toggle:checked ~ .nav-btn::after { transform:rotate(-45deg); top:19px; }

/* Desktop vs mobile */
@media (max-width: 900px){
  .nav { display:none; }
  .nav-btn { display:block; }
  .site-header { position:sticky; top:0; z-index:1000; }
  .hero .wrap { padding:28px 12px 18px; }
  .hero img { height:88px; }
  .hero h1 { font-size:30px; margin:8px 0 4px; }
  .hero .tag { font-size:22px; }
  .page .wrap { padding:20px 12px; }
  .cards { gap:12px; }
  .card .card-body { padding:14px; }
  .gallery img { height:160px; }
  .site-footer .wrap { padding:16px 12px; gap:12px; }
  .footer-meta { grid-template-columns:1fr 1fr; gap:12px; }
}

/* NAV CLEAN */
nav ul, .nav, .nav ul, .site-nav ul { list-style: none; margin: 0; padding: 0; }
.site-nav li::marker { content: none; }