.elementor-352 .elementor-element.elementor-element-57b6d98{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-37b5069{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-c84a6f8{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-a84a42d{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-4600409{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-e3e3c6c{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-2ba982c{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-bcb9598{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-352 .elementor-element.elementor-element-8ac40d1{--e-n-carousel-swiper-slides-to-display:5;--e-n-carousel-swiper-slides-gap:10px;--e-n-carousel-slide-height:auto;--e-n-carousel-slide-container-height:100%;--e-n-carousel-arrow-prev-left-align:0%;--e-n-carousel-arrow-prev-translate-x:0px;--e-n-carousel-arrow-prev-left-position:0px;--e-n-carousel-arrow-prev-top-align:50%;--e-n-carousel-arrow-prev-translate-y:-50%;--e-n-carousel-arrow-prev-top-position:0px;--e-n-carousel-arrow-next-right-align:0%;--e-n-carousel-arrow-next-translate-x:0%;--e-n-carousel-arrow-next-right-position:0px;--e-n-carousel-arrow-next-top-align:50%;--e-n-carousel-arrow-next-translate-y:-50%;--e-n-carousel-arrow-next-top-position:0px;}.elementor-352 .elementor-element.elementor-element-9c3bef9{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-ec1046e{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-9b3af4f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-ea6940d{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:230px 230px;--row-gap:230px;--column-gap:230px;--padding-top:130px;--padding-bottom:130px;--padding-left:40px;--padding-right:40px;}.elementor-352 .elementor-element.elementor-element-ea6940d:not(.elementor-motion-effects-element-type-background), .elementor-352 .elementor-element.elementor-element-ea6940d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F7F5EF;background-image:url("https://dev.palmillabeach.com/wp-content/uploads/2026/09/Background-gradient-scaled.jpg");background-position:bottom center;background-size:cover;}.elementor-352 .elementor-element.elementor-element-ea6940d::before, .elementor-352 .elementor-element.elementor-element-ea6940d > .elementor-background-video-container::before, .elementor-352 .elementor-element.elementor-element-ea6940d > .e-con-inner > .elementor-background-video-container::before, .elementor-352 .elementor-element.elementor-element-ea6940d > .elementor-background-slideshow::before, .elementor-352 .elementor-element.elementor-element-ea6940d > .e-con-inner > .elementor-background-slideshow::before, .elementor-352 .elementor-element.elementor-element-ea6940d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-352 .elementor-element.elementor-element-7830204{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-7830204.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-352 .elementor-element.elementor-element-eebeea1{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-620fb50 .elementor-accordion-item{border-width:0px;}.elementor-352 .elementor-element.elementor-element-620fb50 .elementor-accordion-item .elementor-tab-content{border-width:0px;}.elementor-352 .elementor-element.elementor-element-620fb50 .elementor-accordion-item .elementor-tab-title.elementor-active{border-width:0px;}.elementor-352 .elementor-element.elementor-element-be64613{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-be64613 > .elementor-shape-top .elementor-shape-fill, .elementor-352 .elementor-element.elementor-element-be64613 > .e-con-inner > .elementor-shape-top .elementor-shape-fill{fill:#FAF6F2;}.elementor-352 .elementor-element.elementor-element-be64613 > .elementor-shape-top svg, .elementor-352 .elementor-element.elementor-element-be64613 > .e-con-inner > .elementor-shape-top svg{width:calc(100% + 1.3px);height:80px;}.elementor-352 .elementor-element.elementor-element-be64613 > .elementor-shape-top, .elementor-352 .elementor-element.elementor-element-be64613 > .e-con-inner > .elementor-shape-top{z-index:2;pointer-events:none;}.elementor-352 .elementor-element.elementor-element-9e4fdfe{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:100px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-352 .elementor-element.elementor-element-9e4fdfe:not(.elementor-motion-effects-element-type-background), .elementor-352 .elementor-element.elementor-element-9e4fdfe > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:1024px){.elementor-352 .elementor-element.elementor-element-8ac40d1{--e-n-carousel-swiper-slides-to-display:3;}.elementor-352 .elementor-element.elementor-element-ea6940d{--gap:60px 60px;--row-gap:60px;--column-gap:60px;--padding-top:80px;--padding-bottom:80px;--padding-left:30px;--padding-right:30px;}.elementor-352 .elementor-element.elementor-element-be64613 > .elementor-shape-top svg, .elementor-352 .elementor-element.elementor-element-be64613 > .e-con-inner > .elementor-shape-top svg{width:calc(200% + 1.3px);height:60px;}.elementor-352 .elementor-element.elementor-element-be64613{--padding-top:45px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-9e4fdfe{--padding-top:100px;--padding-bottom:90px;--padding-left:30px;--padding-right:30px;}}@media(max-width:767px){.elementor-352 .elementor-element.elementor-element-8ac40d1{--e-n-carousel-swiper-slides-to-display:1;}.elementor-352 .elementor-element.elementor-element-ea6940d{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:40px 40px;--row-gap:40px;--column-gap:40px;--padding-top:60px;--padding-bottom:60px;--padding-left:30px;--padding-right:30px;}.elementor-352 .elementor-element.elementor-element-7830204{--width:100%;}.elementor-352 .elementor-element.elementor-element-be64613 > .elementor-shape-top svg, .elementor-352 .elementor-element.elementor-element-be64613 > .e-con-inner > .elementor-shape-top svg{height:20px;}.elementor-352 .elementor-element.elementor-element-be64613{--padding-top:35px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-352 .elementor-element.elementor-element-9e4fdfe{--padding-top:80px;--padding-bottom:70px;--padding-left:30px;--padding-right:30px;}}@media(min-width:768px){.elementor-352 .elementor-element.elementor-element-7830204{--width:330px;}}@media(max-width:1024px) and (min-width:768px){.elementor-352 .elementor-element.elementor-element-7830204{--width:300px;}}/* Start custom CSS *//* ===== explore banners (matched to the Events "While You're Here" cards) ===== */
body.elementor-page-352 #beach-explore{width:100%;max-width:1494px;margin:60px auto 0;padding:0;display:flex;border-radius:20px;overflow:hidden;position:relative;}
body.elementor-page-352 #beach-banner-1,body.elementor-page-352 #beach-banner-2{position:relative;overflow:hidden;flex:1 1 0%;min-width:0;display:block;height:clamp(290px,27vw,450px);padding:0;}
body.elementor-page-352 #beach-banner-2{border-left:2px solid rgba(255,255,255,0.8);}
body.elementor-page-352 #beach-banner-1>img,body.elementor-page-352 #beach-banner-2>img{position:absolute;top:0;left:0;width:100%!important;max-width:none;height:100%;object-fit:cover;z-index:0;transition:transform 350ms;}
body.elementor-page-352 #beach-banner-1>img{object-position:15% 82%;}
body.elementor-page-352 #beach-banner-2>img{object-position:0% 100%;}
body.elementor-page-352 #beach-banner-1::after,body.elementor-page-352 #beach-banner-2::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(0,0,0,0.58),rgba(0,0,0,0.06) 65%);transition:background 250ms;z-index:1;pointer-events:none;border:none!important;}
body.elementor-page-352 #beach-banner-1:hover::after,body.elementor-page-352 #beach-banner-2:hover::after,body.elementor-page-352 #beach-banner-1:focus-within::after,body.elementor-page-352 #beach-banner-2:focus-within::after{background:linear-gradient(0deg,rgba(0,0,0,0.7),rgba(0,0,0,0.16) 72%);}
body.elementor-page-352 #beach-banner-1:hover>img,body.elementor-page-352 #beach-banner-2:hover>img{transform:scale(1.025);}
body.elementor-page-352 #beach-banner-1>div,body.elementor-page-352 #beach-banner-2>div{position:absolute;left:42px;bottom:38px;z-index:2;padding:0;display:flex;flex-direction:column;gap:2px;transition:transform 250ms;}
body.elementor-page-352 #beach-banner-1:hover>div,body.elementor-page-352 #beach-banner-2:hover>div,body.elementor-page-352 #beach-banner-1:focus-within>div,body.elementor-page-352 #beach-banner-2:focus-within>div{transform:translateY(-4px);}
body.elementor-page-352 #beach-banner-1>div>p,body.elementor-page-352 #beach-banner-2>div>p{font-style:italic;margin:0;}
body.elementor-page-352 #beach-banner-1 h3,body.elementor-page-352 #beach-banner-2 h3{margin:0;}
body.elementor-page-352 #beach-banner-link-1,body.elementor-page-352 #beach-banner-link-2{position:absolute;top:0;left:0;right:0;bottom:0;z-index:3;display:block;width:100%!important;height:100%!important;max-width:none!important;background:transparent!important;border:none!important;border-radius:0!important;padding:0!important;margin:0!important;font-size:0!important;line-height:0!important;color:transparent!important;overflow:hidden;box-shadow:none!important;}
body.elementor-page-352 #beach-banner-link-1:focus-visible,body.elementor-page-352 #beach-banner-link-2:focus-visible{outline:none;}
body.elementor-page-352 #beach-banner-1:focus-within,body.elementor-page-352 #beach-banner-2:focus-within{outline:3px solid #FFFFFF;outline-offset:-6px;}
@media(max-width:767px){
body.elementor-page-352 #beach-explore{flex-direction:column;gap:0;border-radius:20px;overflow:hidden;margin-top:40px;}
body.elementor-page-352 #beach-banner-1,body.elementor-page-352 #beach-banner-2{height:300px;width:100%;border-radius:0;flex:0 0 auto;}
body.elementor-page-352 #beach-banner-2{border-left:none;border-top:2px solid rgba(255,255,255,0.8);}
body.elementor-page-352 #beach-banner-1>div,body.elementor-page-352 #beach-banner-2>div{left:26px;bottom:26px;}
}
@media(prefers-reduced-motion:reduce){
body.elementor-page-352 #beach-banner-1>img,body.elementor-page-352 #beach-banner-2>img,body.elementor-page-352 #beach-banner-1>div,body.elementor-page-352 #beach-banner-2>div{transition:none;}
}

/* ===== FAQ accordion - shared house style (matches Home Collections #hc-accordion) ===== */
body.elementor-page-352 .rental-faq{width:100%;}
body.elementor-page-352 .rental-faq .elementor-accordion{border:0;}
body.elementor-page-352 .rental-faq .elementor-accordion-item{border:0!important;border-bottom:1px solid rgba(99,93,88,.45)!important;background:transparent;}
body.elementor-page-352 .rental-faq .elementor-tab-title{padding:24px 0!important;display:block;font:700 14px/18px 'nexa',sans-serif;letter-spacing:2.1px;text-transform:uppercase;color:#18948d;background:transparent!important;border:0!important;}
body.elementor-page-352 .rental-faq .elementor-accordion-title{color:#18948d;font:inherit;}
body.elementor-page-352 .rental-faq .elementor-accordion-icon{float:right;width:24px;margin-left:20px;}
body.elementor-page-352 .rental-faq .elementor-accordion-icon svg{width:7px;height:15px;}
body.elementor-page-352 .rental-faq .elementor-accordion-icon-closed svg{transform:rotate(180deg);}
body.elementor-page-352 .rental-faq .elementor-accordion-icon-opened svg{transform:rotate(-90deg);}
body.elementor-page-352 .rental-faq .elementor-tab-content{padding:0 60px 28px 0!important;border:0!important;background:transparent!important;color:#635d58;font:400 16px/22px 'nunito',sans-serif;}
body.elementor-page-352 .rental-faq .elementor-tab-content p{margin:0;}
@media(max-width:767px){
body.elementor-page-352 .rental-faq .elementor-tab-title{font-size:12px;line-height:19px;letter-spacing:1.5px;}
body.elementor-page-352 .rental-faq .elementor-tab-content{padding-right:0!important;}
}

/* ==========================================================================
   STAY - built from Figma 1UGtSN4jy8ocNSPmUG2z5N node 1442:3013
   ("26-PB - Stay", 1682 x 7787).  Bands are Golf/Pools' single-cell grids;
   every horizontal reference is derived from the 1682 frame (left column
   128 -> 7.61vw, right column 1030 -> 61.237vw) and carries NO px term.
   No scripting anywhere on this page: the Plan section is pinned with
   position:sticky and fades its cards with a CSS view() timeline.
   ========================================================================== */

body.elementor-page-352{
--stay-wave-a:url('/wp-content/uploads/2026/09/life-at-palmilla-wave-mask.svg');
--stay-plan-mask:url('/wp-content/uploads/2026/09/stay-plan-photo-mask-concave-right-edge-1011x788-1.svg');
--stay-cream:linear-gradient(281deg,#F4F0E7 28.3%,#EDE6D7 116.4%);
--stay-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n' x='0' y='0' width='100%' height='100%'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch' result='t'/%3E%3CfeColorMatrix in='t' type='luminanceToAlpha' result='a'/%3E%3CfeComponentTransfer in='a' result='m'%3E%3CfeFuncA type='discrete' tableValues='0 0 0 0 0 0 1 1 1 1'/%3E%3C/feComponentTransfer%3E%3CfeFlood flood-color='%23ffffff' flood-opacity='.55' result='f'/%3E%3CfeComposite in='f' in2='m' operator='in'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== shared scaffolding: hero and band 2 are single-cell grids ===== */
body.elementor-page-352 #stay-hero,
body.elementor-page-352 #stay-vacation{
padding:0;width:100%;max-width:none;position:relative;overflow:hidden;
display:grid;grid-template-columns:100%;align-items:center;
}
body.elementor-page-352 #stay-hero>*,
body.elementor-page-352 #stay-vacation>*{grid-area:1/1;min-width:0;}

/* Figma's layer order: hero under band 2, the amenities sand UNDER band 2,
   the Plan panel over everything before it. */
body.elementor-page-352 #stay-hero{z-index:1;min-height:67.301vw;align-items:start;}
body.elementor-page-352 #stay-vacation{z-index:3;min-height:56.243vw;margin-top:-16.052vw;}

/* ===== hero - a still, painted here so the rendition is ours to choose.
   Figma's fill is stretched 17.7% vertically (its crop window is AR 1.855 in
   a 1.576 box); that is not reproduced.  The picture is zoomed to 120% of the
   box height and anchored at the bottom, which keeps the family on the lawn
   and crops the top sixth of sky, close to Figma's framing. ===== */
body.elementor-page-352 #stay-hero{
background-color:#D9C9BC;background-repeat:no-repeat;background-position:center 100%;background-size:auto 120%;
background-image:url('/wp-content/uploads/2026/09/8b8bc2ff-8f51-4e07-ad04-e681c91b1785-1536x1025.jpg');
}
@media(min-width:1601px){
body.elementor-page-352 #stay-hero{background-image:url('/wp-content/uploads/2026/09/8b8bc2ff-8f51-4e07-ad04-e681c91b1785-2048x1366.jpg');}
}
/* teal type on a sunset sky: on Figma's own render the H1 rows measure 2.96:1
   at the 5th percentile, under the 3:1 large text needs.  A white band behind
   the title zone lifts it (measured live, see stay-page-built). */
body.elementor-page-352 #stay-hero::after{
content:'';position:absolute;inset:0;top:auto!important;bottom:0;height:100%;
z-index:1;pointer-events:none;border:none!important;
background:linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.36) 14%,rgba(255,255,255,.36) 30%,rgba(255,255,255,0) 50%);
}
body.elementor-page-352 #stay-hero-copy{
display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
padding:10.285vw 30px 0 30px;position:relative;z-index:2;pointer-events:none;
}
body.elementor-page-352 #stay-hero-copy>*{pointer-events:auto;}
body.elementor-page-352 #stay-hero h1{
font-family:"richmond-display",Georgia,serif;font-weight:400;font-style:italic;
font-size:65px;line-height:54px;letter-spacing:0;color:#097173;margin:0;text-align:center;max-width:673px;
}
body.elementor-page-352 #stay-hero h1 em{
display:block;font-family:nexa,Helvetica,Arial,sans-serif;font-weight:400;font-style:normal;
font-size:24px;line-height:40px;letter-spacing:3.6px;text-transform:uppercase;color:#097173;
}
/* "Book Your Stay" is Golf's stats-bar CTA: 274 x 71, Palmilla Green, an
   inner 1px white border and the italic display face */
body.elementor-page-352 #stay-hero-cta{margin-top:17px;}
body.elementor-page-352 #stay-hero-cta .elementor-button{
position:relative;display:flex!important;align-items:center;justify-content:center;
width:274px!important;max-width:none!important;min-width:0!important;height:71px;min-height:0;
padding:0 22px!important;border:none!important;border-radius:0!important;
background-color:#02938D!important;background-image:none!important;
box-shadow:9px 9px 21px rgba(0,0,0,.15);
font-family:"richmond-display",Georgia,serif!important;font-weight:400!important;font-style:italic!important;
font-size:28px!important;line-height:1.2!important;letter-spacing:0!important;text-transform:none!important;
color:#FFFFFF!important;text-align:center;transition:background-color .2s ease;
}
body.elementor-page-352 #stay-hero-cta .elementor-button:hover,
body.elementor-page-352 #stay-hero-cta .elementor-button:focus-visible{background-color:#097173!important;}
body.elementor-page-352 #stay-hero-cta .elementor-button::after{
content:'';position:absolute;top:7px;right:6px;bottom:6px;left:6px;
border:1px solid #FFFFFF!important;pointer-events:none;background:none!important;
}
body.elementor-page-352 #stay-hero-cta .elementor-button:focus-visible{outline:3px solid #FFFFFF;outline-offset:-7px;}

/* ===== band 2 - Make The Most Of Your Vacation =====
   Golf's scrim band with the cream grain field instead of white.  The mask is
   media 3196 (Home's "Life at Palmilla" wave, 1890 wide from x -97 on the 1682
   frame), scaled to the band: 112.366% wide, offset -5.767vw.  Both waves are
   visible (hero above, sand below), so the mask spans the whole section. */
body.elementor-page-352 #stay-vacation{
background-color:#F1ECE0;
background-image:var(--stay-noise),var(--stay-cream);
background-size:160px 160px,100% 100%;background-repeat:repeat,no-repeat;
-webkit-mask-image:var(--stay-wave-a);mask-image:var(--stay-wave-a);
-webkit-mask-size:112.366% 100%;mask-size:112.366% 100%;
-webkit-mask-position:-5.767vw 0;mask-position:-5.767vw 0;
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
/* the photo starts at Figma's hard edge, 635 / 1682, and shows the window of
   the picture that the design's CROP fill shows (u .164-.861) */
body.elementor-page-352 #stay-vacation-photo{
position:absolute;top:0;right:0;bottom:0;left:37.753vw;width:auto;height:auto;
overflow:hidden;line-height:0;padding:0;margin:0;z-index:0;
}
body.elementor-page-352 #stay-vacation-photo img{
position:absolute;top:0;left:-23.5%;width:143.5%;height:100%;max-width:none;object-fit:cover;object-position:center top;display:block;
}
/* Figma's lighten-blend white scrim over the whole band */
body.elementor-page-352 #stay-vacation::after{
content:'';position:absolute;inset:0;top:auto!important;bottom:0;height:100%;
z-index:1;pointer-events:none;border:none!important;mix-blend-mode:lighten;
background:linear-gradient(103.7deg,rgba(255,255,255,.52) 17.1%,rgba(255,255,255,.04) 67.2%);
}
body.elementor-page-352 #stay-vacation-copy{
display:flex;flex-direction:column;align-items:flex-start;gap:0;position:relative;z-index:2;pointer-events:none;
padding:clamp(96px,calc(7.6vw + 65px),150px) 16px calc(clamp(96px,calc(7.6vw + 65px),150px) + 5.35vw) 7.61vw;
max-width:37.753vw;
}
body.elementor-page-352 #stay-vacation-copy>*{pointer-events:auto;}
body.elementor-page-352 #stay-vacation h2{
font-family:"richmond-display",Georgia,serif;font-weight:300;font-style:normal;
font-size:min(42px,2.95vw);line-height:1.02;letter-spacing:1.26px;color:#000000;margin:0;max-width:min(100%,445px);
}
body.elementor-page-352 #stay-vacation h2 em{font-style:italic;font-weight:300;}
body.elementor-page-352 #stay-vacation-body{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:22px;
color:#000000;margin:22px 0 0 0;max-width:min(100%,395px);
}
body.elementor-page-352 #stay-vacation-btn-plan{margin-top:40px;}
body.elementor-page-352 #stay-vacation-btn-rentals{margin-top:10px;}

/* ===== tablet + phone ===== */
@media(max-width:1024px){
body.elementor-page-352 #stay-hero{min-height:clamp(430px,68vw,560px);background-size:cover;background-position:center 100%;}
body.elementor-page-352 #stay-hero::after{background:linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.42) 12%,rgba(255,255,255,.42) 44%,rgba(255,255,255,0) 62%);}
body.elementor-page-352 #stay-hero-copy{padding-top:52px;}
body.elementor-page-352 #stay-hero h1{font-size:46px;line-height:44px;}
body.elementor-page-352 #stay-hero h1 em{font-size:18px;line-height:32px;letter-spacing:2.7px;}
body.elementor-page-352 #stay-hero-cta{margin-top:22px;}
body.elementor-page-352 #stay-hero-cta .elementor-button{width:224px!important;height:58px;font-size:22px!important;}
/* band 2 stacks: [photo][cream copy panel], and the WHOLE stack keeps the
   wave mask: the top wave cuts into the hero photo (the band is tucked 80px
   under it, past the wave's depth) and the bottom wave cuts into the sand,
   which is tucked 90px under the band.  A cream panel dissolving to white met
   the sand on a hard line; this is the desktop hand-off, stacked. */
body.elementor-page-352 #stay-vacation{display:block;min-height:0;margin-top:-80px;
background-image:var(--stay-noise),var(--stay-cream);background-size:160px 160px,100% 100%;background-repeat:repeat,no-repeat;}
body.elementor-page-352 #stay-vacation::after{display:none;}
body.elementor-page-352 #stay-vacation-photo{position:relative;left:0;width:100%!important;height:clamp(300px,42vw,430px);}
body.elementor-page-352 #stay-vacation-photo img{position:static;width:100%;height:100%;object-position:60% 40%;}
/* the bottom wave takes ~11% of the band; the copy's run-out is measured to
   the wave's visible edge, so the padding carries the depth plus the house 56 */
body.elementor-page-352 #stay-vacation-copy{padding:30px 30px calc(56px + 90px) 30px!important;width:100%;max-width:none;}
body.elementor-page-352 #stay-vacation h2{font-size:36px;line-height:38px;max-width:min(100%,640px);text-wrap:balance;}
body.elementor-page-352 #stay-vacation-body{max-width:min(100%,540px);}
}
@media(max-width:767px){
body.elementor-page-352 #stay-hero{background-image:url('/wp-content/uploads/2026/09/8b8bc2ff-8f51-4e07-ad04-e681c91b1785-1024x683.jpg');}
body.elementor-page-352 #stay-hero h1{font-size:clamp(34px,10vw,40px);line-height:1.06;}
body.elementor-page-352 #stay-hero h1 em{font-size:clamp(14px,4vw,16px);line-height:28px;letter-spacing:2.1px;}
body.elementor-page-352 #stay-vacation h2{font-size:32px;line-height:34px;}
body.elementor-page-352 #stay-vacation-btn-plan,
body.elementor-page-352 #stay-vacation-btn-rentals{width:100%;}
body.elementor-page-352 #stay-vacation-btn-plan .elementor-button,
body.elementor-page-352 #stay-vacation-btn-rentals .elementor-button{width:100%!important;}
}
@media(max-width:1024px) and (orientation:landscape) and (max-height:500px){
body.elementor-page-352 #stay-hero{min-height:min(clamp(430px,68vw,560px),88vh);}
}

/* ===== 3. Amenities For Everyone =====
   Experience's §9 component (itself Home's "Made for Moments that Matter"
   with the AA veil, the title fade, the width-gated hover and the card focus
   ring).  The sand field is media 2754 - the same composed artwork as Figma's
   "Sand Background" group (mean |diff| 0.86).  Figma tucks the section UNDER
   band 2 by 244px (14.507vw); the art is 1432 tall against a 1352 section,
   and it fades to white before the section ends, so the 32px white gap the
   design leaves before the Plan panel needs nothing extra. */
body.elementor-page-352 #stay-amenities{
position:relative;z-index:2;margin-top:-14.507vw;min-height:80.38vw;padding:22.12vw 0 0 0;
display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;
background-color:#FFFFFF;
background-image:url('/wp-content/uploads/2026/09/groups-sand-bg.jpg');
background-repeat:no-repeat;background-position:center top;background-size:100% auto;
}
body.elementor-page-352 #stay-amenities h2{
font-family:"richmond-display",Georgia,serif;font-weight:300;font-size:42px;line-height:42px;
letter-spacing:1.26px;color:#000000;margin:0 0 0 7.61vw;
}
body.elementor-page-352 #stay-amenities h2 em{font-style:italic;font-weight:300;}
body.elementor-page-352 #stay-amenities-body{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:22px;
color:#000000;margin:22px 0 0 7.61vw;max-width:min(100%,512px);padding-right:30px;
}
/* Figma sets the five cards at x 42 / 366 / 690 / 1014 / 1338 (pitch 324, gap
   12): 2.497vw of side padding, five per view */
