/* Visual vitality layer: branded depth, functional colour and restrained motion. */
:root {
  --bg:#0c0d0c;
  --surface:#131512;
  --surface-2:#191c18;
  --surface-3:#20231e;
  --text:#f4f2eb;
  --muted:#b3b2aa;
  --muted-2:#85847c;
  --border:#31342e;
  --border-strong:#4a4e44;
  --accent:#e1c66b;
  --accent-strong:#f0d985;
}

.game-media--ark-survival { --game-accent:#72c792; --game-accent-rgb:114,199,146; }
.game-media--forza-horizon-6 { --game-accent:#68bddd; --game-accent-rgb:104,189,221; }
.game-media--slay-the-spire-2 { --game-accent:#ac8be3; --game-accent-rgb:172,139,227; }
.game-media--the-blood-of-dawnwalker { --game-accent:#e48065; --game-accent-rgb:228,128,101; }
.game-media--wardogs { --game-accent:#dba54e; --game-accent-rgb:219,165,78; }
.game-media--efootball { --game-accent:#58cdb0; --game-accent-rgb:88,205,176; }

/* A quiet, site-specific hero surface using the actual AllGamesDB mark. */
.home-intro {
  position:relative;
  isolation:isolate;
  min-height:460px;
  overflow:hidden;
  margin-top:22px;
  border:1px solid var(--border);
  background:#11130f;
  padding:clamp(54px,6vw,82px) clamp(28px,5vw,72px);
}
.home-intro::before {
  position:absolute;
  z-index:-1;
  top:50%;
  right:5%;
  width:min(34vw,420px);
  aspect-ratio:1;
  background:url('/assets/img/logo.png') center/contain no-repeat;
  content:"";
  filter:grayscale(1);
  opacity:.022;
  transform:translateY(-50%);
}
.home-intro::after {
  position:absolute;
  z-index:-1;
  inset:0 auto 0 0;
  width:3px;
  background:var(--accent);
  content:"";
}
.home-intro h1 { max-width:680px; font-size:clamp(48px,5.7vw,78px); line-height:.98; }
.home-intro .lede { max-width:560px; color:#c4c3bb; }
.search-form--hero { position:relative; z-index:1; }
.search-form--hero > div { border:1px solid var(--border-strong); background:rgba(12,13,12,.78); padding-left:14px; }
.search-form--hero > div:focus-within { border-color:var(--accent); }

/* Game colour is attached to meaning: identity, state and action. */
.game-feature { position:relative; }
.game-feature__media { overflow:hidden; background:var(--surface-2); }
.game-feature__media img { transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .3s ease; }
.game-feature:hover .game-feature__media img { filter:saturate(1.04) contrast(1.04); transform:scale(1.025); }
.game-feature__media .game-badge {
  top:14px;
  bottom:auto;
  left:14px;
  display:grid;
  width:42px;
  height:42px;
  border:1px solid rgba(var(--game-accent-rgb),.55);
  border-radius:3px;
  background:#10120f;
  color:var(--game-accent);
  backdrop-filter:none;
}
.game-feature__media .status { color:var(--game-accent); }
.game-feature__body { border-top:2px solid var(--game-accent); background:var(--surface); padding:20px; }
.game-feature__title p { color:var(--game-accent); }
.category-links a { color:#c3c2ba; }
.game-feature:hover .game-feature__title h3 a { color:var(--game-accent); }

.game-hero { border-bottom:3px solid var(--game-accent); }
.game-hero .game-badge--large {
  display:grid;
  width:48px;
  height:48px;
  border:1px solid rgba(var(--game-accent-rgb),.55);
  border-radius:3px;
  background:#10120f;
  color:var(--game-accent);
  backdrop-filter:none;
}
.game-hero .eyebrow,.game-hero .game-meta dt { color:var(--game-accent); }

/* Feature guides gain compact real imagery and one purposeful icon. */
.intent-grid--editorial { gap:16px; border-top:0; }
.intent-grid--editorial > a.intent-card,
.intent-grid--editorial > a.intent-card:hover {
  display:grid;
  min-height:210px;
  grid-template-columns:180px minmax(0,1fr);
  gap:0;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:3px;
  background:var(--surface);
  padding:0;
}
.intent-card__visual { position:relative; min-height:100%; overflow:hidden; background:var(--surface-2); }
.intent-card__visual::after { position:absolute; inset:0; background:linear-gradient(to top,rgba(10,11,9,.5),transparent 58%); content:""; }
.intent-card__visual img { width:100%; height:100%; object-fit:cover; object-position:var(--game-position,center); transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.intent-card:hover .intent-card__visual img { transform:scale(1.045); }
.intent-card__visual i { position:absolute; z-index:1; right:12px; bottom:12px; display:grid; width:36px; height:36px; place-items:center; border-radius:3px; background:#0e100d; color:var(--game-accent); }
.intent-card__icon { width:19px; height:19px; }
.intent-card__copy { display:flex; min-width:0; flex-direction:column; padding:23px; color:var(--text); font-size:inherit; font-weight:400; letter-spacing:normal; text-transform:none; }
.intent-card__copy small { color:var(--game-accent); font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.intent-card__copy h3 { margin:10px 0 8px; font-size:21px; }
.intent-card__copy p { flex:1; }
.intent-card__copy b { margin-top:16px; color:var(--game-accent); }
.intent-card:hover { border-color:rgba(var(--game-accent-rgb),.72) !important; }

.value-grid article { position:relative; }
.value-icon { color:var(--accent); filter:drop-shadow(0 0 10px rgba(225,198,107,.18)); }
.button-link,.rail-action,.search-form button { transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease; }
.button-link:hover,.rail-action:hover,.search-form button:hover { transform:translateY(-1px); }
.text-link span,.category-card > b,.compact-sample-card > b,.compact-catalog-card__arrow { display:inline-block; transition:transform .2s ease; }
.text-link:hover span,.category-card:hover > b,.compact-sample-card:hover > b,.compact-catalog-card:hover .compact-catalog-card__arrow { transform:translateX(3px); }

/* Elements enter once, subtly; reduced-motion users keep the static layout. */
.motion-ready .reveal-item { opacity:0; transform:translateY(14px); }
.motion-ready .reveal-item.is-revealed { opacity:1; transform:none; transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1); }
@media (prefers-reduced-motion:reduce) {
  .game-feature__media img,.intent-card__visual img,.button-link,.rail-action,.search-form button { transition:none; }
  .game-feature:hover .game-feature__media img,.intent-card:hover .intent-card__visual img { transform:none; }
}

@media (max-width:900px) {
  .home-intro { min-height:auto; grid-template-columns:1fr; gap:42px; padding:58px 40px; }
  .home-intro::before { right:-8%; width:52vw; }
}
@media (max-width:680px) {
  .home-intro { margin-top:14px; padding:46px 22px 42px; }
  .home-intro::before { top:22%; right:-18%; width:70vw; opacity:.018; }
  .home-intro h1 { font-size:clamp(40px,12vw,56px); }
  .intent-grid--editorial > a.intent-card,.intent-grid--editorial > a.intent-card:hover { min-height:0; grid-template-columns:112px minmax(0,1fr); }
  .intent-card__copy { padding:17px; }
  .intent-card__copy h3 { font-size:17px; }
  .intent-card__copy p { display:none; }
}
