/* ============================================================
   Fireglen — design system
   Warm festive-dusk base, ember/coral/pink/gold accents.
   Namespace: .xw-*
   ============================================================ */

@font-face{
  font-family:"Overused Grotesk";
  src:url("/fonts/OverusedGrotesk-Book.otf") format("opentype");
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Overused Grotesk";
  src:url("/fonts/OverusedGrotesk-Medium.otf") format("opentype");
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Overused Grotesk";
  src:url("/fonts/OverusedGrotesk-Bold.otf") format("opentype");
  font-weight:600 700;font-style:normal;font-display:swap;
}

:root{
  --xw-bg:        #120a1e;
  --xw-bg-2:      #181023;
  --xw-surface:   #1d1430;
  --xw-surface-2: #251a3c;
  --xw-line:      #322546;
  --xw-line-2:    #43335c;

  --xw-ember:      #ff7a2f;
  --xw-ember-lt:   #ffb061;
  --xw-coral:      #ff6f61;
  --xw-pink:       #ff5ea8;
  --xw-gold:       #ffc24d;
  --xw-gold-deep:  #f0a93a;
  --xw-cyan:       #6fd0ff;

  --xw-text:   #f4eefa;
  --xw-text-2: #b6abc4;
  --xw-text-3: #7d738c;

  --xw-radius:   14px;
  --xw-radius-s: 8px;
  --xw-radius-pill: 999px;

  --xw-maxw: 1200px;
  --xw-ease: cubic-bezier(.22,.61,.36,1);

  --xw-font:    "Overused Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --xw-display: "Overused Grotesk", var(--xw-font);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html.xw-noscroll{ overflow:hidden; }

body{
  margin:0;
  background:var(--xw-bg);
  color:var(--xw-text);
  font-family:var(--xw-font);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }

/* ---------- type scale ---------- */
.xw-h1{
  font-family:var(--xw-display);
  font-weight:600;
  font-size:clamp(40px, 7vw, 76px);
  line-height:1.02;
  letter-spacing:-0.03em;
  margin:0;
}
.xw-h2{
  font-family:var(--xw-display);
  font-weight:600;
  font-size:clamp(30px, 4.4vw, 50px);
  line-height:1.05;
  letter-spacing:-0.025em;
  margin:0;
}
.xw-h3{
  font-family:var(--xw-display);
  font-weight:600;
  font-size:clamp(22px, 2.6vw, 30px);
  letter-spacing:-0.02em;
  margin:0;
}
.xw-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:500; letter-spacing:.02em;
  color:var(--xw-text-2);
  padding:7px 14px;
  border:1px solid var(--xw-line-2);
  border-radius:var(--xw-radius-pill);
  background:rgba(255,255,255,.02);
}
.xw-eyebrow b{ color:var(--xw-coral); font-weight:600; }
.xw-lead{
  font-size:clamp(17px,1.7vw,20px);
  color:var(--xw-text-2);
  line-height:1.5;
  margin:0;
}
.xw-grad{
  background:linear-gradient(100deg,var(--xw-gold),var(--xw-coral) 42%,var(--xw-pink) 72%,var(--xw-ember-lt));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

/* ---------- layout ---------- */
.xw-wrap{ max-width:var(--xw-maxw); margin:0 auto; padding:0 24px; }
.xw-section{ padding:clamp(64px,9vw,120px) 0; position:relative; }
.xw-center{ text-align:center; }
.xw-section__head{ max-width:680px; margin:0 auto 48px; text-align:center; }
.xw-section__head .xw-lead{ margin-top:16px; }

/* ---------- buttons ---------- */
.xw-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:600; font-size:15px;
  padding:13px 24px; border-radius:var(--xw-radius-s);
  transition:transform .18s var(--xw-ease), filter .18s var(--xw-ease), background .18s;
  white-space:nowrap;
}
.xw-btn:active{ transform:translateY(1px); }
.xw-btn--primary{
  background:linear-gradient(180deg,var(--xw-gold),var(--xw-gold-deep));
  color:#1a1505;
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 8px 24px rgba(245,196,81,.18);
}
.xw-btn--primary:hover{ filter:brightness(1.06); transform:translateY(-1px); }
.xw-btn--ghost{
  background:rgba(255,255,255,.04);
  border:1px solid var(--xw-line-2);
  color:var(--xw-text);
}
.xw-btn--ghost:hover{ background:rgba(255,255,255,.08); border-color:var(--xw-ember); }
.xw-btn--violet{
  background:linear-gradient(180deg,var(--xw-coral),var(--xw-ember));
  color:#0e0a1e;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset, 0 8px 24px rgba(255,122,47,.22);
}
.xw-btn--violet:hover{ filter:brightness(1.07); transform:translateY(-1px); }
.xw-btn--lg{ padding:16px 32px; font-size:16px; }
.xw-btn--block{ width:100%; }