/* the carousel starts on the description's bottom edge: the cards' 50px lift
   reserve is then the gap to the copy, and a hovered card rises to that edge
   without covering the paragraph (36px lower than Figma, stated) */
body.elementor-page-352 #stay-moments{margin-top:0;padding:0 2.497vw;width:100%;}
body.elementor-page-352 #stay-moments .swiper-pagination{display:none!important;}
body.elementor-page-352 #stay-moments .swiper-slide>.e-con{padding:0!important;}

/* --- the amenity cards: 312 x 680 at radius 51, a teal veil that fades in
   over the photo and a description that opens with it.  The 50px margin-top
   is the hover lift reserve; even cards sit one lift lower (Figma: card 2
   at +46; card 4 is drawn hovered). --- */
body.elementor-page-352 #stay-card-1,
body.elementor-page-352 #stay-card-2,
body.elementor-page-352 #stay-card-3,
body.elementor-page-352 #stay-card-4,
body.elementor-page-352 #stay-card-5{
position:relative;display:block;width:100%;padding:0;overflow:hidden;
border-radius:51px;height:min(40.428vw,680px);margin-top:50px;
transition:transform .85s ease-in-out;
}
body.elementor-page-352 #stay-card-1-photo,
body.elementor-page-352 #stay-card-2-photo,
body.elementor-page-352 #stay-card-3-photo,
body.elementor-page-352 #stay-card-4-photo,
body.elementor-page-352 #stay-card-5-photo{position:absolute;inset:0;padding:0;line-height:0;}
body.elementor-page-352 #stay-card-1-photo img,
body.elementor-page-352 #stay-card-2-photo img,
body.elementor-page-352 #stay-card-3-photo img,
body.elementor-page-352 #stay-card-4-photo img,
body.elementor-page-352 #stay-card-5-photo img{display:block;width:100%;height:100%;object-fit:cover;}
/* each fill's crop window, as object-position (the windows share the card's
   aspect, so cover + position reproduces them) */
