/* ==========================================================================
   Bayzaar Musafir — brand skin
   Loaded after style.css. Everything here is an override, so removing this one
   <link> returns the site to the previous look.

   The language comes straight from the logo: flat yellow, petrol blue, ink-black
   outlines and hard offset shadows — stickers rather than soft cards.
   ========================================================================== */

/* ---------- 1. Tokens ------------------------------------------------- */
:root{
  --bm-yellow:#FFD400;
  --bm-yellow-deep:#F2B705;
  --bm-blue:#12667F;
  --bm-blue-deep:#0C4B5F;
  --bm-blue-night:#08313E;
  --bm-red:#E1251B;
  --bm-ink:#101418;
  --bm-cream:#FFF9E8;
  --bm-sand:#FFF3CC;

  --bm-line:2.5px solid var(--bm-ink);
  --bm-line-thin:2px solid var(--bm-ink);
  --bm-pop:5px 5px 0 var(--bm-ink);
  --bm-pop-sm:3px 3px 0 var(--bm-ink);
  --bm-pop-lg:8px 8px 0 var(--bm-ink);

  /* remapped legacy tokens — one change here recolours ~400 declarations */
  --green-900:#0C4B5F;
  --green-800:#0E5871;
  --green-700:#12667F;
  --green-600:#17798F;
  --green-500:#2E8CA3;
  --teal-500:#12667F;
  --teal-400:#7FB0BF;
  --teal-050:#E8F3F6;
  --teal-025:#F5FAFB;

  --ink-900:#101418;
  --ink-800:#1B2127;
  --ink-700:#39434C;
  --ink-500:#5B6671;
  --ink-400:#78838D;
  --ink-300:#A6AFB8;

  --line:#E2E6EA;
  --line-soft:#EEF1F4;
  --bg:#FFFDF6;
  --bg-soft:var(--bm-cream);
  --surface:#FFFFFF;
  --navy-900:var(--bm-blue-night);
  --navy-800:var(--bm-blue-deep);

  --amber:var(--bm-yellow);
  --purple:var(--bm-blue);
  --orange:#F2762E;
  --red:var(--bm-red);
  --blue:var(--bm-blue);

  --radius-sm:10px;
  --radius:16px;
  --radius-lg:22px;
  --radius-xl:30px;

  --shadow-sm:0 2px 0 rgba(16,20,24,.10);
  --shadow:0 4px 0 rgba(16,20,24,.10);
  --shadow-lg:0 10px 0 rgba(16,20,24,.10);

  --font-display:"Fredoka","Montserrat",-apple-system,"Segoe UI",sans-serif;
  --font-body:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font-script:"Fredoka","Montserrat",sans-serif;

  --header-h:84px;
}

/* ---------- 2. Base --------------------------------------------------- */
body{
  background:var(--bg);
  background-image:radial-gradient(rgba(18,102,127,.08) 1.1px, transparent 1.1px);
  background-size:26px 26px;
  color:var(--ink-800);
}
h1,h2,h3,h4,.section-title,.hero__title{font-family:var(--font-display);letter-spacing:-.01em;font-weight:700}
h1,h2{text-transform:none}
::selection{background:var(--bm-yellow);color:var(--bm-ink)}
:focus-visible{outline:3px solid var(--bm-blue);outline-offset:3px}

/* Section rhythm + a paper panel look for the "soft" sections */
.section{padding:72px 0}
.section--soft{
  background:var(--bm-cream);
  border-top:var(--bm-line);border-bottom:var(--bm-line);
  background-image:radial-gradient(rgba(18,102,127,.10) 1.2px, transparent 1.2px);
  background-size:24px 24px;
}

/* ---------- 3. Eyebrows, titles, links -------------------------------- */
.eyebrow{
  display:inline-block;font-family:var(--font-body);font-weight:800;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bm-ink);
  background:var(--bm-yellow);border:var(--bm-line-thin);border-radius:999px;
  padding:6px 14px;box-shadow:var(--bm-pop-sm);transform:rotate(-1.4deg);
}
.section-title{font-size:clamp(27px,3.6vw,42px);color:var(--bm-ink);margin-top:14px}
.section-lead{color:var(--ink-700);font-size:15.5px}
.squiggle{color:var(--bm-red);width:110px;height:12px;margin-top:14px}
.link-arrow{
  color:var(--bm-blue);font-weight:800;border-bottom:3px solid var(--bm-yellow);
  padding-bottom:3px;border-radius:0;
}
.link-arrow:hover{color:var(--bm-ink);border-bottom-color:var(--bm-ink)}

/* ---------- 4. Buttons: the sticker CTA ------------------------------- */
.btn{
  border-radius:14px;border:var(--bm-line);font-family:var(--font-display);
  font-weight:600;font-size:15.5px;padding:13px 24px;
  box-shadow:var(--bm-pop);transition:transform .12s ease, box-shadow .12s ease, background-color .18s ease;
}
.btn:hover{transform:translate(2px,2px);box-shadow:var(--bm-pop-sm)}
.btn:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--bm-ink)}
.btn svg{width:18px;height:18px;stroke-width:2.4}