/* ---------- header ---------- */
.xw-header{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:16px 24px;
  background:rgba(10,11,18,.62);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.xw-logo{ display:flex; align-items:center; gap:10px; font-family:var(--xw-display); font-weight:600; font-size:20px; letter-spacing:-0.02em; }
.xw-logo__mark{
  width:30px; height:30px; border-radius:9px;
  background:radial-gradient(circle at 30% 25%, var(--xw-gold), var(--xw-ember) 70%);
  box-shadow:0 0 18px rgba(255,94,168,.5);
}
.xw-nav{ display:flex; align-items:center; gap:30px; }
.xw-nav a{ color:var(--xw-text-2); font-size:15px; font-weight:500; transition:color .15s; }
.xw-nav a:hover{ color:var(--xw-text); }
.xw-header__cta{ display:flex; align-items:center; gap:12px; }
.xw-badge18{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:26px; padding:0 8px;
  font-size:12px; font-weight:700; letter-spacing:.02em;
  color:var(--xw-gold); border:1px solid var(--xw-gold);
  border-radius:6px; background:rgba(255,194,77,.08);
}
.xw-burger{ display:none; width:42px; height:42px; border-radius:10px; border:1px solid var(--xw-line-2); flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.xw-burger span{ width:18px; height:2px; background:var(--xw-text); border-radius:2px; transition:transform .25s, opacity .25s; }
.xw-mobile{ position:fixed; inset:0; z-index:49; background:var(--xw-bg); transform:translateX(100%); transition:transform .3s var(--xw-ease); display:flex; flex-direction:column; padding:90px 28px 28px; gap:6px; }
.xw-mobile.is-open{ transform:translateX(0); }
.xw-mobile a{ font-family:var(--xw-display); font-size:26px; font-weight:600; padding:14px 0; border-bottom:1px solid var(--xw-line); }
.xw-mobile__cta{ margin-top:auto; display:flex; flex-direction:column; gap:12px; }

/* ---------- hero ---------- */
.xw-hero{ position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden; }
.xw-hero__canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }
.xw-hero::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(10,11,18,.35) 0%, rgba(10,11,18,0) 30%, rgba(10,11,18,.55) 100%); pointer-events:none; }
.xw-hero__inner{ position:relative; z-index:2; width:100%; text-align:center; padding:80px 24px; }
.xw-hero__inner .xw-h1{ margin:22px auto 0; max-width:14ch; }
.xw-hero__inner .xw-lead{ margin:22px auto 0; max-width:52ch; }
.xw-hero__cta{ margin-top:34px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.xw-hero__note{ margin-top:18px; font-size:13px; color:var(--xw-text-3); }

/* ---------- marquee (trust row) ---------- */
.xw-trust{ padding:44px 0; border-top:1px solid rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.04); }
.xw-trust__label{ text-align:center; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--xw-text-3); margin-bottom:26px; }
.xw-marquee{ position:relative; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.xw-marquee__track{ display:flex; gap:56px; width:max-content; animation:xw-scroll 32s linear infinite; }
.xw-marquee__item{ display:flex; align-items:center; gap:9px; color:var(--xw-text-2); font-weight:600; font-size:17px; opacity:.7; white-space:nowrap; }
.xw-marquee__item svg{ width:20px; height:20px; opacity:.85; }
@keyframes xw-scroll{ to{ transform:translateX(-50%); } }

/* ---------- bento / feature grid ---------- */
.xw-grid{ display:grid; gap:14px; }
.xw-grid--2{ grid-template-columns:repeat(2,1fr); }
.xw-grid--3{ grid-template-columns:repeat(3,1fr); }
.xw-grid--4{ grid-template-columns:repeat(4,1fr); }

.xw-card{
  background:var(--xw-surface);
  border:1px solid var(--xw-line);
  border-radius:var(--xw-radius);
  padding:30px;
  position:relative;
  overflow:hidden;
}
.xw-feature{ display:flex; flex-direction:column; gap:14px; min-height:260px; }
.xw-feature__icon{
  width:50px; height:50px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 35% 30%, rgba(255,111,97,.3), rgba(255,194,77,.08));
  border:1px solid var(--xw-line-2);
  color:var(--xw-coral);
}
.xw-feature__icon svg{ width:24px; height:24px; }
.xw-feature h3{ font-size:21px; }
.xw-feature p{ margin:0; color:var(--xw-text-2); font-size:15px; }
.xw-feature--wide{ grid-column:span 2; }

