@font-face{font-family:'EB Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/eb-garamond-normal-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/eb-garamond-normal-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/eb-garamond-normal-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/eb-garamond-normal-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/figtree-normal-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/figtree-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Figtree';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/figtree-normal-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/figtree-normal-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/figtree-normal-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/figtree-normal-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/figtree-normal-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/figtree-normal-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Oxbridge Masterclass demo, 2026 redesign (round 2). The world: Oxford stone, college ink, and one bright sky.
   A serif with real lowercase for headings (three pairs on trial, switch in the dock), a sans for everything else,
   the 2020 wordmark untouched. Layout: a 1240px frame; wide editorial heroes with a live product figure; reading text
   at 64ch; sections alternate paper, stone and ink. Single light look by choice (the live site has no dark mode), so
   every colour is set explicitly. Values here become oxm-site/tokens.json. */
:root{
  --ink:#1B1B22;          /* 2020 ink: text, dark sections */
  --night:#131318;        /* the deepest ink, behind the hero photo */
  --ink-2:#26262F;        /* raised panel on ink */
  --paper:#FFFFFF;
  --paper-2:#FAF9F6;      /* the course player's module list */
  --stone:#EEEBE4;        /* Oxford limestone, alternate sections */
  --stone-2:#E2DED4;      /* stone rules and pressed states */
  --stone-3:#CFC8BA;      /* stone shadows in figures */
  --line:#E3E0D9;
  --field:#8A8791;        /* input borders, 3.4:1 on white */
  --muted:#595964;        /* 6.9:1 on white, 5.8:1 on stone */
  --sky:#3DA7DE;          /* 2020 accent: marks, progress, buttons on ink (ink text on it 6.3:1) */
  --sky-hover:#62B9E6;
  --gold:#E2B65A;         /* Oxford gold (Jamie, 2026-10-23): emphasis on dark grounds only (9.4:1 on night); never text on light */
  --blue:#1C75AD;         /* buttons and links on white: white text on it 5.0:1 (Jamie's pick, 2026-10-21) */
  --blue-press:#165E8B;   /* hover, and link text on stone (5.6:1) */
  --blue-text:var(--blue);
  --on-ink:#F3F1EC;
  --on-ink-muted:#B9B7C0; /* 8.6:1 on ink */
  --ok:#1E7A46;
  --err:#B42318;
  /* type (Jamie's pick, 2026-10-23): EB Garamond for headings, Figtree for everything else, the menu included */
  --f-display:"EB Garamond","Garamond","Times New Roman",serif;
  --f-body:"Figtree","Helvetica Neue",Arial,sans-serif;
  --f-ui:var(--f-body);
  --d-weight:500;         /* heading weight */
  --d-scale:1;            /* heading size factor */
  --d-track:-.01em;
  --wide:1240px;
  --read:64ch;
  --r:6px;
  color-scheme:light;
}
.stone,.on-stone{--blue-text:var(--blue-press)}
html{scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.62 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;caret-color:var(--blue);accent-color:var(--blue);font-variant-numeric:lining-nums}
::selection{background:rgba(61,167,222,.28);color:var(--ink)}
.on-ink ::selection{background:rgba(61,167,222,.45);color:#fff}
html{scrollbar-color:#B8B4AA var(--stone)}
*,*::before,*::after{box-sizing:border-box}
img{max-width:100%;height:auto;display:block}
picture{display:contents}
a{color:var(--blue-text);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px}
.on-ink :focus-visible{outline-color:var(--sky)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:1.05em;height:1.05em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.15em}

/* type: serif headings with real lowercase; h3 and everything smaller in the sans */
h1,h2,.display{font-family:var(--f-display);font-weight:var(--d-weight);letter-spacing:var(--d-track);line-height:1.04;margin:0;text-wrap:balance}
h1,.h1{font-size:calc(var(--d-scale) * clamp(2.6rem,1.5rem + 4.2vw,4.9rem))}
h2,.h2{font-size:calc(var(--d-scale) * clamp(2rem,1.4rem + 2.3vw,3.3rem));line-height:1.08}
h3,.h3{font:600 1.18rem/1.3 var(--f-body);margin:0;letter-spacing:-.005em}
.hl{font-style:normal;color:var(--blue-text)}
.on-ink .hl{color:var(--gold)}  /* emphasis is colour only, never italic (Jamie, 2026-10-23) */
p{margin:0}
.lede{font-size:clamp(1.1rem,1rem + .4vw,1.3rem);line-height:1.55;color:var(--muted);max-width:54ch}
.on-ink .lede{color:var(--on-ink-muted)}
.prose{display:grid;gap:1em;max-width:var(--read)}
.small{font-size:.92rem}
.muted{color:var(--muted)}
.on-ink .muted{color:var(--on-ink-muted)}

/* frame and grounds: each band carries the side gutter on its inner .wrap */
.wrap{width:100%;max-width:calc(var(--wide) + 2*max(16px,4vw));margin-inline:auto;padding-left:max(16px,4vw,env(safe-area-inset-left,0px));padding-right:max(16px,4vw,env(safe-area-inset-right,0px))}
.band{padding-block:clamp(64px,8vw,120px)}
.band.tight{padding-block:clamp(44px,5vw,72px)}
.paper{background:var(--paper)}
.stone{background:var(--stone)}
.on-ink{background:var(--ink);color:var(--on-ink)}
.on-ink a{color:var(--sky)}
.stack{display:grid;gap:20px;align-content:start}
.sec-head{display:grid;gap:16px;margin-bottom:clamp(32px,4.5vw,60px);max-width:62ch}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,88px);align-items:center}
.split > *{min-width:0}
@media (max-width:880px){.split{grid-template-columns:minmax(0,1fr)}}

/* buttons: one primary per moment */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:var(--r);border:1.5px solid var(--blue);background:var(--blue);color:#fff;font:600 1rem/1 var(--f-ui);letter-spacing:.005em;text-decoration:none;cursor:pointer;transition:background-color .15s,transform .15s}
.btn:hover{background:var(--blue-press);border-color:var(--blue-press);text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--blue-text);border-color:var(--blue-text)}
.btn.ghost:hover{background:rgba(28,117,173,.07)}
.on-ink .btn{background:var(--sky);border-color:var(--sky);color:var(--ink)}
.on-ink .btn:hover{background:var(--sky-hover);border-color:var(--sky-hover)}
.on-ink .btn.ghost{background:transparent;color:var(--on-ink);border-color:rgba(243,241,236,.45)}
.btn.block{width:100%}
.btn .ico{width:18px;height:18px}
.btn[aria-busy="true"]{opacity:.8;cursor:progress}
.btn .spin{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.textlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600}
.textlink .ico{transition:transform .2s}
.textlink:hover .ico{transform:translateX(3px)}

