/* ==========================================================================
   ABOUT THE ASSOCIATION — page-specific styles
   Loaded only by association.html, on top of site.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   IDENTITY CARD — the legal facts, up front
   -------------------------------------------------------------------------- */
.identity{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;margin-top:36px;
}
.identity .row{background:#fff;padding:24px 26px}
.identity .k{
  display:block;font-size:.66rem;font-weight:800;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted);margin-bottom:8px;
}
.identity .v{font-size:1.02rem;font-weight:700;line-height:1.4}
.identity .v small{display:block;font-size:.82rem;font-weight:400;color:var(--muted);margin-top:5px}

/* --------------------------------------------------------------------------
   STAT BAND
   -------------------------------------------------------------------------- */
.statband{background:var(--charcoal);color:#fff}
.statband .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.14)}
.statband .cell{background:var(--charcoal);padding:36px 26px;text-align:center}
.statband b{
  display:block;font-family:var(--font-display);font-size:clamp(2.1rem,4vw,3rem);
  font-weight:800;line-height:1;color:var(--jade-light);letter-spacing:-.02em;
}
.statband span{
  display:block;margin-top:10px;font-size:.74rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:#9DB2AD;
}

/* --------------------------------------------------------------------------
   SUB-REGIONAL COVERAGE
   -------------------------------------------------------------------------- */
.regions{
  display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:36px;
  align-items:stretch;
}
.region{
  border:1px solid var(--line);border-radius:var(--radius);background:#fff;
  padding:24px 22px;display:flex;flex-direction:column;
  border-top:4px solid var(--jade);transition:.18s;
}
.region:hover{box-shadow:0 10px 28px rgba(13,122,107,.1);transform:translateY(-3px)}
.region:nth-child(2){border-top-color:#2C9E8A}
.region:nth-child(3){border-top-color:#4FB8A3}
.region:nth-child(4){border-top-color:var(--gold)}
.region:nth-child(5){border-top-color:#C9922B}

.region-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:16px}
.region-head h3{font-size:.95rem;margin:0;line-height:1.25}
.region-count{
  font-family:var(--font-display);font-size:1.75rem;font-weight:800;
  color:var(--jade);line-height:1;flex-shrink:0;
}

.region-list{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:9px;flex:1}
.region-list li{font-size:.9rem;line-height:1.35}
.region-list a{
  color:var(--charcoal);border-bottom:1px solid transparent;transition:.15s;
}
.region-list a:hover{color:var(--jade);border-bottom-color:var(--jade)}

.region-note{
  margin:0;font-size:.78rem;color:var(--muted);line-height:1.5;
  padding-top:14px;border-top:1px solid var(--line);
}

/* Register table cells awaiting confirmation */
.pending-cell{color:var(--muted);font-style:italic;font-size:.88rem}
.wl-yes{color:var(--jade);font-weight:700;border-bottom:1px solid rgba(13,122,107,.3)}
.wl-yes:hover{border-bottom-color:var(--jade)}

/* --------------------------------------------------------------------------
   SANCTIONING POLICY
   -------------------------------------------------------------------------- */
.tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:36px}
.tier{
  border:1px solid var(--line);border-left:4px solid var(--jade);
  border-radius:0 var(--radius) var(--radius) 0;padding:26px 28px;background:#fff;
}
.tier:nth-child(2){border-left-color:var(--jade-light)}
.tier:nth-child(3){border-left-color:var(--gold)}
.tier:nth-child(4){border-left-color:var(--slate)}
.tier .num{
  font-size:.66rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);display:block;margin-bottom:8px;
}
.tier h3{font-size:1.08rem;margin:0 0 10px}
.tier p{margin:0;font-size:.92rem;color:var(--muted);line-height:1.65}

.criteria{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:2px}
.criteria li{
  display:grid;grid-template-columns:34px 1fr;gap:16px;align-items:start;
  padding:18px 0;border-bottom:1px solid var(--line);
}
.criteria li:last-child{border-bottom:0}
.criteria .n{
  width:34px;height:34px;border-radius:50%;background:var(--paper);color:var(--jade);
  display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:800;
}
.criteria strong{display:block;margin-bottom:4px;font-size:.98rem}
.criteria span{font-size:.9rem;color:var(--muted);line-height:1.6}

/* --------------------------------------------------------------------------
   PROGRAMME SUMMARY
   -------------------------------------------------------------------------- */
