/* Compact coastal booking card; live copy follows the Resort Site Map typography. */
.page-maps .mcb{
 --mcb-rail:calc((100vw - min(100vw,1900px))/2 + 170px);
 --mcb-type-rail:170px;
 --mcb-type-scale:calc((min(100vw,1900px) - var(--mcb-type-rail)) / 1745 * .94);
 --mcb-u:calc((100vw - 2 * var(--mcb-rail)) / 1525);
 position:relative;isolation:isolate;overflow:hidden;
 height:calc(2 * clamp(40px,5vw,75.2px) * 1.06 + 72.1px + 2 * clamp(70px,9vw,120px));
 padding:40px 0;background:#faf8f2;color:#064c43;
}
.page-maps .mcb::after{content:none}
.mcb .mcb__wash{position:absolute;z-index:-1;inset:0;width:100%;height:100%;pointer-events:none;opacity:.75}
.page-maps .mcb .mcb__frame{position:relative;display:flex;align-items:center;width:calc(100% - 2 * var(--mcb-rail));height:100%;margin:0 auto}
.mcb .mcb__card{position:absolute;z-index:-1;inset:0 0 0 calc(-85 * var(--mcb-u));overflow:hidden;border-radius:28px;background:#fcfaf4;box-shadow:0 10px 28px #4d493522}
.mcb .mcb__card>svg{display:block;width:100%;height:100%}
.mcb .mcb__copy{position:relative;width:52%;min-width:0;padding:20px 0}
.page-maps .mcb h2{max-width:none;margin:0;font-family:'Comfort Bodoni',Georgia,serif;font-size:max(45.684px,calc(87.66 * var(--mcb-type-scale)));font-weight:400;line-height:1;letter-spacing:-.012em;color:#073b57;text-wrap:balance}
.page-maps .mcb p{max-width:min(100%,calc(650 * var(--mcb-type-scale)));margin:20px 0 0;font-family:'Comfort Newsreader',Georgia,serif;font-size:max(16.92px,calc(25.2 * var(--mcb-type-scale)));font-weight:400;line-height:max(22.56px,calc(32.7 * var(--mcb-type-scale)));letter-spacing:normal;color:#46665f}
.mcb .cta-band__actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:25px}
.page-maps .mcb .pill{min-height:52px;gap:16px;padding:12px 24px;border-radius:999px;font-family:'Comfort Newsreader',Georgia,serif;font-size:max(16.92px,calc(24.2 * var(--mcb-type-scale)));font-weight:400;line-height:1.1;letter-spacing:normal;white-space:nowrap}
.page-maps .mcb .pill--light{background:#005247;border:1px solid #005247;color:#fff;box-shadow:0 4px 12px #0052471a}
.page-maps .mcb .pill--light:hover{background:#00665b;border-color:#00665b}
.page-maps .mcb .pill--onDark{background:#fcfaf499;border:1px solid #005247;color:#005247}
.page-maps .mcb .pill--onDark:hover{background:#e7f0e9}
.mcb .pill .chip{flex:none;width:28px;height:28px;background:#fff;color:#005247}
.mcb .pill:focus-visible{outline:3px solid #0b6f86;outline-offset:4px}
@media(max-width:1450px){.page-maps .mcb{--mcb-rail:clamp(80px,8.947vw,170px);--mcb-type-rail:clamp(80px,8.947vw,170px)}}
@media(max-width:1250px) and (min-width:1101px){
 .page-maps .mcb{padding-block:28px}
 .mcb .mcb__copy{width:57%;padding-block:10px}
 .page-maps .mcb .pill{padding-inline:18px;min-height:48px;gap:12px}
 .mcb .cta-band__actions{gap:12px;margin-top:20px}
}
@media(max-width:1150px){
 .page-maps .mcb h2{font-size:clamp(36.378px,7.0218vw,64.296px)}
 .page-maps .mcb p{font-size:22.56px;line-height:1.3}
 .page-maps .mcb .pill{font-size:20.68px}
}
@media(max-width:1100px){
 .page-maps .mcb{height:auto;padding:40px 0}
 .page-maps .mcb .mcb__frame{min-height:360px}
 .mcb .mcb__copy{width:65%;padding-block:32px}
 .page-maps .mcb p{max-width:none}
 .mcb .mcb__card{border-radius:22px}
 .mcb .mcb__card::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fcfaf4f5 0%,#fcfaf4e6 40%,#fcfaf480 65%,transparent)}
 .mcb .cta-band__actions{gap:14px;margin-top:24px}
}
@media(max-width:900px){.page-maps .mcb{--mcb-rail:24px;--mcb-type-rail:24px}}
@media(max-width:700px){
 .mcb .mcb__copy{width:100%;padding:32px 20px 32px 0}
 .mcb .mcb__card::after{background:linear-gradient(90deg,#fcfaf4f7,#fcfaf4e6 75%,#fcfaf499)}
 .mcb .mcb__card{inset-inline-start:calc(-.5 * var(--mcb-rail));border-radius:20px}
 .page-maps .mcb .mcb__frame{min-height:360px}
 .page-maps .mcb .pill{min-height:48px;padding-inline:20px;gap:12px}
 .mcb .cta-band__actions{gap:12px}
}
@media(max-width:540px){
 .page-maps .mcb h2{font-size:clamp(29.61px,8.037vw,40.608px)}
 .page-maps .mcb p{font-size:19.74px;line-height:1.4}
 .page-maps .mcb .pill{font-size:19.74px}
}

/* Keep the closing card inside the hero's responsive content rails. */
.page-maps .mcb{
 height:auto;
 padding-top:150px;
}
.page-maps .mcb .mcb__frame{
 height:auto;
 min-height:clamp(360px,27vw,392px);
}
.page-maps .mcb .mcb__card{
 inset:0;
}
.page-maps .mcb .mcb__copy{
 padding-left:clamp(24px,3vw,48px);
}

/* Dissolve the coastal artwork into matching paper colors at both joins. */
.page-maps .mdr::after{
 content:"";position:absolute;z-index:-1;inset:auto 0 0;height:160px;
 background:linear-gradient(to bottom,rgba(252,248,239,0),#fcf8ef);
 pointer-events:none;
}
.page-maps .mcb{
 background:linear-gradient(to bottom,#fcf8ef 0,#faf8f2 180px,#faf8f2 calc(100% - 140px),#faf6ef 100%);
}
.page-maps .mcb .mcb__wash{
 -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 160px,#000 calc(100% - 120px),transparent 100%);
 mask-image:linear-gradient(to bottom,transparent 0,#000 160px,#000 calc(100% - 120px),transparent 100%);
}

/* Give the Maps footer more separation from the closing booking card. */
body.page-maps #site-footer{margin-top:120px}

.page-maps .mcb .mcb__accent{color:#917658}

/* Swap the existing artwork and copy without mirroring the photograph. */
.page-maps .mcb .mcb__card>svg{
 transform:translateX(-48%);
 -webkit-mask-image:linear-gradient(90deg,#000 80%,transparent 100%);
 mask-image:linear-gradient(90deg,#000 80%,transparent 100%);
}
.page-maps .mcb .mcb__copy{
 margin-left:auto;
 padding-left:0;
 padding-right:clamp(24px,3vw,48px);
}
.page-maps .mcb .mcb__card::after{transform:scaleX(-1)}
@media(max-width:700px){.page-maps .mcb .mcb__copy{padding-left:20px}}

/* End the photo fade 24px before the text column begins. */
@media(min-width:701px){
 .page-maps .mcb .mcb__card>svg{
  --mcb-copy-start:48%;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(48% + var(--mcb-copy-start) - 120px),transparent calc(48% + var(--mcb-copy-start) - 24px));
  mask-image:linear-gradient(90deg,#000 calc(48% + var(--mcb-copy-start) - 120px),transparent calc(48% + var(--mcb-copy-start) - 24px));
 }
}
@media(min-width:1101px) and (max-width:1250px){.page-maps .mcb .mcb__card>svg{--mcb-copy-start:43%}}
@media(min-width:701px) and (max-width:1100px){.page-maps .mcb .mcb__card>svg{--mcb-copy-start:35%}}