/* Boat Rentals in Mexico - design system, ported 1:1 from the Claude Design kit.
   Tokens are verbatim; component rules are the kit's inline styles as classes. */

@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400&family=Manrope:wght@300;400;500;600;700&display=swap");

:root{
  --navy-900:#041D28; --navy-800:#062B3A; --navy-700:#0B4960; --navy-600:#155F79;
  --aqua-200:#C7EEF2; --aqua-100:#EAFBFC; --aqua-050:#F4FDFD;
  --sand-300:#E8CFA9; --sand-200:#F4E2C8; --cream-100:#F8F4ED; --white:#FFFFFF;
  --terracotta-500:#C25E2A; --terracotta-400:#D97742; --whatsapp-500:#25D366;
  --ink-900:#0A2029; --ink-600:#3F5A66; --ink-400:#7794A0;

  --surface-page:var(--white); --surface-aqua:var(--aqua-100); --surface-cream:var(--cream-100);
  --surface-sand:var(--sand-200); --surface-deep:var(--navy-800); --surface-deepest:var(--navy-900);
  --surface-card:var(--white); --surface-card-sand:var(--sand-200);
  --surface-glass:rgba(6,43,58,.42); --surface-glass-light:rgba(255,255,255,.14);

  --text-body:var(--ink-900); --text-muted:var(--ink-600); --text-meta:var(--ink-400);
  --text-display:var(--navy-800); --text-on-deep:var(--white); --text-on-deep-muted:rgba(255,255,255,.72);
  --text-accent:var(--terracotta-500); --text-link:var(--navy-700); --text-link-hover:var(--terracotta-500);

  --border-hairline:rgba(6,43,58,.10); --border-aqua:var(--aqua-200);
  --border-sand:var(--sand-300); --border-on-deep:rgba(255,255,255,.20);

  --scrim-hero:linear-gradient(180deg,rgba(4,29,40,.58) 0%,rgba(4,29,40,.12) 38%,rgba(4,29,40,.62) 100%);
  --scrim-card:linear-gradient(180deg,rgba(4,29,40,0) 34%,rgba(4,29,40,.72) 100%);
  --scrim-top:linear-gradient(180deg,rgba(4,29,40,.55) 0%,rgba(4,29,40,0) 100%);

  --font-display:"Playfair Display","Iowan Old Style",Georgia,serif;
  --font-sans:"Manrope","Helvetica Neue",Arial,sans-serif;
  --type-hero:clamp(3.25rem,7.2vw,7rem); --type-d1:clamp(2.5rem,4.4vw,4.25rem);
  --type-d2:clamp(2rem,3vw,3rem); --type-d3:1.75rem; --type-d4:1.3125rem;
  --type-lead:clamp(1.0625rem,1.15vw,1.25rem); --type-body:1rem; --type-body-sm:0.9375rem;
  --type-meta:0.8125rem; --type-eyebrow:0.75rem;
  --leading-display:0.98; --leading-heading:1.12; --leading-body:1.65; --leading-tight:1.35;
  --tracking-display:-0.02em; --tracking-body:0em; --tracking-eyebrow:0.22em; --tracking-label:0.08em;
  --weight-display:400; --weight-display-md:500; --weight-body:400; --weight-body-md:500; --weight-label:600;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px;
  --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px; --space-11:160px;
  --page-max:1440px; --content-max:1160px; --measure-max:44ch;
  --gutter:clamp(20px,5vw,80px); --section-y:clamp(72px,9vw,160px);
  --section-y-tight:clamp(56px,6vw,96px); --grid-gap:clamp(16px,2vw,32px); --nav-h:76px;

  --radius-xs:6px; --radius-sm:10px; --radius-md:16px; --radius-lg:24px; --radius-xl:32px; --radius-pill:999px;

  --shadow-none:none; --shadow-xs:0 1px 2px rgba(6,43,58,.06); --shadow-sm:0 2px 10px rgba(6,43,58,.06);
  --shadow-md:0 10px 30px rgba(6,43,58,.09); --shadow-lg:0 22px 60px rgba(6,43,58,.14);
  --shadow-float:0 28px 70px rgba(4,29,40,.28); --blur-glass:blur(14px) saturate(1.1);

  --ease-calm:cubic-bezier(.22,.61,.36,1); --ease-glide:cubic-bezier(.4,0,.2,1);
  --dur-fast:180ms; --dur-base:320ms; --dur-slow:640ms; --dur-reveal:900ms; --dur-kenburns:18s;
}

