/* blog cards */
.mk-bgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:980px){.mk-bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.mk-bgrid{grid-template-columns:minmax(0,1fr)}}
.mk-bp{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;border:1px solid var(--mk-line);color:var(--mk-ink);transition:transform .25s,box-shadow .25s,border-color .25s}
.mk-bp:hover{transform:translateY(-3px);box-shadow:0 24px 44px -30px rgba(16,43,69,.55);border-color:transparent}
.mk-bp>.mk-img{aspect-ratio:16/10;display:block}
.mk-bp .mk-img img{transition:transform .5s}
.mk-bp:hover .mk-img img{transform:scale(1.04)}
.mk-bp-b{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.mk-bp-m{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--mk-text);font-weight:600}
.mk-bp-tp{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-blue);background:var(--mk-tint);padding:4px 9px;border-radius:999px}
.mk-bp b{font-size:17.5px;line-height:1.35}
.mk-bp-x{font-size:14px;line-height:1.6;color:var(--mk-text)}
.mk-bp-r{margin-top:auto;padding-top:4px;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:800;color:var(--mk-blue)}
/* footer: brand block + four link columns when the extra Destinations column is present (inc/modules/sitewide/footer-column.php) */
.mk-cols:has(>div:nth-child(5)){grid-template-columns:1.2fr repeat(4,minmax(0,1fr));gap:24px}
@media (max-width:1000px){.mk-cols:has(>div:nth-child(5)){grid-template-columns:repeat(2,minmax(0,1fr))}.mk-cols:has(>div:nth-child(5))>div:first-child{grid-column:1/-1}}
@media (max-width:520px){.mk-cols:has(>div:nth-child(5)){grid-template-columns:1fr}}

/* Footer payment brand icons */
.mk-pay span{display:inline-flex;align-items:center}
.mk-pay span img{display:block;height:18px;width:auto}

/* The fade overlay of the "Read more" blocks must never swallow clicks (it covered the last button once opened). */
.mk-seo-more::after{pointer-events:none}
.mk-seo-more.is-open::after{display:none}

/* Same rule for the other collapsible blocks: their fade overlays (tour overview "mk-ov", about copy "mk-about-copy")
   stayed on top of the last lines after opening (opacity 0 only) and swallowed clicks on links in the final paragraph. */
.mk-ov::after,.mk-about-copy::after{pointer-events:none}
.mk-ov.is-open::after,.mk-about-copy.is-open::after{display:none}

/* Slide-in bars that wait off-screen (mobile booking bar, social-proof toast) stay out of the tab order and out of
   hit-testing until they are switched on; visibility flips after the slide-out so the animation is kept. */
body .mk-mbk:not(.is-on),body .mk-toast:not(.is-on){visibility:hidden;pointer-events:none;transition:transform .3s,opacity .35s,visibility 0s linear .35s}
body .mk-mbk.is-on,body .mk-toast.is-on{visibility:visible}

/* The floating WhatsApp button (fixed, bottom right) sat on top of the credit link in the last footer row on desktop widths
   where the page wrapper reaches the viewport edge; keep the row clear of it. */
@media (min-width:1001px) and (max-width:1360px){.mk-base{padding-right:66px}}

/* QA2-007: wide content never widens the page. Tables in post/page content scroll inside their own box on small screens
   (a wrapper such as .mk-tbl / .mk-tblw already scrolls; a bare table becomes its own scroll box), and the in-content call-to-action
   grid may shrink below the width of its longest button. */
.mk-tbl, .mk-tblw { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mk-art div.mk-incta { grid-template-columns: minmax(0, 1fr); }
.mk-art div.mk-incta a { max-width: 100%; box-sizing: border-box; }
.mk-art div.mk-incta p, .mk-art div.mk-incta h3 { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 760px) {
	.mk-art > table,
	.mk-prose > table,
	.mk-art :not(.mk-tbl):not(.mk-tblw) > table,
	.mk-prose :not(.mk-tbl):not(.mk-tblw) > table,
	.entry-content > table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Touch targets of at least 40x40 CSS px on touch widths (QA2-012).
   The box grows through padding and is given back with an equal negative margin, so the page layout and the look do not change. */
.mk-link-b.mk-link-below{margin-top:12px}
@media (max-width:1024px),(pointer:coarse){
  .mk-promo a{display:inline-block;padding:12px 8px;margin:-12px -8px}
  .mk-crumbs a{display:inline-flex;align-items:center;min-height:40px;margin-block:-9px;padding-inline:6px;margin-inline:-6px}
  button.mk-link-b{padding:9px 6px;margin-block:-9px}
  button.mk-link-b.mk-link-below{margin-top:3px}
  .mkb-check{min-height:40px;padding-block:11px;margin-block:-11px}
  .mm-all{padding-block:10px;margin-bottom:-10px}
  /* the plain link rows of the HTML sitemap need a real row height, as neighbouring targets must not overlap */
  .mk-lg li>a:only-child{display:inline-block;padding-block:10px}
  /* hero steppers: 40px button, the 26px circle of the design is drawn by ::before */
  .mk-slot-pax button{position:relative;isolation:isolate;width:40px;height:40px;margin:-7px;border:0;background:none}
  .mk-slot-pax button::before{content:"";position:absolute;inset:7px;z-index:-1;border-radius:50%;border:1.5px solid var(--mk-line);background:#fff}
  .mk-stepper button{position:relative;isolation:isolate;width:40px;height:40px;margin:-5px;border:0;background:none}
  .mk-stepper button::before{content:"";position:absolute;inset:5px;z-index:-1;border-radius:50%;border:1.5px solid var(--mk-line);background:#fff}
}