body.elementor-page-352 #stay-card-1-photo img{object-position:41% 95%;}
body.elementor-page-352 #stay-card-2-photo img{object-position:64% 50%;}
body.elementor-page-352 #stay-card-3-photo img{object-position:75% 84%;}
body.elementor-page-352 #stay-card-4-photo img{object-position:39% 50%;}
body.elementor-page-352 #stay-card-5-photo img{object-position:50% 50%;}
/* white 16px titles straight on the photos measure 2.51 / 1.57 / 1.83 / 4.67
   at the 5th percentile on Figma's own pixels; Experience's fade (.22/.62)
   left cards 2-4 at 4.0-4.3 here, so it is a shade deeper (.30/.72) */
body.elementor-page-352 #stay-card-1-photo::after,
body.elementor-page-352 #stay-card-2-photo::after,
body.elementor-page-352 #stay-card-3-photo::after,
body.elementor-page-352 #stay-card-4-photo::after,
body.elementor-page-352 #stay-card-5-photo::after{
content:'';position:absolute;left:0;right:0;bottom:0;height:45%;z-index:1;
background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.30) 45%,rgba(0,0,0,.72) 100%);
pointer-events:none;
}
body.elementor-page-352 #stay-card-1-panel,
body.elementor-page-352 #stay-card-2-panel,
body.elementor-page-352 #stay-card-3-panel,
body.elementor-page-352 #stay-card-4-panel,
body.elementor-page-352 #stay-card-5-panel{
position:absolute;left:0;right:0;bottom:0;z-index:1;
display:flex;flex-direction:column;align-items:center;gap:14px;padding:30px 26px;
background:rgba(24,148,141,0);transition:background .35s ease-in-out;
}
body.elementor-page-352 #stay-card-1-title,
body.elementor-page-352 #stay-card-2-title,
body.elementor-page-352 #stay-card-3-title,
body.elementor-page-352 #stay-card-4-title,
body.elementor-page-352 #stay-card-5-title{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:24px;
letter-spacing:2.4px;text-transform:uppercase;color:#FFFFFF;margin:0;text-align:center;
}
body.elementor-page-352 #stay-card-1-body,
body.elementor-page-352 #stay-card-2-body,
body.elementor-page-352 #stay-card-3-body,
body.elementor-page-352 #stay-card-4-body,
body.elementor-page-352 #stay-card-5-body{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:22px;
color:#FFFFFF;margin:0;text-align:center;max-height:0;opacity:0;overflow:hidden;
transition:max-height .85s ease-in-out,opacity .85s ease-in-out;
}
/* every slide is a lightbox link to its Home-page video (Experience's
   pattern), so the play buttons show and the keyboard gets the hover reveal */
