:root,
[data-theme="light"] {
  color-scheme: light;

  --bg:#FBFAF8;
  --bg-2:#F4F2ED;
  --panel:#FFFFFF;
  --rule:#E2DED6;
  --rule-2:#CFC9BE;

  --ink:#14161A;
  --ink-2:#4A4F58;
  --ink-3:#8A9099;

  /*--accent:#1F3A5F;
  --accent-2:#B4552D;
  --accent-ring:rgba(31,58,95,.13);*/
  --accent:#7C9CFF;
  --accent-2:#E5946A;
  --accent-ring:rgba(124,156,255,.18);

  --btn-bg:#14161A;
  --btn-ink:#FBFAF8;
  --btn-hover:#1F3A5F;

  --ct-bg:#14161A;
  --ct-ink:#FBFAF8;
  --ct-ink-2:rgba(251,250,248,.72);
  --ct-ink-3:rgba(251,250,248,.5);
  --ct-rule:rgba(251,250,248,.16);
  --form-bg:#FBFAF8;
  --form-input:#FFFFFF;

  --dot:rgba(20,22,26,.11);
  --shadow:0 1px 2px rgba(20,22,26,.04);
}

[data-theme="dark"] {
  color-scheme: dark;

  --bg:#08090C;
  --bg-2:#0C0E13;
  --panel:#11141B;
  --rule:rgba(255,255,255,.09);
  --rule-2:rgba(255,255,255,.17);

  --ink:#F2F4F8;
  --ink-2:#A8AFBE;
  --ink-3:#6B7385;

  --accent:#7C9CFF;
  --accent-2:#E5946A;
  --accent-ring:rgba(124,156,255,.18);

  --btn-bg:#F2F4F8;
  --btn-ink:#08090C;
  --btn-hover:#FFFFFF;

  --ct-bg:#0C0E13;
  --ct-ink:#F2F4F8;
  --ct-ink-2:#A8AFBE;
  --ct-ink-3:#6B7385;
  --ct-rule:rgba(255,255,255,.12);
  --form-bg:#11141B;
  --form-input:#0A0C11;

  --dot:rgba(255,255,255,.10);
  --shadow:none;
}

:root {
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --r:2px;
}

* { box-sizing:border-box }
html { scroll-behavior:smooth }

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  transition:background-color .22s ease, color .22s ease;
}

.wrap { max-width:1140px; margin:0 auto; padding:0 40px }
@media (max-width:640px){ .wrap { padding:0 22px } }

h1,h2,h3 {
  margin:0;
  font-family:var(--serif);
  font-weight:400;
  line-height:1.12;
  letter-spacing:-.015em;
}
h1 { font-size:clamp(2.5rem,5.4vw,4.35rem); letter-spacing:-.028em }
h2 { font-size:clamp(1.85rem,3.1vw,2.7rem) }
h3 { font-size:1.3125rem; letter-spacing:-.01em }
p { margin:0 }

.label {
  font-family:var(--mono);
  font-size:.6875rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-3);
}
.lead { font-size:1.0625rem; color:var(--ink-2); max-width:60ch; line-height:1.7 }

a { color:inherit }

:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-radius:var(--r);
}

.skip {
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--btn-bg); color:var(--btn-ink);
  padding:12px 18px; font-size:.875rem; text-decoration:none;
}
.skip:focus { left:12px; top:12px }

.btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 22px;
  font-family:var(--sans); font-size:.875rem;
  text-decoration:none; border:1px solid transparent; border-radius:var(--r);
  white-space:nowrap; cursor:pointer;
  transition:background-color .18s ease, border-color .18s ease, color .18s ease;
}
.btn-primary { background:var(--btn-bg); color:var(--btn-ink); font-weight:500 }
.btn-primary:hover { background:var(--btn-hover) }
.btn-ghost { border-color:var(--rule-2); color:var(--ink); background:transparent }
.btn-ghost:hover { border-color:var(--ink); background:var(--bg-2) }
.btn-block { width:100%; justify-content:center; padding:14px }

header {
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--bg) 86%, transparent);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--rule);
}
@supports not (background: color-mix(in srgb, red, blue)) {
  header { background:var(--bg) }
}

