/* ────────────────────────────────────────────────────────────────────────
   Monarch Mobile Notary — Editorial / Letterpress / Wax-Seal Aesthetic
   ──────────────────────────────────────────────────────────────────── */

:root{
  --paper:#f1e6d0;
  --paper-light:#f9efd9;
  --paper-deep:#e5d6b3;
  --paper-shadow:#dbc9a0;
  --ink:#15182a;
  --ink-soft:#3a3e54;
  --ink-mute:#6d6e7d;
  --navy:#0f1937;
  --navy-deep:#060c20;
  --gold:#a47b32;
  --gold-light:#c8a25a;
  --gold-deep:#7a5a1f;
  --wine:#6e1d2a;
  --wax:#922d3a;
  --rule:rgba(21,24,42,.14);
  --rule-strong:rgba(21,24,42,.36);
  --rule-gold:rgba(164,123,50,.35);

  --font-display:"Fraunces","Times New Roman",serif;
  --font-body:"EB Garamond",Georgia,"Times New Roman",serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --measure:62ch;
  --content:1180px;
  --gutter:clamp(1.25rem,4vw,2.5rem);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  color:var(--ink);
  background-color:var(--paper);
  background-image:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(249,239,217,.85), transparent 70%),
    radial-gradient(ellipse 70% 60% at 100% 100%, rgba(219,201,160,.55), transparent 60%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.08  0 0 0 0 0.07  0 0 0 0 0.06  0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-attachment:fixed;
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.7;
  font-feature-settings:"liga","kern","onum","pnum";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* ── Typography ─────────────────────────────────────────────────────── */
h1,h2,h3,h4,.display{
  font-family:var(--font-display);
  font-weight:540;
  font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 0;
  color:var(--ink);
  letter-spacing:-0.022em;
  line-height:1.02;
  margin:0;
}

h1{
  font-size:clamp(2.6rem,8.5vw,7.2rem);
  font-variation-settings:"opsz" 144,"SOFT" 40,"WONK" 1;
  font-weight:520;
}
h2{
  font-size:clamp(1.9rem,4.5vw,3.4rem);
  font-variation-settings:"opsz" 96,"SOFT" 25,"WONK" 0;
  font-weight:520;
  line-height:1.06;
  letter-spacing:-0.018em;
}
h3{
  font-size:clamp(1.25rem,2.5vw,1.65rem);
  font-variation-settings:"opsz" 36,"SOFT" 20,"WONK" 0;
  font-weight:540;
  line-height:1.18;
  letter-spacing:-0.012em;
}
h4{
  font-size:1.05rem;
  font-weight:580;
  letter-spacing:.02em;
}

p{margin:0 0 1em}
.lede{
  font-family:var(--font-body);
  font-size:clamp(1.15rem,2.1vw,1.4rem);
  line-height:1.55;
  font-style:italic;
  color:var(--ink-soft);
  max-width:42ch;
  font-feature-settings:"onum","liga","dlig";
}
.lede strong,.lede em{font-style:normal;color:var(--ink)}

a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-strong);transition:border-color .2s,color .2s,background-position .35s ease;background-image:linear-gradient(180deg,transparent 88%,rgba(164,123,50,.35) 88%);background-size:100% 200%;background-position:0 0;padding:0 .04em}
a:hover{color:var(--ink);background-position:0 100%;border-bottom-color:var(--gold)}

img,svg{max-width:100%;height:auto;display:block}

ul,ol{padding-left:1.4em;margin:0 0 1.25em}
li{margin-bottom:.4em}
li::marker{color:var(--gold)}

strong{color:var(--ink);font-weight:580}
em{font-style:italic}
hr{border:none;height:1px;background:var(--rule);margin:3rem 0}

.rule-gold{
  border:none;height:1px;
  background:linear-gradient(to right,transparent 0%,var(--gold) 20%,var(--gold) 80%,transparent 100%);
  margin:3.5rem 0;
  position:relative;
}
.rule-gold::after{
  content:"⚜";
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  background:var(--paper);
  color:var(--gold);
  padding:0 .8em;
  font-size:1rem;
  font-family:var(--font-display);
}