@keyframes mbr-kenburns{from{transform:scale(1.02)}to{transform:scale(1.14)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body.mbr{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-sans);font-size:var(--type-body);line-height:var(--leading-body);font-weight:var(--weight-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
:where(.mbr) h1,:where(.mbr) h2,:where(.mbr) h3,:where(.mbr) h4{font-family:var(--font-display);font-weight:var(--weight-display);color:var(--text-display);letter-spacing:var(--tracking-display);line-height:var(--leading-heading);margin:0;text-wrap:pretty}
:where(.mbr) h1{font-size:var(--type-d1)}:where(.mbr) h2{font-size:var(--type-d2)}:where(.mbr) h3{font-size:var(--type-d3)}:where(.mbr) h4{font-size:var(--type-d4)}
:where(.mbr) p{margin:0;text-wrap:pretty}
:where(.mbr) a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-calm)}
:where(.mbr) a:hover{color:var(--text-link-hover)}
:where(.mbr) img{display:block;max-width:100%}
.mbr ::selection{background:var(--aqua-200);color:var(--navy-800)}
.mbr-skip{position:absolute;left:-9999px}
.mbr-skip:focus{left:var(--gutter);top:8px;z-index:200;background:var(--white);padding:10px 16px;border-radius:var(--radius-sm)}

/* ---------- icon (CSS mask, currentColor) ---------- */
.mbr-i{display:inline-block;flex:0 0 auto;background:currentColor;width:20px;height:20px;
  -webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.mbr-i--14{width:14px;height:14px}.mbr-i--13{width:13px;height:13px}.mbr-i--16{width:16px;height:16px}
.mbr-i--18{width:18px;height:18px}.mbr-i--26{width:26px;height:26px}

/* ---------- buttons ---------- */
.mbr-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 26px;
  font-family:var(--font-sans);font-size:var(--type-body-sm);font-weight:var(--weight-label);line-height:1;
  text-decoration:none;border-radius:var(--radius-pill);cursor:pointer;white-space:nowrap;border:1px solid transparent;
  transition:background var(--dur-base) var(--ease-calm),color var(--dur-base) var(--ease-calm),border-color var(--dur-base) var(--ease-calm),transform var(--dur-fast) var(--ease-calm)}
.mbr-btn:active{transform:translateY(1px)}
.mbr-btn--sm{padding:10px 18px;font-size:var(--type-meta);gap:8px}
.mbr-btn--lg{padding:18px 34px;font-size:var(--type-body);gap:12px}
.mbr-btn.mbr-btn--primary{background:var(--navy-800);color:var(--white);border-color:var(--navy-800)}
.mbr-btn.mbr-btn--primary:hover{background:var(--navy-700);border-color:var(--navy-700);color:var(--white)}
.mbr-btn.mbr-btn--secondary{background:var(--white);color:var(--navy-800);border-color:var(--border-hairline)}
.mbr-btn.mbr-btn--secondary:hover{background:var(--cream-100);border-color:var(--border-sand);color:var(--navy-800)}
.mbr-btn.mbr-btn--outline{background:transparent;color:var(--navy-800);border-color:var(--navy-800)}
.mbr-btn.mbr-btn--outline:hover{background:var(--navy-800);color:var(--white)}
.mbr-btn.mbr-btn--glass{background:var(--surface-glass-light);color:var(--white);border-color:var(--border-on-deep);backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass)}
.mbr-btn.mbr-btn--glass:hover{background:rgba(255,255,255,.24);border-color:rgba(255,255,255,.5);color:var(--white)}
.mbr-btn.mbr-btn--whatsapp{background:var(--whatsapp-500);color:#04361A;border-color:var(--whatsapp-500)}
.mbr-btn.mbr-btn--whatsapp:hover{background:#1FBE5B;border-color:#1FBE5B;color:#04361A}
.mbr-btn.mbr-btn--link{background:transparent;color:var(--text-accent);border-color:transparent;padding:0;border-radius:0;letter-spacing:var(--tracking-label)}
.mbr-btn.mbr-btn--link:hover{color:var(--navy-800)}
.mbr-btn__ir{transition:transform var(--dur-base) var(--ease-calm)}
.mbr-btn:hover .mbr-btn__ir{transform:translateX(3px)}

/* ---------- chip ---------- */
.mbr-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:var(--radius-pill);
  font-family:var(--font-sans);font-size:var(--type-meta);font-weight:var(--weight-body-md);
  letter-spacing:var(--tracking-label);text-transform:uppercase;line-height:1;white-space:nowrap;cursor:pointer;
  color:var(--white);background:var(--surface-glass-light);border:1px solid var(--border-on-deep);
  backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass);
  transition:background var(--dur-base) var(--ease-calm),color var(--dur-base) var(--ease-calm)}
.mbr-chip:hover,.mbr-chip.is-active{background:var(--white);color:var(--navy-800)}

/* ---------- icon button ---------- */
.mbr-ib{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;
  border-radius:var(--radius-pill);cursor:pointer;background:var(--surface-glass-light);color:var(--white);
  border:1px solid var(--border-on-deep);backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass);
  transition:background var(--dur-base) var(--ease-calm)}
.mbr-ib:hover{background:rgba(255,255,255,.26);color:var(--white)}
.mbr-ib--deep{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;width:40px;height:40px}
.mbr-ib--deep:hover{background:rgba(255,255,255,.12)}

/* ---------- eyebrow / section heading ---------- */
.mbr-eyebrow{margin:0;font-family:var(--font-sans);font-size:var(--type-eyebrow);font-weight:var(--weight-label);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;line-height:1.4;color:var(--text-accent)}
.mbr-eyebrow--onPhoto{color:rgba(255,255,255,.82)}
.mbr-eyebrow--onDeep{color:rgba(255,255,255,.66)}
.mbr-head{display:flex;flex-direction:column;gap:var(--space-5);align-items:center;text-align:center;max-width:720px;margin:0 auto}
.mbr-head h2{margin:0;font-size:var(--type-d1)}
.mbr-head__lead{margin:0;max-width:620px;font-size:var(--type-lead);line-height:var(--leading-body);color:var(--text-muted)}

/* ---------- section ---------- */
.mbr-sec{padding:var(--section-y) var(--gutter)}
.mbr-sec--tight{padding:var(--section-y-tight) var(--gutter)}
.mbr-sec--white{background:var(--surface-page)}
.mbr-sec--aqua{background:var(--surface-aqua)}
.mbr-sec--cream{background:var(--surface-cream)}
.mbr-sec--sand{background:var(--surface-sand)}
.mbr-sec__in{max-width:var(--content-max);margin:0 auto}
.mbr-sec__in--page{max-width:var(--page-max)}