.nav {
  display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center; column-gap:28px; height:74px;
}

.brand { grid-column:1; justify-self:start; display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink) }
.brand svg { display:block; overflow:visible }
.brand b { font-weight:600; letter-spacing:.18em; font-size:.9375rem }
.mark .mark-core { fill:var(--accent) }

.nav-primary { display:contents }
.nav-links { grid-column:2; justify-self:center; display:flex; gap:30px; list-style:none; margin:0; padding:0 }
.nav-links a { color:var(--ink-2); text-decoration:none; font-size:.875rem }
.nav-links a:hover { color:var(--ink) }

.nav-cta, .burger { grid-column:3; justify-self:end }

.switches {
  display:flex; gap:6px; align-items:center;
  position:absolute; top:37px; right:24px; transform:translateY(-50%);
}
/* Below this, the outside margin isn't wide enough yet: track the CTA
   button's right edge (which drifts right as .wrap's own margin grows)
   so the switcher always clears it. */
@media (min-width:721px) and (max-width:1399px) {
  .switches { right:calc(203px + max(0px, (100vw - 1140px) / 2)) }
}

.icon-toggle {
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; padding:0;
  background:transparent; border:0; border-radius:var(--r);
  cursor:pointer; color:var(--ink-3);
  transition:color .16s ease;
}
.icon-toggle:hover { color:var(--ink) }
.icon-toggle .icon-sun { display:none }
[data-theme="dark"] .icon-toggle .icon-sun { display:block }
[data-theme="dark"] .icon-toggle .icon-moon { display:none }

.lang-switch { position:relative }
.lang-switch .icon-toggle { width:auto; padding:0 8px; gap:5px }
.lang-code { font-size:.75rem; font-weight:500; letter-spacing:.02em }

.lang-menu {
  position:absolute; top:calc(100% + 8px); right:0; z-index:60;
  width:max-content; margin:0; padding:5px; list-style:none;
  background:var(--bg); border:1px solid var(--rule); border-radius:var(--r);
  box-shadow:0 12px 28px rgba(0,0,0,.14);
}
.lang-menu button {
  display:block; width:100%; padding:7px 12px; text-align:left; white-space:nowrap;
  background:transparent; border:0; border-radius:calc(var(--r) - 3px);
  font-family:var(--sans); font-size:.875rem; color:var(--ink-2);
  cursor:pointer; transition:background-color .14s ease, color .14s ease;
}
.lang-menu button:hover { background:var(--bg-2); color:var(--ink) }
.lang-menu li[aria-selected="true"] button { color:var(--ink); font-weight:600 }

.burger {
  display:none;
  width:38px; height:34px;
  background:transparent; border:1px solid var(--rule-2); border-radius:var(--r);
  cursor:pointer; padding:0;
  flex-direction:column; align-items:center; justify-content:center; gap:4px;
}
.burger span { display:block; width:15px; height:1px; background:var(--ink) }

.mobile-nav { border-top:1px solid var(--rule); background:var(--bg-2) }
.mobile-nav .wrap { display:flex; flex-direction:column; padding-top:6px; padding-bottom:12px }
.mobile-nav a {
  padding:12px 0; color:var(--ink-2); text-decoration:none; font-size:.9375rem;
  border-bottom:1px solid var(--rule);
}
.mobile-nav a:last-child { border-bottom:0 }

@media (max-width:1000px) {
  .nav-links { display:none }
}
@media (max-width:720px) {
  .nav-cta { display:none }
  .burger { display:flex }
  .switches { right:92px }
}
@media (max-width:640px) {
  .switches { right:74px }
}

