/* ═══════════════════════════════════════════════════════════════════════════
   THE SHOP IS STILL ON THE PRESS  (shop.html while the shop is empty)
   Kenny, 2026-09-20: "There is going to be a shop tab and I thought you were
   going to create it with a similar 'under construction' message like with
   unleashed." Deliberately NOTHING like the Unleashed page (Brady, 2026-09-21:
   Corey does not want sites that look like his) — so not just a different scene
   but a different page: a centered stack with the press on top (his is headline
   left, scene right), a white headline over a strip of Kenny's three inks (his is
   a red second line), no rule-and-eyebrow line above it, and a print-shop job
   ticket where his page runs a progress bar. The scene is Kenny's own trade: a
   DTF heat press laying down a three-color transfer, on ONE SMIL clock;
   assets/js/shop.js restarts it on show, pauses it off-screen, and freezes it
   on a finished print (plate lifted out of frame) for anyone who asks their device for reduced motion.
   Display face is page-only (Big Shoulders Stencil).
   ═══════════════════════════════════════════════════════════════════════════ */
.press-soon{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:clamp(6px,1.4vw,14px); padding:clamp(4px,1.4vw,16px) 0 clamp(40px,5vw,72px);
}
.press-soon[hidden]{display:none}
.press-art{position:relative; width:100%; max-width:clamp(300px,27vw,380px)}
.press-art::before{ /* a warm work-light behind the pallet — no sky, no horizon */
  content:''; position:absolute; inset:4% 6% 14%; border-radius:50%;
  background:radial-gradient(closest-side, rgba(233,180,76,.15), rgba(232,64,74,.05) 60%, transparent);
  filter:blur(8px); pointer-events:none;
}
.press-svg{position:relative; display:block; width:100%; height:auto}
.press-svg .p-word{font-family:'Big Shoulders Stencil Display','Anton',sans-serif; font-weight:900; text-transform:uppercase}
.press-svg .p-read{font-family:var(--f-mono); font-size:12.5px; letter-spacing:.12em; fill:#1a1416; font-weight:700}
.press-svg .p-tno{font-family:var(--f-mono); font-size:11px; letter-spacing:.2em; fill:#5f5550}   /* 5.9:1 on the cream */
.press-svg .p-tno.big{font-size:18px; letter-spacing:.06em; fill:#1a1416; font-weight:700}
.press-svg .p-tlabel{font-family:'Big Shoulders Stencil Display','Anton',sans-serif; font-weight:900; font-size:17px; letter-spacing:.06em; fill:#1a1416}

.press-copy{max-width:920px; display:flex; flex-direction:column; align-items:center}
.press-copy h1{
  font-family:'Big Shoulders Stencil Display','Anton',sans-serif; font-weight:900; color:var(--fg);
  font-size:clamp(40px,4.5vw,66px); line-height:.95; letter-spacing:.01em; text-transform:uppercase;
  margin:0;
}
.press-copy h1 .press-line{white-space:nowrap}
/* three ink drawdowns — Kenny's red, gold and white — instead of a colored headline line */
.press-swatch{display:flex; gap:6px; margin:16px 0 20px}
.press-swatch i{display:block; width:46px; height:7px; border-radius:2px}
.press-swatch i:nth-child(1){background:var(--accent)}
.press-swatch i:nth-child(2){background:var(--gold)}
.press-swatch i:nth-child(3){background:#f4f2ee}
.press-copy p{font-size:clamp(16px,1.3vw,18px); line-height:1.6; color:var(--fg-2); max-width:540px; margin:0 0 26px}
.press-cta{display:flex; flex-wrap:wrap; gap:12px; justify-content:center}
.press-cta a{min-height:48px}

/* ≤760px the fixed bottom bar (Call · Text · Start Your Design) is on screen: the page's own Call
   button duplicated it and sat underneath it on a short phone */
@media (max-width:760px){ .press-cta .btn-ghost{display:none} }
@media (max-width:600px){
  .press-art{max-width:290px}
  .press-copy h1 .press-line{display:block}
  .press-swatch{margin:14px 0 18px}
}
/* a short phone: a smaller press keeps Start Your Design above the fixed bottom bar */
@media (max-width:600px) and (max-height:820px){ .press-art{max-width:230px} }
@media (max-width:480px){
  .press-cta{flex-direction:column; width:100%}
  .press-cta a{justify-content:center; width:100%}
}