/* ── Layout primitives ──────────────────────────────────────────────── */
.container{max-width:var(--content);margin:0 auto;padding:0 var(--gutter)}
.container--wide{max-width:1380px}
.container--narrow{max-width:760px}

.section{padding:clamp(3rem,7vw,6rem) 0;position:relative}
.section--alt{background:linear-gradient(180deg,transparent,rgba(229,214,179,.4) 30%,rgba(229,214,179,.4) 70%,transparent)}
.section--dark{
  background:var(--navy);
  color:var(--paper);
  background-image:radial-gradient(ellipse at top,rgba(15,25,55,.6),var(--navy-deep));
}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:var(--paper-light)}
.section--dark .lede{color:rgba(241,230,208,.78)}
.section--dark a{color:var(--gold-light);border-bottom-color:rgba(200,162,90,.4)}
.section--dark a:hover{color:var(--paper-light);border-bottom-color:var(--paper-light)}

/* ── Eyebrow / labels ───────────────────────────────────────────────── */
.eyebrow,.label,.kicker{
  font-family:var(--font-mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-deep);
  margin:0 0 1.2rem;
  display:inline-flex;
  align-items:center;
  gap:.65em;
}
.eyebrow::before{content:"";display:inline-block;width:24px;height:1px;background:var(--gold)}
.section--dark .eyebrow,.section--dark .label,.section--dark .kicker{color:var(--gold-light)}
.section--dark .eyebrow::before{background:var(--gold-light)}

.section-num{
  font-family:var(--font-display);
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0;
  font-weight:300;
  font-style:italic;
  font-size:clamp(2.5rem,5vw,4rem);
  color:var(--gold);
  line-height:1;
  letter-spacing:-.04em;
}

/* ── Masthead / nav ─────────────────────────────────────────────────── */
.site-header{
  background:var(--paper);
  border-bottom:1px solid var(--rule);
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:saturate(180%) blur(8px);
}
.masthead-strip{
  background:var(--navy);
  color:rgba(241,230,208,.78);
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  padding:.55rem 0;
  text-align:center;
  border-bottom:1px solid var(--gold-deep);
}
.masthead-strip a{color:var(--gold-light);border-bottom-color:transparent;background-image:none}
.masthead-strip a:hover{color:var(--paper-light);border-bottom-color:var(--gold-light)}
.masthead-strip .sep{margin:0 .8em;color:var(--gold);font-family:var(--font-display);font-style:italic}

.nav{display:flex;align-items:center;justify-content:space-between;padding:1.3rem var(--gutter);max-width:var(--content);margin:0 auto;gap:1.5rem}
.brand{display:flex;align-items:center;gap:.85rem;text-decoration:none;border:none;background:none;padding:0;color:var(--ink)}
.brand:hover{color:var(--ink);background:none}
.brand-text{
  font-family:var(--font-display);
  font-weight:560;
  font-variation-settings:"opsz" 36,"SOFT" 25,"WONK" 0;
  font-size:1.22rem;
  letter-spacing:-.012em;
  line-height:1;
  color:var(--ink);
}
.brand-text small{
  display:block;
  font-family:var(--font-mono);
  font-weight:500;
  font-size:.6rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--gold-deep);
  margin-top:.35em;
}

.nav-links{
  display:none;
  align-items:center;
  gap:1.8rem;
  font-family:var(--font-mono);
  font-size:.76rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.nav-links a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid transparent;background-image:none;padding:.2em 0}
.nav-links a:hover{color:var(--ink);border-bottom-color:var(--gold)}
.nav-links .has-menu{position:relative;display:inline-flex;align-items:center}
.nav-links .menu{
  display:none;
  position:absolute;
  top:calc(100% + .8rem);
  left:50%;
  transform:translateX(-50%);
  background:var(--paper-light);
  border:1px solid var(--rule);
  padding:.7rem;
  min-width:280px;
  box-shadow:0 18px 42px -12px rgba(21,24,42,.18),0 2px 6px rgba(21,24,42,.06);
  z-index:60;
  font-family:var(--font-body);
  font-size:1rem;
  text-transform:none;
  letter-spacing:0;
}
.nav-links .has-menu:hover .menu,.nav-links .has-menu:focus-within .menu{display:block}
.nav-links .menu a{display:block;padding:.55rem .8rem;border-bottom:1px solid transparent;color:var(--ink);text-transform:none;letter-spacing:0;font-size:.96rem}
.nav-links .menu a:hover{background:var(--paper-deep);color:var(--ink)}
.nav-links .menu a:not(:last-child){border-bottom:1px solid var(--rule)}
@media(min-width:980px){.nav-links{display:flex}}