/* ---------- media frame ---------- */
.mbr-media{position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--aqua-100)}
.mbr-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--dur-slow) var(--ease-calm)}
.mbr-media--r-hero{aspect-ratio:16/9}.mbr-media--r-wide{aspect-ratio:3/2}.mbr-media--r-landscape{aspect-ratio:4/3}
.mbr-media--r-square{aspect-ratio:1/1}.mbr-media--r-portrait{aspect-ratio:4/5}.mbr-media--r-tall{aspect-ratio:3/4}
.mbr-media--r-219{aspect-ratio:21/9}
.mbr-media--rad-none{border-radius:0}.mbr-media--rad-sm{border-radius:var(--radius-sm)}
.mbr-media--rad-md{border-radius:var(--radius-md)}.mbr-media--rad-xl{border-radius:var(--radius-xl)}
.mbr-media__scrim{position:absolute;inset:0;pointer-events:none}
.mbr-media__scrim--hero{background:var(--scrim-hero)}
.mbr-media__scrim--card{background:var(--scrim-card)}
.mbr-media__scrim--top{background:var(--scrim-top)}

/* ---------- nav ---------- */
.mbr-nav{position:sticky;top:0;z-index:60;height:var(--nav-h);display:flex;align-items:center;gap:var(--space-4);
  padding:0 var(--gutter);background:transparent;border-bottom:1px solid transparent;
  transition:background var(--dur-base) var(--ease-calm),border-color var(--dur-base) var(--ease-calm)}
.mbr-nav.is-scrolled,.mbr-nav.is-solid{background:rgba(6,43,58,.78);backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass);border-bottom-color:var(--border-on-deep)}
.mbr-nav__l,.mbr-nav__r{flex:1;display:flex;align-items:center;gap:var(--space-3)}
.mbr-nav__r{justify-content:flex-end;gap:var(--space-2)}
.mbr-nav__brand{font-family:var(--font-sans);font-weight:var(--weight-label);font-size:14px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--white);white-space:nowrap}
.mbr-nav__brand:hover{color:var(--white)}
.mbr-nav__lang{padding:0 6px;font-size:var(--type-meta);font-weight:var(--weight-label);letter-spacing:.14em;color:rgba(255,255,255,.7)}
.mbr-drawer{position:sticky;top:var(--nav-h);z-index:55;overflow:hidden;max-height:0;background:rgba(6,43,58,.94);
  backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass);transition:max-height var(--dur-slow) var(--ease-calm)}
.mbr-drawer.is-open{max-height:360px}
.mbr-drawer__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);padding:var(--space-7) var(--gutter)}
.mbr-drawer__grid a{font-family:var(--font-display);font-size:var(--type-d4);color:var(--white)}
.mbr-drawer__grid a:hover{color:var(--aqua-200)}

/* ---------- hero ---------- */
.mbr-hero{position:relative;margin-top:calc(var(--nav-h) * -1)}
.mbr-hero__stage{position:relative;min-height:86vh;display:flex;flex-direction:column;overflow:hidden}
.mbr-hero__bg{position:absolute;inset:0;overflow:hidden}
.mbr-hero__bg .mbr-media{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;animation:mbr-kenburns var(--dur-kenburns) var(--ease-calm) infinite alternate}
.mbr-hero__body{position:relative;flex:1;display:flex;flex-direction:column;
  padding:calc(var(--nav-h) + var(--space-8)) var(--gutter) var(--space-8);
  max-width:var(--page-max);margin:0 auto;width:100%}
.mbr-hero__h1{margin:var(--space-4) 0 0;font-family:var(--font-display);font-weight:var(--weight-display);
  font-size:var(--type-hero);line-height:var(--leading-display);letter-spacing:var(--tracking-display);
  color:var(--white);display:grid;grid-template-columns:1fr 1fr}
.mbr-hero__h1 span:last-child{text-align:right;align-self:end}
.mbr-hero__foot{display:grid;grid-template-columns:1fr auto;gap:var(--space-7);align-items:end;margin-top:auto;padding-top:var(--space-8)}
.mbr-hero__copy{display:flex;flex-direction:column;gap:var(--space-5);max-width:460px}
.mbr-hero__lead{margin:0;font-size:var(--type-lead);line-height:var(--leading-body);color:rgba(255,255,255,.86)}
.mbr-hero__ctas{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.mbr-catbar{background:var(--surface-deep);padding:var(--space-4) var(--gutter)}
.mbr-catbar__in{max-width:var(--page-max);margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.mbr-catbar__note{margin-left:auto;font-size:var(--type-meta);color:rgba(255,255,255,.6)}
.mbr-catbar__note a{color:var(--white);border-bottom:1px solid rgba(255,255,255,.4)}
.mbr-catbar__note a:hover{color:var(--aqua-200)}

/* ---------- contact card ---------- */
.mbr-cc{width:min(360px,100%);display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6);
  border-radius:var(--radius-lg);background:var(--white);border:1px solid var(--border-hairline);box-shadow:var(--shadow-float)}
.mbr-cc__k{display:inline-flex;align-items:center;gap:8px;font-size:var(--type-eyebrow);font-weight:var(--weight-label);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.mbr-cc h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight)}
.mbr-cc p{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-muted)}
.mbr-cc__act{display:flex;flex-wrap:wrap;gap:var(--space-2)}

