/* ---------- NEW-CUSTOMER PROMO (skinny bar + one-time popup) ----------
   Shared by the marketing pages (index, our-process, what-to-expect, reviews, careers).
   Not on booking.html, which shows the code in its own promo-code box. Both can be
   switched off in admin → Settings → Marketing; promo.js reads that and shows them. */
.promo-banner{display:none;background:linear-gradient(135deg,var(--ink),var(--ink-2));color:var(--star);font-size:.85rem;font-weight:500;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.promo-banner.on{display:block}
.promo-banner-in{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;text-align:center}
.promo-banner b{color:var(--ignition);font-weight:700}
.promo-banner-cta{flex:none;color:var(--ignition);font-weight:700;border-bottom:1px solid rgba(255,90,46,.5)}
.promo-banner-cta:hover{border-bottom-color:var(--ignition)}
/* The sentence fades up into place, then a bright band of light sweeps across it every
   4 seconds: the words sit a shade softer than usual and turn white as the light passes,
   and the orange offer and code brighten with it. */
.promo-banner-in > span{background:linear-gradient(100deg,#a9b7d6 0%,#a9b7d6 38%,#fff 46%,#fff 54%,#a9b7d6 62%,#a9b7d6 100%) 100% 0/300% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.promo-banner-in > span b{-webkit-text-fill-color:var(--ignition)}
.promo-banner.on .promo-banner-in > span{animation:pbIn .7s ease-out both,pbSheen 4s ease-in-out 1s infinite}
.promo-banner.on .promo-banner-in > span b{animation:pbPop 4s ease-in-out 1s infinite}
@keyframes pbIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes pbSheen{0%{background-position:100% 0}45%,100%{background-position:0 0}}
@keyframes pbPop{0%,8%,40%,100%{text-shadow:none}22%{text-shadow:0 0 12px rgba(255,90,46,.75)}}
@media(max-width:600px){
  .promo-banner{font-size:.76rem;padding:9px 0}
  /* Book now is redundant here: the nav's own Book now button sits right beneath it. */
  .promo-banner-cta{display:none}
}
@media(prefers-reduced-motion:reduce){.promo-banner.on .promo-banner-in > span,.promo-banner.on .promo-banner-in > span b{animation:none}}

.promo-modal-overlay{display:none;position:fixed;inset:0;background:rgba(10,22,51,.55);z-index:200;align-items:center;justify-content:center;padding:20px}
.promo-modal-overlay.show{display:flex}
.promo-modal{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 30px;max-width:380px;width:100%;text-align:center;position:relative}
.promo-modal-close{position:absolute;top:12px;right:14px;background:none;border:none;font-size:1.4rem;color:var(--slate);cursor:pointer;line-height:1}
.promo-modal-icon{width:52px;height:52px;border-radius:50%;object-fit:cover;margin:0 auto 16px;display:block;box-shadow:var(--shadow-sm)}
.promo-modal h3{font-family:'Space Grotesk';font-weight:700;font-size:1.25rem;margin-bottom:10px}
.promo-modal p{color:var(--slate);font-size:.94rem;line-height:1.5;margin-bottom:20px}
.promo-modal-btn{display:flex;width:100%;justify-content:center;margin-bottom:10px}
.promo-modal-dismiss{background:none;border:none;color:var(--slate);font-size:.86rem;cursor:pointer;text-decoration:underline}