/* =========================================================
   LIGHT OF THE CROWN ASSEMBLY — CORE STYLESHEET
   Built from the approved Website Design System.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Source+Serif+4:ital,wght@0,400;0,600;1,400&family=Inter:wght@400;500;600&display=swap');

:root{
  --parchment:#FBF6EC;
  --ink:#14120F;
  --gold:#A9812E;
  --gold-soft: rgba(169,129,46,0.35);
  --green:#2B3A2E;
  --aged:#F1E9D8;
  --stone:#6E6A61;
  --hairline:#DCD2BA;

  --font-display:'Fraunces', serif;
  --font-body:'Source Serif 4', serif;
  --font-ui:'Inter', sans-serif;

  --space-1:8px;
  --space-2:16px;
  --space-3:24px;
  --space-4:40px;
  --space-5:64px;
  --space-6:96px;
  --space-7:160px;

  --max-width:1200px;
  --reading-width:760px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--parchment);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,p{margin:0;}

/* focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important;}
}

/* ---------------- TYPE SCALE ---------------- */
.hero-title{font-family:var(--font-display);font-weight:400;font-size:clamp(40px,7vw,88px);line-height:1.05;}
.h1{font-family:var(--font-display);font-weight:400;font-size:clamp(34px,5vw,48px);line-height:1.1;}
.h2{font-family:var(--font-display);font-weight:400;font-size:clamp(26px,3.4vw,32px);line-height:1.2;}
.h3{font-family:var(--font-display);font-weight:500;font-size:22px;line-height:1.3;}
.eyebrow{font-family:var(--font-ui);font-weight:500;font-size:12px;letter-spacing:0.08em;line-height:1.4;text-transform:uppercase;color:var(--gold);}
.eyebrow-stone{font-family:var(--font-ui);font-weight:500;font-size:12px;letter-spacing:0.08em;line-height:1.4;text-transform:uppercase;color:var(--stone);}
.body-lg{font-family:var(--font-body);font-size:20px;line-height:1.7;}
.body-md{font-family:var(--font-body);font-size:18px;line-height:1.7;}
.caption{font-family:var(--font-ui);font-size:13px;letter-spacing:0.02em;color:var(--stone);}

/* ---------------- LAYOUT ---------------- */
.wrap{max-width:var(--max-width);margin:0 auto;padding:0 96px;}
.reading{max-width:var(--reading-width);margin:0 auto;}
.section{padding:var(--space-7) 0;}
.section-tight{padding:var(--space-6) 0;}
.section-green{background:var(--green);color:var(--parchment);}
.section-ink{background:var(--ink);color:var(--parchment);}
.section-aged{background:var(--aged);}

.hairline{border:none;border-top:1px solid var(--hairline);margin:0;}
.hairline-light{border:none;border-top:1px solid rgba(251,246,236,0.18);margin:0;}

.center{text-align:center;}
.stack{display:flex;flex-direction:column;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);align-items:start;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);}

@media (max-width:900px){
  .wrap{padding:0 24px;}
  .section{padding:var(--space-6) 0;}
  .section-tight{padding:var(--space-5) 0;}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;gap:var(--space-4);}
}

/* ---------------- NAV ---------------- */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:20px 0;
  background:transparent;
  transition:background 250ms ease, border-color 250ms ease, padding 250ms ease;
  border-bottom:1px solid transparent;
}
.site-nav.is-scrolled{
  background:rgba(251,246,236,0.96);
  border-bottom:1px solid var(--hairline);
  padding:14px 0;
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;}
.nav-brand{display:flex;align-items:center;gap:10px;}
.nav-brand .crest{width:28px;height:28px;flex:none;}
.nav-wordmark{font-family:var(--font-ui);font-size:12px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;}
.nav-links{display:flex;align-items:center;gap:var(--space-4);}
.nav-link{font-family:var(--font-ui);font-size:13px;font-weight:500;letter-spacing:0.04em;text-transform:uppercase;position:relative;padding-bottom:4px;}
.nav-link::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--gold);transition:right 220ms ease;}
.nav-link:hover::after,.nav-link.active::after{right:0;}
.nav-link.active{color:var(--gold);}
.nav-more{position:relative;}
.nav-more-panel{
  display:none;position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%);
  background:var(--parchment);border:1px solid var(--hairline);padding:20px;min-width:220px;
}
.nav-more:hover .nav-more-panel{display:block;}
.nav-more-panel a{display:block;font-family:var(--font-ui);font-size:13px;letter-spacing:0.03em;padding:8px 0;text-transform:uppercase;}
.nav-more-panel a:hover{color:var(--gold);}
.nav-actions{display:flex;align-items:center;gap:var(--space-3);}
.nav-hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.nav-hamburger span{display:block;width:22px;height:1px;background:var(--ink);margin:5px 0;}

