/* Promotions (inc/promotions.php): announcement bar above the header, pop-up card bottom right. */

/* ---- Announcement bar: in the page flow above everything; the (absolute) header sits below it
   until it pins on scroll. --tc-annbar-h is the bar's measured height. ---- */
.tc-annbar {
  position: relative; z-index: 60;
  display: flex; align-items: center; justify-content: center;
  min-height: 40px; padding: 8px 52px;
  font-family: var(--sans); font-size: 14.5px; line-height: 20px; letter-spacing: -0.01em; text-align: center;
}
.tc-annbar--navy  { background: var(--navy);  color: var(--white); }
.tc-annbar--teal  { background: var(--teal);  color: var(--white); }
.tc-annbar--sand  { background: var(--sand);  color: var(--ink); }
.tc-annbar--water { background: var(--water); color: var(--navy); }
.tc-annbar-text { margin: 0; }
.tc-annbar-text a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; margin-left: 6px; white-space: nowrap; }
.tc-annbar-text a:hover { text-decoration-thickness: 2px; }
.tc-annbar-close {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; padding: 0; border: 0; background: none; cursor: pointer;
  color: inherit; font-size: 22px; line-height: 1; opacity: .75;
}
.tc-annbar-close:hover, .tc-annbar-close:focus-visible { opacity: 1; }
body.has-annbar .header:not(.header--stuck):not(.open) { top: var(--tc-annbar-h, 40px); }
@media (max-width: 560px) {
  .tc-annbar { font-size: 13.5px; line-height: 19px; padding: 8px 44px 8px 16px; text-align: left; justify-content: flex-start; }
  .tc-annbar-close { right: 6px; }
}

/* ---- Pop-up card: floats bottom right; a full-width sheet at the bottom on phones ---- */
.tc-promo {
  position: fixed; right: 24px; bottom: 24px; z-index: 900;
  width: 340px; max-width: calc(100vw - 32px);
  background: var(--white); color: var(--ink);
  border-radius: 8px; overflow: hidden;
  box-shadow: 0 22px 50px -12px rgba(10, 20, 30, .45);
  opacity: 0; transform: translateY(24px);
  transition: opacity .35s ease, transform .45s cubic-bezier(.22, .61, .36, 1);
}
.tc-promo[hidden] { display: none; }
.tc-promo.is-open { opacity: 1; transform: none; }
.tc-promo-media { display: block; }
.tc-promo-media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.tc-promo-body { padding: 18px 20px 20px; }
.tc-promo-label { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); }
.tc-promo-heading { margin: 0 0 8px; font-family: var(--serif); font-size: 24px; line-height: 29px; padding-right: 18px; }
.tc-promo-text { margin: 0 0 14px; font-size: 14.5px; line-height: 21px; color: var(--cap); }
.tc-promo-btn { display: inline-flex; padding: 10px 20px; font-size: 15px; }
.tc-promo-close {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .92); color: var(--ink); cursor: pointer;
  font-size: 20px; line-height: 1; box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}
.tc-promo-close:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
/* phones: a compact card that leaves most of the screen free (image as a thumbnail beside the text) */
@media (max-width: 560px) {
  .tc-promo { left: 12px; right: 12px; bottom: 12px; width: auto; max-width: none; display: flex; align-items: stretch; }
  .tc-promo[hidden] { display: none; }
  .tc-promo-media { flex: 0 0 96px; }
  .tc-promo-media img { width: 96px; height: 100%; aspect-ratio: auto; min-height: 120px; }
  .tc-promo-body { padding: 14px 44px 14px 14px; }
  .tc-promo-label { font-size: 11px; margin-bottom: 4px; }
  .tc-promo-heading { font-size: 18px; line-height: 23px; margin-bottom: 4px; padding-right: 0; }
  .tc-promo-text { display: none; }
  .tc-promo-btn { padding: 8px 16px; font-size: 14px; margin-top: 6px; }
  .tc-promo-close { top: 8px; right: 8px; width: 28px; height: 28px; font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) { .tc-promo { transition: opacity .2s ease; transform: none; } }