.nav-cta .btn{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;padding:.7rem 1.1rem}

/* ── Buttons ────────────────────────────────────────────────────────── */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.95rem 1.5rem;
  background:var(--ink);
  color:var(--paper-light);
  font-family:var(--font-mono);
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-decoration:none;
  border:none;
  cursor:pointer;
  transition:background .2s,color .2s,transform .15s,box-shadow .2s;
  background-image:none;
}
.btn:hover{background:var(--navy);color:var(--paper-light);transform:translateY(-1px);box-shadow:0 8px 20px -6px rgba(21,24,42,.35)}
.btn--gold{background:var(--gold);color:var(--navy)}
.btn--gold:hover{background:var(--gold-light);color:var(--navy)}
.btn--outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.btn--outline:hover{background:var(--ink);color:var(--paper-light);box-shadow:none}
.btn--ghost{background:transparent;color:var(--paper-light);box-shadow:inset 0 0 0 1px rgba(241,230,208,.4)}
.btn--ghost:hover{background:rgba(241,230,208,.1);color:var(--paper-light);box-shadow:inset 0 0 0 1px var(--paper-light)}
.btn--dark{background:var(--navy);color:var(--paper-light)}
.btn--dark:hover{background:var(--ink);color:var(--paper-light)}
.btn--lg{padding:1.1rem 1.8rem;font-size:.78rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}

/* ── Hero ────────────────────────────────────────────────────────────── */
.hero{position:relative;padding:clamp(3.5rem,8vw,7rem) 0 clamp(3.5rem,7vw,6rem);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:end;position:relative}
@media(min-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr) 280px;gap:3.5rem}}
.hero-meta-col{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);line-height:1.9}
.hero-meta-col strong{color:var(--ink);font-weight:580;letter-spacing:.18em}
.hero-meta-col .meta-row{display:flex;justify-content:space-between;border-bottom:1px solid var(--rule);padding:.6rem 0;gap:1em}
.hero-meta-col .meta-row:first-child{border-top:1px solid var(--rule-strong)}

.hero h1{margin:0 0 1.5rem;max-width:14ch}
.hero h1 .accent{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;color:var(--wine);font-weight:430}
.hero .lede{margin-bottom:2.5rem;max-width:48ch}

.wax-seal-wrap{
  position:absolute;
  top:-1rem;right:-1rem;
  width:clamp(150px,16vw,220px);
  pointer-events:none;
  z-index:1;
  filter:drop-shadow(0 14px 28px rgba(146,45,58,.22)) drop-shadow(0 2px 6px rgba(21,24,42,.18));
}
.wax-seal{width:100%;height:auto;animation:seal-pulse 9s ease-in-out infinite;transform:rotate(-8deg);transform-origin:center}
@keyframes seal-pulse{0%,100%{transform:rotate(-8deg) scale(1)}50%{transform:rotate(-6deg) scale(1.018)}}
@media(max-width:900px){.wax-seal-wrap{position:relative;top:auto;right:auto;width:140px;margin:0 0 1.5rem auto}}

/* ── Trust strip ─────────────────────────────────────────────────────── */
.trust{border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);padding:1.5rem 0;background:rgba(229,214,179,.4)}
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem 2.5rem;text-align:center;align-items:center}
.trust-item{position:relative}
.trust-item strong{display:block;font-family:var(--font-display);font-variation-settings:"opsz" 96,"SOFT" 10,"WONK" 0;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:520;color:var(--navy);line-height:1;letter-spacing:-.02em}
.trust-item span{display:block;margin-top:.45rem;font-family:var(--font-mono);font-size:.64rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}