@media (max-width:980px){
  .nav-links{display:none;}
  .nav-hamburger{display:block;}
  .site-nav{background:rgba(251,246,236,0.96);border-bottom:1px solid var(--hairline);}
}

/* mobile overlay */
.mobile-overlay{
  position:fixed;inset:0;background:rgba(20,18,15,0.97);z-index:200;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  padding:48px;transform:translateY(-8px);opacity:0;pointer-events:none;
  transition:opacity 260ms ease, transform 260ms ease;
}
.mobile-overlay.is-open{opacity:1;transform:translateY(0);pointer-events:auto;}
.mobile-overlay-top{position:absolute;top:24px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;}
.mobile-close{background:none;border:none;color:var(--parchment);font-family:var(--font-ui);font-size:13px;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;}
.mobile-links{display:flex;flex-direction:column;gap:20px;margin-top:40px;}
.mobile-links a{color:var(--parchment);font-family:var(--font-display);font-size:28px;}
.mobile-sub{margin-top:8px;padding-left:2px;display:flex;flex-direction:column;gap:14px;}
.mobile-sub a{color:var(--stone);font-family:var(--font-ui);font-size:13px;letter-spacing:0.05em;text-transform:uppercase;}

/* ---------------- BUTTONS ---------------- */
.btn{
  display:inline-block;font-family:var(--font-ui);font-size:13px;font-weight:500;
  letter-spacing:0.06em;text-transform:uppercase;padding:16px 32px;border-radius:0;
  cursor:pointer;transition:all 250ms ease;
}
.btn-primary{background:transparent;color:var(--ink);border:1px solid var(--gold);}
.btn-primary:hover{background:var(--gold);color:var(--parchment);}
.btn-primary.on-dark{color:var(--parchment);}
.btn-primary.on-dark:hover{background:var(--gold);color:var(--ink);}
.btn-secondary{background:none;border:none;padding:16px 0;position:relative;color:inherit;}
.btn-secondary::after{content:"";position:absolute;left:0;right:100%;bottom:12px;height:1px;background:var(--gold);transition:right 220ms ease;}
.btn-secondary:hover::after{right:0;}
.btn-row{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center;justify-content:center;}
@media (max-width:600px){
  .btn-row{flex-direction:column;align-items:stretch;}
  .btn-row .btn-primary{text-align:center;}
}

