/*
 * css/press.css - the Press kit (press.php), 0.19.0. Built on the tokens and components in css/landing.css (scoped under #ld);
 * every class here starts pk-.
 */
#ld .pk-hero-logo { padding: 26px 22px; background: radial-gradient(80% 90% at 50% 40%, #2a2d33, #121316 75%); }
#ld .pk-hero-logo img { width: 100%; height: auto; }
#ld .pk-hero .ld-btn svg { width: 17px; height: 17px; }
#ld .pk-status { max-width: 36em; padding: 12px 14px; border: 1px solid rgba(255,173,51,.45); border-left: 3px solid var(--amber-hi); border-radius: 6px; background: rgba(255,173,51,.07); color: var(--text); font-size: 14.5px; line-height: 1.5; }
#ld .pk-status b { color: var(--amber-hi); }

/* jump links under the hero */
#ld .pk-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 2px; padding: 10px 12px; background: #121214; border-bottom: 1px solid var(--line); }
#ld .pk-jump a { padding: 6px 12px; border-radius: 4px; color: var(--muted); font: 500 13px var(--head); letter-spacing: 1.2px; text-transform: uppercase; }
#ld .pk-jump a:hover { color: #fff; background: var(--steel2); }
#ld .ld-band[id] { scroll-margin-top: 12px; }

/* fact sheet */
#ld .pk-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 0; }
#ld .pk-facts > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
#ld .pk-facts dt { color: var(--dim); font: 600 12.5px/1.6 var(--head); letter-spacing: 1.3px; text-transform: uppercase; }
#ld .pk-facts dd { margin: 0; color: var(--text); overflow-wrap: anywhere; }
#ld .pk-facts dd a { color: var(--wire); }

/* descriptions */
#ld .pk-descs { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
#ld .pk-desc { padding: 18px 20px; background: var(--steel2); }
#ld .pk-desc:last-child { grid-column: 1 / -1; }
#ld .pk-desc header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
#ld .pk-desc h3 { font: 600 15px var(--head); letter-spacing: 1.4px; text-transform: uppercase; color: var(--teal-hi); }
#ld .pk-desc-text p { color: var(--text); line-height: 1.6; }
#ld .pk-desc-text p + p { margin-top: .8em; }
#ld .pk-copy {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,255,255,.03);
  color: var(--text); font: 600 12px var(--head); letter-spacing: 1.2px; text-transform: uppercase; cursor: pointer;
}
#ld .pk-copy:hover { border-color: var(--muted); color: #fff; }
#ld .pk-copy svg { width: 15px; height: 15px; }

/* timeline */
#ld .pk-timeline { list-style: none; margin: 0; padding: 0 0 0 22px; border-left: 2px solid var(--line); display: grid; gap: 18px; }
#ld .pk-timeline li { position: relative; }
#ld .pk-timeline li::before { content: ""; position: absolute; left: -29px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: var(--amber-hi); box-shadow: 0 0 0 4px var(--ink); }
#ld .pk-timeline li:last-child::before { background: var(--teal); }
#ld .pk-when { display: block; margin-bottom: 2px; color: #fff; font: 600 17px var(--head); letter-spacing: .8px; text-transform: uppercase; }
#ld .pk-timeline p { color: var(--muted); max-width: 44em; }

/* logos */
#ld .pk-logos { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
#ld .pk-logo { margin: 0; overflow: hidden; display: flex; flex-direction: column; }
#ld .pk-logo-art { display: flex; align-items: center; justify-content: center; height: 200px; padding: 20px; border-bottom: 1px solid var(--line); overflow: hidden; }
#ld .pk-logo-art img { display: block; max-width: 100%; max-height: 160px; width: auto; height: auto; object-fit: contain; }
#ld .pk-bg-dark { background: #0d0e10; }
#ld .pk-bg-light { background: #efe9dd; }
#ld .pk-bg-photo { padding: 0; }
#ld .pk-bg-photo img { width: 100%; height: 100%; max-height: none; object-fit: cover; }
#ld .pk-logo figcaption { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px 16px; }
#ld .pk-logo figcaption b { color: #fff; font: 600 16px var(--head); letter-spacing: .8px; text-transform: uppercase; }
#ld .pk-logo figcaption span { color: var(--muted); font-size: 14px; }
#ld .pk-dl { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; color: var(--wire); font: 600 13px var(--head); letter-spacing: 1.1px; text-transform: uppercase; }
#ld .pk-dl:hover { color: #fff; }
#ld .pk-dl svg { width: 16px; height: 16px; }
#ld .pk-rules { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; }
#ld .pk-rules .ld-card { padding: 18px 20px; }
#ld .pk-rules h3 { margin-bottom: 10px; font: 600 18px var(--head); letter-spacing: 1px; text-transform: uppercase; color: #fff; }
#ld .pk-do, #ld .pk-dont { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
#ld .pk-do li, #ld .pk-dont li { display: flex; gap: 10px; align-items: flex-start; color: var(--text); line-height: 1.45; }
#ld .pk-do svg { color: var(--cash); margin-top: 2px; }
#ld .pk-dont svg { color: #e0705f; margin-top: 2px; }

