/* ============================================================
   GEMONA — PROFESSIONAL POLISH LAYER
   Loaded after each page's inline <style>, so these rules win
   on equal specificity. Restyle only — no markup/content edits.
   Goal: more professional, trustworthy, modern, premium —
   while keeping the dark + gold gaming character intact.
   ============================================================ */

/* ---------- GLOBAL FEEL ---------- */
html{ -webkit-text-size-adjust:100%; }
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
::selection{ background:rgba(245,166,35,0.30); color:#fff; }
:focus-visible{ outline:2px solid rgba(245,166,35,0.55); outline-offset:2px; }

/* Calmer ambient starfield → reads premium, less "busy gamer" */
#starCanvas{ opacity:0.30 !important; }

/* ---------- TICKER ---------- */
.ticker{
  padding:9px 0;
  background:linear-gradient(90deg,transparent,rgba(245,166,35,0.045),transparent);
  border-bottom:1px solid rgba(245,166,35,0.10);
}
.ticker-text{ font-size:11.5px; font-weight:600; letter-spacing:0.5px; opacity:0.72; }

/* ---------- NAV ---------- */
.navbar{ border-bottom:1px solid rgba(255,255,255,0.07); }

/* ---------- HERO BANNER (home) ---------- */
.hero-banner-inner{
  border-radius:22px;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:
    0 34px 80px -28px rgba(0,0,0,0.75),
    0 0 0 1px rgba(255,255,255,0.04),
    inset 0 1px 0 rgba(255,255,255,0.06);
}

/* ---------- SECTION RHYTHM + HEADINGS ---------- */
.section{ padding:64px 32px; }
.section-label{
  font-size:11px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase;
  color:var(--gold); opacity:0.9; margin-bottom:14px;
}
.section-title{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(23px,2.4vw,29px);
  font-weight:800; letter-spacing:-0.7px;
  line-height:1.12; margin-bottom:32px;
}

/* ---------- PRODUCT + HOW-TO CARDS ---------- */
.product-grid,.hto-grid{ gap:16px; }
.pcard,.hcard{
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
  transition:transform .32s cubic-bezier(.4,0,.2,1),
             box-shadow .32s cubic-bezier(.4,0,.2,1),
             border-color .32s cubic-bezier(.4,0,.2,1);
}
.pcard:hover,.hcard:hover{
  transform:translateY(-5px);
  border-color:rgba(245,166,35,0.38);
  box-shadow:
    0 24px 46px -18px rgba(0,0,0,0.7),
    0 0 0 1px rgba(245,166,35,0.12),
    0 0 34px -10px rgba(245,166,35,0.20);
}
.pcard-overlay,.hcard-overlay{
  background:linear-gradient(to top,rgba(0,0,0,0.92) 0%,rgba(0,0,0,0.34) 56%,rgba(0,0,0,0.04) 100%);
}
.pcard-foot{ padding:14px 16px; }
.hcard-foot{ padding:16px 18px; }
.pcard-name,.hcard-name{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-weight:700; letter-spacing:-0.2px; color:#fff;
}
.pcard-name{ font-size:14px; }
.hcard-name{ font-size:14.5px; }
.pcard-tag,.hcard-sub{
  font-size:9.5px; font-weight:700; letter-spacing:1.3px;
  color:rgba(255,255,255,0.52); margin-bottom:5px;
}

/* ---------- CATEGORY SUB-CARDS ---------- */
.sub-card{
  border-radius:18px;
  transition:transform .3s cubic-bezier(.4,0,.2,1),
             box-shadow .3s cubic-bezier(.4,0,.2,1),
             border-color .3s cubic-bezier(.4,0,.2,1);
}
.sub-card.clickable:hover{
  transform:translateY(-5px);
  box-shadow:0 24px 46px -18px rgba(0,0,0,0.7),0 0 0 1px rgba(245,166,35,0.12);
}

/* ---------- PRIMARY / GOLD BUTTONS ---------- */
.btn-primary,.cta-main,.buy-now-btn,.auth-submit,.cart-browse-btn{
  border-radius:12px;
}
.btn-primary,.cta-main,.buy-now-btn{
  background:linear-gradient(180deg,#ffc758,#ee9f24);
  color:#1b1305;
  box-shadow:0 10px 24px -10px rgba(245,166,35,0.55),inset 0 1px 0 rgba(255,255,255,0.35);
}
.btn-primary:hover,.cta-main:hover,.buy-now-btn:hover{
  background:linear-gradient(180deg,#ffd06b,#f3a72c);
  transform:translateY(-1px);
  box-shadow:0 14px 30px -10px rgba(245,166,35,0.70),inset 0 1px 0 rgba(255,255,255,0.4);
}

/* ---------- ABOUT ---------- */
.about-headline{ letter-spacing:-0.8px; }
.about-stats-row{
  border-radius:16px;
  border:1px solid rgba(245,166,35,0.16);
  box-shadow:0 0 0 1px rgba(255,255,255,0.03),inset 0 1px 0 rgba(255,255,255,0.04);
}
.about-stat-val{ letter-spacing:-0.6px; }
.about-body p{ color:var(--text2); line-height:1.85; }
.about-soc-btn{ border-radius:10px; }
.about-banner-img{ border-radius:22px; }

/* ---------- TRUST / TESTIMONIALS ---------- */
.trust-inner{ border-radius:20px; }
.trust-title{ letter-spacing:-0.5px; }
.rcard{ border-radius:14px; }

/* ---------- FAQ ---------- */
.faq-item{
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.07);
  background:rgba(255,255,255,0.018);
}
.faq-item.open{
  border-color:rgba(245,166,35,0.30);
  background:rgba(245,166,35,0.045);
}
.faq-q{ font-size:14.5px; padding:18px 22px; }
.faq-item.open .faq-chevron{ color:var(--gold); }
.faq-a{ font-size:13.5px; line-height:1.8; }

/* ---------- PRODUCT PAGE: CARDS + BUY BOX ---------- */
.card,.info-card,.seller-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.08);
}
.buy-box{
  border-radius:20px;
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 34px 76px -28px rgba(0,0,0,0.65),
    0 0 0 1px rgba(255,255,255,0.04),
    inset 0 1px 0 rgba(255,255,255,0.06);
}
.buy-price,.total-val{ letter-spacing:-1.4px; }
.seller-name{ letter-spacing:-0.4px; }
.badge{ border-radius:8px; }
.stat-pill{ border-radius:12px; }
.qty-btn,.qty-input{ height:48px; }
.trust-mini-item{ font-size:12.5px; }
.soc-badge,.soc-chip{ border-radius:9px; }

/* Calm the fake-urgency animation → more trustworthy/professional.
   Keeps the live indicators, drops the jittery flicker/scale loop. */
.fire{ animation:none !important; }
.pulse-dot{ animation:pulsedot 2.4s ease-in-out infinite !important; }

/* ---------- AUTH MODAL ---------- */
.auth-modal{ border-radius:22px; }
.auth-input{ border-radius:10px; }

/* ---------- NOTIFICATION TOAST ---------- */
.notif-toast{ border-radius:18px; }

/* ---------- RESPONSIVE GRIDS ---------- */
@media(max-width:1024px){
  .product-grid,.hto-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:640px){
  .section{ padding:44px 20px; }
  .product-grid,.hto-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
}