.btn--primary,.btn--gold,.btn--book{background:var(--bm-yellow);color:var(--bm-ink)}
.btn--primary:hover,.btn--gold:hover,.btn--book:hover{background:var(--bm-yellow-deep);color:var(--bm-ink)}
.btn--teal{background:var(--bm-blue);color:#fff}
.btn--teal:hover{background:var(--bm-blue-deep);color:#fff}
.btn--ghost{background:#fff;color:var(--bm-ink);border:var(--bm-line)}
.btn--ghost:hover{background:var(--bm-sand);color:var(--bm-ink)}
.btn--gold-outline{background:#fff;color:var(--bm-ink);border:var(--bm-line)}
.btn--gold-outline:hover{background:var(--bm-yellow);color:var(--bm-ink);box-shadow:var(--bm-pop-sm)}
.btn--light{background:#fff;color:var(--bm-ink)}
.btn--outline-light{background:var(--bm-blue-deep);color:#fff;border-color:#fff;box-shadow:5px 5px 0 rgba(255,255,255,.35)}
.btn--outline-light:hover{background:#fff;color:var(--bm-ink);border-color:var(--bm-ink);box-shadow:var(--bm-pop-sm)}
.btn--wa{background:#25D366;color:#06341B}
.btn--wa:hover{background:#1FBE5B;color:#06341B}
.btn--danger{background:#FFE3E1;color:var(--bm-red)}
.btn--lg{padding:16px 30px;font-size:17px}
.btn--sm{padding:9px 16px;font-size:14px;box-shadow:var(--bm-pop-sm)}
.btn--sm:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--bm-ink)}
.btn[disabled]{opacity:.45;box-shadow:var(--bm-pop-sm)}

/* Playful nudge for the single most important action on a page */
.btn--shout{position:relative}
.btn--shout::after{
  content:"";position:absolute;inset:-9px;border:2.5px dashed var(--bm-ink);
  border-radius:20px;opacity:0;transition:opacity .2s ease;pointer-events:none;
}
.btn--shout:hover::after{opacity:.55}

/* ---------- 5. Header ------------------------------------------------- */
.site-header{
  background:var(--bm-yellow);border-bottom:var(--bm-line);backdrop-filter:none;
}
.site-header.is-stuck{box-shadow:0 5px 0 rgba(16,20,24,.16);border-bottom:var(--bm-line)}
.header-inner{gap:20px}
.brand__logo{max-height:60px;max-width:230px}
.site-header .brand__logo{filter:drop-shadow(2px 2px 0 rgba(16,20,24,.18))}
.nav{gap:2px}
.nav a{
  font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--bm-ink);
  padding:9px 13px;border-radius:10px;border:2px solid transparent;
}
.nav a:hover{background:#fff;border:var(--bm-line-thin);color:var(--bm-ink)}
.nav a.is-active{background:var(--bm-blue);color:#fff;border:var(--bm-line-thin);box-shadow:var(--bm-pop-sm)}
.nav a.is-active::after{display:none}
.header-actions{gap:10px}
.header-cta{
  display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:12px;
  background:var(--bm-blue);color:#fff;border:var(--bm-line);box-shadow:var(--bm-pop-sm);
  font-family:var(--font-display);font-weight:600;font-size:15px;white-space:nowrap;
  transition:transform .12s ease,box-shadow .12s ease;
}
.header-cta:hover{color:#fff;transform:translate(2px,2px);box-shadow:0 0 0 var(--bm-ink)}
.header-cta svg{width:18px;height:18px}
.nav-toggle{border:var(--bm-line-thin);background:#fff;border-radius:12px;box-shadow:var(--bm-pop-sm)}
.theme-toggle{border:var(--bm-line-thin);border-radius:12px;background:#fff}

.mobile-nav{background:var(--bm-cream);border-left:var(--bm-line)}
.mobile-nav a:not(.btn){
  font-family:var(--font-display);font-weight:600;color:var(--bm-ink);
  border-bottom:2px dashed rgba(16,20,24,.18);border-radius:10px;
}
.mobile-nav a:not(.btn):hover,.mobile-nav a:not(.btn).is-active{background:var(--bm-yellow);color:var(--bm-ink)}
.scrim.is-open{background:rgba(12,75,95,.55)}

/* ---------- 6. Home hero ---------------------------------------------- */
.hero{
  min-height:auto;padding:56px 0 64px;background:var(--bm-cream);
  border-bottom:var(--bm-line);
}
.hero__bg{opacity:.22;filter:saturate(1.1)}
.hero::before{
  background:linear-gradient(100deg,rgba(255,249,232,.97) 0%,rgba(255,249,232,.92) 42%,rgba(255,249,232,.55) 70%,rgba(255,249,232,.35) 100%);
}
.hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:44px;align-items:center}
.hero__script{
  font-family:var(--font-display);font-style:normal;font-weight:600;
  font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:var(--bm-ink);
  background:#fff;border:var(--bm-line-thin);border-radius:999px;display:inline-block;
  padding:7px 16px;box-shadow:var(--bm-pop-sm);transform:rotate(-1.2deg);margin-bottom:18px;
}
.hero__title{
  font-size:clamp(38px,6.2vw,72px);line-height:.98;color:var(--bm-ink);letter-spacing:-.02em;
}
.hero__title em{font-style:normal;color:var(--bm-blue);position:relative;white-space:nowrap}
.hero__title em::after{
  content:"";position:absolute;left:-2%;right:-2%;bottom:.06em;height:.30em;
  background:var(--bm-yellow);border-radius:6px;z-index:-1;transform:rotate(-1deg);
}
.hero__lead{font-size:17px;color:var(--ink-700);max-width:50ch;margin-top:20px}
.hero__cta{gap:14px;margin-top:30px}

/* Mascot: the logo character peeking into the hero */
.hero__mascot{
  position:absolute;right:2%;bottom:-6px;width:min(260px,22vw);z-index:1;
  filter:drop-shadow(6px 6px 0 rgba(16,20,24,.18));pointer-events:none;
}

/* Trust card becomes a pinned note */
.trust-card{
  background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);
  box-shadow:var(--bm-pop-lg);backdrop-filter:none;padding:24px;gap:18px;transform:rotate(1deg);
}
.trust-item__icon{
  width:44px;height:44px;border-radius:12px;background:var(--bm-yellow);
  border:var(--bm-line-thin);color:var(--bm-ink);box-shadow:var(--bm-pop-sm);
}
.trust-item__icon svg{width:22px;height:22px;stroke-width:2.2}
.trust-item h4{font-family:var(--font-display);font-size:15px;font-weight:600}
.trust-item p{color:var(--ink-500)}

/* ---------- 7. Ticker strip (new) ------------------------------------- */
.bm-ticker{
  background:var(--bm-blue);color:#fff;border-top:var(--bm-line);border-bottom:var(--bm-line);
  overflow:hidden;padding:12px 0;
}
.bm-ticker__track{display:flex;gap:34px;width:max-content;animation:bm-scroll 32s linear infinite}
.bm-ticker span{
  display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);
  font-weight:600;font-size:16px;letter-spacing:.04em;white-space:nowrap;
}
.bm-ticker span::after{content:"✦";color:var(--bm-yellow);font-size:15px}
@keyframes bm-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.bm-ticker__track{animation:none}}

/* ---------- 8. Tour cards --------------------------------------------- */
.tcard{
  background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);
  box-shadow:var(--bm-pop);overflow:hidden;transition:transform .16s ease,box-shadow .16s ease;
}
.tcard:hover{transform:translate(-2px,-2px);box-shadow:var(--bm-pop-lg)}
.tcard__media{border-bottom:var(--bm-line)}
.tcard__title{font-family:var(--font-display);font-size:19px;font-weight:600}
.tcard__title a:hover{color:var(--bm-blue)}
.tcard__desc{color:var(--ink-500);font-size:14px}
.badge{
  border:var(--bm-line-thin);border-radius:999px;box-shadow:var(--bm-pop-sm);
  font-family:var(--font-display);font-weight:600;letter-spacing:.02em;
  background:var(--bm-yellow);color:var(--bm-ink);padding:6px 13px;
}
.badge--seller,.badge--hot{background:var(--bm-red);color:#fff}
.badge--new{background:var(--bm-blue);color:#fff}
.tcard__meta span,.tcard__dur,.tcard__when{
  background:var(--bm-ink);color:#fff;border-radius:8px;font-weight:600;font-size:12.5px;
}
.tcard__pricebox{border-top:2px dashed rgba(16,20,24,.25);background:var(--bm-cream)}
.tcard__from b{font-family:var(--font-display);color:var(--bm-ink);font-size:23px}
.tcard__from span{color:var(--ink-500);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.tcard__foot{border-top:var(--bm-line-thin);background:#fff;gap:10px}
.tcard__grid table{font-size:13px}
.tcard__grid th{background:var(--bm-blue);color:#fff}

/* price tag corner on every card */
.tcard__media::after{
  content:"";position:absolute;left:0;bottom:-1px;width:100%;height:14px;
  background:repeating-linear-gradient(90deg,var(--bm-yellow) 0 14px,var(--bm-ink) 14px 28px);
  opacity:.9;
}

/* ---------- 9. Carousel controls -------------------------------------- */
.vgc__arrow,.vgc-arrow,.rail-arrow{
  background:#fff;border:var(--bm-line);border-radius:12px;color:var(--bm-ink);
  box-shadow:var(--bm-pop-sm);
}
.vgc__arrow:hover,.vgc-arrow:hover,.rail-arrow:hover{background:var(--bm-yellow);transform:translate(1px,1px);box-shadow:2px 2px 0 var(--bm-ink)}
.vgc__dot.is-active,.vgc-dot.is-active{background:var(--bm-blue)}

/* ---------- 10. Why / promo ------------------------------------------- */
.why{background:var(--bm-blue);border-top:var(--bm-line);border-bottom:var(--bm-line);color:#fff}
.why h2,.why .eyebrow{color:var(--bm-ink)}
.why h2{color:#fff}
.why-item{background:rgba(255,255,255,.07);border:2px solid rgba(255,255,255,.28);border-radius:16px;padding:18px}
.why-item__icon{background:var(--bm-yellow);border:var(--bm-line-thin);border-radius:12px;color:var(--bm-ink);box-shadow:var(--bm-pop-sm)}
.why-item h4{font-family:var(--font-display);color:#fff;font-weight:600}
.why-item p{color:rgba(255,255,255,.76)}

.promo{
  background:#fff;border:var(--bm-line);border-radius:var(--radius-xl);
  box-shadow:var(--bm-pop-lg);overflow:hidden;
}
.promo__eyebrow{
  background:var(--bm-yellow);border:var(--bm-line-thin);border-radius:999px;color:var(--bm-ink);
  padding:6px 14px;font-weight:800;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  box-shadow:var(--bm-pop-sm);display:inline-block;
}
.promo__title{font-family:var(--font-display);font-size:clamp(24px,2.6vw,32px);color:var(--bm-ink)}
.promo__lead{color:var(--ink-600,var(--ink-700))}
.promo__card{border:var(--bm-line-thin);border-radius:14px;box-shadow:var(--bm-pop-sm);overflow:hidden}
.promo__cap{background:var(--bm-ink);color:#fff;font-weight:600}

/* ---------- 11. Inner page hero --------------------------------------- */
.page-hero{
  background:var(--bm-blue);border-bottom:var(--bm-line);padding:66px 0 58px;position:relative;
}
.page-hero__bg{opacity:.34}
.page-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:12px;
  background:repeating-linear-gradient(90deg,var(--bm-yellow) 0 18px,var(--bm-ink) 18px 36px);
}
.page-hero h1{
  font-family:var(--font-display);color:#fff;font-size:clamp(32px,5vw,54px);
  text-shadow:3px 3px 0 rgba(16,20,24,.45);
}
.page-hero p{color:rgba(255,255,255,.92);font-size:16.5px;max-width:62ch}
.crumbs{margin-top:18px}
.crumbs a,.crumbs span{color:#fff;font-weight:600;font-size:13.5px}
.crumbs a:hover{color:var(--bm-yellow)}

/* ---------- 12. Footer ------------------------------------------------ */
.site-footer{background:var(--bm-blue-night);border-top:var(--bm-line);color:rgba(255,255,255,.82)}
.site-footer::before{
  content:"";display:block;height:14px;margin-bottom:46px;
  background:repeating-linear-gradient(90deg,var(--bm-yellow) 0 20px,var(--bm-ink) 20px 40px);
}
.site-footer h4{
  font-family:var(--font-display);color:var(--bm-yellow);font-size:16px;font-weight:600;
  letter-spacing:.02em;text-transform:none;
}
.site-footer a:hover{color:var(--bm-yellow)}
.footer-social a{
  width:42px;height:42px;border-radius:12px;background:var(--bm-yellow);color:var(--bm-ink);
  border:var(--bm-line-thin);box-shadow:var(--bm-pop-sm);display:grid;place-items:center;
}
.footer-social a:hover{background:#fff;transform:translate(1px,1px);box-shadow:2px 2px 0 var(--bm-ink)}
.footer-bottom{border-top:2px dashed rgba(255,255,255,.25)}

/* ---------- 13. Forms -------------------------------------------------- */
.panel-card{background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop)}
.field label,.field > span{font-family:var(--font-display);font-weight:600;color:var(--bm-ink)}
.input,input[type=text],input[type=tel],input[type=email],input[type=date],input[type=number],select,textarea{
  border:var(--bm-line-thin);border-radius:12px;background:#fff;padding:12px 14px;font-size:15px;
  transition:box-shadow .15s ease,border-color .15s ease;
}
.input:focus,input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--bm-blue);box-shadow:var(--bm-pop-sm);
}
.check-grid label{border:var(--bm-line-thin);border-radius:12px;background:#fff;padding:10px 14px;font-weight:600}
.check-grid input:checked + span,.check-grid label:has(input:checked){background:var(--bm-yellow);box-shadow:var(--bm-pop-sm)}
.form-step{border:var(--bm-line-thin);border-radius:var(--radius);background:var(--bm-cream)}
.alert{border:var(--bm-line-thin);border-radius:14px;box-shadow:var(--bm-pop-sm);font-weight:600}
.alert--error{background:#FFE6E4;color:#8E1B14}
.alert--success{background:#E3F8EC;color:#0B5B31}

/* ---------- 14. Tour detail ------------------------------------------- */
.td-hero{
  border:var(--bm-line);border-radius:var(--radius-xl);box-shadow:var(--bm-pop-lg);overflow:hidden;
}
.td-hero__inner{background:linear-gradient(180deg,rgba(8,49,62,.10),rgba(8,49,62,.86))}
.td-hero h1{font-family:var(--font-display);text-shadow:3px 3px 0 rgba(16,20,24,.45)}
.td-hero__dur{
  display:inline-block;background:var(--bm-yellow);color:var(--bm-ink);border:var(--bm-line-thin);
  border-radius:999px;padding:5px 14px;font-weight:800;font-size:13px;box-shadow:var(--bm-pop-sm);
}
.td-hero__tags span{background:#fff;color:var(--bm-ink);border:var(--bm-line-thin);border-radius:999px;font-weight:600}
.td-hero__price{background:#fff;border:var(--bm-line);border-radius:16px;box-shadow:var(--bm-pop-sm);padding:12px 18px}
.td-hero__price b{font-family:var(--font-display);color:var(--bm-ink)}

.td-facts{gap:14px}
.td-fact{
  background:#fff;border:var(--bm-line-thin);border-radius:16px;box-shadow:var(--bm-pop-sm);padding:16px;
}
.td-fact__ico{background:var(--bm-yellow);border:var(--bm-line-thin);border-radius:12px;color:var(--bm-ink)}
.td-fact b{font-family:var(--font-display);font-weight:600}

.td-tabs{border-bottom:var(--bm-line-thin);gap:8px}
.tab{
  font-family:var(--font-display);font-weight:600;border:var(--bm-line-thin);border-bottom:0;
  border-radius:12px 12px 0 0;background:#fff;color:var(--bm-ink);padding:11px 18px;
}
.tab.is-active{background:var(--bm-yellow);box-shadow:3px -3px 0 var(--bm-ink)}
.td-h2{font-family:var(--font-display);font-size:26px;color:var(--bm-ink)}
.td-h2::after{content:"";display:block;width:64px;height:5px;background:var(--bm-yellow);border-radius:4px;margin-top:10px}
.td-highlights li{background:#fff;border:var(--bm-line-thin);border-radius:12px;padding:12px 14px;box-shadow:var(--bm-pop-sm)}
.td-highlights svg{color:var(--bm-blue)}

/* Itinerary as a stitched timeline */
.itin{position:relative;padding-left:8px}
.itin::before{
  content:"";position:absolute;left:34px;top:18px;bottom:18px;width:3px;
  background:repeating-linear-gradient(180deg,var(--bm-ink) 0 8px,transparent 8px 16px);
}
.itin-card{
  background:#fff;border:var(--bm-line-thin);border-radius:var(--radius);
  box-shadow:var(--bm-pop-sm);position:relative;
}
.itin-card:hover{box-shadow:var(--bm-pop)}
.itin-card__badge{
  background:var(--bm-yellow);border:var(--bm-line);border-radius:14px;color:var(--bm-ink);
  box-shadow:var(--bm-pop-sm);z-index:1;
}
.itin-card__badge b{font-family:var(--font-display);font-size:22px}
.itin-card__title{font-family:var(--font-display);font-weight:600;color:var(--bm-ink)}
.itin-dot{background:var(--bm-red);border:2px solid var(--bm-ink)}

.td-book{
  background:var(--bm-yellow);border:var(--bm-line);border-radius:var(--radius-lg);
  box-shadow:var(--bm-pop-lg);
}
.td-book__label{color:var(--bm-ink);font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:11.5px}
.td-book__price{font-family:var(--font-display);color:var(--bm-ink)}
.td-book__note{background:#fff;border:var(--bm-line-thin);border-radius:999px;padding:5px 12px;font-weight:700;font-size:12.5px;display:inline-flex}
.td-book .btn--book{background:var(--bm-blue);color:#fff}
.td-book .btn--book:hover{background:var(--bm-blue-deep);color:#fff}
.td-book .btn--gold{background:#fff}
.td-trust li{background:rgba(255,255,255,.55);border:2px solid rgba(16,20,24,.25);border-radius:12px}
.td-summary{background:#fff;border:var(--bm-line-thin);border-radius:var(--radius-lg);box-shadow:var(--bm-pop-sm)}
.td-summary h3{font-family:var(--font-display);font-weight:600}
.td-summary dt{color:var(--ink-500);font-weight:700}
.td-summary dd{font-weight:700;color:var(--bm-ink)}

/* ---------- 15. Reviews ------------------------------------------------ */
.review-card,.rev-card{background:#fff;border:var(--bm-line-thin);border-radius:var(--radius-lg);box-shadow:var(--bm-pop-sm)}
.review-card:hover,.rev-card:hover{box-shadow:var(--bm-pop)}
.stars svg,.star svg{color:var(--bm-yellow-deep)}

/* ---------- 16. By Air plans (new) ------------------------------------ */
.air-plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:26px}
.air-plan{
  background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop);
  display:flex;flex-direction:column;overflow:hidden;transition:transform .16s ease,box-shadow .16s ease;
}
.air-plan:hover{transform:translate(-2px,-2px);box-shadow:var(--bm-pop-lg)}
.air-plan__top{
  background:var(--bm-blue);color:#fff;padding:20px 22px 18px;position:relative;border-bottom:var(--bm-line);
}
.air-plan__top::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:8px;
  background:repeating-linear-gradient(90deg,var(--bm-yellow) 0 12px,transparent 12px 24px);
}
.air-plan__days{
  display:inline-flex;align-items:baseline;gap:7px;background:var(--bm-yellow);color:var(--bm-ink);
  border:var(--bm-line-thin);border-radius:12px;padding:5px 12px;box-shadow:var(--bm-pop-sm);
  font-family:var(--font-display);font-weight:600;
}
.air-plan__days b{font-size:22px;line-height:1}
.air-plan__title{font-family:var(--font-display);font-size:23px;font-weight:600;margin-top:14px;color:#fff}
.air-plan__where{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:13.5px;color:rgba(255,255,255,.85)}
.air-plan__body{padding:20px 22px;display:flex;flex-direction:column;gap:14px;flex:1}
.air-plan__chips{display:flex;flex-wrap:wrap;gap:8px}
.air-plan__chips span{
  background:var(--bm-cream);border:var(--bm-line-thin);border-radius:999px;padding:5px 12px;
  font-size:12.5px;font-weight:700;color:var(--bm-ink);
}
.air-plan__days-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.air-plan__day{display:flex;gap:12px;align-items:flex-start}
.air-plan__day b{
  flex:none;width:52px;height:30px;display:grid;place-items:center;background:var(--bm-yellow);
  border:var(--bm-line-thin);border-radius:9px;font-family:var(--font-display);font-size:13px;
}
.air-plan__day span{font-size:14px;color:var(--ink-700);line-height:1.5}
.air-plan details{border-top:2px dashed rgba(16,20,24,.22);padding-top:14px}
.air-plan summary{
  cursor:pointer;font-family:var(--font-display);font-weight:600;color:var(--bm-blue);
  display:flex;align-items:center;justify-content:space-between;gap:10px;list-style:none;
}
.air-plan summary::-webkit-details-marker{display:none}
.air-plan summary::after{content:"＋";font-size:20px;line-height:1}
.air-plan details[open] summary::after{content:"－"}
.air-plan__foot{padding:0 22px 22px;display:flex;gap:10px;flex-wrap:wrap}
.air-plan__foot .btn{flex:1;min-width:140px}

.air-terms{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.air-term{background:#fff;border:var(--bm-line-thin);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--bm-pop-sm)}
.air-term b{display:block;font-family:var(--font-display);font-weight:600;color:var(--bm-ink);margin-bottom:6px}
.air-term p{font-size:14px;color:var(--ink-600,var(--ink-700));line-height:1.6}
.air-term__no{
  display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;
  background:var(--bm-yellow);border:var(--bm-line-thin);font-family:var(--font-display);
  font-weight:600;margin-bottom:10px;box-shadow:var(--bm-pop-sm);
}

.air-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:20px;counter-reset:step}
.air-step{background:#fff;border:var(--bm-line-thin);border-radius:var(--radius);padding:22px 20px;box-shadow:var(--bm-pop-sm);position:relative}
.air-step::before{
  counter-increment:step;content:counter(step);
  position:absolute;top:-16px;left:18px;width:38px;height:38px;display:grid;place-items:center;
  background:var(--bm-red);color:#fff;border:var(--bm-line-thin);border-radius:12px;
  font-family:var(--font-display);font-weight:600;box-shadow:var(--bm-pop-sm);
}
.air-step h4{font-family:var(--font-display);font-weight:600;margin:14px 0 6px;color:var(--bm-ink)}
.air-step p{font-size:14px;color:var(--ink-700)}

.air-band{background:var(--bm-cream);border:var(--bm-line);border-radius:var(--radius-xl);box-shadow:var(--bm-pop)}
.air-band__list li{background:#fff;border:var(--bm-line-thin);border-radius:12px;box-shadow:var(--bm-pop-sm)}

/* ---------- 18. Odds and ends ----------------------------------------- */
.rail-head{gap:20px;align-items:flex-end}
.trust-strip,.strip{background:var(--bm-sand);border-top:var(--bm-line-thin);border-bottom:var(--bm-line-thin)}
.toast{border:var(--bm-line-thin);border-radius:14px;box-shadow:var(--bm-pop-sm);font-weight:600}
.pagination a,.pagination span{border:var(--bm-line-thin);border-radius:10px;font-weight:700}
.pagination .is-active{background:var(--bm-yellow);box-shadow:var(--bm-pop-sm)}
.book-popup,.popup__panel,.modal__panel{border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop-lg)}

/* ---------- 19. Responsive -------------------------------------------- */
@media (max-width:1100px){
  .hero__mascot{width:190px;opacity:.9}
}
@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr}
  .trust-card{transform:none}
  .hero__mascot{display:none}
  .header-cta span{display:none}
  .header-cta{padding:11px 13px}
}
@media (max-width:640px){
  .section{padding:52px 0}
  .btn{box-shadow:var(--bm-pop-sm)}
  .hero__title{font-size:clamp(32px,9vw,44px)}
  .air-plan__foot .btn{min-width:0}
  .site-footer::before{margin-bottom:32px}
}

/* ---------- 20. Fixes after first visual pass -------------------------- */
/* .eyebrow is a flex child in several layouts, where stretch made it a bar */
.eyebrow{align-self:flex-start;width:-moz-fit-content;width:fit-content;max-width:100%}
.split__aside{align-items:flex-start}

/* "Why choose us" needs room to breathe */
.why{padding:64px 0}
.why__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.why__grid > div:first-child{grid-column:1 / -1;margin-bottom:4px}
.why-item{padding:20px;gap:14px}
.why-item h4{font-size:16px}
.why-item p{font-size:14px;line-height:1.55}
@media (min-width:900px){
  .why__grid{grid-template-columns:1.1fr repeat(2,minmax(0,1fr));row-gap:22px}
  .why__grid > div:first-child{grid-column:1;grid-row:span 2;margin-bottom:0;align-self:center}
}

/* Trust strip: small stickers rather than plain text */
.trust-strip .wrap,.strip .wrap{gap:14px;flex-wrap:wrap}
.trust-strip li,.strip li,.trust-strip__item{
  background:#fff;border:var(--bm-line-thin);border-radius:999px;padding:8px 16px;
  box-shadow:var(--bm-pop-sm);font-weight:700;font-size:13.5px;
}

/* Tour card stripe: lighter touch */
.tcard__media::after{height:9px;opacity:.95}

/* ---------- 21. Tour detail fixes & mobile booking bar ----------------- */
/* the day number was amber-on-amber once the badge turned yellow */
.itin-card__badge small{color:rgba(16,20,24,.62)}
.itin-card__badge b{color:var(--bm-ink)}
.itin-card:first-child .itin-card__badge,
.itin-card:hover .itin-card__badge{border-color:var(--bm-ink);background:var(--bm-yellow)}

/* Sticky booking bar — phones only, where the sidebar is far below the fold */
.td-stickybar{
  position:fixed;left:0;right:0;bottom:0;z-index:130;display:none;
  align-items:center;gap:12px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:var(--bm-yellow);border-top:var(--bm-line);
}
.td-stickybar__price{display:flex;flex-direction:column;line-height:1.15;flex:1;min-width:0}
.td-stickybar__price small{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(16,20,24,.65)}
.td-stickybar__price b{font-family:var(--font-display);font-size:19px;color:var(--bm-ink)}
.td-stickybar .btn{flex:none;box-shadow:var(--bm-pop-sm)}
@media (max-width:900px){
  .td-stickybar{display:flex}
  body.has-stickybar{padding-bottom:76px}
}

/* ---------- 22. Tour filter bar (group tours) -------------------------- */
.tour-filter{display:flex;flex-direction:column;gap:16px;margin:0 0 26px}
.tour-filter__search{
  display:flex;align-items:center;gap:10px;padding:8px 8px 8px 16px;
  background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop);
}
.tour-filter__search > svg{width:20px;height:20px;flex:none;color:var(--bm-blue)}
.tour-filter__search input{
  flex:1;min-width:0;border:0;background:none;outline:none;
  font:600 15px/1.3 var(--font-body,inherit);color:var(--bm-ink);padding:8px 0;
}
.tour-filter__search input::placeholder{color:rgba(16,20,24,.45);font-weight:500}
.tour-filter__search .btn{flex:none;padding:10px 18px;box-shadow:var(--bm-pop-sm)}

.tour-filter__row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.tour-chips{display:flex;flex-wrap:wrap;gap:8px}
.tour-chip{
  display:inline-flex;align-items:center;padding:7px 14px;border:2px solid var(--bm-ink);
  border-radius:999px;background:#fff;color:var(--bm-ink);
  font:800 12.5px/1 var(--font-body,inherit);letter-spacing:.02em;text-decoration:none;
  transition:background .14s ease,transform .14s ease;
}
.tour-chip:hover{background:var(--bm-cream,#FFF9E8);transform:translateY(-1px)}
.tour-chip.is-on{background:var(--bm-yellow);box-shadow:3px 3px 0 var(--bm-ink)}

.tour-sort{display:inline-flex;align-items:center;gap:8px}
.tour-sort span{font:800 11px/1 var(--font-body,inherit);letter-spacing:.12em;text-transform:uppercase;color:rgba(16,20,24,.6)}
.tour-sort select{
  appearance:none;padding:9px 34px 9px 14px;border:2px solid var(--bm-ink);border-radius:999px;
  background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23101418' stroke-width='3' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right 11px center/13px;
  font:800 13px/1 var(--font-body,inherit);color:var(--bm-ink);cursor:pointer;
}
.tour-filter .list-count{margin:0}
@media (max-width:560px){
  .tour-filter__search{flex-wrap:wrap;padding:12px}
  .tour-filter__search input{flex:1 1 100%;order:2}
  .tour-filter__search .btn{order:3;margin-left:auto}
  .tour-filter__row{align-items:flex-start;flex-direction:column}
}

/* ---------- 23. By Air plan detail page ------------------------------- */
.air-plan__title a{color:inherit;text-decoration:none}
.air-plan__title a:hover{color:var(--bm-blue)}
.air-plans--mini{grid-template-columns:repeat(3,1fr)}
.air-plans--mini .air-plan__body{padding-bottom:0}
.td .air-steps{margin:8px 0 34px}
.td-hero__price small{display:block;font-size:11px;font-weight:700;opacity:.7;margin-top:2px}
.td-book__price--demand{font-size:23px;line-height:1.2}
@media (max-width:900px){ .air-plans--mini{grid-template-columns:1fr} }
/* inside the narrower detail column, four steps read better as a 2x2 */
.td .air-steps{grid-template-columns:repeat(2,1fr)}
@media (max-width:700px){ .td .air-steps{grid-template-columns:1fr} }

/* ---------- 24. Bayzaar Fits — coming soon ---------------------------- */
.soon{
  position:relative;overflow:hidden;padding:72px 0 92px;
  background:var(--bm-yellow);border-bottom:var(--bm-line);
  background-image:radial-gradient(var(--bm-ink) 1.5px,transparent 1.6px);
  background-size:22px 22px;background-position:-11px -11px;
}
.soon__inner{position:relative;text-align:center;max-width:860px}
.soon__badge{
  display:inline-block;padding:9px 20px;margin-bottom:22px;
  background:var(--bm-red);color:#fff;border:var(--bm-line);border-radius:999px;
  box-shadow:var(--bm-pop-sm);font:800 12px/1 var(--font-body,inherit);
  letter-spacing:.18em;text-transform:uppercase;transform:rotate(-2deg);
}
.soon__title{
  font-family:var(--font-display);font-size:clamp(42px,8vw,86px);line-height:.95;
  color:var(--bm-ink);margin:0 0 18px;text-transform:uppercase;letter-spacing:-.01em;
  text-shadow:4px 4px 0 #fff, 7px 7px 0 var(--bm-ink);
}
.soon__lead{max-width:620px;margin:0 auto 40px;font-size:17px;line-height:1.65;color:rgba(16,20,24,.82)}

.soon__points{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:40px;text-align:left}
.soon__point{background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop);padding:20px}
.soon__ico{
  display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;margin-bottom:12px;
  background:var(--bm-blue);color:#fff;border:var(--bm-line);border-radius:12px;
}
.soon__ico svg{width:20px;height:20px}
.soon__point b{display:block;font-family:var(--font-display);font-size:17px;color:var(--bm-ink);margin-bottom:6px}
.soon__point p{margin:0;font-size:14px;line-height:1.6;color:rgba(16,20,24,.7)}

.soon__cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.soon__mascot{
  position:absolute;right:-18px;bottom:-96px;width:148px;height:auto;pointer-events:none;
  filter:drop-shadow(5px 5px 0 rgba(0,0,0,.28));
}
@media (max-width:820px){
  .soon{padding:56px 0 72px}
  .soon__points{grid-template-columns:1fr}
  .soon__mascot{display:none}
}
/* the mascot was crowding the second CTA at desktop width */
.soon__mascot{right:-74px;bottom:-104px;width:134px;z-index:0}
.soon__badge,.soon__title,.soon__lead,.soon__points,.soon__cta{position:relative;z-index:1}
/* the dot grid runs behind the lead, so give the text its own ground */
.soon__lead{text-shadow:0 1px 0 var(--bm-yellow),0 -1px 0 var(--bm-yellow),1px 0 0 var(--bm-yellow),-1px 0 0 var(--bm-yellow)}

/* ---------- 25. Phone hardening ---------------------------------------
 * Reported from a real Android device: headings, buttons and form rows
 * were being cut off. Two causes — buttons inherited white-space:nowrap,
 * and grid/flex children default to min-width:auto, so a long label makes
 * the whole row wider than the screen instead of wrapping. Nothing here
 * depends on the exact font metrics, so a device with larger text set
 * still lays out correctly.
 * -------------------------------------------------------------------- */
.btn{white-space:normal;max-width:100%;text-align:center}
.wrap{max-width:100%;box-sizing:border-box}
.field,.form-grid > *,.check-grid > *,.detail,.td-main,.td-side,.air-plan,.tcard,.soon__point{min-width:0}
.input,input[type=text],input[type=tel],input[type=email],input[type=date],input[type=number],select,textarea{
  width:100%;max-width:100%;box-sizing:border-box;min-width:0;
}
.form-step{max-width:100%;overflow-wrap:break-word}
.promo__cap{overflow-wrap:anywhere}

@media (max-width:760px){
  /* Two form columns cannot hold a label and a field on a phone. */
  .form-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  .check-grid{grid-template-columns:1fr}
  /* The new skin set two columns for every width; below this they squeeze
     the text to one word per line. */
  .why__grid{grid-template-columns:1fr}
  .why__grid > div:first-child{margin-bottom:0}
  .air-plan__foot{flex-direction:column;align-items:stretch}
  .air-plan__foot .btn{width:100%}
  .soon__cta .btn{width:100%}
}

/* ---------- 26. Homepage CTA panels ------------------------------------
 * One photograph per panel, framed like a postcard with a rotated stamp.
 * The old fanned deck of four is gone, so the grid can hold a real image
 * and both halves sit on the same centre line at every width.
 * -------------------------------------------------------------------- */
.promo{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,44%);
  gap:40px;align-items:center;padding:40px;
  background:var(--bm-cream);border:var(--bm-line);border-radius:var(--radius-xl);
  box-shadow:var(--bm-pop-lg);overflow:hidden;position:relative;
}
/* A flat wash of the panel's own colour, instead of the old dark gradient. */
.promo--air{background:#EAF4F7}
.promo--custom{background:var(--bm-cream)}
.promo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(16,20,24,.14) 1.2px,transparent 1.3px);
  background-size:20px 20px;opacity:.5;
}
.promo__text{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
.promo__title{margin:0;line-height:1.08}
.promo__lead{margin:0;font-size:15.5px;line-height:1.65}

.promo__facts{list-style:none;margin:2px 0 4px;padding:0;display:flex;flex-direction:column;gap:9px}
.promo__facts li{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14.5px;color:var(--bm-ink)}
.promo__facts svg{
  width:15px;height:15px;flex:none;padding:3px;border-radius:50%;
  background:var(--bm-yellow);border:2px solid var(--bm-ink);color:var(--bm-ink);stroke-width:3.4;
}
.promo__btn{
  background:var(--bm-yellow);color:var(--bm-ink);border:var(--bm-line);border-radius:14px;
  box-shadow:var(--bm-pop);text-transform:none;letter-spacing:0;font-size:15.5px;
}
.promo__btn:hover{background:var(--bm-yellow);color:var(--bm-ink);transform:translate(2px,2px);box-shadow:var(--bm-pop-sm)}
.promo--air .promo__btn{background:var(--bm-blue);color:#fff}
.promo--air .promo__btn:hover{background:var(--bm-blue);color:#fff}

.promo__shot{
  position:relative;z-index:1;margin:0;aspect-ratio:4/3;
  border:var(--bm-line);border-radius:18px;overflow:hidden;background:#fff;
  box-shadow:var(--bm-pop);transform:rotate(-1.4deg);
  transition:transform .3s cubic-bezier(.2,.6,.2,1);
}
.promo--custom .promo__shot{transform:rotate(1.4deg)}
.promo:hover .promo__shot{transform:rotate(0)}
.promo__shot img{width:100%;height:100%;object-fit:cover;display:block}
.promo__stamp{
  position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:7px;
  padding:8px 14px;background:var(--bm-yellow);color:var(--bm-ink);
  border:var(--bm-line);border-radius:999px;box-shadow:var(--bm-pop-sm);
  font-family:var(--font-display);font-weight:600;font-size:13px;transform:rotate(-3deg);
}
.promo__stamp svg{width:16px;height:16px}

@media (max-width:900px){
  .promo{grid-template-columns:1fr;gap:26px;padding:26px}
  /* Photo first on a phone — it is what stops the scroll. */
  .promo__shot{order:-1;transform:none}
  .promo--custom .promo__shot{transform:none}
  .promo__text{align-items:stretch}
  .promo__btn{align-self:flex-start}
}
/* Coming Soon is now the headline, with the range name as its eyebrow. */
.soon__brand{
  position:relative;z-index:1;margin:0 0 6px;
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(20px,3.6vw,30px);letter-spacing:.04em;text-transform:uppercase;
  color:var(--bm-blue);text-shadow:2px 2px 0 #fff;
}
.soon__title{font-size:clamp(52px,11vw,116px);margin-bottom:22px}
/* style.css pins the two hero buttons to one row and forbids wrapping; with
   a larger system text size the labels then run outside the button. Let the
   label wrap to a second line instead of being cut off. */
@media (max-width:640px){
  .hero__cta .btn{white-space:normal;line-height:1.2}
}
/* A bare text label inside a flex button is an anonymous flex item: no
   selector can reach it, so it refuses to shrink and the label is cut off
   on narrow phones. Letting the button itself wrap moves the icon to a
   second line instead of clipping the words. */
.btn{flex-wrap:wrap;row-gap:2px}

/* ---------- 27. "Things to Do" on tour cards ---------------------------
 * The activities are what separates one of these trips from the next, so
 * the card names them instead of making people open the tour first.
 * -------------------------------------------------------------------- */
.tcard__doing{margin:2px 0 14px}
.tcard__doing-head{
  display:inline-flex;align-items:center;gap:6px;margin-bottom:9px;
  font:800 10.5px/1 var(--font-body,inherit);letter-spacing:.14em;text-transform:uppercase;
  color:var(--bm-blue);
}
.tcard__doing-head svg{width:14px;height:14px;stroke-width:2.6}
.tcard__doing ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:4px 14px;
}
.tcard__doing li{
  position:relative;padding-left:14px;
  font:600 12.5px/1.45 var(--font-body,inherit);color:var(--bm-ink);
  overflow-wrap:anywhere;
}
.tcard__doing li::before{
  content:"";position:absolute;left:0;top:.5em;width:6px;height:6px;
  border:2px solid var(--bm-ink);border-radius:50%;background:var(--bm-yellow);
}
@media (max-width:420px){ .tcard__doing ul{grid-template-columns:1fr} }
.tcard--mini .tcard__doing{display:none}

/* ---------- 28. Who the trips are for --------------------------------- */
.td-policy{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin:18px 0 0;padding:12px 18px;
  background:var(--bm-yellow);border:var(--bm-line);border-radius:14px;box-shadow:var(--bm-pop-sm);
  font-family:var(--font-display);font-weight:600;font-size:14.5px;letter-spacing:.04em;
  color:var(--bm-ink);text-align:center;
}
.td-policy svg{width:18px;height:18px;flex:none;stroke-width:2.4}
.td-policy span{overflow-wrap:anywhere}
@media (max-width:520px){ .td-policy{font-size:13px;padding:11px 14px} }

/* ---------- 29. Card image slider --------------------------------------
 * Featured images are a fixed 4:3 window: every photo is cropped to the
 * same shape, so a card never changes height when the slide changes.
 * -------------------------------------------------------------------- */
.tcard__media{aspect-ratio:4/3;max-height:none}
.tcard--mini .tcard__media{aspect-ratio:4/3}
.tcard__shots{position:absolute;inset:0;display:block}
.tcard__shot{
  position:absolute;inset:0;opacity:0;visibility:hidden;
  transition:opacity .45s ease;
}
.tcard__shot.is-on{opacity:1;visibility:visible}
.tcard__shot img{width:100%;height:100%;object-fit:cover;display:block}

.tcard__nav{
  position:absolute;top:50%;z-index:3;translate:0 -50%;
  display:grid;place-items:center;width:34px;height:34px;padding:0;
  background:#fff;border:var(--bm-line-thin);border-radius:50%;
  box-shadow:2px 2px 0 var(--bm-ink);color:var(--bm-ink);cursor:pointer;
  opacity:0;transition:opacity .2s ease,transform .12s ease;
}
.tcard__nav--prev{left:10px}
.tcard__nav--next{right:10px}
.tcard__nav svg{width:17px;height:17px;stroke-width:2.6}
.tcard__nav:hover{transform:translate(1px,1px) translateY(-50%);box-shadow:1px 1px 0 var(--bm-ink)}
.tcard:hover .tcard__nav,.tcard__nav:focus-visible{opacity:1}
@media (hover:none){ .tcard__nav{opacity:1} }   /* touch: always reachable */

.tcard__dots{
  position:absolute;left:0;right:0;bottom:52px;z-index:3;
  display:flex;justify-content:center;gap:5px;pointer-events:none;
}
.tcard__dots i{
  width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.55);
  border:1.5px solid rgba(16,20,24,.5);transition:width .2s ease,background .2s ease;
}
.tcard__dots i.is-on{width:16px;border-radius:99px;background:var(--bm-yellow)}
.tcard--mini .tcard__dots{bottom:10px}

/* ---------- 30. Link directory ----------------------------------------- */
.links-search{
  display:flex;align-items:center;gap:10px;margin:0 0 30px;padding:8px 8px 8px 16px;
  background:#fff;border:var(--bm-line);border-radius:var(--radius-lg);box-shadow:var(--bm-pop);
}
.links-search > svg{width:19px;height:19px;flex:none;color:var(--bm-blue)}
.links-search input{
  flex:1;min-width:0;border:0;background:none;outline:none;padding:9px 0;
  font:600 15px/1.3 var(--font-body,inherit);color:var(--bm-ink);
}
.links-search input::placeholder{color:rgba(16,20,24,.45);font-weight:500}
.links-search .btn{flex:none;box-shadow:var(--bm-pop-sm)}

.links-group{margin-bottom:34px}
.links-group__head{
  display:flex;align-items:center;gap:10px;margin:0 0 14px;
  font-family:var(--font-display);font-size:20px;color:var(--bm-ink);
}
.links-group__head span{
  display:inline-grid;place-items:center;min-width:26px;height:24px;padding:0 8px;
  background:var(--bm-yellow);border:2px solid var(--bm-ink);border-radius:999px;
  font:800 12px/1 var(--font-body,inherit);
}
.links-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.link-row{
  display:flex;align-items:center;gap:14px;padding:12px 14px;
  background:#fff;border:var(--bm-line-thin);border-radius:12px;
}
.link-row:hover{background:var(--bm-cream)}
.link-row__text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.link-row__text b{font-size:14.5px;color:var(--bm-ink)}
.link-row__text a{
  font-size:12.5px;color:var(--bm-blue);text-decoration:none;
  overflow-wrap:anywhere;
}
.link-row__text a:hover{text-decoration:underline}
.link-row__copy{
  flex:none;background:var(--bm-yellow);color:var(--bm-ink);
  border:2px solid var(--bm-ink);border-radius:10px;box-shadow:2px 2px 0 var(--bm-ink);
  padding:8px 12px;font-size:13px;
}
.link-row__copy svg{width:15px;height:15px}
.link-row__copy.is-done{background:var(--bm-blue);color:#fff}
.links-empty{text-align:center;color:rgba(16,20,24,.6);font-weight:600;padding:30px 0}
@media (max-width:520px){
  .links-search{flex-wrap:wrap;padding:12px}
  .links-search input{flex:1 1 100%;order:2}
  .links-search .btn{order:3;margin-left:auto}
  .link-row{flex-wrap:wrap}
  .link-row__copy{width:100%;justify-content:center}
}

/* ---------- 31. Booking popup on a phone -------------------------------
 * The footer holds the only way to send the booking, and on a phone it was
 * ending up below the fold: 100vh counts the browser's address bar, so the
 * popup was taller than the part of the screen you can actually see. Dynamic
 * viewport units measure what is visible, and the footer sticks to the
 * bottom of the box regardless.
 * -------------------------------------------------------------------- */
.bk__foot{
  position:sticky;bottom:0;z-index:2;
  padding-bottom:calc(16px + env(safe-area-inset-bottom));
  box-shadow:0 -6px 18px rgba(6,20,26,.07);
}
@media (max-width:640px){
  .bk__foot{padding-bottom:calc(14px + env(safe-area-inset-bottom))}
}
@supports (height:100dvh){
  @media (max-width:640px){
    .bk{height:100dvh}
    .bk__box{height:100dvh;max-height:100dvh}
  }
}

/* ---------- 32. Back to top -------------------------------------------- */
.bm-top{
  position:fixed;right:18px;bottom:18px;z-index:140;display:grid;place-items:center;
  width:52px;height:52px;padding:0;border-radius:16px;cursor:pointer;
  background:var(--bm-yellow);color:var(--bm-ink);
  border:var(--bm-line);box-shadow:var(--bm-pop);
  transition:transform .14s ease,box-shadow .14s ease,opacity .2s ease;
}
.bm-top[hidden]{display:none}
.bm-top:hover{transform:translate(2px,2px);box-shadow:var(--bm-pop-sm)}
.bm-top:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--bm-ink)}
.bm-top svg{width:24px;height:24px;stroke-width:3}
/* clear of the phone booking bar on tour pages */
body.has-stickybar .bm-top{bottom:84px}
@media (max-width:640px){ .bm-top{width:46px;height:46px;right:14px;bottom:14px} }
