:root{
  /* light theme is the default; data-theme="dark" on <html> switches to the dark one */
  --canvas:#ffffff;--text:#0b0f19;--muted:#2f3a4a;--micro:#4b5563;--hair:#e7e9ee;
  --accent:#1a64c8;--cyan:#0a7fd6;--blue:#1473e6;
  --line:#d4d8df;--line-strong:#bfc5ce;--glass:rgba(255,255,255,.78);--field:#f7f8fa;--option-bg:#ffffff;
  --spec-axis:#9aa3af;--spec-num:#1f2937;--trace:#0d4ea6;--trace-blend:normal;--rline:#c9ced6;--trace-w:1.2;
  --an-lead:#a3a9b3;--an-anc:#7b8290;--an-tag:#2f3a4a;--an-tag-dim:#9aa1ab;
  --pk-lbl:#111827;--svc-lbl:#2f3a4a;--brace:#b8bec8;--brace-tag:#4b5563;--mini-trace:#9aa1ab;
  --body-weight:400;--label-weight:500;--head-weight:600;
  --err-line:#c0392b;--err-text:#b42318;--soon-line:rgba(10,127,214,.45);
  --avatar-bg:#eef2f7;--shot-shadow:0 12px 32px rgba(15,23,42,.12),0 0 0 1px rgba(15,23,42,.10);
  --spec-w:clamp(300px, 19vw, 360px);
  color-scheme:light;
}
:root[data-theme="dark"]{
  --canvas:#070708;--text:#fff;--muted:#8f8f93;--micro:#a8a8ac;--hair:#1c1c1f;
  --accent:#63a8f8;--cyan:#00ccff;--blue:#0c92f6;
  --line:#2a2a2e;--line-strong:#3a3a40;--glass:rgba(7,7,8,.6);--field:rgba(255,255,255,.03);--option-bg:#111114;
  --spec-axis:#4a4a52;--spec-num:#fff;--trace:#bfe9ff;--trace-blend:screen;--rline:#3a3a40;--trace-w:.7;
  --body-weight:300;--label-weight:400;--head-weight:500;
  --an-lead:#5a5a62;--an-anc:#9a9aa2;--an-tag:#b0b0b8;--an-tag-dim:#55555b;
  --pk-lbl:#c4c4ca;--svc-lbl:#a8a8ac;--brace:#4a4a52;--brace-tag:#8f8f93;--mini-trace:#7a7a82;
  --err-line:#a4433a;--err-text:#d08b84;--soon-line:rgba(0,204,255,.45);
  --avatar-bg:radial-gradient(circle at 40% 35%,#1c2a44,#0b0f18 70%);--shot-shadow:0 12px 32px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.08);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--canvas);scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:Inter,system-ui,sans-serif;font-weight:var(--body-weight);color:var(--text);background:var(--canvas);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:1px solid var(--cyan);outline-offset:4px}

.bar{position:fixed;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:0 40px 0 calc(var(--spec-w) + 12px);pointer-events:none}
.bar>*{pointer-events:auto}
.bar.top{top:0;height:80px;padding-right:calc(var(--spec-w) + 12px)}
.bar.bottom{bottom:0;height:72px;align-items:flex-end;justify-content:flex-end;padding-bottom:28px;padding-right:calc(var(--spec-w) + 12px)}
.mark{display:block;line-height:0}
.mark img{height:52px;width:auto;display:block}
.cta{font-size:11px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;font-weight:400;padding:12px 18px;border:1px solid var(--line);transition:border-color .25s;background:var(--glass)}
.cta:hover{border-color:var(--text)}
.bar-right{display:flex;align-items:center;gap:4px}
.lang{font-size:10px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;font-weight:400;color:var(--micro);padding:12px 14px;margin-right:4px;transition:color .25s}
.lang:hover{color:var(--text)}
.cue{position:absolute;left:40px;bottom:28px;transition:opacity .3s;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--micro);display:flex;flex-direction:column;gap:12px;font-variant-numeric:tabular-nums}
.cue b{font-weight:400;color:var(--text);font-size:11px;letter-spacing:.28em}
.cue svg{width:40px;height:150px;display:block;overflow:visible}
.cue #miniTrace{fill:none;stroke:var(--mini-trace);stroke-width:.7}
.cue #miniMark{stroke:var(--cyan);stroke-width:1}

/* spectrum column */
.spec{position:fixed;top:0;right:0;width:var(--spec-w);height:100vh;z-index:3}
.spec canvas{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none;display:block}
.spec svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.spec .axis,.spec .tick{stroke:var(--spec-axis);stroke-width:1}
.spec .ppm{font-size:9px;fill:var(--spec-num);font-family:Inter,sans-serif;letter-spacing:.08em}
.spec .trace{fill:none;stroke:var(--trace);stroke-width:var(--trace-w);stroke-linejoin:round;opacity:.9;mix-blend-mode:var(--trace-blend)}
.spec .rline{stroke:var(--rline);stroke-width:1;stroke-dasharray:2 5}

/* annotation: chemical-shift labels on prominent peaks */
.an .lead{stroke:var(--an-lead);stroke-width:.8;fill:none}
.an .anc{fill:var(--an-anc)}
.an .tag{font-size:9px;fill:var(--an-tag);font-family:Inter,sans-serif;letter-spacing:.14em;text-anchor:end;font-variant-numeric:tabular-nums}
.an .tag tspan{fill:var(--an-tag-dim)}

/* bookmarks */
.pk{cursor:pointer;outline:none}
.pk .hit{fill:transparent;stroke:none}
.pk .dot{fill:var(--canvas);stroke:var(--blue);stroke-width:1;transition:stroke .3s,fill .3s}
.pk .stem{stroke:var(--blue);stroke-width:1;fill:none;opacity:.55;transition:opacity .3s,stroke .3s}
.pk.active .stem{stroke:var(--cyan)}
.pk .lbl{font-size:11px;letter-spacing:.26em;text-transform:uppercase;fill:var(--pk-lbl);font-family:Inter,sans-serif;font-weight:400;opacity:.8;transition:opacity .3s,fill .3s;text-anchor:end}
.pk:hover .lbl,.pk:focus-visible .lbl,.pk.active .lbl{opacity:1}
.pk:hover .stem,.pk:focus-visible .stem,.pk.active .stem{opacity:1}
.pk.active .dot{fill:var(--cyan);stroke:var(--cyan)}
.pk.active .lbl{fill:var(--text)}
.pk:focus-visible .dot{stroke:var(--cyan)}

/* index note: rides with the spectrum, just above Platform */
.note{font-size:10px;fill:var(--accent);font-family:Inter,sans-serif;letter-spacing:.06em;text-anchor:end;line-height:1.5}
/* tags behave like links */
.pk .lbl,.svc .lbl{cursor:pointer}
.pk:hover .lbl tspan:first-child,.svc:hover .lbl tspan:first-child{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:.5px}
@keyframes ping{0%{r:3.5;opacity:.9}100%{r:18;opacity:0}}
.pk .ping{fill:none;stroke:var(--cyan);stroke-width:1;opacity:0}
.pk.active .ping{animation:ping 1.4s ease-out 1s 2}
@media (prefers-reduced-motion:reduce){.pk.active .ping{animation:none}}

/* service labels inside the column */
.brace{fill:none;stroke:var(--brace);stroke-width:1}
.brace-tag{font-size:9px;fill:var(--brace-tag);font-family:Inter,sans-serif;letter-spacing:.3em;text-transform:uppercase;text-anchor:end}
.svc{cursor:pointer;outline:none}
.svc .hit{fill:transparent}
.svc .dot{fill:var(--canvas);stroke:var(--blue);stroke-width:1;transition:fill .3s,stroke .3s}
.svc .lbl{font-size:10px;fill:var(--svc-lbl);font-family:Inter,sans-serif;font-weight:400;text-anchor:end;letter-spacing:.06em;transition:fill .3s}
.svc:hover .dot,.svc:focus-visible .dot{fill:var(--cyan);stroke:var(--cyan)}
.svc:hover .lbl,.svc:focus-visible .lbl{fill:var(--text)}
.pk .lbl .ppm,.svc .lbl .ppm{fill:var(--accent);letter-spacing:.08em;font-variant-numeric:tabular-nums}
.pk .lbl .ppm{font-size:9px}
.svc .lbl .ppm{font-size:9px}

/* lists: numerals in blue, no cards, no rules */
.passes,.offers{list-style:none;margin:40px 0 0;padding:0;max-width:640px}
.passes li,.offers li{display:grid;grid-template-columns:40px 1fr;gap:6px 20px;padding:18px 0}
.passes .n,.offers .n{font-size:10px;letter-spacing:.3em;color:var(--accent);padding-top:5px}
.passes b,.offers b{font-weight:400;font-size:18px;color:var(--text)}
.passes li>span:last-child,.offers li>span:not(.n){grid-column:2;font-size:15.5px;line-height:1.55;color:var(--muted)}
.offers em{grid-column:2;font-style:normal;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--micro);margin-top:6px;font-variant-numeric:tabular-nums}
.sectors{font-size:13px;letter-spacing:.06em;color:var(--muted);margin-top:36px}
.actions{margin-top:32px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.actions .cta{border-color:var(--line-strong)}
.mail{font-size:14px;color:var(--muted);text-decoration:none;letter-spacing:.04em}
.mail:hover{color:var(--text)}

/* team */
.people{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:36px 32px;max-width:760px}
.people li{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:start}
.people .avatar{grid-column:1/-1;width:80px;height:80px;border:1px solid var(--line);background:var(--avatar-bg);margin-bottom:12px;display:block;object-fit:cover}
.people b{font-weight:400;font-size:16px;color:var(--text)}
.people li>span:not(.avatar){grid-column:1;font-size:13px;line-height:1.5;color:var(--muted)}
.people .soc{grid-column:2;grid-row:2;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--micro);text-decoration:none;padding-top:4px}
.people .soc:hover{color:var(--text)}
.socials a{font-size:10px;letter-spacing:.22em;text-transform:uppercase}

