/* ===== Leopard Robotics 36672 — shared site styles ===== */

:root{
  --bg:#0b0c0d;
  --panel-solid:#17181b;
  --ink:#f2f1ec;
  --gold:#f2a61c;
  --gold-soft:#ffce6b;
  --slate:#9a9d9f;
  --line:#2b2d31;
}

body{ background:var(--bg); color:var(--ink); font-family:'Inter',sans-serif; }
.font-display{ font-family:'Rajdhani',sans-serif; }
.font-mono{ font-family:'Space Mono',monospace; }

/* subtle leopard rosette texture */
.rosettes{
  position:absolute; inset:0; pointer-events:none; opacity:0.5;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(242,166,28,0.10) 0 3px, transparent 4px),
    radial-gradient(circle at 60% 15%, rgba(242,166,28,0.08) 0 4px, transparent 5px),
    radial-gradient(circle at 80% 55%, rgba(242,166,28,0.09) 0 3px, transparent 4px),
    radial-gradient(circle at 35% 70%, rgba(242,166,28,0.07) 0 3px, transparent 4px),
    radial-gradient(circle at 10% 85%, rgba(242,166,28,0.08) 0 4px, transparent 5px),
    radial-gradient(circle at 90% 90%, rgba(242,166,28,0.06) 0 3px, transparent 4px),
    radial-gradient(circle at 50% 45%, rgba(242,166,28,0.05) 0 3px, transparent 4px);
  background-size: 340px 340px;
}

/* circuit-trace divider */
.trace{ display:flex; align-items:center; gap:0; width:100%; }
.trace .seg{ flex:1; height:1px; background:var(--line); }
.trace .node{ width:6px; height:6px; border-radius:9999px; background:var(--gold); flex-shrink:0; }

/* scouting-sheet style card */
.spec-card{ position:relative; border:1px solid var(--line); background:var(--panel-solid); }
.spec-card::before, .spec-card::after{
  content:""; position:absolute; width:14px; height:14px;
  border-color:var(--gold); border-style:solid; border-width:0;
}
.spec-card::before{ top:-1px; left:-1px; border-top-width:2px; border-left-width:2px; }
.spec-card::after{ bottom:-1px; right:-1px; border-bottom-width:2px; border-right-width:2px; }

.tag{
  font-family:'Space Mono',monospace; font-size:0.7rem; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--slate);
}

/* nav */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(11,12,13,0.95); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
.nav-link{ position:relative; }
.nav-link::after{ content:""; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:var(--gold); transition:width .2s ease; }
.nav-link:hover::after{ width:100%; }
.nav-link.active::after{ width:100%; }

/* sponsorship tier cards */
.tier-card{ border:1px solid var(--line); background:var(--panel-solid); transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.tier-card:hover{ transform:translateY(-3px); box-shadow:0 12px 24px -12px rgba(0,0,0,.6); border-color:#3a3d42; }
.tier-featured{ border-color:var(--gold); border-width:2px; }

/* leopard pop-up on scroll */
.peek-zone{ position:relative; overflow:visible; }
.leopard-peek{
  position:absolute; width:150px; z-index:10; pointer-events:none;
  opacity:0; transform:translateY(36px) scale(.8) rotate(var(--tilt,0deg));
  transition: opacity .55s cubic-bezier(.34,1.56,.64,1), transform .55s cubic-bezier(.34,1.56,.64,1);
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.5));
}
.leopard-peek img{ width:100%; display:block; }
.leopard-peek.is-visible{ opacity:1; transform:translateY(0) scale(1) rotate(var(--tilt,0deg)); }
.leopard-peek--r{ right:-10px; top:-40px; --tilt:6deg; }
.leopard-peek--l{ left:-10px; top:-40px; --tilt:-8deg; transform:translateY(36px) scale(.8) rotate(var(--tilt)) scaleX(-1); }
.leopard-peek--l.is-visible{ transform:translateY(0) scale(1) rotate(var(--tilt)) scaleX(-1); }
@media (max-width: 768px){ .leopard-peek{ width:96px; } }

@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
  .leopard-peek{ opacity:1; transform:none !important; }
  .tier-card:hover{ transform:none; }
}
