/* Landing page only: warm off-white, calm type, one signal visual, compact research path. Other pages never load this. */
body { background: #F4F1EA; }
html .hero.sky { background: #F4F1EA; margin: 0; border-radius: 0; height: auto; min-height: 100svh; max-height: none; padding: 120px var(--gut) 0; justify-content: center; }
.hero.sky .eyebrow { font-size: 15px; font-weight: 500; color: rgb(11 11 11 / .6); }
.hero.sky h1 { margin-top: 18px; font-size: clamp(48px, min(7.6vw, 13vh), 124px); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.hero.sky .line { margin-top: 26px; max-width: 50ch; font-size: clamp(17px, min(1.5vw, 2.5vh), 21px); font-weight: 400; line-height: 1.5; letter-spacing: -0.012em; color: rgb(11 11 11 / .68); }
.hero.sky .row { margin-top: 30px; gap: 12px; }
.hero.sky .row .btn { height: 50px; padding: 0 26px; font-size: 16px; font-weight: 500; background: #0B0B0B; color: #fff; }
.hero.sky .row .btn:hover { background: #2b2b2b; }
.hero.sky .row .btn.white { background: transparent; color: #0B0B0B; box-shadow: inset 0 0 0 1px rgb(11 11 11 / .25); }
.hero.sky .row .btn.white:hover { background: rgb(11 11 11 / .05); }
.hero.sky .avail { margin-top: 22px; font-size: 13.5px; color: rgb(11 11 11 / .5); }
.ld-sig { width: 100vw; height: clamp(90px, 16vh, 170px); margin: clamp(24px, 4vh, 44px) 0 0; }
.ld-sig canvas { display: block; width: 100%; height: 100%; }
.pill { background: rgb(244 241 234 / .75); }

/* statement */
.lit { padding: clamp(70px, 11vh, 130px) 0; }
.lit p { font-size: clamp(30px, min(4.2vw, 7vh), 64px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.12; max-width: 24ch; }
.js .lit .w { color: #CFCBC2; }

/* the path: one compact row */
.journey { padding: 0 0 clamp(70px, 11vh, 130px); }
.jr-head { text-align: left; margin-bottom: clamp(28px, 4vh, 44px); }
.jr-head h2 { font-size: clamp(34px, 4.2vw, 60px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.05; margin-top: 10px; }
.jr-head br { display: none; }
.journey .eyebrow { font-size: 14px; font-weight: 500; color: rgb(11 11 11 / .55); }
.jr-sub { margin: 14px 0 0; font-size: 18px; font-weight: 400; }
.panels.jr { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; width: min(100% - 2 * var(--gut), 1320px); margin-inline: auto; padding: 0; }
.panels.jr .panel { position: static; height: auto; min-height: 0; max-height: none; margin: 0; padding: 28px; border-radius: 18px; background: #EAE6DC; color: var(--ink); box-shadow: none; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; text-align: left; }
.panels.jr .panel.ink-bg { background: #0B0B0B; color: #fff; }
.jr-meta { justify-content: flex-start; margin-bottom: 40px; }
.jr-meta span { padding: 0; background: none !important; color: inherit !important; font-size: 13.5px; font-weight: 500; opacity: .6; }
.jr-meta .tagx::before { content: "\00B7\00A0"; }
.panels.jr h3 { font-size: clamp(24px, 2.3vw, 34px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.1; }
.panels.jr p { margin-top: 12px; font-size: 16.5px; font-weight: 400; line-height: 1.45; max-width: none; opacity: .72; }
.panels.jr .sci { display: none; }
.panels.jr .bridge { display: none; }
.jr-close { padding: clamp(48px, 7vh, 72px) 0 0; text-align: left; }
.jr-close .mega { font-size: clamp(26px, 3vw, 44px); font-weight: 500; letter-spacing: -0.035em; margin: 0; max-width: none; }
.jr-close .row { justify-content: flex-start; }
.jr-close .btn { height: 48px; font-size: 15.5px; font-weight: 500; background: #0B0B0B; color: #fff; }
.jr-close .btn.white { background: transparent; color: #0B0B0B; box-shadow: inset 0 0 0 1px rgb(11 11 11 / .25); }
.jr-close .btn.white:hover { background: rgb(11 11 11 / .05); color: #0B0B0B; }
.join h2 { font-weight: 500; letter-spacing: -0.04em; font-size: clamp(40px, 5.4vw, 80px); line-height: 1.02; }
@media (max-width: 860px) { .panels.jr { grid-template-columns: 1fr; } .jr-meta { margin-bottom: 20px; } html .hero.sky { padding-top: 96px; } }
.foot .row { grid-template-columns: 1fr; } .foot .links { grid-template-columns: repeat(3, minmax(0, 220px)); justify-content: start; }

/* open problems */
.agenda { padding: 0 0 clamp(70px, 11vh, 130px); }
.agenda h2 { font-size: clamp(34px, 4.2vw, 60px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.05; }
.ag-list { list-style: none; margin: clamp(24px, 4vh, 40px) 0 0; padding: 0; border-top: 1px solid #DDD8CC; }
.ag-list li { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(16px, 4vw, 64px); align-items: baseline; padding: clamp(22px, 3.4vh, 32px) 0; border-bottom: 1px solid #DDD8CC; }
.ag-list h3 { font-size: clamp(22px, 2.1vw, 30px); font-weight: 500; letter-spacing: -0.03em; line-height: 1.15; }
.ag-list p { font-size: 17px; line-height: 1.5; color: rgb(11 11 11 / .68); }
.hero.sky .avail a { color: rgb(11 11 11 / .7); text-decoration: none; border-bottom: 1px solid rgb(11 11 11 / .25); padding-bottom: 2px; }
.hero.sky .avail a:hover { color: #0B0B0B; border-color: #0B0B0B; }
@media (max-width: 760px) { .ag-list li { grid-template-columns: 1fr; gap: 8px; } }

/* footer: no orange type */
.foot .big { color: #F4F1EA !important; font-weight: 500 !important; letter-spacing: -0.05em !important; }
.foot .links a, .foot .links button { color: rgb(244 241 234 / .72) !important; }
.foot .links a:hover, .foot .links button:hover { color: #fff !important; }

/* one screen: the waitlist and footer never cut off */
.join { padding: clamp(48px, 9vh, 96px) 0 clamp(32px, 5vh, 56px) !important; }
.join h2 { font-size: clamp(36px, min(5.4vw, 9vh), 80px) !important; }
.foot { padding: clamp(28px, 5vh, 56px) 0 24px !important; }
.foot .big { font-size: clamp(48px, min(11vw, 16vh), 150px) !important; line-height: .9 !important; }
.foot .row { margin-top: clamp(20px, 3.5vh, 40px) !important; }
.foot .base { margin-top: clamp(16px, 3vh, 28px) !important; }

/* every block fits one screen on laptops and desktops */
.join { padding: clamp(32px, 6vh, 72px) 0 clamp(20px, 3vh, 36px) !important; }
.join h2 { font-size: clamp(32px, min(5vw, 7.5vh), 72px) !important; }
.join .sub { margin-top: clamp(8px, 1.6vh, 18px) !important; font-size: clamp(16px, 2.2vh, 20px) !important; }
#reserve { margin-top: clamp(14px, 2.6vh, 28px) !important; }
#msg { margin-top: 8px !important; min-height: 18px !important; }
.foot { padding: clamp(18px, 3vh, 32px) 0 16px !important; }
.foot .big { font-size: clamp(44px, min(9vw, 11vh), 120px) !important; }
.foot .row { margin-top: clamp(12px, 2vh, 24px) !important; }
.foot .links a, .foot .links button { margin-bottom: 4px !important; font-size: 15px !important; }
.foot .base { margin-top: clamp(10px, 1.6vh, 18px) !important; }

/* the statement holds its own screen, so the research path starts on the next one */
.lit { min-height: 100svh; display: flex; align-items: center; padding: 96px 0 48px; }
.lit .wrap { width: min(100% - 2 * var(--gut), 1320px); }
.journey { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 96px 0 40px; }
.jr-close { padding-top: clamp(24px, 4vh, 56px); }
.jr-close .row { margin-top: clamp(14px, 2.4vh, 28px); }
.panels.jr .panel { padding: clamp(18px, 2.8vh, 28px); }
.jr-meta { margin-bottom: clamp(14px, 3vh, 40px); }

/* ---------- colour: 60 neutral canvas, 30 brand fields, 10 orange on primary actions only ---------- */
:root { --c-canvas: #F6F3EC; --c-sky: #B4CEF8; --c-sage: #BFDEB2; --c-peach: #F8C8AE; --c-cta: #FF8A1F; }
body, .lit, .journey, .agenda { background: var(--c-canvas); }
html .hero.sky { background: var(--c-sky); margin: 10px 12px 0; border-radius: 32px; min-height: calc(100svh - 10px); overflow: hidden; }
.hero.sky .eyebrow { color: rgb(11 11 11 / .78); }
.hero.sky .line { color: rgb(11 11 11 / .82); }
.hero.sky .avail a { color: rgb(11 11 11 / .82); border-color: rgb(11 11 11 / .4); }
.hero.sky .row .btn { background: var(--c-cta); color: #0B0B0B; }
.hero.sky .row .btn:hover { background: #FF9D42; }
.hero.sky .row .btn.white { background: #fff; color: #0B0B0B; box-shadow: none; }
.hero.sky .row .btn.white:hover { background: #F6F3EC; }
.pill { background: rgb(255 255 255 / .72); }
.panels.jr .panel.sky { background: var(--c-sky); }
.panels.jr .panel.sage { background: var(--c-sage); }
.panels.jr .panel { border-radius: 24px; }
.panels.jr .panel p, .jr-meta span { opacity: .82; }
.jr-close .btn { background: var(--c-cta); color: #0B0B0B; }
.jr-close .btn:hover { background: #FF9D42; color: #0B0B0B; }
.ag-list h3 { display: flex; align-items: baseline; gap: 14px; }
.ag-list h3::before { content: ""; flex: none; width: 12px; height: 12px; border-radius: 50%; transform: translateY(-2px); background: var(--c-sky); }
.ag-list li:nth-child(2) h3::before { background: var(--c-sage); }
.ag-list li:nth-child(3) h3::before { background: var(--c-peach); }
.ag-list li:nth-child(4) h3::before { background: var(--c-cta); }
.ag-list p { color: rgb(11 11 11 / .72); }
@media (max-width: 600px) { html .hero.sky { margin: 8px 8px 0; border-radius: 24px; min-height: calc(100svh - 8px); } }
