:root{
  --bg:#f6f2e8;
  --paper:#fffaf0;
  --ink:#16140f;
  --ink-soft:#5e5548;
  --gold:#e0a300;
  --gold-deep:#b67b00;
  --gold-soft:#efbf45;
  --night:#221d16;
  --night-2:#2d261d;
  --line:#d5c6a2;
  --font-body:"Archivo",system-ui,sans-serif;
  --font-meta:"IBM Plex Mono",ui-monospace,monospace;
  --shadow:0 18px 42px rgba(22,20,15,.08);
}

*{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  overflow-x:clip;
}
body{
  margin:0;
  font-family:var(--font-body);
  background:
    radial-gradient(circle at top right, rgba(228,187,84,.12), transparent 24%),
    var(--bg);
  color:var(--ink);
  line-height:1.6;
  overflow-x:clip;
}

h1{
  font-family:var(--font-body);
  font-weight:900;
  letter-spacing:-.06em;
}

h2{
  font-family:"Archivo",system-ui,sans-serif;
  font-weight:900;
  letter-spacing:-.04em;
  text-transform:none;
}

img{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--ink);color:var(--gold)}
site-header,
site-footer{display:block}

.shell{width:100%;max-width:1558px;margin:0 auto;padding:0 clamp(18px,3.5vw,44px)}
.page{min-height:100vh}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(246,242,232,.95);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(22,20,15,.14);
}

.nav-bar{
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.brand-logo{
  width:54px;
  height:54px;
  object-fit:cover;
  border-radius:999px;
  border:2px solid var(--gold);
  background:var(--ink);
}

.brand-copy strong{
  display:block;
  font-size:18px;
  font-weight:900;
  letter-spacing:.04em;
  line-height:.95;
  text-transform:uppercase;
}

.brand-copy span{
  display:block;
  font-family:var(--font-meta);
  font-size:10px;
  color:var(--gold-deep);
  letter-spacing:.22em;
  line-height:1;
  text-transform:uppercase;
}

.brand-copy{
  display:grid;
  gap:2px;
}

.nav-links{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:18px;
}

.nav-links a,
.mobile-links a{
  text-decoration:none;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
}

.nav-links a.active,
.mobile-links a.active{
  color:var(--gold-deep);
}

.nav-item{
  position:relative;
}

.nav-toggle{
  border:0;
  background:none;
  cursor:pointer;
  color:inherit;
  font:inherit;
  padding:0;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
}

.nav-toggle.active{
  color:var(--gold-deep);
}

.nav-submenu{
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  background:rgba(246,242,232,.98);
  border:1px solid rgba(22,20,15,.14);
  padding:6px;
  display:none;
  gap:0;
  box-shadow:0 18px 42px rgba(22,20,15,.12);
}

.nav-item:hover .nav-submenu,
.nav-item:focus-within .nav-submenu{
  display:grid;
}

.nav-submenu a{
  display:block;
  color:var(--ink);
  text-decoration:none;
  padding:11px 13px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
}

.nav-submenu a + a{
  border-top:1px solid rgba(22,20,15,.1);
}

.nav-submenu a:hover,
.nav-submenu a:focus{
  background:#eadfca;
  outline:none;
}

.nav-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 24px;
  background:var(--gold);
  border:2px solid var(--ink);
  color:var(--ink)!important;
  font-weight:900!important;
  letter-spacing:.011em;
  border-radius:999px;
}

.mobile-nav{display:none}

.mobile-menu-toggle{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  position:relative;
  z-index:80;
}

.mobile-icon{
  display:grid;
  gap:5px;
  position:relative;
  width:22px;
  height:22px;
}

.mobile-icon span{
  width:22px;
  height:4px;
  background:var(--ink);
  display:block;
  transform-origin:center;
  transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .2s ease;
}

.shared-header.mobile-menu-open .mobile-icon span:nth-child(1){
  transform:translateY(9px) rotate(45deg);
}

.shared-header.mobile-menu-open .mobile-icon span:nth-child(2){
  opacity:0;
}

.shared-header.mobile-menu-open .mobile-icon span:nth-child(3){
  transform:translateY(-9px) rotate(-45deg);
}

.mobile-menu-overlay{
  position:absolute;
  top:100%;
  right:0;
  left:0;
  height:calc(100dvh - 80px);
  z-index:70;
  background:var(--ink);
  color:#f8f1de;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-8px);
  transition:opacity .28s ease,visibility .28s ease,transform .28s cubic-bezier(.22,1,.36,1);
  overflow-y:auto;
  overscroll-behavior:contain;
}

