/* ============================================================
   ENDERASSEY — ledger green & brass design system
   Static build for self-hosting (migrated from Squarespace)
   ------------------------------------------------------------
   01 Tokens          06 Buttons          11 Principal
   02 Base            07 Hero             12 CTA band (.e-band)
   03 Typography      08 Etymology        13 Service rows (.e-svc)
   04 Layout          09 Ledger (.e-ledger) 14 Cards (.e-pack)
   05 Header/nav      10 Engagements (.e-duo) 15 Forms
   16 Disclaimers     17 Footer           18 Utilities
   19 Responsive
   ============================================================ */

/* 01 — Tokens */
:root{
  --deep:#0B221E;        /* hero + footer */
  --ledger:#11302A;      /* headings, dark sections, buttons */
  --paper:#F3F1E9;       /* site background */
  --paper-dim:#EAE7DC;   /* alternate light bands */
  --brass:#A4802F;       /* accent, links, buttons */
  --brass-soft:#C4A458;  /* brass on dark backgrounds */
  --stone:#5C6660;       /* secondary text */
  --line:rgba(17,48,42,.18);
  --line-dark:rgba(243,241,233,.16);
  --disp:"Newsreader",Georgia,serif;
  --body:"IBM Plex Sans",-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --am:"Noto Serif Ethiopic",serif;
  --max:1120px;
}

/* 02 — Base */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--paper);color:var(--ledger);
  font-family:var(--body);font-size:1.0625rem;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--brass);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--brass);outline-offset:2px;
}
.skip{position:absolute;left:-999px;top:0;background:var(--ledger);
  color:var(--paper);padding:.5rem 1rem;z-index:100}
.skip:focus{left:0}

/* 03 — Typography */
h1,h2,h3{font-family:var(--disp);font-weight:500;line-height:1.12;
  color:var(--ledger);margin:0 0 .6em}
h1{font-size:clamp(2.2rem,5.2vw,3.6rem);letter-spacing:-.015em}
h2{font-size:clamp(1.7rem,3.6vw,2.5rem);letter-spacing:-.01em}
h3{font-size:clamp(1.25rem,2.2vw,1.55rem)}
h1 em,h2 em{font-style:italic;color:var(--brass)}
p{margin:0 0 1.1em}
.lede{font-size:clamp(1.05rem,1.8vw,1.2rem);color:var(--stone);max-width:44em}
.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass);margin:0 0 1.1rem}
.mono{font-family:var(--mono);font-size:.85rem;letter-spacing:.04em}
.am{font-family:var(--am)}
strong{font-weight:600}

/* 04 — Layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem)}
section{padding:clamp(3.25rem,7vw,5.5rem) 0}
.section-dim{background:var(--paper-dim)}
.section-head{max-width:46em;margin-bottom:clamp(2rem,4vw,3rem)}

/* 05 — Header / nav */
.site-header{background:var(--paper);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:72px;flex-wrap:wrap;padding-top:.6rem;padding-bottom:.6rem}
.wordmark{font-family:var(--disp);font-size:1.2rem;color:var(--ledger);
  white-space:nowrap}
.wordmark .am{color:var(--brass);font-size:1.15rem}
.wordmark:hover{text-decoration:none}
.nav{display:flex;gap:clamp(.9rem,2.4vw,1.8rem);flex-wrap:wrap}
.nav a{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ledger);padding:.35rem 0;
  border-bottom:2px solid transparent}
.nav a:hover{text-decoration:none;border-bottom-color:var(--brass)}
.nav a[aria-current="page"]{color:var(--brass);border-bottom-color:var(--brass)}

/* 06 — Buttons */
.btn{display:inline-block;font-family:var(--mono);font-size:.82rem;
  letter-spacing:.09em;text-transform:uppercase;padding:.85rem 1.5rem;
  border:1px solid var(--brass);border-radius:2px;transition:background .15s,color .15s}