/* the OM monogram: the O and the M cut from the 2020 wordmark itself (/assets/img/om.dca0c1ac6f.png; the favicon is made from the
   same cut), so it is the real lettering at any size. --s scales it; dark grounds invert it */
.om{--s:.2;display:inline-block;flex:none;width:calc(220px * var(--s));height:calc(223px * var(--s));background:url(/assets/img/om.dca0c1ac6f.png) center/contain no-repeat}
.on-ink .om,.om.light{filter:invert(1)}

/* header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:24px;min-height:74px}
.brand{display:flex;align-items:center;min-height:44px;flex:none;line-height:0}
.brand img{height:40px;width:auto}
.nav{display:flex;align-items:center;gap:28px;margin-left:auto;font-weight:500;font-size:.97rem}
.nav a{color:var(--ink);text-decoration:none;padding-block:8px;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--sky)}
.nav .btn{color:#fff;border-bottom:1.5px solid var(--blue);padding:0 18px;min-height:44px;font-weight:600}
.nav .btn:hover{border-bottom-color:var(--blue-press)}
.menu-btn{display:none;margin-left:auto;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);font:600 .95rem var(--f-ui);color:var(--ink);align-items:center;gap:8px;cursor:pointer}
.menu{border:0;padding:0;margin:0;inset:auto 0 auto auto;top:calc(66px + env(safe-area-inset-top,0px));width:100%;max-width:100%;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 20px 40px -24px rgba(27,27,34,.4)}
.menu nav{display:grid;padding:8px max(16px,env(safe-area-inset-left,0px)) 20px}
.menu a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:600}
.menu .btn{margin-top:16px;color:#fff;border-bottom:0}
@media (max-width:920px){.nav{display:none}.menu-btn{display:inline-flex}.brand img{height:34px}.site-head .wrap{min-height:66px}}
.site-head.bare .wrap{justify-content:space-between}

/* footer */
.site-foot{padding-block:64px 40px}
.site-foot .wrap{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,1fr));gap:32px}
.site-foot img{height:44px;width:auto;margin-bottom:16px}
.site-foot h2{font:600 .78rem var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--on-ink-muted);margin-bottom:6px}
.site-foot nav{display:grid;align-content:start}
.site-foot nav a{display:flex;align-items:center;min-height:44px;color:var(--on-ink);text-decoration:none}
.site-foot nav a:hover{text-decoration:underline}
.site-foot .fine{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-top:24px;border-top:1px solid rgba(243,241,236,.14);font-size:.88rem;color:var(--on-ink-muted)}
.site-foot .fine a{color:var(--on-ink)}
@media (max-width:700px){.site-foot .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.site-foot .wrap > div:first-child{grid-column:1/-1}}

