/* =====================================================================
   Sarah Discoveries — promo + consent layer
   Announcement strip (top), summer-sale badges, cookie consent banner.
   Loaded site-wide via /assets/promo.js. Palette matches the brand:
   ink #211C17, cream #F7F1E6, gold #FACE45.
   ===================================================================== */

:root { --sd-strip-h: 44px; }

/* ===================================================================
   Clean numerals site-wide. The serif (Cormorant Garamond) defaults to
   old-style figures (uneven, descending digits) which read as inconsistent
   in prices/stats. Force lining figures everywhere, and tabular (even-width)
   figures for prices, stats and other numeric displays.
   =================================================================== */
html{ font-variant-numeric:lining-nums; -moz-font-feature-settings:"lnum"; font-feature-settings:"lnum" 1; }
.price-value, .price-now, .price-was, .price-per,
.price-vital .pv-val, .price-vital .pv-key,
.journey-card-stat-value, .journey-card-stat-label,
.s-val, .stat-value, .stat-number, .rating-score, .rating-value,
.hero-meta-eyebrow, .sd-strip-clock, .ms-day,
time, [class*="price"], [class*="stat-value"]{
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1, "tnum" 1;
}

/* ===================================================================
   Consistent hero / breadcrumb placement.
   Tour pages used a full-height (100vh) vertically-centred hero, so the
   breadcrumb floated to a different spot than on Contact/About/etc. Align
   the tour hero to the same top-aligned layout + padding as the standard
   .hero so the breadcrumb sits in the same place site-wide.
   =================================================================== */
.tour-hero{
  height:auto !important;
  min-height:0 !important;
  display:block !important;
  padding-top:120px !important;
  padding-bottom:96px !important;
  padding-left:clamp(32px, 8vw, 120px) !important;
  padding-right:clamp(32px, 8vw, 120px) !important;
}
@media (max-width:600px){
  .tour-hero{ padding-top:104px !important; padding-bottom:56px !important; }
}