.xw-mini{ display:flex; flex-direction:column; gap:10px; padding:24px; min-height:150px; }
.xw-mini__icon{ color:var(--xw-gold); }
.xw-mini__icon svg{ width:26px; height:26px; }
.xw-mini h4{ margin:0; font-family:var(--xw-display); font-size:17px; font-weight:600; }
.xw-mini p{ margin:0; font-size:14px; color:var(--xw-text-3); }

/* showcase orb cell */
.xw-orb-cell{ position:relative; min-height:300px; padding:0; }
.xw-orb-cell canvas{ position:absolute; inset:0; width:100%; height:100%; border-radius:var(--xw-radius); }
.xw-orb-cell__text{ position:relative; z-index:2; padding:30px; }

/* ---------- showcase browser mock ---------- */
.xw-showcase{ position:relative; }
.xw-browser{
  max-width:980px; margin:0 auto;
  border:1px solid var(--xw-line-2);
  border-radius:var(--xw-radius);
  overflow:hidden;
  background:var(--xw-bg-2);
  box-shadow:0 40px 120px rgba(0,0,0,.5);
}
.xw-browser__bar{ display:flex; align-items:center; gap:14px; padding:13px 16px; border-bottom:1px solid var(--xw-line); background:var(--xw-surface); }
.xw-browser__dots{ display:flex; gap:7px; }
.xw-browser__dots i{ width:11px; height:11px; border-radius:50%; display:block; }
.xw-browser__dots i:nth-child(1){ background:#ff5f57; }
.xw-browser__dots i:nth-child(2){ background:#febc2e; }
.xw-browser__dots i:nth-child(3){ background:#28c840; }
.xw-browser__url{ flex:1; max-width:340px; margin:0 auto; text-align:center; font-size:13px; color:var(--xw-text-3); background:var(--xw-bg); border-radius:7px; padding:6px 12px; }
.xw-browser__body{ aspect-ratio:16/9; background:radial-gradient(circle at 50% 120%, rgba(255,122,47,.25), transparent 60%), var(--xw-bg); display:flex; align-items:center; justify-content:center; }

/* ---------- games ---------- */
.xw-games__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.xw-game-card{
  background:var(--xw-surface);
  border:1px solid var(--xw-line);
  border-radius:var(--xw-radius);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .2s var(--xw-ease), border-color .2s;
}
.xw-game-card:hover{ transform:translateY(-4px); border-color:var(--xw-ember); }
.xw-game-card__thumb{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.xw-game-card__thumb-bg{ position:absolute; inset:0; }
.xw-game-card__thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.xw-game-card__badge{
  position:absolute; top:10px; left:10px; z-index:2;
  font-size:11px; font-weight:600; letter-spacing:.03em;
  padding:5px 10px; border-radius:var(--xw-radius-pill);
  background:rgba(10,11,18,.6); color:#fff; backdrop-filter:blur(6px);
}
.xw-game-card__thumb-name{
  position:absolute; left:14px; bottom:12px; right:14px; z-index:2;
  font-family:var(--xw-display); font-weight:600; font-size:19px;
  text-shadow:0 2px 14px rgba(0,0,0,.6);
}
.xw-game-card__body{ padding:16px; display:flex; flex-direction:column; gap:12px; flex:1; }
.xw-game-card__title{ font-family:var(--xw-display); font-weight:600; font-size:17px; }
.xw-game-card__tags{ display:flex; gap:7px; flex-wrap:wrap; }
.xw-game-card__tag{ font-size:12px; color:var(--xw-text-3); border:1px solid var(--xw-line-2); border-radius:var(--xw-radius-pill); padding:4px 10px; }
.xw-game-card__actions{ margin-top:auto; }

/* ---------- testimonials ---------- */
.xw-quote{ background:var(--xw-surface); border:1px solid var(--xw-line); border-radius:var(--xw-radius); padding:30px; }
.xw-quote__mark{ color:var(--xw-ember); font-size:34px; line-height:1; font-family:var(--xw-display); }
.xw-quote p{ margin:12px 0 20px; color:var(--xw-text); font-size:16px; line-height:1.55; }
.xw-quote__who{ display:flex; align-items:center; gap:12px; }
.xw-quote__av{ width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg,var(--xw-gold),var(--xw-ember)); }
.xw-quote__name{ font-weight:600; font-size:15px; }
.xw-quote__role{ font-size:13px; color:var(--xw-text-3); }

/* ---------- coin tiers ---------- */
.xw-tiers{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:780px; margin:0 auto; }
.xw-tier{ background:var(--xw-surface); border:1px solid var(--xw-line); border-radius:var(--xw-radius); padding:34px; position:relative; overflow:hidden; }
.xw-tier--feat{ border-color:rgba(255,94,168,.5); }
.xw-tier--feat::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(255,122,47,.18), transparent 55%); pointer-events:none; }
.xw-tier__name{ font-family:var(--xw-display); font-weight:600; font-size:20px; position:relative; }
.xw-tier__price{ font-family:var(--xw-display); font-weight:600; font-size:44px; margin:8px 0 4px; position:relative; }
.xw-tier__price span{ font-size:16px; color:var(--xw-text-3); font-weight:500; }
.xw-tier__list{ list-style:none; padding:0; margin:22px 0; display:flex; flex-direction:column; gap:12px; position:relative; }
.xw-tier__list li{ display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--xw-text-2); }
.xw-tier__list svg{ width:18px; height:18px; color:var(--xw-gold); flex:none; margin-top:1px; }