.hero {
  position:relative; overflow:hidden;
  padding:126px 0 104px;
  border-bottom:1px solid var(--rule);
}
.hero::before {
  content:"";
  position:absolute; inset:0;
  background-image:radial-gradient(circle, var(--dot) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(ellipse 70% 60% at 78% 34%, #000 5%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 78% 34%, #000 5%, transparent 72%);
  pointer-events:none;
}
.hero-spark {
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:var(--accent); opacity:0; pointer-events:none;
  box-shadow:0 0 6px 1px var(--accent);
  transition:opacity .5s ease;
}
[data-theme="dark"] .hero-spark { background:#fff; box-shadow:0 0 6px 1px #fff }
.hero-spark.is-lit { opacity:1 }

.hero-grid {
  position:relative;
  display:grid; grid-template-columns:1.32fr .68fr; gap:60px; align-items:center;
}
.hero h1 { margin:26px 0 30px; max-width:20ch }
.hero h1 em { font-style:italic; color:var(--accent) }
.cta-row { display:flex; gap:14px; flex-wrap:wrap; margin-top:38px }

.hero-aside { border-left:1px solid var(--rule); padding-left:30px }
.synapse { width:100%; max-width:280px; display:block; margin-bottom:26px }
.synapse .syn-links { stroke:var(--accent); fill:none }
.synapse .syn-nodes { fill:var(--bg); stroke:var(--accent) }
.synapse .syn-core   { fill:var(--accent) }
.hero-aside blockquote {
  margin:0;
  font-family:var(--serif); font-size:1.0625rem; font-style:italic;
  color:var(--ink-2); line-height:1.55;
}
.hero-aside .label { margin-top:16px; display:block }

@media (max-width:960px) {
  .hero { padding:84px 0 68px }
  .hero-grid { grid-template-columns:1fr; gap:44px }
  .hero-aside { border-left:0; border-top:1px solid var(--rule); padding:30px 0 0 }
  .synapse { max-width:230px }
}

.strip { background:var(--bg-2); border-bottom:1px solid var(--rule) }
.strip-in { display:grid; grid-template-columns:repeat(4,1fr) }
.strip-in > div { padding:30px 28px 30px 0 }
.strip-in > div + div { border-left:1px solid var(--rule); padding-left:28px }
.strip-in .n { font-family:var(--serif); font-size:1.5rem; letter-spacing:-.02em }
.strip-in .l { font-size:.8125rem; color:var(--ink-3); margin-top:4px }

@media (max-width:800px) {
  .strip-in { grid-template-columns:1fr 1fr }
  .strip-in > div { padding:24px 18px 24px 0 }
  .strip-in > div:nth-child(3) { border-left:0; padding-left:0; border-top:1px solid var(--rule) }
  .strip-in > div:nth-child(4) { border-top:1px solid var(--rule) }
}

section { padding:108px 0 }
@media (max-width:800px){ section { padding:72px 0 } }

.sec-head {
  display:grid; grid-template-columns:1fr 1fr; gap:64px;
  align-items:end; margin-bottom:60px;
}
.sec-head h2 { max-width:24ch; margin-top:18px }
.sec-head-tight { margin-bottom:44px }
@media (max-width:880px) {
  .sec-head { grid-template-columns:1fr; gap:22px; margin-bottom:42px }
}

.rows { border-top:1px solid var(--rule) }
.row-item {
  display:grid; grid-template-columns:84px 1fr 1.1fr; gap:40px;
  padding:44px 0; border-bottom:1px solid var(--rule); align-items:start;
}
.row-item .num {
  font-family:var(--mono); font-size:.75rem; letter-spacing:.1em;
  color:var(--ink-3); padding-top:8px;
}
.row-item h3 { max-width:16ch }
.row-item p { color:var(--ink-2) }
.row-item .tags { margin-top:20px; display:flex; flex-wrap:wrap; gap:8px }
.tag {
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.06em;
  color:var(--ink-2); background:var(--bg-2);
  border:1px solid var(--rule); border-radius:var(--r); padding:4px 9px;
}
@media (max-width:880px) {
  .row-item { grid-template-columns:1fr; gap:14px; padding:34px 0 }
}

.band {
  background:var(--bg-2);
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.band + .contact { border-top:0 }

.princ { display:grid; grid-template-columns:repeat(2,1fr); column-gap:72px }
.princ > div { padding:32px 0; border-top:1px solid var(--rule-2) }
.princ .mark {
  display:block; margin-bottom:12px;
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.14em;
  color:var(--accent-2);
}
.princ h3 { font-size:1.1875rem; margin-bottom:9px }
.princ p { color:var(--ink-2); font-size:.9375rem; max-width:50ch }
@media (max-width:840px){ .princ { grid-template-columns:1fr; column-gap:0 } }

.profiles { display:grid; grid-template-columns:repeat(2,1fr); column-gap:72px }
.profile { padding:30px 0; border-top:1px solid var(--rule-2) }
.profile-head {
  display:flex; align-items:baseline; gap:12px;
  flex-wrap:wrap; margin-bottom:11px;
}
.profile-head h3 { font-size:1.1875rem }
.years {
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.12em;
  color:var(--accent-2);
  border:1px solid var(--rule-2); border-radius:var(--r);
  padding:3px 8px; white-space:nowrap;
}
.profile p { color:var(--ink-2); font-size:.9375rem; max-width:50ch }

.disclosure {
  margin-top:46px; padding-left:22px;
  border-left:2px solid var(--accent-2);
  font-family:var(--serif); font-size:1.0625rem; font-style:italic;
  color:var(--ink); line-height:1.55;
}
@media (max-width:840px) {
  .profiles { grid-template-columns:1fr; column-gap:0 }
  .disclosure { margin-top:34px }
}

.privacy { display:grid; grid-template-columns:.9fr 1.1fr; gap:72px; align-items:start }
.privacy h2 { margin:18px 0 22px; max-width:20ch }
.checks { list-style:none; margin:0; padding:0 }
.checks li {
  display:flex; gap:16px; padding:18px 0;
  border-bottom:1px solid var(--rule);
  font-size:.9375rem; color:var(--ink-2);
}
.checks li:first-child { border-top:1px solid var(--rule) }
.checks svg { flex:none; margin-top:6px }
.checks .tick { stroke:var(--accent-2) }
.pull {
  font-family:var(--serif); font-size:1.1875rem; font-style:italic;
  color:var(--ink); line-height:1.5;
  border-left:2px solid var(--accent-2); padding-left:22px;
  margin-top:28px; max-width:36ch;
}
@media (max-width:880px){ .privacy { grid-template-columns:1fr; gap:40px } }

.contact {
  background:var(--ct-bg); color:var(--ct-ink);
  border-top:1px solid var(--rule);
  transition:background-color .22s ease;
}
.contact .label { color:var(--ct-ink-3) }
.contact h2 { color:var(--ct-ink); margin:18px 0 20px; max-width:18ch }
.contact .lead { color:var(--ct-ink-2) }

.contact-in { display:grid; grid-template-columns:.85fr 1.15fr; gap:72px }
@media (max-width:920px){ .contact-in { grid-template-columns:1fr; gap:48px } }

.meta {
  display:grid; gap:28px; margin-top:38px;
  padding-top:32px; border-top:1px solid var(--ct-rule);
}
.meta .k {
  font-family:var(--mono); font-size:.6875rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ct-ink-3); margin-bottom:8px;
}
.meta .v { font-size:.9375rem; color:var(--ct-ink); line-height:1.6 }
.meta .v span { color:var(--ct-ink-3) }

form {
  background:var(--form-bg); color:var(--ink);
  padding:38px; border-radius:var(--r);
  border:1px solid transparent;
  box-shadow:var(--shadow);
}
[data-theme="dark"] form { border-color:var(--rule) }

.frow { display:grid; grid-template-columns:1fr 1fr; gap:18px }
@media (max-width:620px){ .frow { grid-template-columns:1fr } }

.field { margin-bottom:18px }
label {
  display:block; font-size:.75rem; letter-spacing:.04em;
  color:var(--ink-2); margin-bottom:8px;
}
label .req { color:var(--accent-2) }

input, select, textarea {
  width:100%;
  background:var(--form-input);
  border:1px solid var(--rule-2);
  color:var(--ink);
  border-radius:var(--r); padding:12px 14px;
  font:inherit; font-size:.9375rem;
}
input:focus, select:focus, textarea:focus {
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-ring);
}
textarea { resize:vertical; min-height:116px }

.consent { display:flex; gap:12px; align-items:flex-start; margin:4px 0 24px }
.consent input {
  width:15px; height:15px; flex:none; margin-top:4px;
  accent-color:var(--accent);
}
.consent label {
  margin:0; font-size:.8125rem; color:var(--ink-3);
  line-height:1.55; letter-spacing:0;
}

.form-foot {
  margin-top:16px; font-size:.75rem; color:var(--ink-3); text-align:center;
}
.form-note {
  margin-top:14px; padding:11px 14px;
  font-size:.8125rem; text-align:center;
  border:1px dashed var(--rule-2); border-radius:var(--r);
  color:var(--ink-2);
}
.form-note.is-ok { border-style:solid; border-color:var(--accent); color:var(--ink) }
.form-note.is-error { border-style:solid; border-color:var(--accent-2); color:var(--ink) }

.hp {
  position:absolute !important;
  left:-9999px; width:1px; height:1px;
  overflow:hidden;
}

altcha-widget { display:block; margin:0 0 20px }
.altcha {
  --altcha-color-base:var(--form-input);
  --altcha-color-text:var(--ink-2);
  --altcha-color-border:var(--rule-2);
  --altcha-color-border-focus:var(--accent);
  --altcha-color-checkbox-fill:var(--accent);
  --altcha-color-error-text:var(--accent-2);
  --altcha-border-radius:var(--r);
  --altcha-max-width:100%;
}

footer { padding:48px 0 56px; background:var(--bg); border-top:1px solid var(--rule) }
.foot { display:flex; gap:28px; align-items:flex-start; flex-wrap:wrap }
.foot-legal { font-size:.8125rem; color:var(--ink-3); line-height:1.7 }
.foot-legal b { color:var(--ink); letter-spacing:.18em; font-weight:600 }
.foot-links { margin-left:auto; display:flex; gap:26px; flex-wrap:wrap }
.foot-links a { display:inline-flex; align-items:center; gap:6px; color:var(--ink-3); text-decoration:none; font-size:.8125rem }
.foot-links a:hover { color:var(--ink) }
.foot-links svg { display:block; flex-shrink:0 }

.link-btn {
  background:transparent; border:0; padding:0; margin:0;
  font-family:var(--sans); color:var(--ink-3); text-decoration:none; font-size:.8125rem;
  cursor:pointer; transition:color .16s ease;
}
.link-btn:hover { color:var(--ink) }

.modal { padding:0; border:0; background:transparent; overflow:visible }
.modal::backdrop { background:rgba(10,10,12,.5); backdrop-filter:blur(4px) }
.modal-box {
  position:relative; width:min(900px, calc(100vw - 48px)); max-height:80vh; overflow:auto;
  margin:0; padding:36px; background:var(--bg); color:var(--ink);
  border:1px solid var(--rule); border-radius:var(--r); box-shadow:0 24px 60px rgba(0,0,0,.24);
}
.modal-box h2 { font-size:1.375rem; margin-bottom:18px; padding-right:24px }
.modal-body h3 { font-size:.9375rem; font-weight:600; color:var(--ink); margin:22px 0 8px }
.modal-body h3:first-child { margin-top:0 }
.modal-body p { color:var(--ink-2); font-size:.9375rem; line-height:1.65; margin-bottom:14px }
.modal-body p:last-child { margin-bottom:0 }
.modal-body ul { margin:0 0 14px; padding-left:1.2em; color:var(--ink-2); font-size:.9375rem; line-height:1.65 }
.modal-body ul:last-child { margin-bottom:0 }
.modal-body li { margin-bottom:6px }
.modal-body li:last-child { margin-bottom:0 }
.modal-body li strong, .modal-body p strong { color:var(--ink) }
.modal-body code { font-family:var(--mono, monospace); font-size:.875em; background:var(--bg-2); padding:.1em .35em; border-radius:4px }
.modal-draft, .modal-meta { font-size:.8125rem !important; color:var(--ink-3) !important; padding-top:8px; margin-top:8px; border-top:1px solid var(--rule) }
.modal-close {
  position:absolute; top:20px; right:20px;
  display:flex; align-items:center; justify-content:center;
  width:28px; height:28px; padding:0;
  background:transparent; border:0; border-radius:var(--r);
  color:var(--ink-3); cursor:pointer; transition:color .16s ease;
}
.modal-close:hover { color:var(--ink) }
@media (max-width:640px) { .modal-box { padding:26px } }
@media (max-width:720px){ .foot-links { margin-left:0 } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto }
  *, *::before, *::after {
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
  }
}