body.elementor-page-352 #stay-moments a:focus-visible{outline:2px solid #097173;outline-offset:4px;border-radius:51px;}
/* the play button (media 423, a 47px grey disc + white triangle in a 65px
   box) rides the photo's centre, above the veil, and shows with the reveal */
body.elementor-page-352 #stay-play-1,
body.elementor-page-352 #stay-play-2,
body.elementor-page-352 #stay-play-3,
body.elementor-page-352 #stay-play-4,
body.elementor-page-352 #stay-play-5{
position:absolute;top:42%;left:50%;width:65px;height:65px;margin:-32px 0 0 -32px;padding:0;z-index:2;
pointer-events:none;opacity:0;transition:opacity .35s ease-in-out;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25));
}
/* lift + reveal on hover: DESKTOP ONLY, gated by width as well as capability */
@media(hover:hover) and (min-width:1025px){
body.elementor-page-352 #stay-card-1:hover,
body.elementor-page-352 #stay-card-2:hover,
body.elementor-page-352 #stay-card-3:hover,
body.elementor-page-352 #stay-card-4:hover,
body.elementor-page-352 #stay-card-5:hover,
body.elementor-page-352 #stay-moments a:focus-visible>[id^="stay-card-"]{transform:translateY(-50px);}
body.elementor-page-352 #stay-card-1:hover #stay-card-1-panel,
body.elementor-page-352 #stay-card-2:hover #stay-card-2-panel,
body.elementor-page-352 #stay-card-3:hover #stay-card-3-panel,
body.elementor-page-352 #stay-card-4:hover #stay-card-4-panel,
body.elementor-page-352 #stay-card-5:hover #stay-card-5-panel,
body.elementor-page-352 #stay-moments a:focus-visible [id^="stay-card-"][id$="-panel"]{background:rgba(9,113,115,.88);}
body.elementor-page-352 #stay-card-1:hover #stay-card-1-body,
body.elementor-page-352 #stay-card-2:hover #stay-card-2-body,
body.elementor-page-352 #stay-card-3:hover #stay-card-3-body,
body.elementor-page-352 #stay-card-4:hover #stay-card-4-body,
body.elementor-page-352 #stay-card-5:hover #stay-card-5-body,
body.elementor-page-352 #stay-moments a:focus-visible [id^="stay-card-"][id$="-body"]{max-height:240px;opacity:1;}
body.elementor-page-352 #stay-card-1:hover #stay-play-1,
body.elementor-page-352 #stay-card-2:hover #stay-play-2,
body.elementor-page-352 #stay-card-3:hover #stay-play-3,
body.elementor-page-352 #stay-card-4:hover #stay-play-4,
body.elementor-page-352 #stay-card-5:hover #stay-play-5,
body.elementor-page-352 #stay-moments a:focus-visible [id^="stay-play-"]{opacity:1;}
}
/* below 1025, and on any touch device, the card rests in the revealed state */
@media(hover:none),(max-width:1024px){
body.elementor-page-352 #stay-card-1-panel,
body.elementor-page-352 #stay-card-2-panel,
body.elementor-page-352 #stay-card-3-panel,
body.elementor-page-352 #stay-card-4-panel,
body.elementor-page-352 #stay-card-5-panel{background:rgba(9,113,115,.88);}
body.elementor-page-352 #stay-card-1-body,
body.elementor-page-352 #stay-card-2-body,
body.elementor-page-352 #stay-card-3-body,
body.elementor-page-352 #stay-card-4-body,
body.elementor-page-352 #stay-card-5-body{max-height:260px;opacity:1;}
body.elementor-page-352 #stay-play-1,
body.elementor-page-352 #stay-play-2,
body.elementor-page-352 #stay-play-3,
body.elementor-page-352 #stay-play-4,
body.elementor-page-352 #stay-play-5{opacity:1;}
}
@media(min-width:1025px){
body.elementor-page-352 #stay-card-2,
body.elementor-page-352 #stay-card-4{margin-top:100px;}
/* five slides, five per view: both arrows are permanently inert up here */
body.elementor-page-352 #stay-moments .elementor-swiper-button.swiper-button-disabled{display:none;}
}
@media(max-width:1024px){
body.elementor-page-352 #stay-amenities{margin-top:-90px;min-height:0;padding:150px 0 60px 0;background-size:1400px auto;}
body.elementor-page-352 #stay-amenities h2{margin-left:30px;font-size:36px;line-height:38px;}
body.elementor-page-352 #stay-amenities-body{margin-left:30px;padding-right:30px;max-width:min(100%,540px);}
body.elementor-page-352 #stay-moments{margin-top:24px;padding:0 30px;}
body.elementor-page-352 #stay-card-1,
body.elementor-page-352 #stay-card-2,
body.elementor-page-352 #stay-card-3,
body.elementor-page-352 #stay-card-4,
body.elementor-page-352 #stay-card-5{margin-top:0;height:490px;}
body.elementor-page-352 #stay-moments .elementor-swiper-button,
body.elementor-page-352 #stay-moments .swiper-button-prev,
body.elementor-page-352 #stay-moments .swiper-button-next{
width:44px;height:44px;display:flex;align-items:center;justify-content:center;
border-radius:50%;background:#FFFFFF;color:#097173;box-shadow:0 2px 8px rgba(0,0,0,.16);
}
body.elementor-page-352 #stay-moments .elementor-swiper-button svg{width:11px;height:20px;fill:currentColor;}
body.elementor-page-352 #stay-moments .elementor-swiper-button i{font-size:17px;}
body.elementor-page-352 #stay-moments .elementor-swiper-button:focus-visible{outline:3px solid #097173;outline-offset:3px;}
}
/* 768-1024 runs 3-up and 1025-1300 five-up off a 187-230px box: the 16px
   uppercase title wraps mid-word there, so the card type drops to 14 */