/* footer */
.site-foot{border-top:1px solid var(--hair);padding:56px 40px 32px calc(var(--spec-w) + 12px);max-width:calc(100% - var(--spec-w));font-size:13px;color:var(--muted)}
.site-foot .cols{display:grid;grid-template-columns:1.6fr 1fr 1.2fr 1fr;gap:32px}
.site-foot .cols>div{display:flex;flex-direction:column;gap:10px}
.site-foot b{font-weight:400;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--micro);margin-bottom:6px}
.site-foot a{text-decoration:none;color:var(--muted)}
.site-foot a:hover{color:var(--text)}
.brand-col .logo-d,.brand-col .logo-l{height:32px;width:auto;margin-bottom:6px}
.brand-col p{max-width:32ch;line-height:1.55}
.socials{display:flex;gap:22px;margin-top:8px}
.legal{display:flex;gap:28px;margin-top:48px;padding-top:20px;border-top:1px solid var(--hair);font-size:11px;letter-spacing:.08em}
@media (max-width:900px){
  .site-foot{padding:40px 20px 28px;max-width:100%}
  .site-foot .cols{grid-template-columns:1fr 1fr}
}

main{padding:0 0 4vh}
section{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 40px 0 calc(var(--spec-w) + 12px);max-width:calc(100% - var(--spec-w))}
.idx{font-size:10px;letter-spacing:.3em;color:var(--accent);margin-bottom:24px;font-weight:400}
h1,h2{font-family:Manrope,Inter,system-ui,sans-serif;font-weight:var(--head-weight);margin:0;line-height:1.08;letter-spacing:-.025em}
h1{font-size:clamp(34px,5.2vw,68px);max-width:12ch}
h2{font-size:clamp(30px,3.8vw,52px);max-width:14ch}
h1 .accent{color:var(--accent)}
section p{font-size:17px;line-height:1.6;color:var(--muted);max-width:44ch;margin:28px 0 0}