/* ---- Announcement strip -------------------------------------------- */
.sd-strip{
  position:fixed; top:0; left:0; right:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  min-height:46px; padding:7px 46px 7px 16px;
  background:linear-gradient(90deg,#1C1712 0%,#3A1410 50%,#7A1E10 100%);
  background-size:200% 100%;
  color:#F7F1E6;
  font-family:'Manrope',system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:13px; line-height:1.3; letter-spacing:.02em; text-align:center;
  box-shadow:0 1px 0 rgba(250,206,69,.35), 0 6px 18px rgba(0,0,0,.28);
  animation:sd-strip-pan 14s linear infinite alternate;
}
@keyframes sd-strip-pan{ to{ background-position:100% 0; } }

.sd-strip a.sd-strip-link{
  color:#F7F1E6; text-decoration:none; font-weight:600;
  display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:center;
}
.sd-strip-pill{
  background:#FACE45; color:#211C17;
  font-weight:800; font-size:12px; letter-spacing:.04em;
  padding:3px 9px; border-radius:999px; white-space:nowrap;
  box-shadow:0 0 0 0 rgba(250,206,69,.6);
  animation:sd-pill-pulse 1.8s ease-out infinite;
}
@keyframes sd-pill-pulse{
  0%{ box-shadow:0 0 0 0 rgba(250,206,69,.55); }
  70%{ box-shadow:0 0 0 8px rgba(250,206,69,0); }
  100%{ box-shadow:0 0 0 0 rgba(250,206,69,0); }
}
.sd-strip-text{ font-weight:600; }
.sd-strip-count{
  display:inline-flex; align-items:center; gap:6px;
  padding-left:12px; border-left:1px solid rgba(247,241,230,.28);
}
.sd-strip-count-lbl{ opacity:.8; text-transform:uppercase; font-size:10.5px; letter-spacing:.12em; }
.sd-strip-clock{
  color:#FACE45; font-weight:800; font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum"; min-width:9.5em; text-align:left; letter-spacing:.04em;
}
.sd-strip-cta{
  color:#211C17; background:#FACE45; font-weight:800; white-space:nowrap;
  padding:4px 12px; border-radius:3px; transition:filter .15s,transform .15s;
}
.sd-strip a.sd-strip-link:hover .sd-strip-cta{ filter:brightness(1.06); transform:translateX(2px); }
.sd-strip-close{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  background:transparent; border:0; color:#F7F1E6; opacity:.7;
  cursor:pointer; font-size:18px; line-height:1; border-radius:50%;
}
.sd-strip-close:hover{ opacity:1; background:rgba(247,241,230,.14); }

/* Push the (absolutely-positioned) header + page content below the strip.
   Scoped so removing the strip reverts everything cleanly. */
html.sd-strip-on body{ padding-top:var(--sd-strip-h) !important; }
html.sd-strip-on .site-header{ top:var(--sd-strip-h) !important; }

@media (max-width:600px){
  .sd-strip{ font-size:12px; padding:7px 40px 7px 12px; }
  .sd-strip a.sd-strip-link{ gap:8px; }
  .sd-strip-count{ padding-left:8px; }
  .sd-strip-clock{ min-width:8.5em; }
}
@media (prefers-reduced-motion:reduce){
  .sd-strip{ animation:none; }
  .sd-strip-pill{ animation:none; }
}

/* ---- Accessibility: visible keyboard focus on promo controls ------ */
.sd-strip a.sd-strip-link:focus-visible,
.sd-strip-close:focus-visible,
.sd-cookie-btn:focus-visible,
.sd-cookie a:focus-visible,
.price-tier-btn:focus-visible{
  outline:2px solid #FACE45;
  outline-offset:2px;
  border-radius:3px;
}
/* On the dark strip the gold ring needs a dark keyline to stay visible */
.sd-strip a.sd-strip-link:focus-visible,
.sd-strip-close:focus-visible{
  outline-color:#FACE45;
  box-shadow:0 0 0 4px rgba(0,0,0,.45);
}
/* Ensure tap targets meet WCAG 2.5.8 (min 24x24) */
.price-tier-btn{ min-height:36px; }
.sd-cookie-btn{ min-height:40px; }

/* ---- Summer-sale badges ------------------------------------------- */
.sd-sale-badge{
  position:absolute; z-index:5;
  background:#FACE45; color:#211C17;
  font-family:'Manrope',system-ui,sans-serif;
  font-weight:800; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  padding:6px 10px; border-radius:2px;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
  pointer-events:none;
}
/* On listing cards: bottom-left of the image (top corners hold the tag + like-btn) */
.journey-card-img .sd-sale-badge{ left:14px; bottom:14px; }

/* On a tour detail page: sit inside the price card */
.sd-sale-badge--price{
  position:static; display:inline-block; margin-bottom:10px;
}

/* ---- Cookie consent banner --------------------------------------- */
.sd-cookie{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:9998;
  max-width:560px; margin:0 auto;
  background:#F7F1E6; color:#211C17;
  border:1px solid rgba(33,28,23,.18);
  box-shadow:0 8px 30px rgba(0,0,0,.22);
  border-radius:6px; padding:18px 20px;
  font-family:'Manrope',system-ui,-apple-system,Segoe UI,sans-serif;
}
.sd-cookie h2{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:20px; font-weight:600; margin:0 0 6px;
}
.sd-cookie p{ font-size:13.5px; line-height:1.5; margin:0 0 14px; }
.sd-cookie a{ color:#7A5A1E; text-decoration:underline; text-underline-offset:2px; }
.sd-cookie-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.sd-cookie-btn{
  font-family:inherit; font-size:13px; font-weight:700; letter-spacing:.02em;
  padding:10px 18px; border-radius:3px; cursor:pointer; border:1px solid transparent;
}
.sd-cookie-btn--accept{ background:#211C17; color:#F7F1E6; }
.sd-cookie-btn--accept:hover{ background:#000; }
.sd-cookie-btn--decline{ background:transparent; color:#211C17; border-color:rgba(33,28,23,.35); }
.sd-cookie-btn--decline:hover{ background:rgba(33,28,23,.06); }

@media (max-width:480px){
  .sd-cookie-actions{ flex-direction:column; }
  .sd-cookie-btn{ width:100%; }
}

/* ---- Hotel tier toggle (Comfort / Premium) on tour price cards ---- */
.price-tier{
  display:flex; gap:4px; margin:0 0 14px;
  background:rgba(33,28,23,.06); border:1px solid rgba(33,28,23,.12);
  border-radius:4px; padding:3px;
}
.price-tier-btn{
  flex:1; font-family:'Manrope',system-ui,sans-serif;
  font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:8px 6px; border:0; border-radius:3px; cursor:pointer;
  background:transparent; color:#6B5E50; transition:background .15s,color .15s;
}
.price-tier-btn.is-active{ background:#211C17; color:#FACE45; }
.price-tier-note{
  font-family:'Manrope',system-ui,sans-serif;
  font-size:12px; color:#6B5E50; margin:8px 0 0; font-style:italic;
}

/* Sale before/after price (shown on discounted tours) */
.price-was{
  text-decoration:line-through; opacity:.55; font-weight:500;
  margin-right:.4em; vertical-align:middle;
}
/* Hero price card is dark — gold "now" price reads clearly + matches the badge */
.price-value .price-was{ font-size:.5em; }
.price-value .price-now{ color:#FACE45; }
/* Tour Summary card is light — red reads well there */
.s-val .price-was{ font-size:.92em; }
.s-val .price-now{ color:#B23214; font-weight:700; }