@font-face{font-family:Cormorant;src:url('/assets/cormorant-regular.ttf') format('truetype');font-display:swap;font-weight:400;font-style:normal}
@font-face{font-family:Cormorant;src:url('/assets/cormorant-medium.ttf') format('truetype');font-display:swap;font-weight:500;font-style:normal}
@font-face{font-family:Cormorant;src:url('/assets/cormorant-italic.ttf') format('truetype');font-display:swap;font-weight:400;font-style:italic}
:root{--u:min(1px,.15625vw);--paper:#f6f3ec;--ink:#2a100e;--gold:#c6a05e;--green:#10291d;--serif:Cormorant,'Times New Roman',serif;--sans:var(--serif);font-family:var(--serif);color:var(--paper);background:#06160e}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(#00100745,#00100745),#07190f url('/assets/forest-texture.png') center top/1000px auto repeat;min-width:280px}a{color:inherit}h1,h2,h3,p{margin:0}button,input{font:inherit}a,button,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:5px}::selection{background:var(--gold);color:var(--ink)}.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;top:-100px;left:16px;padding:12px;background:var(--paper);color:var(--ink);z-index:10}.skip-link:focus{top:16px}.design-page{max-width:640px;margin:auto;padding-bottom:calc(48 * var(--u))}.hero{text-align:center;padding-top:calc(64 * var(--u))}.crest{display:flex;align-items:center;justify-content:center;gap:calc(20 * var(--u));height:calc(66 * var(--u));margin-bottom:calc(31 * var(--u))}.crest>span{width:calc(95 * var(--u));height:1px;background:var(--gold);transform:translateY(calc(-8 * var(--u)))}.crest i{display:block;width:calc(56 * var(--u));height:calc(66 * var(--u));background:url('/assets/design-reference.jpg') 50% 5.272% /1142.857% 1939.394%;mix-blend-mode:lighten}.hero h1{font-size:calc(80 * var(--u));line-height:.925;font-weight:400;letter-spacing:calc(-2.1 * var(--u))}.gold-rule{height:1px;width:calc(45 * var(--u));margin:calc(28 * var(--u)) auto calc(23 * var(--u));background:var(--gold)}.hero-tagline{font-size:calc(40 * var(--u));line-height:1.075;letter-spacing:calc(-.5 * var(--u))}.join-link{display:flex;width:calc(405 * var(--u));height:calc(64 * var(--u));justify-content:center;align-items:center;margin:calc(38 * var(--u)) auto 0;border:1.5px solid var(--gold);border-radius:2px;text-decoration:none;font-family:var(--sans);font-size:max(12px,calc(20 * var(--u)));font-weight:500;letter-spacing:calc(4 * var(--u));transition:background .2s}.join-link:hover{background:#c6a05e20}.hero-audience{font-family:var(--sans);font-size:max(14px,calc(21 * var(--u)));font-weight:300;line-height:1.45;margin:calc(21 * var(--u)) auto calc(37 * var(--u));color:#e3e1d9}.gold-panel{display:flex;position:relative;flex-direction:column;justify-content:flex-end;align-items:center;margin:0 calc(25 * var(--u));height:calc(590 * var(--u));border:1px solid var(--gold);border-radius:calc(32 * var(--u));overflow:hidden;text-decoration:none;background:url('/assets/design-reference.jpg') center 84.733% /108.475% 259.109%;padding-bottom:calc(13 * var(--u));gap:calc(9 * var(--u))}.gold-panel:before{content:'';position:absolute;inset:65% 0 0;background:linear-gradient(transparent,#080b0580);pointer-events:none}.gold-panel span{position:relative;font-size:max(12px,calc(15 * var(--u)));letter-spacing:calc(3 * var(--u))}.gold-panel svg{position:relative;color:var(--gold);height:calc(40 * var(--u));width:calc(18 * var(--u))}.letter{color:var(--ink);background-color:var(--paper);background-image:url('/assets/parchment-texture.png');background-position:center;background-size:cover;margin:calc(40 * var(--u)) calc(25 * var(--u)) 0;border-radius:calc(35 * var(--u));padding:calc(38 * var(--u)) calc(34 * var(--u)) calc(44 * var(--u));text-align:center;box-shadow:0 0 0 1px #ffffff15;scroll-margin-top:24px}.letter-seal{width:calc(200 * var(--u));height:calc(70 * var(--u));margin-bottom:calc(28 * var(--u));overflow:visible}.letter-seal text{font-family:var(--serif);fill:var(--ink);font-size:16px;letter-spacing:4px}.letter h2{font-size:calc(60 * var(--u));line-height:1.01;font-weight:400;letter-spacing:calc(-2.4 * var(--u));transform:scaleX(.91);margin-inline:calc(-25 * var(--u))}.letter-intro{font-size:max(16px,calc(27 * var(--u)));line-height:1.18;letter-spacing:calc(-.55 * var(--u));margin:calc(34 * var(--u)) auto calc(49 * var(--u))}.inside-label{font-size:max(12px,calc(17 * var(--u)));font-weight:400;letter-spacing:calc(5.2 * var(--u));color:#756055}.topics{list-style:none;padding:0;margin:calc(10 * var(--u)) 0 calc(31 * var(--u));text-align:left}.topics li{display:grid;grid-template-columns:calc(109 * var(--u)) 1fr;align-items:center;min-height:calc(79 * var(--u));border-bottom:1px solid #aea39b}.topics li:last-child{border-bottom:0}.topics span{font-size:calc(39 * var(--u));text-align:center;letter-spacing:calc(-3 * var(--u));padding-right:calc(15 * var(--u))}.topics p{font-size:max(16px,calc(27 * var(--u)));letter-spacing:calc(-.45 * var(--u));line-height:1.22}.newsletter-signup{scroll-margin-top:30px}.reference-form{display:grid;gap:calc(16 * var(--u))}.reference-form input{width:100%;min-width:0;height:calc(72 * var(--u));min-height:46px;padding:0 calc(27 * var(--u));background:transparent;border:1px solid #3b2522;border-radius:3px;color:var(--ink);font-size:max(16px,calc(23 * var(--u)))}.reference-form input::placeholder{color:#9d817f;opacity:1}.reference-form button{width:100%;min-height:46px;height:calc(72 * var(--u));border:1px solid #2e4434;border-radius:3px;background:var(--green);color:var(--paper);font-size:max(12px,calc(21 * var(--u)));letter-spacing:calc(4.3 * var(--u));cursor:pointer;transition:background .2s}.reference-form button:hover{background:#234732}#signup-status{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--ink)}.letter-signoff{font-size:max(16px,calc(22 * var(--u)));font-style:italic;margin-top:calc(28 * var(--u));line-height:1.4}.beehiiv-embed{font-size:16px}.beehiiv-embed iframe{max-width:100%}
@media(min-width:900px){body{background-size:1400px auto}.design-page{padding-top:18px;padding-bottom:70px}}
@media(max-width:360px){.topics li{grid-template-columns:45px 1fr;min-height:56px}.topics p{font-size:16px}.hero-audience{font-size:14px}.letter{padding-inline:18px}.letter-intro{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

.gold-visual{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.gold-panel:before{z-index:1}.gold-scroll{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:calc(9 * var(--u));padding-bottom:calc(13 * var(--u));text-decoration:none}

/* Desktop: a scrolling editorial column beside a persistent brand panel. */
@media(min-width:1000px){
  body{background-size:cover;background-attachment:fixed}
  .design-page{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(310px,1fr);grid-template-rows:auto auto;gap:28px;max-width:1920px;padding:24px;margin-inline:auto;align-items:start}
  .hero{grid-column:2;grid-row:1 / 3;position:sticky;top:24px;min-height:650px;height:calc(100svh - 48px);max-height:1100px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 12px}
  .crest{height:52px;gap:18px;margin-bottom:30px;flex-shrink:0}
  .crest>span{width:58px;transform:translateY(-6px)}
  .crest i{width:44px;height:52px}
  .hero h1{font-size:clamp(54px,4.8vw,84px);letter-spacing:-1.8px;line-height:.96}
  .gold-rule{width:38px;margin:27px auto 24px;flex-shrink:0}
  .hero-tagline{font-size:clamp(26px,2.35vw,38px);line-height:1.12;letter-spacing:-.45px}
  .join-link{width:100%;max-width:340px;min-height:48px;height:auto;padding:17px 12px;margin-top:31px;font-size:13px;letter-spacing:2.7px;flex-shrink:0}
  .hero-audience{font-size:clamp(14px,1.14vw,18px);line-height:1.55;max-width:360px;margin:24px auto 0}
  .gold-panel{grid-column:1;grid-row:1;margin:0;width:100%;height:calc(100svh - 48px);min-height:650px;max-height:1100px;border-radius:28px}
  .gold-scroll{padding-bottom:27px;gap:13px}
  .gold-scroll span{font-size:13px;letter-spacing:3px}
  .gold-scroll svg{height:36px}
  .letter{grid-column:1;grid-row:2;margin:0;padding:64px clamp(35px,5vw,90px) 60px;border-radius:28px;scroll-margin-top:24px}
  .letter-seal{width:220px;height:77px;margin-bottom:35px}
  .letter h2{font-size:clamp(58px,5.2vw,82px);line-height:1.01;margin-inline:0;letter-spacing:-2.4px}
  .letter-intro{max-width:650px;font-size:clamp(23px,1.95vw,29px);line-height:1.3;letter-spacing:-.4px;margin:38px auto 50px}
  .inside-label{font-size:15px;letter-spacing:4px}
  .topics{margin:18px 0 36px}
  .topics li{grid-template-columns:75px 1fr;min-height:85px}
  .topics span{font-size:34px;padding-right:12px}
  .topics p{font-size:clamp(21px,1.8vw,28px);line-height:1.3}
  .reference-form{gap:15px}
  .reference-form input{height:66px;font-size:22px;padding:0 24px}
  .reference-form button{height:66px;font-size:17px;letter-spacing:3px}
  .letter-signoff{font-size:21px;margin-top:27px}
}
@media(min-width:1000px) and (max-height:740px){
  .hero{top:16px;min-height:570px;height:calc(100svh - 32px);padding-block:16px}
  .crest{margin-bottom:20px;height:46px}.crest i{width:39px;height:46px}
  .hero h1{font-size:clamp(52px,4.3vw,70px)}
  .gold-rule{margin-block:20px}.hero-tagline{font-size:28px}
  .join-link{margin-top:24px}.hero-audience{margin-top:19px}
  .gold-panel{min-height:570px}
}

/* Buysiders-inspired refinement: one editorial face, soft paper, and restrained motion. */
body{overflow-x:hidden}
.hero-audience{font-weight:400}
.letter{background-color:#f6f3ec;background-image:linear-gradient(rgba(255,255,255,.64),rgba(250,248,243,.7)),url('/assets/parchment-texture.png');background-position:center;background-size:cover;box-shadow:0 0 0 1px #ffffff30,0 16px 50px #020b0630}
.letter-intro{letter-spacing:-.01em}.topics p{letter-spacing:0}.inside-label{font-weight:500}
@keyframes mb-reveal{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes mb-cover-in{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
.motion-enabled .hero .crest,.motion-enabled .hero h1,.motion-enabled .hero .gold-rule,.motion-enabled .hero .hero-tagline,.motion-enabled .hero .join-link,.motion-enabled .hero .hero-audience{animation:mb-reveal 1.05s cubic-bezier(.22,1,.36,1) both}
.motion-enabled .hero .crest{animation-delay:.08s}.motion-enabled .hero h1{animation-delay:.2s}.motion-enabled .hero .gold-rule{animation-delay:.32s}.motion-enabled .hero .hero-tagline{animation-delay:.42s}.motion-enabled .hero .join-link{animation-delay:.56s}.motion-enabled .hero .hero-audience{animation-delay:.68s}
.motion-enabled .gold-panel{animation:mb-cover-in 1.35s cubic-bezier(.22,1,.36,1) .1s both}
.motion-enabled .gold-visual{transition:transform .12s linear;will-change:transform}
.motion-enabled .scroll-reveal{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}
.motion-enabled .scroll-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
.motion-enabled .letter h2.scroll-reveal{transform:translate3d(0,22px,0) scaleX(.91)}
.motion-enabled .letter h2.scroll-reveal.is-visible{transform:translate3d(0,0,0) scaleX(.91)}
@media(min-width:1000px){.motion-enabled .letter{will-change:transform}}
@media(prefers-reduced-motion:reduce){.motion-enabled .hero>*{animation:none!important}.motion-enabled .gold-panel{animation:none!important}.motion-enabled .scroll-reveal{opacity:1;transform:none}.motion-enabled .gold-visual,.motion-enabled .hero,.motion-enabled .letter{transform:none!important;opacity:1!important}}
.crest{gap:calc(14 * var(--u))}
.crest i{width:calc(66 * var(--u));transform:translateY(calc(-6 * var(--u)));background:url('/assets/mb-monogram-gold.png') 50% 49%/155% auto no-repeat;mix-blend-mode:normal}
@media(min-width:1000px){.crest{gap:16px}.crest>span{width:64px}.crest i{width:62px;height:54px;transform:translateY(-6px);background-size:155% auto}}
@media(min-width:1000px) and (max-height:740px){.crest i{width:56px;height:48px}}
.letter{padding-bottom:calc(24 * var(--u))}
@media(min-width:1000px){.letter{padding-bottom:32px}}