/* ---------- editorial split ---------- */
.mbr-edit{display:grid;gap:clamp(28px,5vw,88px);align-items:center;grid-template-columns:1.1fr .9fr}
.mbr-edit--rev{grid-template-columns:.9fr 1.1fr}
.mbr-edit__media{order:1}.mbr-edit__text{order:2;display:flex;flex-direction:column;gap:var(--space-4);max-width:460px}
.mbr-edit--rev .mbr-edit__media{order:2}.mbr-edit--rev .mbr-edit__text{order:1}
.mbr-edit__text h2{margin:0;font-size:var(--type-d2)}
.mbr-edit__text p{margin:0;font-size:var(--type-body);line-height:var(--leading-body);color:var(--text-muted);max-width:var(--measure-max)}
.mbr-edit__act{margin-top:var(--space-2)}
.mbr-edit__stack{display:flex;flex-direction:column;gap:clamp(56px,7vw,112px);margin-top:clamp(48px,6vw,96px)}

/* ---------- grids ---------- */
.mbr-grid{display:grid;gap:var(--grid-gap);margin-top:clamp(40px,5vw,72px)}
.mbr-grid--240{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.mbr-grid--280{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.mbr-grid--320{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.mbr-grid--220{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.mbr-grid--steps{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(24px,3vw,48px)}
.mbr-center{display:flex;justify-content:center;margin-top:var(--space-8)}

/* ---------- boat type card ---------- */
.mbr-boat,.mbr-exp,.mbr-dest,.mbr-jr,
.mbr-boat:hover,.mbr-exp:hover,.mbr-dest:hover,.mbr-jr:hover{color:inherit}
.mbr-boat{display:flex;flex-direction:column;gap:var(--space-4);text-decoration:none;color:inherit}
.mbr-boat .mbr-media{box-shadow:var(--shadow-sm);transition:box-shadow var(--dur-base) var(--ease-calm)}
.mbr-boat:hover .mbr-media{box-shadow:var(--shadow-lg)}
.mbr-boat:hover .mbr-media img{transform:scale(1.05)}
.mbr-boat__t{display:flex;flex-direction:column;gap:var(--space-2)}
.mbr-boat h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight)}
.mbr-boat p{margin:0;font-size:var(--type-body-sm);color:var(--text-muted);line-height:var(--leading-body)}
.mbr-more{display:inline-flex;align-items:center;gap:6px;margin-top:var(--space-1);font-size:var(--type-meta);
  font-weight:var(--weight-label);letter-spacing:var(--tracking-label);text-transform:uppercase;
  color:var(--text-accent);transition:color var(--dur-base) var(--ease-calm)}
.mbr-boat:hover .mbr-more{color:var(--navy-800)}
.mbr-more .mbr-i{transition:transform var(--dur-base) var(--ease-calm)}
.mbr-boat:hover .mbr-more .mbr-i,.mbr-jr:hover .mbr-more .mbr-i,.mbr-exp:hover .mbr-more .mbr-i{transform:translateX(3px)}
.mbr-note{margin-top:var(--space-7);text-align:center;font-size:var(--type-body-sm);color:var(--text-muted)}
.mbr-note a{color:var(--text-accent);font-weight:var(--weight-label)}

/* ---------- experience card ---------- */
.mbr-exp{display:block;text-decoration:none;color:inherit}
.mbr-exp .mbr-media{box-shadow:var(--shadow-md);transition:box-shadow var(--dur-base) var(--ease-calm)}
.mbr-exp:hover .mbr-media{box-shadow:var(--shadow-lg)}
.mbr-exp:hover .mbr-media img{transform:scale(1.06)}
.mbr-exp__b{position:absolute;inset:auto 0 0 0;display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5);z-index:2}
.mbr-exp--lg .mbr-exp__b{padding:var(--space-7)}
.mbr-exp__b h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight);color:var(--white)}
.mbr-exp--lg .mbr-exp__b h3{font-size:var(--type-d3)}
.mbr-exp__b p{margin:0;max-width:38ch;font-size:var(--type-body-sm);line-height:var(--leading-body);color:rgba(255,255,255,.84)}
.mbr-exp__b .mbr-more{color:var(--white);margin-top:var(--space-2)}
.mbr-exp:hover .mbr-exp__b .mbr-more{color:var(--white)}

/* ---------- destination card ---------- */
.mbr-dest{display:block;text-decoration:none;color:inherit}
.mbr-dest:hover .mbr-media img{transform:scale(1.06)}
.mbr-dest__b{position:absolute;inset:auto 0 0 0;padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);z-index:2}
.mbr-dest__k{display:inline-flex;align-items:center;gap:6px;font-size:var(--type-eyebrow);font-weight:var(--weight-label);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:rgba(255,255,255,.78)}
.mbr-dest__b h3{margin:0;font-size:var(--type-d4);color:var(--white);line-height:var(--leading-tight)}
.mbr-dest__b p{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:rgba(255,255,255,.84);
  max-height:0;opacity:0;overflow:hidden;transition:max-height var(--dur-slow) var(--ease-calm),opacity var(--dur-base) var(--ease-calm)}
.mbr-dest:hover .mbr-dest__b p{max-height:120px;opacity:1}

/* ---------- journal card ---------- */
.mbr-jr{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--surface-card-sand);
  border-radius:var(--radius-md);padding:var(--space-3);gap:var(--space-4);box-shadow:var(--shadow-none);
  transition:box-shadow var(--dur-base) var(--ease-calm),transform var(--dur-base) var(--ease-calm)}
.mbr-jr:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
.mbr-jr:hover .mbr-media img{transform:scale(1.04)}
.mbr-jr__t{display:flex;flex-direction:column;gap:var(--space-2);padding:0 var(--space-3) var(--space-4)}
.mbr-jr__k{font-size:var(--type-eyebrow);font-weight:var(--weight-label);letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase;color:var(--text-accent)}
.mbr-jr h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight)}
.mbr-jr p{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-muted)}
.mbr-jr .mbr-more{color:var(--navy-800)}

