/* Our Family Christmas Ornament: product-only styles, loaded after the shared Jolly sheets (SELL-1448, 2026-10-13).
   Merged from the Always Near copies (always-near.css + always-near-v3.css) without the angel-wings preview rules,
   which belong to that product. */
/* block QA fix (2026-09-29): advertorial intro card, mobile. Same defect and fix as Our Family / Snapshot / Coin (a6):
   the shared 375 frame expects a narrow person cut-out on the right; with the full photo it showed as a clipped strip
   beside squeezed bullets, with the packshot hanging over the card edge. Stack it: bullets, band, then the photo. */
@media (max-width:640px){
  .ps5-intro{display:flex;flex-direction:column;height:auto;min-height:0}
  .ps5-intro .bul{order:1}
  .ps5-intro .b:nth-of-type(1),.ps5-intro .b:nth-of-type(2),.ps5-intro .b:nth-of-type(3){width:auto}
  .ps5-intro .band{order:2;position:relative;top:auto;right:auto;bottom:auto;left:auto;height:auto;padding:20px}
  .ps5-intro .band .txt{position:static}
  .ps5-intro .pic{order:3;position:relative;top:auto;right:auto;bottom:auto;left:auto;width:100%;height:320px}
  .ps5-intro .pic .person{left:0;width:100%;object-position:50% 40%}
  .ps5-intro .pack{display:none} /* the photo already shows the same ornament up close */
}

/* ---------- client feedback (Tereza, 2 Oct) ---------- */
/* presell 1: the photo block is a moving carousel, edge to edge, instead of a static mosaic */
.b4{overflow-x:clip}
.b4-marquee{align-self:center;width:100vw;max-width:none;overflow:hidden}
.b4-track{display:flex;gap:12px;width:max-content;animation:b4-slide 48s linear infinite}
.b4-track img{width:220px;height:220px;object-fit:cover;border-radius:8px;flex:none;display:block}
.b4-marquee:hover .b4-track{animation-play-state:paused}
@keyframes b4-slide{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 6px))}}
@media (prefers-reduced-motion:reduce){.b4-track{animation:none}}
@media (max-width:640px){.b4-track{gap:8px}.b4-track img{width:150px;height:150px}@keyframes b4-slide{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 4px))}}}
/* presell 3: more space between the end of the presell and the Terms links */
.disc--gap{margin-top:48px;padding-top:32px;padding-bottom:24px}
.disc--gap+.ft1{padding-top:56px;padding-bottom:72px}
.disc--gap+.ft1 .in{gap:36px}
@media (max-width:640px){.disc--gap{margin-top:32px;padding-top:24px;padding-bottom:16px}.disc--gap+.ft1{padding-top:40px;padding-bottom:120px}.disc--gap+.ft1 .in{gap:28px}}

/* presell: byline and publish date under the headline (Atlas story advertorial, SELL-1553) */
.adv-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 0;font:400 14px/20px var(--font-body);color:var(--color-text-secondary)}
.adv-meta-sep{color:var(--color-border-default)}

/* presell QA (SELL-1553, Nikola 2026-10-14): less empty space on phones. The byline's <p> had kept the browser's
   14px bottom margin (fixed in .adv-meta above: margin:14px 0 0, so the hero card sits at the design's 32px). A
   section whose last block is the CTA runs straight into the next white section's 40px top padding instead of
   adding its own 40px (b4 → ht1, ht1 → bc1). */
@media (max-width:640px){
  .b4,.ht1{padding-bottom:0}
}