/* forms */
.field{display:grid;gap:6px;min-width:0}
.field label,.field .lbl{font-weight:600;font-size:.95rem}
.field .hint{font-size:.85rem;color:var(--muted);font-weight:400}
.on-ink .field .hint{color:var(--on-ink-muted)}
.in{width:100%;min-height:52px;padding:10px 14px;border:1.5px solid var(--field);border-radius:var(--r);background:var(--paper);color:var(--ink);font:400 1rem var(--f-body)}
textarea.in{min-height:140px;resize:vertical;line-height:1.5}
select.in{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.in:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.on-ink .in:focus{outline-color:var(--sky);border-color:var(--sky)}
.in[aria-invalid="true"]{border-color:var(--err)}
.err-msg{font-size:.88rem;color:var(--err);font-weight:600}
.err-msg:empty{display:none}
.on-ink .err-msg{color:#FF9B8F}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
@media (max-width:420px){.row2{grid-template-columns:minmax(0,1fr)}}
.check{min-height:44px;display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-size:.94rem;line-height:1.45;cursor:pointer}
.check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--blue)}
.on-ink .check input{accent-color:var(--sky)}
.form{display:grid;gap:16px}
.form-note{font-size:.86rem;color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.on-ink .form-note{color:var(--on-ink-muted)}
.form-note .ico{color:var(--blue);margin-top:2px}
.on-ink .form-note .ico{color:var(--sky)}
.disclose{border-top:1px solid var(--line);padding-top:6px}
.disclose summary{cursor:pointer;min-height:44px;font-weight:600;font-size:.95rem;color:var(--blue-text);list-style:none;display:flex;gap:8px;align-items:center}
.disclose summary::-webkit-details-marker{display:none}
.disclose summary::before{content:"+";display:inline-grid;place-items:center;width:20px;height:20px;border:1.5px solid currentColor;border-radius:50%;font-size:14px;line-height:1;flex:none}
.disclose[open] summary::before{content:"\2013"}
.disclose .row2,.disclose .field{margin-top:8px}

/* the one-line sign-up: email and button side by side (stacks on phones) */
.inline-su{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start}
.inline-su .btn{min-height:56px}
.inline-su .in{min-height:56px;font-size:1.05rem}
@media (max-width:520px){.inline-su{grid-template-columns:minmax(0,1fr)}}
.on-ink .in{border-color:rgba(243,241,236,.35)}

/* the sent state that replaces a form */
.sent{display:grid;gap:12px;padding:4px 0}
.sent-h{display:flex;gap:12px;align-items:center;font:var(--d-weight) calc(var(--d-scale) * 1.55rem)/1.2 var(--f-display);outline:none}
.sent-h .seal{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ok);color:#fff;flex:none}
.sent-h .seal .ico{width:18px;height:18px}
.sent p{color:var(--muted);font-size:.97rem}
.on-ink .sent p{color:var(--on-ink-muted)}
.sent strong{color:var(--ink)}
.on-ink .sent strong{color:#fff}
.sent .acts{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.sent .add-parent{display:grid;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.on-ink .sent .add-parent{border-top-color:rgba(243,241,236,.16)}
.linkbtn{background:none;border:0;padding:0;min-height:44px;font:600 .95rem var(--f-ui);color:var(--blue-text);text-decoration:underline;text-underline-offset:.18em;cursor:pointer}
.on-ink .linkbtn{color:var(--sky)}

/* quotes */
.quote{display:grid;gap:14px;margin:0}
.quote blockquote{margin:0;font-size:1.1rem;line-height:1.55}
.quote figcaption{font-size:.9rem;line-height:1.4;color:var(--muted)}
.quote figcaption b{display:block;font-weight:600;color:var(--ink)}
.on-ink .quote figcaption{color:var(--on-ink-muted)}
.on-ink .quote figcaption b{color:var(--on-ink)}
.qmark{display:block;height:.42em;font:600 3.4rem/1 var(--f-display);color:var(--blue-text)}
.on-ink .qmark{color:var(--sky)}
.quote.big .qmark{font-size:5rem;height:.4em}
.quote.big blockquote{font:var(--d-weight) calc(var(--d-scale) * clamp(1.5rem,1.1rem + 1.4vw,2.3rem))/1.22 var(--f-display);letter-spacing:var(--d-track)}

/* proof line */
.proof{display:inline-flex;gap:10px;align-items:center;font-weight:600;font-size:.97rem}
.proof .dot{width:8px;height:8px;border-radius:50%;background:var(--sky);flex:none;box-shadow:0 0 0 4px rgba(61,167,222,.2)}

/* replay control on the animated figures */
.replay{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:99px;border:1px solid var(--stone-2);background:var(--paper);font:600 .86rem var(--f-ui);color:var(--ink);cursor:pointer}
.replay svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.replay:hover{border-color:var(--ink)}
.on-ink .replay{background:transparent;border-color:rgba(243,241,236,.3);color:var(--on-ink)}

/* video poster (the live page embeds the Wistia player in its place) */
.poster{position:relative;display:block;border-radius:var(--r);overflow:hidden;background:var(--night);aspect-ratio:16/9;max-width:100%;box-shadow:0 30px 60px -36px rgba(27,27,34,.6)}
.poster picture{display:block;position:absolute;inset:0}
.poster img{width:100%;height:100%;object-fit:cover}
.poster::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(19,19,24,.92),rgba(19,19,24,.45) 70%,rgba(19,19,24,.2))}
.poster .pt{position:absolute;z-index:2;left:clamp(16px,5%,40px);top:50%;translate:0 -50%;display:grid;gap:8px;max-width:58%;color:var(--on-ink)}
.poster .pt b{font:var(--d-weight) calc(var(--d-scale) * clamp(1.3rem,.9rem + 1.8vw,2.4rem))/1.08 var(--f-display);color:#fff}
.poster .pt span{font-size:clamp(.8rem,.7rem + .4vw,1rem);color:var(--on-ink-muted)}
.poster .play{position:absolute;z-index:2;right:clamp(16px,8%,72px);top:50%;translate:0 -50%;display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--sky);color:var(--ink);transition:transform .2s}
.poster .play svg{width:30px;height:30px;margin-left:5px;fill:currentColor}
.poster:hover .play{transform:scale(1.06)}
.poster .len{position:absolute;z-index:2;right:12px;bottom:12px;padding:4px 10px;border-radius:99px;background:rgba(19,19,24,.86);color:#fff;font:600 .82rem var(--f-ui);font-variant-numeric:tabular-nums}
@media (max-width:480px){.poster .play{width:60px;height:60px}.poster .play svg{width:22px;height:22px}}

/* FAQ */
.faq{display:grid;border-top:1px solid var(--stone-2)}
.faq details{border-bottom:1px solid var(--stone-2)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:14px 0;font-weight:600;font-size:1.05rem;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:400 1.6rem/1 var(--f-body);color:var(--blue-text);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{padding:0 0 22px;max-width:var(--read);color:var(--muted)}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));translate:-50% 20px;opacity:0;pointer-events:none;z-index:80;padding:12px 18px;border-radius:var(--r);background:var(--ink);color:#fff;font:600 .95rem var(--f-ui);transition:opacity .2s,translate .2s;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;translate:-50% 0}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;animation-iteration-count:1 !important;scroll-behavior:auto !important}}
/* Shared pieces (views/c-parts.js). Prefixes: ds- draft, cp- course player, tf- forwarded email, syl- syllabus,
   su- sign-up panel, fig- figure captions. */
.fig-cap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;font-size:.9rem;color:var(--muted)}
.on-ink .fig-cap{color:var(--on-ink-muted)}

/* ---- 1. the draft ---- */
.ds{margin:0;display:grid;gap:16px;justify-items:center}
.ds-sheet{position:relative;width:100%;max-width:520px;background:var(--paper);border-radius:3px;padding:24px clamp(20px,4vw,38px) 22px;box-shadow:0 1px 0 var(--stone-2),0 40px 60px -36px rgba(19,19,24,.55),0 0 0 1px rgba(27,27,34,.06);color:var(--ink)}
.ds-sheet::after{content:"";position:absolute;inset:auto 12px -7px 12px;height:7px;background:#F7F5F0;box-shadow:0 10px 16px -12px rgba(19,19,24,.45);z-index:-1;border-radius:0 0 3px 3px}
.ds-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ds-ex{font:600 .72rem var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ds-rule{display:block;width:100%;height:5px;margin-top:12px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);opacity:.8}
.ds-stage{margin:14px 0 8px;font:600 .8rem var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.ds-over .ds-stage{color:var(--err)}
.ds-qs{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:q}
.ds-qs li{counter-increment:q;display:grid;gap:4px}
.ds-qs b{font:var(--d-weight) calc(var(--d-scale) * 1.02rem)/1.25 var(--f-display)}
.ds-qs b::before{content:counter(q) ". ";color:var(--blue)}
.ds-qs p{font-size:.93rem;line-height:1.55;min-height:4.65em;transition:opacity .18s,filter .18s}
.ds-swap .ds-qs p{opacity:0;filter:blur(2px)}
.ds-notes .ds-qs p{color:var(--muted)}
.ds-count{display:grid;gap:6px;margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.ds-n{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.ds-n b{color:var(--ink)}
.ds-over .ds-n b{color:var(--err)}
.ds-bar{position:relative;display:block;height:5px;border-radius:3px;background:var(--line);overflow:hidden}
.ds-bar i{display:block;height:100%;background:var(--sky);transition:width .7s cubic-bezier(.2,.7,.2,1),background-color .3s}
.ds-over .ds-bar i{background:var(--err)}
.ds-steps{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px}
.ds-steps > span{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.ds-steps [data-step]{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 6px;border-radius:99px;border:1px solid var(--stone-2);background:var(--paper);font:600 .88rem var(--f-ui);color:var(--ink);cursor:pointer}
.ds-steps [data-step] span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--stone);font-size:.8rem;font-variant-numeric:tabular-nums}
.ds-steps [data-step][aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:var(--on-ink)}
.ds-steps [data-step][aria-pressed="true"] span{background:var(--sky);color:var(--ink)}
.on-ink .ds-steps [data-step]{background:transparent;border-color:rgba(243,241,236,.25);color:var(--on-ink)}
.on-ink .ds-steps [data-step] span{background:rgba(243,241,236,.1)}
.on-ink .ds-steps [data-step][aria-pressed="true"]{background:var(--on-ink);color:var(--ink)}
/* in the hero: a little tilted, as if just set down on the desk */
.ds-hero .ds-sheet{transform:rotate(-1.2deg)}
@media (max-width:560px){.ds-qs p{min-height:0}.ds-hero .ds-sheet{transform:none}}

/* ---- 2. the course player ---- */
.cp{margin:0;display:grid;gap:14px;width:100%}
.cp-frame{border-radius:10px;overflow:hidden;background:var(--paper);box-shadow:0 50px 80px -48px rgba(19,19,24,.6),0 0 0 1px rgba(27,27,34,.08);color:var(--ink);font-size:.9rem}
.cp-bar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--ink);color:var(--on-ink);font-weight:600}
.cp-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cp-prog{flex:1;max-width:220px;margin-left:auto;height:5px;border-radius:3px;background:rgba(243,241,236,.18);overflow:hidden}
.cp-prog i{display:block;width:0;height:100%;background:var(--sky);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.cp-pc{min-width:3ch;font-size:.82rem;color:var(--on-ink-muted);font-variant-numeric:tabular-nums;text-align:right}
.cp-body{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.3fr)}
.cp-list{list-style:none;margin:0;padding:8px 0;border-right:1px solid var(--line);background:var(--paper-2)}
.cp-list li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 14px;font-size:.86rem;line-height:1.3;transition:background-color .3s}
.cp-list li.now{background:var(--stone);font-weight:700}
.cp-dot{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--field);color:transparent;transition:background-color .25s,border-color .25s,color .25s,transform .25s}
.cp-dot .ico{width:12px;height:12px;stroke-width:3}
.cp-list .done .cp-dot{background:var(--sky);border-color:var(--sky);color:var(--ink);transform:scale(1.08)}
.cp-list .now .cp-dot{border-color:var(--sky);box-shadow:inset 0 0 0 4px var(--paper),inset 0 0 0 10px var(--sky)}
.cp-n{font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums}
.cp-lesson{display:grid;gap:10px;align-content:start;padding:18px;opacity:.35;transition:opacity .5s}
.cp-on .cp-lesson{opacity:1}
.cp-crumb{font-size:.78rem;color:var(--muted);font-weight:600}
.cp-title{font:var(--d-weight) calc(var(--d-scale) * 1.12rem)/1.25 var(--f-display)}
.cp-video{position:relative;aspect-ratio:16/9;border-radius:6px;background:radial-gradient(120% 90% at 30% 30%,#2E2E3A,var(--ink));display:grid;place-items:center}
.cp-play{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--sky);color:var(--ink)}
.cp-play svg{width:20px;height:20px;fill:currentColor;margin-left:3px}
.cp-len{position:absolute;right:8px;bottom:8px;font-size:.72rem;font-weight:700;color:var(--on-ink);background:rgba(0,0,0,.4);padding:2px 8px;border-radius:99px}
.cp-next{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;font-size:.84rem}
.cp-next span{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
@media (max-width:640px){.cp-body{grid-template-columns:minmax(0,1fr)}.cp-lesson{display:none}.cp-list{border-right:0}.cp-prog{max-width:90px}}

/* ---- 3. the forwarded email ---- */
.tf{margin:0;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(18px,3vw,36px);align-items:center}
.tf .fig-cap{grid-column:1/-1}
.tf-mail{position:relative;background:var(--paper);border-radius:10px;box-shadow:0 30px 50px -34px rgba(19,19,24,.5),0 0 0 1px rgba(27,27,34,.08);font-size:.9rem;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.tf-head{display:grid;gap:4px;padding:14px 16px;border-bottom:1px solid var(--line);color:var(--muted)}
.tf-head b{display:inline-block;width:62px;color:var(--ink);font-weight:600}
.tf-body{display:grid;gap:10px;padding:16px;line-height:1.5}
.tf-link{font-weight:600;color:var(--blue);overflow-wrap:anywhere}
.tf-send{position:absolute;right:14px;bottom:-18px;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;background:var(--blue);color:#fff;font-weight:600;font-size:.86rem;box-shadow:0 10px 20px -10px rgba(28,117,173,.8);transition:transform .3s,background-color .3s}
.tf-sent .tf-send{transform:scale(.94);background:var(--ok)}
.tf-sent .tf-mail{transform:translateX(6px)}
.tf-class{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;padding:6px}
.tf-class i{aspect-ratio:1;border-radius:50%;background:var(--stone-2);box-shadow:inset 0 0 0 1.5px var(--stone-3);transition:background-color .35s var(--d),box-shadow .35s var(--d),transform .35s var(--d)}
.tf-go .tf-class i{background:var(--sky);box-shadow:inset 0 0 0 1.5px var(--sky);transform:scale(1.06)}
.tf-still .tf-class i{transition:none}
@media (max-width:640px){.tf{grid-template-columns:minmax(0,1fr)}.tf-class{grid-template-columns:repeat(10,1fr);gap:6px}}

/* ---- the syllabus ---- */
.syl{display:grid;gap:18px}
.syl-sum{display:flex;flex-wrap:wrap;gap:8px}
.syl-sum b{padding:6px 12px;border-radius:99px;background:var(--paper);box-shadow:0 0 0 1px var(--stone-2);font-size:.86rem;font-weight:600}
.syl-list{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--stone-2)}
.syl-list li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--stone-2)}
.syl-i{font:var(--d-weight) calc(var(--d-scale) * 1.6rem)/1 var(--f-display);color:var(--blue-text)}
.syl-n{font-weight:600;font-size:1.05rem}
.syl-c{font-size:.88rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---- the sign-up panel ---- */
.su{background:var(--paper);border-radius:10px;box-shadow:0 40px 70px -44px rgba(19,19,24,.55),0 0 0 1px rgba(27,27,34,.07);color:var(--ink);overflow:hidden}
.su-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--stone-2)}
.su-tabs button{min-height:56px;border:0;background:transparent;font:600 1rem var(--f-ui);color:var(--muted);cursor:pointer}
.su-tabs button[aria-selected="true"]{background:var(--paper);color:var(--ink)}
.su-tabs button:hover{color:var(--ink)}
.su-tabs button:focus-visible{outline-offset:-3px}
.su-pane{padding:clamp(22px,3vw,32px);display:grid;gap:16px}
.su-h{font-size:calc(var(--d-scale) * 1.9rem)}
.su-sub{font-size:.95rem;color:var(--muted);margin-top:-6px}
/* Home (views/home.js), 2026 redesign. Prefix hm-. */
/* hero: night ink, Merton across the right two thirds fading into the ink, the draft set down over it */
.hm-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--night)}
.hm-photo{position:absolute;top:0;right:0;width:68%;height:100%;object-fit:cover;object-position:62% 55%;z-index:-2;opacity:.85}
.hm-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--night) 30%,rgba(19,19,24,.82) 48%,rgba(19,19,24,.35) 72%,rgba(19,19,24,.25)),linear-gradient(0deg,rgba(19,19,24,.85),transparent 45%)}
.hm-hero-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,72px);align-items:center;padding-block:clamp(64px,8vw,120px) clamp(64px,8vw,112px)}
.hm-copy{display:grid;gap:26px;max-width:640px}
.hm-copy h1{color:#fff;font-size:calc(var(--d-scale) * clamp(2.5rem,1.4rem + 3.3vw,4.3rem))}
.hm-doors{display:grid;gap:14px;max-width:560px}
.hm-door .check{color:var(--on-ink-muted)}
.hm-teach{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 18px;border-radius:var(--r);border:1px solid rgba(243,241,236,.28);color:var(--on-ink) !important;text-decoration:none;transition:border-color .2s,background-color .2s}
.hm-teach b{font-weight:700}
.hm-teach:hover{border-color:var(--sky);background:rgba(61,167,222,.08)}
.hm-teach .ico{color:var(--sky);transition:transform .2s}
.hm-teach:hover .ico{transform:translateX(3px)}
.hm-copy .proof{color:var(--on-ink)}
.hm-fig{min-width:0}
@media (max-width:980px){
  .hm-hero-in{grid-template-columns:minmax(0,1fr)}
  .hm-photo{width:100%;height:340px;opacity:.55}
  .hm-hero::before{background:linear-gradient(180deg,rgba(19,19,24,.35),var(--night) 340px)}
  .hm-fig{max-width:520px;width:100%;justify-self:center}
}

/* the three questions: a real sequence (the order UCAS asks them) */
.hm-q3{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.hm-q3 li{display:grid;gap:12px;align-content:start;padding-top:22px;border-top:1px solid var(--ink)}
.hm-qn{font:var(--d-weight) calc(var(--d-scale) * clamp(3rem,2rem + 3vw,4.6rem))/.9 var(--f-display);color:var(--blue)}
.hm-q3 h3{font:var(--d-weight) calc(var(--d-scale) * 1.5rem)/1.2 var(--f-display)}
.hm-q3 p{color:var(--muted)}
@media (max-width:820px){.hm-q3{grid-template-columns:minmax(0,1fr)}}

.hm-inside{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,72px);align-items:center}
@media (max-width:920px){.hm-inside{grid-template-columns:minmax(0,1fr)}}

/* proof: one lead quote set large, three supporting, and the schools figure */
.hm-proof .wrap{display:grid;gap:clamp(40px,5vw,64px)}
.hm-lead{max-width:44ch}
.hm-lead blockquote{color:#fff}
.hm-qgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px);padding-top:clamp(28px,4vw,40px);border-top:1px solid rgba(243,241,236,.14)}
@media (max-width:860px){.hm-qgrid{grid-template-columns:minmax(0,1fr)}}
.hm-stat{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;color:var(--on-ink-muted)}
.hm-stat .display{font-size:calc(var(--d-scale) * clamp(2.6rem,2rem + 2.6vw,4rem));line-height:1;color:var(--sky)}