.mobile-menu-inner{
  min-height:calc(100dvh - 80px);
  display:grid;
  align-content:space-between;
  gap:24px;
  padding:clamp(34px,8vh,72px) 24px 32px;
  transform:translateY(14px) scale(.985);
  opacity:.92;
  transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .28s ease;
}

.shared-header.mobile-menu-open .mobile-menu-overlay{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}

.shared-header.mobile-menu-open .mobile-menu-inner{
  transform:translateY(0) scale(1);
  opacity:1;
}

.mobile-menu-links{
  display:grid;
  gap:10px;
}

.mobile-menu-links a{
  display:block;
  padding:16px 0;
  border-bottom:1px solid rgba(248,241,222,.12);
  text-decoration:none;
  color:#f8f1de;
  font-size:clamp(1.45rem,5vw,2rem);
  font-weight:900;
  letter-spacing:-.03em;
  line-height:1.02;
}

.mobile-menu-links a.active{
  color:var(--gold);
}

.mobile-menu-cta-wrap{
  display:grid;
}

.mobile-menu-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:60px;
  padding:18px 22px;
  border-radius:999px;
  background:var(--gold);
  color:var(--ink);
  text-decoration:none;
  font-size:1rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

html.mobile-menu-lock,
body.mobile-menu-lock{
  overflow:hidden;
  overscroll-behavior:none;
}

.shared-header.mobile-menu-open{
  z-index:1000 !important;
}

.hero{
  position:relative;
  overflow:hidden;
  background:var(--night);
  color:#f8f1de;
}

.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(90deg,transparent,transparent 88px,rgba(228,187,84,.05) 88px,rgba(228,187,84,.05) 89px);
}

.hero-grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:32px;
  align-items:end;
  padding:clamp(46px,7vw,88px) 0;
}

.eyebrow,
.meta{
  font-family:var(--font-meta);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.eyebrow{
  color:var(--gold);
  font-weight:900;
  margin:0 0 14px;
}

.page-display-title,
.hero h1,
.page-hero h1{
  margin:0 0 14px;
  line-height:.98;
  text-transform:none;
  letter-spacing:-.065em;
  font-size:clamp(3.6rem,8vw,7.6rem);
  max-width:100%;
  min-width:0;
  overflow-wrap:anywhere;
}

.lede{
  max-width:62ch;
  min-width:0;
  margin:0;
  color:var(--ink-soft);
}

.hero .lede{color:#d1c8b8}

.button-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:26px;
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:60px;
  padding:14px 28px;
  border:2px solid var(--ink);
  border-radius:999px;
  text-decoration:none;
  font-size:15px;
  font-weight:900;
  letter-spacing:.011em;
}

.button.gold{background:var(--gold);color:var(--ink)}
.button.ghost{background:transparent;color:inherit;border-color:currentColor}
.button.dark{background:var(--ink);color:#f8f1de;border-color:var(--ink)}

.page-hero{
  padding:clamp(40px,6vw,72px) 0 26px;
}

.standard-page-heading{
  padding:18px 0 26px;
}

.standard-page-heading > .shell > .eyebrow,
.contact-wrap > .eyebrow,
.dues-wrap > .eyebrow{
  display:none;
}

.standard-page-heading .lede{
  font-size:18px;
  line-height:1.65;
}

.page-hero-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:22px;
  align-items:end;
}

.hero-panel,
.card,
.quote-card{
  background:var(--paper);
  border:2px solid var(--ink);
  box-shadow:var(--shadow);
}

.hero-panel{
  padding:22px;
}

.hero-panel.night{
  background:var(--ink);
  color:#f8f1de;
  border-color:var(--ink);
}

.section{
  padding:26px 0 70px;
}

.grid-2,
.grid-3,
.grid-4{
  display:grid;
  gap:18px;
}

.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.gallery-wall{
  columns:4 280px;
  column-gap:16px;
}

.gallery-item{
  break-inside:avoid;
  margin:0 0 16px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.gallery-item img{
  width:100%;
  height:auto;
  display:block;
  transition:transform .28s cubic-bezier(.22,1,.36,1),filter .28s ease;
}

.gallery-item:hover img{
  transform:scale(1.018);
  filter:saturate(1.04) contrast(1.02);
}

.gallery-intro{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:end;
  margin-bottom:24px;
}

.gallery-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:120px;
  min-height:120px;
  padding:20px;
  border-radius:999px;
  border:2px solid var(--ink);
  background:var(--paper);
  font-size:2.6rem;
  font-weight:900;
  line-height:1;
}

.card{padding:22px}
.card.night{background:var(--night);color:#f8f1de;border-color:var(--night)}
.card h2,
.card h3,
.quote-card h3{margin:0 0 10px;line-height:1.08;text-transform:uppercase}
.card p,
.quote-card p{margin:0;color:inherit}

.stat{
  padding:18px;
  background:var(--paper);
  border:1px solid var(--line);
}

.stat strong{
  display:block;
  font-size:2rem;
  line-height:.95;
}

.list-clean{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}

.list-clean li{
  padding:14px 16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.35);
}

.split{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:22px;
  align-items:start;
}

.timeline{
  display:grid;
  gap:0;
  border-top:2px solid var(--ink);
}

.timeline-entry{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--line);
}

