/* Visual layer: the original content, document structure and behavior stay intact. */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/manrope-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/manrope-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('./fonts/manrope-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;
}

:root {
  color-scheme: light;
  --paper: #ffffff;
  --ink: #151b21;
  --muted: #5c646e;
  --line: #dfe4e9;
  --accent: #2463d4;
  --offer: var(--ink);
  --soft: #f3f5f7;
  --white: #ffffff;
  --peach: #cce3ff;
  --blue-soft: #eaf2ff;
  --lime-soft: #edf3d9;
  --lilac-soft: #efebf8;
  --rose-soft: #faeae4;
  --action-hover: #1d51b1;
  --inverse-muted: #b8c0ca;
  --inverse-line: #3d4650;
  --text-display: clamp(42px, 4.6vw, 66px);
  --text-section: clamp(32px, 3.4vw, 48px);
  --text-card: clamp(23px, 2.1vw, 28px);
  --radius-card: 24px;
  --radius-control: 12px;
}

body {
  font-family: 'Manrope', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4 { color: inherit; }
h2 { font-size: var(--text-section); line-height: 1.16; font-weight: 500; letter-spacing: -.045em; }
h3 { font-weight: 600; letter-spacing: -.03em; }
em, .dark em { font-family: inherit; font-style: normal; font-weight: inherit; color: var(--muted); }
::selection { color: var(--ink); background: #dceaff; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 5px; }
.section { padding-block: 96px; }
.eyebrow { font-size: 11px; line-height: 1.6; letter-spacing: .085em; font-weight: 650; color: var(--muted); }
.header { min-height: 92px; border-bottom-color: #edf0f3; }
.brand { font-size: 29px; font-weight: 700; letter-spacing: -1.8px; }
.brand-dot { color: var(--accent); font-size: 14px; vertical-align: 3px; padding-inline: 5px; }
.header nav { gap: 30px; }
.header nav a { color: var(--muted); font-size: 13px; transition: color 150ms ease; }
.header nav a:hover { color: var(--ink); }
.header-cta { border-color: var(--line); border-radius: 999px; padding: 10px 19px; font-size: 13px; background: var(--white); transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease; }
.header-cta:hover { background: var(--soft); border-color: #c9d0d9; }
.header-cta:active { transform: scale(.96); }
.button { border-radius: 999px; background: var(--accent); color: #fff; padding: 16px 24px; font-size: 15px; font-weight: 600; gap: 30px; transition: background-color 150ms ease, transform 150ms ease, box-shadow 150ms ease; }
.button:hover { background: var(--action-hover); }
.button:active { transform: scale(.96); }
.button:disabled { background: #d7dde5; color: #545e6b; opacity: 1; }
.icon-arrow-up-right { display: block; width: 1em; height: 1em; flex-shrink: 0; }
.direct-contact > .icon-arrow-up-right, .footer > a > .icon-arrow-up-right { margin-inline-start: .4em; }
.button-light { background: var(--white); color: var(--ink); }
.button-light:hover { background: #e9eff7; }
.button-outline { background: transparent; color: var(--ink); border-color: var(--line); }
.button-outline:hover { background: var(--soft); }
.text-link { font-weight: 500; }
.text-link:hover { color: var(--accent); }

/* The existing two-column hero, with a quieter type hierarchy. */
.hero { padding-block: 76px 96px; }
.hero .eyebrow { color: var(--muted); font-size: 11px; margin-bottom: 24px; }
.hero-intro { font-size: clamp(22px, 2vw, 28px); line-height: 1.4; letter-spacing: -.025em; color: var(--muted); margin-bottom: 20px; }
.hero h1 { font-size: var(--text-display); font-weight: 600; line-height: 1.1; letter-spacing: -.052em; color: var(--ink); margin-bottom: 32px; }
.process-card { background: var(--soft); border: 0; border-radius: var(--radius-card); padding: 34px; }
.process-card .eyebrow { margin-bottom: 16px; }
.process-card .approach-title { font-size: var(--text-card); font-weight: 500; line-height: 1.25; letter-spacing: -.035em; margin-bottom: 26px; }
.compact-cycle::before { left: 14px; background: #d4dce5; }
.compact-cycle li { grid-template-columns: 29px minmax(0, 1fr); gap: 15px; padding-bottom: 21px; }
.cycle-index { width: 29px; height: 29px; border: 0; border-radius: 10px; background: #dce9ff; color: var(--ink); font-size: 11px; }
.compact-cycle li:nth-child(2) .cycle-index { background: #f7ded4; }
.compact-cycle li:nth-child(3) .cycle-index { background: #e4ddf6; }
.compact-cycle li:nth-child(4) .cycle-index { background: #e2ebc4; }
.compact-cycle h3 { font-size: 16px; line-height: 1.4; font-weight: 650; margin-bottom: 6px; }
.compact-cycle p { font-size: 13px; line-height: 1.6; }
.cycle-return { color: var(--muted); font-size: 12px; margin-top: 23px; }
.cycle-return>span { color: var(--accent); }
.approach-link { border-top-color: var(--line); font-size: 13px; padding-top: 18px; margin-top: 18px; }

/* The same content grids, without the former green/brown treatment. */
#problems { border-top: 1px solid var(--line); }
.section-heading { margin-bottom: 44px; }
.section-heading>p { font-size: 15px; line-height: 1.65; }
.pain-signal { grid-template-columns: 29px minmax(0, 1fr); gap: 18px; padding-block: 29px; }
.pain-signal .number { display: grid; place-items: center; width: 29px; height: 29px; padding: 0; background: var(--soft); color: var(--muted); border-radius: 9px; font-size: 11px; }
.pain-signal h3 { font-size: 23px; line-height: 1.35; }
.pain-signal div>p { font-size: 15px; }
.analyst-note { background: var(--soft); border: 0; border-radius: 20px; padding: 30px; margin-top: 24px; }
.analyst-note h3 { font-size: 24px; line-height: 1.35; font-weight: 500; }
.analyst-note p { font-size: 15px; }

/* Preserve the interactive orbit and all of its panels. */
#pilot { background: #f3f6fa; color: var(--ink); }
#pilot .eyebrow, .pilot-intro>p, .cycle-entry p, .pilot-details p,
.method-note, .method-note p, .cycle-map figcaption { color: var(--muted); }
.pilot-intro>p { font-size: 15px; line-height: 1.65; }
.cycle-explorer { align-items: center; }
.cycle-panels { border: 0; padding: 32px; margin-top: 0; border-radius: var(--radius-card); background: var(--white); }
.cycle-panel h3 { font-size: 30px; font-weight: 500; line-height: 1.25; }
.cycle-panel>p:not(.eyebrow) { color: var(--muted); font-size: 15px; line-height: 1.7; }
.cycle-panel>.eyebrow, .step-result strong { color: var(--accent); }
.cycle-panel .step-result { border-top-color: var(--line); }
.cycle-explorer.is-interactive .cycle-panel { min-height: 466px; }
.orbit-line { stroke: #c2cbd6; }
.cycle-orbit marker path, .cycle-orbit circle { stroke: #c2cbd6; }
.orbit-center { color: var(--muted); }
.orbit-center span { color: var(--accent); }
.orbit-stage { color: var(--ink); font-size: 18px; gap: 13px; padding-block: 12px; border-radius: 16px; }
.orbit-number { width: 52px; height: 52px; border: 0; border-radius: 17px; color: var(--ink); background: #dce9ff; font-size: 14px; }
.orbit-stages li:nth-child(2) .orbit-number { background: #f7ded4; }
.orbit-stages li:nth-child(3) .orbit-number { background: #e4ddf6; }
.orbit-stages li:nth-child(4) .orbit-number { background: #e2ebc4; }
.orbit-stage[aria-selected="true"] { color: var(--accent); }
.orbit-stages .orbit-stage[aria-selected="true"] .orbit-number { color: var(--white); background: var(--accent); box-shadow: 0 0 0 5px #dce9ff; }
.orbit-stage:hover>span:last-child { text-decoration-color: var(--accent); }
.orbit-stage:focus-visible, .cycle-next:focus-visible, .method-note summary:focus-visible,
.method-source:focus-visible { outline-color: var(--accent); }
.cycle-next { color: var(--accent); font-size: 13px; }
.cycle-map figcaption { font-size: 12px; }
.cycle-entry { border-color: var(--line); }
.cycle-entry h3 { font-weight: 500; }
.pilot-details .mobile-detail { border-color: var(--line); }
.pilot-details .mobile-detail:last-child { border-bottom-color: var(--line); }
.method-note summary span { text-decoration-color: #a3aeba; }
.method-note summary::after, .method-source { color: var(--accent); }
.method-note summary:hover, .method-source:hover { color: var(--ink); }
.pilot-cta .button-light { color: var(--white); background: var(--ink); }
.pilot-cta .button-light:hover { background: #303c49; }

.use-case { display: flex; flex-direction: column; border: 0; border-radius: var(--radius-card); padding: 30px; background: var(--blue-soft); }
.use-case:nth-child(2) { background: var(--lime-soft); }
.use-case:nth-child(3) { background: var(--lilac-soft); }
.use-case .number { color: var(--muted); font-size: 11px; font-weight: 600; margin-bottom: 32px; }
.use-case h3 { font-size: var(--text-card); font-weight: 500; line-height: 1.25; }
.use-case .case-change { margin-top: auto; border-color: rgb(21 27 33 / .12); font-size: 14px; }
.case-change strong { font-weight: 600; font-size: 12px; }
.case-detail { border-color: var(--line); border-radius: 20px; overflow: hidden; }
.case-detail>summary { padding: 28px; }
.case-detail>summary:hover { background: var(--soft); }
.case-detail[open]>summary { border-color: var(--line); }
.detail-title { font-size: 22px; }
.scenario { background: var(--soft); border: 0; border-radius: 18px; }
.scenario-tag { border-color: #cbd3dd; border-radius: 999px; padding: 5px 12px; }
.math-table th, .math-table td, .measure-list { border-color: #d4dce5; }
.capacity { background: var(--blue-soft); color: var(--ink); border-radius: 16px; }
.capacity .eyebrow, .capacity>p:last-child { color: var(--muted); }
.capacity-value { color: var(--accent); }
.measure-list li::before { color: var(--accent); }
.demo { border-color: var(--line); border-radius: 18px; }
.demo-output { background: var(--soft); }
.demo-badge { border-radius: 999px; }
.transcript { border-color: #ccdfff; }
.field { border: 1px solid #bac4d0; border-radius: var(--radius-control); padding: 12px 14px; background: var(--white); font-size: 16px; transition: border-color 150ms ease, box-shadow 150ms ease; }
.field::placeholder { color: #68717c; }
.field:hover { border-color: #929eac; }
.field:focus { border-color: var(--accent); }
.saved-record { border-color: #ccd9e9; border-radius: 14px; }
.review-check input { accent-color: var(--accent); }
.status[data-error="true"] { color: #b32936; }

#terms { border-top: 1px solid var(--line); }
.plan { border: 0; border-radius: var(--radius-card); background: var(--soft); padding: 36px; }
.plan.follow { background: var(--blue-soft); }
.plan .eyebrow { color: var(--muted); font-weight: 650; }
.plan h3 { font-size: 29px; line-height: 1.25; font-weight: 500; }
.plan-price, .plan-includes { border-color: #d2dbe5; }
.plan li::marker { color: var(--accent); }
.plan-price h4 { font-weight: 600; font-size: 17px; }
.plan .text-link { color: var(--accent); font-size: 14px; }
.faq { margin-top: 64px; }
.faq>h3 { font-size: 26px; font-weight: 500; }
.faq summary { padding-block: 22px; font-size: 16px; }
.faq summary:hover { color: var(--accent); }
.faq details p { line-height: 1.7; }

.contact.dark { background: var(--ink); color: var(--white); }
.contact .eyebrow, .contact-copy>p:not(.eyebrow), .form-note, .optional { color: var(--inverse-muted); }
.contact h2 { font-weight: 500; }
.contact h2 em { color: var(--peach); }
.contact .field-label { font-size: 13px; font-weight: 500; }
.contact-form .field { background: #222c37; border-color: #536171; color: var(--white); }
.contact-form .field::placeholder { color: #b4bdc9; }
.contact-form .field:hover { border-color: #7e8b9a; }
.contact-form .field:focus { border-color: #9bc3ff; }
.contact .field:focus-visible { outline-color: #9bc3ff; }
.contact-form .button-light { background: #deedff; color: var(--ink); }
.contact-form .button-light:hover { background: #c4deff; }
.direct-contact { border-bottom-color: #687787; color: #deedff; }
.direct-contact:hover { color: var(--white); border-color: var(--white); }
.draft-box { border-color: var(--inverse-line); }
.draft-actions .button-outline { background: transparent; border-color: #768395; color: var(--white); }
.draft-actions .button-outline:hover { background: #303c49; }
.contact-form .status { color: #deedff; }
.footer { padding-block: 34px; }
.footer p, .footer>a:last-child { font-size: 12px; }
.mobile-contact { background: rgb(255 255 255 / .96); box-shadow: 0 -4px 24px rgb(0 0 0 / .05); }

@media (max-width: 1100px) {
  .hero { padding-block: 60px 80px; }
  .process-card { padding: 28px; }
  .cycle-panels { padding: 28px; }
  .cycle-panel h3 { font-size: 27px; }
  .use-case { padding: 25px; }
  .plan { padding: 29px; }
}
@media (max-width: 900px) {
  .cycle-explorer.is-interactive .cycle-panel { min-height: 0; }
  .cycle-explorer { gap: 28px; }
  .cycle-panels { border-top: 0; }
}
@media (max-width: 760px) {
  :root { --text-section: clamp(29px, 7.8vw, 38px); --radius-card: 20px; }
  .header { min-height: 76px; }
  .brand { font-size: 26px; }
  .header-cta { padding: 9px 14px; font-size: 12px; }
  .hero { padding-block: 40px 52px; gap: 34px; }
  .hero .eyebrow { margin-bottom: 20px; font-size: 10px; letter-spacing: .065em; }
  .hero-intro { font-size: 21px; margin-bottom: 18px; }
  .hero h1 { font-size: clamp(34px, 8.7vw, 52px); line-height: 1.12; letter-spacing: -.05em; margin-bottom: 26px; }
  .hero-actions .button { font-size: 14px; min-height: 52px; }
  .process-card { padding: 26px 23px; }
  .process-card .approach-title { font-size: 25px; margin-bottom: 24px; }
  .compact-cycle p { font-size: 14px; }
  .compact-cycle h3 { font-size: 16px; }
  .compact-cycle li { padding-bottom: 19px; gap: 13px; }
  .approach-link { font-size: 13px; padding-bottom: 0; }
  .section { padding-block: 56px; }
  .section-heading { margin-bottom: 28px; }
  .pain-signal { padding-block: 24px; gap: 14px; }
  .pain-signal h3 { font-size: 21px; }
  .analyst-note { padding: 24px; margin-top: 18px; gap: 16px; }
  .analyst-note h3 { font-size: 23px; }
  .cycle-panels { padding: 26px 23px; }
  .cycle-panel h3 { font-size: 26px; }
  .cycle-panel>p:not(.eyebrow) { font-size: 15px; line-height: 1.65; }
  .orbit-stage { font-size: 16px; }
  .orbit-number { width: 44px; height: 44px; font-size: 12px; border-radius: 14px; }
  .cycle-map figcaption { font-size: 12px; }
  .pilot-details { margin-top: 24px; }
  .use-case { padding: 26px; }
  .use-case .number { margin-bottom: 23px; }
  .use-case h3 { font-size: 26px; }
  .use-case>p { font-size: 15px; }
  .case-detail>summary { padding: 23px; }
  .detail-title { font-size: 21px; }
  .case-detail .scenario { border-radius: 0; }
  .plan { padding: 27px; }
  .plan h3 { font-size: 27px; }
  .plan>p, .plan-includes ul { font-size: 15px; }
  .faq { margin-top: 42px; }
  .faq summary { padding-block: 20px; font-size: 15px; }
  .contact h2 { font-size: 32px; }
  .contact .wrap { gap: 32px; }
  .contact-form .button { font-size: 14px; }
  .form-note { font-size: 12px; }
  .footer { padding-block: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}

/* Language controls allow room for longer translations at every breakpoint. */
.header { gap: 24px; }
.header .brand, .header-cta { flex-shrink: 0; }
.header nav { margin-inline: auto; gap: 24px; }
.language-picker { position: relative; flex-shrink: 0; z-index: 30; }
.language-picker > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--white);
  color: var(--ink);
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.language-picker > summary::-webkit-details-marker { display: none; }
.language-picker > summary::after { content: none; }
.language-picker > summary:hover, .language-picker[open] > summary { background: var(--soft); }
.language-chevron { display: block; flex: 0 0 12px; transform-origin: center; }
.language-picker[open] .language-chevron { transform: rotate(180deg); }
.language-options {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 172px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--white);
  box-shadow: 0 8px 24px rgb(21 27 33 / .1);
}
.language-options a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 14px;
}
.language-options a:hover { background: var(--soft); }
.language-options a[aria-current="page"] { color: var(--accent); background: var(--blue-soft); }
.header-cta { text-align: center; }
.orbit-stage > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.cycle-panel, .plan, .use-case, .contact-copy { min-width: 0; }
@media (max-width: 1100px) {
  .header nav { display: none; }
  .language-picker { margin-inline-start: auto; }
}
@media (max-width: 760px) {
  .header { flex-wrap: nowrap; gap: 18px; padding-block: 14px; }
  .header-cta { display: none; }
}