@media (max-width:900px){
  :root{--spec-w:170px}
  .bar{padding:0 20px}
  .bar.top,.bar.bottom{padding-right:20px}
  section{padding:0 20px}
  .an{display:none}
  .pk .lbl{display:none}
}

/* ── contact form ─────────────────────────────────────────────── */
.cform{margin-top:36px;max-width:560px;display:flex;flex-direction:column;gap:18px}
.cform .row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cform label{display:flex;flex-direction:column;gap:8px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--micro)}
.cform input,.cform select,.cform textarea{font:300 15px Inter,system-ui,sans-serif;color:var(--text);background:var(--field);border:1px solid var(--line);padding:11px 13px;border-radius:0;transition:border-color .2s;letter-spacing:.01em}
.cform select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--micro) 50%),linear-gradient(135deg,var(--micro) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.cform select option{background:var(--option-bg);color:var(--text)}
.cform textarea{resize:vertical;min-height:96px;line-height:1.55}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--cyan)}
.cform input:user-invalid,.cform textarea:user-invalid{border-color:var(--err-line)}
.cform .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.cform button.cta{font-family:inherit;color:var(--text);cursor:pointer;background:var(--glass)}
.cform button.cta:disabled{opacity:.5;cursor:default;border-color:var(--line)}
.fmsg{font-size:13px;color:var(--muted);margin:0;min-height:1.2em;max-width:44ch}
.fmsg.ok{color:var(--cyan)}
.fmsg.err{color:var(--err-text)}
@media (max-width:900px){.cform .row{grid-template-columns:1fr}}

