.as-skip{position:absolute;left:-9999px;top:0;z-index:200;background:#05060B;color:#fff; padding:12px 18px;font:600 14px/1 ui-sans-serif,system-ui,sans-serif} .as-skip:focus{left:0} .as-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .as-nav{position:sticky;top:0;z-index:100;background:rgba(5,6,11,.94); border-bottom:1px solid rgba(255,255,255,.09)} .as-nav-in{max-width:1240px;margin:0 auto;padding:0 22px;display:flex;align-items:center; gap:26px;min-height:62px} .as-mark{display:flex;align-items:baseline;gap:9px;text-decoration:none;flex:0 0 auto} .as-mark-eos{font:700 19px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.02em;color:var(--mist)} .as-mark-sub{font:500 10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; letter-spacing:.13em;text-transform:uppercase;color:var(--haze)} @media(max-width:1180px){.as-mark-sub{display:none}} .as-menu{list-style:none;display:flex;align-items:center;gap:1px;margin:0 0 0 auto;padding:0; flex-wrap:nowrap} .as-menu a{display:block;padding:9px 10px;border-radius:0;text-decoration:none; font:500 13.5px/1 ui-sans-serif,system-ui,sans-serif;color:var(--haze);white-space:nowrap; transition:color .16s ease,background .16s ease} .as-menu a:hover{color:var(--mist);background:rgba(255,255,255,.07)} .as-menu a[aria-current="page"]{color:#96E6F0;background:rgba(150,230,240,.10)} .as-menu a:focus-visible{outline:2px solid #96E6F0;outline-offset:2px} .as-cta a{background:var(--cyan);color:var(--field)!important;font-weight:650;padding:9px 15px;margin-left:8px} .as-cta a:hover{background:var(--cyan-hi)} .as-burger{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.18); border-radius:0;width:42px;height:38px;cursor:pointer;align-items:center;justify-content:center} .as-burger-bars::before,.as-burger-bars::after{display:block;width:18px;height:1.5px;background:#D6DCE6;content:""} .as-burger-bars{position:relative} .as-burger-bars::before{position:absolute;top:-6px} .as-burger-bars::after{position:absolute;top:6px} @media(max-width:1180px){ .as-burger{display:flex} .as-menu{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch; gap:0;background:#080A11;border-bottom:1px solid rgba(255,255,255,.10);padding:8px 14px 16px; display:none} .as-menu.open{display:flex} .as-menu a{padding:13px 12px;font-size:15.5px;border-radius:0} .as-cta a{margin:10px 0 0;text-align:center} } @media(prefers-reduced-motion:reduce){.as-menu a{transition:none}} /* R147 NAV REPAIR --------------------------------------------------------- Four defects, all in the shared nav so all 58 pages carried them: 1 no mark at all, the brand was a bold text string 2 menu items at inherited weight read as heavy, and grey read as dull 3 .as-burger-bars had position but no width/height/background, so the hamburger rendered as an empty box 4 the CTA was flat --cyan rather than the brand gradient ------------------------------------------------------------------------ */ .as-mark{display:flex;align-items:center;gap:10px;text-decoration:none;flex:0 0 auto} .as-mark-svg{width:26px;height:26px;flex:0 0 auto;display:block} .as-mark-eos{font:600 18px/1 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; letter-spacing:-.015em;color:#F3F7FC} .as-mark-sub{display:none} @media(min-width:820px){ .as-mark{align-items:baseline} .as-mark-sub{display:block;font:400 8.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.18em;text-transform:uppercase;color:#939FB2;margin-left:2px} } /* menu: lighter weight, brighter colour, tighter tracking */ .as-menu a{padding:13px 12px;font-size:15.5px;font-weight:450;letter-spacing:-.012em; color:#C3CBD8;border-radius:0;transition:color .35s ease} .as-menu a:hover,.as-menu a:focus-visible{color:#F3F7FC} .as-menu a[aria-current]{color:#B8EEF6} /* burger: actually draw the bars */ .as-burger{display:flex;align-items:center;justify-content:center;width:40px;height:40px; background:none;border:1px solid rgba(184,238,246,.22);cursor:pointer;padding:0} .as-burger-bars{position:relative;display:block;width:17px;height:1.5px; background:#F3F7FC;transition:background .3s ease} .as-burger-bars::before,.as-burger-bars::after{content:"";position:absolute;left:0; width:17px;height:1.5px;background:#F3F7FC} .as-burger-bars::before{top:-6px} .as-burger-bars::after{top:6px} .as-burger[aria-expanded="true"] .as-burger-bars{background:transparent} .as-burger[aria-expanded="true"] .as-burger-bars::before{top:0;transform:rotate(45deg)} .as-burger[aria-expanded="true"] .as-burger-bars::after{top:0;transform:rotate(-45deg)} /* CTA: brand gradient, not a flat swatch */ .as-cta a{background:linear-gradient(135deg,#B8EEF6,#7ADCEC 30%,#A3AEF8 68%,#B79BF4)!important; color:#0B0E14!important;font-weight:600;letter-spacing:-.01em;padding:11px 18px;margin-left:10px} @media(max-width:820px){.as-cta a{margin:12px 0 0;text-align:center;padding:13px 18px}} /* R147 NAV CLOSE --------------------------------------------------------- The panel opened but could only be closed by the burger or Escape. Tapping a link or outside the panel left it open, which reads as stuck. Also locks scroll while open so the page behind does not move under the panel. */ html.as-locked body{overscroll-behavior:contain} .as-burger{position:relative;z-index:2} @media(max-width:820px){ .as-menu{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.16,.68,.28,1)} .as-menu.open{max-height:78vh;overflow-y:auto;overscroll-behavior:contain} } /* R147 NAV ICON REPAIR ---------------------------------------------------- The bars rendered as three short dashes sitting on the header rule: 17px wide inside a 40px button, hard 1.5px edges, full-brightness white. They read as imperfections in the line rather than as an icon. Fixed by: widening to fill the button, softening to the body ink colour rather than pure white, and giving the top and bottom bars slightly shorter lengths so the shape reads as a control. */ .as-burger{display:flex;align-items:center;justify-content:center;width:38px;height:38px; background:none;border:1px solid rgba(184,238,246,.16);cursor:pointer;padding:0; position:relative;z-index:2;transition:border-color .4s ease} .as-burger:hover{border-color:rgba(184,238,246,.34)} .as-burger-bars{position:relative;display:block;width:19px;height:1px; background:#C3CBD8;transition:background .3s ease} .as-burger-bars::before,.as-burger-bars::after{content:"";position:absolute;left:0; height:1px;background:#C3CBD8;transition:transform .3s cubic-bezier(.16,.68,.28,1), top .3s cubic-bezier(.16,.68,.28,1),width .3s ease} .as-burger-bars::before{top:-6px;width:19px} .as-burger-bars::after{top:6px;width:13px} .as-burger:hover .as-burger-bars::after{width:19px} .as-burger[aria-expanded="true"] .as-burger-bars{background:transparent} .as-burger[aria-expanded="true"] .as-burger-bars::before{top:0;width:19px;transform:rotate(45deg)} .as-burger[aria-expanded="true"] .as-burger-bars::after{top:0;width:19px;transform:rotate(-45deg)} /* R147 HEADER RULE --------------------------------------------------------- The header edge read as imperfections rather than as a line. Cause: a hard 1px solid border at a single flat value, sitting directly under a translucent blurred bar. Against the backdrop-filter the solid edge aliases at fractional device pixels and breaks into visible segments, which is what the eye picked up as damage. Fix: replace the hard border with a soft gradient hairline that fades at both ends. It never terminates abruptly, so there is no edge to alias. */ .as-nav{border-bottom:0 !important;position:sticky !important;top:0;z-index:100;background:#05060B !important;backdrop-filter:none} .as-nav::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px; pointer-events:none; background:linear-gradient(90deg, transparent 0%, rgba(184,238,246,.10) 12%, rgba(184,238,246,.20) 50%, rgba(184,238,246,.10) 88%, transparent 100%)} /* R147 STICKY NAV FIX ------------------------------------------------------ overflow-x:hidden on computes overflow-y to auto, which turns body into a scroll container. A position:sticky child of a scroll container sticks to THAT container, not the viewport, so the header scrolled away and page content passed behind it. Confirmed by measuring: nav top was -260px while scrolled 260px. Horizontal clipping moves to , which does not create the same containing block, so sticky resolves against the viewport again. */ html{overflow-x:hidden} body{overflow-x:visible !important} .as-nav{position:sticky !important;top:0;z-index:100;background:#05060B !important} /* R147 MENU CLIP FIX ------------------------------------------------------- The collapsed menu had max-height:0 and overflow:hidden yet still measured 25px tall, so a clipped line of nav text bled out below the header. Cause: the panel is display:flex and position:absolute, and in that combination the flex line established a height that max-height alone did not clip. Collapsing height, padding and border as well, and hiding it from the accessibility tree while closed, so nothing renders and nothing is focusable. The open state restores all of it. */ .as-menu:not(.open){ height:0 !important; min-height:0 !important; max-height:0 !important; padding-top:0 !important; padding-bottom:0 !important; border-top:0 !important; border-bottom:0 !important; overflow:hidden !important; visibility:hidden !important; pointer-events:none !important; } .as-menu.open{ visibility:visible !important; pointer-events:auto !important; }