.prog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:40px}
.prog{border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:26px;background:rgba(255,255,255,.04)}
.prog b{display:block;font-family:var(--font-display);font-size:2.1rem;font-weight:800;color:var(--jade-light);line-height:1}
.prog span{display:block;margin-top:8px;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#9DB2AD}
.prog p{margin:12px 0 0;font-size:.86rem;color:#B7C7C3;line-height:1.6}

/* --------------------------------------------------------------------------
   GOVERNANCE SNAPSHOT
   -------------------------------------------------------------------------- */
.gov-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 48px;margin-top:36px}
.gov-item{display:grid;grid-template-columns:42px 1fr;gap:18px;align-items:start}
.gov-item .ic{
  width:42px;height:42px;border-radius:var(--radius);background:var(--paper);
  display:flex;align-items:center;justify-content:center;color:var(--jade);
}
.gov-item h3{font-size:1rem;margin:0 0 6px}
.gov-item p{margin:0;font-size:.9rem;color:var(--muted);line-height:1.65}

/* --------------------------------------------------------------------------
   DRAFT MARKER — shown while the page still holds unconfirmed content
   -------------------------------------------------------------------------- */
.draft-banner{
  background:#FDF7EC;border:1px solid #E8D3A8;border-left:4px solid var(--amber);
  border-radius:0 var(--radius) var(--radius) 0;padding:20px 24px;margin-bottom:40px;
}
.draft-banner strong{display:block;margin-bottom:6px;font-size:.95rem}
.draft-banner p{margin:0;font-size:.88rem;color:#6B5A38;line-height:1.65}

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width:1100px){
  .regions{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1000px){
  .statband .wrap{grid-template-columns:repeat(2,1fr)}
  .tiers,.gov-grid{grid-template-columns:1fr}
  .prog-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .identity{grid-template-columns:1fr}
  .regions{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .regions{grid-template-columns:1fr}
  .statband .wrap{grid-template-columns:1fr}
  .statband .cell{padding:26px 20px}
  .criteria li{grid-template-columns:28px 1fr;gap:12px}
  .criteria .n{width:28px;height:28px;font-size:.72rem}
}

/* --------------------------------------------------------------------------
   HEADQUARTERS & GOVERNMENT SUPPORT
   -------------------------------------------------------------------------- */
.hq-points{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:48px}
.hq-point{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start}
.hq-point .ic{
  width:44px;height:44px;border-radius:var(--radius);background:var(--jade);
  color:#fff;display:flex;align-items:center;justify-content:center;
}
.hq-point h3{font-size:1rem;margin:0 0 6px}
.hq-point p{margin:0;font-size:.89rem;color:var(--muted);line-height:1.6}

.hq-note{
  margin:44px 0 0;padding-top:24px;border-top:1px solid var(--line);
  display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;
}
.hq-note strong{
  font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);flex-shrink:0;
}
.hq-note span{font-size:.88rem;color:var(--charcoal);line-height:1.6}

/* --------------------------------------------------------------------------
   MEMBERSHIP CLASS CARDS  (counts rendered from the register)
   -------------------------------------------------------------------------- */
.class-card{border-top:4px solid var(--jade)}
.class-card.assoc{border-top-color:var(--gold)}
.class-card.prov{border-top-color:var(--slate)}
.class-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.class-head h3{margin:0;font-size:1.02rem}
.class-count{
  font-family:var(--font-display);font-size:1.9rem;font-weight:800;
  color:var(--jade);line-height:1;flex-shrink:0;
}
.class-card.assoc .class-count{color:var(--gold)}
.class-card.prov  .class-count{color:var(--slate)}
.class-card p{font-size:.89rem;color:var(--muted);margin:0 0 12px;line-height:1.6}
.class-votes{font-size:.82rem;font-weight:700;color:var(--jade) !important;margin:0 !important}
.class-card.assoc .class-votes{color:var(--gold) !important}
.class-card.prov  .class-votes{color:var(--slate) !important}

/* --------------------------------------------------------------------------
   REGISTER TABLE CELLS
   -------------------------------------------------------------------------- */
/* NOC recognition is published as two states only — see _build/derive_members.py */
.noc-yes { color:var(--jade);  font-weight:700 }
.noc-no  { color:var(--muted) }

.cls-tag{
  display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.03em;
  padding:.3em .7em;border-radius:3px;white-space:nowrap;
}
.cls-tag.full  {background:rgba(13,122,107,.12); color:var(--jade-deep)}
.cls-tag.assoc {background:rgba(176,122,22,.14); color:var(--gold)}
.cls-tag.prov  {background:rgba(126,142,138,.16);color:var(--slate)}

td.votes{font-weight:800;font-variant-numeric:tabular-nums;color:var(--charcoal)}

/* --------------------------------------------------------------------------
   APPLICATIONS IN PROGRESS
   -------------------------------------------------------------------------- */
.prospective{
  border:1px dashed var(--line);border-radius:var(--radius);
  padding:24px 26px;background:#fff;
}
.prospective h3{font-size:1rem;margin:0 0 6px}
.prospective > p{margin:0 0 16px;font-size:.88rem;color:var(--muted)}
.prospective ul{list-style:none;padding:0;margin:0;display:flex;gap:12px;flex-wrap:wrap}
.prospective li{
  display:flex;flex-direction:column;gap:2px;padding:12px 18px;
  background:var(--paper);border-radius:var(--radius);min-width:150px;
}
.prospective li strong{font-size:.92rem}
.prospective li span{font-size:.76rem;color:var(--muted)}

@media (max-width:1000px){
  .hq-points{grid-template-columns:1fr}
}