/* ── mobile services list under hero ──────────────────────────── */
.svc-mobile{display:none}
@media (max-width:900px){
  .svc-mobile{display:flex;flex-direction:column;gap:12px;list-style:none;margin:32px 0 0;padding:0}
  .svc-mobile a{font-size:13px;letter-spacing:.06em;color:var(--muted);text-decoration:none;border-bottom:1px solid var(--hair);padding-bottom:12px;display:block}
  .svc-mobile a:hover{color:var(--text)}
}

/* ── document pages (workflow, services, privacy, terms, 404) ─── */
main.doc section{min-height:auto;padding-top:12vh;padding-bottom:4vh;justify-content:flex-start}
main.doc section:first-child{min-height:76vh;justify-content:center;padding-top:0}
main.doc section:last-child{padding-bottom:14vh}
main.doc h1{max-width:14ch}
ul.plain{list-style:none;margin:32px 0 0;padding:0;max-width:640px;display:flex;flex-direction:column;gap:16px}
ul.plain li{font-size:15.5px;line-height:1.6;color:var(--muted);padding-left:20px;position:relative}
ul.plain li::before{content:'';position:absolute;left:0;top:10px;width:5px;height:5px;background:var(--accent)}
ul.plain b{font-weight:400;color:var(--text)}
.terms{font-size:11px!important;letter-spacing:.18em;text-transform:uppercase;color:var(--micro)!important;margin-top:28px!important;font-variant-numeric:tabular-nums}
a.inline{color:var(--muted);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:.5px}
a.inline:hover{color:var(--text)}
.offers b a,.passes b a{text-decoration:none}
.offers b a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:.5px}

/* ── fixes ────────────────────────────────────────────────────── */
/* tall sections (contact form) must clear the fixed top bar */
#contact{justify-content:flex-start;padding-top:19vh;padding-bottom:8vh;min-height:auto}
#team{padding-top:16vh;padding-bottom:8vh;min-height:auto}
/* footer logo: stacked mark, keep aspect */
.site-foot .brand-col .logo-d,.site-foot .brand-col .logo-l{height:auto!important;width:74px;max-width:74px;margin-bottom:14px}
/* doc pages: tighten the gap under the page title */
main.doc section:first-child{min-height:58vh}
main.doc section+section{padding-top:9vh}

/* ── mobile layout ────────────────────────────────────────────── */
@media (max-width:900px){
  :root{--spec-w:120px}
  section{min-height:auto;padding-top:118px;padding-bottom:56px;justify-content:flex-start}
  main.doc section,main.doc section:first-child,main.doc section+section{min-height:auto;padding-top:118px;padding-bottom:48px}
  main.doc section+section{padding-top:56px}
  #contact,#team{padding-top:118px;padding-bottom:56px}
  h1{font-size:clamp(30px,8.4vw,40px);max-width:none}
  h2{font-size:clamp(25px,6.6vw,34px);max-width:none}
  section p{font-size:15.5px;max-width:none}
  .bar.top{height:70px;background:linear-gradient(var(--canvas) 62%,transparent);backdrop-filter:blur(2px)}
  .mark img{height:42px}
  .cta{font-size:10px;padding:10px 14px}
  /* spectrum: keep the trace as texture, drop the labels that collide */
  .spec .ppm,.svc .lbl,.brace,.brace-tag,.note,.an{display:none}
  .pk .lbl{display:none}
  .cue{display:none}
  .passes li,.offers li{grid-template-columns:28px 1fr;gap:4px 12px}
  .people{grid-template-columns:1fr;gap:28px}
  .site-foot{padding-bottom:40px}
}
@media (max-width:520px){
  :root{--spec-w:78px}
}

/* ── header: logo in the left gutter, text fades under the bar ── */
/* The logo used to line up with the text column, so body copy scrolled
   underneath it. It now sits in the empty gutter, level with the cue. */