/* ---------- CTA ---------- */
.xw-cta{ position:relative; border:1px solid var(--xw-line-2); border-radius:24px; overflow:hidden; padding:clamp(56px,8vw,96px) 24px; text-align:center; background:var(--xw-bg-2); }
.xw-cta__canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }
.xw-cta__inner{ position:relative; z-index:2; }
.xw-cta__inner .xw-lead{ margin:16px auto 0; max-width:46ch; }
.xw-cta__inner .xw-btn{ margin-top:28px; }

/* ---------- footer ---------- */
.xw-footer{ border-top:1px solid var(--xw-line); padding:64px 24px 40px; }
.xw-footer__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; max-width:var(--xw-maxw); margin:0 auto; }
.xw-footer__brand .xw-logo{ margin-bottom:16px; }
.xw-footer__brand p{ color:var(--xw-text-3); font-size:14px; max-width:32ch; }
.xw-footer__col h5{ margin:0 0 14px; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--xw-text-3); font-weight:600; }
.xw-footer__col a{ display:block; color:var(--xw-text-2); font-size:14px; padding:5px 0; transition:color .15s; }
.xw-footer__col a:hover{ color:var(--xw-text); }
.xw-help{ max-width:var(--xw-maxw); margin:44px auto 0; padding:24px; border:1px solid var(--xw-line); border-radius:var(--xw-radius); background:var(--xw-surface); }
.xw-help h5{ margin:0 0 8px; font-size:14px; color:var(--xw-text); }
.xw-help p{ margin:0; font-size:13px; color:var(--xw-text-2); line-height:1.7; }
.xw-help a{ color:var(--xw-gold); }
.xw-footer__bottom{ max-width:var(--xw-maxw); margin:36px auto 0; padding-top:24px; border-top:1px solid var(--xw-line); display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; align-items:center; }
.xw-footer__bottom p{ margin:0; font-size:13px; color:var(--xw-text-3); }
.xw-footer__legal{ display:flex; gap:18px; flex-wrap:wrap; }
.xw-footer__legal a{ font-size:13px; color:var(--xw-text-3); }
.xw-footer__legal a:hover{ color:var(--xw-text); }

