/* VISGENEER GROUP — FIVE NAVIGATION DIRECTIONS — interactive live prototypes.
   The site's approved CI palette and content remain unchanged.
   Try using ?nav=1 through ?nav=5 on any real site page. */

/* Shared interaction system */
.site-header{isolation:isolate; overflow:visible;}
.site-header .nav-inner{position:relative;}
.site-header .nav-business-group{position:relative;display:flex;align-items:center;align-self:stretch;}
.nav-business-group>.nav-business-anchor{display:inline-flex;align-items:center;height:100%;gap:7px;}
.nav-business-group>.nav-business-anchor::before{content:'';order:2;width:5px;height:5px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.58;transition:transform .25s;}
.nav-business-group:hover>.nav-business-anchor::before,.nav-business-group:focus-within>.nav-business-anchor::before{transform:translateY(1px) rotate(225deg);}
.nav-business-group>.nav-business-anchor[aria-current="page"]::after{bottom:25px;}
.nav-business-mega{position:absolute;top:calc(100% - 1px);left:-150px;width:min(680px,85vw);z-index:105;background:#fff;border:1px solid #e0e3e9;box-shadow:0 26px 54px rgba(8,22,47,.18);padding:25px 27px 27px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(9px);transition:opacity .23s ease,transform .3s cubic-bezier(.2,.8,.2,1),visibility .23s;color:#172740;}
.nav-business-group:hover .nav-business-mega,.nav-business-group:focus-within .nav-business-mega{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto;}
.nav-mega-head{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #e5e8ed;margin-bottom:14px;padding-bottom:15px;}
.nav-mega-head strong{font-size:11px;letter-spacing:.15em;color:#1d4892;}
.nav-mega-head small{font-size:10px;letter-spacing:.06em;color:#718099;}
.nav-mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.nav-business-mega .nav-mega-card{display:flex;flex-direction:column;gap:9px;min-height:145px;justify-content:space-between;padding:17px 14px;background:#f7f8fa;border:1px solid #e9ebee;text-decoration:none;white-space:normal;font-size:15px;color:#152947;transition:background .25s,color .25s,transform .25s,border-color .25s;line-height:1.5;font-weight:700;}
.nav-business-mega .nav-mega-card small{font-size:9px;line-height:1.5;letter-spacing:.08em;color:#62728b;font-weight:600;}
.nav-business-mega .nav-mega-card i{font-size:20px;line-height:1;font-style:normal;color:#c5a143;}
.nav-business-mega .nav-mega-card:hover,.nav-business-mega .nav-mega-card:focus-visible{transform:translateY(-4px);border-color:#c5a143;background:#eef3fb;outline:none;}
.nav-business-mega .nav-mega-all{display:inline-flex;align-items:center;gap:6px;color:#1d4892;font-size:12px;margin-top:18px;}
.site-header .nav-signature{display:none;}
/* Shared desktop nav hover animations, keyboard focus and contrast. */
.site-header .nav-links a:focus-visible,.site-header .nav-contact:focus-visible,.site-header .lang:focus-visible,.site-header .site-logo:focus-visible{outline:2px solid #C5A143;outline-offset:5px;}
.site-header .nav-links a{transition:color .22s ease,opacity .22s ease,transform .22s ease;}
.site-header .nav-links a:hover{transform:translateY(-2px);}
.site-header .nav-contact{transition:background .25s ease,color .25s ease,border-color .25s ease,box-shadow .3s,transform .3s;}
.site-header .nav-contact:hover{transform:translateY(-2px);}
.site-header .site-logo img{display:block;}
/* To accommodate the original 7 navigation destinations the signature changes at laptop widths. */
@media(max-width:1380px) and (min-width:1081px){.site-header .nav-signature{display:none!important}.site-header .nav-inner{width:calc(100% - 50px)}.site-header .nav-links{gap:clamp(11px,1.5vw,19px)}.site-header .nav-links a{font-size:11px;}}

/* 01 — Heritage Corporate | classic restrained corporate editorial */
html[data-nav-style="1"] .site-header{background:#fff;height:98px;border-bottom:1px solid #e9e6df;box-shadow:none;}
html[data-nav-style="1"] .site-header.scrolled{box-shadow:0 15px 33px rgba(15,31,52,.075);}
html[data-nav-style="1"] .site-header .nav-inner{width:min(calc(100% - 90px),1670px);gap:20px;}
html[data-nav-style="1"] .site-header .site-logo{width:225px;}
html[data-nav-style="1"] .site-header .nav-links{gap:clamp(13px,1.7vw,27px);}
html[data-nav-style="1"] .site-header .nav-links a{font-weight:700;font-size:13px;letter-spacing:.015em;}
html[data-nav-style="1"] .site-header .nav-links a[aria-current="page"]::after{height:3px;bottom:-12px;background:#c5a143;}
html[data-nav-style="1"] .site-header .nav-contact{padding:13px 20px;border:1px solid #11294b;border-radius:5px;color:#10264a;font-size:12px;letter-spacing:.035em;}
html[data-nav-style="1"] .site-header .nav-contact::after{content:'';font-size:17px;margin-left:14px;}
html[data-nav-style="1"] .site-header .nav-contact:hover{background:#0a1a39;color:#fff;}
html[data-nav-style="1"] .site-header .lang{font-size:12px;padding-left:18px;}

/* 02 — Scientific Editorial | functional two-storey navigation & scientific grid */
html[data-nav-style="2"] .site-header{background:#fff;height:139px;border-bottom:2px solid #c5a143;box-shadow:none;}
html[data-nav-style="2"] .site-header.scrolled{box-shadow:0 12px 30px rgba(11,37,79,.1);}
html[data-nav-style="2"] .site-header .nav-inner{display:grid;grid-template-columns:240px minmax(190px,1fr) auto;grid-template-rows:82px 55px;grid-template-areas:'logo signature utility' 'nav nav nav';column-gap:22px;width:min(calc(100% - 90px),1600px);}
html[data-nav-style="2"] .site-header .site-logo{grid-area:logo;width:215px;}
html[data-nav-style="2"] .site-header .nav-signature{display:flex;grid-area:signature;flex-direction:column;justify-content:center;gap:4px;color:#67748a;border-left:1px solid #cbd0d5;padding-left:19px;font-size:11px;letter-spacing:.035em;line-height:1.4;}
html[data-nav-style="2"] .site-header .nav-signature span:first-child{color:#1d4892;font-weight:700;}
html[data-nav-style="2"] .site-header .nav-links{grid-area:nav;justify-content:space-between;width:100%;border-top:1px solid #e6e7e9;gap:10px;align-self:stretch;}
html[data-nav-style="2"] .site-header .nav-links a{font-size:12px;color:#1e2d42;letter-spacing:.035em;}
html[data-nav-style="2"] .site-header .nav-links>a,.site-header .nav-links>.nav-business-group{min-width:0;}
html[data-nav-style="2"] .site-header .nav-links a[aria-current="page"]{color:#1d4892;}
html[data-nav-style="2"] .site-header .nav-links a[aria-current="page"]::after{bottom:11px;background:#C5A143;height:3px;}
html[data-nav-style="2"] .site-header .nav-utility{grid-area:utility;justify-self:end;margin-left:0;gap:18px;}
html[data-nav-style="2"] .site-header .nav-contact{border:1px solid #1d4892;color:#1d4892;padding:11px 22px;font-size:11px;}
html[data-nav-style="2"] .site-header .nav-contact::after{content:'';margin-left:11px;font-size:17px;}
html[data-nav-style="2"] .site-header .nav-contact:hover{background:#1d4892;color:#fff;}
html[data-nav-style="2"] .site-header .nav-business-mega{top:100%;}

/* 03 — Deep Navy | statement-level premium corporate identity */
html[data-nav-style="3"] .site-header{height:106px;background:radial-gradient(ellipse at 73% 0%,rgba(55,108,169,.22),transparent 58%),linear-gradient(117deg,#07182f,#0b2446 63%,#112f58);border-bottom:2px solid #C5A143;box-shadow:none;}
html[data-nav-style="3"] .site-header .nav-inner{width:min(calc(100% - 82px),1680px);gap:18px;}
html[data-nav-style="3"] .site-header .site-logo{background:rgba(255,255,255,.99);padding:7px 12px;width:235px;border-radius:4px;box-shadow:0 1px 18px rgba(0,0,0,.1);}
html[data-nav-style="3"] .site-header .nav-links{gap:clamp(10px,1.3vw,22px);}
html[data-nav-style="3"] .site-header .nav-links a{color:#f6f7fa;font-size:13px;letter-spacing:.035em;}
html[data-nav-style="3"] .site-header .nav-links a:hover,html[data-nav-style="3"] .site-header .nav-links a[aria-current="page"]{color:#efd081;}
html[data-nav-style="3"] .site-header .nav-links a[aria-current="page"]::after{background:#d0a949;height:3px;bottom:-15px;box-shadow:0 0 10px rgba(227,180,75,.45);}
html[data-nav-style="3"] .site-header .nav-contact{border:1px solid #C5A143;color:#E4BD61;padding:14px 21px;letter-spacing:.04em;font-size:12px;}
html[data-nav-style="3"] .site-header .nav-contact::after{content:'';font-size:19px;margin-left:13px;}
html[data-nav-style="3"] .site-header .nav-contact:hover{color:#0a1a39;background:#C5A143;box-shadow:0 4px 18px rgba(197,161,67,.25);}
html[data-nav-style="3"] .site-header .lang{color:#f4f5f7;border-left-color:#6480a9;}
html[data-nav-style="3"] .site-header .nav-business-group>.nav-business-anchor::before{opacity:.9;}
html[data-nav-style="3"] .site-header .nav-business-mega{box-shadow:0 28px 58px rgba(0,0,0,.28);}

/* 04 — Floating Glass | restrained transparent capsule hovering on content */
html[data-nav-style="4"] .site-header{height:94px;position:sticky;top:15px;width:min(calc(100% - 44px),1650px);margin:19px auto 20px;background:rgba(255,255,255,.83);border:1px solid rgba(255,255,255,.8);border-radius:24px;box-shadow:0 19px 48px rgba(11,29,58,.15);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);}
html[data-nav-style="4"] .site-header.scrolled{background:rgba(255,255,255,.92);box-shadow:0 16px 38px rgba(17,34,59,.15);}
html[data-nav-style="4"] .site-header .nav-inner{width:calc(100% - 58px);gap:16px;}
html[data-nav-style="4"] .site-header .site-logo{width:225px;}
html[data-nav-style="4"] .site-header .nav-links{gap:clamp(11px,1.4vw,21px);}
html[data-nav-style="4"] .site-header .nav-links a{font-size:13px;color:#14243c;}
html[data-nav-style="4"] .site-header .nav-links a[aria-current="page"]::after{background:#C5A143;height:3px;bottom:-13px;}
html[data-nav-style="4"] .site-header .nav-contact{background:linear-gradient(105deg,#cba94d,#b68c2d);border:1px solid #be993f;border-radius:14px;color:#fff;padding:14px 19px;font-size:12px;box-shadow:0 6px 16px rgba(150,117,43,.16);}
html[data-nav-style="4"] .site-header .nav-contact::after{content:'';margin-left:12px;font-size:18px;}
html[data-nav-style="4"] .site-header .nav-contact:hover{background:#0b2446;color:#fff;border-color:#0b2446;}
html[data-nav-style="4"] .site-header .nav-business-mega{border-radius:14px;overflow:hidden;}
html[data-nav-style="4"] .mobile-menu{border-radius:0 0 22px 22px;}

/* 05 — Tech Precision | clean laboratory wayfinding with golden circuitry */
html[data-nav-style="5"] .site-header{height:103px;background:linear-gradient(114deg,#fff 0%,#fff 65%,#f0f5fc 65%,#e6effc 100%);border-bottom:2px solid transparent;border-image:linear-gradient(90deg,#C5A143,#1D4892 63%,#C5A143) 1;box-shadow:0 9px 30px rgba(17,36,70,.055);}
html[data-nav-style="5"] .site-header::before{content:'';position:absolute;right:0;top:0;width:29%;height:100%;background:repeating-radial-gradient(circle at 80% 22%,transparent 0 20px,rgba(29,72,146,.085) 21px 22px,transparent 23px 40px);pointer-events:none;opacity:.76;}
html[data-nav-style="5"] .site-header .nav-inner{width:min(calc(100% - 70px),1680px);gap:15px;}
html[data-nav-style="5"] .site-header .site-logo{width:210px;}
html[data-nav-style="5"] .site-header .nav-signature{display:flex;flex-direction:column;gap:3px;justify-content:center;border-left:1px solid #c8ced6;padding-left:13px;font-size:9px;color:#8792a1;letter-spacing:.04em;line-height:1.4;max-width:190px;}
html[data-nav-style="5"] .site-header .nav-links{gap:0;}
html[data-nav-style="5"] .site-header .nav-links>a,html[data-nav-style="5"] .site-header .nav-business-group{padding:0 clamp(8px,1vw,16px);border-right:1px solid rgba(60,86,134,.21);}
html[data-nav-style="5"] .site-header .nav-links>a:last-child{border-right:0;}
html[data-nav-style="5"] .site-header .nav-links a{font-size:12px;font-weight:700;color:#122544;}
html[data-nav-style="5"] .site-header .nav-links a[aria-current="page"]{color:#1d4892;}
html[data-nav-style="5"] .site-header .nav-links a[aria-current="page"]::after{bottom:-13px;background:#c5a143;height:3px;}
html[data-nav-style="5"] .site-header .nav-contact{background:#0d2c61;color:#fff;border:2px solid #c5a143;border-radius:5px;outline:1px solid #183a6e;outline-offset:2px;font-size:12px;padding:12px 15px;box-shadow:0 3px 12px rgba(9,44,101,.14);}
html[data-nav-style="5"] .site-header .nav-contact::after{content:'';font-size:19px;margin-left:12px;color:#e3c67d;}
html[data-nav-style="5"] .site-header .nav-contact:hover{background:#1d4892;}
html[data-nav-style="5"] .site-header .lang{color:#182c52;}
html[data-nav-style="5"] .nav-business-mega{border-top:3px solid #C5A143;}

/* Mobile: retain approved 3-line-to-X animation and full-screen route flow on all five. */
@media(max-width:1380px) and (min-width:1081px){
 html[data-nav-style="1"] .site-header .nav-inner,html[data-nav-style="3"] .site-header .nav-inner,html[data-nav-style="5"] .site-header .nav-inner{width:calc(100% - 48px);gap:13px;}
 html[data-nav-style="1"] .site-header .site-logo,html[data-nav-style="3"] .site-header .site-logo,html[data-nav-style="4"] .site-header .site-logo,html[data-nav-style="5"] .site-header .site-logo{width:190px;}
 html[data-nav-style="2"] .site-header .nav-inner{width:calc(100% - 60px);grid-template-columns:220px 1fr auto;}
 html[data-nav-style="5"] .site-header .nav-links>a,html[data-nav-style="5"] .site-header .nav-links .nav-business-group{padding:0 8px;}
}
@media(max-width:1080px){
 html[data-nav-style] .site-header{height:var(--header-h);top:0;width:100%;margin:0;border-radius:0;border-left:0;border-right:0;}
 html[data-nav-style] .site-header .nav-inner{display:flex;width:calc(100% - 46px);height:100%;gap:10px;}
 html[data-nav-style] .site-header .site-logo{width:210px;max-width:calc(100% - 65px);padding:0;background:none;box-shadow:none;}
 html[data-nav-style="3"] .site-header .site-logo{background:#fff;padding:4px 6px;border-radius:3px;max-width:190px;}
 html[data-nav-style] .site-header .nav-links,html[data-nav-style] .site-header .nav-utility,html[data-nav-style] .site-header .nav-signature{display:none!important;}
 html[data-nav-style="3"] .site-header .hamburger span{background:#f6f8fc;}
 html[data-nav-style="3"] .site-header .nav-toggle.is-open .hamburger span{background:#0a1a39;}
 html[data-nav-style="4"] .site-header .mobile-menu{border-radius:0;}
 html[data-nav-style="5"] .site-header::before{width:43%;opacity:.3;}
}
@media(max-width:760px){
 html[data-nav-style] .site-header{height:71px;}
 html[data-nav-style] .site-header .nav-inner{width:calc(100% - 35px);}
 html[data-nav-style] .site-header .site-logo{width:193px;}
 html[data-nav-style="3"] .site-header .site-logo{max-width:175px;}
}
@media(max-width:360px){html[data-nav-style] .site-header .site-logo{width:175px;}}
@media(prefers-reduced-motion:reduce){.site-header .nav-links a,.site-header .nav-contact,.nav-business-mega,.nav-business-mega *{transition:none!important;}}

/* Vector CTA arrow: keeps the current color without emoji font substitution. */
.site-header .nav-contact::after{display:inline-block;width:1em;height:1em;vertical-align:-.12em;background-color:currentColor;-webkit-mask:url(/assets/arrow-right.svg) center/contain no-repeat;mask:url(/assets/arrow-right.svg) center/contain no-repeat}
html[data-nav-style="1"] .site-header .nav-contact::after{transform:rotate(-45deg)}