.bar.top{padding-left:40px}
@media (min-width:901px){
  .bar.top::before{content:'';position:absolute;left:0;top:0;right:var(--spec-w);height:100%;background:linear-gradient(var(--canvas) 64%,transparent);z-index:-1;pointer-events:none}
}
@media (max-width:900px){.bar.top{padding-left:20px}}

/* ── nav: software link with a "soon" badge ───────────────────── */
.nav-sw{display:inline-flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;font-weight:400;color:var(--text);padding:12px 14px;margin-right:4px;transition:color .25s}
.nav-sw:hover,.nav-sw[aria-current="page"]{color:var(--cyan)}
.nav-sw .soon{font-size:8px;letter-spacing:.2em;color:var(--cyan);border:1px solid var(--soon-line);padding:3px 4px 2px 6px;line-height:1}
@media (max-width:520px){
  .bar.top{padding-right:14px;padding-left:16px}
  .mark img{height:38px}
  .bar-right{gap:0}
  .nav-sw{padding:10px 7px;letter-spacing:.12em;margin-right:2px}
  .nav-sw .soon{display:none}
  .lang{padding:10px 7px;margin-right:0;letter-spacing:.14em}
  .bar-right .cta{white-space:nowrap;letter-spacing:.14em;padding:10px 10px}
}

/* ── home: announcement above the hero ────────────────────────── */
.announce{align-self:flex-start;display:inline-flex;align-items:center;gap:12px;margin-bottom:34px;padding:9px 14px;border:1px solid var(--line);background:var(--field);font-size:12.5px;letter-spacing:.03em;color:var(--muted);text-decoration:none;transition:border-color .25s,color .25s}
.announce:hover{border-color:var(--text);color:var(--text)}
.announce .new{font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--cyan);padding-right:12px;border-right:1px solid var(--line)}
.announce .arr{color:var(--accent)}
@media (max-width:900px){.announce{font-size:12px;gap:10px;margin-bottom:26px}}

/* ── software page ────────────────────────────────────────────── */
/* the software hero is taller than other doc-page titles, so it must clear the fixed bar */
main.doc section.sw-hero{min-height:auto;padding-top:112px;padding-bottom:8vh;justify-content:flex-start}
main.doc section.sw-hero h1{font-size:clamp(34px,4.2vw,58px);max-width:19ch}
main.doc section.sw-hero p{margin-top:22px}
main.doc section.sw-hero .actions{margin-top:26px}
.sw-hero .shot-fig{margin-top:36px}
/* stop short of the peak labels, which reach about 60px into the text column */
@media (min-width:901px){.sw-hero .shot-fig{max-width:min(820px,calc(100% - 90px))}}
@media (max-width:900px){
  main.doc section.sw-hero{padding-top:118px;padding-bottom:48px}
  main.doc section.sw-hero h1{font-size:clamp(30px,8.4vw,40px);max-width:none}
}
.shot-fig{margin:44px 0 0;max-width:820px}
.shot-fig img{display:block;width:100%;height:auto}
.shot-fig figcaption{margin-top:14px;font-size:12px;letter-spacing:.04em;color:var(--micro)}

/* ── theme switch ─────────────────────────────────────────────── */
.logo-d{display:none!important}
:root[data-theme="dark"] .logo-d{display:block!important}
:root[data-theme="dark"] .logo-l{display:none!important}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-right:6px;padding:0;border:1px solid transparent;background:none;color:var(--micro);cursor:pointer;transition:color .25s,border-color .25s}
.theme-toggle:hover{color:var(--text);border-color:var(--line)}
.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .i-sun{display:none}
:root[data-theme="dark"] .theme-toggle .i-sun{display:block}
:root[data-theme="dark"] .theme-toggle .i-moon{display:none}
@media (max-width:520px){.theme-toggle{width:28px;height:28px;margin-right:0}}
@media (max-width:380px){
  .theme-toggle{width:26px}
  .bar-right .cta{padding:10px 8px;letter-spacing:.1em}
  .nav-sw{padding:10px 6px}
}