.hm-teachers{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,5vw,72px);align-items:center}
@media (max-width:920px){.hm-teachers{grid-template-columns:minmax(0,1fr)}}

.hm-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:860px){.hm-faq{grid-template-columns:minmax(0,1fr)}}

/* the close: back to Oxford at dusk, the one-line sign-up */
.hm-end{position:relative;overflow:hidden;isolation:isolate;background:var(--night)}
.hm-end-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 40%;z-index:-2;opacity:.4}
.hm-end::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 90% at 50% 100%,rgba(19,19,24,.4),var(--night) 75%)}
.hm-end-in{display:grid;gap:20px;justify-items:center;text-align:center}
.hm-end-in .lede{margin-inline:auto}
.hm-end-form{width:100%;max-width:560px;text-align:left}
.hm-end-form .check{color:var(--on-ink-muted)}
/* Orientation, About, Contact, Log in, 404 (views/pages.js), 2026 redesign. Prefix pg-. */
.pg-or-in{display:grid;gap:clamp(24px,3vw,40px);max-width:940px}
.pg-or-head{display:grid;gap:16px}
.pg-or-head h1{color:#fff}
.pg-or-next{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;padding-top:24px;border-top:1px solid rgba(243,241,236,.16)}
.pg-or-next .stack{gap:4px}
.pg-share{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center;justify-content:space-between;max-width:940px}
.pg-share .stack{gap:4px}
.pg-copy{display:flex;flex-wrap:wrap;gap:10px;align-items:center;min-width:0}
.pg-copy code,.mailbox code{font:600 1rem var(--f-body);padding:13px 16px;border:1px dashed var(--field);border-radius:var(--r);background:var(--paper);user-select:all;overflow-wrap:anywhere;min-width:0}
.pg-copy .btn{min-height:48px}
.mailbox{display:grid;gap:12px;justify-items:start;margin-top:6px}
.mailbox-acts{display:flex;flex-wrap:wrap;gap:10px}
.pg-about{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(36px,6vw,88px);align-items:start}
.pg-about-text{gap:26px}
.pg-about-photo{margin:0;display:grid;gap:8px;position:sticky;top:100px}
.pg-about-photo img{aspect-ratio:4/5;object-fit:cover;object-position:76% 50%;border-radius:var(--r)}
.pg-about-photo figcaption{font-size:.85rem;color:var(--muted)}
@media (max-width:860px){.pg-about{grid-template-columns:minmax(0,1fr)}.pg-about-photo{position:static}.pg-about-photo img{aspect-ratio:16/10}}
.pg-unis{font:var(--d-weight) calc(var(--d-scale) * clamp(1.2rem,.9rem + 1.3vw,1.9rem))/1.5 var(--f-display);text-align:center;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 22px;margin:0;color:var(--on-ink)}
.pg-unis i{width:6px;height:6px;border-radius:50%;background:var(--sky)}
.pg-contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(36px,6vw,88px);align-items:start}
.pg-contact .stack{gap:22px}
.pg-card{background:var(--paper);border-radius:10px;padding:clamp(22px,3vw,34px);box-shadow:0 30px 60px -44px rgba(19,19,24,.5),0 0 0 1px rgba(27,27,34,.07)}
@media (max-width:860px){.pg-contact{grid-template-columns:minmax(0,1fr)}}
.pg-login .wrap{display:grid;justify-items:center}
.pg-login-card{width:100%;max-width:460px;display:grid;gap:16px;justify-items:start;background:var(--paper);border-radius:10px;padding:clamp(24px,4vw,44px);box-shadow:0 30px 60px -40px rgba(19,19,24,.5),0 0 0 1px rgba(27,27,34,.07)}
.pg-login-card .form{width:100%}
.pg-nf-in{display:grid;gap:18px;justify-items:center;text-align:center}
.pg-nf-num{font:600 clamp(4.5rem,3rem + 8vw,9.5rem)/1 var(--f-display);letter-spacing:.1em;color:var(--stone-2);text-shadow:0 1px 0 #fff,0 -1px 0 rgba(27,27,34,.28);margin:0}
.pg-nf-acts{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 26px;margin-top:6px}
/* Personal Statement and Personal Statement Course pages (views/ps.js), 2026 redesign. Prefixes ps-, psc-.
   Hero grid: intro and panel side by side, the tour under the intro; on phones intro, panel, then the tour. */
.ps-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);grid-template-areas:"intro panel" "more panel";column-gap:clamp(36px,6vw,88px);row-gap:32px;align-items:start}
.ps-intro{grid-area:intro;gap:24px}
.ps-panel{grid-area:panel;position:sticky;top:100px}
.ps-more{grid-area:more;min-width:0}
@media (max-width:920px){.ps-hero-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "panel" "more"}.ps-panel{position:static}}
.ps-ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ps-ticks li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px}
.ps-ticks .ico{color:var(--blue-text);width:22px;height:22px;stroke-width:2.4;margin-top:2px}
.ps-tour{max-width:520px}
.ps-syl{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,5vw,72px);align-items:start}
@media (max-width:880px){.ps-syl{grid-template-columns:minmax(0,1fr)}}
.ps-teach{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,5vw,72px);align-items:center}
@media (max-width:920px){.ps-teach{grid-template-columns:minmax(0,1fr)}}
.ps-steps{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:18px;counter-reset:st}
.ps-steps li{counter-increment:st;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:2px}
.ps-steps li::before{content:counter(st);grid-row:span 2;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1.5px solid var(--ink);font:var(--d-weight) calc(var(--d-scale) * 1.3rem)/1 var(--f-display)}
.ps-steps b{font-weight:600}
.ps-steps span{color:var(--muted)}
.ps-faq-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:860px){.ps-faq-wrap{grid-template-columns:minmax(0,1fr)}}
.ps-close-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:center}
.ps-close-in .check{color:var(--on-ink-muted)}
@media (max-width:820px){.ps-close-in{grid-template-columns:minmax(0,1fr)}}
/* the private landing page: Merton behind the sign-up */
.psc-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--night);padding-block:clamp(56px,7vw,104px)}
.psc-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%;z-index:-2;opacity:.5}
.psc-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--night) 25%,rgba(19,19,24,.7) 60%,rgba(19,19,24,.55))}
.psc-hero h1{color:#fff}
.psc-hero .proof{color:var(--on-ink)}
.psc-q{padding-top:22px;border-top:1px solid rgba(243,241,236,.16);max-width:46ch}
/* Launch additions to the demo's CSS (build.py appends this after core.css and the views' CSS) */
[hidden]{display:none!important}
.toast{bottom:calc(24px + env(safe-area-inset-bottom,0px))}

/* honeypot: off screen for people, still in the form for bots */
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

/* who is signing up: three choices as buttons */
.roles{border:0;margin:0;padding:0;min-width:0}
.roles legend{padding:0;margin:0 0 8px;font-weight:600;font-size:.95rem}
.roles-in{display:flex;flex-wrap:wrap;gap:8px}
.role{position:relative;display:inline-flex;cursor:pointer}
.role input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.role span{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1.5px solid var(--field);border-radius:var(--r);background:var(--paper);color:var(--ink);font-size:.94rem;font-weight:500}
.role input:checked+span{border-color:var(--blue);background:var(--blue);color:#fff}
.role input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.on-ink .role span{background:transparent;color:var(--on-ink);border-color:rgba(243,241,236,.35)}
.on-ink .role input:checked+span{background:var(--sky);border-color:var(--sky);color:var(--ink)}
.on-ink .role input:focus-visible+span{outline-color:var(--sky)}

/* step two of the one-line sign-up */
.su-more{display:grid;gap:14px}
.su-more-h{margin:0;font-weight:600}
.stepped .inline-su{grid-template-columns:minmax(0,1fr)}
.su-send .btn{min-height:56px}

/* a form that couldn't be sent */
.form-err{margin:0;padding:12px 14px;border-radius:var(--r);background:#FDECEA;color:var(--err);font-size:.94rem;font-weight:500;line-height:1.45}
.form-err a{color:inherit;text-decoration:underline}
.on-ink .form-err{background:rgba(255,155,143,.14);color:#FFB4AB}

/* the Wistia player in place of the tour poster */
.poster.playing iframe{position:absolute;inset:0;width:100%;height:100%;border:0}