/* colours */
#ld .pk-group { margin: 22px 0 10px; color: var(--dim); font: 600 13px var(--head); letter-spacing: 1.6px; text-transform: uppercase; }
#ld .pk-group:first-of-type { margin-top: 0; }
#ld .pk-swatches { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); }
#ld .pk-swatch {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: 0 0 12px; overflow: hidden; text-align: left; cursor: pointer;
  background: var(--steel); border: 1px solid var(--line); border-radius: 8px; color: var(--text); font: inherit;
}
#ld .pk-swatch:hover { border-color: var(--muted); }
#ld .pk-chip { display: block; width: 100%; height: 72px; margin-bottom: 10px; background: var(--sw); border-bottom: 1px solid rgba(255,255,255,.08); }
#ld .pk-swatch b, #ld .pk-swatch code, #ld .pk-swatch small { padding: 0 12px; }
#ld .pk-swatch b { color: #fff; font: 600 15px var(--head); letter-spacing: .6px; }
#ld .pk-swatch code { color: var(--amber-hi); font: 600 14px ui-monospace, Consolas, monospace; }
#ld .pk-swatch small { color: var(--muted); font-size: 12.5px; line-height: 1.35; }
#ld .pk-copied { min-height: 1.4em; margin-top: 12px; color: var(--cash); font-size: 14px; }

/* screenshots and art */
#ld .pk-shots, #ld .pk-art { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
#ld .pk-art { margin-top: 16px; }
#ld .pk-shot { margin: 0; }
#ld .pk-shot a { display: block; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--ink); aspect-ratio: 16 / 10; }
#ld .pk-art .pk-shot a { aspect-ratio: 16 / 9; }
#ld .pk-shot img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
#ld .pk-shot a:hover img { transform: scale(1.03); }
#ld .pk-shot figcaption { margin-top: 8px; color: var(--muted); font-size: 13.5px; line-height: 1.45; }
#ld .pk-shot figcaption b { color: #fff; }
#ld .pk-shot figcaption small { color: var(--dim); }

/* streaming */
#ld .pk-narrow { max-width: 780px; }
#ld .pk-narrow > p { color: var(--text); font-size: 16.5px; line-height: 1.65; }
#ld .pk-disclaimer { margin-top: 20px; padding: 20px 22px; border: 1px solid var(--line); border-left: 3px solid var(--amber-hi); border-radius: 8px; background: var(--steel); }
#ld .pk-disclaimer h3 { margin-bottom: 8px; font: 600 19px var(--head); letter-spacing: .8px; text-transform: uppercase; color: #fff; }
#ld .pk-disclaimer p { color: var(--muted); }
#ld .pk-disclaimer blockquote { margin: 12px 0; padding: 12px 16px; border-radius: 6px; background: var(--ink); color: var(--text); font-size: 16px; line-height: 1.55; }

@media (max-width: 900px) {
  #ld .pk-facts { grid-template-columns: minmax(0, 1fr); }
  #ld .pk-logos, #ld .pk-shots, #ld .pk-art { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #ld .pk-hero-logo { max-width: 560px; }
}
@media (max-width: 600px) {
  #ld .pk-descs, #ld .pk-rules { grid-template-columns: minmax(0, 1fr); }
  #ld .pk-logos, #ld .pk-shots, #ld .pk-art { grid-template-columns: minmax(0, 1fr); }
  #ld .pk-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  #ld .pk-jump { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  #ld .pk-jump::-webkit-scrollbar { display: none; }
  #ld .pk-jump a { white-space: nowrap; }
  #ld .pk-hero .ld-ctas .ld-btn { width: 100%; white-space: normal; text-align: center; }
  #ld .pk-swatches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  #ld .pk-shot img { transition: none; }
  #ld .pk-shot a:hover img { transform: none; }
}