/* ---------- age gate ---------- */
#xw-age-gate, #xw-age-gate *{
  font-family:var(--xw-font);
  box-sizing:border-box;
  letter-spacing:normal;
  text-transform:none;
  line-height:1.5;
}
#xw-age-gate{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  background:rgba(6,7,12,.86); backdrop-filter:blur(8px);
}
html.xw-age-done #xw-age-gate{ display:none; }
.xw-age__box{ max-width:440px; width:100%; background:var(--xw-surface); border:1px solid var(--xw-line-2); border-radius:var(--xw-radius); padding:40px 34px; text-align:center; }
.xw-age__mark{ width:54px; height:54px; border-radius:14px; margin:0 auto 20px; background:radial-gradient(circle at 30% 25%, var(--xw-gold), var(--xw-ember) 70%); box-shadow:0 0 28px rgba(255,94,168,.5); }
.xw-age__box h2{ font-family:var(--xw-display); font-weight:600; font-size:26px; margin:0 0 10px; }
.xw-age__box p{ color:var(--xw-text-2); font-size:14px; margin:0 0 26px; }
.xw-age__btns{ display:flex; flex-direction:column; gap:10px; }
.xw-age__deny{ color:var(--xw-text-3); font-size:13px; padding:10px; }
.xw-age__deny:hover{ color:var(--xw-text-2); }

/* ---------- cookie banner ---------- */
#xw-cookie{ position:fixed; left:24px; right:24px; bottom:24px; z-index:120; max-width:520px; margin:0 auto; background:var(--xw-surface-2); border:1px solid var(--xw-line-2); border-radius:var(--xw-radius); padding:20px 22px; display:none; box-shadow:0 20px 60px rgba(0,0,0,.5); }
#xw-cookie.is-show{ display:block; }
#xw-cookie p{ margin:0 0 14px; font-size:13px; color:var(--xw-text-2); line-height:1.6; }
#xw-cookie a{ color:var(--xw-gold); }
.xw-cookie__btns{ display:flex; gap:10px; }

