:root{
  --paper:#ffffff;
  --ink:#16181d;
  --soft:#555b66;
  --rule:#dfe2e8;
  --cobalt:#2440e8;
  --mist:#e8ebfd;
  --sans:"Schibsted Grotesk",system-ui,sans-serif;
  --serif:"Source Serif 4",Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font:19px/1.62 var(--serif);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--cobalt)}
.wrap{max-width:1160px;margin:0 auto;padding:0 32px}

.top{display:flex;justify-content:space-between;align-items:baseline;padding:28px 0}
.top .name{font:800 21px/1 var(--sans);letter-spacing:-.01em;text-decoration:none}
.top nav{display:flex;gap:26px;font:500 16px/1 var(--sans)}
.top nav a{text-decoration:none;color:var(--soft)}
.top nav a:hover{color:var(--ink)}

.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:72px;align-items:end;padding:56px 0 96px}
.hero h1{font:800 clamp(44px,6.4vw,84px)/1.02 var(--sans);letter-spacing:-.035em;max-width:13ch}
.hero .cred{font:500 17px/1.45 var(--sans);margin-top:26px;padding-left:16px;border-left:3px solid var(--cobalt);max-width:40ch}
.hero .cred a{text-decoration:none}
.hero .cred a:hover{text-decoration:underline}
.hero .sub{font-size:22px;line-height:1.5;color:var(--soft);margin-top:30px;max-width:34ch}
.photo{position:relative;margin-bottom:8px;isolation:isolate}
.photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
.photo::before{content:"";position:absolute;left:-22px;bottom:-22px;width:62%;height:52%;background:var(--cobalt);z-index:-1}