.timeline-year{
  font-size:1.1rem;
  font-weight:900;
  color:var(--gold-deep);
}

.timeline-date{
  margin:0 0 6px;
  font-family:var(--font-meta);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold-deep);
}

.timeline-body h3{
  margin:0 0 6px;
  font-size:1rem;
}

.timeline-body p{
  margin:0;
  color:var(--ink-soft);
}

/* Hallmark · pre-emit critique: P5 H4 E4 S4 R5 V4 */
/* Hallmark · macrostructure: Catalogue · tone: editorial archive · anchor hue: gold */
.lines-decade-nav{
  position:sticky;
  top:80px;
  z-index:48;
  background:rgba(246,242,232,.98);
  backdrop-filter:blur(12px);
  border-top:1px solid rgba(22,20,15,.1);
  border-bottom:1px solid rgba(22,20,15,.14);
  box-shadow:0 10px 28px rgba(22,20,15,.06);
}

.lines-decade-nav-inner{
  display:flex;
  gap:8px;
  overflow-x:auto;
  scrollbar-width:none;
  padding-top:10px;
  padding-bottom:10px;
}

.lines-decade-nav-inner::-webkit-scrollbar{
  display:none;
}

.lines-decade-nav a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 14px;
  background:var(--paper);
  border:1px solid var(--line);
  color:var(--ink);
  text-decoration:none;
  font-family:var(--font-meta);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.lines-decade-nav a:hover,
.lines-decade-nav a:focus-visible{
  background:var(--ink);
  color:#f8f1de;
  outline:none;
}

.lines-catalogue{
  display:grid;
  gap:clamp(34px,5vw,72px);
  max-width:1180px;
  margin:0;
}

.decade-panel{
  scroll-margin-top:148px;
  display:block;
  padding-top:12px;
}

.decade-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  padding-bottom:18px;
  border-bottom:2px solid var(--ink);
}

.decade-heading span{
  display:block;
  font-size:clamp(42px,7vw,96px);
  font-weight:900;
  line-height:.9;
  letter-spacing:-.06em;
}

.decade-heading strong{
  display:grid;
  place-items:center;
  min-width:72px;
  min-height:72px;
  border:2px solid var(--ink);
  border-radius:999px;
  font-size:28px;
  line-height:1;
}

.line-card{
  border-bottom:1px solid var(--line);
}

.line-card summary{
  list-style:none;
  display:grid;
  grid-template-columns:76px minmax(0,1fr) 32px;
  gap:18px;
  align-items:start;
  padding:18px 0;
  cursor:pointer;
}

.line-card summary::-webkit-details-marker{
  display:none;
}

.line-card summary::after{
  content:"+";
  grid-column:3;
  justify-self:end;
  line-height:1;
  font-size:26px;
  font-weight:900;
  color:var(--gold-deep);
}

.line-card[open] summary::after{
  content:"-";
}

.line-card summary:focus-visible{
  outline:3px solid var(--gold);
  outline-offset:6px;
}

.line-year{
  font-family:var(--font-meta);
  color:var(--gold-deep);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
}

.line-card strong{
  display:block;
  font-size:clamp(20px,2.4vw,34px);
  line-height:1.02;
  letter-spacing:-.04em;
}

.line-card em{
  display:block;
  margin-top:7px;
  color:var(--ink-soft);
  font-style:normal;
  font-family:var(--font-meta);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.line-card p{
  margin:0;
  max-width:76ch;
  padding:0 44px 22px 94px;
  color:var(--ink-soft);
  font-size:17px;
  line-height:1.65;
}

/* Hallmark · genre: editorial · macrostructure: Long Document · theme: existing EHAA · enrichment: none */
.history-document{
  max-width:1180px;
  display:grid;
  grid-template-columns:minmax(0,65ch) minmax(260px,360px);
  gap:clamp(28px,5vw,72px);
  align-items:start;
}

.history-prose{
  min-width:0;
  max-width:100%;
  font-size:clamp(18px,2vw,21px);
  line-height:1.72;
}

.history-prose p{
  margin:0 0 1.25em;
}

.history-prose h2{
  margin:2.4em 0 .45em;
  font-size:clamp(28px,3vw,42px);
  line-height:1;
  letter-spacing:-.045em;
  text-transform:none;
}

.history-prose h2:first-child{
  margin-top:0;
}

.history-note{
  margin:0 0 1.35em;
  padding:18px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  color:var(--ink-soft);
  font-size:18px;
  line-height:1.6;
}

.history-aside{
  position:sticky;
  top:112px;
  min-width:0;
  max-width:100%;
  display:grid;
  gap:18px;
}

.history-list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:0;
  border-top:1px solid var(--line);
}

