:root{color-scheme:light;--ink:#182637;--muted:#475057;--paper:#faf4e8;--cream:#fff9ee;--gold:#f5bd56;--border:#d7cbb9;--serif:Georgia,"Iowan Old Style",Cambria,serif;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;--pad:clamp(20px,5vw,90px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 var(--sans)}a{color:inherit}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}.skip,.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip:focus{width:auto;height:auto;clip-path:none;z-index:20;background:white;padding:12px}.head,.sample,.family,footer{padding-inline:var(--pad)}.head{background:var(--cream);border-bottom:1px solid #dbd2bf}.head .line,footer{display:flex;align-items:center;justify-content:space-between;gap:20px}.line{max-width:1530px;margin:auto;min-height:70px}.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font: bold clamp(23px,2.3vw,36px)/1.14 var(--serif);letter-spacing:-.055em}.brand img{width:clamp(30px,3.2vw,47px);height:auto}.head nav,footer nav{display:flex;align-items:center;gap:clamp(16px,3vw,46px)}.head nav a,.applink{font-weight:600;font-size:.93rem;text-decoration:none}.head nav a:not(.applink):hover,footer a:hover{text-decoration:underline}.applink{border:1.5px solid var(--ink);padding:9px 16px;border-radius:30px;display:inline-flex;align-items:center;gap:7px}.applink:hover{background:var(--ink);color:white}
.hero{position:relative;isolation:isolate;display:grid;align-items:center;min-height:clamp(405px,36vw,610px);background:#0d1a25;color:#fff6e6;overflow:hidden}.heroart{position:absolute;inset:0;z-index:-1}.heroart img{height:100%;width:100%;object-fit:cover;object-position:60% 42%}.heroart:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,18,24,.89) 0%,rgba(8,18,24,.73) 27%,rgba(8,18,24,.20) 49%,transparent 66%)}.hero-inner{margin-left:var(--pad);padding-block:48px;width:min(53%,760px)}h1,h2,h3,p,figure,blockquote{margin:0}h1,h2,h3{font-family:var(--serif);letter-spacing:-.054em}h1{font-size:clamp(52px,5.75vw,100px);line-height:.99;text-wrap:balance}h1 em{color:var(--gold);font-weight:inherit}.hero p{margin:18px 0 25px;font-size:clamp(16px,1.45vw,21px);line-height:1.5}.mob{display:none}.audiorow{display:flex;align-items:center;gap:15px}.gold,.inkbutton{border:none;border-radius:30px;padding:13px 22px;min-height:46px;display:inline-flex;align-items:center;gap:12px;font-weight:700;text-decoration:none}.gold{background:var(--gold);color:#191a18;box-shadow:0 2px 0 #ae782d}.gold:hover{background:#ffcc71}.sym{font-size:.85em;width:1em}.duration{font-size:.9rem;color:#fff4e4;font-variant-numeric:tabular-nums}#seekbox:not([hidden]){display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}input[type=range]{accent-color:var(--gold);max-width:170px;min-height:25px}#seekbox a{font-size:.86rem}#feedback{display:block}#feedback:not(:empty){margin-top:8px}h2{font-size:clamp(37px,3.7vw,62px);line-height:1.04}.sample{padding-top:clamp(30px,3vw,52px);padding-bottom:clamp(38px,4vw,65px)}.section-title{display:flex;align-items:center;gap:24px;margin-bottom:22px}.section-title>span{border-left:1px solid #c1b39f;padding-left:22px;color:var(--muted);font-size:.88rem}.spreads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(17px,2vw,33px)}figure img{width:100%;aspect-ratio:1.85;object-fit:cover;display:block;border-radius:3px}figcaption h3{font-size:clamp(21px,2vw,33px);line-height:1.15;margin:14px 0 5px;letter-spacing:-.04em}h3 i{color:#a65e14;margin-right:5px;font-weight:400}.spreads p{font-size:clamp(14px,1.06vw,17px);line-height:1.55;color:var(--muted);max-width:48ch}.family{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:9vw;background:#efe5d2;border-block:1px solid var(--border);padding-block:62px}.family p{max-width:50ch;margin:18px 0}.inkbutton{background:var(--ink);color:white;padding-inline:22px}.inkbutton:hover{background:#28425b}.family small{display:block;margin-top:12px;color:var(--muted)}.letter{background:#fff8e6;transform:rotate(-2deg);padding:22px;box-shadow:1px 6px 12px #51411b25;border:1px solid #e2d0b1}.ruled{border:1px solid #c9b690;padding:26px;position:relative}.ruled>span:first-child{font:700 .75rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#65553e}.letter blockquote{font:italic clamp(23px,2.25vw,37px)/1.25 var(--serif);margin:15px 0;color:#32495a}.signature{font:italic 1.25rem var(--serif)}footer{padding-block:26px;background:var(--cream);flex-wrap:wrap}footer .brand{font-size:22px}footer .brand img{width:32px}footer>div{display:flex;align-items:center;gap:10px}footer span,footer nav a{font-size:.82rem}footer nav{gap:20px}footer a{text-underline-offset:3px}:focus-visible{outline:3px solid #d68528;outline-offset:4px}.inner{max-width:860px;margin:0 auto;padding:52px var(--pad) 65px}.inner h1{font-size:clamp(42px,6vw,68px);margin:.45em 0 .3em}.inner h2{font-size:clamp(26px,3.5vw,38px);margin:1.15em 0 .3em}.inner p{margin:12px 0}.inner a{overflow-wrap:anywhere}.inner label,.inner legend{font-weight:650}.inner input,.inner select,.inner textarea{color:var(--ink);background:#fffdf7;border:1px solid #8b8171;padding:10px 12px;border-radius:6px;width:100%}.inner fieldset{padding:0;border:0}.inner label{display:block;margin-top:14px}.inner .row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.back{display:inline-flex;align-items:center;min-height:44px;font-weight:650}.paper{background:#fffaf0;border:1px solid var(--border);padding:clamp(18px,3vw,35px);margin-top:26px}.paper p:first-child{margin-top:0}.paper h2{margin-top:0}.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:20px}.quiet{background:transparent;color:var(--ink);border:1px solid #8b8171;border-radius:26px;padding:10px 18px}.hint{color:var(--muted);font-size:.9rem}.u-status:not(:empty){padding:8px 0}.sheet{white-space:pre-wrap}.inner button:hover{filter:brightness(.94)}@media(min-width:1700px){.hero-inner{margin-left:max(var(--pad),calc((100vw - 1530px)/2))}}
@media(max-width:730px){.head nav>a:not(.applink){display:none}.line{min-height:58px}.brand{font-size:26px;gap:5px}.head .applink{font-size:.84rem;padding:8px 12px}.hero{display:flex;align-items:flex-end;min-height:0;flex-direction:column}.heroart{position:relative;inset:auto;width:100%;height:clamp(224px,62vw,360px);z-index:0}.heroart img{object-position:78% 38%;object-fit:cover}.heroart:after{background:linear-gradient(0deg,#101e29 0%,transparent 19%)}.hero-inner{background:#101e29;padding:6px var(--pad) 29px;width:100%;margin:0}.hero h1{font-size:clamp(44px,9.5vw,63px);line-height:1.01}.hero p{margin:12px 0 18px}.section-title{align-items:flex-start;flex-direction:column;gap:8px}.section-title>span{padding-left:0;border:0}.spreads{grid-template-columns:1fr;gap:26px}.spreads figure{display:grid;grid-template-columns:36% 1fr;gap:15px;align-items:center}.spreads figure img{aspect-ratio:1.12}.spreads figcaption h3{margin:0 0 6px}.spreads p{font-size:14px}.family{grid-template-columns:1fr;padding-block:40px;gap:26px}.letter{max-width:560px}.inner{padding-top:26px}.inner .row{grid-template-columns:1fr;gap:0}.ruled{padding:16px}footer{gap:12px}footer>div{flex-wrap:wrap}footer nav{flex-wrap:wrap}.section-title h2{max-width:14em}}@media(max-width:350px){.brand{font-size:22px}.applink{font-size:13px}.head .line{gap:5px}.spreads figure{grid-template-columns:1fr}.spreads figure img{aspect-ratio:1.85}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.inner fieldset+fieldset{border-top:1px solid var(--border);margin-top:25px}.inner legend{font-family:var(--serif);font-size:1.3rem;padding:10px 0}.paper>.hint{margin-block:24px 14px}.inner [hidden]{display:none}
@media(max-width:730px){.head nav{flex-shrink:0}.head .applink{white-space:nowrap}.head .brand{font-size:clamp(19px,5.6vw,28px)}.hero h1{font-size:clamp(35px,9.8vw,61px);text-wrap:initial}.section-title h2{font-size:clamp(30px,8.35vw,42px)}}@media(max-width:360px){.head .applink{font-size:.76rem;padding:7px 9px}.head .line{gap:3px}.head .brand{gap:3px}.head .brand img{width:23px}}