@media(min-width:768px) and (max-width:1300px){
body.elementor-page-352 #stay-card-1-title,
body.elementor-page-352 #stay-card-2-title,
body.elementor-page-352 #stay-card-3-title,
body.elementor-page-352 #stay-card-4-title,
body.elementor-page-352 #stay-card-5-title{font-size:14px;line-height:20px;letter-spacing:1.9px;}
body.elementor-page-352 #stay-card-1-body,
body.elementor-page-352 #stay-card-2-body,
body.elementor-page-352 #stay-card-3-body,
body.elementor-page-352 #stay-card-4-body,
body.elementor-page-352 #stay-card-5-body{font-size:14px;line-height:19px;}
body.elementor-page-352 #stay-card-1-panel,
body.elementor-page-352 #stay-card-2-panel,
body.elementor-page-352 #stay-card-3-panel,
body.elementor-page-352 #stay-card-4-panel,
body.elementor-page-352 #stay-card-5-panel{padding:24px 18px;gap:10px;}
}
@media(max-width:767px){
body.elementor-page-352 #stay-card-1,
body.elementor-page-352 #stay-card-2,
body.elementor-page-352 #stay-card-3,
body.elementor-page-352 #stay-card-4,
body.elementor-page-352 #stay-card-5{max-width:400px;margin-left:auto;margin-right:auto;}
body.elementor-page-352 #stay-amenities{padding:140px 0 50px 0;background-size:1682px auto;}
body.elementor-page-352 #stay-amenities h2{font-size:32px;line-height:34px;}
}
@media(prefers-reduced-motion:reduce){
body.elementor-page-352 #stay-card-1,body.elementor-page-352 #stay-card-2,body.elementor-page-352 #stay-card-3,body.elementor-page-352 #stay-card-4,body.elementor-page-352 #stay-card-5,
body.elementor-page-352 #stay-card-1-panel,body.elementor-page-352 #stay-card-2-panel,body.elementor-page-352 #stay-card-3-panel,body.elementor-page-352 #stay-card-4-panel,body.elementor-page-352 #stay-card-5-panel,
body.elementor-page-352 #stay-card-1-body,body.elementor-page-352 #stay-card-2-body,body.elementor-page-352 #stay-card-3-body,body.elementor-page-352 #stay-card-4-body,body.elementor-page-352 #stay-card-5-body,
body.elementor-page-352 #stay-play-1,body.elementor-page-352 #stay-play-2,body.elementor-page-352 #stay-play-3,body.elementor-page-352 #stay-play-4,body.elementor-page-352 #stay-play-5{transition:none!important;}
body.elementor-page-352 #stay-moments .swiper-wrapper{transition-duration:0ms!important;}
}

