/*
 * Play Center Studio badge: Arshad's authored studio mark, reused verbatim.
 * Source of record: /workspace/kpf/new-splash.html ("EXACT 05 — INVERTED [CENTER] CORE BAR").
 * Identical values in kpf master:assets/css/splash.css (+ markup in master:index.html)
 * and test_z/cat3d/project_v6/assets/css/catsequences-splash.css.
 * Only changes for the website: rules scoped under .pcs-badge, the splash entrance animation
 * and its opacity:0 start state removed (static logo), and the font is a self-hosted subset of the
 * same bundled Montserrat Black (SIL OFL 1.1, see assets/fonts/OFL.txt) instead of Google Fonts.
 * Size it with the --badge-zoom custom property; the badge's own proportions are never changed.
 */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url('../fonts/montserrat-black-badge.woff2') format('woff2');
}

.pcs-badge {
  --page-bg: #0c0709;
  --badge-bg: #ffffff;
  --badge-text: #0f070a;
  --block-bg: #e11d48;
  --block-text: #ffffff;
  --badge-radius: 28px;
  display: inline-block;
  zoom: var(--badge-zoom, 1);
  line-height: 0;
  flex: none;
}
/* The source page sets `* { box-sizing: border-box; }`; keep that so the badge is 232px wide. */
.pcs-badge, .pcs-badge * { box-sizing: border-box; margin: 0; }

/* ==========================================
   EXACT 05 — INVERTED [CENTER] CORE BAR
   ========================================== */
.pcs-badge .monolith-badge {
  background: var(--badge-bg);
  color: var(--badge-text);
  border-radius: var(--badge-radius);
  padding: 24px 26px 22px;
  width: 232px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.4);
}

/* ROW 1: PLAY */
.pcs-badge .row-play {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 61px;
  line-height: 0.83;
  text-transform: uppercase;
  margin-bottom: 6px;
}

/* ROW 2: [CENTER] CRIMSON CORE BAR */
.pcs-badge .row-center {
  background: var(--block-bg);
  color: var(--block-text);
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 33px;
  line-height: 0.92;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 9px;
}

/* ROW 3: STUDIO */
.pcs-badge .row-studio {
  font-size: 15px;
  line-height: 1;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Small placements (header/footer): the large splash drop shadow is dropped. */
.pcs-badge.flat .monolith-badge { box-shadow: none; }