.eurion-home { --scene-top-fade: linear-gradient(180deg, var(--page-base) 0%, #000b 10%, #0005 24%, #0001 38%, transparent 48%); color: #fff; font-family: 'Manrope', sans-serif; }
.eurion-home * { box-sizing: border-box; }
.eurion-home h1, .eurion-home h2, .eurion-home p { margin: 0; }
.eurion-home a:focus-visible, .eurion-home button:focus-visible { outline: 2px solid #009aff; outline-offset: 7px; }
.eurion-scroll-story { position: relative; }
.eurion-story-stage { position: relative; }
.eurion-scene { position: relative; display: grid; place-items: center; min-height: 100svh; overflow: hidden; isolation: isolate; }
.eurion-scene__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(var(--image-zoom, 1)); z-index: -2; }
.eurion-scene--intro { --image-zoom: 1.35; --scene-top-shade: #0001; --scene-center-shade: #0007; --scene-side-shade: #0000; }
.eurion-intro-visual { position: absolute; inset: 0; z-index: -2; isolation: isolate; background: radial-gradient(ellipse 60% 75% at 50% 58%, #034bac 0%, #032354 40%, #010e29 65%, #00050e 85%, transparent 100%); }
.eurion-scene--intro .eurion-scene__image { top: clamp(48px, 7svh, 88px); transform-origin: center top; mask-image: linear-gradient(180deg, transparent 0%, rgb(0 0 0 / .15) 2%, rgb(0 0 0 / .45) 5%, rgb(0 0 0 / .75) 9%, rgb(0 0 0 / .94) 14%, #000 20%); }
.eurion-scene__shade { position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 48%, var(--scene-center-shade, #0005), #0000 65%), linear-gradient(0deg, var(--page-base) 0%, #0002 25%, #0002 75%, var(--scene-top-shade, #0008) 100%), linear-gradient(90deg, var(--scene-side-shade, #0004) 18%, #0004 34%, #0004 66%, var(--scene-side-shade, #0004) 82%); }
.eurion-scene__shade::after { content: ''; position: absolute; inset: 0; background: var(--scene-top-fade); }
.eurion-scene--intro .eurion-scene__shade::after { background: var(--scene-top-fade), linear-gradient(90deg, var(--page-base) 0%, #0005 8%, #0001 18%, transparent 28%, transparent 72%, #0001 82%, #0005 92%, var(--page-base) 100%); }
#story-customers .eurion-scene__image { object-position: 88% center; }
.eurion-scene__content { width: min(1100px, calc(100% - 96px)); padding: 110px 0 100px; text-align: center; margin: auto; }
.eurion-scene--intro .eurion-scene__content { width: min(1100px, 50vw); }
.eurion-scene h1, .eurion-scene h2 { color: #fff; font-size: clamp(40px, 4.4vw, 72px); line-height: 1.16; font-weight: 600; letter-spacing: -.025em; text-wrap: balance; text-shadow: 0 2px 14px #0004; }
.eurion-scene p { max-width: 1000px; margin: 28px auto 0; color: #d2d5db; font-size: clamp(17px, 1.65vw, 26px); line-height: 1.55; font-weight: 400; text-wrap: balance; text-shadow: 0 2px 14px #000; }
.eurion-typing { max-width: 950px; min-height: 84px; margin: 25px auto 8px; color: #64baff; font-size: clamp(19px, 1.8vw, 28px); line-height: 1.5; font-weight: 300; text-shadow: 0 2px 18px #000; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
  .eurion-typing #typed3 { background: linear-gradient(90deg, #35aaff 0%, #9bd6ff 55%, #fff 100%); background-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; text-shadow: none; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
}
.eurion-typing .typed-cursor { color: #9bd6ff; font-weight: inherit; }
.eurion-story-nav, .eurion-story-scroll { display: none; }
.eurion-scroll-story.is-scroll-ready .eurion-story-stage { position: sticky; top: 0; height: 100svh; min-height: 400px; overflow: hidden; }
.is-scroll-ready .eurion-scene { position: absolute; inset: 0; height: 100%; min-height: 0; opacity: var(--scene-opacity, 0); visibility: hidden; background: transparent; }
.is-scroll-ready .eurion-scene.is-visible { visibility: visible; }
.is-scroll-ready .eurion-scene__image { transform: scale(var(--scene-scale, 1)) scale(var(--image-zoom, 1)); will-change: transform; }
.is-scroll-ready .eurion-scene__content { transform: translateY(var(--scene-y, 0px)); opacity: var(--copy-opacity, 1); }
.is-scroll-ready .eurion-story-nav { position: absolute; right: 32px; top: 50%; transform: translateY(-50%); z-index: 5; display: flex; flex-direction: column; gap: 5px; }
.eurion-story-nav a { display: grid; place-items: center; width: 32px; height: 32px; }
.eurion-story-nav span { width: 5px; height: 5px; border-radius: 99px; background: rgb(255 255 255 / .08); transition: background .2s, height .2s; }
.eurion-story-nav [aria-current='step'] span { height: 23px; background: #fff; }
.is-scroll-ready .eurion-story-scroll { position: absolute; z-index: 5; bottom: 26px; left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: rgb(255 255 255 / .08); color: #fff; transition: background .2s; }
.is-scroll-ready .eurion-story-scroll:hover { background: rgb(255 255 255 / .14); }
.eurion-story-scroll:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.eurion-story-scroll.is-last { visibility: hidden; }
.eurion-home-page .eurion-header { background: transparent; backdrop-filter: none; }
.eurion-home-page > footer { position: relative; }
@media (max-width: 700px) {
  .eurion-scene--intro { --image-zoom: 1; }
  .eurion-scene__content, .eurion-scene--intro .eurion-scene__content { width: calc(100% - 48px); padding: 110px 0 100px; }
  .eurion-scene h1, .eurion-scene h2 { font-size: clamp(31px, 8.4vw, 48px); line-height: 1.2; letter-spacing: -.03em; }
  .eurion-scene p { margin-top: 24px; font-size: 16px; line-height: 1.65; }
  .eurion-typing { min-height: 94px; margin-top: 25px; font-size: 19px; }
  .eurion-scene__image { object-position: center; }
  .eurion-scene--intro .eurion-scene__image { object-position: center; }
  #story-platform .eurion-scene__image { object-position: 55% center; }
  #story-intelligence .eurion-scene__image { object-position: 64% center; }
  .eurion-scene__shade { background: linear-gradient(0deg, var(--page-base) 0%, #0005 25%, #0005 75%, var(--scene-top-shade, #0009) 100%), linear-gradient(90deg, var(--scene-side-shade, #0004) 18%, #0004 34%, #0004 66%, var(--scene-side-shade, #0004) 82%); }
  .is-scroll-ready .eurion-story-nav { right: 4px; }
  .eurion-story-nav a { width: 22px; height: 30px; }
  .is-scroll-ready .eurion-story-scroll { bottom: 22px; }
}
/* Crop the portraits at both edges and leave the centered copy between them. */
@media (max-width: 700px) and (orientation: portrait) {
  .eurion-scene--intro .eurion-scene__image { top: 50%; left: 50%; right: auto; bottom: auto; width: 210%; max-width: none; height: auto; max-height: none; translate: -50% -54%; transform-origin: 50% 54%; object-fit: contain; }
  .eurion-scene--intro .eurion-scene__content { align-self: center; width: 60%; margin: auto; padding: 0; }
  .eurion-scene--intro h1 { font-size: clamp(24px, 6.8vw, 32px); line-height: 1.2; }
  .eurion-scene--intro .eurion-typing { min-height: 4.5em; margin: 22px auto 0; font-size: clamp(15px, 4.1vw, 18px); line-height: 1.5; }
  .eurion-scene--intro .eurion-scene__shade { background: radial-gradient(ellipse 52% 45% at 50% 50%, #0008, #0003 62%, transparent), linear-gradient(0deg, var(--page-base) 0%, transparent 24%, transparent 78%, #0004 100%); }
  .eurion-scene--intro .eurion-scene__shade::after { background: var(--scene-top-fade); }
}
/* Keep the complete train below the copy when a wide viewport would crop its nose. */
@media (min-aspect-ratio: 2/1) {
  #story-customers .eurion-scene__image { top: auto; left: 50%; right: auto; width: auto; height: 92%; translate: -50% 0; object-fit: contain; mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); }
}
@media (max-height: 540px) and (min-width: 701px) {
  .eurion-scene__content { padding-block: 100px 50px; }
  .eurion-scene h1, .eurion-scene h2 { font-size: 36px; }
  .eurion-scene p { font-size: 17px; margin-top: 16px; }
  .eurion-typing { font-size: 18px; min-height: 40px; margin-top: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .eurion-scene { min-height: 100svh; }
  .eurion-home * { transition: none !important; scroll-behavior: auto !important; }
}