.launches{background:var(--cobalt);color:#fff;padding:96px 0 104px}
.launches h2{font:800 clamp(34px,4.4vw,56px)/1.05 var(--sans);letter-spacing:-.03em;max-width:16ch}
.launches .intro{font-size:21px;line-height:1.55;color:#d6dcff;max-width:44ch;margin-top:20px}
.log{list-style:none;margin-top:56px;border-top:1px solid rgba(255,255,255,.32)}
.log li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) minmax(0,.7fr);gap:32px;align-items:baseline;padding:26px 0;border-bottom:1px solid rgba(255,255,255,.32)}
.log .what{font:700 clamp(24px,2.6vw,34px)/1.15 var(--sans);letter-spacing:-.02em}
.log .what a{text-decoration:none}
.log .what a:hover{color:#fff;text-decoration:underline}
.log p{color:#e3e7ff;font-size:18px;line-height:1.5}
.log .field{font:500 15px/1.3 var(--sans);color:#c3cbff;text-align:right}

.block{padding:104px 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:72px}
.block + .block{border-top:1px solid var(--rule)}
.block h2{font:800 clamp(32px,3.6vw,46px)/1.08 var(--sans);letter-spacing:-.03em;max-width:12ch}
.prose p{max-width:62ch;margin-bottom:1.05em}
.prose p.lead{font-size:23px;line-height:1.5}

.posts{list-style:none;border-top:1px solid var(--rule)}
.posts li{border-bottom:1px solid var(--rule)}
.posts a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:baseline;padding:20px 0;text-decoration:none}
.posts .t{font:600 21px/1.3 var(--sans);letter-spacing:-.01em}
.posts a:hover .t{color:var(--cobalt)}
.posts .k{font:500 15px/1 var(--sans);color:var(--soft);white-space:nowrap}
.more{display:inline-block;margin-top:28px;font:600 17px/1 var(--sans)}

.projects{list-style:none;border-top:1px solid var(--rule)}
.projects li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:28px;padding:24px 0;border-bottom:1px solid var(--rule)}
.projects .n{font:700 24px/1.2 var(--sans);letter-spacing:-.015em}
.projects .n a{text-decoration:none}
.projects .s{display:block;font:500 15px/1.4 var(--sans);color:var(--soft);margin-top:6px}
.projects p{max-width:52ch}
.disclaimer{font:italic 400 15px/1.5 var(--serif);color:var(--soft);margin-top:18px;max-width:60ch}
.book{display:grid;grid-template-columns:180px minmax(0,1fr);gap:40px;align-items:start}
.book img{width:100%;height:auto;display:block;box-shadow:0 18px 40px -18px rgba(22,24,29,.45)}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.btn{font:600 16px/1 var(--sans);padding:15px 22px;text-decoration:none;border:2px solid var(--ink);display:inline-block}
.btn.solid{background:var(--ink);color:#fff}
.btn.solid:hover{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
.btn:not(.solid):hover{border-color:var(--cobalt);color:var(--cobalt)}

.qa dt{font:700 21px/1.3 var(--sans);letter-spacing:-.01em;margin-top:30px}
.qa dt:first-child{margin-top:0}
.qa dd{color:var(--soft);margin-top:8px;max-width:62ch}

.contact{background:var(--mist);padding:96px 0}
.contact .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:72px}
.contact h2{font:800 clamp(32px,3.6vw,46px)/1.08 var(--sans);letter-spacing:-.03em}
.contact .mail{font:700 clamp(24px,2.8vw,34px)/1.2 var(--sans);letter-spacing:-.02em;color:var(--cobalt);text-decoration:none;display:inline-block;margin:6px 0 26px}
.contact .mail:hover{text-decoration:underline}
.elsewhere{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;font:500 17px/1.4 var(--sans)}

footer{padding:34px 0 44px;font:400 15px/1.5 var(--sans);color:var(--soft)}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px}
.launches :focus-visible{outline-color:#fff}

.skip{position:absolute;left:-9999px;top:0;z-index:30;background:var(--ink);color:#fff;padding:14px 18px;font:600 16px/1 var(--sans);text-decoration:none}
.skip:focus{left:16px;top:16px;color:#fff}
.top .name{display:inline-block;padding:12px 0}
.top nav a{padding:14px 0}
.menu-toggle{display:none;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 16px;border:2px solid var(--ink);background:none;color:var(--ink);font:600 16px/1 var(--sans);cursor:pointer}
.hero .btns{margin-top:30px}
.sticky-cta{display:none}

.glance{width:100%;border-collapse:collapse;font:500 17px/1.45 var(--sans)}
.glance caption{text-align:left;font:600 14px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);padding-bottom:14px}
.glance th,.glance td{text-align:left;vertical-align:top;padding:14px 0;border-top:1px solid var(--rule)}
.glance tr:last-child th,.glance tr:last-child td{border-bottom:1px solid var(--rule)}
.glance th{font-weight:700;width:34%;padding-right:24px}
.glance td{color:var(--soft)}
.glance a{color:var(--ink)}

.lead-in{margin-bottom:22px;max-width:52ch}
.projects h3.n{font:700 24px/1.2 var(--sans);letter-spacing:-.015em}
.log h3.what{font:700 clamp(24px,2.6vw,34px)/1.15 var(--sans);letter-spacing:-.02em}
.cover{margin:0}
.cover figcaption{font:500 14px/1.4 var(--sans);color:var(--soft);margin-top:12px}
.posts .k time{margin-left:10px}
.qa h3{font:700 21px/1.3 var(--sans);letter-spacing:-.01em;margin-top:30px}
.qa h3:first-child{margin-top:0}
.qa p{color:var(--soft);margin-top:8px;max-width:62ch}
.prose .more{margin-top:8px}

footer nav{display:flex;flex-wrap:wrap;gap:4px 22px}
footer a{color:var(--soft);display:inline-block;padding:11px 0;min-height:44px;min-width:44px}
footer a:hover{color:var(--cobalt)}
.byline{flex-basis:100%}

.page{padding:56px 0 104px;max-width:760px}
.page h1{font:800 clamp(40px,5vw,64px)/1.05 var(--sans);letter-spacing:-.03em;margin-bottom:28px}
.page h2{font:800 30px/1.15 var(--sans);letter-spacing:-.02em;margin:48px 0 16px}
.page p,.page li{margin-bottom:1em;max-width:62ch}
.page ul{padding-left:1.2em}
.crumbs{font:500 15px/1.4 var(--sans);color:var(--soft);margin-top:24px}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.crumbs li+li::before{content:"/";margin-right:8px}

@media (max-width:960px){
  .hero{grid-template-columns:1fr;gap:48px;padding:24px 0 80px}
  .photo{max-width:440px;margin-left:22px}
  .block,.contact .wrap{grid-template-columns:1fr;gap:28px}
  .block{padding:80px 0}
  .log li{grid-template-columns:1fr;gap:6px}
  .log .field{text-align:left;order:-1}
  .top{flex-wrap:wrap;align-items:center}
  .menu-toggle{display:inline-flex}
  .top nav{display:none;width:100%;flex-direction:column;gap:0;margin-top:12px}
  .top nav.open{display:flex}
  .top nav a{padding:12px 0;min-height:44px;border-top:1px solid var(--rule);color:var(--ink)}
  .sticky-cta{display:block;position:fixed;left:16px;right:16px;bottom:16px;z-index:20;background:var(--ink);color:#fff;text-align:center;padding:16px 20px;font:600 17px/1 var(--sans);text-decoration:none;box-shadow:0 10px 30px -10px rgba(22,24,29,.5)}
  .sticky-cta:hover{color:#fff;background:var(--cobalt)}
  body{padding-bottom:84px}
  .glance th{width:40%}
}
@media (max-width:520px){
  .wrap{padding:0 16px}
  body{font-size:18px}
  .book{grid-template-columns:1fr}
  .book img{max-width:180px}
  .posts a{grid-template-columns:1fr;gap:6px}
  .projects li{grid-template-columns:1fr;gap:8px}
}
.facts{display:grid;grid-template-columns:max-content 1fr;gap:10px 28px;font:500 17px/1.45 var(--sans);margin:8px 0 8px;padding:20px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.facts dt{font-weight:700}
.facts dd{color:var(--soft)}
