/* announcement.css — newTudo-home · section "Announcement bar"
   Nodes: desktop 2188:8763 (1920x40) · mobile 2188:9159 (390x45). Ground truth: cache/announcement.*.json.
   Pattern B-edge (brief/announcement.md §1b): the section paints the full-bleed #171310 band, the inner
   .announcement__content carries the page gutter + the vertical padding. Height is the OUTCOME of
   padding + one 1.32 line (D-1) — never a `height`, never `overflow: hidden` (clipsContent: false).
   Scoped rules only (.announcement / .announcement__*) — GLOBAL-SCOPE LOCK. */

.announcement {
  background-color: var(--color-ink);
  color: var(--color-white);
}

/* ---- Mobile base (390 anchor) — Figma padding 12/16/12/16, flex column CENTER/CENTER ----
   padding-block: M-min round(12 × 320/390) = 10 · M-base 12 · M-max max(12, 9.5) = 12 */
.announcement__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 12px);
  padding-bottom: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 12px);
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

/* Token `body` at 16 on BOTH layers (D-4: cross-layer swap, not the 15-based page body clamp):
   M-min round(16 × 320/390) = 13 · M-base 16 · M-max 16. Denim INK 400 (Inter stand-in, BA-F1),
   lh 1.32, ls 0, white. The text node is HUG-width on both layers (Figma never wraps it: 331 px in a
   358 px box at 390, scales with the viewport down to 320) → nowrap per the slice's overflow strategy. */
.announcement__text {
  margin: 0;
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: clamp(13px, calc(16px + (var(--max-vw) - 390px) * 0.015), 16px);
  line-height: var(--lh-body);
  letter-spacing: 0;
  color: var(--color-white);
  white-space: nowrap;
}

/* D-DELTA-1 (newTudo-science, site reuse): the copy differs per layer on THIS page — desktop node
   I1817:4351;380:106 "Enjoy 45% Off + Free Welcome Kit (€115)" (279 wide), mobile node I1817:4979;530:6584
   "Subscribe & Save Up To 40% + Free US Shipping" (331 wide). Both spans inherit every type value from
   .announcement__text; only the visible span swaps at the 1024 desktop seam (768–1023 follows mobile). */
.announcement__msg--desktop {
  display: none;
}

/* ---- Pseudo-tablet 768–1023 (no tablet layer; `stack`) — M-767 = M-max = 12 → constant; type holds 16 ---- */
@media (min-width: 768px) {
  .announcement__content {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .announcement__text {
    font-size: var(--text-body); /* tokens.css tablet band: 16 constant */
  }
}

/* ---- Desktop 1024+ — Figma frame FIXED 40: effective padding-block 9.5 (D-1), gutter 240 ----
   D-min round(9.5 × 1024/1920) = 5 · D-base = D-max 9.5 */
@media (min-width: 1024px) {
  .announcement__content {
    padding-top: clamp(5px, calc(9.5px * (var(--max-vw) / var(--vw-base))), 9.5px);
    padding-bottom: clamp(5px, calc(9.5px * (var(--max-vw) / var(--vw-base))), 9.5px);
  }
  .announcement__text {
    font-size: var(--text-body); /* clamp(9px, calc(16px * (var(--max-vw) / var(--vw-base))), 16px) */
  }
  /* D-DELTA-1: desktop copy (I1817:4351;380:106) replaces the mobile copy from 1024 up. */
  .announcement__msg--mobile {
    display: none;
  }
  .announcement__msg--desktop {
    display: inline;
  }
}

/* PAGE_FIX 1 (PAGE_AUDIT P2-1, default pending user decision): below ~365px the Inter stand-in (BA-F1) makes the
   one-line `nowrap` text wider than the viewport and it was clipped on both sides (−14.3px each side at 320). Allow the
   line to wrap there instead of losing text; at >= 365 (and with the real Denim INK file, ~309px at 320) it stays one line.
   Override = delete this block (accept the clip until the font arrives). */
@media (max-width: 364px) {
  .announcement__text { white-space: normal; }
}