.btn:hover{text-decoration:none}
.btn-solid{background:var(--brass);color:#fff}
.btn-solid:hover{background:#8d6d26;color:#fff}
.btn-ghost{background:transparent;color:var(--brass)}
.btn-ghost:hover{background:var(--brass);color:#fff}
.on-dark .btn-ghost{color:var(--brass-soft);border-color:var(--brass-soft)}
.on-dark .btn-ghost:hover{background:var(--brass-soft);color:var(--deep)}
.btn-row{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:1.8rem}

/* 07 — Hero */
.hero{background:var(--deep);color:var(--paper);
  padding:clamp(4rem,9vw,7rem) 0 clamp(3.5rem,8vw,6rem)}
.hero h1{color:var(--paper);max-width:15.5em}
.hero .lede{color:rgba(243,241,233,.82);max-width:42em}
.hero .eyebrow{color:var(--brass-soft)}
.hero strong{color:#fff}

/* 08 — Etymology strip */
.etym{background:var(--paper-dim);padding:clamp(2.25rem,4.5vw,3.25rem) 0;
  border-bottom:1px solid var(--line)}
.etym .wrap{display:grid;grid-template-columns:auto 1fr;
  gap:clamp(1.25rem,3.5vw,2.5rem);align-items:center}
.etym .glyph{font-family:var(--am);font-size:clamp(2.4rem,5vw,3.4rem);
  color:var(--brass);line-height:1}
.etym p{margin:0;color:var(--stone);max-width:52em}

/* 09 — Examiner's ledger */
.e-ledger{border-top:2px solid var(--ledger)}
.e-ledger .row{display:grid;grid-template-columns:110px 1fr 1.4fr;
  gap:clamp(1rem,3vw,2.25rem);padding:1.5rem 0;
  border-bottom:1px solid var(--line);align-items:baseline}
.e-ledger .idx{font-family:var(--mono);font-size:.85rem;
  letter-spacing:.08em;color:var(--brass)}
.e-ledger .claim{font-family:var(--disp);font-size:1.2rem;line-height:1.3;
  color:var(--ledger)}
.e-ledger .finding{color:var(--stone);font-size:.98rem;margin:0}

/* 10 — Engagement layout (.e-duo) */
.e-eng{border-top:2px solid var(--ledger);
  padding-top:clamp(2rem,4vw,2.75rem);margin-top:clamp(2.5rem,5vw,3.5rem)}
.e-eng:first-of-type{margin-top:0}
.e-eng .kicker{display:flex;gap:1.25rem;align-items:baseline;flex-wrap:wrap;
  margin-bottom:.4rem}
.e-eng .kicker .idx{font-family:var(--mono);font-size:.8rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--brass)}
.e-eng .kicker .terms{font-family:var(--mono);font-size:.8rem;color:var(--stone)}
.e-duo{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(1.5rem,4vw,3rem);margin-top:1.25rem}
.e-duo h3{font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass);margin-bottom:.9rem}
.e-duo p{color:var(--stone)}

/* 11 — Principal */
.principal{display:grid;grid-template-columns:auto 1fr;
  gap:clamp(1.75rem,4.5vw,3.5rem);align-items:start}
.monogram{width:clamp(92px,11vw,128px);height:clamp(92px,11vw,128px);
  background:var(--ledger);color:var(--brass-soft);font-family:var(--am);
  font-size:clamp(2.6rem,5vw,3.6rem);display:flex;align-items:center;
  justify-content:center;border-radius:2px}
.principal .role{font-family:var(--mono);font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--brass);
  margin:.2rem 0 1.25rem}
.principal p{color:var(--stone)}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
.chips span{font-family:var(--mono);font-size:.74rem;letter-spacing:.05em;
  color:var(--ledger);border:1px solid var(--line);padding:.42rem .8rem;
  border-radius:2px;background:var(--paper-dim)}

/* 12 — Dark CTA band */
.e-band{background:var(--ledger);color:var(--paper);
  padding:clamp(3.25rem,7vw,5rem) 0}
.e-band h2{color:var(--paper);max-width:20em}
.e-band .lede{color:rgba(243,241,233,.8)}
.e-band .eyebrow{color:var(--brass-soft)}

/* 13 — Service rows */
.e-svc{display:grid;grid-template-columns:1fr 1.5fr;
  gap:clamp(1.5rem,4vw,3rem);padding:clamp(2rem,4.5vw,3rem) 0;
  border-top:1px solid var(--line)}
.e-svc:first-of-type{border-top:2px solid var(--ledger)}
.e-svc .sub{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--brass);margin-top:.35rem}
.e-svc p{color:var(--stone)}
.e-list{list-style:none;margin:0 0 1.1em;padding:0}
.e-list li{padding:.5rem 0 .5rem 1.6rem;position:relative;color:var(--stone)}
.e-list li::before{content:"◆";position:absolute;left:0;top:.55rem;
  font-size:.6rem;color:var(--brass)}
