@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght,SOFT,WONK@0,9..144,300..700,0..100,0..1;1,9..144,300..700,0..100,0..1&family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');

/* The written pages: terms, privacy, refunds, contact, and the 404. */
:root { --cream: #EFE2C8; --ink: #2B1E14; --ink-60: rgba(43, 30, 20, .66); --ink-40: rgba(43, 30, 20, .46); --gold: #9C6B24; --gold-2: #B8892E; --hair: rgba(156, 107, 36, .32);
  --serif: 'Fraunces', 'Iowan Old Style', Georgia, serif; --sans: 'Instrument Sans', 'Helvetica Neue', Arial, sans-serif; }
* { box-sizing: border-box; }
html { background: var(--cream); }
body { margin: 0; min-height: 100svh; color: var(--ink); font: 16px/1.6 var(--sans); -webkit-font-smoothing: antialiased;
  background: linear-gradient(rgba(239, 226, 200, .9), rgba(239, 226, 200, .9)), url('../styles/assets/hall/marble-cream.webp') center / 900px; background-attachment: fixed; }
.mast { display: flex; justify-content: space-between; align-items: center; padding: 26px clamp(20px, 4vw, 48px); }
.mast a { color: var(--ink); text-decoration: none; }
.mast .mark { font: 500 20px/1 var(--serif); font-variation-settings: 'opsz' 24, 'SOFT' 40; white-space: nowrap; }
.mast nav { display: flex; gap: 22px; }
.mast nav a { font: 600 11px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; opacity: .8; }
.mast nav a:hover, .mast nav a[aria-current] { opacity: 1; }
main { width: min(680px, calc(100% - 40px)); margin: clamp(30px, 6vh, 80px) auto 80px; position: relative; padding: clamp(36px, 5vw, 64px); border: 1px solid var(--hair); border-radius: 22px; background: rgba(255, 252, 245, .5); }
main::after { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(156, 107, 36, .22); border-radius: 15px; pointer-events: none; }
.kicker { margin: 0 0 16px; font: 600 11px/1 var(--sans); letter-spacing: .26em; text-transform: uppercase; color: var(--gold); }
h1 { margin: 0; font: 400 clamp(36px, 5vw, 56px)/1.02 var(--serif); font-variation-settings: 'opsz' 144, 'SOFT' 30, 'WONK' 1; letter-spacing: -.02em; }
h1 em { font-style: italic; color: var(--gold); }
.lede { margin: 18px 0 0; font: italic 400 19px/1.45 var(--serif); color: var(--ink-60); }
h2 { margin: 36px 0 8px; font: 400 22px/1.2 var(--serif); font-variation-settings: 'opsz' 24, 'SOFT' 40; }
p { margin: 0 0 14px; color: var(--ink-60); }
p b { color: var(--ink); font-weight: 600; }
ul { margin: 0 0 14px; padding-left: 20px; color: var(--ink-60); }
li { margin-bottom: 6px; }
a { color: var(--gold); }
.btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; padding: 0 22px; height: 44px; border-radius: 999px; text-decoration: none; font: 600 13px/1 var(--sans); letter-spacing: .04em; background: var(--gold-2); color: #FFF8EA; }
.btn:hover { background: var(--gold); }
.foot { margin: 40px 0 0; padding-top: 18px; border-top: 1px solid var(--hair); display: flex; flex-wrap: wrap; gap: 8px 18px; font: 500 12px/1 var(--sans); }
.foot a { color: var(--ink-60); text-decoration: none; border-bottom: 1px solid rgba(156, 107, 36, .35); padding-bottom: 2px; }
.foot a:hover { color: var(--ink); }
.foot span { color: var(--ink-40); margin-left: auto; }
.updated { margin-top: 18px; font: italic 400 13px/1 var(--serif); color: var(--ink-40); }
@media (max-width: 720px) { .mast { padding: 18px 20px; gap: 12px; } .mast nav { gap: 12px; flex-wrap: wrap; justify-content: flex-end; } .mast nav a { font-size: 10px; letter-spacing: .12em; } .mast nav a:nth-child(1) { display: none; } main { margin-top: 10px; } }
