body{margin:0}
a{color:#2B2A6B}a:hover{color:#C23B28}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.sec{padding-top:72px;padding-bottom:72px;border-top:1px solid #D9D1BF}
.eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#4A4890;margin-bottom:16px;font-weight:500}
.h2{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:clamp(32px,4.6vw,54px);line-height:1.08;margin:0;max-width:900px}
.em{font-style:italic;font-weight:500;color:#C23B28}
.hl{background:linear-gradient(transparent 55%,#F4A99C 55%);padding:0 3px}
.card{background:#FFFFFF;border-radius:10px;padding:28px}
.ct{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:24px;line-height:1.2;margin-bottom:8px}
.arrow{font-family:'JetBrains Mono',monospace;color:#C23B28;font-size:26px;align-self:center}
.flow{display:flex;flex-wrap:wrap;gap:16px;margin-top:40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:40px}
.dark .eyebrow{color:#B9B7F0}
.dark .em{color:#F4A99C}
.dark .hl{background:linear-gradient(transparent 55%,#C23B28 55%)}
.li{display:flex;gap:12px;margin:0 0 14px;font-size:17px;line-height:1.5}
.li i{font-style:normal;font-family:'JetBrains Mono',monospace;color:#C23B28;font-weight:500}
.mono{font-family:'JetBrains Mono',monospace;font-size:13px;color:#4A4890}

/* Original element styles, in document order. */
.style-001 { background:#F6F1E7;color:#1F1E54;font-family:'Inter',system-ui,sans-serif;font-size:18px;line-height:1.6;width:100% }
.style-002 { padding-top:28px;padding-bottom:28px;display:flex;justify-content:space-between;align-items:center }
.style-003 { font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:26px }
.style-004 { font-weight:600;font-size:16px }
.style-005 { padding-top:48px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:40px;align-items:center }
.style-006 { flex:1 1 520px }
.style-007 { font-size:clamp(40px,5.6vw,68px);line-height:1.04 }
.style-008 { margin:28px 0 0;font-size:22px;max-width:620px;line-height:1.45 }
.style-009 { margin-top:36px;display:flex;gap:16px;flex-wrap:wrap;align-items:center }
.style-010 { background:#C23B28;color:#FFFFFF;padding:16px 28px;border-radius:6px;font-weight:600;text-decoration:none }
.style-011 { padding:16px 4px;font-weight:600 }
.style-012 { flex:1 1 320px;max-width:420px }
.style-013 { width:100%;height:auto }
.style-014 { flex:1;min-width:240px }
.style-015 { margin-top:32px;display:flex;flex-wrap:wrap;gap:24px;align-items:center }
.style-016 { font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:56px;line-height:1;color:#C23B28 }
.style-017 { max-width:560px;font-size:18px }
.style-018 { margin-top:40px;background:#1F1E54;color:#F6F1E7;border-radius:10px;padding:24px 28px;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:24px;text-align:center }
.style-019 { display:flex;justify-content:center;font-size:28px;color:#C23B28;line-height:1.4 }
.style-020 { display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px }
.style-021 { border:2px dashed #4A4890;border-radius:10px;padding:18px;text-align:center }
.style-022 { margin-bottom:8px }
.style-023 { margin-top:24px;padding:32px;border:2px solid #1F1E54 }
.style-024 { margin-bottom:20px }
.style-025 { font-weight:600;margin-bottom:8px }
.style-026 { display:flex;height:28px;border-radius:6px;overflow:hidden;background:#EFE8D8 }
.style-027 { width:62%;background:#1F1E54 }
.style-028 { width:38%;background:#F4A99C }
.style-029 { display:flex;justify-content:space-between;margin:8px 0 24px }
.style-030 { display:flex;flex-wrap:wrap;gap:12px 40px;font-size:17px }
.style-031 { margin-top:24px }
.style-032 { padding:20px }
.style-033 { margin:32px 0 0;font-size:20px;max-width:760px }
.style-034 { background:#1F1E54;color:#F6F1E7;padding:96px 0 }
.style-035 { margin:24px 0 8px;font-size:22px;max-width:720px }
.style-036 { margin:0 0 48px;font-size:15px;color:#B9B7F0 }
.style-037 { display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;color:#1F1E54 }
.style-038 { padding:36px }
.style-039 { font-size:30px;margin-bottom:20px }
.style-040 { font-size:16px;margin:24px 0 }
.style-041 { display:inline-block;background:#C23B28;color:#FFFFFF;padding:14px 24px;border-radius:6px;font-weight:600;text-decoration:none }
.style-042 { display:inline-block;margin-top:12px;background:#1F1E54;color:#F6F1E7;padding:14px 24px;border-radius:6px;font-weight:600;text-decoration:none }
.style-043 { padding-top:32px;padding-bottom:32px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px;color:#4A4890 }
.style-044 { font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:18px;color:#1F1E54 }

/* Presentation layer. All page copy remains in index.html. */
:root {
  --paper: #f6f1e7;
  --ink: #1f1e54;
  --rust: #c23b28;
  --line: rgba(31, 30, 84, .13);
  --ease-out: cubic-bezier(.23, 1, .32, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 104px; }
body { background: var(--paper); -webkit-font-smoothing: antialiased; }
::selection { background: #f4a99c; color: var(--ink); }
a { text-underline-offset: 5px; text-decoration-thickness: 1px; }
a:focus-visible { outline: 3px solid var(--rust); outline-offset: 6px; border-radius: 4px; }
.wrap { max-width: 1184px; padding-left: 40px; padding-right: 40px; }
.page { overflow: clip; }
.reading-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  background: var(--rust); z-index: 50; pointer-events: none;
  transform: scaleX(0); transform-origin: left;
}
.site-header { position: relative; padding-top: 30px; padding-bottom: 26px; }
.site-header::after {
  content: ''; position: absolute; left: 40px; right: 40px; bottom: 0;
  height: 1px; background: var(--line);
}
.wordmark { display: flex; align-items: center; gap: 10px; letter-spacing: -.8px; }
.wordmark::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--rust); }
.nav-link {
  padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px;
  font-size: 14px; text-decoration: none;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}
.hero { padding-top: 76px; padding-bottom: 104px; gap: 56px; }
.hero-copy { flex: 1.45 1 510px; min-width: 0; }
.hero .h2 { font-size: clamp(40px, 4.8vw, 66px); letter-spacing: -.045em; line-height: 1.075; }
.hero .style-008 { font-size: clamp(18px, 1.7vw, 21px); line-height: 1.65; max-width: 570px; }
.eyebrow { display: flex; align-items: center; gap: 12px; font-size: 11px; letter-spacing: .13em; }
.eyebrow::before { content: ''; flex: 0 0 24px; height: 1px; background: currentColor; opacity: .6; }
.h2 { letter-spacing: -.035em; text-wrap: balance; }
.hl { background: linear-gradient(transparent 68%, #f4a99c 68%, #f4a99c 93%, transparent 93%); padding: 0; }
.hero-art {
  position: relative; isolation: isolate; flex: 1 1 320px; max-width: 420px;
  padding: 38px 20px; border: 1px solid var(--line); border-radius: 24px;
  background: radial-gradient(ellipse at 72% 45%, #f4a99c30, transparent 60%), #fbf8f2;
  box-shadow: 0 24px 60px -40px rgba(31, 30, 84, .3), inset 0 1px 0 #fff;
}
.hero-art::before {
  content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background-image: radial-gradient(#1f1e5420 .7px, transparent .7px);
  background-size: 16px 16px;
  mask-image: linear-gradient(135deg, #000, transparent 85%);
}
.hero-art svg { display: block; overflow: visible; }
.button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; border: 1px solid transparent; border-radius: 8px;
  font-size: 15px; line-height: 1.5; text-align: center; text-wrap: balance;
  transition: transform 180ms var(--ease-out), box-shadow 180ms ease, background-color 180ms ease;
}
.button-primary { box-shadow: 0 4px 10px -6px #c23b2880, inset 0 1px 0 #ffffff20; }
.button-secondary { box-shadow: inset 0 1px 0 #ffffff20; }
.button:active { transform: scale(.98); }
.text-link { font-size: 15px; }
.sec { padding-top: 80px; padding-bottom: 80px; border-color: var(--line); }
.card {
  border: 1px solid rgba(31, 30, 84, .09); border-radius: 14px;
  box-shadow: 0 3px 6px -4px #1f1e5412, 0 18px 32px -28px #1f1e5429;
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
.ct { letter-spacing: -.025em; }
.flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: 14px; }
.flow .card { min-width: 0; }
.flow .arrow { font-size: 22px; opacity: .65; }
.style-015 { margin-top: 36px; padding: 26px 0 0; border-top: 1px solid var(--line); }
.style-016 { letter-spacing: -.06em; }
.connection-banner {
  position: relative; border-radius: 14px;
  box-shadow: 0 12px 24px -18px #1f1e5460;
}
.tool-card { border: 1px dashed #4a489070; background: #ffffff45; font-size: 16px; }
.system-example { border: 1px solid #1f1e5438; background: #fffcf8; padding: 32px; }
.allocation-bar { height: 18px; border-radius: 5px; }
.allocation-track { transform-origin: left; }
.allocation-drift { transform-origin: right; }
.style-029 { font-size: 11px; gap: 12px; }
.dark {
  position: relative;
  background: radial-gradient(ellipse at 85% 0%, #393873 0%, transparent 60%), var(--ink);
  padding-top: 96px; padding-bottom: 96px;
}
.dark > .wrap > .h2 { max-width: 820px; }
.audience-grid { gap: 24px; align-items: stretch; }
.audience-card { display: flex; flex-direction: column; background: #fffcf7; padding: 36px; }
.audience-card .eyebrow { color: #4a4890; font-size: 10px; }
.audience-card .button { align-self: flex-start; margin-top: auto; }
.audience-card .li { font-size: 16px; }
.audience-card .li:last-of-type { margin-bottom: 28px; }
.audience-card .ct { font-size: clamp(27px, 2.5vw, 32px); }
.site-footer { padding-top: 30px; padding-bottom: 30px; font-size: 12px; }
@media (hover: hover) and (pointer: fine) {
  .nav-link:hover { background: #fff9; border-color: #c23b2860; }
  .card:hover { border-color: #1f1e542b; box-shadow: 0 8px 22px -14px #1f1e5430, 0 26px 40px -32px #1f1e5438; }
  .button:hover { transform: translateY(-2px); box-shadow: 0 9px 18px -10px #1f1e5470; }
  .button-primary:hover { background: #aa3020; color: #fff; }
  .button-secondary:hover { background: #34336b; color: #f6f1e7; }
  .button:active { transform: scale(.98); }
}
@media (max-width: 960px) {
  .hero { gap: 40px; }
  .hero-copy { flex-basis: 440px; }
  .hero-art { flex-basis: 270px; }
  .flow { grid-template-columns: 1fr; gap: 12px; }
  .flow .arrow { justify-self: center; transform: rotate(90deg); line-height: 1; }
}
@media (max-width: 760px) {
  .wrap { padding-left: 24px; padding-right: 24px; }
  .site-header { padding-top: 22px; padding-bottom: 22px; }
  .site-header::after { left: 24px; right: 24px; }
  .hero { padding-top: 44px; padding-bottom: 56px; gap: 36px; }
  .hero-copy { flex-basis: 100%; }
  .hero-art { max-width: 420px; flex-basis: 100%; margin: 0 auto; padding: 24px; }
  .hero .h2 { font-size: clamp(38px, 7.8vw, 56px); }
  .hero .style-008 { margin-top: 24px; }
  .hero-actions { margin-top: 28px; gap: 12px; }
  .sec { padding-top: 52px; padding-bottom: 52px; }
  .grid, .audience-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 28px; }
  .tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tool-card { padding: 16px 10px; font-size: 14px; }
  .card, .audience-card, .system-example { padding: 24px; }
  .style-032 { padding: 20px 24px; }
  .style-017 { font-size: 16px; }
  .style-033 { font-size: 18px; }
  .style-030 { font-size: 15px; }
  .dark { padding-top: 60px; padding-bottom: 60px; }
  .style-035 { font-size: 19px; }
  .audience-grid { margin-top: 0; }
  .audience-card .button { width: 100%; }
  .audience-card .eyebrow { letter-spacing: .08em; }
  .site-footer { gap: 8px 16px; }
}
@media (max-width: 380px) {
  .wrap { padding-left: 20px; padding-right: 20px; }
  .hero .h2 { font-size: 36px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .text-link { align-self: flex-start; }
  .card, .audience-card, .system-example { padding: 20px; }
  .nav-link { padding: 8px 12px; font-size: 12px; }
  .eyebrow { font-size: 10px; letter-spacing: .08em; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
  .reading-progress { display: none; }
}
@media print {
  .reading-progress { display: none; }
  .card { box-shadow: none; break-inside: avoid; }
  * { opacity: 1 !important; transform: none !important; }
}

/* Expert application uses the landing page's type and color palette. */
#build .style-036 { max-width: 850px; font-size: 16px; line-height: 1.8; }
.application-page { min-height: 100vh; }
.application-brand { color: var(--ink); text-decoration: none; }
.application-main { max-width: 880px; padding-top: 56px; padding-bottom: 80px; }
.application-title { font-size: clamp(34px, 5vw, 52px); }
.application-description { margin: 24px 0 28px; font-size: 17px; line-height: 1.8; }
.application-note { font-size: 14px; line-height: 1.7; color: #4a4890; }
.application-fieldset { min-width: 0; margin: 36px 0 0; padding: 24px 28px 28px; }
.application-fieldset legend {
  max-width: 100%; padding: 0 8px; margin-left: -8px;
  font-family: 'Fraunces', Georgia, serif; font-size: 23px; font-weight: 700; line-height: 1.4;
}
.application-fields { display: grid; gap: 20px; }
.application-field { display: grid; gap: 8px; }
.application-field > label { font-size: 15px; font-weight: 600; }
.application-required { font-weight: 400; color: #4a4890; }
.application-field > input {
  width: 100%; min-width: 0; min-height: 48px; border: 1px solid #1f1e5440;
  border-radius: 8px; padding: 12px 14px; background: #fffcf8;
  color: var(--ink); font: inherit; font-size: 16px;
}
.application-field > input::placeholder { color: #66647f; opacity: 1; }
.application-field > input:focus-visible { outline: 2px solid var(--rust); outline-offset: 3px; }
.application-hint { margin: 0; font-size: 13px; color: #4a4890; line-height: 1.6; }
.application-options { display: grid; gap: 10px; }
.application-option {
  display: flex; align-items: flex-start; gap: 12px; cursor: pointer;
  padding: 13px 14px; border: 1px solid var(--line); border-radius: 8px;
  font-size: 15px; line-height: 1.5;
  transition: background-color 160ms ease, border-color 160ms ease;
}
.application-option input {
  flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--rust);
}
.application-option:has(input:checked) { border-color: #c23b2870; background: #f4a99c1c; }
.application-option:has(input:focus-visible) { outline: 2px solid var(--rust); outline-offset: 3px; }
.application-submit { margin-top: 32px; }
.application-submit .button { cursor: pointer; font-family: inherit; }
.application-submit .button:disabled { opacity: .55; cursor: default; transform: none; }
#application-status { margin-top: 16px; }
@media (hover: hover) and (pointer: fine) {
  .application-option:hover { border-color: #1f1e5450; background: #f6f1e780; }
}
@media (max-width: 760px) {
  .application-main { padding-top: 36px; padding-bottom: 52px; }
  .application-description { font-size: 16px; }
  .application-fieldset { padding: 20px; }
  .application-fieldset legend { font-size: 21px; }
  .application-submit .button { width: 100%; }
}
