/*
Theme Name: COLORFULBOXER Astra Child
Theme URI: https://example.invalid/
Description: COLORFULBOXER (Art-Pop / 121) child theme for Astra. Black base, neon accents on key moments, pattern-first layout.
Author: ChatGPT
Template: astra
Version: 1.0.0
Text Domain: colorfulboxer-astra-child
*/

/* ---------- Design tokens ---------- */
:root{
  --cb-base-black:#0B0B0F;
  --cb-surface:#11111A;
  --cb-text:#FFFFFF;
  --cb-subtext:#B8B8C6;

  --cb-neon-pink:#FF3BD4;
  --cb-neon-green:#52FF6A;
  --cb-neon-blue:#2DE2FF;
  --cb-neon-yellow:#FFE66A;
  --cb-neon-purple:#7C3BFF;

  --cb-radius:16px;
  --cb-radius-sm:12px;
  --cb-gap:24px;
  --cb-max:1280px;
}

/* ---------- Base ---------- */
body{
  background: var(--cb-base-black);
  color: var(--cb-text);
}
a{ color: var(--cb-text); text-decoration-thickness: 2px; text-underline-offset: .18em; }
a:hover{ color: var(--cb-neon-blue); }
p{ color: var(--cb-subtext); }

/* Make Astra content a bit tighter for pop feel */
.ast-container{ max-width: var(--cb-max); }
.entry-content > *{ margin-bottom: 1.2rem; }
h1,h2,h3{ letter-spacing: .02em; }

/* ---------- Text logo ---------- */
.site-title a{
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.site-title a:hover{
  text-decoration: none;
  border-bottom: 3px solid var(--cb-neon-pink);
}

/* ---------- Neon divider (use: <div class="cb-neon-divider"></div>) ---------- */
.cb-neon-divider{
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg,var(--cb-neon-pink),var(--cb-neon-blue),var(--cb-neon-green));
  box-shadow: 0 0 18px rgba(255,59,212,.35), 0 0 18px rgba(45,226,255,.25);
  margin: 64px 0;
}

/* ---------- CTA button (apply to WP button: add class cb-cta) ---------- */
.wp-block-button__link.cb-cta{
  border: 2px solid var(--cb-text);
  background: transparent;
  color: var(--cb-text);
  border-radius: 999px;
  padding: 14px 28px;
  font-weight: 800;
}
.wp-block-button__link.cb-cta:hover{
  border-color: var(--cb-neon-pink);
  box-shadow: 0 0 14px rgba(255,59,212,.45);
  transform: translateY(-1px);
}

/* ---------- Cards ---------- */
.cb-card{
  background: rgba(17,17,26,.65);
  border: 1px solid rgba(184,184,198,.16);
  border-radius: var(--cb-radius);
  padding: 22px;
  backdrop-filter: blur(6px);
}
.cb-card strong{ color: var(--cb-text); }

/* ---------- Pattern grid ---------- */
.cb-pattern-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
@media (max-width: 920px){
  .cb-pattern-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .cb-pattern-grid{ grid-template-columns: 1fr; }
}
.cb-pattern-tile{
  border-radius: var(--cb-radius);
  overflow: hidden;
  border: 1px solid rgba(184,184,198,.18);
  background: #0F0F16;
}
.cb-pattern-tile img{
  display: block;
  width: 100%;
  height: auto;
}

/* ---------- Footer minimal neon line ---------- */
.site-footer{
  border-top: 2px solid rgba(255,59,212,.25);
  box-shadow: 0 -10px 40px rgba(45,226,255,.06);
}