/* ── software page: hero side by side on wide screens ─────────── */
@media (min-width:1100px){
  main.doc section.sw-hero{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);column-gap:40px;align-items:center;align-content:center;
    min-height:min(760px,92vh);padding-top:104px;padding-bottom:6vh;
    padding-left:clamp(40px,calc(100vw - 1400px),calc(var(--spec-w) + 12px))}
  main.doc section.sw-hero h1{font-size:clamp(34px,3.1vw,48px);max-width:none}
  main.doc section.sw-hero .shot-fig{margin:0;width:calc(100% - 70px);max-width:820px}
  /* the hero uses the left gutter here, so the fixed section cue would sit on its buttons */
  .sw-page .cue{display:none}
}

/* ── software page: screenshot sections ───────────────────────── */
.feature-fig{margin:36px 0 0;max-width:min(860px,calc(100% - 70px))}
.feature-fig.narrow{max-width:min(560px,calc(100% - 70px))}
.feature-fig img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:var(--shot-shadow)}
.feature-fig figcaption{margin-top:14px;font-size:12px;letter-spacing:.04em;color:var(--micro)}
@media (max-width:900px){.feature-fig,.feature-fig.narrow{max-width:100%}}

/* ── readability: heavier, darker on white; everything a size up ─ */
h1{font-size:clamp(36px,5.4vw,76px)}
h2{font-size:clamp(32px,4vw,58px)}
section p{font-size:18px}
.idx{font-size:12px;font-weight:var(--label-weight)}
.passes b,.offers b{font-size:19px}
.passes li>span:last-child,.offers li>span:not(.n){font-size:16.5px}
.passes .n,.offers .n{font-size:11px}
ul.plain li{font-size:16.5px}
.terms{font-size:12px!important}
.sectors{font-size:14px}
.people b{font-size:17px}
.people li>span:not(.avatar){font-size:14.5px}
.site-foot{font-size:14px}
.site-foot b{font-size:11px}
.cform label{font-size:11px}
.cform input,.cform select,.cform textarea{font-size:16px}
.fmsg{font-size:14px}
.announce{font-size:13.5px;font-weight:var(--label-weight)}
.shot-fig figcaption,.feature-fig figcaption{font-size:13px}
.pk .lbl{font-size:12px;font-weight:var(--label-weight)}
.svc .lbl{font-size:11px;font-weight:var(--label-weight)}
.note{font-size:11px}
.cue{font-size:11px}
.cue b{font-size:12px;font-weight:var(--label-weight)}
@media (min-width:901px){
  .lang,.nav-sw{font-size:12px;font-weight:var(--label-weight)}
  .bar .cta{font-size:12px;font-weight:var(--label-weight)}
}
@media (min-width:1600px){
  section p{font-size:19.5px;max-width:46ch}
  h1{font-size:clamp(76px,4.6vw,94px)}
  h2{font-size:clamp(58px,3.3vw,70px)}
  .idx{font-size:13px}
  .passes b,.offers b{font-size:21px}
  .passes li>span:last-child,.offers li>span:not(.n),ul.plain li{font-size:18px}
}
@media (max-width:900px){
  section p{font-size:16.5px}
  h1{font-size:clamp(32px,8.8vw,44px)}
  h2{font-size:clamp(27px,7vw,36px)}
  ul.plain li,.passes li>span:last-child,.offers li>span:not(.n){font-size:15.5px}
}

/* ── bigger logo (the top bar grows with it) ──────────────────── */
.bar.top{height:92px}
.mark img{height:68px}
.site-foot .brand-col .logo-d,.site-foot .brand-col .logo-l{width:96px;max-width:96px}
@media (min-width:1600px){.bar.top{height:104px}.mark img{height:80px}}
@media (max-width:900px){.bar.top{height:78px}.mark img{height:50px}}
@media (max-width:520px){.mark img{height:44px}}
@media (max-width:380px){.mark img{height:40px}.bar-right .cta{letter-spacing:.04em;padding:10px 7px}}
@media (max-width:350px){.bar.top{padding-left:12px;padding-right:10px}.mark img{height:34px}.theme-toggle{width:24px}.lang{padding:10px 5px}.nav-sw{padding:10px 5px;letter-spacing:.08em}}

/* ── white theme: soft grey page, lists spread on wide screens ────
   A soft grey instead of pure white, which read as too bright. No
   colour wash and no boxes: on wide screens lists spread into two or
   three columns, each item marked by a hairline above it. None of
   this applies to the dark theme; the legal pages (body.legal-page)
   keep a single column. */
