/* ============================================================================
   ROBORUSH AI — shared site styles
   Previously this whole block was pasted into a <style> tag on all 13 pages
   independently. That's how the nav-sizing bug shipped as duplicated,
   drifting !important overrides — a fix on one page never reached the other
   12. Anything here is meant to be byte-identical across every page; styles
   that are genuinely page-specific (dashboard tables, form fields, event
   rule cards, etc.) stay local to that page's own <style> block.
   ============================================================================ */

/* Custom cursor (dot + trailing ring) */
#cd{width:8px;height:8px;background:#00f0ff;border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:transform .12s;}
#cr{width:32px;height:32px;border:1px solid rgba(0,240,255,.5);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .2s,height .2s,border-color .2s;}

/* Logo wordmark treatment */
.at{font-family:'Space Grotesk',sans-serif;letter-spacing:-.04em;font-weight:800;text-transform:uppercase;}

/* Scanline overlay used behind hero/section backgrounds */
@keyframes scan{0%{top:-120px}100%{top:100%}}
.sl{position:absolute;left:0;right:0;height:120px;background:linear-gradient(to bottom,transparent,rgba(0,240,255,.03) 50%,transparent);animation:scan 15s linear infinite;pointer-events:none;z-index:4;}

/* Live/status dot blink */
@keyframes bl{0%,100%{opacity:1}50%{opacity:.2}}
.bl{animation:bl 1.6s ease-in-out infinite;}

/* Pulsing ring, used on primary CTA buttons */
@keyframes pb{0%,100%{box-shadow:0 0 0 0 rgba(0,240,255,.4)}50%{box-shadow:0 0 0 8px rgba(0,240,255,0)}}
.pb{animation:pb 2.5s ease-in-out infinite;}

/* Scroll-in reveal system: elements start hidden, `.in` (added by an
   IntersectionObserver) animates them into place. Normalized to one timing
   across every page instead of each page having its own slightly different
   duration/offset. */
[data-a]{will-change:transform,opacity;}
[data-a="up"]{opacity:0;transform:translateY(30px);}
[data-a="left"]{opacity:0;transform:translateX(-40px);}
[data-a="right"]{opacity:0;transform:translateX(40px);}
[data-a="scale"]{opacity:0;transform:scale(.94);}
[data-a].in{opacity:1;transform:none;transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1);}
[data-d="1"].in{transition-delay:.1s;}
[data-d="2"].in{transition-delay:.2s;}
[data-d="3"].in{transition-delay:.3s;}
[data-d="4"].in{transition-delay:.4s;}
[data-d="5"].in{transition-delay:.5s;}
[data-d="6"].in{transition-delay:.6s;}
[data-d="7"].in{transition-delay:.7s;}
[data-d="8"].in{transition-delay:.8s;}

/* Section heading rule, used across event/detail/dashboard pages */
.sec-head{font-family:'Space Grotesk',sans-serif;font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:#00f0ff;padding:0 0 12px 0;border-bottom:1px solid rgba(0,240,255,.12);margin-bottom:24px;}

/* Themed scrollbar (previously only on the admin dashboard — now everywhere) */
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:#0e0e0e;}
::-webkit-scrollbar-thumb{background:rgba(0,240,255,.25);border-radius:4px;}
::-webkit-scrollbar-thumb:hover{background:#00f0ff;}
html{scrollbar-color:rgba(0,240,255,.35) #0e0e0e;scrollbar-width:thin;}

/* Readability overrides for small/dim text — the original per-page rule set
   bumped tiny Tailwind utility sizes up site-wide for legibility. Kept as-is
   here so every page gets the same treatment consistently. */
.text-secondary\/30, .text-secondary\/40, .text-secondary\/55, .text-secondary\/60, .text-secondary\/65, .text-secondary\/70, .text-secondary\/75, .text-secondary\/80 {
  color: rgba(255, 255, 255, 0.9) !important;
  font-weight: 600 !important;
}
.text-\[8px\], .text-\[9px\], .text-\[10px\], .text-\[11px\], .text-xs {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
}
.text-sm {
  font-size: 15px !important;
  font-weight: 500 !important;
}
.text-base {
  font-size: 17px !important;
  font-weight: 500 !important;
}
.text-secondary {
  color: rgba(255, 255, 255, 0.92) !important;
  font-weight: 600 !important;
}

/* ============================================================================
   MOBILE NAV — hamburger menu + slide-in panel, shared by every page that
   has a real multi-link <nav> hidden below a breakpoint (roborush-ai.html,
   about-airobolab.html). Pages without a hidden nav simply won't have the
   trigger button in their markup, so this is inert there.
   ============================================================================ */
.mobile-menu-btn{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;background:transparent;border:1px solid rgba(0,240,255,.25);cursor:pointer;flex-shrink:0;}
.mobile-menu-btn span{display:block;width:20px;height:2px;background:#00f0ff;transition:transform .3s cubic-bezier(.16,1,.3,1),opacity .3s ease;}
.mobile-menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mobile-menu-btn.open span:nth-child(2){opacity:0;}
.mobile-menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-menu-panel{position:fixed;inset:0;z-index:90;background:rgba(3,3,3,.98);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .3s ease;display:flex;flex-direction:column;overflow-y:auto;}
.mobile-menu-panel.open{opacity:1;pointer-events:auto;}
.mobile-menu-panel a{font-family:'Space Grotesk',sans-serif;font-size:26px;font-weight:700;text-transform:uppercase;letter-spacing:-.01em;color:#e2e2e2;transition:color .2s ease,transform .2s ease;}
.mobile-menu-panel a:hover, .mobile-menu-panel a.active{color:#00f0ff;}
.mobile-menu-panel a{opacity:0;transform:translateY(16px);transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1),color .2s ease;}
.mobile-menu-panel.open a{opacity:1;transform:none;}
.mobile-menu-panel.open a:nth-child(1){transition-delay:.05s;}
.mobile-menu-panel.open a:nth-child(2){transition-delay:.1s;}
.mobile-menu-panel.open a:nth-child(3){transition-delay:.15s;}
.mobile-menu-panel.open a:nth-child(4){transition-delay:.2s;}
.mobile-menu-panel.open a:nth-child(5){transition-delay:.25s;}
.mobile-menu-panel.open a:nth-child(6){transition-delay:.3s;}
.mobile-menu-panel.open a:nth-child(7){transition-delay:.35s;}
body.menu-open{overflow:hidden;}

@media (max-width: 1023px){
  .mobile-menu-btn{display:flex;}
}
