:root{--fanola-navy:#081421;--fanola-blue:#0b5cff;--fanola-blue-light:#4da3ff;--fanola-white:#fff;--fanola-bg:#f5f7fa;--fanola-text:#101820;--fanola-muted:#6b7280;--fanola-border:rgba(16,24,32,.1);--fanola-transition:260ms cubic-bezier(.22,1,.36,1)}
body.fanola-site{background:#fff;color:#101820}
.template-index #shopify-section-header .fanola-header-wrapper{background:#071321;border-bottom-color:#ffffff17;backdrop-filter:none}
.template-index #shopify-section-header .fanola-header__layout{min-height:88px;gap:24px}
.template-index #shopify-section-header .site-header{padding-block:0}
.template-index #shopify-section-header .site-header__logo{margin-block:0}
.template-index #shopify-section-header .site-nav__link{font-size:15px;padding-block:16px}
.template-index #shopify-section-header .fanola-header__page-width{max-width:1600px;padding-inline:clamp(24px,4vw,72px)}
.fm{display:block;position:relative;isolation:isolate;overflow:clip;background:var(--fm-bg,#071321);color:#f3f7fd;font-family:var(--typeBasePrimary),var(--typeBaseFallback);--fm-progress:0}
.fm *{box-sizing:border-box}
.fm-stage{position:relative}
.fm-scene{position:relative;min-height:calc(100svh - 89px);padding:clamp(36px,5vh,72px) 4vw 100px;isolation:isolate;display:flex;align-items:center;overflow:hidden;background:var(--fm-bg,#071321)}
.fm-visual{position:absolute;inset:0 0 0 34%;z-index:-1;overflow:hidden;contain:paint}
.fm-visual img,.fm-visual picture{display:block;width:100%;height:100%}
.fm-visual img{object-fit:cover;object-position:55% 45%;transform-origin:center}
.fm-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--fm-bg,#071321),#071321d9 10%,transparent 44%),linear-gradient(0deg,var(--fm-bg,#071321),transparent 40%);pointer-events:none}
.fm-scene--executive .fm-visual,.fm-scene--portrait .fm-visual{left:43%}
.fm-scene--executive .fm-visual img,.fm-scene--portrait .fm-visual img{object-position:center 26%}
.fm-scene--satellite .fm-visual{left:50%;display:flex;align-items:center;justify-content:center}
.fm-scene--satellite .fm-visual img{width:94%;height:auto;max-height:88%;object-fit:contain;transform:perspective(1100px) rotateX(var(--sat-x,0deg)) rotateY(var(--sat-y,0deg));filter:brightness(var(--sat-light,1));mask-image:radial-gradient(ellipse farthest-corner,#000 68%,transparent)}
.fm-scene--satellite .fm-visual::after{display:none}
.fm-copy{width:47%;max-width:680px;position:relative;z-index:2}
.fm-eyebrow{font-size:11px;line-height:1.6;letter-spacing:.14em;text-transform:uppercase;color:#b4c9de;margin:0 0 32px}
.fm-eyebrow::before{content:'';width:24px;height:1px;background:#9bcbed;display:inline-block;margin-right:12px;vertical-align:middle}
.fm-profession{font-size:15px;line-height:1.5;color:#c1d2e4;margin:0 0 18px}
.fm h1,.fm h2{font-family:var(--typeBasePrimary),var(--typeBaseFallback);font-weight:400;letter-spacing:-.045em;text-transform:none;word-break:normal;overflow-wrap:normal}
.fm h1{font-size:clamp(64px,6.5vw,112px);line-height:.98;max-width:8ch;margin:0 0 30px}
.fm h2{font-size:clamp(36px,3.7vw,60px);line-height:1.12;margin:0 0 28px;text-wrap:balance}
.fm-claim{font-size:clamp(22px,2vw,29px);line-height:1.4;max-width:26ch;margin:0 0 24px}
.fm-body{font-size:17px;line-height:1.65;color:#b7c9dc;max-width:48ch}
.fm-body p{margin:0 0 18px}.fm-body strong{color:#e4eef9;font-weight:400}
.fm-cta{display:inline-flex;align-items:center;gap:32px;background:#e5f0fa;color:#0b1b2e;border:1px solid #e5f0fa;padding:16px 22px;margin-top:20px;min-height:52px;font:inherit;font-size:14px;text-decoration:none;cursor:pointer;transition:background .25s,transform .25s}
.fm-cta:hover{color:#0b1b2e;background:#c6e4fc;transform:translateY(-2px)}
.fm-start{display:none}.fm.is-enhanced .fm-start{display:inline-flex}
.fm a:focus-visible,.fm button:focus-visible{outline:2px solid #b6e0ff;outline-offset:5px}
.fm.is-pinned .fm-stage{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:minmax(0,1fr)}
.fm.is-pinned .fm-scene{grid-area:1/1;height:100svh;min-height:0;opacity:var(--scene-opacity,0);visibility:hidden;pointer-events:none}
.fm.is-pinned .fm-scene.is-active,.fm.is-pinned .fm-scene.is-leaving{visibility:visible}
.fm.is-pinned .fm-scene.is-active{pointer-events:auto}
.fm.is-pinned .fm-copy{transform:translateY(calc((1 - var(--scene-opacity,0))*14px))}
.fm.is-pinned .fm-scene:not(.fm-scene--satellite) .fm-visual img{transform:scale(calc(1.018 - var(--scene-opacity,0)*.018))}
.fm-controls{position:absolute;bottom:24px;left:4vw;right:4vw;z-index:4;display:flex;align-items:center;gap:20px;min-height:44px}
.fm-controls[hidden]{display:none}
.fm-controls button{font:inherit;font-size:13px;color:#bdd3e7;background:transparent;border:0;cursor:pointer;min-height:44px;min-width:44px}
.fm-progress{width:90px;height:1px;background:#3c5268}.fm-progress i{display:block;height:1px;background:#c3e7ff;transform-origin:left;transform:scaleX(var(--fm-progress))}
.fm-hint{font-size:11px;color:#a5bdd4;letter-spacing:.03em}.fm-exit{margin-left:auto}
.fm-end{height:0;outline:none}
@media(max-width:999px){
 .template-index #shopify-section-header .fanola-header__layout{min-height:72px}
 .fm-scene{min-height:0;display:block;padding:380px 24px 44px}
 .fm-visual,.fm-scene--executive .fm-visual,.fm-scene--portrait .fm-visual{inset:0 0 auto;height:590px}
 .fm-visual img{object-position:center 25%}
 .fm-visual::after{background:linear-gradient(0deg,var(--fm-bg,#071321) 1%,#071321d9 27%,transparent 78%)}
 .fm-copy{width:100%;max-width:650px}
 .fm h1{font-size:clamp(60px,15vw,88px)}.fm h2{font-size:clamp(32px,7vw,46px)}
 .fm-eyebrow{font-size:10px;margin-bottom:20px}.fm-body{font-size:16px}.fm-claim{font-size:22px}
 .fm-scene--satellite{padding-top:340px}
 .fm-scene--satellite .fm-visual{inset:0 0 auto;height:360px}
 .fm-scene--satellite .fm-visual img{height:100%;width:100%}
 .fm-controls{display:none!important}
 .fm:not(.is-pinned) .fm-scene{border-bottom:1px solid #ffffff0d}
}
@media(prefers-reduced-motion:reduce){.fm *{transition:none!important;animation:none!important;scroll-behavior:auto!important}.fm .fm-visual img,.fm .fm-cta{transform:none!important}}
/* True 3D stays inside the satellite scene; no photographic plane or star background. */
.fm-model{position:absolute;inset:0;overflow:hidden;contain:paint;pointer-events:none}
.fm-model canvas{display:block;width:100%;height:100%;max-width:100%}
.fm-scene--satellite .fm-satellite-fallback{mask-image:none;filter:none;width:96%;height:auto;max-height:90%}
.fm-visual.has-model .fm-satellite-fallback{visibility:hidden}
@media(max-width:999px){
 .fm-scene{padding:40px 24px;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(130px,.85fr);gap:18px;align-items:center}
 .fm-copy{width:auto;max-width:none;grid-column:1;grid-row:1}
 .fm-visual,.fm-scene--executive .fm-visual,.fm-scene--portrait .fm-visual,.fm-scene--satellite .fm-visual{position:relative;inset:auto;grid-column:2;grid-row:1;width:100%;height:340px;z-index:0;border-radius:2px}
 .fm-visual::after{background:linear-gradient(0deg,var(--fm-bg,#071321),transparent 22%)}
 .fm-visual img{object-position:55% 40%}
 .fm h1{font-size:clamp(38px,7.8vw,68px);max-width:8ch;line-height:1.02;margin-bottom:20px}
 .fm h2{font-size:clamp(26px,5vw,40px);line-height:1.15;margin-bottom:20px}
 .fm-profession{font-size:12px;margin-bottom:14px}.fm-eyebrow{font-size:9px;letter-spacing:.08em;margin-bottom:18px}.fm-eyebrow::before{width:14px;margin-right:6px}
 .fm-body{font-size:14px;line-height:1.6}.fm-claim{font-size:17px;line-height:1.4;margin-bottom:18px}.fm-cta{font-size:12px;padding:12px;gap:12px;min-height:44px}
 .fm-scene--satellite{padding-top:40px}.fm-scene--satellite .fm-visual{height:260px;overflow:hidden}
}
@media(max-width:479px){
 .fm-scene{grid-template-columns:minmax(0,1fr);padding:24px;gap:20px}
 .fm-visual,.fm-scene--executive .fm-visual,.fm-scene--portrait .fm-visual,.fm-scene--satellite .fm-visual{grid-column:1;grid-row:1;height:210px}
 .fm-copy{grid-column:1;grid-row:2}
 .fm-visual img{object-position:50% 33%}
 .fm h1{font-size:54px;max-width:none;margin-bottom:18px}.fm h2{font-size:30px}.fm-claim{font-size:19px}
 .fm-profession{font-size:13px}.fm-body{font-size:15px}.fm-eyebrow{font-size:9px}
 .fm-scene--satellite .fm-visual{height:220px;overflow:hidden}
}
/* Ambient layers remain behind copy and never receive pointer events. */
.fm-atmosphere{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden;opacity:.45;contain:paint}
.fm-atmosphere::before{content:'';position:absolute;inset:-15%;background:radial-gradient(ellipse at 75% 40%,#22769240,transparent 42%),radial-gradient(ellipse at 30% 70%,#265b9e30,transparent 46%);animation:fm-aurora 18s ease-in-out infinite alternate;animation-play-state:paused}
.fm-stars{position:absolute;inset:-10%;background-image:radial-gradient(circle,#b5dfffb0 1px,transparent 1.8px),radial-gradient(circle,#7baad680 .7px,transparent 1.4px);background-size:137px 157px,89px 113px;background-position:13px 27px,41px 67px;mask-image:linear-gradient(90deg,transparent,#000 60%);animation:fm-drift 24s linear infinite alternate;animation-play-state:paused}
.fm-stars--far{opacity:.35;background-size:211px 193px,167px 149px;animation-duration:38s;transform:scale(1.12)}
.fm-scene--satellite .fm-atmosphere{opacity:.85}
.fm.is-running:not(.is-paused) .fm-scene.is-active .fm-atmosphere::before,.fm.is-running:not(.is-paused) .fm-scene.is-active .fm-stars{animation-play-state:running}
.fm-motion{position:absolute;right:4vw;top:24px;z-index:5;color:#bdd3e7;background:#071321a6;border:1px solid #b4d6ef40;border-radius:20px;padding:10px 16px;font:inherit;font-size:12px;cursor:pointer;min-height:44px}
.fm-motion[hidden]{display:none}
.fm-scene--executive .fm-visual img{object-position:center 28%}
@keyframes fm-aurora{to{transform:translate3d(-4%,3%,0) scale(1.08)}}
@keyframes fm-drift{to{transform:translate3d(-22px,28px,0)}}
@media(max-width:999px){.fm-atmosphere{opacity:.25}.fm-motion{display:none}.fm-stars,.fm-atmosphere::before{animation:none!important}}
@media(prefers-reduced-motion:reduce){.fm-stars,.fm-atmosphere::before{animation:none!important}.fm-motion{display:none}}

/* FANOLA: background-only treatment, scoped to the connectivity scene.
   No typography, content, layout, canvas or responsive geometry changes. */
.fm .fm-scene--satellite{
 background-color:#061526;
 background-image:linear-gradient(90deg,#061321 0%,rgba(6,19,33,.98) 25%,rgba(6,19,33,.76) 44%,rgba(6,19,33,.12) 73%,rgba(6,19,33,.45) 100%),radial-gradient(ellipse at 79% 108%,rgba(37,101,153,.28),transparent 55%),linear-gradient(155deg,#06111f 15%,#0b2941 62%,#061321 100%);
}
.fm .fm-scene--satellite .fm-atmosphere{opacity:.72}
.fm .fm-scene--satellite .fm-atmosphere::before{
 inset:-8%;
 background:linear-gradient(104deg,transparent 49%,rgba(52,127,188,.025) 57%,rgba(99,178,221,.16) 66%,rgba(53,121,171,.055) 71%,transparent 77%),radial-gradient(ellipse 45% 8% at 77% 83%,rgba(117,171,202,.14),transparent 80%),radial-gradient(ellipse 40% 5% at 67% 88%,rgba(90,151,189,.1),transparent 85%);
 mask-image:linear-gradient(90deg,transparent 30%,#000 61%);
 animation-name:fanola-connectivity-light;animation-duration:24s;
}
.fm .fm-scene--satellite .fm-atmosphere::after{
 content:'';position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(0deg,rgba(5,17,30,.9),transparent 30%),radial-gradient(ellipse 55% 6% at 85% 81%,rgba(95,155,188,.09),transparent 80%);
}
.fm .fm-scene--satellite .fm-stars{
 background-image:radial-gradient(circle at 14% 19%,#b7d7ed99 0 .65px,transparent 1.5px),radial-gradient(circle at 31% 69%,#8cafcf88 0 .7px,transparent 1.6px),radial-gradient(circle at 67% 28%,#b8ddee99 0 .8px,transparent 1.6px),radial-gradient(circle at 86% 61%,#91bada88 0 .6px,transparent 1.4px),radial-gradient(circle at 48% 91%,#8cafcf66 0 .6px,transparent 1.4px);
 background-size:331px 283px,397px 419px,271px 367px,457px 311px,359px 467px;
 background-position:0 0,41px 67px,113px 29px,19px 137px,71px 31px;
 mask-image:linear-gradient(90deg,transparent 18%,rgba(0,0,0,.15) 38%,#000 69%);
 opacity:.6;
}
.fm .fm-scene--satellite .fm-stars--far{opacity:.22}
@keyframes fanola-connectivity-light{to{transform:translate3d(-2%,1%,0) scale(1.025)}}
@media(max-width:999px){
 .fm .fm-scene--satellite{background-image:linear-gradient(180deg,rgba(6,19,33,.1),#061321 65%),radial-gradient(ellipse at 85% 13%,#123751,transparent 60%)}
 .fm .fm-scene--satellite .fm-atmosphere{opacity:.42}
 .fm .fm-scene--satellite .fm-atmosphere::before{mask-image:linear-gradient(#000,transparent 68%)}
 .fm .fm-scene--satellite .fm-stars{mask-image:linear-gradient(#000,transparent 75%)}
}

/* The former satellite scene now contains the supplied cinematic portal video. */
.fm .fm-scene--satellite{background:#061526}
.fm .fm-scene--satellite .fm-visual{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;display:block;border-radius:0;background:#061526;z-index:-1}
.fm-portal-video{position:absolute;left:50%;top:0;width:max(100%,calc(100svh * 1.41));height:100%;max-width:none;object-fit:cover;object-position:center;transform:translateX(-50%);mix-blend-mode:screen;pointer-events:none}
.fm .fm-scene--satellite .fm-visual::after{display:block;content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(6,21,38,.94),rgba(6,21,38,.8) 32%,rgba(6,21,38,.24) 61%,rgba(6,21,38,.1)),linear-gradient(0deg,#061526,rgba(6,21,38,.78) 12%,transparent 36%,rgba(6,21,38,.12) 80%,rgba(6,21,38,.45))}
.fm.is-pinned .fm-scene--satellite .fm-portal-video{transform:translateX(-50%) scale(calc(1.035 - var(--scene-opacity,0)*.035))}
@media(max-width:999px){.fm .fm-scene--satellite .fm-visual{grid-column:auto;grid-row:auto}.fm .fm-scene--satellite .fm-copy{grid-column:1/-1;grid-row:1}.fm-portal-video{width:100%;object-position:43% center}.fm .fm-scene--satellite .fm-visual::after{background:linear-gradient(90deg,rgba(6,21,38,.9),rgba(6,21,38,.65) 42%,rgba(6,21,38,.2)),linear-gradient(0deg,#061526,rgba(6,21,38,.4) 45%,rgba(6,21,38,.45))}}
@media(prefers-reduced-motion:reduce){.fm.is-pinned .fm-scene--satellite .fm-portal-video{transform:translateX(-50%)}}
