/* ==========================================================================
   FPI Security - Motion & brand layer (light premium + dark islands)
   Every effect is triggered by a CSS class set in Elementor > Advanced > CSS Classes.
   Sections with the class `fpi-dark` (SOC, footer, image tiles) switch to the dark palette.
   See README-FPI.md in the child theme for the class reference.
   ========================================================================== */

:root {
  --fpi-bg: var(--e-global-color-fpibg, #F5F7FA);
  --fpi-surface: var(--e-global-color-fpisurf, #FFFFFF);
  --fpi-surface-2: var(--e-global-color-fpisurf2, #EAF0F6);
  --fpi-ink: var(--e-global-color-fpiink, #0B1B2B);
  --fpi-muted: var(--e-global-color-fpimuted, #5E6E7E);
  --fpi-accent: var(--e-global-color-fpiaccent, #0B5C95);
  --fpi-steel: var(--e-global-color-fpisteel, #2F78B5);
  --fpi-line: var(--e-global-color-fpiline, #D8E1EA);
  --fpi-navy: var(--e-global-color-fpinavy, #0B4F7E);
  --fpi-dark: var(--e-global-color-fpidark, #070D14);
  --fpi-d-accent: var(--e-global-color-fpidaccent, #2C8BD6);
  --fpi-d-steel: var(--e-global-color-fpiicy, #9EC3DD);
  --fpi-d-line: var(--e-global-color-fpidline, #1C3047);
  --fpi-grad: linear-gradient(100deg, #3D8BCB 0%, var(--fpi-accent) 55%, var(--fpi-ink) 125%);
  --fpi-ease: cubic-bezier(.22, 1, .36, 1);
}
.fpi-dark { --fpi-grad: linear-gradient(100deg, var(--fpi-d-steel) 0%, var(--fpi-d-accent) 60%, var(--fpi-navy) 120%); }

html { background: var(--fpi-bg); overflow-x: clip; }
body { background: var(--fpi-bg); color: var(--fpi-ink); -webkit-font-smoothing: antialiased; overflow-x: clip; }
::selection { background: var(--fpi-accent); color: #F5F8FB; }

/* Astra: let Elementor pages run full width */
.ast-separate-container, .ast-plain-container, #page, .site-content { background: var(--fpi-bg) !important; }
.elementor-page .site-content > .ast-container { max-width: 100%; padding: 0; }

/* ---------- Brand utilities ---------- */
.fpi-grad, .fpi-grad .elementor-heading-title, .fpi-grad .fpi-word, .fpi-grad .fpi-line {
  background-image: var(--fpi-grad) !important;
  -webkit-background-clip: text; background-clip: text; color: transparent !important;
}
.fpi-outline-text, .fpi-outline-text .elementor-heading-title { -webkit-text-stroke: 1px var(--fpi-accent); color: transparent !important; }
.fpi-dark .fpi-outline-text, .fpi-dark .fpi-outline-text .elementor-heading-title { -webkit-text-stroke-color: var(--fpi-d-steel); }
.fpi-marquee .fpi-outline-text .elementor-heading-title { white-space: nowrap; }

.fpi-grid-bg { position: relative; isolation: isolate; }
.fpi-grid-bg::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(11,27,43,.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(11,27,43,.055) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 85%);
          mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 85%);
}
.fpi-dark.fpi-grid-bg::before, .fpi-dark .fpi-grid-bg::before {
  background-image:
    linear-gradient(to right, rgba(158,195,221,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(158,195,221,.06) 1px, transparent 1px);
}
.fpi-glow { position: relative; isolation: isolate; }
.fpi-glow::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  width: 60vw; height: 60vw; max-width: 900px; max-height: 900px; right: -15vw; top: -20vw;
  background: radial-gradient(circle, rgba(47,120,181,.16) 0%, rgba(11,92,149,.06) 40%, transparent 70%);
  filter: blur(10px);
}
.fpi-dark.fpi-glow::after, .fpi-dark .fpi-glow::after { background: radial-gradient(circle, rgba(44,139,214,.24) 0%, rgba(11,79,126,.10) 40%, transparent 70%); }

/* Image tiles with navy scrim (container with a background image) */
.fpi-scrim { position: relative; overflow: hidden; isolation: isolate; }
.fpi-scrim::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(7,13,20,.0) 0%, rgba(7,13,20,.45) 50%, rgba(7,13,20,.9) 100%);
}
.fpi-scrim--strong::after {
  background:
    linear-gradient(90deg, rgba(7,13,20,.88) 0%, rgba(7,13,20,.55) 45%, rgba(7,13,20,.15) 100%),
    linear-gradient(180deg, rgba(7,13,20,.3) 0%, rgba(7,13,20,0) 35%, rgba(7,13,20,.85) 100%);
}
.fpi-scrim > * { position: relative; z-index: 1; }
.fpi-duotone img { filter: saturate(.85) contrast(1.03); }

/* Light panels get a soft, tinted elevation */
.fpi-stack-item:not(.fpi-dark), .fpi-hero-media { box-shadow: 0 30px 60px -30px rgba(11,27,43,.25); }

/* Hairline divider rows */
.fpi-hairline-top { border-top: 1px solid var(--fpi-line); }

/* Hover lift for tiles */
.fpi-tile { transition: transform .6s var(--fpi-ease), border-color .4s, box-shadow .6s; background-size: cover; }
.fpi-tile:hover { transform: translateY(-6px); border-color: var(--fpi-accent) !important; box-shadow: 0 30px 50px -30px rgba(11,27,43,.35); }
.fpi-tile .fpi-tile-arrow { transition: transform .5s var(--fpi-ease); }
.fpi-tile:hover .fpi-tile-arrow { transform: translateX(8px); }

/* ---------- Header (light glass) ---------- */
.fpi-header { position: fixed !important; top: 0; left: 0; right: 0; z-index: 999; transition: background-color .4s, transform .5s var(--fpi-ease), border-color .4s, box-shadow .4s;
  background-color: rgba(245,247,250,.93) !important; -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); border-bottom: 1px solid transparent; }
.admin-bar .fpi-header { top: 32px; }
.fpi-header.is-scrolled { background-color: rgba(255,255,255,.86) !important; border-bottom-color: var(--fpi-line); box-shadow: 0 10px 30px -20px rgba(11,27,43,.3); }
.fpi-header.is-hidden { transform: translateY(-110%); }
.fpi-header .elementor-nav-menu--dropdown { background: var(--fpi-surface) !important; border: 1px solid var(--fpi-line); box-shadow: 0 20px 40px -20px rgba(11,27,43,.3); }

/* ---------- 3D canvases ---------- */
.fpi-3d { position: relative; }
.fpi-3d > canvas.fpi-3d-canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; display: block; z-index: 0; pointer-events: none; }
.fpi-3d > *:not(canvas) { position: relative; z-index: 1; }

@media (max-width: 1024px) {
  .fpi-3d.fpi-hero.e-con-boxed > .e-con-inner, .fpi-3d.fpi-hero.e-con-full { padding-top: 400px !important; }
  .fpi-3d:not(.fpi-hero).e-con-boxed > .e-con-inner, .fpi-3d:not(.fpi-hero).e-con-full { padding-top: 380px !important; }
  .fpi-3d { --justify-content: flex-start !important; --min-height: 0px !important; }
}
@media (max-width: 767px) {
  .fpi-3d.fpi-hero.e-con-boxed > .e-con-inner, .fpi-3d.fpi-hero.e-con-full { padding-top: 330px !important; }
  .fpi-3d:not(.fpi-hero).e-con-boxed > .e-con-inner, .fpi-3d:not(.fpi-hero).e-con-full { padding-top: 300px !important; }
}

/* ---------- Horizontal scroll ---------- */
.fpi-hscroll { overflow: hidden; }
.fpi-hscroll .fpi-hscroll-track { flex-wrap: nowrap !important; width: max-content !important; max-width: none !important; will-change: transform; }
.fpi-hscroll .fpi-hscroll-track > .e-con, .fpi-hscroll .fpi-hscroll-track > .e-con-inner > .e-con { flex-shrink: 0 !important; }
@media (max-width: 1024px) {
  .fpi-hscroll { overflow: visible; }
  .fpi-hscroll .fpi-hscroll-track { width: 100% !important; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; scroll-padding-left: 6vw; }
  .fpi-hscroll .fpi-hscroll-track::-webkit-scrollbar { display: none; }
  .fpi-hscroll .fpi-hscroll-track > .e-con { scroll-snap-align: start; }
}
html.fpi-no-motion .fpi-hscroll .fpi-hscroll-track { width: 100% !important; overflow-x: auto; scroll-snap-type: x mandatory; }
.elementor-heading-title { word-spacing: .06em; }

/* ---------- Marquee ---------- */
.fpi-marquee { overflow: hidden; }
.fpi-marquee .fpi-marquee-track { flex-wrap: nowrap !important; width: max-content !important; max-width: none !important; }
.fpi-marquee .fpi-marquee-track > * { flex-shrink: 0 !important; }

/* ---------- Sticky stacking panels ---------- */
.fpi-stack-item { position: sticky !important; top: 110px; transform-origin: 50% 0; }

/* ---------- Initial states (only when JS is running and not in the editor) ---------- */
html.fpi-js:not(.fpi-no-motion):not(.fpi-motion-fallback) body:not(.elementor-editor-active) .fpi-reveal,
html.fpi-js:not(.fpi-no-motion):not(.fpi-motion-fallback) body:not(.elementor-editor-active) .fpi-inout { opacity: 0; }
html.fpi-js:not(.fpi-motion-ready):not(.fpi-no-motion):not(.fpi-motion-fallback) body:not(.elementor-editor-active) .fpi-split .elementor-heading-title { visibility: hidden; }
.fpi-split .fpi-line-mask { overflow: clip; padding-bottom: .08em; margin-bottom: -.08em; }

/* ---------- Page transition curtain ---------- */
.fpi-curtain { position: fixed; inset: 0; z-index: 99999; pointer-events: none; display: grid; place-items: center;
  background: linear-gradient(135deg, #FFFFFF 0%, var(--fpi-bg) 60%, #E3ECF5 100%); transform: translateY(0); }
.fpi-curtain img { width: 130px; height: auto; }
html.fpi-no-motion .fpi-curtain, html.fpi-motion-fallback .fpi-curtain, body.elementor-editor-active .fpi-curtain { display: none; }

/* ---------- Forms (Elementor Pro form) ---------- */
.elementor-form .elementor-field-textual { background: var(--fpi-bg) !important; border: 1px solid var(--fpi-line) !important; color: var(--fpi-ink) !important; border-radius: 2px !important; }
.elementor-form .elementor-field-textual:focus { border-color: var(--fpi-accent) !important; box-shadow: 0 0 0 3px rgba(11,92,149,.18) !important; outline: none; }
.elementor-form ::placeholder { color: #7A8A99 !important; }

/* ---------- Footer ---------- */
.fpi-footer-word .elementor-heading-title { font-size: clamp(19px, 5.4vw, 104px) !important; white-space: nowrap; line-height: 1 !important; }
.fpi-footer .elementor-icon-list-item a { transition: color .3s; }

.fpi-img-reveal > .elementor-widget-image.fpi-parallax-rev { scale: 1.2; }
@media (max-width: 767px) { .fpi-footer-word { margin-top: 10px; } }

/* ---------- Legal pages ---------- */
.fpi-sticky { position: sticky !important; top: 120px; align-self: flex-start; }
.fpi-toc .elementor-icon-list-item a { transition: color .3s, transform .3s; }
.fpi-toc .elementor-icon-list-item a:hover { transform: translateX(4px); }
.fpi-anchor { scroll-margin-top: 120px; }
.fpi-legal .elementor-widget-text-editor p, .fpi-legal li { max-width: 72ch; }
.fpi-legal ul { padding-left: 1.2em; margin: 0 0 1em; }
.fpi-legal li { margin-bottom: .5em; }
.fpi-legal a, .elementor-widget-text-editor p a { color: var(--fpi-accent); text-decoration: underline; text-underline-offset: 3px; }

.elementor-widget-text-editor p:last-child { margin-bottom: 0; }

/* ---------- Footer credit ---------- */
.fpi-footer a.fpi-credit { color: var(--fpi-d-steel); text-decoration: none; font-weight: 600; background-image: linear-gradient(currentColor, currentColor); background-size: 0 1px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .4s var(--fpi-ease), color .3s; }
.fpi-footer a.fpi-credit:hover { color: #EEF3F7; background-size: 100% 1px; }

/* ---------- Film section ---------- */
.fpi-film { overflow: hidden; }
.fpi-film-media { position: relative; }
.fpi-film-media { isolation: isolate; }
.fpi-scrim.fpi-film-media > .fpi-film-video { position: absolute !important; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0 !important; transform: translateZ(0); }
.fpi-scrim.fpi-film-media > .fpi-film-shade { position: absolute !important; inset: 0; z-index: 1 !important; pointer-events: none; transform: translateZ(0);
  background: linear-gradient(90deg, rgba(7,13,20,.86) 0%, rgba(7,13,20,.5) 50%, rgba(7,13,20,.12) 100%), linear-gradient(180deg, rgba(7,13,20,.35) 0%, rgba(7,13,20,0) 30%, rgba(7,13,20,.8) 100%); }
.fpi-film-media.is-scrub::after { display: none; }
.fpi-film-media::after { z-index: 0; }
/* Elementor nests the background video inside .e-con-inner: flatten the stacking so the scrim sits between video and text */
.fpi-film-media > .e-con-inner { position: static !important; z-index: auto !important; }
.fpi-film-media > .e-con-inner > .elementor-element { position: relative; z-index: 2; }
.fpi-film-media .elementor-background-video-container { position: absolute !important; inset: 0; z-index: -1 !important; }
.fpi-film-media.is-scrub .elementor-background-video-container { display: none !important; }
html.fpi-js:not(.fpi-no-motion):not(.fpi-motion-fallback) body:not(.elementor-editor-active) .fpi-film-media.is-scrub .fpi-film-in { opacity: 0; }

.fpi-film-skip { position: absolute; right: 32px; bottom: 28px; z-index: 3; padding: 10px 18px; border: 1px solid rgba(158,195,221,.55); border-radius: 999px; background: rgba(7,13,20,.45); color: #EEF3F7; font: 600 12px/1 Archivo, sans-serif; letter-spacing: 1.4px; text-transform: uppercase; cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background .3s, color .3s; }
.fpi-film-skip:hover, .fpi-film-skip:focus-visible { background: #EEF3F7; color: #070D14; }
button.fpi-film-skip, button.fpi-film-skip:focus { background: rgba(7,13,20,.45) !important; color: #EEF3F7 !important; border: 1px solid rgba(158,195,221,.55) !important; border-radius: 2px !important; padding: 10px 18px !important; font: 600 12px/1 Archivo, sans-serif !important; letter-spacing: 1.4px !important; box-shadow: none !important; }
button.fpi-film-skip:hover, button.fpi-film-skip:focus-visible { background: #EEF3F7 !important; color: #070D14 !important; }

/* Client names in the trust band */
.fpi-trust .fpi-client .elementor-heading-title { white-space: nowrap; letter-spacing: -0.3px; }

/* ---------- Video modal ---------- */
.fpi-modal { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 4vw; background: rgba(7,13,20,.92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); opacity: 0; transition: opacity .4s var(--fpi-ease); }
.fpi-modal.is-open { opacity: 1; }
.fpi-modal-box { width: min(1200px, 100%); aspect-ratio: 16 / 9; transform: scale(.94); transition: transform .5s var(--fpi-ease); box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); }
.fpi-modal.is-open .fpi-modal-box { transform: scale(1); }
.fpi-modal video { width: 100%; height: 100%; display: block; background: #000; border-radius: 4px; }
.fpi-modal-close { position: absolute; top: 20px; right: 24px; width: 48px; height: 48px; border-radius: 999px; border: 1px solid rgba(158,195,221,.5); background: transparent; color: #EEF3F7; font-size: 28px; line-height: 1; cursor: pointer; }
.fpi-modal-close:hover, .fpi-modal-close:focus-visible { background: #EEF3F7; color: #070D14; }

/* ---------- Responsive polish ---------- */
.elementor-button { white-space: nowrap; }
@media (max-width: 1024px) {
  /* Header: logo left, CTA + burger grouped on the right */
  .fpi-header .elementor-widget-button { margin-left: auto; }
  .fpi-header .elementor-widget-nav-menu { order: 3; }
}
@media (max-width: 400px) {
  .elementor-button { padding-left: 22px !important; padding-right: 22px !important; }
}

/* ---------- Map ---------- */
.fpi-map iframe { filter: grayscale(.6) contrast(1.05); }

/* ---------- Helpers ---------- */
@media (max-width: 767px) { .fpi-hide-mobile { display: none !important; } }
.fpi-hscroll-progress { height: 2px; transform-origin: 0 50%; }
.e-con.fpi-tile, .e-con.fpi-scrim { overflow: hidden; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .fpi-stack-item { position: relative !important; top: auto; }
}