:root{
  color-scheme:light;
  --paper:#F3EDE1; --paper-2:#E9E1D2; --paper-3:#DFD5C2;
  --ink:#2A221C; --ink-2:#5A4E44; --ink-3:#8A7D70; --rule:#D3C7B3;
  --red:#9E2F2A; --ochre:#A67C2E; --iris:#6B5E93;
  --night:#221B17; --night-ink:#EFE6D6; --night-ink-2:#B9AC9A; --night-rule:#463A33;
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --text:"Newsreader",Georgia,"Times New Roman",serif;
  --gutter:clamp(28px,6vw,96px);
}
*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);font-size:18px;line-height:1.65;font-variant-numeric:tabular-nums}
img{max-width:100%;display:block}
a{color:var(--red)}
h1,h2,h3,h4{font-family:var(--display);font-weight:500;line-height:1.05;margin:0;text-wrap:balance}
h1{font-size:clamp(44px,6.2vw,84px)}
h2{font-size:clamp(36px,4.6vw,60px)}
h3{font-size:clamp(28px,3.2vw,40px)}
h4{font-size:24px;font-weight:600}
em{font-style:italic}
p{margin:0;max-width:60ch}
.lede{font-size:clamp(20px,2vw,24px);line-height:1.45;max-width:40ch;font-family:var(--display);font-weight:500}
.label{font-family:var(--text);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);font-weight:500}
.label.quiet{color:var(--ink-3)}
.label.big{font-family:var(--display);font-size:clamp(22px,2.4vw,30px);letter-spacing:.04em;text-transform:none;font-weight:600}
.orn{display:flex;align-items:center;gap:10px;color:var(--iris)}
.orn::before,.orn::after{content:"";height:1px;width:34px;background:currentColor}
.orn svg{width:16px;height:16px;fill:currentColor}

/* sticky header */
.bar{position:sticky;top:0;z-index:20;background:rgba(243,237,225,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.bar .in{max-width:1180px;margin:0 auto;padding:0 var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:56px}
.bar .t{font-family:var(--display);font-size:20px;font-weight:600;white-space:nowrap;color:var(--ink);text-decoration:none}
.bar .t em{font-weight:500;color:var(--ink-3)}
.bar nav{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none}
.bar nav::-webkit-scrollbar{display:none}
.bar nav a{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);text-decoration:none;white-space:nowrap;padding:18px 0 16px;border-bottom:2px solid transparent}
.bar nav a.on{color:var(--red);border-bottom-color:var(--red)}
.bar nav a:hover,.bar nav a:focus-visible{color:var(--ink);outline:none}
@media (max-width:720px){.bar .in{flex-direction:column;align-items:flex-start;gap:0;min-height:0;padding-top:12px}.bar .t{font-size:18px}.bar nav{width:100%}.bar nav a{padding:10px 0 12px}}

/* pages */
.page{max-width:1180px;margin:0 auto;padding:0 var(--gutter)}
.chapter{padding-top:112px;padding-bottom:96px;display:grid;gap:40px}
.chapter .head{display:grid;gap:20px;max-width:72ch}
.flow{display:grid;gap:20px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
@media (max-width:820px){.split{grid-template-columns:1fr;gap:36px}.chapter{padding-top:80px;padding-bottom:64px;gap:32px}}

/* cover spread */
.cover{display:grid;grid-template-columns:1fr 1fr;min-height:min(84vh,840px)}
.cover .plateimg{position:relative;overflow:hidden;background:var(--night);min-height:440px}
.cover .plateimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.cover .titles{padding:72px var(--gutter);display:grid;align-content:center;gap:28px;border-left:1px solid var(--rule)}
.cover .sub{font-family:var(--display);font-size:clamp(22px,2.4vw,30px);font-style:italic;color:var(--ink-2);max-width:24ch;line-height:1.25}
.toc{list-style:none;margin:16px 0 0;padding:22px 0 0;border-top:1px solid var(--rule);display:grid;gap:14px}
.toc a{color:var(--red);text-decoration:none;font-size:14px;letter-spacing:.2em;text-transform:uppercase;display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.toc a span{color:var(--ink-3);letter-spacing:.06em;text-transform:none;font-style:italic;font-size:15px;text-align:right}
.toc a:hover,.toc a:focus-visible{color:var(--ink);outline:none}
@media (max-width:820px){.cover{grid-template-columns:1fr;min-height:0}.cover .titles{border-left:0;border-top:1px solid var(--rule);padding:48px var(--gutter)}.cover .plateimg{min-height:0;height:62vh}}

/* plates */
.plate{position:relative;background:var(--night);margin:0}
.plate img{width:100%;height:min(88vh,900px);object-fit:cover}
.plate figcaption{position:absolute;left:0;right:0;bottom:0;padding:20px var(--gutter);color:var(--night-ink);font-family:var(--display);font-style:italic;font-size:20px;background:linear-gradient(to top,rgba(20,14,10,.62),rgba(20,14,10,0))}
.plate.tall img{height:min(96vh,1000px)}

/* facts */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.facts div{padding:26px 26px 28px 0}
.facts div+div{border-left:1px solid var(--rule);padding-left:26px}
.facts .k{font-family:var(--display);font-size:clamp(30px,3.4vw,44px);line-height:1;font-weight:500;color:var(--ink)}
.facts p{font-size:15.5px;color:var(--ink-2);margin-top:12px;line-height:1.45}
@media (max-width:640px){.facts{grid-template-columns:1fr}.facts div+div{border-left:0;border-top:1px solid var(--rule);padding-left:0}}

/* the night */
.night{background:var(--night);color:var(--night-ink)}
.night .page{padding-top:104px;padding-bottom:104px}
.night h3,.night h4{color:var(--night-ink)}
.night .label{color:var(--ochre)}
.night p{color:var(--night-ink)}
.night .muted{color:var(--night-ink-2)}
.night .shot{border:1px solid var(--night-rule)}
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--night-rule)}
.timeline li{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--night-rule);align-items:baseline}
.timeline .t{font-family:var(--display);font-size:32px;line-height:1;color:var(--night-ink);font-weight:500}
.timeline .t small{display:block;font-family:var(--text);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--night-ink-2);margin-top:6px}
.timeline p{font-size:17px;color:var(--night-ink)}
@media (max-width:640px){.timeline li{grid-template-columns:1fr;gap:6px}}

