:root{--navy:#17243a;--cream:#f7f3e9;--paper:#fbfaf6;--text:#253246;--muted:#77818e;--gold:#d7a15f}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
a:focus-visible{outline:3px solid #da893f;outline-offset:5px}
.skip{position:absolute;top:-100px;left:10px;background:#fff;color:#17243a;padding:12px;z-index:20}
.skip:focus{top:10px}
.sitebar{height:82px;padding:0 max(5vw,24px);display:flex;justify-content:space-between;align-items:center;gap:20px;background:var(--cream);border-bottom:1px solid #e6e0d5}
.identity{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:700;letter-spacing:.06em}
.identity strong{font-size:15px;letter-spacing:-.03em}
.identity-mark{width:42px;height:42px;border-radius:10px;background:#e87756;color:#fff;font:700 27px/42px 'Fraunces',Georgia,serif;text-align:center;transform:rotate(-7deg)}
.identity-mark span{color:#ffe6a9}
.back-link{font-size:12px;font-weight:800;border-bottom:1px solid var(--navy);padding-bottom:5px}
.back-link:hover{color:#a65c3a;border-color:#a65c3a}
.opening{background:#17243a;color:#fff;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);min-height:650px;overflow:hidden}
.opening-copy{padding:70px clamp(35px,6.5vw,110px) 80px max(6.5vw,35px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.opening-rule{display:flex;gap:35px;padding:13px 0;border-top:1px solid #7c8998;max-width:520px;width:100%;font-size:10px;color:#d9d0c1;letter-spacing:.17em;font-weight:700}
.byline{font-size:10px;letter-spacing:.18em;font-weight:800;color:#deb980;margin:45px 0 15px}
h1{font:600 clamp(95px,10vw,176px)/.88 'Fraunces',Georgia,serif;letter-spacing:-.087em;margin:0 0 36px}
h1 span{color:#e0aa67}
.opening-intro{font:500 clamp(22px,2.15vw,32px)/1.35 'Fraunces',Georgia,serif;max-width:520px;color:#e4e0d8;margin:0}
.read-link{font-size:12px;font-weight:800;border-bottom:2px solid #dfb273;padding-bottom:9px;margin-top:46px;display:flex;gap:34px}
.read-link:hover{color:#dfb273}
.opening-photo{margin:0;min-height:650px;position:relative;overflow:hidden;background:#3e414a}
.opening-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 39%;position:absolute;inset:0}
.opening-photo figcaption{position:absolute;bottom:26px;right:30px;background:#15233bde;color:#fff;padding:10px 15px;font-size:12px;letter-spacing:.02em}
.letter-layout{max-width:1150px;margin:0 auto;display:grid;grid-template-columns:180px minmax(0,700px);gap:68px;align-items:start;padding:110px 35px 130px}
.side-note{position:sticky;top:28px;padding-top:5px}
.side-line{height:2px;background:#c9ad87;margin-bottom:21px}
.side-note p{font-size:12px;line-height:1.6;font-weight:900;letter-spacing:.14em}
.side-note p span{color:#9b7053;font-weight:700}
.side-note-small{display:block;font:500 14px/1.65 'Fraunces',Georgia,serif;color:#727780;margin-top:30px}
.letter-copy{min-width:0}
.letter-copy p{font-size:19px;line-height:1.81;margin:0 0 28px;letter-spacing:-.013em}
.letter-copy p.lead{font:600 clamp(27px,2.65vw,38px)/1.37 'Fraunces',Georgia,serif;letter-spacing:-.035em;color:#16253c;margin:0 0 42px}
.letter-copy p strong{color:#17243a;font-weight:800}
.letter-copy blockquote{font:600 clamp(31px,4.3vw,56px)/1.18 'Fraunces',Georgia,serif;letter-spacing:-.045em;color:#a96b41;border-left:4px solid #d1a06d;margin:58px 0 63px;padding:0 0 0 30px}
.story-photo{margin:55px 0 62px}
.story-photo img{width:100%;height:auto;background:#e4ded2}
.story-photo figcaption{font-size:11px;letter-spacing:.04em;color:#737780;padding-top:13px}
.wide-photo img{aspect-ratio:4/3;object-fit:contain;background:#f0ebe4}
.photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:60px 0 64px;align-items:start}
.photo-pair .story-photo{margin:0}
.photo-pair img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center}
.main-line{margin:58px -28px 48px;padding:40px 35px 44px;background:#f1e9dc;border-top:2px solid #d6b285;color:#182840;font:600 clamp(31px,3.8vw,50px)/1.24 'Fraunces',Georgia,serif;letter-spacing:-.04em}
.main-line span{font-size:.73em;color:#99613c}
.signoff{font:600 clamp(28px,3vw,40px)/1.3 'Fraunces',Georgia,serif!important;color:#213248;margin-top:42px!important}
.closing-photo{max-width:440px;margin:51px 0 0}
.bottom-note{text-align:center;background:#f0eee9;padding:100px 25px 110px;border-top:1px solid #e1ddd7}
.bottom-note p{font-size:10px;letter-spacing:.17em;font-weight:900;color:#a67352}
.bottom-note h2{font:600 clamp(37px,5vw,65px)/1.12 'Fraunces',Georgia,serif;letter-spacing:-.055em;margin:23px 0 32px;color:#18263b}
.bottom-note em{font-style:normal;color:#c07b53}
.bottom-note>a{display:inline-flex;gap:24px;border-bottom:2px solid #ba7b52;padding-bottom:8px;font-size:13px;font-weight:800}
footer{display:flex;justify-content:space-between;gap:15px;padding:26px 6vw;background:#17243a;color:#b7c0c9;font-size:10px;font-weight:700;letter-spacing:.1em}
@media(max-width:900px){.opening{grid-template-columns:1fr}.opening-copy{padding:60px 7vw 65px}.opening-photo{height:560px;min-height:0}.opening-photo img{object-position:center 35%}.opening-rule{max-width:100%}.letter-layout{grid-template-columns:1fr;gap:0;max-width:760px;padding-top:65px}.side-note{position:static;display:flex;gap:20px;align-items:center;margin-bottom:45px;border-bottom:1px solid #e0d7cc;padding-bottom:14px}.side-line{width:32px;margin:0;flex-shrink:0}.side-note p{white-space:nowrap}.side-note-small{margin:0;font-size:12px}.letter-copy p{font-size:18px}}
@media(max-width:560px){.sitebar{height:70px}.identity{font-size:9px}.identity strong{font-size:12px}.identity-mark{width:36px;height:36px;font-size:24px;line-height:36px}.back-link{font-size:11px}.opening-copy{padding:51px 25px 60px}.opening-rule{font-size:8px;gap:10px}.byline{margin-top:33px}.opening h1{font-size:105px;margin:0 0 26px}.opening-intro{font-size:24px}.read-link{margin-top:35px}.opening-photo{height:480px}.opening-photo img{object-position:50% 36%}.letter-layout{padding:55px 24px 90px}.side-note{gap:12px}.side-note-small{display:none}.letter-copy p{font-size:17px;line-height:1.77;margin-bottom:24px}.letter-copy p.lead{font-size:28px;margin-bottom:35px}.letter-copy blockquote{font-size:37px;padding-left:19px;margin:43px 0}.story-photo{margin:35px 0 42px}.photo-pair{gap:10px;margin:43px 0}.main-line{margin:35px -15px;padding:28px 18px;font-size:33px}.bottom-note{padding:70px 22px}.bottom-note h2{font-size:42px}footer{flex-direction:column;gap:8px;padding:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
