
/* FaGame.art Arcade extra styles */
:root{
  --fa-border: rgba(255,255,255,.08);
  --fa-glass: rgba(8,10,18,.65);
  --fa-glass2: rgba(8,10,18,.45);
}

/* full-page background */
body.fagameart-arcade{
  background: var(--wp--preset--gradient--arcade-glow);
  min-height: 100vh;
}

/* keep everything crisp */
*{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.fa-header .wp-block-site-title a{
  text-decoration: none;
}

/* subtle pixel grid */
.fa-main{
  padding: 18px 18px 40px;
  position: relative;
}
.fa-main:before{
  content:"";
  position:absolute;
  inset:-20px 0 -20px 0;
  pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity:.25;
  mask-image: radial-gradient(600px circle at 50% 0%, #000 55%, transparent 75%);
}

/* hero card */
.fa-hero-card, .fa-card, .fa-panel{
  background: linear-gradient(180deg, var(--fa-glass), var(--fa-glass2));
  border: 1px solid var(--fa-border);
  border-radius: 22px;
  box-shadow: var(--wp--preset--shadow--neon-soft);
  padding: 16px 16px;
  backdrop-filter: blur(8px);
}

.fa-chip{
  display:inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .06em;
  font-size: .78rem;
  background: rgba(255,60,240,.12);
  border: 1px solid rgba(255,60,240,.25);
}

.fa-cta .wp-block-button__link{
  box-shadow: 0 0 0 1px rgba(255,255,255,.06), 0 10px 30px rgba(0,0,0,.45);
}

.fa-card h3{
  margin-top: 0.2rem;
}

.fa-cards{
  margin-top: 10px;
}

.glow-cyan{ box-shadow: var(--wp--preset--shadow--neon-glow-cyan), var(--wp--preset--shadow--neon-soft); }
.glow-pink{ box-shadow: var(--wp--preset--shadow--neon-glow-pink), var(--wp--preset--shadow--neon-soft); }

.fa-footer{
  border-top: 1px solid var(--fa-border);
  background: rgba(0,0,0,.15);
}

/* navigation */
.wp-block-navigation a{
  text-decoration: none;
}
.wp-block-navigation a:hover{
  text-decoration: underline;
}

/* mobile-first spacing tweaks */
@media (min-width: 782px){
  .fa-main{ padding: 30px 18px 60px; }
  .fa-hero-card, .fa-card, .fa-panel{ padding: 20px 20px; }
}

/* optional: reduce motion */
@media (prefers-reduced-motion: reduce){
  html:focus-within { scroll-behavior: auto; }
}
