/* =========================================================
   PINEFORGE COLLECTIVE — Home
   A gameplay-led hero, a bento of real game art, the studio, services,
   the product hub and contact. Shared pieces live in css/editorial.css.
   ========================================================= */

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.home-hero {
  position:relative;
  min-height:max(660px,100svh);
  display:grid;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:clamp(118px,13vh,150px) var(--ed-inline) clamp(92px,11vh,120px) !important;
  background:
    radial-gradient(52rem 40rem at 78% 52%,color-mix(in srgb,var(--forge-copper) 24%,transparent),transparent 70%),
    radial-gradient(40rem 34rem at 6% 18%,rgba(67,119,79,.22),transparent 72%);
}
:root[data-theme="light"] .home-hero {
  background:
    radial-gradient(52rem 40rem at 78% 52%,rgba(201,140,92,.22),transparent 70%),
    radial-gradient(40rem 34rem at 6% 18%,rgba(122,164,105,.24),transparent 72%);
}
.home-hero::after { display:none !important; }
.home-hero > .section-motion-wash { display:none; }

.home-hero-content {
  position:relative;
  z-index:3;
  width:min(100%,640px);
}
.home-hero .hero-mark-wrap[data-forge-emblem] {
  position:relative;
  width:92px;
  height:106px;
  margin:0 0 18px -8px;
}
.home-hero .eyebrow { margin-bottom:22px; }
.home-hero h1 {
  margin:0;
  font:500 clamp(44px,5.25vw,80px)/.98 var(--font-display);
  letter-spacing:-.052em;
  text-wrap:balance;
}
.home-hero h1 span {
  background:var(--ed-heading-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  padding-bottom:.08em;
}
.home-hero .hero-copy {
  margin:26px 0 0;
  max-width:34em;
  color:var(--text-secondary);
  font-size:clamp(16px,1.25vw,18.5px);
  line-height:1.7;
}
.home-hero .hero-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px 22px;
  margin-top:36px;
}
.hero-trailer {
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:6px 18px 6px 6px;
  border:1px solid var(--ed-line-strong);
  border-radius:999px;
  background:color-mix(in srgb,var(--bg-primary) 40%,transparent);
  color:var(--text-primary);
  font:600 13px/1 var(--font-display);
  cursor:pointer;
  transition:border-color .3s ease,background .3s ease,transform .3s var(--ease);
}
.hero-trailer small { color:var(--text-secondary); font:500 11px/1 var(--font-mono); }
.hero-trailer-icon {
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--text-primary);
  color:var(--bg-primary);
  transition:transform .35s var(--ease);
}
.hero-trailer-icon svg { width:16px; height:16px; fill:currentColor; margin-left:2px; }
.hero-trailer:hover { border-color:var(--ed-ember); transform:translateY(-2px); }
.hero-trailer:hover .hero-trailer-icon { transform:scale(1.08); }

.hero-tags {
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  margin:44px 0 0;
  padding:0;
  list-style:none;
  color:var(--text-secondary);
  font:600 10.5px/1 var(--font-display);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.hero-tags li { display:inline-flex; align-items:center; gap:14px; }
.hero-tags li + li::before {
  content:"";
  width:4px;
  height:4px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--ed-ember);
}

