/* V195: shared service navigation and responsive desktop alignment. */
body.catalog-page .category-grid,
body.catalog-page .platform-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  grid-auto-rows:1fr;
  align-items:stretch;
  gap:12px!important;
}
body.catalog-page .category-grid > .category-btn,
body.catalog-page .platform-grid > .platform-card {
  grid-column:auto!important;
  justify-self:stretch!important;
  width:100%!important;
  height:100%;
  min-width:0;
  min-height:140px!important;
  padding:20px!important;
  border-radius:18px!important;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:8px;
  text-align:left;
}
body.catalog-page .category-btn strong {
  margin:0;
  font-size:.95rem!important;
  line-height:1.4;
  overflow-wrap:anywhere;
}
body.catalog-page .category-btn > span {
  margin:0;
  font-size:.72rem!important;
  line-height:1.5;
}
body.catalog-page :is(.category-btn,.platform-card,.hero-quick-link) {
  animation:none!important;
  animation-delay:0s!important;
  transform:none!important;
  filter:none!important;
  backdrop-filter:none!important;
  transition:transform 160ms ease,border-color 160ms ease,background-color 160ms ease!important;
}
@media(hover:hover) and (pointer:fine) {
  body.catalog-page :is(.category-btn,.platform-card,.hero-quick-link):hover {
    transform:translateY(-3px)!important;
    border-color:rgba(255,255,255,.32)!important;
    background:#141416!important;
  }
}
body.catalog-page :is(.category-btn,.platform-card,.hero-quick-link):active {
  transform:scale(.98)!important;
}
body.catalog-page :is(.category-btn,.platform-card,.hero-quick-link):focus-visible {
  outline:2px solid #fff;
  outline-offset:4px;
}
@media(min-width:721px) {
  body.catalog-page .hero-layout {
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(320px,.85fr)!important;
    gap:24px!important;
    align-items:stretch!important;
  }
  body.catalog-page .hero-command {
    display:flex!important;
    flex-direction:column;
    min-width:0;
    gap:16px;
    padding:20px!important;
  }
  body.catalog-page .hero-command-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0;
  }
  body.catalog-page .hero-command-head > div {min-width:0}
  body.catalog-page .hero-command-head > small {flex-shrink:0}
  body.catalog-page .hero-quick-links {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-auto-rows:1fr;
    gap:10px;
  }
  body.catalog-page .hero-quick-link {
    display:grid;
    grid-template-columns:36px minmax(0,1fr);
    gap:12px;
    min-height:76px;
    padding:14px;
    margin:0;
  }
  body.catalog-page .hero-quick-copy strong {
    white-space:normal;
    overflow:visible;
    line-height:1.4;
  }
  body.catalog-page .hero-quick-copy small {line-height:1.5}
  body.catalog-page .hero-proof-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin: auto 0 0;
  }
  body.catalog-page .hero-proof-grid article {
    padding:12px 6px;
    text-align:center;
  }
  body.catalog-page .hero-proof-grid span {
    font-size:.56rem;
    letter-spacing:.04em;
    overflow-wrap:anywhere;
  }
}
@media(min-width:721px) and (max-width:1000px) {
  body.catalog-page .hero-layout {grid-template-columns:minmax(0,1fr)!important}
  body.catalog-page .category-grid,
  body.catalog-page .platform-grid {grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:720px) {
  body.catalog-page .category-grid,
  body.catalog-page .platform-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  body.catalog-page .category-grid > .category-btn,
  body.catalog-page .platform-grid > .platform-card {min-height:126px!important;padding:14px!important}
}
@media(max-width:360px) {
  body.catalog-page .category-grid,
  body.catalog-page .platform-grid {grid-template-columns:minmax(0,1fr)!important}
}
@media(prefers-reduced-motion:reduce) {
  body.catalog-page :is(.category-btn,.platform-card,.hero-quick-link) {
    transition:none!important;
    transform:none!important;
  }
}

/* V196: keep the German catalog as a prominent, full-width entry. */
body.catalog-page .platform-grid > .platform-card.platform-card--german {
  grid-column:1 / -1!important;
  min-height:154px!important;
  height:auto;
}
/* One entrance effect for complete blocks, rather than unrelated title effects. */
body.catalog-page:not(.home-view) :is(.section-head,.section-title,.section-title h2,.german-catalog-intro,.german-selection-note,.spotify-promo-card,.category-btn,.platform-card,.sort-bar,.service-card,.catalog-load-more,.new-services-info,.empty) {
  animation:none!important;
}
body.catalog-page .service-card {
  transition:transform 160ms ease,border-color 160ms ease,background-color 160ms ease!important;
}
@media(hover:hover) and (pointer:fine) {
  body.catalog-page .service-card:hover {
    transform:translateY(-3px)!important;
    border-color:rgba(255,255,255,.32)!important;
    background:#141416!important;
  }
}
body.catalog-page .service-card:focus-within {
  border-color:rgba(255,255,255,.32)!important;
}
@media(prefers-reduced-motion:reduce) {
  body.catalog-page .service-card {transition:none!important;transform:none!important}
}

/* V197: stable scroll geometry, small batches and lightweight interaction. */
body.catalog-page:not(.home-view) .autumn-leaves {display:none!important}
body.catalog-page .app-shell {padding-bottom:28px!important}
body.catalog-page .boost-unified-nav {
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  background:#09090a!important;
  box-shadow:none!important;
  animation:none!important;
  transform:none!important;
}
body.catalog-page .service-card {
  content-visibility:visible!important;
  contain-intrinsic-size:none!important;
  contain:layout paint style!important;
  box-shadow:none!important;
  animation:none!important;
  filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  transition:border-color 120ms ease,background-color 120ms ease!important;
  transform:none!important;
  translate:none!important;
}
body.catalog-page .catalog-pagination {overflow-anchor:none;text-align:center;margin:20px 0}
body.catalog-page .catalog-progress {color:#aaa;font-size:.78rem;line-height:1.5;margin:0 0 10px}
body.catalog-page .catalog-load-more {min-height:48px;justify-content:center;margin:0 auto;box-shadow:none!important;touch-action:manipulation}
body.catalog-page .catalog-load-more:disabled {cursor:default;color:#888;border-color:#222;transform:none!important}
body.catalog-page .catalog-footer {display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:12px 16px max(24px,env(safe-area-inset-bottom));font-size:.75rem}
body.catalog-page .catalog-footer a {color:#aaa;text-underline-offset:4px}
body.catalog-page .catalog-load-more:focus-visible,
body.catalog-page .catalog-footer a:focus-visible {outline:2px solid #fff;outline-offset:4px}
@media(hover:none), (pointer:coarse) {
  body.catalog-page :is(.category-btn,.platform-card,.service-card,.copy-id,.sort-button,.catalog-load-more),
  body.catalog-page :is(.category-btn,.platform-card,.service-card,.copy-id,.sort-button,.catalog-load-more):hover,
  body.catalog-page :is(.category-btn,.platform-card,.service-card,.copy-id,.sort-button,.catalog-load-more):active {
    transition:none!important;
    transform:none!important;
    box-shadow:none!important;
  }
}

/* V198: nested backdrop filters survived the earlier card-only override.
   Feature chips, copy buttons and sort buttons each created another blur
   surface. Catalog content is opaque, so no descendant needs live blur. */
body.catalog-page .app-shell,
body.catalog-page .app-shell *,
body.catalog-page .app-shell *::before,
body.catalog-page .app-shell *::after {
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* The shared fixed navigation stays available; the title scrolls with the
   list instead of sticking underneath that navigation with a large shadow. */
body.catalog-page .section-head {
  position:relative!important;
  top:auto!important;
  background:#080809!important;
  box-shadow:none!important;
}

/* Legacy shine uses a transitioning `left` value, including on touch hover.
   Remove those overlay surfaces rather than only stopping card animations. */
body.catalog-page .service-card::before,
body.catalog-page .service-card::after,
body.catalog-page .platform-card::before,
body.catalog-page .category-btn::before {
  content:none!important;
  display:none!important;
  animation:none!important;
  transition:none!important;
}

body.catalog-page :is(.platform-card,.category-btn,.spotify-promo-card) {
  box-shadow:none!important;
}
body.catalog-page .service-card:hover,
body.catalog-page .service-card:active {
  transform:none!important;
  translate:none!important;
  box-shadow:none!important;
}

@media(hover:none), (pointer:coarse) {
  /* A finger moving over a control must not start a hover transition in
     its children or pseudo-elements while native scrolling is in progress. */
  body.catalog-page :is(.platform-card,.category-btn,.service-card,.sort-bar,.boost-unified-nav,.section-head),
  body.catalog-page :is(.platform-card,.category-btn,.service-card,.sort-bar,.boost-unified-nav,.section-head) *,
  body.catalog-page :is(.platform-card,.category-btn,.service-card,.sort-bar,.boost-unified-nav,.section-head) *::before,
  body.catalog-page :is(.platform-card,.category-btn,.service-card,.sort-bar,.boost-unified-nav,.section-head) *::after,
  body.catalog-page .platform-card::after,
  body.catalog-page .category-btn::after {
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
}

/* V199: plain dark service surfaces without white streaks or gradients,
   including featured services and hover/touch states. */
body.catalog-page .service-card,
body.catalog-page .service-card:hover,
body.catalog-page .service-card:active {
  background:#0a0a0b!important;
  background-image:none!important;
}

/* V201: the global icon token is intentionally larger for vertical platform
   cards. The compact popular-links row needs its own fixed icon column;
   otherwise the 52px icon plus its old bottom margin overlaps the title on
   desktop (for example Instagram Follower or TikTok Views). */
body.catalog-page .hero-quick-link {
  grid-template-columns:48px minmax(0,1fr)!important;
  align-items:center!important;
}
body.catalog-page .hero-quick-link > .hero-quick-icon {
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  margin:0!important;
  padding:0!important;
  align-self:center!important;
  justify-self:start!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
}
body.catalog-page .hero-quick-link > .hero-quick-icon svg {
  width:22px!important;
  height:22px!important;
  display:block!important;
}
body.catalog-page .hero-quick-copy {
  min-width:0!important;
  max-width:100%!important;
  display:grid!important;
  align-content:center!important;
  gap:4px!important;
  overflow:hidden!important;
}
body.catalog-page .hero-quick-copy strong,
body.catalog-page .hero-quick-copy small {
  min-width:0!important;
  margin:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
@media(max-width:720px) {
  body.catalog-page .hero-quick-link {
    grid-template-columns:42px minmax(0,1fr)!important;
  }
  body.catalog-page .hero-quick-link > .hero-quick-icon {
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }
  body.catalog-page .hero-quick-link > .hero-quick-icon svg {
    width:19px!important;
    height:19px!important;
  }
}