/* A loose ring of service cards keeps the centre open and the hero height intact. */
.launch-art--six-services .launch-tile {
  inset: auto;
}
html body#storefrontBody .launch-art--six-services a.launch-tile {
  padding: 12px;
  border-radius: 18px;
  rotate: var(--tile-angle, 0deg);
}
.launch-art--six-services .launch-pass {
  left: var(--pass-pixel-left, 30%);
  top: var(--pass-pixel-top, 11%);
  width: var(--pass-pixel-width, 40%);
  height: var(--pass-pixel-height, 70%);
  border-color: #d9eade66;
  background-clip: padding-box;
  box-shadow: 0 16px 32px -6px #00000066;
}
/* A single contour and soft cast shadow avoid stacked, stepped rims. */
html body#storefrontBody .launch-art--six-services a.launch-tile {
  border-color: #ffffff1a;
  background-clip: padding-box;
  box-shadow: 0 14px 26px -5px #00000073;
}
html body#storefrontBody .launch-art--six-services a.launch-tile:is(:hover, :focus-visible) {
  border-color: #ffffff2b;
  box-shadow: 6px 26px 34px -6px #00000085;
}
.launch-art--six-services .launch-cat { width: 64%; margin-top: 14px; }
.launch-art--six-services .launch-pass-brand { font-size: clamp(21px, 2.2vw, 30px); }
.launch-art--six-services .launch-tile--chatgpt {
  left: 1%; top: 2%; width: 28%; height: 29%; --tile-angle: -7deg;
}
.launch-art--six-services .launch-tile--claude {
  right: 3%; top: 11%; width: 27%; height: 27%; --tile-angle: 8deg;
}
.launch-art--six-services .launch-tile--grok {
  left: 1%;
  top: 39%;
  width: 24%;
  height: 24%;
  --tile-angle: -5deg;
  background-color: #272e32;
  color: #f5f4ed;
  --launch-tile-ink: #f5f4ed;
  --tile-accent: #a8b5ba;
}
.launch-art--six-services .launch-tile--appstore {
  right: 1%;
  top: 45%;
  width: 25%;
  height: 25%;
  --tile-angle: 6deg;
  background-color: #bed0e9;
  color: #223e62;
  --launch-tile-ink: #223e62;
  --tile-accent: #d8e6f9;
}
.launch-art--six-services .launch-tile--codex {
  left: 14%; top: 78%; width: 27%; height: 23%; gap: 4px; --tile-angle: 5deg;
}
.launch-art--six-services .launch-tile--steam {
  right: 16%; top: 77%; width: 28%; height: 23%; --tile-angle: -6deg;
}
.launch-art--six-services .launch-symbol {
  width: 39%;
  height: auto;
  aspect-ratio: 1;
  margin-bottom: 9px;
  flex-shrink: 0;
}
.launch-symbol--grok { --symbol: url('/assets/img/services/grok-symbol-mask-v1.webp'); }
.launch-art--six-services .launch-tile strong {
  font-size: clamp(15px, 1.45vw, 19px);
  line-height: 1.3;
}
.launch-art--six-services .launch-terminal { font-size: clamp(24px, 2.5vw, 32px); }
.launch-art--six-services .launch-tile--codex small {
  font-size: 12px;
  line-height: 1.2;
  margin-top: 2px;
}
@media (max-width: 760px) {
  html body#storefrontBody .launch-art--six-services a.launch-tile {
    padding: 8px;
    border-radius: 14px;
  }
  .launch-art--six-services .launch-pass { padding-inline: 6px; }
  .launch-art--six-services .launch-pass-brand { font-size: clamp(17px, 4.7vw, 23px); }
  .launch-art--six-services .launch-cat { margin-top: 10px; }
  .launch-art--six-services .launch-symbol { width: 35%; margin-bottom: 5px; }
  .launch-art--six-services .launch-tile strong { font-size: clamp(12.2px, 3.4vw, 16px); }
  .launch-art--six-services .launch-terminal { font-size: clamp(18px, 5.6vw, 24px); }
  .launch-art--six-services .launch-tile--codex { gap: 2px; }
  .launch-art--six-services .launch-tile--codex small { font-size: clamp(9px, 2.7vw, 11px); line-height: 1.15; }
}