/* Gameplay reel: three slow columns of real screenshots on a tilted plane. */
.hero-reel {
  position:absolute;
  z-index:1;
  top:0;
  right:0;
  bottom:0;
  width:min(60vw,900px);
  pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,transparent 0,#000 16%,#000 82%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,transparent 0,#000 16%,#000 82%,transparent 100%);
  mask-composite:intersect;
}
.hero-reel-plane {
  position:absolute;
  top:50%;
  left:56%;
  display:flex;
  gap:20px;
  transform:translate(-50%,-50%) perspective(2000px) rotateX(12deg) rotateZ(11deg);
  transform-origin:center;
}
.hero-reel-column { --strip-h:1361px; --strip-x:0px; width:220px; flex:0 0 auto; }
.hero-reel-column--b { --strip-x:-220px; margin-top:-180px; }
.hero-reel-column--c { --strip-h:1768px; --strip-x:-440px; margin-top:-60px; }
.hero-reel-track {
  display:flex;
  flex-direction:column;
  will-change:transform;
  animation:heroReelUp 70s linear infinite;
}
.hero-reel-column--b .hero-reel-track { animation-name:heroReelDown; animation-duration:84s; }
.hero-reel-column--c .hero-reel-track { animation-duration:96s; }
.hero-reel-frame { display:block; width:220px; height:var(--strip-h); overflow:hidden; }
.hero-reel-frame img {
  display:block;
  width:660px;
  max-width:none;
  height:auto;
  margin-left:var(--strip-x);
  filter:saturate(.92) brightness(.92);
}
:root[data-theme="light"] .hero-reel-frame img { filter:saturate(.95); }
@keyframes heroReelUp { from { transform:translate3d(0,0,0); } to { transform:translate3d(0,-50%,0); } }
@keyframes heroReelDown { from { transform:translate3d(0,-50%,0); } to { transform:translate3d(0,0,0); } }
.motion-paused .hero-reel-track,
.motion-document-hidden .hero-reel-track,
.home-hero.is-offscreen .hero-reel-track { animation-play-state:paused; }

.home-hero .scroll-cue {
  position:absolute;
  z-index:3;
  left:var(--ed-inline);
  bottom:32px;
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:var(--text-secondary);
  font:600 10px/1 var(--font-display);
  letter-spacing:.2em;
  text-transform:uppercase;
}
.home-hero .scroll-cue i {
  position:relative;
  width:48px;
  height:1px;
  overflow:hidden;
  background:var(--ed-line-strong);
}
.home-hero .scroll-cue i::before {
  content:"";
  position:absolute;
  inset:0;
  width:40%;
  background:var(--ed-ember);
  animation:homeScrollCue 2.4s var(--ease) infinite;
}
@keyframes homeScrollCue { from { transform:translateX(-100%); } to { transform:translateX(260%); } }
.motion-paused .home-hero .scroll-cue i::before { animation-play-state:paused; }

/* ---------------------------------------------------------
   Games bento — every cover at its own proportion
   --------------------------------------------------------- */
.games-bento {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0 18px;
  margin:clamp(44px,5vw,64px) 0 0;
  padding:0;
  list-style:none;
}
.game-slot {
  display:grid;
  grid-row:span 2;
  grid-template-rows:subgrid;
  min-width:0;
  margin-bottom:18px;
}
.game-slot--wide { grid-column:span 2; }
.game-tile {
  --tile-accent:var(--accent-primary);
  position:relative;
  display:grid;
  grid-row:1 / span 2;
  grid-template-rows:subgrid;
  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid var(--ed-line);
  border-radius:var(--ed-radius);
  background:var(--ed-card);
  color:var(--text-primary);
  text-align:left;
  cursor:pointer;
  isolation:isolate;
  transition:transform .5s var(--ease),border-color .35s ease,box-shadow .5s ease;
}
.game-tile-art {
  position:relative;
  display:block;
  aspect-ratio:1;
  overflow:hidden;
  background:color-mix(in srgb,var(--tile-accent) 24%,var(--bg-secondary));
}
.game-slot--wide .game-tile-art { aspect-ratio:2 / 1; }
.game-tile-art::before {
  content:"";
  position:absolute;
  inset:-24px;
  filter:blur(24px) saturate(1.25) brightness(.78);
}
.game-tile-art img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 1s var(--ease);
}
.game-tile-art::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:38%;
  background:linear-gradient(to top,rgba(4,9,6,.34),transparent);
  pointer-events:none;
}
.game-tile-meta {
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  align-items:start;
  gap:14px;
  padding:16px 16px 18px;
}
.game-tile-text { display:block; min-width:0; }
.game-tile-text small {
  display:block;
  color:color-mix(in srgb,var(--tile-accent) 58%,var(--text-secondary));
  font:600 10px/1.3 var(--font-display);
  letter-spacing:.13em;
  text-transform:uppercase;
}
:root[data-theme="light"] .game-tile-text small { color:color-mix(in srgb,var(--tile-accent) 36%,var(--text-primary)); }
.game-tile-text strong {
  display:block;
  margin-top:6px;
  font:600 19px/1.15 var(--font-display);
  letter-spacing:-.02em;
}
.game-tile-copy {
  display:-webkit-box;
  margin-top:7px;
  overflow:hidden;
  color:var(--text-secondary);
  font-size:13.5px;
  line-height:1.5;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  min-height:3em;
}
.game-tile-arrow {
  position:absolute;
  z-index:2;
  top:14px;
  right:14px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(244,242,233,.28);
  border-radius:50%;
  background:rgba(6,12,8,.52);
  color:#f4f2e9;
  font-style:normal;
  font-size:14px;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .35s var(--ease);
}
.game-tile:hover,
.game-tile:focus-visible {
  transform:translateY(-4px);
  border-color:color-mix(in srgb,var(--tile-accent) 55%,transparent);
  box-shadow:0 28px 60px -30px color-mix(in srgb,var(--tile-accent) 70%,transparent);
}
.game-tile:hover .game-tile-art img,
.game-tile:focus-visible .game-tile-art img { transform:scale(1.045); }
.game-tile:hover .game-tile-arrow,
.game-tile:focus-visible .game-tile-arrow {
  border-color:transparent;
  background:var(--tile-accent);
  color:#08100b;
  transform:translate(2px,-2px);
}
.game-tile:focus-visible { outline:2px solid var(--tile-accent); outline-offset:3px; }
.games-swipe-hint { display:none; }

