/* All five heroes share one typography scale. No host elements are reset. */
.znh-hero{--znh-blue:#0062ff;--znh-cyan:#69d9ff;--znh-navy:#031529;--znh-h1:clamp(34px,3.65vw,56px);--znh-body:clamp(16px,1.22vw,18px);--znh-x:0px;--znh-y:0px;position:relative;isolation:isolate;display:grid;align-items:center;width:100%;min-height:clamp(550px,43.5vw,660px);height:auto;background:var(--znh-navy);color:#fff;overflow:clip;text-align:left;font:400 var(--znh-body)/1.55 Barlow,Arial,sans-serif;color-scheme:dark}
.znh-hero,.znh-hero *,.znh-hero *::before,.znh-hero *::after{box-sizing:border-box}
.znh-hero [hidden]{display:none!important}
.znh-hero :is(h1,p,ul){padding:0;margin:0}
.znh-inner{position:relative;width:100%;max-width:1600px;margin:auto;padding:48px clamp(24px,4.4vw,80px);z-index:2;pointer-events:none}
.znh-content{width:44%;max-width:590px;pointer-events:auto}
.znh-hero .znh-eyebrow{font:600 var(--ds-eyebrow)/1.25 var(--ds-ui);color:#8ce0ff;letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;}
.znh-hero h1{font:400 var(--ds-hero)/1.05 var(--ds-display);letter-spacing:0;text-transform:uppercase;color:#fff;margin:0 0 22px;text-wrap:balance;overflow-wrap:normal;}
.znh-hero h1 em{font:inherit;color:#0875ff}
.znh-hero .znh-copy{font:400 var(--ds-lead)/1.5 var(--ds-body);color:#e5edf9;max-width:55ch;margin:0 0 24px;}
.znh-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:22px}
.znh-hero .znh-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:48px;max-width:100%;padding:13px 20px;background:var(--znh-blue);border:1px solid #37adff;border-radius:6px;color:#fff;text-decoration:none;font:600 15px/1.35 Barlow,Arial,sans-serif;box-shadow:inset 0 1px 0 #a6eaff55,0 0 14px #0062ff35;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;touch-action:manipulation;overflow:hidden}
.znh-button::before{content:"";position:absolute;inset:-70% auto -70% -35%;width:24%;background:linear-gradient(90deg,transparent,#b4efff45,transparent);transform:skewX(-20deg);transition:left .45s ease;pointer-events:none}
.znh-button:hover::before{left:115%}
.znh-button svg,.znh-contact-card span svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .22s}
.znh-button:hover svg{transform:translateX(3px)}
.znh-hero .znh-button.znh-secondary{background:#031529cc;border-color:#40b7faaa;box-shadow:none}
.znh-button:hover{transform:translateY(-2px);box-shadow:0 0 22px #0079ff77;border-color:#a5edff}
.znh-button:active{transform:translateY(1px)}
.znh-hero :is(button,a,[tabindex]):focus-visible{outline:3px solid #a6eaff;outline-offset:5px}
.znh-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none}
.znh-tile{position:relative;min-width:0;min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:12px 10px;border:1px solid #4d9ed07a;border-radius:9px;background:linear-gradient(135deg,#09213be6,#021123f5);box-shadow:inset 0 1px 0 #bceaff1a,0 8px 14px #0002;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.znh-tile span{font:600 14px/1.35 Barlow,Arial,sans-serif;max-width:22ch}
.znh-icon{display:block;flex:none;width:52px;height:52px;overflow:hidden;mix-blend-mode:screen;mask-image:radial-gradient(ellipse,#000 42%,#000e 59%,transparent 74%);transition:transform .25s ease,filter .25s ease}
.znh-tile:hover,.znh-tile:focus-visible,.znh-tile[data-touched]{transform:perspective(700px) translateY(-4px) rotateX(3deg);border-color:#81e6ff;box-shadow:0 0 16px #007aff7a,inset 0 0 10px #0062ff25}
.znh-tile:hover .znh-icon,.znh-tile:focus-visible .znh-icon{transform:translateY(-2px);filter:brightness(1.14)}
.znh-stage{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.znh-scene{position:absolute;inset:auto 0 0 auto;height:100%;width:auto;aspect-ratio:1680/936;transform:translate(var(--znh-x),var(--znh-y));transition:transform .65s ease;transform-origin:70% 50%;mask-image:linear-gradient(90deg,transparent,#000 14%)}
.znh-scene picture,.znh-scene img{position:absolute;inset:0;width:100%;height:100%;display:block}
.znh-scene img{object-fit:fill;object-position:center;max-width:none}
.znh-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#031529b3,transparent 58%);pointer-events:none}
.znh-trace{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 3px #20baff);opacity:.5}
.znh-trace path{fill:none;stroke:#a2ecff;stroke-width:.12;stroke-dasharray:2 20;animation:znh-current 9s linear infinite}
.znh-spotlight{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 24%,#158cff27,transparent 42%);mix-blend-mode:screen;animation:znh-light 6s ease-in-out infinite}
.znh-contact .znh-content{width:30%;max-width:410px}
.znh-contact-cards{position:absolute;inset:auto 0 0 auto;height:100%;width:auto;aspect-ratio:1680/936;z-index:3;pointer-events:none}
.znh-contact-card{position:absolute;pointer-events:auto;border:1px solid #64ceff;background:linear-gradient(135deg,#0a294aec,#031426f2);border-radius:7px;color:white;padding:12px;box-shadow:0 0 14px #007bff55,inset 0 1px 0 #caf3ff33;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:transform .25s,box-shadow .25s;touch-action:manipulation;transform:perspective(900px) rotateY(-8deg)}
.znh-contact-card .znh-icon{width:clamp(45px,6vw,100px);height:clamp(45px,6vw,100px)}
.znh-contact-card span{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;font:600 14px/1.3 Barlow,Arial,sans-serif}
.znh-contact-card:hover,.znh-contact-card:focus-visible{transform:perspective(900px) rotateY(0) translateY(-4px);box-shadow:0 0 25px #007bff99}
.znh-card-0{left:36.8%;top:10%;width:13.5%;height:25%}
.znh-card-1{left:36%;top:38%;width:13.5%;height:24%}
.znh-card-2{left:82%;top:8%;width:15.5%;height:35%}
.znh-card-3{left:81.5%;top:47%;width:7.4%;height:20%}
.znh-card-4{left:90%;top:47%;width:7.4%;height:20%}
.znh-card-3 .znh-icon,.znh-card-4 .znh-icon{width:48px;height:48px}
.znh-card-3 span,.znh-card-4 span{font-size:12px;gap:3px}
.znh-motion{position:absolute;bottom:10px;right:16px;z-index:5;padding:7px 10px;min-height:32px;background:#031529dd;border:1px solid #579ed355;border-radius:5px;color:#bfd7ee;font:600 11px/1.4 Barlow,Arial,sans-serif;cursor:pointer}
.znh-status{font:400 14px/1.45 Barlow,Arial,sans-serif;margin-top:14px!important}
.znh-hero[data-paused] *,.znh-hero[data-offscreen] *,.znh-hero[data-hidden] *{animation-play-state:paused!important}
.znh-hero[data-paused] .znh-scene{transform:none;transition:none}
.znh-hero[data-paused] :is(.znh-button,.znh-tile,.znh-icon,.znh-contact-card){transition:none;transform:none}
@keyframes znh-current{to{stroke-dashoffset:-88}}
@keyframes znh-light{0%,100%{opacity:.3}50%{opacity:.85}}
@media(min-width:1601px){.znh-stage{max-width:1680px;left:50%;transform:translateX(-50%);width:100%}.znh-contact-cards{max-width:1680px;margin:auto}}
@media(min-width:901px) and (max-width:1150px){.znh-content{width:47%}.znh-hero{--znh-h1:39px;min-height:570px}.znh-inner{padding:38px 28px}.znh-actions{gap:9px}.znh-hero .znh-button{font-size:14px;padding:12px 14px;gap:12px}.znh-tile{padding:10px 7px;min-height:110px}.znh-tile span{font-size:13px}.znh-benefits{gap:9px}.znh-contact .znh-content{width:31%}.znh-contact-card span{font-size:12px}.znh-card-3 span svg,.znh-card-4 span svg{display:none}}
/* The scene keeps a fixed aspect ratio on touch layouts; copy has its own flow. */
@media(max-width:900px){
 .znh-hero{display:flex;flex-direction:column;min-height:0;--znh-h1:clamp(32px,5.6vw,44px);--znh-body:16px;overflow:hidden}
 .znh-stage{position:relative;inset:auto;width:100%;height:clamp(225px,48vw,390px);order:0;flex:none}
 .znh-scene{width:auto;left:auto;right:0;height:100%;aspect-ratio:1680/936;transform:none!important;transition:none}
 .znh-scene img{object-fit:fill}
 .znh-stage::after{background:linear-gradient(0deg,#031529,transparent 22%)}
 .znh-inner{order:1;padding:6px clamp(20px,5vw,40px) 48px}
 .znh-content,.znh-contact .znh-content{width:100%;max-width:680px;margin:auto}
 .znh-hero h1{margin-bottom:16px;text-wrap:balance}
 .znh-hero h1 br{display:none}.znh-hero h1 em{display:block}
 .znh-hero .znh-eyebrow{margin-bottom:10px;font-size:var(--ds-eyebrow);}
 .znh-hero .znh-copy{margin-bottom:20px}
 .znh-actions{margin-bottom:18px;gap:10px}
 .znh-hero .znh-button{font-size:14px;padding:12px 16px;gap:14px;min-height:46px}
 .znh-tile{min-height:105px;padding:10px 7px;gap:8px}.znh-tile span{font-size:13px}
 .znh-benefits{gap:8px}.znh-icon{width:42px;height:42px}
 .znh-contact-cards{position:relative;inset:auto;height:auto;aspect-ratio:auto;order:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;padding:0 clamp(20px,5vw,40px) 52px;margin-top:-28px;max-width:760px}
 .znh-contact-card{position:relative;inset:auto;width:auto;height:auto;min-height:110px;padding:10px 8px;transform:none}
 .znh-contact-card .znh-icon{width:48px;height:48px}.znh-contact-card span{font-size:13px;justify-content:center;text-align:center}
 .znh-contact-card span svg{display:none}.znh-motion{bottom:9px}
}
@media(max-width:370px){.znh-inner{padding-left:18px;padding-right:18px}.znh-actions{display:grid;grid-template-columns:1fr}.znh-tile span{font-size:12px}.znh-benefits{gap:6px}.znh-tile{padding:10px 5px}.znh-contact-cards{padding-left:18px;padding-right:18px}.znh-contact-card span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.znh-hero *,.znh-hero *::before,.znh-hero *::after{animation:none!important;transition:none!important}.znh-scene,.znh-tile:hover,.znh-tile:focus-visible,.znh-button:hover,.znh-contact-card:hover{transform:none!important}.znh-motion{display:none}}