/* window strip */
.strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.strip div{padding:22px 22px 24px 0;border-bottom:1px solid var(--rule)}
.strip div:nth-child(3n+2),.strip div:nth-child(3n+3){border-left:1px solid var(--rule);padding-left:22px}
.strip .k{font-family:var(--display);font-size:28px;line-height:1.1}
.strip p{font-size:15.5px;color:var(--ink-2);margin-top:8px}
@media (max-width:640px){.strip{grid-template-columns:1fr}.strip div{border-left:0 !important;padding-left:0 !important}}

/* sundays */
.sundays{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.sundays div{padding:18px 14px 20px 0;border-bottom:1px solid var(--rule)}
.sundays div+div{border-left:1px solid var(--rule);padding-left:14px}
.sundays div:nth-child(3n+1){border-left:0;padding-left:0}
.sundays .d{font-family:var(--display);font-size:26px;line-height:1;font-weight:600}
.sundays .d small{display:block;font-family:var(--text);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-top:5px;font-weight:400}
.sundays p{font-size:14.5px;color:var(--ink-2);margin-top:12px;line-height:1.4}
.sundays .now .d{color:var(--red)}
.sundays .open{background:var(--paper-2)}
.sundays .open .d{color:var(--ochre)}
@media (max-width:520px){.sundays{grid-template-columns:1fr}.sundays div{border-left:0;padding-left:0}}

/* journey */
.stairs{width:100%;height:auto;display:block}
.doors{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.doors li{display:grid;grid-template-columns:36px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.doors li b{font-family:var(--display);font-size:24px;font-weight:600;color:var(--iris)}
.doors li span{font-size:17px}
.doors li span i{display:block;font-style:italic;color:var(--ink-3);font-size:15.5px}

/* the link in bio */
.bio{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:72px;align-items:start}
.bio .phone{margin:0;border:1px solid var(--rule);background:#FFFBF2;box-shadow:0 30px 60px rgba(42,34,28,.18)}
.bio .phone img{width:100%}
.bio .phone figcaption{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:10px 12px;border-top:1px solid var(--rule)}
.keys{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--ink)}
.keys li{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--rule)}
.keys li b{font-family:var(--display);font-size:30px;font-weight:600;color:var(--red);line-height:1}
.keys li h4{font-size:24px;margin-bottom:6px}
.keys li p{font-size:16.5px;color:var(--ink-2)}
.keys li .snip{margin-top:14px;border:1px solid var(--rule);background:var(--night);max-width:440px}
.keys li .snip img{width:100%}
@media (max-width:1000px){.bio{grid-template-columns:1fr;gap:36px}.bio .phone{max-width:380px}}

footer{border-top:1px solid var(--rule);padding:40px var(--gutter) 64px;text-align:center;color:var(--ink-3);font-size:14px;letter-spacing:.06em}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* what's next */
.bar nav a.next{color:var(--ochre)}
.masth{padding:96px 0 56px;display:grid;gap:22px;max-width:76ch}
.masth .sub{font-family:var(--display);font-size:clamp(22px,2.4vw,30px);font-style:italic;color:var(--ink-2);max-width:30ch;line-height:1.25}
.tbl{overflow-x:auto}
.tbl table{width:100%;border-collapse:collapse;font-size:16px}
.tbl th,.tbl td{padding:12px 20px 12px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.tbl th{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);font-weight:500;border-bottom:1px solid var(--ink)}
.tbl td.num,.tbl th.num{text-align:right;white-space:nowrap;padding-right:0;padding-left:20px}
.tbl td.when{white-space:nowrap;font-family:var(--display);font-size:20px;font-weight:600;padding-right:20px}
.letter{background:#FBF8F1;border:1px solid var(--rule);padding:28px 32px;max-width:60ch;font-size:17px;line-height:1.6;display:grid;gap:14px}
.letter .from{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.letter p{max-width:none}
.letter .btn{display:inline-block;background:var(--ink);color:var(--paper);padding:11px 16px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;border-radius:2px;justify-self:start}
.letter .btn.gold{background:#C9A468;color:#1A1410}
.letter .ps{font-style:italic;color:var(--ink-2)}
.funnel{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.funnel div{padding:24px 24px 26px 0;position:relative}
.funnel div+div{border-left:1px solid var(--rule);padding-left:24px}
.funnel .k{font-family:var(--display);font-size:clamp(30px,3.4vw,44px);line-height:1}
.funnel .n{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.funnel p{font-size:15px;color:var(--ink-2);margin-top:10px;line-height:1.45}
.funnel .r{font-family:var(--display);font-size:18px;color:var(--iris);margin-top:8px;font-style:italic}
@media (max-width:820px){.funnel{grid-template-columns:1fr 1fr}.funnel div:nth-child(2n+1){border-left:0;padding-left:0}}
.ck{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.ck li{display:block;position:relative;padding:12px 0 12px 30px;border-bottom:1px solid var(--rule);font-size:16.5px}
.ck li::before{content:"";position:absolute;left:0;top:18px;width:14px;height:14px;border:1px solid var(--ink-3);border-radius:2px}
.ck li b{font-weight:500;color:var(--ink)}
.q{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink);counter-reset:q}
.q li{counter-increment:q;display:grid;grid-template-columns:44px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid var(--rule);font-size:17px}
.q li::before{content:counter(q);font-family:var(--display);font-size:26px;font-weight:600;color:var(--red);line-height:1}
.q li i{display:block;font-style:italic;color:var(--ink-3);font-size:15.5px;margin-top:4px}
.owner{display:inline-block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--rule);padding:3px 7px;border-radius:2px;margin-left:8px;vertical-align:middle}
.stage{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:820px){.stage{grid-template-columns:1fr;gap:32px}}
.stage .set{background:var(--night);color:var(--night-ink);padding:26px 28px;display:grid;gap:12px;font-size:16px}
.stage .set h4{color:var(--night-ink)}
.stage .set p{color:var(--night-ink-2);max-width:none}
.stage .set b{color:var(--night-ink);font-weight:500}

table.test th:nth-child(1){width:34%}table.test th:nth-child(2){width:12%}table.test th:nth-child(3){width:54%}
table.test td{font-size:15.5px}
table.offer th:nth-child(2){width:56%}
.offer td:first-child small{display:block;font-family:var(--text);font-size:14px;font-weight:400;color:var(--ink-3);white-space:normal;margin-top:2px}
.offer td:first-child{font-family:var(--display);font-size:21px;font-weight:600;white-space:nowrap;padding-right:20px}
.shotwide{margin:0;border:1px solid var(--rule);background:#fff}
.shotwide img{width:100%;display:block}
.shotwide figcaption{font-size:14px;color:var(--ink-3);padding:12px 16px;border-top:1px solid var(--rule);font-style:italic}
table.prompts th:nth-child(1){width:12%}
table.test2 th:nth-child(1){width:44%}
table.test2 td small{display:block;font-family:var(--display);font-size:20px;font-weight:600;color:var(--ink);margin-top:4px}

.bio{grid-template-columns:minmax(300px,400px) 1fr}
.phoneframe{margin:0;display:grid;gap:10px;justify-items:center}
.phoneframe iframe{width:390px;max-width:100%;height:760px;border:1px solid var(--rule);border-radius:18px;background:#FFFBF2;box-shadow:0 30px 60px rgba(42,34,28,.18)}
.openlink{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}