/* ---------------------------------------------------------
   Studio and trailer
   --------------------------------------------------------- */
.studio-showcase {
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  align-items:center;
  gap:clamp(40px,6vw,96px);
}

.studio-copy { min-width:0; }
.studio-copy .studio-lead {
  margin:28px 0 0;
  color:var(--text-primary);
  font:500 clamp(18px,1.6vw,21px)/1.5 var(--font-display);
  letter-spacing:-.01em;
}
.studio-copy > p:not(.eyebrow):not(.studio-lead) { margin:16px 0 0; color:var(--text-secondary); font-size:16px; line-height:1.7; }
.studio-stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:36px 0 34px;
  border-top:1px solid var(--ed-line);
}
.studio-stats > div {
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:22px 18px 0 0;
}
.studio-stats > div + div { padding-left:18px; border-left:1px solid var(--ed-line); }
.studio-stats dd { display:contents; margin:0; }
.studio-stats dd b {
  order:-1;
  color:var(--ed-ember);
  font:500 clamp(34px,3.4vw,46px)/1 var(--font-display);
  letter-spacing:-.04em;
  font-variant-numeric:tabular-nums;
}
.studio-stats dt { color:var(--text-primary); font:600 14px/1.3 var(--font-display); }
.studio-stats dd small { color:var(--text-secondary); font:400 12.5px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }

/* ---------------------------------------------------------
   Services
   --------------------------------------------------------- */
.service-list {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:clamp(44px,5vw,64px) 0 0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--ed-line);
  border-left:1px solid var(--ed-line);
}
.service-item {
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;
  align-content:start;
  gap:0 18px;
  min-width:0;
  padding:clamp(26px,3vw,38px);
  border-right:1px solid var(--ed-line);
  border-bottom:1px solid var(--ed-line);
  overflow:hidden;
  transition:background .4s ease;
}
.service-item:hover { background:var(--ed-card); }
.service-icon {
  grid-row:span 3;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--ed-ember) 34%,transparent);
  border-radius:14px;
  color:var(--ed-ember);
  background:color-mix(in srgb,var(--ed-ember) 8%,transparent);
}
.service-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.service-index { color:var(--text-secondary); font:500 11px/1 var(--font-mono); letter-spacing:.08em; }
.service-item h3 { margin:12px 0 0; font:600 20px/1.2 var(--font-display); letter-spacing:-.02em; }
.service-item p { margin:10px 0 0; color:var(--text-secondary); font-size:15px; line-height:1.65; }

