/* release-20261028-about: growth timeline on /about/, about blocks, site-wide contrast on dark and tinted surfaces. */

/* ---------- /about/: professional path ---------- */
html body .zab-timeline .zab-path { position: relative; --zp-h: 232px; }
html body .zab-timeline .zab-path__list { position: relative; z-index: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
html body .zab-timeline .zab-path__list::before,
html body .zab-timeline .zab-path__step::before { display: none !important; content: none !important; }
html body .zab-timeline .zab-path__step { position: relative; min-width: 0; padding: var(--zp-h) 0 0; border: 0; }
html body .zab-path__growth { position: absolute; z-index: 0; top: 30px; left: 30px; width: calc((100% - 72px) * .8 + 72px); height: 190px; overflow: visible; pointer-events: none; }

html body .zab-path__node { position: absolute; z-index: 2; left: calc(30px - var(--zp-s) / 2); top: calc(var(--zp-y) - var(--zp-s) / 2); display: grid; place-items: center; width: var(--zp-s); height: var(--zp-s); color: var(--zp-c); background: #fff; border: 2px solid var(--zp-b); border-radius: 50%; box-shadow: 0 0 0 6px #fff, 0 10px 24px rgba(29, 78, 216, var(--zp-glow)); }
html body .zab-path__node svg { width: 44%; height: 44%; }
html body .zab-path__step:nth-child(1) { --zp-y: 180px; --zp-s: 48px; --zp-c: #6f8fcf; --zp-b: #c9d8f3; --zp-glow: .05; --zp-t: #4f6fb5; }
html body .zab-path__step:nth-child(2) { --zp-y: 142.5px; --zp-s: 52px; --zp-c: #5a80d6; --zp-b: #a9c2ef; --zp-glow: .08; --zp-t: #3f63b8; }
html body .zab-path__step:nth-child(3) { --zp-y: 105px; --zp-s: 56px; --zp-c: #3f6cdc; --zp-b: #7fa5ec; --zp-glow: .12; --zp-t: #2f5ac4; }
html body .zab-path__step:nth-child(4) { --zp-y: 67.5px; --zp-s: 60px; --zp-c: #2a5ee6; --zp-b: #4f83ea; --zp-glow: .17; --zp-t: #2252d0; }
html body .zab-path__step:nth-child(5) { --zp-y: 30px; --zp-s: 68px; --zp-c: #fff;    --zp-b: #1d4ed8; --zp-glow: .32; --zp-t: #1d4ed8; }
html body .zab-path__step--now .zab-path__node { background: linear-gradient(135deg, #3b82f6, #1d4ed8); }
html body .zab-path__step--now .zab-path__node::after { position: absolute; inset: -9px; content: ""; border: 2px solid rgba(37, 99, 235, .35); border-radius: 50%; }

html body .zab-timeline .zab-path__step time { display: block; margin: 0 0 10px; color: var(--zp-t); font-size: 28px; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
html body .zab-timeline .zab-path__step--now time { display: inline-block; padding: 7px 14px 8px; color: #fff; background: #1d4ed8; border-radius: 999px; font-size: 20px; letter-spacing: -.01em; box-shadow: 0 8px 22px rgba(29, 78, 216, .28); }
html body .zab-timeline .zab-path__step strong { display: block; color: var(--zt-ink, #0b1626); font-size: 18px; line-height: 1.3; }
html body .zab-timeline .zab-path__step span:not(.zab-path__node) { display: block; margin-top: 8px; color: #4a5a70; font-size: 14px; line-height: 1.55; }
html body .zab-timeline .zab-path__step--now strong { color: #0f2f86; }

@media (prefers-reduced-motion: no-preference) {
  html body .zab-path__step--now .zab-path__node::after { animation: zab-path-pulse 2.6s ease-out infinite; }
  @keyframes zab-path-pulse { 0% { opacity: .9; transform: scale(.86); } 70%, 100% { opacity: 0; transform: scale(1.3); } }
  @supports (animation-timeline: view()) {
    html body .zab-path__growth { animation: zab-path-draw linear both; animation-timeline: view(); animation-range: entry 15% cover 42%; }
    html body .zab-path__node { animation: zab-path-pop linear both; animation-timeline: view(); }
    html body .zab-path__step:nth-child(1) .zab-path__node { animation-range: entry 10% cover 25%; }
    html body .zab-path__step:nth-child(2) .zab-path__node { animation-range: entry 20% cover 30%; }
    html body .zab-path__step:nth-child(3) .zab-path__node { animation-range: entry 30% cover 35%; }
    html body .zab-path__step:nth-child(4) .zab-path__node { animation-range: entry 40% cover 40%; }
    html body .zab-path__step:nth-child(5) .zab-path__node { animation-range: entry 50% cover 45%; }
  }
  @keyframes zab-path-draw { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
  @keyframes zab-path-pop { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
}

@media (max-width: 1000px) {
  html body .zab-timeline .zab-path__list { grid-template-columns: 1fr; gap: 0; }
  html body .zab-path__growth { display: none; }
  html body .zab-timeline .zab-path__list::after { position: absolute; z-index: -1; top: 30px; bottom: 60px; left: 26px; width: 8px; content: ""; background: linear-gradient(180deg, #c9d8f3, #5b8def 60%, #1d4ed8); clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%); }
  html body .zab-timeline .zab-path__step { min-height: 0; padding: 4px 0 34px 84px; }
  html body .zab-timeline .zab-path__step:last-child { padding-bottom: 0; }
  html body .zab-path__node { top: 0; }
  html body .zab-timeline .zab-path__step time { font-size: 24px; }
  html body .zab-timeline .zab-path__step--now time { font-size: 18px; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      html body .zab-timeline .zab-path__list::after { transform-origin: top; animation: zab-path-rail linear both; animation-timeline: view(); animation-range: entry 10% cover 60%; }
      html body .zab-path__step .zab-path__node { animation-range: entry 30% cover 40% !important; }
    }
  }
  @keyframes zab-path-rail { from { transform: scaleY(0); } to { transform: none; } }
}

/* ---------- /about/: portal block on a light surface ---------- */
html body main .zab-support .zhd-portal__channels span { color: #1e3a5f !important; background: #fff !important; border: 1px solid #b9cde8 !important; }
html body main .zab-support .zhd-portal__channels span::before { background: #1d4ed8 !important; }
html body main .zab-support .zhd-portal__action--ghost,
html body main .zab-support .zhd-portal__action--ghost:visited { color: #1740b0 !important; background: #fff !important; border: 1px solid #7fa0d8 !important; }
html body main .zab-support .zhd-portal__action--ghost:hover { color: #0f2f86 !important; background: #e5efff !important; border-color: #1d4ed8 !important; }
html body main .zab-support__portal-card .zn-inline-link,
html body main .zab-support__portal-card .zn-inline-link:visited { color: #9ec0ff !important; text-decoration-color: rgba(158, 192, 255, .5) !important; }
html body main .zab-support__portal-card .zn-inline-link:hover { color: #fff !important; text-decoration-color: #fff !important; }
html body main .zab-support__portal-card .zn-inline-link:focus-visible { outline: 3px solid #f59e0b; outline-offset: 4px; }

/* ---------- /about/: related directions as cards ---------- */
html body main .zab-links__grid { align-items: stretch; }
html body main .zab-links__grid a.zab-link-card { position: relative; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; column-gap: 14px; min-height: 132px; padding: 24px; color: var(--zt-ink, #0b1626); text-decoration: none !important; background: #fff; border: 1px solid #dbe4f0; border-radius: 22px; box-shadow: 0 1px 2px rgba(11, 22, 38, .04); transition: border-color .2s, box-shadow .2s, transform .2s; }
html body main .zab-links__grid a.zab-link-card :is(strong, span) { text-decoration: none !important; }
html body main .zab-links__grid a.zab-link-card strong { grid-column: 1; color: var(--zt-ink, #0b1626); font-size: 19px; line-height: 1.25; }
html body main .zab-links__grid a.zab-link-card span { grid-column: 1 / -1; align-self: end; margin: 0; padding-top: 22px; color: #4a5a70; font-size: 14px; font-weight: 500; line-height: 1.45; }
html body main .zab-link-card__arrow { grid-column: 2; grid-row: 1; display: grid; place-items: center; width: 36px; height: 36px; color: #1d4ed8; background: #e8efff; border-radius: 50%; font-style: normal; font-weight: 700; transition: background .2s, color .2s, transform .2s; }
html body main .zab-links__grid a.zab-link-card:hover { background: #fff; border-color: #1d4ed8; box-shadow: 0 16px 38px rgba(29, 78, 216, .12); transform: translateY(-3px); }
html body main .zab-links__grid a.zab-link-card:hover .zab-link-card__arrow { color: #fff; background: #1d4ed8; transform: translateX(3px); }
html body main .zab-links__grid a.zab-link-card:active { transform: none; box-shadow: none; }
html body main .zab-links__grid a.zab-link-card:focus-visible { outline: 3px solid #f59e0b; outline-offset: 4px; }
@media (max-width: 820px) { html body main .zab-links__grid a.zab-link-card { min-height: 0; } }
@media (prefers-reduced-motion: reduce) { html body main .zab-links__grid a.zab-link-card, html body main .zab-link-card__arrow { transition: none; transform: none !important; } }

/* ---------- site-wide: headings and labels on dark surfaces ---------- */
html body main :is(.zab-story-card--dark, .zab-credentials, .zc-route--accent, .zc-mid-cta, .zb-hero) :is(h1, h2, h3) { color: #fff !important; }
html body main .zab-story-card--dark i { color: #8fb6ff !important; }
html body main :is(.zc-request, .za-section--dark, .zab-education, .zhd-portal, .zr-contacts, .zab-team, .zc-section--dark, .zc-mid-cta) :is(.za-eyebrow, .zc-eyebrow, .zhp-kicker, .zhd-portal__eyebrow) { color: #8fb6ff !important; }
html body main .zr-contacts .zr-contact-panel__badge { color: #fff !important; }
html body main .zr-contacts .zr-contact-link--primary :is(span, small) { color: #dbe6ff !important; }
html body .zt-sla__p--1 { background: #c42b31 !important; }

/* ---------- site-wide: muted text on tinted backgrounds (AA 4.5:1) ---------- */
html body main .zc-breadcrumb :is(span, div) { color: #56657a !important; }
html body main :is(.zp-price-head > span, .rt-number-list p) { color: #56657a !important; }
html body main :is(.zb-explain b, .zb-explain span, .zb-step span) { color: #1d4ed8 !important; }
html body main :is(.za-hero, .zsm-hero) h1 + p { color: #44546a !important; }
html body main .zc-service-map__head > p { color: #56657a !important; }
html body .zs-footer__bottom { color: #9aa8bb !important; }
html body main .zr-contacts .zr-contact-panel__badge { background: linear-gradient(135deg, #2563eb, #1d4ed8) !important; }

/* ---------- site-wide first screen (release-20261028-heroes): one card, plain lists, joined summary strip ---------- */
html body main section.za-hero h1 { font-size: clamp(32px, 3.2vw, 46px) !important; line-height: 1.08 !important; margin-bottom: 18px !important; }
html body main section.za-hero > .za-container { align-items: center; }
html body main section.za-hero .za-hero-card { padding: 26px 26px 20px; }
html body main section.za-hero .za-hero-card > h2 { margin: 0 0 4px !important; font-size: 20px !important; letter-spacing: -.015em !important; }
html body main section.za-hero .za-hero-card ul { display: grid; gap: 0 !important; margin: 8px -12px 0 !important; padding: 0 !important; list-style: none; }
html body main section.za-hero .za-hero-card.za-hero-card ul li { margin: 0 !important; padding: 12px !important; color: #22324a !important; font-size: 16px; font-weight: 500 !important; line-height: 1.45; background: transparent !important; border: 0 !important; border-top: 1px solid #e3e9f1 !important; border-radius: 0 !important; box-shadow: none !important; }
html body main section.za-hero .za-hero-card.za-hero-card ul li:first-child { border-top: 0 !important; }
html body main section.za-hero .za-hero-card.za-hero-card ul li:has(> a) { padding: 0 !important; }
html body main section.za-hero .za-hero-card.za-hero-card li a.zn-inline-link { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 12px; color: #22324a !important; font-weight: 500 !important; line-height: 1.4; text-decoration: none !important; background: transparent !important; border: 0 !important; border-radius: 12px !important; transition: background .18s, color .18s; }
html body main section.za-hero .za-hero-card.za-hero-card li a.zn-inline-link::after { display: grid; flex: none; place-items: center; width: 28px; height: 28px; content: "→"; color: #1d4ed8; background: #fff; border-radius: 50%; font-weight: 700; transition: transform .18s, background .18s, color .18s; }
html body main section.za-hero .za-hero-card.za-hero-card li a.zn-inline-link:hover { color: #1d4ed8 !important; background: #fff !important; }
html body main section.za-hero .za-hero-card.za-hero-card li a.zn-inline-link:hover::after { color: #fff; background: #1d4ed8; transform: translateX(2px); }
html body main section.za-hero .za-hero-card.za-hero-card li a.zn-inline-link:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }
html body main section.za-hero .za-hero-card .zc-hero-price { margin-top: 14px; }

html body main section.za-hero:has(+ .zv-summary-strip) { padding-bottom: 0 !important; border-bottom: 0 !important; }
html body main section.za-hero:has(+ .zv-summary-strip) > .za-container { border-bottom-color: #edf1f6 !important; border-radius: 28px 28px 0 0 !important; }
html body main section.za-hero + .zv-summary-strip { max-width: 1248px; margin: 0 auto !important; padding: 0 24px 8px; background: transparent !important; }
html body main section.za-hero + .zv-summary-strip .zv-summary-strip__inner { padding: 10px 40px; background: #fafbfd !important; border: 1px solid #e3e9f1 !important; border-top: 0 !important; border-radius: 0 0 28px 28px !important; box-shadow: none !important; }
html body main section.za-hero + .zv-summary-strip .zv-summary-item + .zv-summary-item { border-left: 1px solid #e3e9f1; border-radius: 0; }
@media (max-width: 900px) {
  html body main section.za-hero .za-hero-card { padding: 20px 18px 14px; }
  html body main section.za-hero + .zv-summary-strip .zv-summary-strip__inner { padding: 8px 14px; }
  html body main section.za-hero + .zv-summary-strip .zv-summary-item + .zv-summary-item { border-left: 0; border-top: 1px solid #e3e9f1; }
}
@media (max-width: 760px) {
  html body main section.za-hero + .zv-summary-strip { padding: 0 16px 8px; }
  html body main section.za-hero:has(+ .zv-summary-strip) > .za-container { border-radius: 22px 22px 0 0 !important; }
  html body main section.za-hero + .zv-summary-strip .zv-summary-strip__inner { border-radius: 0 0 22px 22px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body main section.za-hero .za-hero-card li a.zn-inline-link, html body main section.za-hero .za-hero-card li a.zn-inline-link::after { transition: none; transform: none !important; }
}

/* ---------- first screen on pages with their own markup (release-20261028-heroes2): same white card as section.za-hero ---------- */
html body main section.za-hero { border-bottom: 0 !important; }
html body main .case-story { background: #f5f7fb; }
html body main :is(.case-story .cs-intro, .zt-page-hero, .zsm-hero > .zsm-container) { max-width: none; margin: 24px 0 8px; padding: clamp(28px, 4vw, 52px) !important; color: var(--zt-ink, #0b1626); background: #fff; border: 1px solid #e3e9f1; border-radius: 28px; }
html body main .case-story .cs-intro { margin: 24px 0 40px; }
html body main .case-story.cs-index .cs-intro { margin-top: 24px; }
html body main .zt-page-hero { margin: 0 0 24px; }
html body main :is(.case-story .cs-intro, .zt-page-hero, .zsm-hero, .zc-hero) h1 { max-width: none; margin: 0 0 18px !important; color: var(--zt-ink, #0b1626) !important; font-size: clamp(32px, 3.2vw, 46px) !important; font-weight: 760 !important; line-height: 1.08 !important; letter-spacing: -.035em !important; }
html body main :is(.case-story .cs-intro .cs-lead, .zt-page-hero > p:not(.za-eyebrow), .zsm-hero p) { max-width: 760px; color: #44546a !important; font-size: 18px; line-height: 1.6; }
html body main .case-story .cs-intro .cs-lead:last-child, html body main .zt-page-hero > p:last-child { margin-bottom: 0; }
html body main .zsm-hero { padding: 24px 0 0 !important; background: transparent !important; border: 0 !important; }
html body main .zsm-hero > .zsm-container { box-sizing: border-box; width: min(calc(100% - 40px), 1180px); margin: 0 auto; }
html body main .zsm-hero + .zsm-content { padding-top: 32px; background: transparent; }
html body main .zc-hero { border-bottom: 0 !important; }
@media (max-width: 760px) {
  html body main :is(.case-story .cs-intro, .zt-page-hero, .zsm-hero > .zsm-container) { padding: 24px 18px !important; border-radius: 22px; }
  html body main .zsm-hero > .zsm-container { width: calc(100% - 28px); }
  html body main :is(.case-story .cs-intro .cs-lead, .zt-page-hero > p:not(.za-eyebrow), .zsm-hero p) { font-size: 17px; }
}
html body main :is(.zrv-page, .zn-requisites):has(.zt-page-hero) { padding-top: 24px !important; }
html body main .case-story figcaption span { color: #56657a !important; }