
/* ============================================================
   CAERSYN SITE EXPLORER
   Opens from the top-left mark. Gives a complete site map.
============================================================ */
.caersyn-explorer-open{
  cursor:pointer!important;
}
.caersyn-explorer-open:hover svg,
.caersyn-explorer-open:hover img{
  filter:drop-shadow(0 0 10px rgba(169,201,255,.45));
}
.cx-overlay{
  position:fixed;
  inset:0;
  z-index:180;
  background:rgba(10,10,11,.52);
  opacity:0;
  pointer-events:none;
  transition:opacity .28s ease;
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}
.cx-panel{
  position:fixed;
  overscroll-behavior:contain;
  top:0;
  left:0;
  bottom:0;
  z-index:181;
  width:min(430px,92vw);
  background:rgba(10,10,11,.96);
  border-right:1px solid rgba(241,237,228,.12);
  transform:translateX(-102%);
  transition:transform .42s cubic-bezier(.7,0,.2,1);
  color:#f1ede4;
  font-family:Archivo,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  box-shadow:18px 0 60px rgba(0,0,0,.38);
  display:flex;
  flex-direction:column;
}
body.cx-explorer-on .cx-overlay{
  opacity:.42;
  pointer-events:none;
}
body.cx-explorer-on .cx-panel{
  transform:translateX(0);
}
.cx-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px 24px 20px;
  border-bottom:1px solid rgba(241,237,228,.1);
}
.cx-brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.cx-brand svg{
  width:26px;
  height:26px;
  flex:none;
}
.cx-brand-text{
  min-width:0;
}
.cx-brand-text b{
  display:block;
  font-size:13px;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-weight:600;
}
.cx-brand-text span{
  display:block;
  margin-top:5px;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;
  letter-spacing:.18em;
  color:#908c82;
  text-transform:uppercase;
}
.cx-close{
  border:1px solid rgba(241,237,228,.14)!important;
  color:#b7b3aa!important;
  background:transparent!important;
  padding:10px 12px!important;
  font-family:'JetBrains Mono',ui-monospace,monospace!important;
  font-size:10px!important;
  letter-spacing:.22em!important;
  text-transform:uppercase!important;
  cursor:pointer!important;
}
.cx-close:hover{
  color:#a9c9ff!important;
  border-color:rgba(169,201,255,.45)!important;
}
.cx-body{
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:22px 24px 34px;
}
.cx-intro{
  font-size:14px;
  line-height:1.65;
  color:#b7b3aa;
  max-width:34ch;
  margin:0 0 26px;
}
.cx-group{
  margin-top:26px;
}
.cx-group:first-of-type{
  margin-top:0;
}
.cx-kicker{
  display:flex;
  align-items:center;
  gap:10px;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:#908c82;
  margin-bottom:10px;
}
.cx-kicker:before{
  content:"";
  width:24px;
  height:1px;
  background:rgba(169,201,255,.52);
}
.cx-list{
  border-top:1px solid rgba(241,237,228,.1);
}
.cx-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  padding:14px 0;
  border-bottom:1px solid rgba(241,237,228,.1);
  color:#f1ede4!important;
  text-decoration:none!important;
}
.cx-item:hover .cx-title,
.cx-item[aria-current="page"] .cx-title{
  color:#a9c9ff;
}
.cx-title{
  display:block;
  font-family:'PT Serif Caption',Georgia,serif;
  font-size:16px;
  line-height:1.28;
  transition:color .25s ease;
}
.cx-desc{
  display:block;
  margin-top:5px;
  color:#908c82;
  font-size:12.5px;
  line-height:1.55;
}
.cx-tag{
  align-self:start;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9px;
  letter-spacing:.18em;
  color:#67645e;
  text-transform:uppercase;
  white-space:nowrap;
  padding-top:3px;
}
.cx-item:hover .cx-tag,
.cx-item[aria-current="page"] .cx-tag{
  color:#a9c9ff;
}
.cx-foot{
  margin-top:30px;
  padding-top:20px;
  border-top:1px solid rgba(241,237,228,.1);
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10px;
  letter-spacing:.18em;
  line-height:1.8;
  color:#67645e;
  text-transform:uppercase;
}
@media (max-width:640px){
  .cx-head{padding:20px 18px 16px}
  .cx-body{padding:18px 18px 28px}
  .cx-panel{width:94vw}
}
@media print{
  .cx-overlay,.cx-panel{display:none!important}
}