.history-list li{
  padding:12px 0;
  border-bottom:1px solid var(--line);
  font-weight:800;
}

.history-mini-timeline{
  display:grid;
  gap:0;
  border-top:1px solid var(--line);
}

.history-mini-event{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:16px;
  padding:14px 0;
  border-bottom:1px solid var(--line);
}

.history-mini-event strong{
  color:var(--gold-deep);
  line-height:1.1;
}

.history-mini-event span{
  color:var(--ink-soft);
}

.dark-section{
  background:var(--night);
  color:#f8f1de;
}

.dark-section .lede,
.dark-section .timeline-body p{
  color:#ccc3b4;
}

.dark-section .timeline{
  border-top-color:var(--gold);
}

.dark-section .timeline-entry{
  border-bottom-color:#3a3429;
}

.tag-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.tag{
  display:inline-flex;
  padding:10px 14px;
  background:var(--ink);
  color:#f8f1de;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.site-footer{
  background:var(--ink);
  color:#f8f1de;
  border-top:1px solid rgba(248,241,222,.12);
  overflow:hidden;
}

.site-footer-shell{
  padding:72px clamp(18px,3.5vw,44px) 36px;
}

.site-footer-grid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) repeat(2,minmax(220px,.82fr));
  gap:32px;
  padding:0 0 28px;
  border-bottom:1px solid rgba(248,241,222,.14);
  align-items:start;
}

.site-footer-brand{
  display:flex;
  align-items:center;
  gap:24px;
  text-decoration:none;
  color:inherit;
  margin-bottom:18px;
}

.site-footer-logo{
  width:108px;
  height:108px;
  object-fit:cover;
  border-radius:999px;
  border:2px solid var(--gold);
  background:var(--ink);
  flex-shrink:0;
}

.site-footer-brand-primary{
  font-weight:900;
  font-size:36px;
  letter-spacing:.04em;
  line-height:.95;
  text-transform:uppercase;
  color:#f8f1de;
}

.site-footer-brand-secondary{
  font-size:20px;
  letter-spacing:.24em;
  line-height:1;
  text-transform:uppercase;
  color:var(--gold-deep);
  font-weight:700;
}

.site-footer-heading{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 14px;
  font-weight:900;
}

.site-footer-links{
  display:grid;
  gap:10px;
}

.site-footer-links a{
  text-decoration:none;
  color:#f8f1de;
  font-size:14px;
}

.footer-bottom{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  padding-top:10px;
  font-size:12px;
  color:#c8bfaf;
}

.footer-bottom a{
  text-decoration:none;
  color:#c8bfaf;
}

@media (max-width: 980px){
  .nav-links{display:none !important}
  .mobile-nav{display:block}
  .page-hero-grid,
  .history-document,
  .decade-panel,
  .split,
  .grid-4,
  .grid-3,
  .grid-2,
  .site-footer-grid{
    grid-template-columns:1fr;
  }

  .site-footer-brand{
    flex-direction:column;
    align-items:flex-start;
    gap:16px;
    max-width:100%;
    width:100%;
  }

  .site-footer-logo{
    width:96px;
    height:96px;
  }

  .site-footer-brand > div{
    min-width:0;
    width:100%;
  }

  .site-footer-brand-primary{
    font-size:clamp(18px,6.6vw,24px);
    line-height:.92;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .site-footer-brand-secondary{
    font-size:clamp(9px,3.4vw,12px);
    letter-spacing:.12em;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:8px;
  }

.history-aside{
  position:static;
}

  .lines-decade-nav{
    top:80px;
  }

  .line-card summary{
    grid-template-columns:58px minmax(0,1fr) 28px;
    gap:14px;
  }

  .line-card p{
    padding-left:72px;
    padding-right:0;
  }

  .page-display-title,
  .hero h1,
  .page-hero h1{
    font-size:clamp(2.7rem,12vw,4rem);
    letter-spacing:-.07em;
  }

  .mobile-menu-toggle:focus-visible{
    outline:3px solid var(--gold);
    outline-offset:3px;
  }

}