/* ---------- step card ---------- */
.mbr-step{display:flex;flex-direction:column;gap:var(--space-3);padding-top:var(--space-5);border-top:1px solid var(--border-hairline)}
.mbr-step__n{font-family:var(--font-display);font-size:var(--type-d3);line-height:1;color:var(--text-accent);font-variant-numeric:lining-nums}
.mbr-step h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight)}
.mbr-step p{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-muted)}

/* ---------- emotional CTA ---------- */
.mbr-emo{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,5vw,80px);align-items:center}
.mbr-emo__l{display:flex;flex-direction:column;gap:var(--space-5)}
.mbr-emo__l h2{margin:0;font-size:var(--type-d1)}
.mbr-emo__sub{margin:0;font-family:var(--font-display);font-size:var(--type-d2);line-height:var(--leading-heading);color:var(--navy-700)}
.mbr-emo__p{margin:0;max-width:var(--measure-max);font-size:var(--type-lead);line-height:var(--leading-body);color:var(--text-muted)}
.mbr-emo__act{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2)}
.mbr-emo__r{display:flex;justify-content:flex-end}
.mbr-emo__r .mbr-media{width:100%;box-shadow:var(--shadow-lg)}

/* ---------- gallery ---------- */
.mbr-gal{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-3);margin-top:clamp(40px,5vw,72px)}
.mbr-gal .mbr-media{border-radius:var(--radius-md)}
.mbr-gal__i--wide{grid-column:span 2}
.mbr-gal__i--drop{margin-top:24px}

/* ---------- final CTA ---------- */
.mbr-final{position:relative}
.mbr-final .mbr-media{min-height:62vh;border-radius:0;aspect-ratio:21/9}
.mbr-final__b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:var(--space-5);padding:var(--space-8) var(--gutter);z-index:2}
.mbr-final__b h2{margin:0;font-size:var(--type-d1);line-height:var(--leading-heading);color:var(--white)}
.mbr-final__b p{margin:0;max-width:46ch;font-size:var(--type-lead);line-height:var(--leading-body);color:rgba(255,255,255,.86)}
.mbr-final__act{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3)}

/* ---------- footer ---------- */
.mbr-foot{background:var(--surface-deepest);color:var(--text-on-deep);padding:var(--space-9) var(--gutter) var(--space-6)}
.mbr-foot__grid{max-width:var(--page-max);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:clamp(24px,4vw,64px)}
.mbr-foot__brand{display:flex;flex-direction:column;gap:var(--space-4)}
.mbr-foot__name{font-family:var(--font-sans);font-weight:var(--weight-label);font-size:13px;letter-spacing:.24em;text-transform:uppercase}
.mbr-foot__brand p{margin:0;max-width:32ch;font-size:var(--type-body-sm);line-height:var(--leading-body);color:rgba(255,255,255,.7)}
.mbr-foot__soc{display:flex;gap:var(--space-2)}
.mbr-foot__col{display:flex;flex-direction:column;gap:var(--space-3)}
.mbr-foot__ct{font-size:var(--type-eyebrow);font-weight:var(--weight-label);letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase;color:rgba(255,255,255,.5)}
.mbr-foot__col a{font-size:var(--type-body-sm);color:rgba(255,255,255,.78)}
.mbr-foot__col a:hover{color:var(--white)}
.mbr-foot__bar{max-width:var(--page-max);margin:var(--space-8) auto 0;padding-top:var(--space-5);
  border-top:1px solid var(--border-on-deep);display:flex;flex-wrap:wrap;gap:var(--space-5);
  justify-content:space-between;font-size:var(--type-meta);color:rgba(255,255,255,.55)}
.mbr-foot__bar a{color:rgba(255,255,255,.55)}
.mbr-foot__bar a:hover{color:var(--white)}
.mbr-foot__legal{display:flex;gap:var(--space-5)}
.mbr-credit{max-width:var(--page-max);margin:var(--space-4) auto 0;font-size:11px;color:rgba(255,255,255,.32);line-height:1.6}
.mbr-credit a{color:rgba(255,255,255,.42)}

/* ---------- concierge questionnaire ---------- */
.mbr-form{max-width:820px;margin:clamp(48px,6vw,88px) auto 0;padding:clamp(24px,3vw,40px);
  background:var(--white);border:1px solid var(--border-hairline);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-float)}
.mbr-form__note{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5);
  border-radius:var(--radius-md);margin-bottom:var(--space-6);font-size:var(--type-body-sm);line-height:var(--leading-body)}
.mbr-form__note strong{font-family:var(--font-display);font-size:var(--type-d4);font-weight:var(--weight-display);line-height:var(--leading-tight)}
.mbr-form__note--ok{background:var(--aqua-100);border:1px solid var(--border-aqua);color:var(--navy-800)}
.mbr-form__note--err{background:var(--sand-200);border:1px solid var(--border-sand);color:var(--navy-800)}
.mbr-form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mbr-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.mbr-field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}
.mbr-field--wide{grid-column:1 / -1}
.mbr-field__l{font-size:var(--type-eyebrow);font-weight:var(--weight-label);letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase;color:var(--text-accent)}
.mbr-field__h{font-weight:var(--weight-body);letter-spacing:var(--tracking-label);color:var(--text-meta);text-transform:none}
.mbr-field__i{width:100%;font-family:var(--font-sans);font-size:var(--type-body);line-height:var(--leading-tight);
  color:var(--text-body);background:var(--surface-page);border:1px solid var(--border-hairline);
  border-radius:var(--radius-sm);padding:14px 16px;
  transition:border-color var(--dur-base) var(--ease-calm),box-shadow var(--dur-base) var(--ease-calm)}
