/* BOOKTILY_PAQCARD_SCMA_REWRITE_V1 + BOOKTILY_PAQCARD_GEOMETRY_V2 + BOOKTILY_ORBIT_HERO_FIX_V3 — see MANIFEST_PAQCARD_SCMA_REWRITE_CORETRIA_EXTRACT_20260619.txt */
/* modules/paqhero/paqhero.css
   ===========================
   THE PaQ Hero authority. Owns the three discovery heroes (Lumen banner, Drops
   hero, Orbit hero), their layout, and — via the card module's `.paq-fit`
   primitive — how large the card renders inside a hero. No card width/height is
   set here; only `--s` (scale) on the fit wrapper. Themed through tokens.css.

   Card-in-hero scales (intrinsic slim card is now 248×300, per the spec):
     drop hero  : --s 1   → the card renders at its natural 248px
     orbit hero : --s 1 on desktop, stepped down a touch on small screens
*/

/* ---- shared hero flag chip ---------------------------------------------- */
.disc-hero-flag { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  color: var(--packGlow, #ffdda0); background: rgba(8,6,4,.34); padding: 6px 11px; border-radius: 100px; }

/* ---- Lumen featured banner ---------------------------------------------- */
.disc-hero { position: relative; border-radius: var(--r-lg); overflow: hidden;
  min-height: 340px; margin-bottom: 18px; color: #fff;
  background: linear-gradient(150deg, var(--packB, #a0462a), var(--packA, #5c271f) 80%); }
.disc-hero::before { content: ""; position: absolute; inset: 0;
  background: radial-gradient(120% 130% at 16% 8%, color-mix(in srgb, var(--packGlow, #ffdda0) 30%, transparent), transparent 46%),
              radial-gradient(90% 90% at 92% 96%, color-mix(in srgb, var(--packC, #d59d55) 45%, transparent), transparent 52%); }
.disc-hero::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 34%, rgba(8,6,4,.74)); }
.disc-hero > * { position: relative; z-index: 1; }
.disc-hero-top { position: absolute; top: 26px; left: 32px; display: flex; gap: 8px; align-items: center; }
.disc-hero-sub { font-size: 12.5px; color: rgba(255,255,255,.82); }
.disc-hero-body { position: absolute; left: 32px; right: 32px; bottom: 28px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.disc-hero-body h1 { margin: 0; font-size: 46px; line-height: .98; letter-spacing: -.02em; color: #fff; }
.disc-hero-body p { margin: 11px 0 0; font-size: 16px; line-height: 1.45; color: rgba(255,255,255,.82); max-width: 470px; }
.disc-hero-by { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; font-size: 13.5px; color: rgba(255,255,255,.85); }
.disc-hero-by .av { width: 27px; height: 27px; border-radius: 50%; display: grid; place-items: center;
  background: var(--packGlow, #ffdda0); color: var(--packA, #5c271f); font-weight: 800; font-size: 13px; }

/* ---- Drops hero --------------------------------------------------------- */
.disc-drophero { position: relative; border-radius: var(--r-lg); overflow: hidden; min-height: 380px;
  display: grid; grid-template-columns: 1.1fr .9fr; color: #fff; margin-bottom: 26px;
  background: linear-gradient(150deg, var(--packB,#6b3a22), var(--packA,#18110c) 82%); }
.disc-drophero .copy { position: relative; padding: 34px 36px; display: flex; flex-direction: column; justify-content: space-between; }
.disc-drophero h1 { margin: 0; font-size: 52px; line-height: .94; letter-spacing: -.03em; color: #fff; }
.disc-drophero .art { display: flex; align-items: center; justify-content: center; padding: 28px; }
.disc-drophero-collectors { margin-left: 8px; font-size: 12.5px; color: rgba(255,255,255,.8); }
.disc-drophero-by { font-size: 13px; color: rgba(255,255,255,.72); margin-bottom: 8px; }
.disc-drophero-sub { color: rgba(255,255,255,.82); max-width: 420px; }
.disc-drophero-actions { display: flex; gap: 12px; align-items: center; margin-top: 22px; flex-wrap: wrap; }
.disc-drophero-open { color: #fff; border-color: rgba(255,255,255,.3); }
.disc-drophero-edition { font-size: 13px; color: rgba(255,255,255,.78); }
.disc-drophero-edition b { color: var(--packGlow, #ffce8f); }
.drophero-fit { --s: 1; }

/* ---- Orbit hero --------------------------------------------------------- */
/* The card column hugs the scaled fit wrapper; the copy never falls under it. */
.disc-orbit-hero {
  display: grid;
  grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 48px);
  align-items: center;
  border-radius: var(--r-lg);
  overflow: hidden;
  padding: clamp(18px, 2.6vw, 30px);
  margin-bottom: 30px;
  background: linear-gradient(140deg, var(--violet-soft), var(--accent-soft));
  border: 1px solid var(--line);
}
.disc-orbit-hero .art { justify-self: center; min-width: 0; display: flex; align-items: center; justify-content: center; }
.orbithero-fit { --s: 1; }
.disc-orbit-copy { min-width: 0; align-self: center; }
.disc-orbit-kicker { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--violet); margin-bottom: 10px; }
.disc-orbit-hero h2 { margin: 0; font-size: clamp(21px, 4.4vw, 34px); line-height: 1; letter-spacing: -.02em; color: var(--ink); }
.disc-orbit-sub { margin: 12px 0 0; color: var(--muted); max-width: 460px; line-height: 1.5; }
.disc-orbit-actions { display: flex; gap: 12px; align-items: center; margin-top: 20px; flex-wrap: wrap; }

@media (max-width: 980px) {
  .disc-drophero { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  /* Stack the card above the copy instead of squeezing the text beside it. */
  .disc-orbit-hero { grid-template-columns: 1fr; gap: 18px; }
  .disc-orbit-hero .art { justify-self: start; }
  .orbithero-fit { --s: 1; }
}
@media (max-width: 640px) {
  .orbithero-fit { --s: 1; }
}
@media (max-width: 520px) {
  .disc-orbit-hero { gap: 16px; }
  .disc-orbit-kicker { font-size: 10px; letter-spacing: .08em; margin-bottom: 8px; }
  .disc-orbit-actions { gap: 8px; margin-top: 14px; }
  .disc-orbit-actions .btn,
  .disc-orbit-actions .disc-pill { padding: 9px 10px; font-size: 12px; white-space: nowrap; }
}
@media (max-width: 380px) {
  .disc-orbit-hero { padding: 14px; gap: 14px; }
  .disc-orbit-hero h2 { font-size: 22px; }
}