/* Zubqxari.com - portal de análises de jogos (PT)
   Tema escuro com acentos violeta e néon.
   Palette: dark #0f1117 / accent #6c63ff / neon #00e5a0 / amber #ffb347 / light #e8e9f0 */

:root {
  --dark: #0f1117;
  --dark-2: #1a1d27;
  --dark-3: #22263a;
  --accent: #6c63ff;
  --accent-deep: #4c44cc;
  --neon: #00e5a0;
  --amber: #ffb347;
  --light: #e8e9f0;
  --muted: #9196b0;
}

html { scroll-behavior: smooth; overflow-x: clip; }
*, *::before, *::after { box-sizing: border-box; }
[class*="grid-cols"] > * { min-width: 0; }

/* ===== layout ===== */
.wrap {
  width: 100%;
  padding-inline: clamp(1.25rem, 4.5vw, 5.5rem);
}
.wrap-tight {
  width: 100%;
  max-width: 68rem;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4.5vw, 5.5rem);
}
@media (min-width: 1536px) {
  .wrap { padding-inline: clamp(2rem, 6vw, 9rem); }
}
img { max-width: 100%; height: auto; }

body {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  color: var(--light);
  background-color: var(--dark);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.font-display { font-family: "Space Grotesk", "Segoe UI", sans-serif; }

/* score / italic caption */
.caption {
  font-family: "Space Grotesk", sans-serif;
  font-style: normal;
  color: var(--neon);
  letter-spacing: 0.02em;
  font-weight: 500;
}

/* small all-caps eyebrow label */
.eyebrow {
  font-family: "Inter", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--amber);
}

/* thin separator */
.hairline {
  border: 0;
  border-top: 1px solid rgba(108,99,255,0.2);
}

/* link underline grow */
.link-grow {
  position: relative;
  text-decoration: none;
}
.link-grow::after {
  content: "";
  position: absolute;
  left: 0; bottom: -3px;
  width: 0; height: 1px;
  background: currentColor;
  transition: width .35s ease;
}
.link-grow:hover::after { width: 100%; }

/* buttons */
.btn-accent {
  background: var(--accent);
  color: #fff;
  transition: background .3s ease, transform .2s ease;
}
.btn-accent:hover { background: var(--accent-deep); transform: translateY(-1px); }

/* backward compat alias for templates that still use btn-leaf */
.btn-leaf {
  background: var(--accent);
  color: #fff;
  transition: background .3s ease, transform .2s ease;
}
.btn-leaf:hover { background: var(--accent-deep); transform: translateY(-1px); }

.btn-outline {
  border: 1px solid var(--accent);
  color: var(--accent);
  transition: background .3s ease, color .3s ease;
}
.btn-outline:hover { background: var(--accent); color: #fff; }

/* card / image frame */
.photo-frame { overflow: hidden; min-width: 0; }
.photo-frame img {
  transition: transform 1.1s cubic-bezier(.2,.7,.2,1), filter .6s ease;
  will-change: transform;
}
.photo-frame:hover img { transform: scale(1.06); }

/* game card */
.game-card {
  background: var(--dark-2);
  border: 1px solid rgba(108,99,255,0.18);
  border-radius: 1rem;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.game-card:hover {
  border-color: var(--accent);
  box-shadow: 0 0 32px rgba(108,99,255,0.15);
}

/* rating badge */
.rating-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: rgba(0,229,160,0.12);
  color: var(--neon);
  border: 1px solid rgba(0,229,160,0.3);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .8rem;
  font-weight: 700;
  font-family: "Space Grotesk", sans-serif;
}

/* platform tag */
.platform-tag {
  display: inline-block;
  background: rgba(108,99,255,0.15);
  color: var(--accent);
  border: 1px solid rgba(108,99,255,0.3);
  border-radius: 999px;
  padding: .15rem .65rem;
  font-size: .75rem;
  font-weight: 600;
}

/* tip/lifehack block */
.tip-block {
  background: var(--dark-3);
  border-left: 3px solid var(--neon);
  border-radius: 0 .75rem .75rem 0;
  padding: 1rem 1.25rem;
}

/* fade-in on scroll */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .8s ease, transform .8s ease;
}
.reveal.is-in { opacity: 1; transform: none; }

/* editorial offsets */
@media (min-width: 768px) {
  .offset-down { margin-top: 3.5rem; }
  .offset-up { margin-top: -2.5rem; }
}

/* Swiper */
.swiper { padding-bottom: 3rem; }
.swiper-pagination-bullet { background: var(--accent); opacity: .35; }
.swiper-pagination-bullet-active { opacity: 1; background: var(--neon); }
.swiper-button-next, .swiper-button-prev { color: var(--accent); }
.swiper-button-next::after, .swiper-button-prev::after { font-size: 1.4rem; }

/* mobile menu */
#mobileMenu { transition: max-height .4s ease, opacity .3s ease; }
#mobileMenu.hidden-menu { max-height: 0; opacity: 0; overflow: hidden; pointer-events: none; }
#mobileMenu.open-menu { max-height: 520px; opacity: 1; }

/* pro/con list */
.pro-con-list li { line-height: 1.7; padding-left: .3rem; }
.pro-con-list .pro { color: var(--neon); }
.pro-con-list .con { color: #ff6b7a; }

/* form fields */
.field {
  background: var(--dark-2);
  border: 1px solid rgba(108,99,255,0.25);
  border-radius: .5rem;
  padding: .7rem .9rem;
  width: 100%;
  font-size: .95rem;
  color: var(--light);
  transition: border-color .25s ease, box-shadow .25s ease;
}
.field::placeholder { color: var(--muted); }
.field:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(108,99,255,0.18);
}
select.field option { background: var(--dark-2); }

/* legal pages */
.prose-legal h2 { font-family:"Space Grotesk",sans-serif; color:var(--neon); margin-top:2rem; margin-bottom:.6rem; font-size:1.35rem; }
.prose-legal h3 { font-weight:700; margin-top:1.3rem; margin-bottom:.4rem; }
.prose-legal p, .prose-legal li { line-height:1.75; color:var(--muted); }
.prose-legal ul { list-style: disc; padding-left:1.3rem; margin:.6rem 0; }
.prose-legal a { color: var(--accent); text-decoration: underline; }

/* star icon helper */
.star { color: var(--amber); }