:root:not([data-theme="dark"]){--canvas:#f2f4f7;--field:#ffffff;--glass:rgba(255,255,255,.9);--line:#dce1e8;--hair:#e1e5eb}
@media (min-width:901px){:root:not([data-theme="dark"]) .bar.top::before{background:linear-gradient(rgba(242,244,247,.95) 55%,rgba(242,244,247,0))}}
@media (max-width:900px){:root:not([data-theme="dark"]) .bar.top{background:linear-gradient(rgba(242,244,247,.96) 62%,rgba(242,244,247,0))}}
/* let the two form columns shrink */
.cform .row>label,.cform input,.cform select,.cform textarea{min-width:0}

/* wide screens: lists with an even count go two across, lists of three go three across */
@media (min-width:1280px){
  :root:not([data-theme="dark"]) body:not(.legal-page) :is(ul.plain,.passes,.offers):has(>li:nth-child(even):last-child){display:grid;grid-template-columns:1fr 1fr;gap:8px 48px;max-width:min(1040px,calc(100% - 90px))}
  :root:not([data-theme="dark"]) body:not(.legal-page) :is(ul.plain,.passes,.offers):has(>li:nth-child(even):last-child)>li{border-top:1px solid var(--line);padding-top:20px;padding-bottom:20px}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(even):last-child)>li{display:flex;flex-direction:column}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(even):last-child)>li>.n{padding:0 0 10px}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(even):last-child)>li>span:not(.n){margin-top:8px}
  :root:not([data-theme="dark"]) body:not(.legal-page) ul.plain:has(>li:nth-child(even):last-child)>li::before{top:30px}
}
@media (min-width:1500px){
  :root:not([data-theme="dark"]) body:not(.legal-page) :is(ul.plain,.passes,.offers):has(>li:nth-child(3):last-child){display:grid;grid-template-columns:repeat(3,1fr);gap:8px 48px;max-width:min(1100px,calc(100% - 90px))}
  :root:not([data-theme="dark"]) body:not(.legal-page) :is(ul.plain,.passes,.offers):has(>li:nth-child(3):last-child)>li{border-top:1px solid var(--line);padding-top:20px;padding-bottom:20px}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(3):last-child)>li{display:flex;flex-direction:column}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(3):last-child)>li>.n{padding:0 0 10px}
  :root:not([data-theme="dark"]) :is(.passes,.offers):has(>li:nth-child(3):last-child)>li>span:not(.n){margin-top:8px}
  :root:not([data-theme="dark"]) .offers:has(>li:nth-child(3):last-child)>li>em{margin-top:auto;padding-top:16px}
  :root:not([data-theme="dark"]) body:not(.legal-page) ul.plain:has(>li:nth-child(3):last-child)>li::before{top:30px}
}
/* team: the bio uses the full width under the name */
:root:not([data-theme="dark"]) .people>li>span:not(.avatar){grid-column:1/-1}

/* ── large screens: text on the left, a drawing on the right ──────
   From 1600px wide, sections that were text only split into two
   columns, with a drawing on the right (or the team, or the form).
   The drawings are inline SVG and HTML, drawn from each section's own
   copy. Smaller screens, phones and the dark theme are unchanged. */