/* ---------------------------------------------------------
   Product hub
   --------------------------------------------------------- */
.app-feature { padding-top:0 !important; }
.app-feature-card {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:center;
  gap:clamp(32px,4vw,56px);
  min-height:460px;
  padding:clamp(32px,5vw,64px);
  overflow:hidden;
  border:1px solid var(--ed-line);
  border-radius:calc(var(--ed-radius) + 8px);
  background:
    radial-gradient(36rem 26rem at 92% 110%,color-mix(in srgb,var(--forge-copper) 22%,transparent),transparent 72%),
    radial-gradient(30rem 24rem at 0% 0%,rgba(67,119,79,.26),transparent 70%),
    var(--ed-card);
  isolation:isolate;
}
:root[data-theme="light"] .app-feature-card {
  background:
    radial-gradient(36rem 26rem at 92% 110%,rgba(201,140,92,.2),transparent 72%),
    radial-gradient(30rem 24rem at 0% 0%,rgba(122,164,105,.24),transparent 70%),
    var(--ed-card);
}
.app-feature-copy { position:relative; z-index:2; }
.app-feature-copy p:not(.eyebrow) { margin:22px 0 32px; max-width:40ch; color:var(--text-secondary); font-size:16px; line-height:1.7; }
.app-feature-media { position:relative; min-height:340px; }
.app-shot-web {
  position:absolute;
  top:50%;
  right:12%;
  width:88%;
  height:auto;
  border:1px solid var(--ed-line-strong);
  border-radius:14px;
  box-shadow:var(--ed-shadow);
  transform:translateY(-54%) rotate(-2.5deg);
}
.app-shot-mobile {
  position:absolute;
  right:0;
  bottom:-8%;
  width:min(31%,170px);
  height:auto;
  border:1px solid var(--ed-line-strong);
  border-radius:20px;
  box-shadow:var(--ed-shadow);
  transform:rotate(3deg);
}
.app-shot-web--light,
.app-shot-mobile--light,
:root[data-theme="light"] .app-shot-web--dark,
:root[data-theme="light"] .app-shot-mobile--dark { display:none; }
:root[data-theme="light"] .app-shot-web--light,
:root[data-theme="light"] .app-shot-mobile--light { display:block; }

/* ---------------------------------------------------------
   Follow band
   --------------------------------------------------------- */