.mbr-field__i::placeholder{color:var(--text-meta)}
.mbr-field__i:hover{border-color:var(--border-sand)}
.mbr-field__i:focus{outline:none;border-color:var(--navy-700);box-shadow:0 0 0 3px rgba(11,73,96,.12)}
textarea.mbr-field__i{resize:vertical;min-height:120px;line-height:var(--leading-body)}
.mbr-field__note{font-size:var(--type-meta);color:var(--text-meta);line-height:var(--leading-tight)}
.mbr-date{cursor:pointer}
/* the whole control is the hit area, not just the little glyph */
.mbr-date::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:auto;height:auto;
  margin:0;padding:0;opacity:0;cursor:pointer}
.mbr-date{position:relative}
select.mbr-field__i{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:44px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%233F5A66' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.mbr-form__foot{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);
  margin-top:var(--space-7);padding-top:var(--space-6);border-top:1px solid var(--border-hairline)}
.mbr-form__foot .mbr-btn{cursor:pointer;font-family:var(--font-sans)}
.mbr-form__fine{margin:0;text-align:center;font-size:var(--type-meta);color:var(--text-meta);max-width:44ch}
@media (max-width:640px){
  .mbr-form__grid{grid-template-columns:1fr}
  .mbr-form{padding:var(--space-5)}
}


/* ---------- scroll reveal ----------
   The design system shipped --dur-reveal and a fade-up keyframe that the first
   port never wired. This is that intent, driven by IntersectionObserver.
   The hidden state applies ONLY under .mbr-js, so with JavaScript off or broken
   every word is still on the page. */
@keyframes mbr-fade-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

.mbr-js .mbr-head,
.mbr-js .mbr-edit,
.mbr-js .mbr-boat,
.mbr-js .mbr-exp,
.mbr-js .mbr-dest,
.mbr-js .mbr-jr,
.mbr-js .mbr-step,
.mbr-js .mbr-emo__l,
.mbr-js .mbr-emo__r,
.mbr-js .mbr-form,
.mbr-js .mbr-note,
.mbr-js .mbr-center,
.mbr-js .mbr-final__b,
.mbr-js .mbr-gal .mbr-media{
  opacity:0;transform:translateY(18px);
  transition:opacity var(--dur-reveal) var(--ease-calm),transform var(--dur-reveal) var(--ease-calm);
  transition-delay:var(--mbr-delay,0ms);
  will-change:opacity,transform}

.mbr-js .is-in{opacity:1;transform:none}

/* Anything that opts out of motion simply never hides. */
@media (prefers-reduced-motion:reduce){
  .mbr-js .mbr-head,.mbr-js .mbr-edit,.mbr-js .mbr-boat,.mbr-js .mbr-exp,.mbr-js .mbr-dest,
  .mbr-js .mbr-jr,.mbr-js .mbr-step,.mbr-js .mbr-emo__l,.mbr-js .mbr-emo__r,.mbr-js .mbr-form,
  .mbr-js .mbr-note,.mbr-js .mbr-center,.mbr-js .mbr-final__b,.mbr-js .mbr-gal .mbr-media{
    opacity:1;transform:none;transition:none}
}


/* ---------- range calendar, themed to the design tokens ---------- */
.flatpickr-calendar{background:var(--white);border:1px solid var(--border-hairline);
  border-radius:var(--radius-md);box-shadow:var(--shadow-lg);font-family:var(--font-sans);padding:var(--space-2)}
.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after,
.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{display:none}
.flatpickr-months{padding-bottom:var(--space-2)}
.flatpickr-months .flatpickr-month{color:var(--text-display);height:40px}
.flatpickr-current-month{font-family:var(--font-display);font-size:1.05rem;padding-top:8px}
.flatpickr-current-month .flatpickr-monthDropdown-months{font-family:var(--font-display);background:transparent}
.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{fill:var(--navy-700);padding:9px}
.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:var(--terracotta-500)}
span.flatpickr-weekday{font-size:var(--type-eyebrow);font-weight:var(--weight-label);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-meta)}
.flatpickr-day{color:var(--text-body);border-radius:var(--radius-sm);border:1px solid transparent}
.flatpickr-day:hover{background:var(--aqua-100);border-color:var(--border-aqua)}
.flatpickr-day.today{border-color:var(--terracotta-500);color:var(--terracotta-500);font-weight:var(--weight-label)}
.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,
.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover{
  background:var(--navy-800);border-color:var(--navy-800);color:var(--white)}
.flatpickr-day.inRange,.flatpickr-day.inRange:hover{background:var(--aqua-100);
  border-color:var(--aqua-100);box-shadow:-5px 0 0 var(--aqua-100),5px 0 0 var(--aqua-100);color:var(--navy-800)}
.flatpickr-day.flatpickr-disabled,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay{color:var(--ink-400);opacity:.5}


/* ---------- inner page hero (Pages.jsx PageHero) ---------- */
.mbr-phero{position:relative;margin-top:calc(var(--nav-h) * -1);min-height:68vh;display:flex;overflow:hidden}
.mbr-phero__bg{position:absolute;inset:0;aspect-ratio:auto;border-radius:0}
.mbr-phero__body{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;
  gap:var(--space-5);padding:calc(var(--nav-h) + var(--space-8)) var(--gutter) var(--space-9);
  max-width:var(--page-max);margin:0 auto;width:100%}
.mbr-phero__h1{margin:0;font-family:var(--font-display);font-weight:var(--weight-display);
  font-size:var(--type-d1);line-height:var(--leading-display);letter-spacing:var(--tracking-display);
  color:var(--white);max-width:18ch}
.mbr-phero__lead{margin:0;max-width:48ch;font-size:var(--type-lead);line-height:var(--leading-body);color:rgba(255,255,255,.86)}
.mbr-phero__ctas{display:flex;flex-wrap:wrap;gap:var(--space-3)}

