:root {
  --page: #060b1d;
  --light: 0;
  --pad: clamp(20px, 4.4vw, 72px);
  --hdr-h: 80px;
  --fg: #fff;
  --fg-2: #bdc2ce;
  --fg-3: #99a2b8;
  --line: rgba(177, 187, 255, .2);
  --accent-text: #bac7eb;
  --cta-fg: #143278;
  color-scheme: dark;
}

html { background: var(--page); scroll-padding-top: var(--hdr-h); scroll-behavior: auto; }
body { background: var(--page); color: var(--fg); }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
.skip-link { background: #fff; color: var(--navy); font-weight: 600; }

/* Scene typography behaves as part of the presentation when dragged. */
.hdr, #main, .ftr__hero {
  -webkit-user-select: none;
  user-select: none;
}

/* The canvas stays behind the readable document and never receives input. */
.field {
  position: fixed; inset: 0; z-index: 0;
  width: 100%; height: 100%; height: 100lvh;
  pointer-events: none; visibility: hidden;
}
.field.is-ready { visibility: visible; }

/* Prepare before paint, then follow the same entrance clock as the globe. */
html.has-entrance, .has-entrance body { background: #000; }
.has-entrance .hdr {
  opacity: var(--entry-header, 0);
  transform: translate3d(0, calc((1 - var(--entry-header, 0)) * -8px), 0);
  will-change: opacity, transform;
}
.has-entrance .intro-title {
  opacity: var(--entry-copy, 0);
  transform: translate3d(0, calc((1 - var(--entry-copy, 0)) * 22px), 0);
  will-change: opacity, transform;
}
@media (prefers-reduced-motion: reduce) {
  .has-entrance .hdr, .has-entrance .intro-title { opacity: 1; transform: none; will-change: auto; }
}

main { position: relative; z-index: 1; }
.wrap { padding: 0 var(--pad); }

/* Each stop keeps a full viewport while the field moves independently. */
.globe-intro, .hero { position: relative; min-height: 100svh; padding-top: clamp(116px, 15svh, 156px); }
.globe-intro { padding-top: clamp(132px, 19svh, 204px); text-align: center; }
.globe-intro .intro-title {
  display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: .16em .28em;
  font-size: clamp(32px, 3.5vw, 52px); font-weight: 560; line-height: 1.25;
}
.intro-title__promise, .intro-title__action { color: var(--fg); font-weight: inherit; white-space: nowrap; letter-spacing: -.035em; }
.intro-title__ai { color: var(--accent-text); }
.hero__title { margin: 0; font-size: clamp(34px, 3.5vw, 54px); font-weight: 700; line-height: 1.22; letter-spacing: -.035em; }
.hero > .wrap, .chapter__inner, .final__inner { width: min(580px, 44vw); padding: 0; color: var(--fg); }
.hero > .wrap { margin-left: var(--pad); }

/* Category titles establish the chapter; products sit beside their 3D symbols. */
.chapter {
  --category-ink: color-mix(in srgb, #68707a calc(var(--light) * 100%), #adb3bd);
  position: relative; min-height: 100svh; display: flex; align-items: flex-start;
  padding: clamp(124px, 14.5svh, 164px) var(--pad) 0;
}
.chapter__inner { width: 100%; }
.chapter__market {
  display: flex; align-items: baseline; gap: clamp(18px, 2vw, 28px);
  margin: 0; color: var(--category-ink); font-size: clamp(32px, 3.5vw, 56px);
  font-weight: 430; line-height: 1.12; letter-spacing: -.035em;
}
.chapter__market-title { white-space: nowrap; }
.chapter__category {
  flex-shrink: 0; color: inherit;
  font-size: clamp(15px, 1.2vw, 18px); font-weight: 500;
  line-height: 1; letter-spacing: .02em;
}
.chapter__scope {
  margin: 14px 0 0; color: var(--category-ink);
  font-size: clamp(16px, 1.2vw, 18px); font-weight: 400; line-height: 1.5; letter-spacing: -.025em;
}
.chapter__products {
  width: min(600px, 44vw); margin-top: clamp(80px, 14svh, 152px);
}
.chapter__name {
  margin: 0; color: var(--fg); font-size: clamp(52px, min(5vw, 8svh), 76px);
  font-weight: 650; line-height: 1.1; letter-spacing: -.045em;
}
.chapter__link, .final__cta {
  display: inline-flex; align-items: center; gap: 18px; min-height: 44px; margin-top: 24px; padding: 8px 0;
  color: var(--fg); border-bottom: 1px solid var(--line);
  font-size: 15px; font-weight: 600; letter-spacing: -.01em; text-decoration: none;
  transition: border-color 160ms var(--ease-standard), transform 160ms var(--ease-standard);
}
.chapter__link:hover, .final__cta:hover { border-color: currentColor; }
.chapter__link:active, .final__cta:active { transform: translateY(1px); transition-duration: 80ms; }
.chapter__link { margin-top: 22px; }
.pair { display: grid; grid-template-columns: repeat(2, max-content); gap: clamp(32px, 4.5vw, 72px); }
.pair .chapter__name { font-size: clamp(36px, 3.8vw, 60px); }
.pair .chapter__link { font-size: 14px; gap: 10px; }
.is-static .chapter { --category-ink: #68707a; }

/* The complete Pascal reveal gets its own stop before the contact transition. */
.final { position: relative; min-height: 100svh; padding: clamp(116px, 18svh, 190px) var(--pad) 0; }
.final__title {
  margin: 0; color: var(--fg); font-size: clamp(64px, 6.5vw, 96px);
  font-weight: 750; line-height: 1.08; letter-spacing: -.055em;
}
.final__cta { margin-top: 24px; }

/* The stage preserves layout and native snap geometry while the footer is pinned. */
.ftr-stage { position: relative; z-index: 2; }
.has-footer-transition .ftr {
  opacity: var(--ftr-surface, 0);
  pointer-events: none;
}
.has-footer-transition .ftr.is-pinned {
  position: fixed; inset: 0 0 auto;
  transform: translate3d(0, var(--ftr-lift, 0px), 0);
}
.has-footer-transition .ftr.is-present { pointer-events: auto; }

/* Company details keep their natural document height after the contact stop. */
.ftr {
  --fg: #fff;
  --fg-2: #c1cbe4;
  --line: rgba(225, 233, 255, .25);
  position: relative; z-index: 2; min-height: 100svh;
  display: flex; flex-direction: column;
  padding: 0 clamp(24px, 3.2vw, 80px) env(safe-area-inset-bottom);
  background:
    radial-gradient(ellipse at 28% 48%, rgba(55, 85, 238, .72), transparent 44%),
    radial-gradient(ellipse at 78% 58%, rgba(42, 67, 196, .48), transparent 48%),
    linear-gradient(180deg, #102658 0%, #143278 56%, #102658 100%);
  color: var(--fg); color-scheme: dark;
}
.ftr__hero {
  position: relative; display: grid; place-items: center; flex: 1;
  min-height: clamp(360px, 42vw, 605px);
  border-bottom: 1px solid var(--line);
}
.ftr__title {
  width: 100%; margin: 0; color: #fff; text-align: center;
  font-size: clamp(42px, 14vw, 300px); line-height: 1;
  font-weight: 350; letter-spacing: -.065em; white-space: nowrap;
}
.ftr__contact {
  position: absolute; inset: 0; display: grid; place-items: center; padding-top: 8vw;
  color: #fff; text-decoration: none; -webkit-tap-highlight-color: transparent;
}
.ftr__contact:focus-visible { outline: 2px solid #fff; outline-offset: -8px; }
.ftr__contact-mark, .ftr-cursor__disc {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px;
  width: 104px; height: 104px; border-radius: 50%; background: #fff; color: #143278;
  font-size: 13px; line-height: 1; font-weight: 600; letter-spacing: -.02em; pointer-events: none;
}
.ftr__contact-mark { position: absolute; right: 0; bottom: 48px; transition: opacity 120ms ease, transform 180ms var(--ease-standard); }
.ftr__contact-mark svg, .ftr-cursor__disc svg { width: 40px; height: 40px; }
.ftr__contact:active .ftr__contact-mark { transform: scale(.94); }
.ftr__email span { transition: transform 200ms var(--ease-standard); }
.ftr__email:hover span { transform: translate(2px, -2px); }
.ftr-cursor { position: fixed; top: 0; left: 0; z-index: 40; display: none; visibility: hidden; pointer-events: none; }
.ftr-cursor__disc { width: 48px; height: 48px; opacity: 0; transform: translate(-50%, -50%) scale(.8); transition: opacity 100ms ease, transform 160ms var(--ease-standard); }
.ftr-cursor__disc svg { width: 22px; height: 22px; }
.ftr-cursor.is-active { visibility: visible; }
.ftr-cursor.is-active .ftr-cursor__disc { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.ftr-cursor.is-pressed .ftr-cursor__disc { transform: translate(-50%, -50%) scale(.94); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .ftr-cursor { display: block; }
  .ftr__contact.is-cursor-active { cursor: none; }
  .ftr__contact.is-cursor-active .ftr__contact-mark { opacity: 0; transform: scale(.85); }
}
.ftr__brand {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 32px;
  min-height: 184px; padding: 50px 0;
}
.ftr__identity { min-width: 0; }
.ftr__company { margin-top: 26px; color: var(--fg-2); font-size: 12px; line-height: 1.8; }
.ftr__company p { margin: 0; }
.ftr__company .ftr__company-name { margin-bottom: 7px; color: #fff; font-size: 13px; }
.ftr__registration { display: flex; flex-wrap: wrap; gap: 0 18px; }
.ftr__company address { margin-top: 3px; font: inherit; }
.ftr__contacts { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; gap: 2px; }
.ftr__logo { display: block; flex-shrink: 0; width: clamp(160px, 18vw, 260px); }
.ftr__logo svg { height: auto; width: 100%; }
.ftr .pascal-wordmark-dot, .hdr.is-on-footer .pascal-wordmark-dot { fill: #91a5ff; }
.ftr__email {
  display: inline-flex; align-items: center; gap: 18px; min-height: 44px;
  font-size: clamp(17px, 1.6vw, 23px); font-weight: 400; letter-spacing: -.02em; text-decoration: none;
}
.ftr__phone { display: inline-flex; align-items: center; gap: 18px; min-height: 44px; color: var(--fg-2); font-size: 15px; text-decoration: none; }
.ftr__email:hover, .ftr__phone:hover, .ftr__back:hover { text-decoration: underline; text-underline-offset: 5px; }
.ftr__bottom {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  min-height: 76px; padding: 16px 0; border-top: 1px solid var(--line);
}
.ftr__copy { margin: 0; color: var(--fg-2); font-size: 11px; }
.ftr__back { display: inline-flex; align-items: center; min-height: 44px; gap: 8px; color: var(--fg-2); font-size: 11px; text-decoration: none; }
.ftr :focus-visible { outline-color: #c4d0ff; }
.hdr.is-on-footer { --fg: #fff; --pascal-dot: #91a5ff; }

/* A failed renderer leaves the complete document and navigation available. */
.is-static body {
  --page: #fff; --fg: #143278; --fg-2: #506077; --fg-3: #6b788f;
  --line: rgba(20, 50, 120, .2); --accent-text: #3d56ff;
  color-scheme: light;
}
.is-static .field { display: none; }
.is-static .hdr { background: var(--page); }
.is-static .hdr.is-on-footer { background: #102658; }
.is-static .wrap, .is-static .chapter__inner, .is-static .final__inner { opacity: 1 !important; visibility: visible !important; }

@media (max-width: 720px) {
  :root { --hdr-h: 68px; }
  .globe-intro, .hero { padding-top: 108px; }
  .globe-intro { padding-top: max(120px, 16svh); }
  .globe-intro .intro-title { font-size: clamp(28px, 7.2vw, 38px); }
  .hero > .wrap, .chapter__inner, .final__inner { width: 100%; padding: 0; }
  .hero > .wrap { margin-left: var(--pad); width: calc(100% - var(--pad) * 2); }
  .chapter { padding: max(100px, 12svh) var(--pad) 0; }
  .chapter__market { align-items: flex-start; justify-content: space-between; font-size: clamp(30px, min(9vw, 4.5svh), 40px); }
  .chapter__market-title { white-space: normal; }
  .chapter__market-title > span { display: block; }
  .chapter__category { font-size: 15px; margin-top: 8px; }
  .chapter__scope { font-size: 16px; margin-top: 12px; }
  .chapter__products { width: 100%; margin-top: clamp(26px, 4.5svh, 40px); }
  .chapter__name { font-size: clamp(36px, 10vw, 48px); }
  .chapter__link { margin-top: 12px; font-size: 14px; }
  .pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 440px; }
  .pair .chapter__name { font-size: clamp(30px, 8.4vw, 40px); }
  .pair .chapter__link { margin-top: 12px; font-size: 12px; gap: 8px; }
  .final { min-height: 100svh; padding: max(108px, 14svh) var(--pad) 0; }
  .final__title { font-size: clamp(56px, 14vw, 84px); }
  .final__cta { margin-top: 18px; font-size: 14px; }
  .ftr { padding: 0 24px env(safe-area-inset-bottom); }
  .ftr__hero { min-height: 440px; }
  .ftr__title { font-size: 23vw; line-height: .94; white-space: normal; }
  .ftr__title span { display: block; }
  .ftr__title span + span { margin-top: .14em; }
  .ftr__contact { padding: 0 0 80px; }
  .ftr__contact-mark { width: 88px; height: 88px; bottom: 30px; gap: 7px; font-size: 12px; }
  .ftr__contact-mark svg { width: 34px; height: 34px; }
  .ftr__brand { flex-direction: column; align-items: flex-start; gap: 20px; min-height: 0; padding: 34px 0 30px; }
  .ftr__company { margin-top: 22px; }
  .ftr__registration { flex-direction: column; }
  .ftr__contacts { align-items: flex-start; gap: 0; }
  .ftr__logo { width: 166px; }
  .ftr__email { font-size: 18px; }
  .ftr__bottom { min-height: 72px; padding: 14px 0; gap: 12px; }
  .ftr__copy, .ftr__back { font-size: 10px; }
}


/* Keep the same composition without shifting the camera anchor in short windows. */
@media (min-width: 721px) and (max-height: 780px) {
  .chapter { padding-top: 124px; }
  .chapter__market { font-size: clamp(32px, 3.5vw, 48px); }
  .chapter__scope { margin-top: 14px; font-size: 17px; }
  .chapter__products { margin-top: clamp(50px, 10svh, 78px); }
  .chapter__name { font-size: clamp(44px, 4.7vw, 60px); }
  .pair .chapter__name { font-size: clamp(32px, 3.5vw, 44px); }
  .chapter__link { margin-top: 18px; }
}

/* Touch keeps native movement and settles at complete scenes, including the footer. */
@media (hover: none), (pointer: coarse) {
  html:not(.is-static) { scroll-snap-type: y mandatory; scroll-padding-top: 0; }
  .globe-intro, .hero, .chapter, .final { scroll-snap-align: start; scroll-snap-stop: always; }
  .ftr-stage { scroll-snap-align: start; scroll-snap-stop: always; }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.is-static) { scroll-snap-type: none; }
  .final__cta, .chapter__link, .ftr__contact-mark, .ftr__email span { transition: none; }
}
