.cap-menu-toggle { width:52px; height:52px; padding:15px; display:flex; flex-direction:column; justify-content:center; gap:6px; cursor:pointer; border:0; border-radius:0; background:transparent; color:white; box-shadow:none; }
.cap-navigation-bar { position:absolute; top:0; left:0; right:0; z-index:1030; display:flex; justify-content:space-between; align-items:center; padding:24px 4vw; pointer-events:none; }
.cap-navigation-controls { display:flex; align-items:center; gap:8px; pointer-events:auto; }
.cap-session-icon { display:grid; place-items:center; width:44px; height:52px; font-size:24px; color:white; text-decoration:none; }
.cap-session-icon:hover,.cap-menu-toggle:hover { color:#76d2ef; background:transparent; }
.cap-session-icon:focus-visible,.cap-sticky-logo:focus-visible { outline:2px solid #76d2ef; outline-offset:4px; }
.cap-sticky-logo { display:none; pointer-events:auto; }
.cap-sticky-logo img { display:block; width:150px; height:auto; max-height:52px; object-fit:contain; }
.cap-navigation-bar.is-sticky { position:fixed; padding:10px 4vw; background:rgba(15,45,67,.68); backdrop-filter:blur(16px); border-bottom:1px solid rgba(255,255,255,.15); box-shadow:0 18px 50px rgba(0,0,0,.24); }
.cap-navigation-bar.is-sticky .cap-sticky-logo { display:block; }
.cap-navigation .cap-navigation-bar { position:absolute; padding:24px 4vw; background:transparent; border:0; box-shadow:none; backdrop-filter:none; }
.cap-navigation .cap-navigation-bar .cap-sticky-logo { display:none; }
html { scroll-padding-top:85px; }
.cap-menu-toggle span { display:block; width:20px; height:1px; background:currentColor; transition:transform .35s,opacity .35s; }
.cap-menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(7px) rotate(45deg); }
.cap-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.cap-menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-7px) rotate(-45deg); }
.cap-navigation { position:fixed; inset:0; margin:0; padding:0; border:0; width:100%; max-width:none; height:100dvh; max-height:none; color:#f5fafc; background:linear-gradient(90deg,#00122188,#00122122 60%,transparent),url('../img/cap-menu-background.webp') center/cover no-repeat #031b2b; overflow-y:auto; overscroll-behavior:contain; }
.cap-navigation::backdrop { background:#031b2b; }
.cap-navigation[open] { animation:cap-menu-reveal .8s cubic-bezier(.22,.61,.36,1); }
.cap-navigation-logo { position:absolute; top:24px; right:4vw; width:clamp(150px,17vw,260px); height:auto; }
.cap-navigation-content { min-height:100%; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:125px 8vw 55px 17vw; }
.cap-navigation nav { display:flex; flex-direction:column; gap:clamp(12px,2.1vh,26px); }
.cap-navigation nav a { position:relative; color:#edf5f9; font-family:Poppins,sans-serif; font-size:clamp(27px,3.4vw,56px); font-weight:300; line-height:1.3; text-decoration:none; transition:color .2s,transform .2s; }
.cap-navigation nav a[aria-current] { font-weight:600; color:white; }
.cap-navigation nav a[aria-current]::before { content:''; position:absolute; left:-30px; top:12%; height:76%; width:2px; background:#49d9fa; box-shadow:0 0 14px #49d9fa99; }
.cap-navigation nav a:hover { color:#73def6; transform:translateX(5px); }
.cap-navigation-login { display:inline-flex; align-items:center; gap:16px; margin-top:35px; padding:13px 24px; border:1px solid #75dcef; border-radius:999px; background:#04182766; backdrop-filter:blur(12px); color:#eef7fa; text-decoration:none; font-size:18px; }
.cap-navigation-login span { margin-left:28px; }
.cap-navigation-login:hover { color:white; background:#123b50b3; }
.cap-navigation a:focus-visible,.cap-menu-toggle:focus-visible { outline:2px solid #76d2ef; outline-offset:6px; }
@keyframes cap-menu-reveal { from { opacity:0; clip-path:circle(0% at 5% 5%); } to { opacity:1; clip-path:circle(150% at 5% 5%); } }
@media(max-width:767px) { .cap-navigation { background-position:62% center; background-image:linear-gradient(90deg,#001221dd,#00122188),url('../img/cap-menu-background.webp'); } .cap-navigation-content { padding-left:13vw; padding-top:115px; } .cap-navigation nav a { font-size:clamp(25px,6vw,40px); } .cap-navigation nav a[aria-current]::before { left:-20px; } }
@media(prefers-reduced-motion:reduce) { .cap-navigation[open] { animation:none; } .cap-menu-toggle span,.cap-navigation nav a { transition:none; } }