/* ===== 4. Plan Your Stay - the pinned section =====
   Figma's designer notes: "Fixed Position Header Section Until FAQ Section.
   Left Items Scroll Up."  No script: the panel (cream field, palm texture,
   beach photo, copy) is position:sticky under the 84px header, the eight
   cards follow it in flow and start over it through a negative margin, and
   the section's height is the card column - so the panel releases exactly
   when card 8's bottom reaches its own bottom and the FAQ takes over.  Each
   card fades as it slides under the header with a CSS view() timeline. */
body.elementor-page-352 #stay-plan{
position:relative;z-index:4;display:block;width:100%;max-width:none;padding:0;margin:0;
margin-top:1.902vw;scroll-margin-top:84px;
}
body.elementor-page-352 #stay-plan>.e-con-inner{display:block;max-width:none;width:100%;padding:0;}
/* the panel: Figma's cream gradient + noise, 791 tall on the 1682 frame and
   never shorter than the viewport under the header while pinned */
body.elementor-page-352 #stay-plan-panel{
position:sticky;top:84px;z-index:1;
display:block;width:100%;max-width:none;padding:0;margin:0;overflow:hidden;
height:max(47.027vw,calc(100vh - 84px));
background-color:#F1ECE0;
background-image:var(--stay-noise),linear-gradient(297.1deg,#F4F0E7 28.3%,#EDE6D7 116.4%);
background-size:160px 160px,100% 100%;background-repeat:repeat,no-repeat;
}
/* palm-frond texture, multiplied, over the right 735 / 1682 of the panel.  The
   design's node is flipped (rotate -180 + flip Y) with a positive x-scale, so
   the picture IS mirrored; its crop window is u .339-.845, v .119-1.  Figma
   lightens the fill (exposure +.10, highlights +.44) before multiplying, so a
   brightness lift stands in for those filters. */
body.elementor-page-352 #stay-plan-texture{
position:absolute;top:0;right:0;bottom:0;left:56.243vw;width:auto;height:auto;padding:0;margin:0;
overflow:hidden;pointer-events:none;z-index:0;mix-blend-mode:multiply;
background-image:url('/wp-content/uploads/2026/09/a177086f-17ae-4dde-9e1c-30dbe295ab96-1536x950.jpg');
background-size:197.6% 113.5%;background-position:67.1% 100%;background-repeat:no-repeat;
transform:scaleX(-1);filter:brightness(1.12);
}
/* Figma's white fade is a NORMAL layer above the multiply, so it lives on the
   panel itself, over the texture and under the photo.  It settles on the FAQ's
   own cream (#F7F4EF) instead of white so the pinned panel hands off into the
   Questions section without an edge. */
body.elementor-page-352 #stay-plan-panel::after{
content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(247,244,239,0) 50%,#F7F4EF 100%);
}
/* the beach photo: 1011 x 788 from the panel's top-left, its right edge bowed
   inward to 967 at mid-height (mask 3492), under a cream veil */
body.elementor-page-352 #stay-plan-photo{
position:absolute;top:0;left:0;width:60.107vw;height:100%;max-height:47.027vw;padding:0;margin:0;line-height:0;overflow:hidden;z-index:2;
-webkit-mask-image:var(--stay-plan-mask);mask-image:var(--stay-plan-mask);
-webkit-mask-size:100% 100%;mask-size:100% 100%;
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
body.elementor-page-352 #stay-plan-photo img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 40%;}
body.elementor-page-352 #stay-plan-photo::after{
content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(61.7deg,rgba(237,230,215,0) 37.9%,#F4F0E7 127.5%);
}
body.elementor-page-352 #stay-plan-copy{
position:relative;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:0;
padding:9.87vw 30px 40px 61.237vw;max-width:none;width:100%;
}
body.elementor-page-352 #stay-plan h2{
font-family:"richmond-display",Georgia,serif;font-weight:300;font-style:normal;
font-size:min(42px,2.95vw);line-height:1.02;letter-spacing:1.26px;color:#000000;margin:0;
}
body.elementor-page-352 #stay-plan h2 em{font-style:italic;font-weight:300;}
body.elementor-page-352 #stay-plan-body{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:22px;
color:#000000;margin:22px 0 0 0;max-width:min(395px,calc(38.763vw - 30px));
}
/* the link list: Figma 10px nexa, set at the house minimum 11px; 36px pitch
   with each link filling its row */