/* ---------- game modal ---------- */
#xw-modal{ position:fixed; inset:0; z-index:150; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(6,7,12,.9); backdrop-filter:blur(8px); }
#xw-modal.is-open{ display:flex; }
.xw-modal__box{ width:100%; max-width:1000px; height:min(80vh,720px); background:#000; border:1px solid var(--xw-line-2); border-radius:var(--xw-radius); overflow:hidden; display:flex; flex-direction:column; position:relative; }
.xw-modal__bar{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:var(--xw-surface); border-bottom:1px solid var(--xw-line); }
.xw-modal__title{ font-family:var(--xw-display); font-weight:600; font-size:15px; }
.xw-modal__tools{ display:flex; gap:8px; }
.xw-modal__btn{ width:34px; height:34px; border-radius:8px; border:1px solid var(--xw-line-2); display:flex; align-items:center; justify-content:center; color:var(--xw-text-2); transition:background .15s,color .15s; }
.xw-modal__btn:hover{ background:rgba(255,255,255,.06); color:var(--xw-text); }
.xw-modal__btn svg{ width:17px; height:17px; }
.xw-modal__frame{ flex:1; position:relative; background:#000; }
.xw-modal__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.xw-modal__spin{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.xw-modal__spin i{ width:42px; height:42px; border-radius:50%; border:3px solid rgba(255,255,255,.15); border-top-color:var(--xw-coral); animation:xw-spin .8s linear infinite; }
@keyframes xw-spin{ to{ transform:rotate(360deg); } }

/* ---------- legal popups ---------- */
.xw-pop{ position:fixed; inset:0; z-index:160; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(6,7,12,.88); backdrop-filter:blur(8px); }
.xw-pop.is-open{ display:flex; }
.xw-pop__box{ width:100%; max-width:760px; max-height:84vh; overflow-y:auto; background:var(--xw-surface); border:1px solid var(--xw-line-2); border-radius:var(--xw-radius); padding:0; }
.xw-pop__head{ position:sticky; top:0; display:flex; align-items:center; justify-content:space-between; padding:22px 28px; background:var(--xw-surface); border-bottom:1px solid var(--xw-line); }
.xw-pop__head h2{ font-family:var(--xw-display); font-weight:600; font-size:22px; margin:0; }
.xw-pop__body{ padding:24px 28px 32px; }
.xw-pop__body h3{ font-family:var(--xw-display); font-size:17px; margin:24px 0 8px; color:var(--xw-text); }
.xw-pop__body h3:first-child{ margin-top:0; }
.xw-pop__body p, .xw-pop__body li{ font-size:14px; color:var(--xw-text-2); line-height:1.7; }
.xw-pop__body ul{ padding-left:20px; }
.xw-pop__close{ width:36px; height:36px; border-radius:8px; border:1px solid var(--xw-line-2); display:flex; align-items:center; justify-content:center; color:var(--xw-text-2); font-size:20px; line-height:1; }
.xw-pop__close:hover{ background:rgba(255,255,255,.06); color:var(--xw-text); }

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

/* ---------- responsive ---------- */
@media (max-width:980px){
  .xw-footer__top{ grid-template-columns:1fr 1fr; gap:30px; }
}
@media (max-width:760px){
  .xw-nav, .xw-header__cta .xw-btn{ display:none; }
  .xw-burger{ display:flex; }
  .xw-grid--2, .xw-grid--3, .xw-grid--4{ grid-template-columns:1fr; }
  .xw-feature--wide{ grid-column:auto; }
  .xw-games__grid{ grid-template-columns:repeat(2,1fr); }
  .xw-tiers{ grid-template-columns:1fr; }
  .xw-footer__top{ grid-template-columns:1fr; }
  .xw-footer__bottom{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:440px){
  .xw-games__grid{ grid-template-columns:1fr; }
  .xw-wrap{ padding:0 18px; }
}

@media (prefers-reduced-motion:reduce){
  .xw-marquee__track{ animation:none; }
  .xw-reveal{ transition:none; opacity:1; transform:none; }
  html{ scroll-behavior:auto; }
}

/* ============================================================
   ПОНТЫ — neon borders, cursor spotlight, 3D coin, counters, particles
   ============================================================ */

/* particle layer behind everything (body becomes transparent, html holds base) */
html{ background:var(--xw-bg); }
body{ background:transparent; }
.xw-fx{ position:fixed; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }

@property --xw-a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }

/* --- premium card treatment: gradient border + cursor spotlight + hover lift glow --- */
.xw-card, .xw-feature, .xw-quote, .xw-tier, .xw-game-card{
  position:relative;
  transition:transform .35s var(--xw-ease), box-shadow .35s var(--xw-ease), border-color .35s var(--xw-ease);
}
/* animated conic gradient ring (border-only via mask), shown on hover */
.xw-card::before, .xw-feature::before, .xw-quote::before, .xw-tier::before, .xw-game-card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1.5px;
  background:conic-gradient(from var(--xw-a), var(--xw-ember), var(--xw-pink), var(--xw-gold), var(--xw-cyan), var(--xw-ember));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .35s var(--xw-ease); pointer-events:none; z-index:2;
}
/* cursor spotlight glow */
.xw-card::after, .xw-feature::after, .xw-quote::after, .xw-tier::after, .xw-game-card::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:1;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%), rgba(255,140,70,.14), transparent 60%);
  opacity:0; transition:opacity .35s var(--xw-ease);
}
.xw-card:hover, .xw-feature:hover, .xw-quote:hover, .xw-tier:hover, .xw-game-card:hover{
  transform:translateY(-5px);
  border-color:transparent;
  box-shadow:0 20px 50px -18px rgba(255,94,120,.45), 0 0 30px -10px rgba(255,122,47,.4);
}
.xw-card:hover::before, .xw-feature:hover::before, .xw-quote:hover::before,
.xw-tier:hover::before, .xw-game-card:hover::before{ opacity:1; animation:xw-rot 4.5s linear infinite; }
.xw-card:hover::after, .xw-feature:hover::after, .xw-quote:hover::after,
.xw-tier:hover::after, .xw-game-card:hover::after{ opacity:1; }
@keyframes xw-rot{ to{ --xw-a:360deg; } }