/* ---------- solid chip row (departures) ---------- */
.mbr-chiprow{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center;margin-top:var(--space-7)}
.mbr-chip.mbr-chip--solid{background:var(--white);color:var(--navy-800);border:1px solid var(--border-hairline);
  backdrop-filter:none;-webkit-backdrop-filter:none}
.mbr-chip.mbr-chip--solid:hover{background:var(--navy-800);color:var(--white);border-color:var(--navy-800)}

/* the inner hero reveals with the page, never hidden by the scroll observer */
.mbr-js .mbr-phero__body{opacity:1;transform:none}


/* ---------- local fact lists ---------- */
.mbr-facts{list-style:none;margin:clamp(32px,4vw,56px) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--space-4);max-width:760px}
.mbr-facts--split{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4);max-width:none}
.mbr-facts li{display:flex;align-items:flex-start;gap:var(--space-3);padding-bottom:var(--space-4);
  border-bottom:1px solid var(--border-hairline);font-size:var(--type-body);line-height:var(--leading-body);color:var(--text-muted)}
.mbr-facts--split li{border-bottom:none;padding-bottom:0}
.mbr-facts li .mbr-i{color:var(--text-accent);margin-top:5px}

/* ---------- season strip ---------- */
.mbr-season{display:flex;flex-direction:column;gap:var(--space-6);margin-top:clamp(32px,4vw,56px)}
.mbr-season__row{display:grid;grid-template-columns:minmax(220px,1fr) 1.4fr;gap:clamp(16px,3vw,40px);align-items:center}
.mbr-season__label{display:flex;flex-direction:column;gap:var(--space-2)}
.mbr-season__label strong{font-family:var(--font-display);font-weight:var(--weight-display);
  font-size:var(--type-d4);color:var(--text-display);line-height:var(--leading-tight)}
.mbr-season__label span{font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-muted)}
.mbr-season__bar{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.mbr-season__m{display:flex;align-items:center;justify-content:center;height:44px;border-radius:var(--radius-xs);
  background:var(--aqua-050);border:1px solid var(--border-aqua);color:var(--ink-400);
  font-size:var(--type-meta);font-weight:var(--weight-label);letter-spacing:.04em}
.mbr-season__m.is-on{background:var(--navy-800);border-color:var(--navy-800);color:var(--white)}
@media (max-width:820px){
  .mbr-season__row{grid-template-columns:1fr}
  .mbr-season__m{height:36px;font-size:11px}
}


/* ---------- why choose us ---------- */
.mbr-why{margin-top:clamp(40px,5vw,72px)}
.mbr-why__item{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);
  background:var(--white);border:1px solid var(--border-hairline);border-radius:var(--radius-md);
  box-shadow:var(--shadow-sm);transition:box-shadow var(--dur-base) var(--ease-calm),transform var(--dur-base) var(--ease-calm)}
.mbr-why__item:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
.mbr-why__mark{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:var(--radius-pill);background:var(--aqua-100);color:var(--navy-700);font-size:20px;line-height:1}
.mbr-why__item h3{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight);color:var(--text-display)}
.mbr-why__item p{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-muted)}

/* ---------- responsive (mirrors the kit's index.html rules) ---------- */
@media (max-width:1100px){
  .mbr-hero__h1{font-size:clamp(2.75rem,8vw,4.5rem)}
}
@media (max-width:900px){
  .mbr-hero__h1{grid-template-columns:1fr}
  .mbr-hero__h1 span:last-child{text-align:left;align-self:auto}
  .mbr-hero__foot{grid-template-columns:1fr}
  .mbr-edit,.mbr-edit--rev{grid-template-columns:1fr}
  .mbr-edit__media,.mbr-edit__text,.mbr-edit--rev .mbr-edit__media,.mbr-edit--rev .mbr-edit__text{order:unset;transform:none!important}
  .mbr-foot__grid{grid-template-columns:1fr 1fr}
  .mbr-gal{grid-template-columns:repeat(3,1fr)}
  .mbr-catbar__note{margin-left:0;width:100%}
}
@media (max-width:600px){
  .mbr-nav__brand{font-size:11px;letter-spacing:.16em}
  .mbr-nav__lang{display:none}
  .mbr-foot__grid{grid-template-columns:1fr}
  .mbr-gal{grid-template-columns:repeat(2,1fr)}
  .mbr-gal__i--drop{margin-top:0}
  .mbr-hero__stage{min-height:78vh}
}

/* ===========================================================================
   JOURNAL
   The article body is whatever Gutenberg rendered, so these rules dress the
   block output in the site's tokens rather than replacing its markup. The
   block library stylesheet still loads on posts - it owns structure, this
   owns type and colour.
   =========================================================================== */

/* ---------- article hero ---------- */
/* The nav is sticky and transparent, so every hero has to slide up underneath
   it the way .mbr-phero does. Without this the bar sits in its own white band
   with white type on it, which reads as a missing menu. */
.mbr-arthero{position:relative;display:flex;align-items:flex-end;min-height:clamp(380px,52vh,560px);
  margin-top:calc(var(--nav-h) * -1);
  padding:calc(var(--nav-h) + var(--space-8)) var(--gutter) var(--space-9);
  background:var(--navy-800);overflow:hidden}
.mbr-arthero__bg{position:absolute;inset:0}
.mbr-arthero__bg img{width:100%;height:100%;object-fit:cover;display:block}
.mbr-arthero__scrim{position:absolute;inset:0;background:var(--scrim-hero)}
.mbr-arthero__in{position:relative;z-index:2;width:100%;max-width:var(--content-max);margin:0 auto;
  display:flex;flex-direction:column;gap:var(--space-3)}