.note{border-left:3px solid var(--brass);background:var(--paper-dim);
  padding:1rem 1.25rem;color:var(--ledger);font-size:.97rem}

/* 14 — Profile / package cards */
.e-pack{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(1rem,2.5vw,1.75rem)}
.e-pack article{background:#fff;border:1px solid var(--line);
  border-top:3px solid var(--brass);padding:1.75rem 1.5rem;border-radius:2px}
.e-pack .idx{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass);margin-bottom:.8rem}
.e-pack h3{font-size:1.25rem}
.e-pack p{color:var(--stone);font-size:.96rem;margin:0}

/* 15 — Forms */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;
  max-width:760px}
.field{display:flex;flex-direction:column;gap:.4rem}
.field-full{grid-column:1 / -1}
label{font-family:var(--mono);font-size:.76rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ledger)}
label .req{color:var(--brass)}
input,select,textarea{font-family:var(--body);font-size:1rem;
  color:var(--ledger);background:#fff;border:1px solid var(--line);
  border-radius:2px;padding:.8rem .9rem;width:100%}
textarea{min-height:150px;resize:vertical}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.contact-meta{margin:2.25rem 0 2.75rem}
.contact-meta p{margin:.2rem 0;color:var(--stone)}
.contact-meta a{font-weight:600}

/* 16 — Disclaimers */
.e-disclaimer{border:1px solid var(--line);border-left:3px solid var(--brass);
  background:var(--paper-dim);padding:1.1rem 1.35rem;margin:1.25rem 0;
  font-size:.93rem;color:var(--stone)}
.e-disclaimer p{margin:.3em 0}

/* 17 — Footer */
.site-footer{background:var(--deep);color:rgba(243,241,233,.75);
  padding:clamp(2.5rem,5vw,3.5rem) 0;font-size:.92rem}
.site-footer .wordmark{color:var(--paper);display:inline-block;margin-bottom:1rem}
.site-footer .wordmark .am{color:var(--brass-soft)}
.site-footer p{margin:.25rem 0}
.site-footer a{color:var(--brass-soft)}
.site-footer .foot-nav{display:flex;gap:1.4rem;flex-wrap:wrap;
  margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--line-dark)}
.site-footer .foot-nav a{font-family:var(--mono);font-size:.74rem;
  letter-spacing:.1em;text-transform:uppercase}

/* 18 — Utilities */
.on-dark{color:var(--paper)}
.center{text-align:center}

/* 19 — Responsive */
@media (max-width:840px){
  .e-ledger .row{grid-template-columns:84px 1fr;grid-template-rows:auto auto}
  .e-ledger .finding{grid-column:2}
  .e-duo,.e-svc,.form-grid{grid-template-columns:1fr}
  .e-pack{grid-template-columns:1fr}
  .principal{grid-template-columns:1fr}
  .etym .wrap{grid-template-columns:1fr;text-align:left}
}
@media (max-width:560px){
  .site-header .wrap{justify-content:center;text-align:center}
  .nav{justify-content:center}
}