:root {
  --charcoal: #11110f;
  --charcoal-2: #191713;
  --ink: #211e19;
  --ivory: #ece5d9;
  --paper: #ddd1be;
  --cream: #e9e1d4;
  --brass: #a77d3e;
  --taupe: #8d8272;
  --line-dark: rgba(236, 229, 217, .22);
  --line-light: rgba(33, 30, 25, .2);
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --script: "Segoe Print", "Bradley Hand", cursive;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--charcoal); color: var(--ivory); font-family: var(--serif); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 4px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 20; top: 1rem; left: 1rem; padding: .7rem 1rem; background: var(--ivory); color: var(--ink); transform: translateY(-180%); transition: transform .2s; font: .75rem var(--sans); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: absolute; z-index: 10; inset: 0 0 auto; height: 7.1rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 4.5vw; }
.wordmark {
  position: relative;
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  padding: .75rem 0;
  font: 500 .72rem/1 var(--sans);
  letter-spacing: .42em;
  transition: color .25s ease, text-shadow .25s ease;
}
.wordmark:hover, .wordmark:focus-visible {
  color: #f4e6c9;
  text-shadow: 0 0 14px rgba(167, 125, 62, .3);
}
.wordmark-sparks { position: absolute; inset: 0; pointer-events: none; }
.wordmark-sparks i {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: #ffe3a0;
  box-shadow: 0 0 4px #dfb45e, 0 0 9px rgba(167, 125, 62, .65);
  opacity: 0;
  pointer-events: none;
}
.wordmark:hover .wordmark-sparks i,
.wordmark:focus-visible .wordmark-sparks i {
  animation: golden-dust var(--duration) ease-out var(--delay) infinite both;
}
@keyframes golden-dust {
  0% { opacity: 0; transform: translate(0, 4px) scale(.35); }
  18% { opacity: 1; transform: translate(calc(var(--dx) * .18), calc(var(--dy) * .18)) scale(1); }
  42% { opacity: .55; }
  58% { opacity: .9; transform: translate(calc(var(--dx) * .58), calc(var(--dy) * .58)) scale(.85); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.15); }
}
@media (prefers-reduced-motion: reduce) {
  .wordmark { transition: none; }
  .wordmark:hover .wordmark-sparks i,
  .wordmark:focus-visible .wordmark-sparks i { animation: none; }
}
.monogram { display: block; width: 5.6rem; }
.monogram--animated { position: relative; }
.emblem-animation { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.monogram--animated.is-playing > .brand-emblem { opacity: 0; }
.monogram--animated.is-playing > .emblem-animation { opacity: 1; }
/* The SVG viewBox omits only transparent canvas margins. The PNG is rendered
   at its native square ratio, with uniform scaling and its original alpha. */
.brand-emblem {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 700 / 610;
}
.site-nav { justify-self: end; display: flex; gap: 2.6rem; font: .64rem var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.site-nav a, .site-footer nav a { transition: color .2s; }.site-nav a:hover, .site-footer nav a:hover { color: var(--brass); }
.site-nav a:last-child { position: relative; }.site-nav a:last-child::after { content: ""; position: absolute; height: 1px; background: var(--brass); left: 0; right: 0; bottom: -.7rem; }
.menu-toggle { display: none; background: none; border: 0; color: var(--ivory); padding: .7rem 0 .7rem .7rem; }
.menu-toggle span:not(.sr-only) { display: block; width: 1.6rem; height: 1px; background: currentColor; margin: .4rem 0; }

.hero { min-height: min(52rem, 100vh); position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; padding: 10rem 4.5vw 6rem; background: radial-gradient(circle at 76% 39%, #4b3a25 0, #211b13 14%, transparent 35%), linear-gradient(105deg, #10100e 0%, #16130f 54%, #080807 100%); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .15; background-image: repeating-linear-gradient(115deg, transparent 0 7px, rgba(255,255,255,.05) 8px 9px); mix-blend-mode: soft-light; }
.hero-copy { width: 48%; max-width: 42rem; position: relative; z-index: 2; }
.eyebrow, .section-kicker { margin: 0; color: var(--brass); font: .7rem var(--sans); letter-spacing: .23em; text-transform: uppercase; }
.hero .eyebrow { font-size:.82rem; letter-spacing:.15em; }
.hero .eyebrow span { margin:0 .36rem; }
.eyebrow span { margin: 0 .55rem; color: var(--brass); }
h1, h2, p { margin-top: 0; }.hero h1 { margin: 1.4rem 0 1.7rem; font-size: clamp(3rem, 5.4vw, 5.6rem); line-height: .99; letter-spacing: -.045em; font-weight: 400; }.hero h1 em { color: var(--cream); font-style: normal; }
.hero-pencil { position:relative; z-index:0; display:inline-block; }
.hero-pencil > svg { position:absolute; z-index:2; overflow:visible; pointer-events:none; }
.hero-pencil--strike > svg { left:-.03em; top:50%; width:calc(100% + .1em); height:.43em; transform:translateY(-48%) rotate(-1.2deg); }
.hero-pencil--circle { margin-left:-.1em; padding:.01em .1em .05em; }
.hero-pencil--circle > svg { inset:-.24em -.3em -.18em; width:calc(100% + .6em); height:calc(100% + .42em); transform:rotate(-.7deg); }
.hero-pencil-stroke { fill:none; stroke:#c18d42; stroke-width:2.15; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; filter:drop-shadow(.04em .03em 0 rgba(103,71,30,.24)); }
.hero-pencil-stroke--echo { stroke:#e0b365; stroke-width:1.05; opacity:.58; }
.js-ready .hero-pencil-stroke { stroke-dasharray:1; stroke-dashoffset:1; }
.js-ready .hero-copy.is-visible .hero-pencil--strike .hero-pencil-stroke--main { animation:hero-pencil-draw .78s cubic-bezier(.55,.05,.24,1) .45s forwards; }
.js-ready .hero-copy.is-visible .hero-pencil--strike .hero-pencil-stroke--echo { animation:hero-pencil-draw .7s cubic-bezier(.55,.05,.24,1) .59s forwards; }
.js-ready .hero-copy.is-visible .hero-pencil--circle .hero-pencil-stroke--main { animation:hero-pencil-draw 1.16s cubic-bezier(.52,.06,.23,1) 1.05s forwards; }
.js-ready .hero-copy.is-visible .hero-pencil--circle .hero-pencil-stroke--echo { animation:hero-pencil-draw 1.06s cubic-bezier(.52,.06,.23,1) 1.2s forwards; }
@keyframes hero-pencil-draw { to { stroke-dashoffset:0; } }
.hero-title-divider { display:block; width:4rem; height:1px; margin:.32em 0 .28em; background:var(--brass); }
.rule, .small-rule { width: 2.2rem; height: 1px; background: var(--brass); }.rule { margin-bottom: 1.35rem; }
.hero-intro { max-width: 30rem; color: #cfc5b6; font-size: clamp(1rem, 1.35vw, 1.18rem); line-height: 1.55; }
.hero-intro-copy, .hero-intro-invitation { display:block; }
.hero-keyword { display:inline-block; color:#e3d8c8; font-size:1.09em; font-weight:500; letter-spacing:-.01em; }
.pen-underline { position:relative; display:inline-block; color:#e4dacb; }
.pen-underline::after {
  content:"";
  position:absolute;
  left:-.04em;
  right:-.08em;
  bottom:-.04em;
  height:2px;
  border-radius:55% 42% 58% 46%;
  background:linear-gradient(90deg, transparent 0%, #b7833d 4%, #d2a55d 28%, #9f7134 67%, #c9984d 95%, transparent 100%);
  box-shadow:.08rem .04rem 0 rgba(167,125,62,.3);
  transform:rotate(-.75deg) skewX(-10deg);
  transform-origin:left center;
}
.pen-underline--reverse::after { transform:rotate(.65deg) skewX(8deg); }
.hero-intro-invitation { margin-top:.8rem; color:#ded4c5; font-size:1.12em; line-height:1.5; }
.hero-intro-invitation::before { content:""; display:inline-block; width:1.35rem; height:1px; margin-right:.55rem; vertical-align:.28em; background:var(--brass); transform:rotate(-2deg); }
.hero-intro-invitation strong { color:#e7c78f; font:400 1.03em var(--script); }
.signup-form { display: flex; gap: .65rem; }.signup-form input { min-width: 0; flex: 1; border: 1px solid rgba(236,229,217,.4); background: rgba(10,10,9,.35); color: var(--ivory); padding: .95rem 1rem; border-radius: 0; outline: none; }.signup-form input::placeholder { color: #b5aa9a; }.signup-form input:focus { border-color: var(--brass); }.signup-form button, .outline-button { cursor: pointer; border: 1px solid var(--brass); background: var(--brass); color: #15110c; padding: .95rem 1.25rem; font: 600 .65rem var(--sans); letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; transition: background .2s, color .2s, transform .2s; }.signup-form button:hover { background: #c09754; }.signup-form button:active, .outline-button:active { transform: translateY(1px); }.form-note { color: var(--taupe); font-size: .82rem; margin: 1rem 0 0; }
.hero-scene { position: absolute; z-index: 0; width: 60vw; max-width: 58rem; height: 100%; right: -3vw; top: 0; overflow: hidden; opacity: .94; mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 100%); }.scene-wall { position: absolute; inset: 16% 0 37% 16%; background: radial-gradient(ellipse at 66% 57%, rgba(174,124,57,.4), transparent 38%), #181510; }.window-light { position: absolute; right: 0; top: 0; width: 17%; height: 51%; background: linear-gradient(90deg, rgba(113,83,48,.4), rgba(213,176,111,.18)); border-left: 3px solid rgba(180,143,82,.38); box-shadow: -1.2rem 0 3rem rgba(198,142,63,.14); }.landscape-frame { position: absolute; top: 25%; left: 43%; width: 31%; height: 22%; border: .6rem solid #33291d; outline: 2px solid #9a6d37; background: linear-gradient(#746650, #2e382f); overflow: hidden; transform: rotate(-4deg); }.landscape-frame::before { content:""; position:absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0 7px, rgba(20,17,13,.25) 8px); }.mountain { position: absolute; bottom: -7%; width: 0; height: 0; border-left: 7rem solid transparent; border-right: 7rem solid transparent; border-bottom: 11rem solid #2b2823; }.mountain--back { left: -2rem; border-left-width: 8rem; border-right-width: 8rem; border-bottom-width: 9rem; border-bottom-color:#777563; opacity:.75; }.mountain--front { left: 4rem; border-bottom-color:#252722; }.sun { position:absolute; width:2rem;height:2rem;border-radius:50%; background:#b59a6a; left:48%; top:23%; opacity:.6; }
.book-stack { position: absolute; right: 27%; bottom: 39%; width: 36%; transform: rotate(-2deg); filter: drop-shadow(-.7rem 1rem 1rem rgba(0,0,0,.6)); }.book { height: 2.8rem; padding: 1rem 1.5rem; border-radius: .15rem .5rem .25rem .15rem; border: 1px solid #69502e; color: #a87b3f; font: .65rem var(--serif); letter-spacing: .08em; background: linear-gradient(175deg, #24201a, #0d0d0c); box-shadow: inset 0 -1px 0 #564328, inset 0 1px 0 #564328; }.book--one { width: 100%; }.book--two { width: 88%; margin-left: 5%; }.book--three { width: 95%; margin-left: 2%; }
.pencil-pot { position:absolute; right: 12%; bottom: 48%; width: 4.2rem; height: 5.6rem; border-radius: 0 0 1rem 1rem; border: 1px solid #6c5232; background: linear-gradient(90deg, #120f0c, #4b3821, #16120e); }.pencil-pot span { position:absolute; bottom: 75%; left: 30%; width: 2px; height: 6rem; transform:rotate(-11deg); background:#a3743b; }.pencil-pot span:nth-child(2){transform:rotate(10deg);left:55%;height:7rem}.pencil-pot span:nth-child(3){transform:rotate(25deg);left:75%;height:5.7rem}.pencil-pot span:nth-child(4){transform:rotate(-27deg);left:8%;height:5.4rem}.inkwell { position:absolute; right: 25%; bottom: 33%; width: 3rem;height:2rem;border-radius: 50% 50% 40% 40%;background:#181512;border:1px solid #886330; }.inkwell span { display:block; width:1.3rem;height:.6rem;margin:-.3rem auto 0;border:1px solid #9f783d;border-radius:50%;background:#0b0b09; }
.journal { position:absolute; right: 13%; bottom: 6%; width: 52%; height: 30%; transform:rotate(-3deg); display:flex; padding:1rem; background:linear-gradient(105deg,#b8a98e,#e4d9c5 47%,#bcad92); box-shadow:-1rem 1rem 1rem rgba(0,0,0,.65); }.journal::before { content:""; position:absolute; inset:.3rem; border:1px solid rgba(65,48,30,.5); }.journal-page { position:relative; flex:1; padding:2.1rem .8rem 0; border-right:1px solid rgba(70,52,32,.35); transform:skewY(2deg); }.journal-page--right { border:0; transform:skewY(-2deg); }.journal-page span { display:block; height:1px; margin:.8rem 0; background:rgba(47,36,26,.5); transform:rotate(-4deg); }.pen { position:absolute; width: 36%; height:.4rem; background:#191613; border-radius:1rem; left:39%; top:48%; transform:rotate(28deg); box-shadow:0 0 0 1px #75572e; }
.compass { position:absolute; right: 48%; bottom: 27%; color:#8b6635; font-size:3rem; opacity:.65; }.hero-caption { position:absolute; right: 5vw; bottom: 2rem; z-index:2; color: #847667; font: .6rem var(--sans); letter-spacing:.16em; text-transform:uppercase; }

.section-paper { color: var(--ink); background-color: var(--paper); background-image: radial-gradient(rgba(84,61,31,.08) .7px, transparent .7px); background-size: 5px 5px; }
.about { padding: 6.5rem 4.5vw 7rem; }.about > .section-kicker { color:#72552e; }.about-grid { display:grid; grid-template-columns: 1.03fr .95fr .45fr; align-items:center; gap:6vw; margin-top:1.35rem; }.about-copy h2 { font-size:clamp(2.1rem,3.8vw,4rem); font-weight:400; line-height:1.04; letter-spacing:-.04em; margin:1.3rem 0 1.5rem; }.about-copy p { max-width:32rem; font-size:1.05rem; line-height:1.65; }.about-copy .about-lead { font-size:1.13rem; line-height:1.62; }.about-copy .about-closing { margin-top:1.45rem; font-size:1.08rem; }.about-handnote { display:block; width:fit-content; margin:.2rem 0 .25rem; color:#75552c; font:400 1.4rem/1.25 var(--script); transform:rotate(-.7deg); }.pen-underline--paper { color:#33291d; font-size:1.035em; }.pen-underline--paper::after { height:2px; background:linear-gradient(90deg, transparent 0%, #9b6f32 4%, #bd8b43 32%, #8a612c 70%, #b9833c 95%, transparent 100%); box-shadow:.08rem .04rem 0 rgba(117,85,44,.2); }.text-link { display:inline-flex; gap:.6rem; margin-top:1rem; font:600 .68rem var(--sans); letter-spacing:.18em; text-transform:uppercase; color:#6e532d; border-bottom:1px solid transparent; }.text-link:hover { border-color:currentColor; }.portrait-placeholder { aspect-ratio: .93; min-height: 23rem; position:relative; overflow:hidden; background:linear-gradient(140deg,#998b77,#3a332b); border: .65rem solid var(--cream); box-shadow:0 1rem 2rem rgba(49,37,24,.15); }.portrait-placeholder::before { content:""; position:absolute; inset:0; opacity:.25; background: repeating-linear-gradient(120deg,transparent 0 5px, #201b15 6px 7px); }.portrait-silhouette { position:absolute; width:44%; height:68%; left:30%; bottom:0; background:linear-gradient(100deg,#211d18,#75644e 42%,#181512 78%); clip-path:polygon(43% 0,65% 4%,79% 16%,86% 35%,75% 49%,100% 100%,0 100%,20% 54%,26% 24%); }.portrait-silhouette span { position:absolute; width:38%; height:27%; border-radius:50%; left:30%; top:3%; background:#5f4d3a; }.portrait-label { position:absolute; left:1rem; bottom:1rem; color:var(--cream); font: .66rem var(--sans); letter-spacing:.15em; text-transform:uppercase; }.portrait-label small { color:#d6c1a1; }.pullquote { align-self:stretch; padding: 2rem 0 0; position:relative; }.pullquote .small-rule { background:#8e6b3d; }.pullquote p { margin:1.3rem 0; font:italic 1.2rem/1.5 var(--script); }.pullquote cite { font:italic 1rem var(--serif); }.compass--light { position:absolute; right:0; bottom:0; color:#9e896a; font-size:4rem; opacity:.48; }

.letters { position:relative; min-height:44rem; display:grid; place-items:center; padding:7rem 4.5vw; overflow:hidden; background:linear-gradient(130deg,#11110f,#1b1712); }.letters::before { content:""; position:absolute; inset:0; opacity:.13; background-image: repeating-linear-gradient(40deg,transparent 0 9px, #a77d3e 10px 11px); }.envelope-shape { position:absolute; width:48%; height:65%; left:2%; bottom:-26%; transform:rotate(-16deg); border:1px solid rgba(167,125,62,.35); background:linear-gradient(140deg,#211b15,#0e0e0c); box-shadow:0 2rem 2rem #080806; }.envelope-shape::before { content:"F  +  M"; position:absolute; left:35%; top:35%; width:5rem;height:5rem; display:grid;place-items:center;border:1px solid #855e2b;border-radius:50%;color:#b4894b;font:1rem var(--serif); }.letter-card { position:relative; z-index:1; width:min(100%, 55rem); padding:2.2rem 4.5rem 3.3rem; color:var(--ink); background-color:var(--cream); background-image:radial-gradient(rgba(84,61,31,.09) .7px,transparent .7px); background-size:5px 5px; box-shadow:0 1.4rem 3rem rgba(0,0,0,.4); transform:rotate(-.6deg); }.letter-card::after { content:""; position:absolute; inset:1.1rem; border:1px solid rgba(80,61,37,.25); pointer-events:none; }.letter-meta, .letter-rule, .letter-grid { position:relative; z-index:1; }.letter-meta { display:flex; justify-content:space-between; align-items:flex-start; font: .72rem var(--sans); letter-spacing:.18em; text-transform:uppercase; }.letter-meta small { display:block; margin-top:.65rem; font-size:.55rem; letter-spacing:.2em; }.letter-rule { height:2.2rem; margin-top:1rem; border-top:1px solid var(--line-light); text-align:center; }.letter-rule span { position:relative; top:-.72rem; padding:0 1rem; background:var(--cream); font-size:.9rem; }.letter-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:4rem; }.letter-copy h2 { margin:0 0 1rem; font-size:clamp(2.2rem,4vw,3.3rem); line-height:1; letter-spacing:-.04em; font-weight:400; }.letter-copy p { font-size:.96rem; line-height:1.55; }.letter-copy .letter-lead { font-size:1rem; line-height:1.62; }.letter-copy .letter-reflection { margin-top:1.3rem; }.letter-handnote { display:block; width:fit-content; max-width:100%; margin:0 0 .35rem; color:#75552c; font:400 1.3rem/1.25 var(--script); transform:rotate(-.55deg); }.signup-form--letter input { color:var(--ink); background:rgba(255,255,255,.12); border-color:rgba(33,30,25,.4); }.signup-form--letter button { background:var(--ink); border-color:var(--ink); color:var(--cream); }.signup-form--letter button:hover { background:#4a3928; }.letter-copy .form-note { color:#6e6252; }.letter-signature { padding:1.2rem 0 0 2.8rem; border-left:1px solid rgba(33,30,25,.23); font:italic 1.05rem/1.8 var(--script); }.letter-signature p { margin-bottom:3rem; }.letter-signature strong { display:block; font:italic 1.45rem var(--script); transform:rotate(-6deg); }.letter-signature i { display:block; width:7rem; height:1px; margin-top:.2rem; background:var(--ink); transform:rotate(-8deg); }

.youtube { background:#0d0d0b; border-top:1px solid var(--line-dark); }.youtube-inner { min-height:14rem; position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:1.5rem; align-items:center; padding:3.5rem 4.5vw; overflow:hidden; }.youtube-mark { width:2.4rem;height:1.65rem;display:grid;place-items:center;border-radius:.35rem;background:var(--brass);color:#15110c;font: .75rem Arial; }.youtube-copy { position:relative; z-index:1; }.youtube-copy .section-kicker { font-size:.58rem; margin-bottom:1rem; }.youtube h2 { margin:0 0 .55rem; font-size:1.7rem; font-weight:400; line-height:1.05; }.youtube-copy p { margin:0; color:#b5aa9a; font-size:.88rem; }.youtube-art { position:absolute; inset:0 0 0 45%; opacity:.43; background:linear-gradient(90deg,#0d0d0b 4%,transparent 34%), linear-gradient(170deg,#33291d,#131310); }.video-mountain { position:absolute; bottom:-35%; left:43%; width:0;height:0;border-left:12rem solid transparent;border-right:12rem solid transparent;border-bottom:13rem solid #2c312d; }.video-person { position:absolute; bottom:17%; left:67%; width:.4rem; height:2rem; background:#12110f; }.outline-button { position:relative; z-index:1; background:transparent; color:var(--ivory); }.outline-button:hover { background:var(--brass); color:#15110c; }
.site-footer { padding:2.5rem 4.5vw 1.1rem; background:#11110f; color:#cfc5b6; }.footer-top { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:2rem; padding-bottom:2.1rem; border-bottom:1px solid var(--line-dark); }.footer-top p { margin:0; font-size:.8rem; line-height:1.5; }.monogram--footer { color:var(--ivory); font-size:1.4rem; }.monogram--footer i { height:2.4rem; }.footer-top nav { justify-self:end; display:flex; gap:1.45rem; font: .58rem var(--sans); letter-spacing:.13em; text-transform:uppercase; }.footer-bottom { display:flex; justify-content:space-between; padding-top:1rem; color:#756c60; font: .55rem var(--sans); letter-spacing:.16em; text-transform:uppercase; }
.reveal { opacity:1; transform:none; }.js-ready .reveal { opacity:0; transform:translateY(1rem); transition:opacity .75s ease, transform .75s ease; }.js-ready .reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 900px) { .site-header { height:5.8rem; padding:0 6vw; }.wordmark { font-size:.63rem; letter-spacing:.29em; }.hero { min-height:52rem; padding:9rem 6vw 5rem; align-items:flex-start; }.hero-copy { width:70%; }.hero-scene { width:90vw; right:-20vw; top:13%; opacity:.65; }.about { padding:5rem 6vw; }.about-grid { grid-template-columns:1fr 1fr; gap:3rem; }.pullquote { grid-column:1/-1; padding:0; max-width:24rem; }.letters { padding:5rem 6vw; }.letter-card { padding:2rem 2.5rem 2.8rem; }.youtube-inner { padding:3rem 6vw; } }
@media (max-width: 640px) { .site-header { grid-template-columns:1fr auto; }.site-header > .monogram { position:absolute; left:50%; transform:translateX(-50%); }.site-nav { position:absolute; top:5.8rem; left:0; right:0; display:none; padding:1.2rem 6vw 1.5rem; background:#11110f; border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); flex-direction:column; gap:1.2rem; }.site-nav.is-open { display:flex; }.site-nav a:last-child::after { display:none; }.menu-toggle { display:block; justify-self:end; }.hero { min-height:47rem; padding-top:8rem; }.hero-copy { width:100%; }.hero h1 { font-size:clamp(2.8rem,12vw,4.2rem); }.hero-intro { max-width:22rem; font-size:1rem; }.signup-form { flex-direction:column; max-width:25rem; }.signup-form button { width:100%; }.hero-scene { width:130vw; right:-65vw; top:26%; opacity:.5; }.hero-caption { right:6vw; bottom:1.5rem; }.about { padding:4.5rem 6vw 5rem; }.about-grid { grid-template-columns:1fr; gap:2.5rem; }.about-copy h2 { font-size:2.7rem; }.portrait-placeholder { min-height:20rem; width:min(100%,21rem); }.pullquote { grid-column:auto; }.letters { padding:4rem 5vw; min-height:43rem; }.letter-card { padding:1.7rem 1.4rem 2rem; }.letter-card::after { inset:.7rem; }.letter-grid { grid-template-columns:1fr; gap:1.4rem; }.letter-signature { border-left:0; border-top:1px solid rgba(33,30,25,.23); padding:1.4rem 0 0; }.letter-signature p { margin-bottom:1.1rem; }.youtube-inner { grid-template-columns:auto 1fr; padding:2.8rem 6vw; }.youtube-art { left:25%; opacity:.28; }.outline-button { grid-column:2; justify-self:start; }.footer-top { grid-template-columns:1fr auto; }.footer-top nav { grid-column:1/-1; justify-self:start; flex-wrap:wrap; gap:1rem 1.3rem; }.footer-bottom { margin-top:.8rem; }.monogram--footer { justify-self:end; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; }.js-ready .reveal { transition:none; } }
@media (prefers-reduced-motion: reduce) { .js-ready .hero-pencil-stroke { animation:none !important; stroke-dashoffset:0; } }

.monogram--footer { width: 4.4rem; }
.envelope-shape::before { content: none; }
.envelope-seal {
  position: absolute;
  left: 35%;
  top: 35%;
  width: 5rem;
  height: 5rem;
  display: grid;
  place-items: center;
  padding: .65rem;
  border: 1px solid #855e2b;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #302218, #15110e 75%);
  box-shadow: inset 0 0 0 3px #241a12, 0 .25rem .6rem #0006;
}
@media (max-width: 640px) {
  .site-header { grid-template-columns: minmax(0, 1fr) auto auto; gap: .8rem; }
  .site-header > .monogram { position: static; transform: none; width: 3.8rem; }
  .site-header > .monogram--animated { position: relative; left: auto; }
}

/* Legal pages: the same editorial world, with a calmer reading rhythm. */
.legal-page { background:#11110f; }
.legal-page .site-header { position:absolute; border-bottom:1px solid rgba(236,229,217,.08); }
.legal-page .site-nav a:last-child::after { display:none; }
.legal-main { min-height:100vh; }
.legal-hero {
  position:relative;
  overflow:hidden;
  padding:11.5rem 4.5vw 5.5rem;
  background:
    radial-gradient(circle at 82% 35%, rgba(167,125,62,.22), transparent 27%),
    repeating-linear-gradient(115deg, transparent 0 9px, rgba(255,255,255,.018) 10px 11px),
    linear-gradient(110deg,#11110f,#1c1812 62%,#0b0b0a);
}
.legal-hero::after { content:""; position:absolute; right:7vw; bottom:-7rem; width:18rem; height:18rem; border:1px solid rgba(167,125,62,.22); border-radius:50%; box-shadow:inset 0 0 0 2.8rem rgba(167,125,62,.025); }
.legal-hero-inner { position:relative; z-index:1; width:min(100%,68rem); margin:0 auto; }
.legal-hero h1 { max-width:50rem; margin:1.15rem 0 1.25rem; font-size:clamp(3rem,6vw,6rem); font-weight:400; line-height:.98; letter-spacing:-.045em; }
.legal-hero-intro { max-width:42rem; margin:0; color:#cfc5b6; font-size:clamp(1.05rem,1.6vw,1.3rem); line-height:1.58; }
.legal-meta { display:flex; flex-wrap:wrap; gap:.65rem 1.4rem; margin-top:2rem; color:#998d7c; font:.65rem var(--sans); letter-spacing:.16em; text-transform:uppercase; }
.legal-content { padding:5rem 4.5vw 7rem; color:var(--ink); background-color:var(--paper); background-image:radial-gradient(rgba(84,61,31,.08) .7px,transparent .7px); background-size:5px 5px; }
.legal-layout { width:min(100%,68rem); margin:0 auto; display:grid; grid-template-columns:13rem minmax(0,1fr); gap:5rem; align-items:start; }
.legal-toc { position:sticky; top:2rem; padding-top:.3rem; }
.legal-toc p { margin:0 0 1.15rem; color:#72552e; font:600 .66rem var(--sans); letter-spacing:.2em; text-transform:uppercase; }
.legal-toc a { display:block; padding:.5rem 0; color:#615442; font:.78rem/1.35 var(--sans); border-bottom:1px solid rgba(33,30,25,.1); }
.legal-toc a:hover { color:#8c652f; }
.legal-document { max-width:46rem; }
.legal-pending { margin:0 0 3.25rem; padding:1.4rem 1.5rem; border-left:3px solid var(--brass); background:rgba(255,255,255,.2); }
.legal-pending strong { display:block; margin-bottom:.45rem; color:#68491f; font:.67rem var(--sans); letter-spacing:.16em; text-transform:uppercase; }
.legal-pending p { margin:0; color:#554837; font:.92rem/1.6 var(--sans); }
.legal-section { padding:0 0 2.8rem; margin:0 0 2.8rem; border-bottom:1px solid rgba(33,30,25,.17); scroll-margin-top:2rem; }
.legal-section:last-child { margin-bottom:0; border-bottom:0; }
.legal-section-number { display:block; margin-bottom:.65rem; color:#8b6635; font:.66rem var(--sans); letter-spacing:.18em; text-transform:uppercase; }
.legal-section h2 { margin:0 0 1rem; font-size:clamp(1.75rem,3vw,2.5rem); font-weight:400; line-height:1.08; letter-spacing:-.025em; }
.legal-section h3 { margin:1.6rem 0 .55rem; font-size:1.13rem; font-weight:400; }
.legal-section p, .legal-section li { color:#3f372c; font-size:1rem; line-height:1.72; }
.legal-section p { margin-bottom:1rem; }
.legal-section ul { margin:.8rem 0 1.2rem; padding-left:1.2rem; }
.legal-section li { margin-bottom:.55rem; padding-left:.25rem; }
.legal-section a { color:#72552e; text-decoration:underline; text-decoration-color:rgba(114,85,46,.45); text-underline-offset:.2em; }
.legal-section a:hover { text-decoration-color:currentColor; }
.legal-data { display:grid; grid-template-columns:11rem 1fr; margin:1.2rem 0; border-top:1px solid rgba(33,30,25,.17); }
.legal-data dt, .legal-data dd { margin:0; padding:.8rem 0; border-bottom:1px solid rgba(33,30,25,.17); }
.legal-data dt { color:#72552e; font:.69rem/1.45 var(--sans); letter-spacing:.1em; text-transform:uppercase; }
.legal-data dd { color:#3f372c; font:1rem/1.55 var(--serif); }
.legal-placeholder { color:#8b6635; font-style:italic; }
.legal-page .site-footer { border-top:1px solid var(--line-dark); }
.form-note a { text-decoration:underline; text-decoration-color:rgba(167,125,62,.55); text-underline-offset:.18em; }
.form-note a:hover { color:#d7b678; text-decoration-color:currentColor; }
.signup-form--letter + .form-note a:hover { color:#72552e; }
@media (max-width:900px) {
  .legal-hero { padding:9.5rem 6vw 4.5rem; }
  .legal-content { padding:4.5rem 6vw 6rem; }
  .legal-layout { grid-template-columns:1fr; gap:2.5rem; }
  .legal-toc { position:static; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1.5rem; }
  .legal-toc p { grid-column:1/-1; }
}
@media (max-width:640px) {
  .legal-hero { padding:8.5rem 6vw 3.8rem; }
  .legal-hero h1 { font-size:clamp(2.7rem,14vw,4.3rem); }
  .legal-content { padding:3.5rem 6vw 5rem; }
  .legal-toc { grid-template-columns:1fr; }
  .legal-data { grid-template-columns:1fr; }
  .legal-data dt { padding-bottom:.2rem; border-bottom:0; }
  .legal-data dd { padding-top:.2rem; }
}

/* Give the decorative book its own space below the quotation on narrow screens. */
.pullquote { padding-bottom: 4.5rem; }
.book-mark { position: absolute; right: 0; bottom: 0; width: 4rem; height: 3.25rem; color: #9e896a; opacity: .65; }

/* A restrained echo of the wordmark's golden dust around both letter buttons. */
.spark-button {
  position: relative;
  isolation: isolate;
  overflow: visible;
}
.spark-button .button-label { position: relative; z-index: 2; }
.button-sparks { position: absolute; z-index: 1; inset: -.75rem; pointer-events: none; }
.button-sparks i {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: #ffe3a0;
  box-shadow: 0 0 4px #dfb45e, 0 0 9px rgba(167, 125, 62, .65);
  opacity: 0;
}
.button-sparks i:nth-child(1)  { --x: 5%;  --y: 70%; --dx: -9px; --dy: -21px; --size: 2px;   --delay: -1.1s; --duration: 2.4s; }
.button-sparks i:nth-child(2)  { --x: 16%; --y: 18%; --dx: -4px; --dy: -18px; --size: 1.5px; --delay: -.3s;  --duration: 2.7s; }
.button-sparks i:nth-child(3)  { --x: 30%; --y: 88%; --dx:  5px; --dy: -24px; --size: 2.5px; --delay: -1.7s; --duration: 2.8s; }
.button-sparks i:nth-child(4)  { --x: 43%; --y: 12%; --dx: -6px; --dy: -20px; --size: 2px;   --delay: -.8s;  --duration: 2.3s; }
.button-sparks i:nth-child(5)  { --x: 57%; --y: 90%; --dx:  7px; --dy: -25px; --size: 1.5px; --delay: -2s;   --duration: 2.9s; }
.button-sparks i:nth-child(6)  { --x: 70%; --y: 15%; --dx:  4px; --dy: -19px; --size: 2.5px; --delay: -1.3s; --duration: 2.6s; }
.button-sparks i:nth-child(7)  { --x: 84%; --y: 82%; --dx: -5px; --dy: -23px; --size: 2px;   --delay: -.5s;  --duration: 2.5s; }
.button-sparks i:nth-child(8)  { --x: 96%; --y: 38%; --dx:  9px; --dy: -17px; --size: 1.5px; --delay: -1.8s; --duration: 2.8s; }
.button-sparks i:nth-child(9)  { --x: 1%;  --y: 35%; --dx: -8px; --dy: -16px; --size: 1.5px; --delay: -.1s;  --duration: 2.2s; }
.button-sparks i:nth-child(10) { --x: 91%; --y: 10%; --dx:  6px; --dy: -22px; --size: 2px;   --delay: -1.5s; --duration: 2.7s; }
.spark-button:hover,
.spark-button:focus-visible {
  box-shadow: 0 0 0 1px rgba(255, 227, 160, .2), 0 0 20px rgba(167, 125, 62, .18);
}
.spark-button:hover .button-sparks i,
.spark-button:focus-visible .button-sparks i {
  animation: button-golden-dust var(--duration) ease-out var(--delay) infinite both;
}
@keyframes button-golden-dust {
  0% { opacity: 0; transform: translate(0, 3px) scale(.3); }
  16% { opacity: .95; transform: translate(calc(var(--dx) * .16), calc(var(--dy) * .16)) scale(1); }
  46% { opacity: .42; }
  61% { opacity: .82; transform: translate(calc(var(--dx) * .61), calc(var(--dy) * .61)) scale(.72); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.12); }
}
@media (prefers-reduced-motion: reduce) {
  .spark-button:hover .button-sparks i,
  .spark-button:focus-visible .button-sparks i { animation: none; }
}

/* Native cursor assets keep the pointer precise, without a following overlay. */
@media (any-hover: hover) and (any-pointer: fine) {
  html { cursor: url("assets/cursor-gold-arrow.svg") 4 3, auto; }
  a, button, .signup-form button, .outline-button, [role="button"], summary {
    cursor: url("assets/cursor-gold-hand.svg") 12 3, pointer;
  }
  input, textarea, [contenteditable="true"] {
    cursor: url("assets/cursor-gold-text.svg") 12 16, text;
  }
}