/* ── Section header ─────────────────────────────────────────────────── */
.section-head{display:grid;grid-template-columns:1fr;gap:2rem;margin-bottom:3rem;align-items:end}
@media(min-width:760px){.section-head{grid-template-columns:auto 1fr;gap:3rem}}
.section-head .section-num{justify-self:start}

/* ── Service cards (editorial grid) ──────────────────────────────────── */
.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0;border-top:1px solid var(--rule-strong)}
.service-card{
  position:relative;
  padding:2rem 1.75rem 2.5rem;
  background:transparent;
  border-bottom:1px solid var(--rule);
  border-right:1px solid var(--rule);
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  gap:.65rem;
  background-image:none;
  transition:background .2s;
}
.service-card:hover{background:rgba(249,239,217,.7);color:inherit}
.service-card:hover h3{color:var(--wine)}
.service-card .num{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.22em;color:var(--gold-deep);text-transform:uppercase}
.service-card .icon{font-size:1.7rem;margin-bottom:.6rem;width:auto;height:auto;background:none;display:block;color:var(--gold)}
.service-card h3{margin:0 0 .4rem;transition:color .2s;font-size:1.32rem}
.service-card p{margin:0;font-size:1rem;color:var(--ink-soft);line-height:1.55}
.service-card::after{content:"→";position:absolute;bottom:1.5rem;right:1.5rem;color:var(--gold);font-family:var(--font-display);font-size:1.4rem;opacity:.4;transition:transform .2s,opacity .2s}
.service-card:hover::after{opacity:1;transform:translateX(4px)}

/* ── Area cards ──────────────────────────────────────────────────────── */
.area-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.75rem;margin-top:2rem}
.area-card{position:relative;padding:1.4rem 1.5rem;background:var(--paper-light);border:1px solid var(--rule);text-decoration:none;color:inherit;background-image:none;transition:transform .15s,border-color .15s,background .2s}
.area-card:hover{transform:translateY(-2px);border-color:var(--gold);background:var(--paper);color:inherit}
.area-card h3{margin:0 0 .25rem;font-size:1.18rem;font-variation-settings:"opsz" 36,"SOFT" 25,"WONK" 0}
.area-card p{margin:0;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute)}

/* ── Two-column ──────────────────────────────────────────────────────── */
.two-col{display:grid;grid-template-columns:1fr;gap:3rem;align-items:start}
@media(min-width:780px){.two-col{grid-template-columns:1fr 1fr;gap:4rem}.two-col--wide-left{grid-template-columns:1.5fr 1fr;gap:4rem}}

.about-card{background:var(--paper-light);padding:2rem;border-left:3px solid var(--gold)}
.about-card h3{margin-top:0}
.credentials{list-style:none;padding:0;margin:1.5rem 0 0}
.credentials li{position:relative;padding:.5rem 0 .5rem 1.5em;font-size:.98rem;border-bottom:1px solid var(--rule);font-family:var(--font-body);color:var(--ink-soft)}
.credentials li::before{content:"§";position:absolute;left:0;top:.5rem;color:var(--gold);font-family:var(--font-display);font-style:italic;font-size:1.1rem}

/* ── FAQ ─────────────────────────────────────────────────────────────── */
.faq-list{margin-top:2rem}
.faq-item{background:transparent;border:none;border-bottom:1px solid var(--rule-strong);margin:0;overflow:hidden}
.faq-item summary{padding:1.6rem 0;cursor:pointer;font-family:var(--font-display);font-variation-settings:"opsz" 36,"SOFT" 25,"WONK" 0;font-weight:540;font-size:1.2rem;color:var(--ink);list-style:none;position:relative;padding-right:3rem;letter-spacing:-.012em}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:.2rem;top:50%;transform:translateY(-50%);font-size:1.7rem;color:var(--gold);font-family:var(--font-display);font-weight:300;transition:transform .2s}
.faq-item[open] summary::after{content:"−"}
.faq-item .faq-body{padding:0 0 1.4rem;color:var(--ink-soft);font-size:1.05rem;max-width:var(--measure)}
.faq-item .faq-body p:last-child{margin-bottom:0}