/* ---------------- HERO ---------------- */
.hero{
  position:relative;min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;padding:160px 24px 80px;
  background:
    linear-gradient(180deg, rgba(20,18,15,0.15) 0%, rgba(20,18,15,0.05) 40%, rgba(20,18,15,0.86) 100%),
    radial-gradient(120% 90% at 50% 15%, #2c2a24 0%, #1c1a15 45%, #14120F 100%);
  color:var(--parchment);text-align:center;overflow:hidden;
}
.hero-arch{
  position:absolute;inset:0;
  background-image:
    repeating-linear-gradient(90deg, rgba(251,246,236,0.035) 0 2px, transparent 2px 84px),
    linear-gradient(180deg, transparent 55%, rgba(20,18,15,0.5) 100%);
  opacity:0.9;
}
.hero-content{position:relative;z-index:2;max-width:760px;}
.hero .crest{width:80px;height:80px;margin:0 auto var(--space-3);}
.hero-subline{margin-top:var(--space-3);max-width:600px;margin-left:auto;margin-right:auto;color:rgba(251,246,236,0.86);}
.hero .btn-row{margin-top:var(--space-4);}
.hero-scroll{position:relative;z-index:2;margin-top:var(--space-5);display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(251,246,236,0.6);}
.hero-scroll .line{width:1px;height:34px;background:rgba(251,246,236,0.4);}

.page-hero{padding:180px 0 var(--space-6);text-align:center;}
.page-hero .eyebrow{display:block;margin-bottom:var(--space-2);}

/* ---------------- CREST ---------------- */
.crest{object-fit:contain;border-radius:50%;}
.crest-pulse{animation:pulse 4s ease-in-out infinite;}
@keyframes pulse{0%,100%{filter:drop-shadow(0 0 0 rgba(169,129,46,0));}50%{filter:drop-shadow(0 0 10px rgba(169,129,46,0.55));}}

/* ---------------- CARDS ---------------- */
.card{background:var(--aged);border:1px solid var(--hairline);padding:40px;}
.card .rule{width:24px;height:1px;background:var(--gold);margin-bottom:var(--space-2);}
.card h3{margin-bottom:var(--space-2);}
.card p{color:var(--stone);}
.card a.more{display:inline-block;margin-top:var(--space-2);font-family:var(--font-ui);font-size:13px;letter-spacing:0.04em;text-transform:uppercase;}

/* ---------------- PULL QUOTE ---------------- */
.pull-quote{max-width:var(--reading-width);margin:0 auto;text-align:center;padding:var(--space-5) 0;}
.pull-quote blockquote{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(24px,3vw,34px);line-height:1.4;margin:0;}
.pull-quote .rule{width:48px;height:1px;background:var(--gold);margin:0 auto var(--space-3);}
.pull-quote .rule-bottom{width:48px;height:1px;background:var(--gold);margin:var(--space-3) auto 0;}
.pull-quote cite{display:block;margin-top:var(--space-3);font-style:normal;font-family:var(--font-ui);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--stone);}

/* ---------------- ARTICLE / CONSTITUTION TYPE ---------------- */
.article-label{font-family:var(--font-ui);font-size:12px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px;}
.article h2{margin-bottom:var(--space-3);}
.article h4{font-family:var(--font-display);font-weight:500;font-size:18px;margin:var(--space-3) 0 var(--space-1);}
.article p{margin-bottom:var(--space-2);color:var(--ink);}
.article ul{margin:0 0 var(--space-2) 0;padding-left:0;}
.article li{list-style:none;padding-left:20px;position:relative;margin-bottom:8px;color:var(--ink);}
.article li::before{content:"—";position:absolute;left:0;color:var(--gold);}
.article ol{padding-left:20px;margin-bottom:var(--space-2);}
.article ol li{padding-left:6px;}
.article ol li::before{content:none;}
.article-block{padding:var(--space-5) 0;}

/* ---------------- TOC ---------------- */
.toc{position:sticky;top:120px;}
.toc a{display:block;font-family:var(--font-ui);font-size:13px;letter-spacing:0.02em;padding:6px 0;color:var(--stone);border-left:1px solid var(--hairline);padding-left:14px;}
.toc a:hover, .toc a.active{color:var(--gold);border-left-color:var(--gold);}
.constitution-layout{display:grid;grid-template-columns:220px 1fr;gap:var(--space-6);align-items:start;}
@media (max-width:980px){
  .constitution-layout{grid-template-columns:1fr;}
  .toc{position:static;}
}

