/* One site-wide header and footer for every static page, including Cylantro OS. */
.cl-folio{display:flex;align-items:center;gap:15px;color:#a9c3ca;font:400 10px/1.5 Orbitron,Arial,sans-serif;letter-spacing:.22em;white-space:nowrap}
.cl-folio-dot{display:block;flex:0 0 7px;width:7px;height:7px;border-radius:50%;background:#e53cda;box-shadow:0 0 16px rgba(229,60,218,.7)}
.cl-folio-rule{display:block;flex:0 0 44px;width:44px;height:1px;background:rgba(155,197,205,.28)}
.cl-masthead,.cl-footer{box-sizing:border-box;font-family:Inter,Arial,sans-serif}
.cl-masthead *, .cl-footer *{box-sizing:border-box}
.cl-masthead{position:relative;z-index:60;width:100%;max-width:1700px;min-height:82px;margin-inline:auto;padding:0 clamp(24px,4.3vw,72px);border-bottom:1px solid rgba(155,197,205,.18);background:#090b0e;display:flex;align-items:center;justify-content:space-between;gap:22px}
.cl-masthead a,.cl-footer a{color:inherit;text-decoration:none}
.cl-masthead a:focus-visible,.cl-masthead summary:focus-visible,.cl-footer a:focus-visible{outline:2px solid #49d9e8;outline-offset:4px}
.cl-brand{display:inline-flex;align-items:center;gap:13px;min-width:0;flex:none}
.cl-brand img{display:block;width:43px;height:43px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(43,215,227,.17))}
.cl-brand-name{font-family:Orbitron,Arial,sans-serif;font-size:clamp(12px,1.15vw,16px);font-weight:500;letter-spacing:.16em;white-space:nowrap;color:#ebf3f5}
.cl-brand-name b{font-weight:600;background:linear-gradient(100deg,#60d8ed 15%,#dd5cde 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.cl-nav-desktop{display:flex;align-items:center;gap:clamp(13px,1.65vw,27px);min-width:0}
.cl-nav-desktop a{position:relative;padding:12px 0;color:#b7c8cd;font-family:Inter,Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:.035em;white-space:nowrap;transition:color .2s}
.cl-nav-desktop a:hover,.cl-nav-desktop a[aria-current="page"]{color:#f2fbfc}
.cl-nav-desktop a:not(.cl-language)::after{content:"";position:absolute;left:0;bottom:7px;width:0;height:1px;background:#49d9e8;transition:width .2s}
.cl-nav-desktop a[aria-current="page"]::after,.cl-nav-desktop a:hover::after{width:100%}
.cl-os-word{color:#e53cda}
.cl-os-link:hover .cl-os-word,.cl-os-link[aria-current="page"] .cl-os-word{color:#ff63f0}
.cl-nav-desktop a.cl-os-link::after{background:#e53cda}
.cl-nav-desktop .cl-language{margin-left:2px;padding-left:17px;border-left:1px solid rgba(155,197,205,.18);color:#49d9e8;font-family:Orbitron,Arial,sans-serif;font-size:11px;letter-spacing:.08em}
.cl-mobile-language,.cl-nav-mobile{display:none}
.cl-footer{position:relative;z-index:2;width:100%;max-width:1700px;margin-inline:auto;padding:28px clamp(34px,7.2vw,120px);border-top:1px solid rgba(155,197,205,.18);background:#090b0e;color:#83949b;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:11px;line-height:1.5;letter-spacing:.02em}
.cl-footer nav{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.cl-footer nav a{color:#aebfc5;overflow-wrap:anywhere}
.cl-footer nav a:hover,.cl-footer nav a[aria-current="page"]{color:#49d9e8}
@media(max-width:1060px){
  .cl-nav-desktop{display:none}
  .cl-mobile-language{display:inline-flex;align-items:center;justify-content:center;margin-left:auto;padding:7px 8px;border:1px solid rgba(73,217,232,.35);color:#49d9e8!important;font-family:Orbitron,Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.08em;line-height:1.1}
  .cl-nav-mobile{display:block;position:relative}
  .cl-nav-mobile summary{list-style:none;display:flex;align-items:center;gap:12px;min-height:40px;color:#d0e2e6;cursor:pointer;font-family:Inter,Arial,sans-serif;font-size:12px;font-weight:600;letter-spacing:.035em}
  .cl-nav-mobile summary::-webkit-details-marker{display:none}
  .cl-nav-mobile summary i{display:block;width:16px;height:9px;border-top:1px solid #49d9e8;border-bottom:1px solid #49d9e8}
  .cl-nav-mobile[open] summary i{height:1px;border-bottom:0;transform:rotate(45deg)}
  .cl-nav-mobile nav{position:absolute;right:0;top:calc(100% + 11px);width:min(280px,calc(100vw - 28px));padding:10px 22px 17px;border:1px solid rgba(73,217,232,.4);background:#10191e;box-shadow:0 22px 45px rgba(0,0,0,.48);display:flex;flex-direction:column}
  .cl-nav-mobile nav a{padding:12px 0;border-bottom:1px solid rgba(155,197,205,.18);color:#d9e7ea;font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:500;line-height:1.25}
  .cl-nav-mobile nav a:last-child{border:0}
  .cl-nav-mobile nav a:hover,.cl-nav-mobile nav a[aria-current="page"]{color:#49d9e8}
}
@media(max-width:760px){.cl-masthead{min-height:70px;padding-inline:26px}.cl-brand img{width:36px;height:36px}.cl-brand-name{font-size:13px}}
@media(max-width:420px){
  .cl-folio{gap:12px;font-size:9px}
  .cl-folio-rule{flex-basis:32px;width:32px}
  .cl-masthead{padding-inline:18px;gap:10px}
  .cl-brand{gap:8px}
  .cl-brand img{width:30px;height:30px}
  .cl-brand-name{font-size:10px;letter-spacing:.1em}
  .cl-nav-mobile nav{right:0}
  .cl-footer{padding:26px 24px;display:block}
  .cl-footer nav{margin-top:16px;gap:10px 20px}
}
@media(max-width:340px){.cl-nav-mobile summary{width:24px;justify-content:flex-end}.cl-nav-mobile summary span{display:none}}
@media(prefers-reduced-motion:reduce){.cl-nav-desktop a,.cl-nav-desktop a::after{transition:none}}