/* ── Pull-quote ──────────────────────────────────────────────────────── */
.pull-quote{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,2.1rem);font-style:italic;font-variation-settings:"opsz" 96,"SOFT" 50,"WONK" 0;font-weight:380;line-height:1.3;letter-spacing:-.01em;color:var(--ink);margin:2rem 0;padding-left:1.5rem;border-left:2px solid var(--gold);max-width:36ch}
.pull-quote cite{display:block;margin-top:.8rem;font-style:normal;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute)}

/* ── Contact card ────────────────────────────────────────────────────── */
.contact-card{background:var(--paper-light);border:1px solid var(--rule);border-top:3px solid var(--gold);padding:clamp(2rem,4vw,3rem);text-align:center}
.contact-big-cta{font-family:var(--font-display);font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 0;font-size:clamp(2rem,5vw,3.2rem);color:var(--ink);font-weight:540;display:block;margin:1rem 0;letter-spacing:-.02em;text-decoration:none;border-bottom:none;background-image:none}
.contact-big-cta:hover{color:var(--wine);background:none}
.contact-row{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-top:2rem;text-align:left;border-top:1px solid var(--rule);padding-top:2rem}
@media(min-width:680px){.contact-row{grid-template-columns:1fr 1fr 1fr;text-align:center}}
.contact-row .label{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:.45rem;display:block}
.contact-row .value{font-family:var(--font-display);font-size:1.1rem;color:var(--ink);font-variation-settings:"opsz" 36}

/* ── CTA strip ───────────────────────────────────────────────────────── */
.cta-strip{background:var(--navy);color:var(--paper-light);padding:clamp(2.5rem,5vw,4rem) 0;text-align:center;position:relative;overflow:hidden}
.cta-strip::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 100%,rgba(164,123,50,.18),transparent 60%);pointer-events:none}
.cta-strip .eyebrow{color:var(--gold-light)}
.cta-strip .eyebrow::before{background:var(--gold-light)}
.cta-strip h2{margin:0 0 .6rem;color:var(--paper-light);font-variation-settings:"opsz" 96,"SOFT" 30,"WONK" 0}
.cta-strip p{margin:0 auto 1.8rem;color:rgba(241,230,208,.78);max-width:42ch;font-style:italic;font-size:clamp(1rem,1.6vw,1.15rem)}
.cta-strip .btn-row{justify-content:center}

/* ── Breadcrumbs ─────────────────────────────────────────────────────── */
.breadcrumbs{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);padding:1.5rem 0 0;margin:0}
.breadcrumbs a{color:var(--ink-mute);background-image:none;border-bottom:1px solid transparent}
.breadcrumbs a:hover{color:var(--ink);border-bottom-color:var(--gold)}
.breadcrumbs .sep{margin:0 .8em;color:var(--gold);font-family:var(--font-display);font-style:italic}

/* ── Article ─────────────────────────────────────────────────────────── */
.article-content{max-width:var(--measure);margin:0 auto;font-size:1.06rem}
.article-content h1{font-size:clamp(2rem,5vw,3.6rem);margin-bottom:1.25rem;max-width:18ch}
.article-content h2{margin-top:2.5em;font-size:clamp(1.5rem,3vw,2rem)}
.article-content h3{margin-top:1.8em}
.article-content p,.article-content ul,.article-content ol{font-size:1.08rem;line-height:1.78;color:var(--ink-soft)}
.article-content strong{color:var(--ink)}
.article-content > .lede{margin:0 0 3em;font-size:1.3rem;border-left:2px solid var(--gold);padding-left:1.2em;color:var(--ink)}
.article-content ul li,.article-content ol li{line-height:1.7;margin-bottom:.5em}
.article-content ol{counter-reset:n;list-style:none;padding-left:0}
.article-content ol li{counter-increment:n;position:relative;padding-left:2.6em;margin-bottom:1em}
.article-content ol li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.2em;font-family:var(--font-mono);font-size:.7rem;font-weight:500;letter-spacing:.1em;color:var(--gold-deep);background:var(--paper-deep);padding:.25em .55em;line-height:1}