/* ---------------- FOOTER ---------------- */
.site-footer{background:var(--ink);color:var(--parchment);padding-top:var(--space-6);}
.footer-crest{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);text-align:center;padding-bottom:var(--space-5);}
.footer-crest .crest{width:44px;height:44px;}
.footer-tagline{font-family:var(--font-display);font-style:italic;font-size:20px;color:var(--parchment);}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);padding:var(--space-5) 0;border-top:1px solid rgba(251,246,236,0.14);}
.footer-col h5{font-family:var(--font-ui);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--gold);margin-bottom:var(--space-2);}
.footer-col a{display:block;font-family:var(--font-ui);font-size:14px;color:rgba(251,246,236,0.85);padding:6px 0;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(251,246,236,0.14);padding:var(--space-3) 0 var(--space-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--font-ui);font-size:12px;color:rgba(251,246,236,0.55);}
.footer-legal{max-width:640px;}
.footer-utility a{color:rgba(251,246,236,0.55);margin-left:16px;}
.footer-utility a:hover{color:var(--gold);}
@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-bottom{flex-direction:column;}
  .footer-utility{margin-top:8px;}
  .footer-utility a{margin-left:0;margin-right:16px;}
}

/* ---------------- SEAL DIVIDER ---------------- */
.seal-divider{display:flex;justify-content:center;padding:var(--space-5) 0;opacity:0.5;}
.seal-divider .crest{width:40px;height:40px;}

/* ---------------- REVEAL ---------------- */
.reveal{opacity:0;transform:translateY(10px);transition:opacity 500ms ease, transform 500ms ease;}
.reveal.is-visible{opacity:1;transform:translateY(0);}

/* ---------------- MISC UTILITIES ---------------- */
.mt-1{margin-top:var(--space-1);} .mt-2{margin-top:var(--space-2);} .mt-3{margin-top:var(--space-3);}
.mt-4{margin-top:var(--space-4);} .mt-5{margin-top:var(--space-5);}
.mb-1{margin-bottom:var(--space-1);} .mb-2{margin-bottom:var(--space-2);} .mb-3{margin-bottom:var(--space-3);}
.mb-4{margin-bottom:var(--space-4);} .mb-5{margin-bottom:var(--space-5);}
.stone{color:var(--stone);}
.on-parchment-alt{background:var(--aged);}
.list-plain li{padding:14px 0;border-bottom:1px solid var(--hairline);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.list-plain li:last-child{border-bottom:none;}
.tag{display:inline-block;font-family:var(--font-ui);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--green);border:1px solid var(--hairline);padding:4px 10px;}

/* portrait frame */
.portrait{background:#d9d2c0;aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;color:var(--stone);font-family:var(--font-ui);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;border:1px solid var(--hairline);}

/* architectural placeholder block */
.arch-placeholder{
  aspect-ratio:16/9;background:
    linear-gradient(180deg, rgba(20,18,15,0.05), rgba(20,18,15,0.55)),
    repeating-linear-gradient(90deg, #2a2822 0 2px, #201e19 2px 60px);
  display:flex;align-items:flex-end;justify-content:flex-start;padding:20px;
}
.arch-placeholder span{color:rgba(251,246,236,0.7);font-family:var(--font-ui);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;}

/* order of succession */
.succession{display:flex;flex-direction:column;align-items:center;gap:0;max-width:420px;margin:var(--space-4) auto 0;}
.succession .node{display:flex;flex-direction:column;align-items:center;gap:10px;}
.succession .dot{width:14px;height:14px;border-radius:50%;border:1px solid var(--gold);background:var(--parchment);}
.succession .label{font-family:var(--font-ui);font-size:13px;letter-spacing:0.02em;text-align:center;}
.succession .connector{width:1px;height:48px;background:var(--hairline);}

/* form */
.form-field{display:flex;flex-direction:column;gap:8px;margin-bottom:var(--space-3);}
.form-field label{font-family:var(--font-ui);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--stone);}
.form-field input, .form-field textarea{
  font-family:var(--font-body);font-size:16px;background:transparent;border:none;
  border-bottom:1px solid var(--hairline);padding:10px 2px;color:var(--ink);
}
.form-field input:focus, .form-field textarea:focus{border-bottom-color:var(--gold);outline:none;}

/* giving table */
.giving-table{width:100%;border-collapse:collapse;margin-top:var(--space-3);}
.giving-table th, .giving-table td{text-align:left;padding:16px 12px;border-bottom:1px solid var(--hairline);}
.giving-table th{font-family:var(--font-ui);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--stone);}