.follow-band {
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  align-items:center;
  gap:32px clamp(32px,5vw,72px);
  padding-top:0 !important;
}
.follow-band h2 { font-size:clamp(30px,3.2vw,44px) !important; }
.follow-band .social-links {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

/* ---------------------------------------------------------
   Contact
   --------------------------------------------------------- */
.contact-section {
  display:grid;
  grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  align-items:start;
  gap:clamp(40px,6vw,96px);
  border-top:1px solid var(--ed-line);
}
.contact-section::after { display:none !important; }
.contact-intro { min-width:0; }
.contact-section h2 { font-size:clamp(40px,5vw,72px) !important; }
.contact-intro > p:not(.eyebrow) { margin:24px 0 0; max-width:40ch; color:var(--text-secondary); font-size:16px; line-height:1.7; }
.contact-link {
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:30px;
  padding-bottom:8px;
  border-bottom:1px solid var(--ed-line-strong);
  font:500 clamp(18px,2vw,24px)/1.2 var(--font-display);
  letter-spacing:-.02em;
  overflow-wrap:anywhere;
  transition:border-color .3s ease;
}
.contact-link span { color:var(--ed-ember); }
.contact-link:hover { border-color:var(--ed-ember); }
.contact-options { display:grid; gap:12px; margin:34px 0 0; padding:0; list-style:none; }
.contact-options a {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px 16px;
  padding:18px 20px;
  overflow:hidden;
  border:1px solid var(--ed-line);
  border-radius:16px;
  background:var(--ed-card);
  transition:border-color .3s ease,transform .4s var(--ease);
}
.contact-options small { color:var(--text-secondary); font:600 10px/1 var(--font-display); letter-spacing:.14em; text-transform:uppercase; }
.contact-options b { grid-row:2; font:600 16px/1.2 var(--font-display); }
.contact-options span { grid-row:1 / span 2; align-self:center; color:var(--ed-ember); }
.contact-options a:hover { transform:translateY(-2px); border-color:var(--ed-line-strong); }

.contact-section .project-brief {
  position:relative;
  margin:0;
  padding:clamp(24px,3.4vw,40px);
  overflow:hidden;
  border:1px solid var(--ed-line);
  border-radius:calc(var(--ed-radius) + 4px);
  background:var(--ed-card);
  box-shadow:var(--ed-shadow);
}
.contact-section .project-brief {
  width:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:24px;
}
.contact-section .project-brief-heading .eyebrow { margin-bottom:14px; }
.contact-section .project-brief-heading h3 { margin:0; font:600 clamp(24px,2.4vw,30px)/1.15 var(--font-display); letter-spacing:-.03em; }
.contact-section .project-brief-heading > p:last-child { margin:10px 0 0; max-width:52ch; font-size:13.5px; line-height:1.6; }
.contact-section .project-brief label { font-size:11px; letter-spacing:.02em; }
.contact-section .project-brief input,
.contact-section .project-brief select,
.contact-section .project-brief textarea { font-size:14px; }
.contact-section .brief-consent,
.contact-section .project-brief-actions,
.contact-section .brief-privacy { grid-column:1 / -1; }
.contact-section .brief-consent { font:400 12.5px/1.55 var(--font-body) !important; }
.contact-section .project-brief-actions .button-primary,
.contact-section .project-brief-actions .button-secondary { min-height:48px; padding:0 22px; font-size:12px; }
.contact-section .brief-status { font-size:12px; }
.contact-section .brief-privacy { margin-top:-6px; }
.brief-privacy { margin:18px 0 0; color:var(--text-secondary); font-size:12.5px; line-height:1.6; }
.brief-privacy button {
  margin:0 0 0 6px;
  padding:0;
  border:0;
  background:none;
  color:var(--text-primary);
  font:inherit;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}

/* ---------------------------------------------------------
   Opening hand-off for the new hero
   --------------------------------------------------------- */
.intro-pending:not(.intro-leaving) .home-hero-content > :is(.eyebrow,h1,.hero-copy,.hero-actions,.hero-tags),
.intro-pending:not(.intro-leaving) .home-hero > :is(.hero-reel,.scroll-cue) {
  opacity:0;
  translate:0 16px;
}
:is(.intro-leaving,.intro-settling) .home-hero-content > :is(.eyebrow,h1,.hero-copy,.hero-actions,.hero-tags),
:is(.intro-leaving,.intro-settling) .home-hero > :is(.hero-reel,.scroll-cue) {
  transition:opacity .7s ease,translate .8s cubic-bezier(.2,.8,.2,1);
  transition-delay:calc(var(--intro-order,0) * 70ms + 160ms);
}
.home-hero-content > h1 { --intro-order:1; }
.home-hero-content > .hero-copy { --intro-order:2; }
.home-hero-content > .hero-actions { --intro-order:3; }
.home-hero-content > .hero-tags,
.home-hero > .scroll-cue { --intro-order:4; }
.home-hero > .hero-reel { --intro-order:5; }

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */
@media (max-width:1180px) {
  .hero-reel {
    width:min(54vw,640px);
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 46%),linear-gradient(180deg,transparent 0,#000 16%,#000 82%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 46%),linear-gradient(180deg,transparent 0,#000 16%,#000 82%,transparent 100%);
  }
  .hero-reel-plane { left:64%; transform:translate(-50%,-50%) perspective(2000px) rotateX(12deg) rotateZ(11deg) scale(.86); }
  .home-hero-content { width:min(100%,520px); }
  .home-hero .hero-copy { max-width:28em; }
  .follow-band { grid-template-columns:1fr; }
}

@media (max-width:1099px) {
  .games-bento { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .studio-showcase { grid-template-columns:1fr; }
  .studio-copy { max-width:720px; }
  .service-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .app-feature-card { grid-template-columns:1fr; min-height:0; }
  .app-feature-media { min-height:0; aspect-ratio:16 / 9; }
  .contact-section { grid-template-columns:1fr; }
  .contact-intro { max-width:720px; }
}

@media (max-width:860px) {
  .home-hero { align-items:start; min-height:0; padding-bottom:0 !important; }
  .home-hero-content { width:100%; }
  .hero-reel {
    order:2;
    position:relative;
    top:auto;
    right:auto;
    bottom:auto;
    width:auto;
    height:clamp(260px,62vw,420px);
    margin:44px calc(-1 * var(--ed-inline)) 0;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%);
  }
  .hero-reel-plane { left:50%; transform:translate(-50%,-50%) rotateZ(-12deg) scale(.78); }
  .home-hero .scroll-cue { display:none; }
}

@media (max-width:719px) {
  .games-bento {
    display:flex;
    gap:14px;
    margin-inline:calc(-1 * var(--ed-inline));
    padding:4px var(--ed-inline) 6px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--ed-inline);
    scrollbar-width:none;
  }
  .games-bento::-webkit-scrollbar { display:none; }
  .game-slot,
  .game-slot--wide { display:flex; flex:0 0 auto; width:min(80vw,320px); margin:0; scroll-snap-align:start; }
  .game-tile { display:flex; flex-direction:column; }
  .game-tile-art,
  .game-slot--wide .game-tile-art { aspect-ratio:3 / 2; flex:0 0 auto; }
  .game-tile-art::before { background:var(--tile-cover) center / cover no-repeat; }
  .game-tile-art img { object-fit:contain; }
  .game-tile-art::after { display:none; }
  .game-tile:hover { transform:none; }
  .games-swipe-hint {
    display:flex;
    align-items:center;
    gap:12px;
    margin:18px 0 0;
    color:var(--text-secondary);
    font:600 10px/1 var(--font-display);
    letter-spacing:.18em;
    text-transform:uppercase;
  }
  .games-swipe-hint i { position:relative; width:36px; height:1px; background:var(--ed-line-strong); }
  .games-swipe-hint i::after { content:"→"; position:absolute; right:-14px; top:-7px; font-style:normal; letter-spacing:0; color:var(--ed-ember); }
  .studio-stats > div { padding-right:10px; }
  .studio-stats > div + div { padding-left:12px; }
  .service-list { grid-template-columns:1fr; }
  .app-feature-card { padding:28px 22px 0; border-radius:var(--ed-radius); }
  .app-feature-media { aspect-ratio:4 / 3; margin-inline:-8px; }
  .app-shot-web { right:18%; width:84%; }
  .app-shot-mobile { width:34%; bottom:-4%; }
  .follow-band .social-links { grid-template-columns:1fr; }
  .contact-options a { padding:16px 18px; }
}

@media (max-width:400px) {
  .home-hero h1 { font-size:42px; }
  .studio-stats { grid-template-columns:1fr; }
  .studio-stats > div,
  .studio-stats > div + div { display:grid; grid-template-columns:auto 1fr; gap:2px 18px; padding:16px 0; border-left:0; border-bottom:1px solid var(--ed-line); }
  .studio-stats dd b { grid-row:span 2; align-self:center; }
}

@media (max-height:720px) and (min-width:861px) {
  .home-hero .hero-mark-wrap[data-forge-emblem] { width:72px; height:84px; margin-bottom:10px; }
  .hero-tags { margin-top:30px; }
}

@media (prefers-reduced-motion:reduce) {
  .hero-reel-track,
  .home-hero .scroll-cue i::before { animation:none !important; }
  .game-tile,
  .game-tile-art img,
  .contact-options a { transition:none !important; }
}

@media (forced-colors:active) {
  .home-hero h1 span { color:CanvasText; background:none; }
  .game-tile,
  .contact-options a,
  .app-feature-card,
  .contact-section .project-brief { border-color:CanvasText; }
}

@media print {
  .hero-reel,
  .games-swipe-hint { display:none !important; }
}