.mbr-arthero .mbr-eyebrow{color:var(--aqua-200)}
.mbr-arthero__h1{margin:0;max-width:20ch;font-family:var(--font-display);font-size:var(--type-d1);
  line-height:var(--leading-tight);font-weight:var(--weight-display);color:var(--white)}
.mbr-arthero__meta{margin:0;font-size:var(--type-body-sm);color:var(--text-on-deep-muted)}

/* ---------- article body ---------- */
.mbr-article{max-width:72ch;margin:0 auto;font-size:var(--type-lead);
  line-height:1.75;color:var(--text-body)}
.mbr-article > *{margin-block:var(--space-5)}
.mbr-article > :first-child{margin-block-start:0}
.mbr-article > :last-child{margin-block-end:0}
.mbr-article h2{margin-block:var(--space-8) var(--space-4);font-family:var(--font-display);
  font-size:var(--type-d3);line-height:var(--leading-tight);font-weight:var(--weight-display);color:var(--text-display)}
.mbr-article h3{margin-block:var(--space-6) var(--space-3);font-family:var(--font-display);
  font-size:var(--type-d4);line-height:var(--leading-tight);color:var(--text-display)}
.mbr-article p{margin-block:var(--space-5)}
.mbr-article a{color:var(--text-link);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;transition:color var(--dur-base) var(--ease-calm)}
.mbr-article a:hover{color:var(--text-link-hover)}
.mbr-article strong{font-weight:var(--weight-label)}
.mbr-article ul,.mbr-article ol{padding-left:1.25em}
.mbr-article li{margin-block:var(--space-2)}
.mbr-article li::marker{color:var(--text-accent)}
.mbr-article img{border-radius:var(--radius-md);display:block;height:auto}
.mbr-article figcaption{margin-top:var(--space-2);font-size:var(--type-body-sm);color:var(--text-meta);text-align:center}
.mbr-article blockquote{margin-inline:0;padding:var(--space-5) var(--space-6);background:var(--surface-aqua);
  border-left:3px solid var(--terracotta-500);border-radius:var(--radius-sm)}
.mbr-article blockquote p{margin-block:0;font-family:var(--font-display);font-size:var(--type-d4);
  line-height:var(--leading-tight);color:var(--text-display)}
.mbr-article hr,.mbr-article .wp-block-separator{margin-block:var(--space-8);border:0;
  border-top:1px solid var(--border-hairline);opacity:1;width:100%}

/* A wide table has to scroll inside itself, never push the page sideways. */
.mbr-article .wp-block-table{overflow-x:auto}
.mbr-article table{width:100%;border-collapse:collapse;font-size:var(--type-body-sm)}
.mbr-article th,.mbr-article td{padding:var(--space-3) var(--space-4);text-align:left;
  border-bottom:1px solid var(--border-hairline)}
.mbr-article thead th{background:var(--surface-cream);font-weight:var(--weight-label);
  letter-spacing:var(--tracking-label);text-transform:uppercase;font-size:var(--type-meta);color:var(--text-display)}
.mbr-article tbody tr:last-child td{border-bottom:0}

/* The author box and any grouped callout the article ends on. */
.mbr-article .wp-block-group{padding:var(--space-6);background:var(--surface-cream);border-radius:var(--radius-md)}
.mbr-article .wp-block-group p{margin-block:var(--space-2);font-size:var(--type-body-sm)}
.mbr-article .wp-block-group :first-child{margin-block-start:0}
.mbr-article .wp-block-group :last-child{margin-block-end:0}

/* Gutenberg buttons, wearing the site's pill. */
.mbr-article .wp-block-button__link{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;
  border-radius:var(--radius-pill);background:var(--navy-800);color:var(--white);text-decoration:none;
  font-family:var(--font-sans);font-size:var(--type-body-sm);font-weight:var(--weight-label);
  transition:background var(--dur-base) var(--ease-calm)}
.mbr-article .wp-block-button__link:hover{background:var(--navy-700);color:var(--white)}

/* ---------- index pagination ---------- */
.mbr-pager{display:flex;justify-content:center;gap:var(--space-2);margin-top:var(--space-8);flex-wrap:wrap}
.mbr-pager a,.mbr-pager span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;
  height:40px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--border-hairline);
  font-size:var(--type-body-sm);text-decoration:none;color:var(--text-body);
  transition:background var(--dur-base) var(--ease-calm),border-color var(--dur-base) var(--ease-calm)}
.mbr-pager a:hover{background:var(--surface-cream);border-color:var(--border-sand)}
.mbr-pager .current{background:var(--navy-800);border-color:var(--navy-800);color:var(--white)}

@media (max-width:640px){
  .mbr-arthero{min-height:340px}
  .mbr-article{font-size:var(--type-body)}
}

/* ---------- service index, grouped by trip type ---------- */
.mbr-svc{display:flex;flex-direction:column;gap:var(--space-7);margin-top:var(--space-8)}
.mbr-svc__g{display:flex;flex-direction:column;gap:var(--space-4);
  padding-top:var(--space-5);border-top:1px solid var(--border-hairline)}
.mbr-svc__t{margin:0;font-size:var(--type-d4);line-height:var(--leading-tight);color:var(--text-display)}
.mbr-svc .mbr-chiprow{justify-content:flex-start;margin-top:0}

/* Anything a link can jump to has to clear the sticky bar, or the heading it
   lands on ends up hidden underneath it. */
.mbr-boat[id],.mbr-svc__g[id],[id]:target{scroll-margin-top:calc(var(--nav-h) + 16px)}