.sec-art{display:none;margin:0}
.sec-art svg{display:block;width:100%;height:auto;overflow:visible}
.art text{font-family:Inter,system-ui,sans-serif}
.art .a-t1{font-size:16px;font-weight:500;fill:var(--text)}
.art .a-t2{font-size:14.5px;fill:var(--muted)}
.art .a-ink{fill:var(--text);font-weight:500}
.art .a-t3{font-size:13.5px;fill:var(--micro)}
.art .a-t4{font-size:12px;fill:var(--micro);letter-spacing:.02em}
.art .a-dim{fill:#8a93a0}
.art .a-cap{font-size:11.5px;letter-spacing:.24em;fill:var(--accent);font-weight:500}
.art .a-cap-s{font-size:10.5px;letter-spacing:.2em;fill:var(--micro)}
.art .a-lbl{font-size:13.5px;font-weight:500;fill:var(--text)}
.art .a-num{font-size:12px;letter-spacing:.18em;fill:var(--accent);font-weight:500}
.art .a-num-c{font-size:11px;letter-spacing:.06em}
.art .a-num2{font-variant-numeric:tabular-nums}
.art .a-big{font-family:Manrope,Inter,sans-serif;font-size:34px;font-weight:600;fill:var(--text);letter-spacing:-.02em}
.art .a-formula{font-size:17px;font-weight:500;fill:var(--text)}
.art .a-chipt{font-size:12.5px;fill:var(--muted)}
.art .a-tagt{font-size:10.5px;letter-spacing:.2em;fill:#0e7f86;font-weight:500}
.art .a-tag{fill:none;stroke:rgba(20,175,177,.6)}
.art .a-rule{stroke:var(--line)}
.art .a-rule-l{stroke:#e3e7ed}
.art .a-lead{stroke:#b7c0cc;stroke-width:1;fill:none}
.art .a-dot{fill:var(--canvas);stroke:var(--accent);stroke-width:1.4}
.art .a-node{fill:var(--accent)}
.art .a-node2{fill:var(--canvas);stroke:#14afb1;stroke-width:1.6}
.art .a-link{fill:none;stroke:var(--accent);stroke-opacity:.35;stroke-width:1.2}
.art .a-link2{fill:none;stroke:#14afb1;stroke-opacity:.38}
.art .a-icon{fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.art .a-icon-s{stroke-width:1.3}
.art .a-icon-g{stroke:#2f9a52}
.art .a-ring{fill:none;stroke:#c9d1dc}
.art .a-ring-f{fill:var(--canvas)}
.art .a-paper{fill:var(--canvas)}
.art .a-flow2{fill:none;stroke:var(--accent);stroke-width:1.5}
.art .a-zone{fill:rgba(26,100,200,.035);stroke:#b9c6d6;stroke-dasharray:5 5}
.art .a-tab{stroke:var(--accent);stroke-width:2}
.art .a-stick{stroke:var(--text);stroke-width:1.3}
.art .a-stick2{stroke:#14afb1;stroke-width:2}
.art .a-c-ok{fill:#2f9a52}
.art .a-c-mid{fill:#1a64c8}
.art .a-c-low{fill:#a3acb8}
.art .a-chip3,.art .a-pill2{fill:none;stroke:#cdd5df}
.art .a-pill-on{stroke:#2f9a52;fill:rgba(47,154,82,.06)}
.art .a-rail{stroke:#b9c9de;stroke-width:1.5}
.art .a-step{fill:var(--canvas);stroke:var(--accent);stroke-width:1.4}
.art .a-bar0{fill:#e3e8ee}
.art .a-bar{fill:var(--accent)}
/* sector and lab grids are HTML so the text wraps and stays sharp */
.sg-cap{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;font-weight:500}
.sg{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 36px}
.sg li{display:grid;grid-template-columns:44px 1fr;column-gap:16px;align-content:start;padding:20px 0 22px;border-top:1px solid var(--line)}
.sg .sg-ico{grid-row:1/3;width:44px;height:44px;border-radius:50%;background:rgba(26,100,200,.07);display:flex;align-items:center;justify-content:center}
.sg .sg-ico svg{width:30px;height:30px;overflow:visible}
.sg .sg-ico .a-icon{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sg b{font-weight:500;font-size:16px;line-height:1.35;color:var(--text)}
.sg li>span:last-child{font-size:14.5px;line-height:1.5;color:var(--muted);margin-top:5px}
@media (min-width:1600px){
  :root:not([data-theme="dark"]) section.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:clamp(48px,4.5vw,96px);align-content:center;align-items:center;padding-right:120px;max-width:min(calc(100% - var(--spec-w)),calc(var(--spec-w) + 1432px))}
  :root:not([data-theme="dark"]) section.split>.sec-art{display:block}
  :root:not([data-theme="dark"]) section.split-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  :root:not([data-theme="dark"]) section.split-hero h1{font-size:clamp(52px,3.1vw,76px)}
  :root:not([data-theme="dark"]) section.split-team>.people{margin:0;grid-template-columns:1fr 1fr;max-width:none}
  :root:not([data-theme="dark"]) section.split-contact>.cform{margin:0;max-width:none}
  :root:not([data-theme="dark"]) section.split .sec-art-in{display:block;margin-top:48px;max-width:560px}
  :root:not([data-theme="dark"]) section.split-fig>.feature-fig{margin:0;max-width:560px;width:100%}
  :root:not([data-theme="dark"]) main.doc section.split-intro h1{font-size:clamp(44px,2.9vw,64px);max-width:none}
  :root:not([data-theme="dark"]) main.doc section.split-intro{padding-top:136px;padding-bottom:24px}
}