/* ── Pills ───────────────────────────────────────────────────────────── */
.pill{display:inline-block;background:transparent;color:var(--ink-soft);padding:.35rem .75rem;border:1px solid var(--rule-strong);font-family:var(--font-mono);font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;margin:.2rem .25rem .2rem 0}

/* ── Coverage list ───────────────────────────────────────────────────── */
.area-list{columns:2;column-gap:2rem;margin:1.5rem 0;padding:0;list-style:none}
.area-list li{padding:.4rem 0;font-size:1rem;color:var(--ink);break-inside:avoid;border-bottom:1px solid var(--rule);font-family:var(--font-body)}
.area-list li::before{content:"§ ";color:var(--gold);font-style:italic}

/* ── Footer (colophon) ───────────────────────────────────────────────── */
.site-footer{background:var(--navy-deep);color:rgba(241,230,208,.62);padding:clamp(3rem,5vw,4.5rem) 0 1.5rem;font-size:.95rem;position:relative}
.site-footer::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(to right,transparent,var(--gold) 30%,var(--gold) 70%,transparent);opacity:.4}
.site-footer h4{color:var(--paper-light);font-family:var(--font-mono);font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;margin:0 0 1.2rem;position:relative;padding-bottom:.7rem}
.site-footer h4::after{content:"";position:absolute;left:0;bottom:0;width:1.5em;height:1px;background:var(--gold)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2.5rem}
.footer-grid a{color:rgba(241,230,208,.65);text-decoration:none;display:block;padding:.28rem 0;border-bottom:1px solid transparent;background-image:none;font-family:var(--font-body);font-size:.98rem}
.footer-grid a:hover{color:var(--gold-light);border-bottom-color:transparent}
.footer-grid p{font-size:.95rem;line-height:1.6;color:rgba(241,230,208,.55)}
.footer-bottom{border-top:1px solid rgba(241,230,208,.12);margin-top:3rem;padding-top:1.5rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;font-family:var(--font-mono);font-size:.63rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(241,230,208,.4)}

/* ── Utility ─────────────────────────────────────────────────────────── */
.center{text-align:center}
.muted{color:var(--ink-mute)}
.no-mb{margin-bottom:0}
.serif{font-family:var(--font-body)}
.display-font{font-family:var(--font-display)}
.mono{font-family:var(--font-mono)}
.tag{display:inline-block;font-family:var(--font-mono);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep);padding:.2rem .55rem;border:1px solid var(--rule-strong);margin-left:.5rem;vertical-align:middle}

.ornament{text-align:center;font-family:var(--font-display);font-size:1.5rem;color:var(--gold);margin:2.5rem 0;letter-spacing:.7em;padding-left:.7em}
.ornament::before{content:"⚜  ⚜  ⚜"}

/* Legacy class aliases (sub-pages use these) */
.hero-lede{font-family:var(--font-body);font-size:clamp(1.15rem,2.1vw,1.4rem);line-height:1.55;font-style:italic;color:var(--ink-soft);max-width:48ch;margin-bottom:2.5rem;font-feature-settings:"onum","liga","dlig"}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin-bottom:1.5rem}
.hero-meta{margin-top:2rem;display:flex;flex-wrap:wrap;gap:1.5rem 2rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.hero-meta span{display:inline-flex;align-items:center;gap:.4rem}
section.hero h1{font-size:clamp(2.2rem,5.5vw,4rem);max-width:22ch;margin-bottom:1.2rem}
section.hero .eyebrow{color:var(--gold-deep)}
body > main > section.hero:not(.hero-grid *){padding:3rem 0 3.5rem}

/* ── Motion ──────────────────────────────────────────────────────────── */
@keyframes drop{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.hero h1,.hero .lede,.hero .btn-row,.hero-meta-col,.wax-seal-wrap{animation:drop .9s cubic-bezier(.2,.65,.25,1) backwards}
.hero h1{animation-delay:.05s}
.hero .lede{animation-delay:.22s}
.hero .btn-row{animation-delay:.38s}
.hero-meta-col{animation-delay:.5s}
.wax-seal-wrap{animation-delay:.55s;animation-duration:1.4s}

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

::selection{background:var(--gold);color:var(--navy)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}