body.elementor-page-352 #stay-plan-links{margin:30px 0 0 0;padding:0;}
body.elementor-page-352 #stay-plan-links ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;}
body.elementor-page-352 #stay-plan-links li{margin:0;padding:0;}
body.elementor-page-352 #stay-plan-links a{
display:inline-flex;align-items:center;gap:15px;min-height:36px;padding:0;
font-family:nexa,Helvetica,Arial,sans-serif;font-weight:700;font-size:11px;line-height:18px;letter-spacing:1.65px;
text-transform:uppercase;color:#18948D;text-decoration:none;transition:color .2s ease;
}
body.elementor-page-352 #stay-plan-links a::before{
content:'';flex:0 0 12px;width:12px;height:8px;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M0 4h11M7.5 .5 11 4 7.5 7.5' fill='none' stroke='%2318948D' stroke-width='1'/%3E%3C/svg%3E") center/contain no-repeat;
}
body.elementor-page-352 #stay-plan-links a:hover{color:#097173;text-decoration:underline;}
body.elementor-page-352 #stay-plan-contact{
margin:11px 0 0 0;padding:0;
font-family:nexa,Helvetica,Arial,sans-serif;font-weight:700;font-size:11px;line-height:18px;letter-spacing:1.65px;
text-transform:uppercase;color:#000000;
}
body.elementor-page-352 #stay-plan-contact p{margin:0;}
body.elementor-page-352 #stay-plan-contact a{color:inherit;text-decoration:none;display:inline-block;padding:9px 0;margin:-9px 0;}
body.elementor-page-352 #stay-plan-contact a:hover{color:#097173;text-decoration:underline;}

/* --- the card column: starts 363 / 1682 below the panel top and ends with
   card 8, so the section height is the column and the panel releases when
   the last card has passed --- */
body.elementor-page-352 #stay-plan-cards{
position:relative;z-index:2;display:block;width:100%;max-width:none;padding:0;
margin:calc(21.58vw - max(47.027vw,calc(100vh - 84px))) 0 0 0;
height:auto;
/* the column spans the whole width over the pinned panel, so left alone it
   swallowed every click meant for the panel's link list (elementFromPoint
   returned the column); only the cards themselves take the pointer */
pointer-events:none;
}
body.elementor-page-352 #stay-plan-cards>*{pointer-events:auto;}
/* Figma's zig-zag: odd cards at 117 / 1682, even at 503 / 1682; the even
   column is floored 20px clear of the odd one so the px-wide cards can never
   collide, and the tops are Figma's own */
body.elementor-page-352 #stay-plan-card-1,body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-3,body.elementor-page-352 #stay-plan-card-4,
body.elementor-page-352 #stay-plan-card-5,body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-7,body.elementor-page-352 #stay-plan-card-8{
position:relative;display:flex;flex-direction:column;align-items:center;width:313px;max-width:100%;
margin:0 0 0 6.956vw;padding:44px 20px 34px 20px;border-radius:20px;
background-color:#F1ECE0;
background-image:var(--stay-noise),linear-gradient(281.8deg,#F4F0E7 28.3%,#EDE6D7 116.4%);
background-size:160px 160px,100% 100%;background-repeat:repeat,no-repeat;
box-shadow:3px 4px 11.4px rgba(0,0,0,.08);
}
body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-4,body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-8{
margin-left:max(29.905vw,calc(6.956vw + 333px));
}
/* card tops from Figma's group y values (3405 3691 4005 4322 4629 4943 5174
   5470): each margin is the step from the previous card less that card's
   361px body.  Figma's cards 7/8 were tighter only because its card 7 title
   ran to three lines; with the real copy (two-line titles, 294px cards) they
   take the regular stagger.  The badge overhangs the body by 30px, which is
   card 1's margin */
body.elementor-page-352 #stay-plan-card-1{margin-top:30px;}
body.elementor-page-352 #stay-plan-card-2{margin-top:-75px;}
body.elementor-page-352 #stay-plan-card-3{margin-top:-47px;}
body.elementor-page-352 #stay-plan-card-4{margin-top:-44px;}
body.elementor-page-352 #stay-plan-card-5{margin-top:-54px;}
body.elementor-page-352 #stay-plan-card-6{margin-top:-47px;}
body.elementor-page-352 #stay-plan-card-7{margin-top:-47px;}
body.elementor-page-352 #stay-plan-card-8{margin-top:-47px;}
/* the number badge: a 60px white disc centred on the card's top edge, with a
   52px ring in Palmilla Dark (Figma 0.5px at 100%, drawn as 1px at 55%) */
body.elementor-page-352 #stay-plan-num-1,body.elementor-page-352 #stay-plan-num-2,body.elementor-page-352 #stay-plan-num-3,body.elementor-page-352 #stay-plan-num-4,
body.elementor-page-352 #stay-plan-num-5,body.elementor-page-352 #stay-plan-num-6,body.elementor-page-352 #stay-plan-num-7,body.elementor-page-352 #stay-plan-num-8{
position:absolute;top:-30px;left:50%;transform:translateX(-50%);width:60px;height:60px;margin:0;padding:0;
border-radius:50%;background:#FFFFFF;display:flex;align-items:center;justify-content:center;
font-family:"richmond-display",Georgia,serif;font-weight:600;font-style:normal;font-size:29px;line-height:33px;letter-spacing:.88px;color:#097173;
}
body.elementor-page-352 #stay-plan-num-1::before,body.elementor-page-352 #stay-plan-num-2::before,body.elementor-page-352 #stay-plan-num-3::before,body.elementor-page-352 #stay-plan-num-4::before,
body.elementor-page-352 #stay-plan-num-5::before,body.elementor-page-352 #stay-plan-num-6::before,body.elementor-page-352 #stay-plan-num-7::before,body.elementor-page-352 #stay-plan-num-8::before{
content:'';position:absolute;inset:4px;border-radius:50%;border:1px solid rgba(9,113,115,.55);
}
body.elementor-page-352 #stay-plan-card-1 h3,body.elementor-page-352 #stay-plan-card-2 h3,body.elementor-page-352 #stay-plan-card-3 h3,body.elementor-page-352 #stay-plan-card-4 h3,
body.elementor-page-352 #stay-plan-card-5 h3,body.elementor-page-352 #stay-plan-card-6 h3,body.elementor-page-352 #stay-plan-card-7 h3,body.elementor-page-352 #stay-plan-card-8 h3{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:20px;line-height:27px;letter-spacing:3px;
text-transform:uppercase;color:#097173;margin:0;text-align:center;max-width:262px;text-wrap:balance;
}
body.elementor-page-352 #stay-plan-body-1,body.elementor-page-352 #stay-plan-body-2,body.elementor-page-352 #stay-plan-body-3,body.elementor-page-352 #stay-plan-body-4,
body.elementor-page-352 #stay-plan-body-5,body.elementor-page-352 #stay-plan-body-6,body.elementor-page-352 #stay-plan-body-7,body.elementor-page-352 #stay-plan-body-8{
font-family:nunito,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:22px;color:#000000;
margin:13px 0 0 0;text-align:center;max-width:242px;
}
/* the card button: Figma 142 x 37 with a 7.9px label, set at the legible 11px
   (Experience's pattern); the kit's chevron stays; an invisible ::after gives
   the 37px box a 44px touch target */
