:root { --ink:#151411; --paper:#eeeae1; --fog:#d3d0c7; --line:rgba(21,20,17,.72); --muted:rgba(21,20,17,.66); --mono:"DM Mono", monospace; --body:"Source Serif 4", Georgia, serif; --display:"Rye", Georgia, serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { min-width:320px;margin:0;color:var(--ink);background:var(--paper);font-family:var(--body);font-size:18px;line-height:1.6; }
body:before { content:"";position:fixed;inset:0;z-index:-1;opacity:.2;pointer-events:none;background-image:radial-gradient(rgba(21,20,17,.42) .55px,transparent .75px),radial-gradient(rgba(21,20,17,.22) .45px,transparent .65px);background-size:17px 19px,29px 31px;background-position:0 0,11px 5px; }
a { color:inherit; }
.skip-link { position:absolute;left:-999px;top:8px;padding:8px 12px;background:var(--ink);color:var(--paper);font:13px var(--mono); }.skip-link:focus { left:8px;z-index:5; }
main { width:min(100% - 40px,860px);margin:0 auto; }
.cover { min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:clamp(48px,8vw,90px) 0 45px;text-align:center; }
.edition { margin:0 0 clamp(52px,9vw,115px);font:11px var(--mono);letter-spacing:.06em; }
h1,h2 { font-family:var(--display);font-weight:400;letter-spacing:-.04em; }
h1 { margin:0;font-size:clamp(62px,11vw,124px);line-height:.8; }.cover h1 span { display:block; }.cover h1 span+span { margin-top:9px; }
.subtitle { margin:26px 0 37px;font:600 clamp(19px,2.2vw,25px)/1.25 var(--body);letter-spacing:-.025em; }
nav { width:min(100%,530px);display:grid;gap:5px;text-align:left; }nav a { display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:3px 0;text-decoration:none;font:600 15px var(--body);letter-spacing:.015em; }nav i { height:2px;background-image:radial-gradient(circle,var(--ink) 1px,transparent 1.25px);background-size:8px 2px;background-repeat:repeat-x; }nav b { font:600 12px var(--mono); }nav a:hover span, nav a:focus-visible span { text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px; }
.cover-foot { display:flex;align-items:center;justify-content:space-between;width:100%;max-width:530px;margin-top:auto;padding-top:52px;font:10px var(--mono);letter-spacing:.05em; }.sun { font-size:26px;line-height:1; }
.chapter { width:min(100%,650px);margin:0 auto;padding:clamp(95px,14vw,145px) 0 0; }.chapter-number { margin:0 0 34px;text-align:center;font:600 16px var(--mono); }.chapter h2 { margin:0 0 58px;text-align:center;font-size:clamp(44px,6vw,65px);line-height:.9; }.copy-column { width:min(100%,510px);margin:auto; }.copy-column p { margin:0 0 25px; }.copy-column .lead { font-size:clamp(22px,2.65vw,28px);line-height:1.37; }.copy-column .booking { margin-top:38px; }.booking a { display:inline-flex;align-items:center;gap:30px;padding:13px 15px 12px;border:1.5px solid var(--ink);font:600 13px var(--mono);letter-spacing:.025em;text-decoration:none;transition:background .18s,color .18s; }.booking a span { font-size:18px;line-height:0; }.booking a:hover,.booking a:focus-visible { background:var(--ink);color:var(--paper); }
.project-list { display:grid;gap:48px; }.project { display:block;text-decoration:none; }.project-image { position:relative;aspect-ratio:1.72;border:1.5px solid var(--ink);overflow:hidden; }.trackpad-art { background:#c3c2bc; }.art-grid { position:absolute;inset:0;opacity:.38;background-image:linear-gradient(var(--ink) 1px,transparent 1px),linear-gradient(90deg,var(--ink) 1px,transparent 1px);background-size:32px 32px; }.art-title { position:absolute;left:7%;top:9%;font:clamp(32px,5vw,56px)/.85 var(--display);letter-spacing:-.04em; }.art-pad { position:absolute;left:10%;bottom:11%;width:36%;aspect-ratio:1.48;border:2px solid var(--ink);border-radius:17px 21px 20px 18px;background:var(--paper);transform:rotate(-9deg);box-shadow:7px 8px 0 rgba(21,20,17,.18); }.art-pad i { position:absolute;width:11px;height:11px;border:1.5px solid var(--ink);border-radius:50%;background:var(--fog); }.art-pad i:nth-child(1){left:25%;top:32%}.art-pad i:nth-child(2){left:48%;top:45%}.art-pad i:nth-child(3){left:68%;top:61%}.art-node { position:absolute;padding:4px 7px;border:1.5px solid var(--ink);background:var(--paper);font:10px var(--mono); }.first{right:24%;top:27%}.second{right:9%;top:49%}.third{right:25%;bottom:14%}.art-line { position:absolute;height:1.5px;background:var(--ink);transform-origin:left; }.line-one{top:43%;left:52%;width:27%;transform:rotate(-13deg)}.line-two{top:57%;left:57%;width:17%;transform:rotate(48deg)}
.project:hover .trackpad-art,.project:focus-visible .trackpad-art { filter:contrast(1.08); }.project-meta { display:grid;grid-template-columns:1.05fr 1.55fr auto;gap:13px;margin-top:8px;align-items:baseline;font-size:15px;line-height:1.35; }.project-meta strong { font-size:16px; }.project-meta span { color:var(--muted); }.project-meta em { font-style:normal;font-size:13px;white-space:nowrap;text-decoration:underline;text-underline-offset:3px; }
.placeholder { opacity:.58; }.placeholder-art { display:grid;place-items:center;background:var(--fog); }.placeholder-art span { text-align:center;font:clamp(31px,5vw,53px)/.88 var(--display);letter-spacing:-.04em; }
.notes { padding-bottom:clamp(95px,13vw,140px); }.now-list { width:min(100%,520px);margin:auto; }.now-list p { display:grid;grid-template-columns:100px 1fr;gap:22px;margin:0;padding:15px 0;border-top:1px solid var(--line); }.now-list p:last-child { border-bottom:1px solid var(--line); }.now-list span { font:11px var(--mono);padding-top:7px; }.now-list a { text-underline-offset:3px; }
footer { display:flex;justify-content:space-between;padding:26px 0 31px;border-top:1px solid var(--line);font:10px var(--mono);letter-spacing:.04em; }footer p { margin:0; }footer a { text-underline-offset:3px; }
@media (max-width:560px) { main { width:min(100% - 28px,860px); }.cover { padding-top:45px; }.edition { margin-bottom:75px; }.subtitle { max-width:270px; }.chapter { padding-top:90px; }.chapter h2 { margin-bottom:45px; }.project-list { gap:38px; }.project-image { aspect-ratio:1.3; }.project-meta { grid-template-columns:1fr;gap:3px; }.project-meta em { margin-top:7px; }.now-list p { grid-template-columns:74px 1fr;gap:11px;font-size:16px; }.cover-foot { padding-top:47px; } footer { gap:17px;flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }