:root { --portal-indigo:#303957; --portal-indigo-deep:#28304d; --portal-blue:#527cc4; --portal-lavender:#eef2fb; --portal-pale:#f7f9fd; --portal-coral:#f26764; --portal-gold:#cca34c; --ink:#172641; --muted:#6e7890; --line:#dfe4ee; --shell:min(1880px, calc(100% - 32px)); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:#fff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.5; } a { color:inherit; } img { display:block; max-width:100%; } button { font:inherit; } .shell { width:var(--shell); margin-inline:auto; }
.skip-link { position:fixed; z-index:100; top:-80px; left:20px; padding:10px 14px; color:#fff; background:var(--portal-blue); } .skip-link:focus { top:20px; }
.site-header { position:relative; z-index:20; color:#fff; background:var(--portal-indigo); } .header-inner { display:flex; align-items:center; gap:clamp(18px,2.3vw,44px); min-height:55px; }
.brand { display:inline-flex; flex:none; align-items:center; color:#fff; text-decoration:none; line-height:1; } .brand strong { display:block; font-size:24px; line-height:1.05; letter-spacing:-.055em; } .brand small { display:block; margin-top:6px; color:#dbe2f2; font-size:6px; font-weight:800; line-height:1; letter-spacing:.16em; }
.site-navigation { display:flex; gap:clamp(16px,2vw,34px); margin-left:clamp(24px,3.2vw,56px); } .site-navigation a { color:#f5f6fb; font-size:14px; font-weight:700; text-decoration:none; } .site-navigation a::after { margin-left:5px; color:#aebbd5; content:"⌄"; font-size:12px; } .site-navigation a:last-child::after { content:""; } .site-navigation a:hover { color:#fff; text-decoration:underline; text-underline-offset:5px; }
.header-tools { display:flex; align-items:center; gap:11px; } .header-tools time { display:flex; align-items:center; min-width:111px; height:31px; color:#fff; } .digital-clock__digit { position:relative; display:inline-block; width:13px; height:25px; margin-inline:1px; } .digital-clock__segment { position:absolute; display:block; opacity:.14; border-radius:2px; background:repeating-linear-gradient(90deg,#fff 0 2px,transparent 2px 3px); box-shadow:0 0 4px rgba(255,255,255,.22); } .digital-clock__segment.is-on { opacity:1; } .digital-clock__segment--a,.digital-clock__segment--d,.digital-clock__segment--g { left:3px; width:8px; height:2px; } .digital-clock__segment--a { top:0; } .digital-clock__segment--g { top:11px; } .digital-clock__segment--d { bottom:0; } .digital-clock__segment--b,.digital-clock__segment--c,.digital-clock__segment--e,.digital-clock__segment--f { width:2px; height:9px; background:repeating-linear-gradient(180deg,#fff 0 2px,transparent 2px 3px); } .digital-clock__segment--b { top:2px; right:0; } .digital-clock__segment--c { right:0; bottom:2px; } .digital-clock__segment--e { bottom:2px; left:0; } .digital-clock__segment--f { top:2px; left:0; } .digital-clock__colon { position:relative; width:7px; height:25px; } .digital-clock__colon::before,.digital-clock__colon::after { position:absolute; left:2px; width:3px; height:3px; border-radius:50%; background:#fff; box-shadow:0 0 4px rgba(255,255,255,.3); content:""; } .digital-clock__colon::before { top:7px; } .digital-clock__colon::after { bottom:7px; } .language-switcher { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-width:52px; height:35px; padding:0 9px; border:2px solid #fff; border-radius:4px; color:#fff; font-size:12px; font-weight:800; letter-spacing:.04em; text-decoration:none; } .language-switcher b { margin-top:-2px; color:#dce4f2; font-size:13px; line-height:1; } .language-switcher:hover { color:var(--portal-indigo); background:#fff; } .language-switcher:hover b { color:var(--portal-indigo); } .header-button { padding:8px 12px; border:2px solid #fff; border-radius:4px; color:#fff; font-size:13px; font-weight:750; text-decoration:none; white-space:nowrap; } .header-button:hover { color:var(--portal-indigo); background:#fff; }
.site-footer { color:#c3cedf; background:#06162e; } .footer-grid { display:grid; grid-template-columns:1.8fr 1fr 1.25fr .75fr; gap:42px; padding-block:70px 55px; } .brand--light { color:#fff; } .brand--light small { color:#8192aa; } .footer-grid > div { display:flex; flex-direction:column; align-items:flex-start; gap:10px; } .footer-grid > div:first-child p { max-width:31ch; margin:20px 0 0; color:#8e9eb4; font-size:14px; } .footer-grid b { margin-bottom:7px; color:var(--cyan); font-size:10px; letter-spacing:.13em; } .footer-grid a,.footer-grid span { color:#c3cedf; font-size:13px; text-decoration:none; } .footer-grid a:hover { color:#fff; } .footer-grid em { color:#75869f; font-size:11px; font-style:normal; } .footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-block:20px; border-top:1px solid rgba(195,206,223,.16); color:#75869f; font-size:11px; }
.header-tools{gap:14px;margin-left:auto}.header-tools time{margin-right:2px}.language-switcher{height:32px;padding-inline:10px}.header-button{padding:6px 14px;font-size:13px}
.mobile-menu-toggle{display:none;width:34px;height:30px;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;border:0;color:#fff;background:transparent;cursor:pointer}.mobile-menu-toggle span{display:block;width:23px;height:2px;border-radius:2px;background:currentColor}
/* Thin continuous seven-segment display, matching the approved reference. */
.header-tools time{min-width:88px}.digital-clock__digit{position:relative;display:inline-block;width:11px;height:19px;margin-inline:.75px}.digital-clock__segment{position:absolute;display:block;opacity:.34;border-radius:1px;background:#8d97ad!important;box-shadow:none!important}.digital-clock__segment.is-on{opacity:1;background:#fff!important;box-shadow:0 0 2px rgba(255,255,255,.2)!important}.digital-clock__segment--a,.digital-clock__segment--d,.digital-clock__segment--g{left:2px;width:7px;height:1.5px}.digital-clock__segment--a{top:0}.digital-clock__segment--g{top:8.75px}.digital-clock__segment--d{bottom:0}.digital-clock__segment--b,.digital-clock__segment--c,.digital-clock__segment--e,.digital-clock__segment--f{width:1.5px;height:7px}.digital-clock__segment--b{top:1.5px;right:0}.digital-clock__segment--c{right:0;bottom:1.5px}.digital-clock__segment--e{bottom:1.5px;left:0}.digital-clock__segment--f{top:1.5px;left:0}.digital-clock__colon{position:relative;width:5px;height:19px}.digital-clock__colon::before,.digital-clock__colon::after{left:1.5px;width:2px;height:2px;border-radius:1px;background:#fff;box-shadow:none}.digital-clock__colon::before{top:5px}.digital-clock__colon::after{bottom:5px}
@media(max-width:1100px){.site-navigation{display:none}.header-inner{justify-content:space-between}.header-tools{margin-left:auto}} @media(max-width:620px){:root{--shell:calc(100% - 28px)}.header-inner{min-height:55px;gap:7px}.brand strong{font-size:17px}.brand small{margin-top:4px;font-size:5px}.header-tools{gap:5px}.header-tools time{min-width:54px;margin-right:0}.header-tools time>span:nth-child(n+6){display:none}.digital-clock__digit{width:9px;height:16px;margin-inline:.5px}.digital-clock__segment--a,.digital-clock__segment--d,.digital-clock__segment--g{left:2px;width:5px;height:1.5px}.digital-clock__segment--g{top:7.25px}.digital-clock__segment--b,.digital-clock__segment--c,.digital-clock__segment--e,.digital-clock__segment--f{width:1.5px;height:5.5px}.digital-clock__colon{width:4px;height:16px}.digital-clock__colon::before,.digital-clock__colon::after{left:1px;width:2px;height:2px}.digital-clock__colon::before{top:4px}.digital-clock__colon::after{bottom:4px}.language-switcher{display:inline-flex;min-width:43px;height:30px;padding-inline:6px;font-size:10px}.header-button{display:none}.mobile-menu-toggle{display:flex}.footer-grid{grid-template-columns:1fr;gap:28px;padding-block:50px 38px}.footer-bottom{flex-direction:column;gap:5px}}
/* Resource navigation */
.site-header{position:relative;z-index:100}
.resource-menu{position:relative;color:#f5f6fb;font-size:14px;font-weight:700}
.resource-menu summary{cursor:pointer;list-style:none;white-space:nowrap}
.resource-menu summary::-webkit-details-marker{display:none}
.resource-menu summary::after{content:"⌄";margin-left:5px;color:#aebbd5;font-size:12px}
.resource-menu__items{position:absolute;top:100%;left:-14px;min-width:160px;padding:8px 0;background:#fff;border:1px solid #e2e7ef;border-radius:6px;box-shadow:0 8px 24px rgba(22,34,60,.16)}
.site-navigation .resource-menu__items a{display:block;padding:12px 16px;color:#17233d;text-decoration:none;white-space:nowrap}
.site-navigation .resource-menu__items a::after{content:none}
.site-navigation .resource-menu__items a:hover,.site-navigation .resource-menu__items a:focus{background:#f2f5fa}
@media(max-width:1100px){.mobile-menu-toggle{display:flex}.site-navigation.is-open{display:flex!important;position:absolute;top:100%;left:0;right:0;margin:0;padding:14px 20px;background:#303c5b;flex-direction:column;gap:16px}.site-navigation.is-open .resource-menu__items{position:static;margin-top:10px;box-shadow:none}}