/* feature & tier get a permanent soft gradient edge even at rest */
.xw-feature, .xw-tier{
  background-image:linear-gradient(var(--xw-surface),var(--xw-surface)), linear-gradient(135deg, rgba(255,122,47,.35), rgba(255,94,168,.25), rgba(255,194,77,.18));
  background-origin:border-box; background-clip:padding-box, border-box;
  border:1px solid transparent;
}

/* buttons: glossy sweep on hover */
.xw-btn--primary, .xw-btn--ember{ position:relative; overflow:hidden; }
.xw-btn--primary::after, .xw-btn--ember::after{
  content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(110deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg); transition:left .55s var(--xw-ease); pointer-events:none;
}
.xw-btn--primary:hover::after, .xw-btn--ember:hover::after{ left:140%; }

/* --- 3D spinning coin --- */
.xw-coin{ width:120px; height:120px; max-width:120px; max-height:120px; flex:0 0 auto; perspective:800px; margin:0 auto 26px; overflow:hidden; }
.xw-coin__in{ position:relative; width:100%; height:100%; transform-style:preserve-3d; animation:xw-coin-spin 7s linear infinite; }
.xw-coin__edge{ position:absolute; inset:6px; border-radius:50%; transform:translateZ(-7px);
  background:#9a6a1a; box-shadow:0 0 0 3px #7d5512, 0 0 26px rgba(255,150,40,.5); }
.xw-coin__f{ position:absolute; inset:0; border-radius:50%; backface-visibility:hidden; overflow:hidden;
  background:radial-gradient(circle at 36% 30%, #ffe6a6, #ffc24d 42%, #ef9f33 72%, #b8791f 100%);
  box-shadow:inset 0 0 0 7px rgba(255,255,255,.2), inset 0 -12px 26px rgba(120,70,10,.5);
  display:flex; align-items:center; justify-content:center; }
.xw-coin__f svg{ width:48%; height:48%; color:#7a4a10; filter:drop-shadow(0 2px 3px rgba(120,60,0,.5)); }
.xw-coin__f--b{ transform:rotateY(180deg); }
.xw-coin__f::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.6) 48%, transparent 62%);
  mix-blend-mode:screen; animation:xw-coin-sheen 7s linear infinite; }
@keyframes xw-coin-spin{ to{ transform:rotateY(360deg); } }
@keyframes xw-coin-sheen{ 0%{ transform:translateX(-30%);} 50%{ transform:translateX(30%);} 100%{ transform:translateX(-30%);} }

/* --- stats / counters band --- */
.xw-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.xw-stat{ text-align:center; padding:30px 18px; border-radius:var(--xw-radius); position:relative; overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  border:1px solid var(--xw-line); }
.xw-stat::before{ content:""; position:absolute; inset:0; opacity:.5;
  background:radial-gradient(circle at 50% -20%, rgba(255,122,47,.22), transparent 60%); pointer-events:none; }
.xw-stat__num{ font-family:var(--xw-display); font-weight:700; font-size:clamp(30px,4.2vw,48px); line-height:1;
  background:linear-gradient(100deg,var(--xw-gold),var(--xw-coral) 55%,var(--xw-pink));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.xw-stat__lbl{ margin-top:12px; color:var(--xw-text-2); font-size:14px; position:relative; }

/* entrance animation helper (used by JS) */
.xw-pop-in{ opacity:0; transform:translateY(26px) scale(.98); transition:opacity .6s var(--xw-ease), transform .6s var(--xw-ease); }
.xw-pop-in.is-in{ opacity:1; transform:none; }

@media (max-width:760px){
  .xw-stats{ grid-template-columns:repeat(2,1fr); }
  .xw-coin{ width:96px; height:96px; }
}
@media (prefers-reduced-motion:reduce){
  .xw-coin__in{ animation:none; }
  .xw-coin__f::after{ animation:none; }
  .xw-card:hover::before, .xw-feature:hover::before, .xw-tier:hover::before,
  .xw-quote:hover::before, .xw-game-card:hover::before{ animation:none; }
}