:root{--bg:#080e14;--ink:#f4f5f7;--muted:#aab1bc;--gold:#dfb875;--border:#ffffff22;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.65}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:7px}::selection{color:#080e14;background:var(--gold)}.skip{position:absolute;top:-100px;background:var(--gold);color:var(--bg);z-index:100;padding:12px}.skip:focus{top:0}.progress{position:fixed;left:0;top:0;height:3px;background:var(--gold);z-index:50;width:0}.nav{height:104px;padding:0 5.5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);position:relative;z-index:10}.wordmark{font-size:14px;font-weight:700;line-height:1.2;letter-spacing:.13em;position:relative}.wordmark span{display:block}.wordmark i{position:absolute;width:5px;height:5px;background:var(--gold);right:-13px;bottom:2px}.nav nav{display:flex;gap:34px;font-size:14px}.nav nav a:hover,.text-link:hover{color:var(--gold)}.buy{display:inline-flex;justify-content:center;align-items:center;background:var(--gold);color:#10151c;padding:16px 24px;font-size:15px;font-weight:700;border:1px solid var(--gold);transition:background .25s,transform .25s;min-height:52px}.buy:hover{background:#f6d399;transform:translateY(-3px)}.buy.small{font-size:13px;padding:11px 18px;min-height:44px}.hero{padding:88px 8vw 55px;display:grid;grid-template-columns:1.2fr 1fr;gap:5vw;position:relative;min-height:850px;overflow:hidden;align-items:center}.hero-art{position:absolute;inset:0;background:linear-gradient(90deg,#080e14f2 12%,#080e14a8 65%,#080e14b0),url('assets/bridge.webp') center 75%/cover no-repeat;opacity:.68;pointer-events:none}.hero-copy,.cover-stage,.hero-bottom{position:relative}.eyebrow{font-size:12px;color:var(--gold);letter-spacing:.19em;font-weight:700;line-height:1.7;margin:0 0 30px}h1,h2,h3,p,figure{margin:0}h1{font-size:clamp(62px,6.6vw,105px);letter-spacing:-.065em;line-height:1.01;font-weight:700;margin-bottom:28px}em{font-family:var(--serif);color:var(--gold);font-weight:400;letter-spacing:-.045em}h1 em{font-size:1.17em}h2{font-size:clamp(40px,4.6vw,70px);line-height:1.09;letter-spacing:-.045em;font-weight:500}h3{font-size:28px;line-height:1.2;font-weight:500;letter-spacing:-.02em}.hero-sub{font-size:20px;line-height:1.55;color:#c4c9d1}.actions{display:flex;gap:26px;align-items:center;margin-top:34px;flex-wrap:wrap}.text-link{font-size:15px;border-bottom:1px solid var(--gold);padding-bottom:3px}.fine{font-size:13px;color:var(--muted);margin-top:20px}.cover-stage{justify-self:center;max-width:340px;width:90%;perspective:1200px}.cover{display:block;width:100%;height:auto;border:1px solid #ffffff35;box-shadow:25px 32px 75px #000a;transform:rotateY(-12deg) rotateZ(3deg);transition:transform .5s;animation:arrive 1.3s ease both}.cover-stage:hover .cover{transform:rotateY(-3deg) rotateZ(0)}figcaption{font-size:10px;letter-spacing:.13em;color:var(--muted);margin-top:36px;text-align:center}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.12em;padding-top:50px;color:var(--muted)}.hero-bottom a{color:var(--gold)}.section{padding:110px 8vw}.intro{border-top:1px solid var(--border)}.intro h2{max-width:1000px}.intro-columns{display:grid;grid-template-columns:1fr 1fr;gap:9vw;margin-top:60px}.lead{font-size:28px;line-height:1.45;letter-spacing:-.02em}p+p{margin-top:24px}.intro-columns>div,.author-layout>div{color:var(--muted)}.feature-quote{background:#101922;position:relative;padding-top:100px;padding-bottom:100px}.quote-mark{position:absolute;top:36px;color:#dfb87522;font-family:var(--serif);font-size:220px;line-height:1}.feature-quote blockquote{position:relative;font-size:clamp(36px,4.7vw,72px);line-height:1.19;letter-spacing:-.035em;margin:0;font-weight:400}.feature-quote>p{margin-top:40px;color:var(--gold);font-size:12px;letter-spacing:.1em}.feature-quote>p span{color:var(--muted);letter-spacing:0}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:6vw;margin-bottom:56px}.section-head>p{max-width:320px;font-size:17px;color:var(--muted)}.theme-list article{display:grid;grid-template-columns:60px 1fr 1.4fr 100px;gap:26px;align-items:center;padding:32px 0;border-top:1px solid var(--border)}.theme-list article:last-child{border-bottom:1px solid var(--border)}.num{font-family:var(--serif);font-size:24px;color:var(--gold)}.theme-list p{font-size:16px;color:var(--muted);max-width:420px}.tag{font-size:10px;letter-spacing:.1em;color:var(--muted);text-align:right}.chapter-details{margin-top:35px}.chapter-details summary{font-size:15px;cursor:pointer;list-style:none;color:var(--gold);display:flex;justify-content:space-between}.chapter-details summary span{font-size:24px}.chapter-details ol{columns:2;column-gap:70px;color:var(--muted);padding-left:25px;margin-top:30px;font-size:16px}.chapter-details li{padding:9px 0;break-inside:avoid}.thoughts{background:#111820}.filters{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:48px}.filters button{padding:7px 0;border:0;border-bottom:1px solid transparent;background:none;font-size:14px;color:var(--muted)}.filters button.active{color:var(--gold);border-color:var(--gold)}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 36px}.quote-item{border-top:1px solid var(--border);padding:30px 0 34px;display:flex;flex-direction:column;min-height:285px;animation:arrive .5s ease both}.quote-item .quote-category{font-size:10px;letter-spacing:.15em;color:var(--gold);margin-bottom:20px}.quote-item blockquote{font-family:var(--serif);font-size:25px;line-height:1.4;margin:0 0 30px}.quote-item cite{font-style:normal;font-size:12px;color:var(--muted);margin-top:auto}.sample{display:grid;grid-template-columns:1fr 1fr;gap:9vw;border-bottom:1px solid var(--border)}.sample-label>p:last-child{font-size:14px;color:var(--muted);margin-top:30px}.sample-text{font-family:var(--serif);font-size:21px;line-height:1.8;color:#c6cbd2}.dropcap:first-letter{float:left;font-size:76px;line-height:1;padding-right:12px;color:var(--gold)}.sample-text .text-link{display:inline-block;margin-top:28px;font-family:Arial,sans-serif;color:var(--gold)}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.timeline article{border-top:1px solid var(--gold);padding-top:25px}.timeline span{font-size:11px;letter-spacing:.12em;color:var(--gold)}.timeline h3{margin:18px 0}.timeline p{color:var(--muted);font-size:16px}.practice-note{font-size:13px;color:var(--muted);margin-top:38px}.author{background:#101922}.author-layout{display:grid;grid-template-columns:1fr 1fr;gap:9vw}.author-layout .lead{color:var(--ink);margin-bottom:30px}.signature{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:28px}.closing{position:relative;overflow:hidden;text-align:center;padding-top:140px;padding-bottom:140px}.closing-art{position:absolute;inset:0;background:linear-gradient(#080e14c9,#080e14a0),url('assets/bridge.webp') center/cover}.closing>div:last-child{position:relative}.closing h2{margin-bottom:35px}.closing p{color:var(--muted)}.closing .eyebrow{color:var(--gold)}.closing .buy{margin-top:35px}.closing .fine{font-size:12px}footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:45px 5.5vw;border-top:1px solid var(--border)}footer p{font-size:12px;color:var(--muted)}.footer-links{display:flex;gap:20px}.footer-links button{font-size:12px;background:none;border:0;color:var(--muted)}dialog{background:#141e28;color:var(--ink);border:1px solid var(--border);padding:45px;width:min(90vw,650px);max-height:85vh}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}dialog h2{font-size:30px;margin-bottom:25px}dialog p{font-size:16px;color:var(--muted)}.dialog-close{position:absolute;right:12px;top:8px;background:none;border:0;font-size:30px}.reveal{transition:opacity .8s ease,transform .8s ease}.js-motion .reveal:not(.visible){opacity:0;transform:translateY(24px)}@keyframes arrive{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@media(min-width:1500px){.hero,.section{padding-left:max(8vw,calc((100vw - 1280px)/2));padding-right:max(8vw,calc((100vw - 1280px)/2))}}@media(max-width:900px){.hero{padding:70px 6vw 40px;gap:30px;min-height:760px}h1{font-size:68px}.cover-stage{max-width:270px}.section{padding:80px 6vw}.nav{padding:0 6vw}.nav nav{gap:20px}.theme-list article{grid-template-columns:40px 1fr 1.3fr}.tag{display:none}.quote-grid{grid-template-columns:repeat(2,1fr)}.section-head{gap:30px}.section-head>p{max-width:250px}.timeline{grid-template-columns:repeat(2,1fr);row-gap:40px}.hero-bottom span:nth-child(2){display:none}}
@media(max-width:600px){.nav{height:85px}.nav nav{display:none}.buy.small{font-size:12px;padding:9px 12px}.hero{grid-template-columns:1fr;padding-top:55px;gap:50px}.hero-copy{z-index:1}h1{font-size:clamp(58px,14vw,78px)}.hero-sub{font-size:18px}.hero-art{background-position:65% bottom}.cover-stage{max-width:230px}.hero-bottom{padding-top:15px;font-size:9px}.section{padding:72px 6vw}.eyebrow{font-size:10px;margin-bottom:23px}h2{font-size:40px}.intro-columns,.sample,.author-layout{grid-template-columns:1fr;gap:35px}.intro-columns{margin-top:35px}.lead{font-size:24px}.feature-quote blockquote{font-size:36px}.section-head{display:block;margin-bottom:38px}.section-head>p{max-width:none;margin-top:25px}.theme-list article{grid-template-columns:30px 1fr;gap:15px;padding:25px 0}.theme-list h3{font-size:26px}.theme-list p{grid-column:2}.chapter-details ol{columns:1}.filters{gap:18px}.quote-grid{grid-template-columns:1fr}.quote-item{min-height:0;padding-bottom:30px}.quote-item blockquote{font-size:27px}.quote-item cite{margin-top:0}.sample-text{font-size:20px}.timeline{gap:30px 22px}.timeline h3{font-size:23px}.timeline p{font-size:15px}.closing{padding-top:95px;padding-bottom:95px}.closing h2{font-size:36px}footer{flex-wrap:wrap;padding:35px 6vw;gap:25px}.footer-links{width:100%}}
/* Light moves across the original artwork, following its landscape into the bridge. */
@property --flow-x{syntax:'<percentage>';inherits:false;initial-value:0%}
@property --flow-y{syntax:'<percentage>';inherits:false;initial-value:100%}
.hero-art,.closing-art{background:none;isolation:isolate;overflow:hidden;--art-position:center 75%;--art-shade:linear-gradient(90deg,#080e14f2 12%,#080e14a8 65%,#080e14b0)}
.closing-art{--art-position:center;--art-shade:linear-gradient(#080e14c9,#080e14a0)}
.hero-art::before,.closing-art::before{content:'';position:absolute;inset:-2%;background:url('assets/bridge.webp') var(--art-position)/cover no-repeat;animation:landscape-breathe 32s ease-in-out infinite alternate}
.hero-art::after,.closing-art::after{content:'';position:absolute;inset:0;background:var(--art-shade);pointer-events:none}
.light-flow{position:absolute;inset:-2%;background:url('assets/bridge.webp') var(--art-position)/cover no-repeat;filter:brightness(2.7) saturate(1.5);mix-blend-mode:screen;mask-image:radial-gradient(ellipse 18% 13% at var(--flow-x) var(--flow-y),#000 0%,#000a 28%,transparent 76%);-webkit-mask-image:radial-gradient(ellipse 18% 13% at var(--flow-x) var(--flow-y),#000 0%,#000a 28%,transparent 76%);opacity:0;animation:golden-crossing 20s linear infinite,landscape-breathe 32s ease-in-out infinite alternate;pointer-events:none}
.light-flow.echo{filter:brightness(2) saturate(1.4);animation-delay:-10s,0s}
.art-paused::before,.art-paused .light-flow{animation-play-state:paused}
@keyframes landscape-breathe{from{transform:scale(1) translateY(0)}to{transform:scale(1.035) translateY(-.5%)}}
@keyframes golden-crossing{0%{--flow-x:2%;--flow-y:96%;opacity:0}10%{--flow-x:14%;--flow-y:83%;opacity:.65}30%{--flow-x:30%;--flow-y:65%;opacity:.8}47%{--flow-x:40%;--flow-y:42%;opacity:.85}65%{--flow-x:61%;--flow-y:27%;opacity:.9}82%{--flow-x:84%;--flow-y:21%;opacity:.75}95%{--flow-x:99%;--flow-y:18%;opacity:0}100%{--flow-x:105%;--flow-y:18%;opacity:0}}
@media(max-width:600px){.hero-art{--art-position:65% bottom}.light-flow{mask-image:radial-gradient(ellipse 28% 12% at var(--flow-x) var(--flow-y),#000 0%,#000a 28%,transparent 76%);-webkit-mask-image:radial-gradient(ellipse 28% 12% at var(--flow-x) var(--flow-y),#000 0%,#000a 28%,transparent 76%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-motion .reveal:not(.visible){opacity:1;transform:none}.cover{transform:none}.light-flow{display:none}}
