/* ===== Navbar style variants (picked per page in admin). Default look = floating pill in nav.css ===== */
/* --- glass bar: flat full-width frosted bar with an underline indicator --- */
@media(min-width:861px){
.nav.ns-glass{padding:0}
.nav.ns-glass .wrap{max-width:none;height:70px;padding:0 clamp(18px,4vw,56px);border-radius:0;background:rgba(8,9,15,.6);border:0;border-bottom:1px solid rgba(255,255,255,.08);box-shadow:none}
.nav.ns-glass .wrap::before{left:0;right:0;opacity:.35}
.nav.ns-glass.scrolled{padding:0}
.nav.ns-glass.scrolled .wrap{height:58px;max-width:none;background:rgba(8,9,15,.88);box-shadow:0 20px 40px -26px #000}
.nav.ns-glass .nav-links{background:none;border:0;padding:0;gap:4px}
.nav.ns-glass .nav-ind{top:auto;bottom:-6px;height:2px;border:0;border-radius:2px;background:linear-gradient(90deg,var(--a1),var(--a2));box-shadow:0 0 14px var(--a2)}
}
/* --- split: brand in the centre, links on both sides --- */
@media(min-width:861px){
.nav.ns-split .wrap{max-width:1240px;height:82px;justify-content:center;gap:2px;padding:0 24px;border-radius:26px}
.nav.ns-split.scrolled .wrap{height:62px;max-width:1100px}
.nav.ns-split .nav-links{display:contents}
.nav.ns-split .nav-ind{display:none}
.nav.ns-split .nav-links a{position:relative;z-index:1}
.nav.ns-split .nav-links a.nl{order:1}
.nav.ns-split .nav-links a.nr{order:3}
.nav.ns-split .brand{order:2;margin:0 clamp(18px,4vw,60px);font-size:24px;gap:12px}
.nav.ns-split .brand-mark{width:40px;height:40px;border-radius:13px}
.nav.ns-split .brand img{height:42px}
.nav.ns-split .btn-offer{order:4;margin-left:18px}
.nav.ns-split .nav-links a.on::after{display:block;content:"";position:absolute;left:50%;bottom:0;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--a2);box-shadow:0 0 10px var(--a2)}
.nav.ns-split .burger{display:none}
}
/* --- bottom dock: floating bar at the bottom, icons magnify on hover --- */
body.has-dock{padding-bottom:96px}
.nav.ns-dock{position:fixed;top:auto;bottom:14px;left:0;right:0;padding:0 12px}
.nav.ns-dock.scrolled{padding:0 12px}
.nav.ns-dock .wrap{width:max-content;max-width:100%;margin:0 auto;height:66px;padding:8px 10px;gap:8px;border-radius:30px;animation-name:dockUp}
.nav.ns-dock.scrolled .wrap{height:66px;max-width:100%}
@keyframes dockUp{from{opacity:0;transform:translateY(40px) scale(.94);filter:blur(8px)}}
@media(min-width:861px){
.nav.ns-dock .brand span:not(.brand-mark){display:none}
.nav.ns-dock .nav-links{margin:0}
.nav.ns-dock .nav-links a{transition:transform .35s cubic-bezier(.22,1,.36,1),color .3s;transform-origin:50% 100%}
.nav.ns-dock .nav-links a:hover{transform:translateY(-8px) scale(1.14)}
.nav.ns-dock .nav-links a:hover + a,.nav.ns-dock .nav-links a:has(+ a:hover){transform:translateY(-3px) scale(1.05)}
.nav.ns-dock .nav-ind{top:auto;bottom:2px;height:4px;width:4px!important;left:0;margin-left:-2px;border-radius:50%;background:var(--a2);border:0;box-shadow:0 0 10px var(--a2)}
}
@media(max-width:860px){
.nav.ns-dock{bottom:10px;padding:0 10px}
.nav.ns-dock .wrap{width:100%;height:60px;border-radius:26px;background:rgba(10,12,20,.9)}
.nav.ns-dock .nav-links{clip-path:circle(0% at 50% calc(100% - 40px))}
.nav.ns-dock .nav-links.open{clip-path:circle(160% at 50% calc(100% - 40px))}
}
/* --- notched frame: same silhouette as the Logo / Graphic pages --- */
.nv-notch{display:contents}
.nv-panel{display:none}
@media(min-width:861px){
.nav.ns-notch{padding:12px 16px 0}
.nav.ns-notch .wrap{--r:20px;--nbg:#151827;max-width:1240px;height:80px;padding:8px;border-radius:34px;justify-content:center;background:var(--nbg);border:1px solid rgba(255,255,255,.1);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 24px 60px -28px #000}
.nav.ns-notch.scrolled .wrap{height:68px;max-width:1120px;background:var(--nbg)}
.nav.ns-notch .wrap::before{display:none}
.nav.ns-notch .nv-panel{display:block;position:absolute;inset:8px;border-radius:26px;z-index:0;overflow:hidden;
  background:radial-gradient(60% 140% at 15% 0%,color-mix(in srgb,var(--a1) 55%,#05060b),transparent 70%),radial-gradient(50% 140% at 90% 100%,color-mix(in srgb,var(--a2) 45%,#05060b),transparent 70%),#0b0d16}
.nav.ns-notch .nv-notch{display:flex;align-items:center;gap:10px;position:absolute;top:0;z-index:3;height:54px;background:var(--nbg)}
.nav.ns-notch .nv-notch.l{left:0;padding:0 24px 2px 14px;border-radius:34px 0 var(--r) 0}
.nav.ns-notch .nv-notch.r{right:0;padding:0 12px 2px 24px;border-radius:0 34px 0 var(--r)}
.nav.ns-notch .nv-notch::before,.nav.ns-notch .nv-notch::after{content:"";position:absolute;width:var(--r);height:var(--r);pointer-events:none}
.nav.ns-notch .nv-notch.l::before{left:100%;top:8px;background:radial-gradient(circle at 100% 100%,transparent calc(var(--r) - .5px),var(--nbg) var(--r))}
.nav.ns-notch .nv-notch.l::after{left:8px;top:100%;background:radial-gradient(circle at 100% 100%,transparent calc(var(--r) - .5px),var(--nbg) var(--r))}
.nav.ns-notch .nv-notch.r::before{right:100%;top:8px;background:radial-gradient(circle at 0 100%,transparent calc(var(--r) - .5px),var(--nbg) var(--r))}
.nav.ns-notch .nv-notch.r::after{right:8px;top:100%;background:radial-gradient(circle at 0 100%,transparent calc(var(--r) - .5px),var(--nbg) var(--r))}
.nav.ns-notch .nav-links{position:relative;z-index:2;margin:0 auto;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.nav.ns-notch .nv-go{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#eef0f6;color:#0b0d16;font-size:16px;transition:transform .4s cubic-bezier(.22,1,.36,1)}
.nav.ns-notch .nv-go:hover{transform:rotate(45deg)}
.nav.ns-notch .burger{display:none}
}