body.elementor-page-352 .stay-btn{margin-top:24px;}
body.elementor-page-352 .stay-btn .elementor-button{
width:auto!important;min-width:142px!important;max-width:none!important;
height:37px;min-height:0;padding:0 33px 0 23px!important;
background-color:#126472!important;border:none!important;border-radius:3px!important;
font-family:nexa,Helvetica,Arial,sans-serif!important;font-weight:700!important;
font-size:11px!important;letter-spacing:1.65px!important;text-transform:uppercase!important;
line-height:1.2!important;color:#FFFFFF!important;text-align:left;
display:inline-flex!important;align-items:center;justify-content:flex-start;
background-position:right 16px center!important;background-repeat:no-repeat!important;
position:relative;transition:background-color .2s ease;scroll-margin-top:110px;
}
body.elementor-page-352 .stay-btn .elementor-button:hover{background-color:#097173!important;}
/* the two-line phone-number button (card 3) grows with its text: at 320 the
   37px box clipped the third line */
body.elementor-page-352 .stay-btn-wide .elementor-button{height:auto;min-height:37px;padding-top:6px!important;padding-bottom:6px!important;line-height:1.25!important;}
body.elementor-page-352 .stay-btn .elementor-button::after{
content:'';position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);
height:44px;border:none!important;background:none!important;
}
/* cards fade as they slide under the header.  view() timelines: Chrome, Edge,
   Safari 26; Firefox simply scrolls the cards un-faded. */
@keyframes stay-card-out{from{opacity:1;}to{opacity:0;}}
@supports (animation-timeline:view()){
@media(min-width:1025px) and (prefers-reduced-motion:no-preference){
body.elementor-page-352 #stay-plan-card-1,body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-3,body.elementor-page-352 #stay-plan-card-4,
body.elementor-page-352 #stay-plan-card-5,body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-7,body.elementor-page-352 #stay-plan-card-8{
animation:stay-card-out linear both;animation-timeline:view(block 84px 0px);animation-range:exit 0% exit 85%;
}
}
}
/* one card column between 1025 and 1259: two 313px cards on the vw columns
   would collide there (at 1240 the even column lands 28px inside the odd one) */
@media(min-width:1025px) and (max-width:1259px){
body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-4,body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-8{margin-left:6.956vw;}
body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-3,body.elementor-page-352 #stay-plan-card-4,body.elementor-page-352 #stay-plan-card-5,
body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-7,body.elementor-page-352 #stay-plan-card-8{margin-top:60px;}
}
/* ≤1024 and reduced motion: no pin, no fade.  Panel in flow (photo, then copy),
   cards in one column on WHITE (cream cards on the cream field had too little
   contrast - Christian), which fades into the FAQ's cream under the last card. */
@media(max-width:1024px){
body.elementor-page-352 #stay-plan{margin-top:0;background:#FFFFFF;}
body.elementor-page-352 #stay-plan-panel{position:relative;top:auto;height:auto;background:none;}
body.elementor-page-352 #stay-plan-panel::after{display:none;}
body.elementor-page-352 #stay-plan::after{content:'';position:absolute;left:0;right:0;bottom:0;height:220px;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(247,244,239,0),#F7F4EF);}
body.elementor-page-352 #stay-plan-texture{display:none;}
body.elementor-page-352 #stay-plan-photo{position:relative;width:100%;height:clamp(300px,42vw,430px);max-height:none;-webkit-mask-image:none!important;mask-image:none!important;}
body.elementor-page-352 #stay-plan-photo::after{display:none;}
body.elementor-page-352 #stay-plan-copy{padding:30px 30px 40px 30px;}
body.elementor-page-352 #stay-plan h2{font-size:36px;line-height:38px;text-wrap:balance;}
body.elementor-page-352 #stay-plan-body{max-width:min(100%,540px);}
body.elementor-page-352 #stay-plan-links a{min-height:44px;}
body.elementor-page-352 #stay-plan-contact a{padding:13px 0;margin:-13px 0;}
body.elementor-page-352 #stay-plan-cards{margin:30px 0 0 0;padding:0 30px 56px 30px;display:flex;flex-direction:column;align-items:center;gap:60px;}
body.elementor-page-352 #stay-plan-card-1,body.elementor-page-352 #stay-plan-card-2,body.elementor-page-352 #stay-plan-card-3,body.elementor-page-352 #stay-plan-card-4,
body.elementor-page-352 #stay-plan-card-5,body.elementor-page-352 #stay-plan-card-6,body.elementor-page-352 #stay-plan-card-7,body.elementor-page-352 #stay-plan-card-8{
margin:0!important;width:min(100%,400px);box-shadow:3px 4px 14px rgba(0,0,0,.10);
}
}
@media(max-width:767px){
body.elementor-page-352 #stay-plan h2{font-size:32px;line-height:34px;}
body.elementor-page-352 #stay-plan-cards{padding:0 30px 56px 30px;gap:56px;}
}
@media(prefers-reduced-motion:reduce){
body.elementor-page-352 #stay-plan-panel{position:relative;top:auto;height:auto;min-height:47.027vw;}
body.elementor-page-352 #stay-plan-cards{margin-top:40px;}
body.elementor-page-352 .stay-btn .elementor-button,body.elementor-page-352 #stay-plan-links a{transition:none!important;}
}

/* ===== 5. Questions About Your Stay =====
   Golf's FAQ section (template 3318) with new copy.  Its flat panel is
   Figma's shape here (the design's top edge is straight; the domed bottom is
   the CTA's curve divider).  The template's own background stays (#F7F5EF
   under the "Background-gradient" image, as on Golf): the Plan panel fades
   into that cream and the CTA's divider (#FAF6F2) is cut from it.  It starts
   where the card column ends. */
body.elementor-page-352 #stay-faq{position:relative;z-index:1;margin-top:0;}
body.elementor-page-352 #stay-faq h2{margin:0;}

/* ===== 6. Make Your Way To Palmilla Beach. =====
   Golf's CTA (template 3320) as it ships: curve divider (Figma's dome is 76px
   against the divider's 80), white inner background, 100/120 padding.  The
   banner component keeps its beach-* ids; the gradient is Pools' deepened one
   (measured 4.18:1 for the label under the stock one). */
body.elementor-page-352 #stay-cta{position:relative;z-index:1;}
body.elementor-page-352 #beach-banner-1::after,body.elementor-page-352 #beach-banner-2::after{background:linear-gradient(0deg,rgba(0,0,0,.70),rgba(0,0,0,.10) 68%);}
body.elementor-page-352 #beach-banner-1:hover::after,body.elementor-page-352 #beach-banner-2:hover::after,body.elementor-page-352 #beach-banner-1:focus-within::after,body.elementor-page-352 #beach-banner-2:focus-within::after{background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.18) 74%);}
body.elementor-page-352 #stay-cta h2{text-align:center;margin:0!important;line-height:42px!important;letter-spacing:1.26px;}
body.elementor-page-352 #beach-explore{margin-top:58px;}
/* Figma sets a chevron after each label */
body.elementor-page-352 #beach-banner-1 h3::after,
body.elementor-page-352 #beach-banner-2 h3::after{
content:'';display:inline-block;width:.6em;height:.6em;margin-left:.9em;vertical-align:.08em;
border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);
}
@media(max-width:1024px){
body.elementor-page-352 #stay-cta h2{font-size:36px!important;line-height:38px!important;text-wrap:balance;}
}
@media(max-width:767px){
body.elementor-page-352 #stay-cta h2{font-size:32px!important;line-height:34px!important;}
}

/* ===== a11y ===== */
body.elementor-page-352 a:focus-visible,
body.elementor-page-352 .elementor-button:focus-visible{outline:3px solid #097173;outline-offset:3px;border-radius:3px;}
@media(prefers-reduced-motion:reduce){
body.elementor-page-352 #stay-hero-cta .elementor-button{transition:none!important;}
}/* End custom CSS */