.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:10px;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-10px;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-4046 .elementor-element.elementor-element-3235447 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-4046 .elementor-element.elementor-element-3235447 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-4046 .elementor-element.elementor-element-3235447 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-type-html{padding-bottom:0px;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group .elementor-field{color:#000000;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#F8FBFF;border-color:#1B5597;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group .elementor-select-wrapper select{background-color:#F8FBFF;border-color:#1B5597;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-field-group .elementor-select-wrapper::before{color:#1B5597;}.elementor-4046 .elementor-element.elementor-element-3235447 .e-form__buttons__wrapper__button-next{background-color:#06163B;color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-button[type="submit"]{background-color:#06163B;color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-4046 .elementor-element.elementor-element-3235447 .elementor-message.elementor-message-success{color:#05311C;}.elementor-4046 .elementor-element.elementor-element-3235447{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-8bcc57d *//* ==========================================================
WHITE MAKUTI
BOOKING-STYLE GALLERY
COMPLETE UPDATED CSS
========================================================== */

/* ==========================================================
GALLERY WRAPPER
========================================================== */

.wm-booking-gallery{

    width:100%;

    margin:0 auto 38px;

}

/* ==========================================================
MAIN PREVIEW COLLAGE — DESKTOP
========================================================== */

.wm-booking-gallery-preview{

    display:grid;

    grid-template-columns:
        minmax(0,1.35fr)
        minmax(0,.65fr)
        minmax(0,.65fr)
        minmax(0,1fr);

    grid-template-rows:
        minmax(0,250px)
        minmax(0,250px);

    gap:7px;

    width:100%;

    overflow:hidden;

    border-radius:28px;

    background:#ffffff;

    box-shadow:
        0 24px 65px rgba(15,76,129,.10),
        0 10px 30px rgba(0,0,0,.06);

}

/* ==========================================================
COMMON PREVIEW ITEM
========================================================== */

.wm-booking-gallery-preview-item{

    position:relative;

    display:block;

    width:100%;

    height:100%;

    min-width:0;

    min-height:0;

    padding:0;

    margin:0;

    border:0;

    overflow:hidden;

    background:#EAF0F6;

    cursor:pointer;

    appearance:none;

    -webkit-appearance:none;

}

/* ==========================================================
DESKTOP GRID POSITIONS
========================================================== */

.wm-booking-gallery-main{

    grid-column:1 / 2;

    grid-row:1 / 3;

}

.wm-booking-gallery-secondary{

    grid-column:2 / 5;

    grid-row:1 / 2;

}

.wm-booking-gallery-preview-item:nth-child(3){

    grid-column:2 / 3;

    grid-row:2 / 3;

}

.wm-booking-gallery-preview-item:nth-child(4){

    grid-column:3 / 4;

    grid-row:2 / 3;

}

.wm-booking-gallery-more{

    grid-column:4 / 5;

    grid-row:2 / 3;

}

/* ==========================================================
PREVIEW IMAGES
========================================================== */

.wm-booking-gallery-preview-item img{

    display:block;

    width:100%;

    height:100%;

    max-width:none;

    object-fit:cover;

    object-position:center;

    transform:scale(1);

    backface-visibility:hidden;

    transition:
        transform .55s ease,
        filter .35s ease;

}

.wm-booking-gallery-preview-item:hover img{

    transform:scale(1.035);

    filter:brightness(.96);

}

.wm-booking-gallery-preview-item:focus-visible{

    z-index:5;

    outline:3px solid #2B7CC1;

    outline-offset:-3px;

}

/* ==========================================================
VIEW MORE PHOTOS OVERLAY
========================================================== */

.wm-booking-gallery-more-overlay{

    position:absolute;

    inset:0;

    z-index:1;

    background:
        linear-gradient(
            135deg,
            rgba(8,25,44,.48),
            rgba(8,25,44,.74)
        );

    transition:background .3s ease;

}

.wm-booking-gallery-more:hover
.wm-booking-gallery-more-overlay{

    background:
        linear-gradient(
            135deg,
            rgba(8,25,44,.58),
            rgba(8,25,44,.84)
        );

}

/*
This overrides any existing +1 or other number
without requiring another HTML change.
*/

.wm-booking-gallery-more-count{

    position:absolute;

    left:50%;

    top:50%;

    z-index:3;

    width:max-content;

    max-width:92%;

    transform:translate(-50%,-72%);

    color:#ffffff;

    font-size:0;

    line-height:1;

    text-align:center;

    text-shadow:0 4px 18px rgba(0,0,0,.38);

    pointer-events:none;

}

.wm-booking-gallery-more-count::before{

    content:"Alle";

    display:block;

    color:#ffffff;

    font-family:"Cormorant Garamond",serif;

    font-size:34px;

    font-weight:700;

    line-height:1;

}

/*
This overrides “View all photos”
and displays “More Photos”.
*/

.wm-booking-gallery-more-label{

    position:absolute;

    left:50%;

    top:50%;

    z-index:3;

    width:max-content;

    max-width:92%;

    transform:translate(-50%,18px);

    color:#ffffff;

    font-size:0;

    line-height:1.2;

    text-align:center;

    pointer-events:none;

}

.wm-booking-gallery-more-label::before{

    content:"Fotos ansehen";

    display:block;

    color:#ffffff;

    font-size:12px;

    font-weight:800;

    line-height:1.25;

    letter-spacing:.08em;

    text-align:center;

    text-transform:uppercase;

    text-shadow:0 3px 12px rgba(0,0,0,.38);

}

/* ==========================================================
PHOTO GRID MODAL
========================================================== */

.wm-booking-gallery-grid-modal{

    position:fixed;

    inset:0;

    z-index:2147483645;

    display:none;

    width:100vw;

    height:100vh;

    height:100dvh;

    overflow-y:auto;

    overscroll-behavior:contain;

    background:#ffffff;

    isolation:isolate;

}

.wm-booking-gallery-grid-modal.is-open{

    display:block !important;

}

.wm-booking-gallery-grid-panel{

    width:min(1200px,100%);

    min-height:100%;

    margin:0 auto;

    background:#ffffff;

}

/* ==========================================================
PHOTO GRID HEADER
========================================================== */

.wm-booking-gallery-grid-header{

    position:sticky;

    top:0;

    z-index:20;

    display:grid;

    grid-template-columns:58px 1fr 58px;

    align-items:center;

    min-height:82px;

    padding:0 24px;

    background:#184D8C;

    box-shadow:0 6px 22px rgba(0,0,0,.12);

}

.wm-booking-gallery-grid-header h2{

    margin:0;

    color:#ffffff;

    text-align:center;

    font-size:25px;

    font-weight:700;

}

/* ==========================================================
PHOTO GRID CLOSE BUTTON
========================================================== */

.wm-booking-gallery-grid-close{

    width:46px;

    height:46px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:0;

    border:1px solid rgba(255,255,255,.25);

    border-radius:50%;

    background:#123F73;

    color:#ffffff !important;

    font-size:31px;

    font-weight:300;

    line-height:1;

    cursor:pointer;

    box-shadow:0 10px 25px rgba(0,0,0,.18);

    appearance:none;

    -webkit-appearance:none;

    transition:
        background .3s ease,
        transform .3s ease,
        box-shadow .3s ease;

}

.wm-booking-gallery-grid-close:hover{

    background:#0D315A;

    color:#ffffff !important;

    transform:translateY(-2px);

    box-shadow:0 14px 30px rgba(0,0,0,.24);

}

.wm-booking-gallery-grid-close:focus-visible{

    outline:2px solid #ffffff;

    outline-offset:3px;

}

/* ==========================================================
COMPLETE PHOTO GRID
========================================================== */

.wm-booking-gallery-grid{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:14px;

    padding:22px;

}

.wm-booking-gallery-grid-item{

    position:relative;

    display:block;

    width:100%;

    aspect-ratio:4 / 3;

    padding:0;

    margin:0;

    border:0;

    overflow:hidden;

    border-radius:18px;

    background:#EDF2F7;

    cursor:pointer;

    appearance:none;

    -webkit-appearance:none;

}

.wm-booking-gallery-grid-item img{

    display:block;

    width:100%;

    height:100%;

    max-width:none;

    object-fit:cover;

    object-position:center;

    transition:
        transform .45s ease,
        filter .35s ease;

}

.wm-booking-gallery-grid-item:hover img{

    transform:scale(1.025);

    filter:brightness(.96);

}

.wm-booking-gallery-grid-item:focus-visible{

    outline:3px solid #2B7CC1;

    outline-offset:3px;

}

/* ==========================================================
FULLSCREEN VIEWER
========================================================== */

.wm-booking-gallery-viewer{

    position:fixed;

    inset:0;

    z-index:2147483647;

    display:none;

    grid-template-rows:auto minmax(0,1fr) auto;

    width:100vw;

    height:100vh;

    height:100dvh;

    overflow:hidden;

    background:#111315;

    color:#ffffff;

    overscroll-behavior:contain;

    isolation:isolate;

}

.wm-booking-gallery-viewer.is-open{

    display:grid !important;

}

/* ==========================================================
FULLSCREEN TOOLBAR
========================================================== */

.wm-booking-gallery-viewer-toolbar{

    position:relative;

    z-index:10;

    display:flex;

    align-items:center;

    justify-content:flex-end;

    min-height:82px;

    padding:16px 24px;

    background:#111315;

}

/* ==========================================================
FULLSCREEN CLOSE BUTTON
========================================================== */

.wm-booking-gallery-viewer-close{

    width:48px;

    height:48px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:0;

    border:1px solid rgba(255,255,255,.24);

    border-radius:50%;

    background:#184D8C;

    color:#ffffff !important;

    font-size:32px;

    font-weight:300;

    line-height:1;

    cursor:pointer;

    box-shadow:0 12px 30px rgba(0,0,0,.30);

    appearance:none;

    -webkit-appearance:none;

    transition:
        background .3s ease,
        transform .3s ease,
        box-shadow .3s ease;

}

.wm-booking-gallery-viewer-close:hover{

    background:#123D70;

    color:#ffffff !important;

    transform:translateY(-2px);

    box-shadow:0 16px 36px rgba(0,0,0,.34);

}

.wm-booking-gallery-viewer-close:focus-visible{

    outline:2px solid #ffffff;

    outline-offset:3px;

}

/* ==========================================================
FULLSCREEN IMAGE STAGE
========================================================== */

.wm-booking-gallery-viewer-stage{

    min-width:0;

    min-height:0;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:10px 70px;

    overflow:hidden;

    background:#111315;

}

.wm-booking-gallery-viewer-image{

    display:block;

    width:auto;

    height:auto;

    max-width:100%;

    max-height:calc(100vh - 190px);

    max-height:calc(100dvh - 190px);

    object-fit:contain;

    object-position:center;

    user-select:none;

    -webkit-user-drag:none;

}

/* ==========================================================
FULLSCREEN FOOTER
========================================================== */

.wm-booking-gallery-viewer-footer{

    position:relative;

    z-index:10;

    display:grid;

    grid-template-columns:70px 1fr 70px;

    align-items:center;

    width:min(620px,100%);

    margin:0 auto;

    padding:18px 24px 24px;

    background:#111315;

}

.wm-booking-gallery-viewer-arrow{

    width:52px;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:0;

    border:1px solid rgba(255,255,255,.20);

    border-radius:50%;

    background:#184D8C;

    color:#ffffff !important;

    font-size:38px;

    font-weight:300;

    line-height:1;

    cursor:pointer;

    box-shadow:0 10px 28px rgba(0,0,0,.28);

    appearance:none;

    -webkit-appearance:none;

    transition:
        background .3s ease,
        transform .3s ease,
        box-shadow .3s ease;

}

.wm-booking-gallery-viewer-arrow:hover{

    background:#123D70;

    color:#ffffff !important;

    transform:scale(1.05);

    box-shadow:0 14px 34px rgba(0,0,0,.30);

}

.wm-booking-gallery-viewer-arrow:focus-visible{

    outline:2px solid #ffffff;

    outline-offset:3px;

}

.wm-booking-gallery-viewer-prev{

    justify-self:start;

}

.wm-booking-gallery-viewer-next{

    justify-self:end;

}

.wm-booking-gallery-viewer-counter{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    color:#ffffff;

    font-size:18px;

    font-weight:700;

    letter-spacing:.06em;

}

/* ==========================================================
PAGE LOCK WHILE GALLERY IS OPEN
========================================================== */

html.wm-booking-gallery-lock,
body.wm-booking-gallery-lock{

    overflow:hidden !important;

}

/* ==========================================================
HIDE WHATSAPP ONLY WHILE GALLERY IS OPEN
========================================================== */

/*
The JavaScript adds wm-booking-gallery-lock to the body
while the photo grid or fullscreen viewer is open.

These rules hide common WhatsApp widgets only during that time.
The widget returns automatically after closing the gallery.
*/

body.wm-booking-gallery-lock .joinchat,
body.wm-booking-gallery-lock .joinchat__button,
body.wm-booking-gallery-lock .joinchat__box,
body.wm-booking-gallery-lock .ht-ctc,
body.wm-booking-gallery-lock .ht-ctc-chat,
body.wm-booking-gallery-lock .ctc-analytics,
body.wm-booking-gallery-lock .floating-wpp,
body.wm-booking-gallery-lock .floating-wpp-button,
body.wm-booking-gallery-lock .whatsapp-floating,
body.wm-booking-gallery-lock .wm-whatsapp,
body.wm-booking-gallery-lock .wm-whatsapp-widget,
body.wm-booking-gallery-lock .wm-whatsapp-button,
body.wm-booking-gallery-lock .wm-whatsapp-float,
body.wm-booking-gallery-lock .wm-wa-widget,
body.wm-booking-gallery-lock .wm-wa-button,
body.wm-booking-gallery-lock [class*="whatsapp"],
body.wm-booking-gallery-lock [class*="WhatsApp"],
body.wm-booking-gallery-lock [class*="joinchat"],
body.wm-booking-gallery-lock [class*="floating-wpp"],
body.wm-booking-gallery-lock [id*="whatsapp"],
body.wm-booking-gallery-lock [id*="WhatsApp"],
body.wm-booking-gallery-lock a[href*="wa.me"],
body.wm-booking-gallery-lock a[href*="api.whatsapp.com"],
body.wm-booking-gallery-lock iframe[src*="whatsapp"]{

    display:none !important;

    opacity:0 !important;

    visibility:hidden !important;

    pointer-events:none !important;

}

/* ==========================================================
TABLET
========================================================== */

@media(max-width:991px){

.wm-booking-gallery-preview{

    grid-template-rows:
        minmax(0,220px)
        minmax(0,220px);

    border-radius:24px;

}

.wm-booking-gallery-more-count::before{

    font-size:30px;

}

.wm-booking-gallery-more-label::before{

    font-size:11px;

}

.wm-booking-gallery-grid{

    gap:10px;

    padding:16px;

}

.wm-booking-gallery-grid-item{

    border-radius:14px;

}

.wm-booking-gallery-viewer-stage{

    padding-left:36px;

    padding-right:36px;

}

}

/* ==========================================================
MOBILE
========================================================== */

@media(max-width:768px){

.wm-booking-gallery{

    margin-bottom:30px;

}

/* ==========================================================
MOBILE PREVIEW COLLAGE
========================================================== */

.wm-booking-gallery-preview{

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr);

    grid-template-rows:
        minmax(0,300px)
        minmax(0,125px);

    gap:5px;

    border-radius:22px;

}

.wm-booking-gallery-main{

    grid-column:1 / 3;

    grid-row:1 / 2;

}

.wm-booking-gallery-secondary{

    grid-column:1 / 2;

    grid-row:2 / 3;

}

.wm-booking-gallery-preview-item:nth-child(3),
.wm-booking-gallery-preview-item:nth-child(4){

    display:none;

    grid-column:auto;

    grid-row:auto;

}

.wm-booking-gallery-small{

    display:none;

}

.wm-booking-gallery-more{

    display:block;

    grid-column:2 / 3;

    grid-row:2 / 3;

}

.wm-booking-gallery-more-count{

    transform:translate(-50%,-70%);

}

.wm-booking-gallery-more-count::before{

    font-size:26px;

}

.wm-booking-gallery-more-label{

    transform:translate(-50%,14px);

}

.wm-booking-gallery-more-label::before{

    font-size:9px;

    letter-spacing:.05em;

}

/* ==========================================================
MOBILE PHOTO GRID HEADER
========================================================== */

.wm-booking-gallery-grid-header{

    min-height:72px;

    padding:0 14px;

    grid-template-columns:50px 1fr 50px;

}

.wm-booking-gallery-grid-header h2{

    font-size:21px;

}

.wm-booking-gallery-grid-close{

    width:42px;

    height:42px;

    font-size:29px;

}

/* ==========================================================
MOBILE PHOTO GRID
========================================================== */

.wm-booking-gallery-grid{

    gap:7px;

    padding:10px;

}

.wm-booking-gallery-grid-item{

    border-radius:8px;

    aspect-ratio:3 / 4;

}

/* ==========================================================
MOBILE FULLSCREEN VIEWER
========================================================== */

.wm-booking-gallery-viewer-toolbar{

    min-height:68px;

    padding:10px 14px;

}

.wm-booking-gallery-viewer-close{

    width:44px;

    height:44px;

    font-size:30px;

}

.wm-booking-gallery-viewer-stage{

    padding:8px 0;

}

.wm-booking-gallery-viewer-image{

    width:100%;

    height:auto;

    max-width:100%;

    max-height:calc(100vh - 170px);

    max-height:calc(100dvh - 170px);

}

.wm-booking-gallery-viewer-footer{

    grid-template-columns:58px 1fr 58px;

    padding:14px 18px 20px;

}

.wm-booking-gallery-viewer-arrow{

    width:46px;

    height:46px;

    font-size:34px;

}

.wm-booking-gallery-viewer-counter{

    font-size:17px;

}

/* Extra-force WhatsApp hiding on mobile */

body.wm-booking-gallery-lock [class*="whatsapp"],
body.wm-booking-gallery-lock [class*="WhatsApp"],
body.wm-booking-gallery-lock [id*="whatsapp"],
body.wm-booking-gallery-lock [id*="WhatsApp"],
body.wm-booking-gallery-lock a[href*="wa.me"],
body.wm-booking-gallery-lock a[href*="api.whatsapp.com"]{

    display:none !important;

}

}

/* ==========================================================
SMALL PHONES
========================================================== */

@media(max-width:480px){

.wm-booking-gallery-preview{

    grid-template-rows:
        minmax(0,265px)
        minmax(0,105px);

    border-radius:18px;

}

.wm-booking-gallery-more-count::before{

    font-size:23px;

}

.wm-booking-gallery-more-label::before{

    font-size:8px;

}

.wm-booking-gallery-grid{

    gap:5px;

    padding:7px;

}

}
/* ==========================================================
WHITE MAKUTI
ROOM DETAILS
PART 2 - DESKTOP CSS
========================================================== */

.wm-room-details{

    background:#F8FAFC;

    padding:90px 35px;

}

.wm-room-wrapper{

    max-width:1200px;

    margin:auto;

}

/* ==========================================================
HEADER
========================================================== */

.wm-room-heading{

    text-align:center;

    margin-bottom:55px;

}

.wm-room-category{

    display:inline-block;

    font-size:13px;

    letter-spacing:.35em;

    text-transform:uppercase;

    color:#C19A5B;

    font-weight:700;

    margin-bottom:18px;

}

.wm-room-heading h1{

    font-family:"Cormorant Garamond",serif;

    font-size:58px;

    color:#184D8C;

    font-weight:700;

    line-height:1.08;

    margin-bottom:25px;

}

.wm-room-meta{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:60px;

}

/* Reviews */

.wm-room-rating{

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:8px;

}

.wm-review-label{

    font-size:13px;

    letter-spacing:.15em;

    text-transform:uppercase;

    color:#777;

}

.wm-rating-row{

    display:flex;

    align-items:center;

    gap:10px;

}

.wm-stars{

    color:#F4B400;

    letter-spacing:3px;

    font-size:18px;

}

.wm-rating-score{

    color:#184D8C;

    font-weight:700;

    font-size:20px;

}

.wm-rating-count{

    color:#777;

    font-size:17px;

}

/* Guests */

.wm-room-guests{

    display:flex;

    align-items:center;

    gap:14px;

}

.wm-guest-icon{

    font-size:28px;

}

.wm-room-guests strong{

    color:#184D8C;

    font-size:20px;

}

/* ==========================================================
SLIDER
========================================================== */

.wm-slider{

    overflow:hidden;

    border-radius:26px;

    background:#fff;

    box-shadow:0 18px 50px rgba(0,0,0,.08);

}

.wm-slider-track{

    display:flex;

    overflow-x:auto;

    scroll-behavior:smooth;

    scroll-snap-type:x mandatory;

    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;

}

.wm-slider-track::-webkit-scrollbar{

    display:none;

}

.wm-slider-track img{

    flex:0 0 100%;

    width:100%;

    height:720px;

    object-fit:cover;

    scroll-snap-align:start;

}

/* ==========================================================
DOTS
========================================================== */

.wm-slider-dots{

    display:flex;

    justify-content:center;

    gap:12px;

    margin:30px 0 60px;

}

.wm-slider-dots span{

    width:12px;

    height:12px;

    border-radius:50%;

    background:#D6DFEC;

    cursor:pointer;

    transition:.35s;

}

.wm-slider-dots span.active{

    width:34px;

    border-radius:30px;

    background:#184D8C;

}

/* ==========================================================
PRICE CARD
========================================================== */

.wm-room-booking{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:40px;

    background:#fff;

    padding:40px 50px;

    border-radius:26px;

    box-shadow:0 15px 45px rgba(0,0,0,.08);

    margin-bottom:90px;

}

.wm-price-label{

    display:block;

    color:#888;

    font-size:17px;

    margin-bottom:10px;

}

.wm-price-line{

    display:flex;

    align-items:flex-end;

    gap:10px;

}

.wm-currency{

    font-size:34px;

    font-weight:700;

    color:#184D8C;

}

.wm-price{

    font-family:"Cormorant Garamond",serif;

    font-size:82px;

    line-height:1;

    color:#184D8C;

    font-weight:700;

}

.wm-night{

    margin-bottom:10px;

    color:#666;

    font-size:22px;

}

/* Button */

.wm-book-btn{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    min-width:230px;

    height:64px;

    border-radius:60px;

    text-decoration:none;

    background:#184D8C;

    color:#fff;

    font-size:18px;

    font-weight:600;

    transition:.35s;

}

.wm-book-btn:hover{

    background:#123C70;

    transform:translateY(-3px);

}

/* ==========================================================
ABOUT
========================================================== */

.wm-room-about{

    max-width:850px;

    margin:auto;

    text-align:center;

}

.wm-room-label{

    display:inline-block;

    margin-bottom:20px;

    color:#C19A5B;

    font-size:13px;

    font-weight:700;

    letter-spacing:.3em;

    text-transform:uppercase;

}

.wm-room-about h2{

    font-family:"Cormorant Garamond",serif;

    font-size:48px;

    color:#184D8C;

    margin-bottom:28px;

}

.wm-room-about p{

    color:#666;

    line-height:1.9;

    font-size:18px;

    margin-bottom:22px;

}
/* ==========================================================
WHITE MAKUTI
PART 3
TABLET + MOBILE
========================================================== */

/* ==========================================================
TABLET
========================================================== */

@media (max-width:991px){

.wm-room-details{

    padding:70px 28px;

}

.wm-room-heading h1{

    font-size:46px;

}

.wm-room-meta{

    gap:35px;

}

.wm-slider-track img{

    height:560px;

}

.wm-room-booking{

    padding:35px;

}

.wm-price{

    font-size:64px;

}

.wm-currency{

    font-size:30px;

}

.wm-night{

    font-size:18px;

}

.wm-book-btn{

    min-width:190px;

}

.wm-room-about h2{

    font-size:40px;

}

}


/* ==========================================================
MOBILE
========================================================== */

@media (max-width:768px){

/* Section */

.wm-room-details{

    padding:45px 18px;

}

/* ===================================
Heading
=================================== */

.wm-room-heading{

    text-align:left;

    margin-bottom:30px;

}

.wm-room-category{

    font-size:11px;

    letter-spacing:.22em;

}

.wm-room-heading h1{

    font-size:36px;

    line-height:1.15;

    margin:15px 0 22px;

}

/* ===================================
Rating
=================================== */

.wm-room-meta{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:18px;

}

/* Reviews */

.wm-room-rating{

    align-items:flex-start;

}

.wm-review-label{

    font-size:12px;

    margin-bottom:4px;

}

.wm-rating-row{

    gap:8px;

}

.wm-stars{

    font-size:17px;

}

.wm-rating-score{

    font-size:18px;

}

.wm-rating-count{

    font-size:15px;

}

/* Guests */

.wm-room-guests{

    gap:10px;

}

.wm-room-guests strong{

    font-size:17px;

}

.wm-guest-icon{

    font-size:22px;

}

/* ===================================
Gallery
=================================== */

.wm-slider{

    border-radius:22px;

}

.wm-slider-track img{

    height:420px;

    border-radius:22px;

}

.wm-slider-dots{

    margin:22px 0 35px;

}

/* ===================================
Price Card
=================================== */

.wm-room-booking{

    display:block;

    padding:26px;

    border-radius:22px;

    margin-bottom:60px;

}

.wm-room-price{

    text-align:left;

    margin-bottom:25px;

}

.wm-price-label{

    font-size:15px;

}

.wm-price-line{

    gap:8px;

}

.wm-currency{

    font-size:26px;

}

.wm-price{

    font-size:56px;

}

.wm-night{

    font-size:17px;

    margin-bottom:7px;

}

/* Button */

.wm-book-btn{

    width:100%;

    min-width:100%;

    height:56px;

    border-radius:50px;

    font-size:17px;

}

/* ===================================
About
=================================== */

.wm-room-about{

    text-align:left;

}

.wm-room-label{

    font-size:11px;

}

.wm-room-about h2{

    font-size:34px;

    line-height:1.2;

}

.wm-room-about p{

    font-size:17px;

    line-height:1.8;

}

}


/* ==========================================================
SMALL PHONES
========================================================== */

@media (max-width:480px){

.wm-room-details{

    padding:38px 15px;

}

.wm-room-heading h1{

    font-size:31px;

}

.wm-slider-track img{

    height:340px;

}

.wm-price{

    font-size:48px;

}

.wm-currency{

    font-size:22px;

}

.wm-night{

    font-size:15px;

}

.wm-room-about h2{

    font-size:29px;

}

.wm-room-about p{

    font-size:16px;

}

}
/* ==========================================================
MOBILE HEADER
========================================================== */

@media (max-width:768px){

.wm-room-heading{

    text-align:left;

    margin-bottom:22px;

}

.wm-room-category{

    font-size:11px;

    letter-spacing:.25em;

    margin-bottom:12px;

}

.wm-room-heading h1{

    font-size:40px;

    line-height:1.1;

    margin:0 0 18px;

}

/* Rating & Guests on ONE row */

.wm-room-meta{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:15px;

    flex-wrap:wrap;

}

/* Reviews */

.wm-room-rating{

    display:flex;

    flex-direction:row;

    align-items:center;

    gap:8px;

}

.wm-review-label{

    display:none;

}

.wm-rating-row{

    display:flex;

    align-items:center;

    gap:6px;

}

.wm-stars{

    font-size:16px;

}

.wm-rating-score{

    font-size:18px;

}

.wm-rating-count{

    font-size:15px;

}

/* Guests */

.wm-room-guests{

    display:flex;

    align-items:center;

    gap:6px;

}

.wm-room-guests strong{

    font-size:16px;

}

.wm-guest-icon{

    font-size:18px;

}

}
/* ==========================================================
MOBILE HEADER
Centered
========================================================== */

@media (max-width:768px){

/* Heading */

.wm-room-heading{

    text-align:center;

    margin-bottom:28px;

}

/* Family Apartment */

.wm-room-category{

    display:block;

    font-size:12px;

    letter-spacing:.28em;

    color:#C19A5B;

    font-weight:700;

    margin-bottom:18px;

}

/* Title */

.wm-room-heading h1{

    font-family:"Cormorant Garamond",serif;

    font-size:44px;

    line-height:1.1;

    color:#184D8C;

    margin-bottom:20px;

}

/* Rating & Guests */

.wm-room-meta{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:12px;

}

/* Reviews */

.wm-room-rating{

    display:flex;

    flex-direction:row;

    align-items:center;

    justify-content:center;

    gap:8px;

}

.wm-review-label{

    display:none;

}

.wm-stars{

    color:#F4B400;

    font-size:17px;

}

.wm-rating-score{

    font-size:18px;

    font-weight:700;

    color:#184D8C;

}

.wm-rating-count{

    font-size:16px;

    color:#777;

}

/* Guests */

.wm-room-guests{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

}

.wm-guest-icon{

    font-size:20px;

}

.wm-room-guests strong{

    font-size:18px;

    color:#184D8C;

}

/* Gallery */

.wm-slider{

    margin-top:28px;

}

}
/* ===================================
BOOK NOW BUTTON
=================================== */

.wm-book-btn{

    display:flex;

    justify-content:center;

    align-items:center;

    width:100%;

    height:60px;

    background:#184D8C;

    color:#FFFFFF !important;

    text-decoration:none !important;

    font-size:20px;

    font-weight:600;

    border-radius:50px;

    transition:.3s;

    border:none;

}

.wm-book-btn:hover{

    background:#123D70;

    color:#FFFFFF !important;

}

.wm-book-btn:visited,
.wm-book-btn:focus,
.wm-book-btn:active{

    color:#FFFFFF !important;

    text-decoration:none;

}
/* ==========================================================
WHITE MAKUTI
MINIMAL PREMIUM PRICE CARD
========================================================== */


.wm-room-booking{


display:flex;

align-items:center;

justify-content:space-between;


padding:28px 35px;


margin-top:40px;


background:#ffffff;


border-radius:24px;


border:1px solid #E7EEF5;


box-shadow:

0 15px 40px rgba(15,76,129,.10);



}




/* PRICE */


.wm-price-box{


display:flex;

flex-direction:column;


}





.wm-price-label{


font-size:13px;


text-transform:uppercase;


letter-spacing:1.5px;


color:#8193A5;


margin-bottom:8px;


}




.wm-price-line{


display:flex;


align-items:baseline;


gap:8px;


}




.wm-currency{


font-size:22px;


font-weight:700;


color:#0F4C81;


}



.wm-price{


font-family:Georgia,serif;


font-size:54px;


font-weight:700;


line-height:1;


letter-spacing:-1px;


color:#1E5595;


}



.wm-night{


font-size:17px;


color:#65788A;


}





/* BUTTON */


.wm-book-btn{


padding:16px 55px;


border-radius:999px;


background:#0F4C81;


color:#ffffff!important;


font-size:15px;


font-weight:700;


text-decoration:none;


transition:.3s ease;


box-shadow:

0 10px 25px rgba(15,76,129,.20);



}




.wm-book-btn:hover{


background:#174F91;


transform:translateY(-3px);


}







/* MOBILE */


@media(max-width:768px){



.wm-room-booking{


padding:25px 22px;


gap:22px;


flex-direction:column;


align-items:stretch;


text-align:center;


}



.wm-price-line{


justify-content:center;


}



.wm-price{


font-size:46px;


}



.wm-currency{


font-size:20px;


}



.wm-night{


font-size:16px;


}



.wm-book-btn{


width:100%;


padding:16px;


}



}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-cfeaa72 *//* ==========================================================
WHITE MAKUTI
PREMIUM ROOM AMENITIES SHOWCASE
FULL RESPONSIVE CSS
========================================================== */


/* ==========================
SECTION
========================== */

.wm-amenity-showcase{

    padding:140px 0;

    background:#ffffff;

}


.wm-amenity-showcase-container{

    width:min(1200px,92%);

    margin:auto;

}



/* ==========================
HEADER
========================== */


.wm-amenity-showcase-header{

    max-width:720px;

    margin:0 auto 80px;

    text-align:center;

}



.wm-amenity-showcase-badge{

    display:inline-flex;

    padding:10px 25px;

    border-radius:999px;

    background:#EDF6FD;

    color:#0F4C81;

    font-size:12px;

    font-weight:700;

    letter-spacing:2px;

}



.wm-amenity-showcase-header h2{

    margin:28px 0 18px;

    font-size:clamp(42px,5vw,62px);

    line-height:1.1;

    color:#18364A;

}



.wm-amenity-showcase-header p{

    margin:auto;

    max-width:650px;

    color:#65788A;

    font-size:18px;

    line-height:1.8;

}





/* ==========================
DESKTOP GRID
========================== */


.wm-amenity-showcase-list{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:0 70px;

}



.wm-amenity-showcase-item{

    display:flex;

    align-items:flex-start;

    gap:28px;

    padding:45px 0;

    border-bottom:1px solid #E8EFF5;

    transition:.35s ease;

}



.wm-amenity-showcase-item:hover{

    transform:translateX(8px);

}



/* ICON */

.wm-amenity-showcase-icon{

    width:72px;

    height:72px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:24px;

    background:#EDF6FD;

    color:#0F4C81;

    font-size:28px;

}



/* TEXT */


.wm-amenity-showcase-content h3{

    margin:5px 0 12px;

    font-size:25px;

    color:#18364A;

}



.wm-amenity-showcase-content p{

    margin:0;

    color:#65788A;

    font-size:16px;

    line-height:1.8;

}





/* NOTE */


.wm-amenity-showcase-note{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:15px;

    margin-top:70px;

    color:#65788A;

}



.wm-amenity-showcase-note i{

    width:46px;

    height:46px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#EDF6FD;

    color:#0F4C81;

}



.wm-amenity-pagination{

    display:none;

}








/* ==========================================================
MOBILE VERSION
SWIPE CARDS
========================================================== */


@media(max-width:768px){


.wm-amenity-showcase{


    padding:90px 0;


}



.wm-amenity-showcase-header{


    margin-bottom:45px;


}



.wm-amenity-showcase-header h2{


    font-size:38px;


}



.wm-amenity-showcase-header p{


    font-size:16px;

    line-height:1.7;


}




/* SWIPE CONTAINER */


.wm-amenity-slider-wrapper{


    overflow:hidden;


}



.wm-amenity-showcase-list{


    display:flex;

    gap:18px;

    overflow-x:auto;

    scroll-snap-type:x mandatory;

    -webkit-overflow-scrolling:touch;

    padding:15px 5px 20px;


}



.wm-amenity-showcase-list::-webkit-scrollbar{

    display:none;

}



/* CARD */


.wm-amenity-showcase-item{


    min-width:88%;


    scroll-snap-align:center;


    display:flex;


    flex-direction:column;


    align-items:flex-start;


    gap:20px;


    padding:32px 28px;


    height:auto;


    min-height:0;


    border-radius:32px;


    background:#ffffff;


    border:1px solid rgba(15,76,129,.10);


    box-shadow:


    0 20px 55px rgba(15,76,129,.20);


    transform:none!important;


}



/* ICON TOP POSITION */


.wm-amenity-showcase-icon{


    width:68px;


    height:68px;


    border-radius:22px;


    font-size:26px;


    margin:0;


    background:#EDF6FD;


    color:#0F4C81;


    box-shadow:


    0 10px 25px rgba(15,76,129,.15);


}





/* TEXT BELOW */


.wm-amenity-showcase-content{


    width:100%;


}



.wm-amenity-showcase-content h3{


    margin:0 0 12px;


    font-size:24px;


    line-height:1.25;


}



.wm-amenity-showcase-content p{


    font-size:16px;


    line-height:1.7;


}




/* PAGINATION */


.wm-amenity-pagination{


    display:flex;


    justify-content:center;


    align-items:center;


    gap:9px;


    margin-top:25px;


}



.wm-amenity-pagination span{


    width:9px;


    height:9px;


    background:#D6E5F2;


    border-radius:50%;


    transition:.3s ease;


}



.wm-amenity-pagination span.active{


    width:28px;


    border-radius:20px;


    background:#0F4C81;


}




/* NOTE */


.wm-amenity-showcase-note{


    margin-top:45px;


    flex-direction:column;


    text-align:center;


    line-height:1.6;


}


}
/* ==========================================================
WHITE MAKUTI
AMENITY PREMIUM FLOWING BORDER ANIMATION
========================================================== */


/* ==========================================================
DESKTOP
TOP LINE ONLY
========================================================== */


@media(min-width:769px){


.wm-amenity-showcase-item{

    position:relative;

    overflow:hidden;

}



.wm-amenity-showcase-item::before{


    content:"";

    position:absolute;


    top:0;

    left:-50%;


    width:50%;

    height:3px;


    background:

    linear-gradient(
        90deg,
        transparent,
        #0F4C81,
        #62C5FF,
        transparent
    );


    animation:

    wmDesktopAmenityFlow 5s ease-in-out infinite;


}



@keyframes wmDesktopAmenityFlow{


    0%{

        left:-50%;

    }


    100%{

        left:120%;

    }


}


}








/* ==========================================================
MOBILE
ROUNDED TILE FOLLOWING BORDER FLOW
========================================================== */


@media(max-width:768px){



.wm-amenity-showcase-item{


    position:relative;

    overflow:hidden;

    border-radius:36px;

    isolation:isolate;


}





/* animated rounded border */


.wm-amenity-showcase-item::before{


    content:"";


    position:absolute;


    inset:-2px;


    border-radius:38px;



    background:

    conic-gradient(

        from 0deg,

        transparent 0deg,

        transparent 70deg,

        #0F4C81 120deg,

        #67C7FF 160deg,

        transparent 220deg,

        transparent 360deg

    );



    animation:

    wmMobileAmenityFlow 8s linear infinite;



    z-index:-2;


}





/* inner cover keeps card white */


.wm-amenity-showcase-item::after{


    content:"";


    position:absolute;


    inset:2px;


    border-radius:34px;


    background:

    linear-gradient(
        145deg,
        #ffffff,
        #F6FBFF
    );


    z-index:-1;


}





@keyframes wmMobileAmenityFlow{


    from{

        transform:rotate(0deg);

    }


    to{

        transform:rotate(360deg);

    }


}




/* content above animation */


.wm-amenity-showcase-icon,

.wm-amenity-showcase-content{


    position:relative;

    z-index:2;


}



}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1c2abd1 *//*==========================================================
WHITE MAKUTI
PREMIUM HOUSE RULES
==========================================================*/


.wm-house-rules{

    padding:150px 0;

    background:
    linear-gradient(
        180deg,
        #F7FBFE 0%,
        #FFFFFF 100%
    );

}


.wm-house-rules-container{

    width:min(1320px,92%);

    margin:auto;

}



/* HEADER */

.wm-house-rules-header{

    max-width:760px;

    margin:0 auto 85px;

    text-align:center;

}


.wm-house-rules-badge{

    display:inline-flex;

    padding:10px 26px;

    border-radius:999px;

    background:#EAF4FC;

    color:#0F4C81;

    font-size:12px;

    font-weight:700;

    letter-spacing:2px;

}



.wm-house-rules-header h2{

    margin:28px 0 22px;

    color:#18364A;

    font-size:clamp(42px,5vw,64px);

    line-height:1.1;

    letter-spacing:-1.5px;

}



.wm-house-rules-header p{

    margin:auto;

    max-width:650px;

    color:#65788A;

    font-size:17px;

    line-height:1.8;

}





/* GRID */


.wm-house-rules-grid{

    display:grid;

    grid-template-columns:
    repeat(5,1fr);

    gap:22px;

}





/* CARD */


.wm-house-rule-card{

    position:relative;

    min-height:270px;

    padding:34px 28px;


    background:

    linear-gradient(
        145deg,
        #FFFFFF,
        #F8FBFE
    );


    border-radius:30px;


    border:1px solid #E4EDF6;


    box-shadow:

    0 25px 70px rgba(15,76,129,.08);


    overflow:hidden;


    transition:.35s ease;

}



.wm-house-rule-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    height:4px;

    width:100%;


    background:

    linear-gradient(
        90deg,
        #0F4C81,
        #6BB9E8
    );

}




.wm-house-rule-card:hover{

    transform:translateY(-8px);


    box-shadow:

    0 40px 90px rgba(15,76,129,.16);

}





/* TOP */


.wm-house-rule-top{

    display:flex;

    align-items:center;

    gap:16px;

    margin-bottom:28px;

}





/* ICON */


.wm-house-rule-icon{

    width:58px;

    height:58px;


    flex-shrink:0;


    display:flex;

    align-items:center;

    justify-content:center;


    border-radius:18px;


    background:

    linear-gradient(
        135deg,
        #EDF6FD,
        #DCECF9
    );


    color:#0F4C81;

    font-size:23px;


}



.wm-house-rule-card:hover 
.wm-house-rule-icon{

    transform:scale(1.08);

}




/* TITLE */


.wm-house-rule-card h3{

    margin:0;

    color:#18364A;

    font-size:20px;

    line-height:1.3;

}





/* TEXT */


.wm-house-rule-card p{

    margin:0;

    color:#65788A;

    font-size:15px;

    line-height:1.8;

}





/* NOTE */


.wm-house-rules-note{


    display:flex;

    justify-content:center;

    align-items:center;

    gap:18px;


    max-width:700px;

    margin:70px auto 0;

    text-align:center;


}



.wm-house-rules-note-icon{

    width:48px;

    height:48px;


    display:flex;

    align-items:center;

    justify-content:center;


    border-radius:50%;


    background:#EAF4FC;


    color:#0F4C81;

}




.wm-house-rules-note p{

    margin:0;

    color:#65788A;

    font-size:16px;

    line-height:1.7;

}







/* TABLET */


@media(max-width:1100px){


.wm-house-rules-grid{

    grid-template-columns:
    repeat(3,1fr);

}


}






/* MOBILE */


@media(max-width:768px){



.wm-house-rules{

    padding:90px 0;

}



.wm-house-rules-header{

    margin-bottom:45px;

}



.wm-house-rules-header h2{

    font-size:38px;

}



.wm-house-rules-grid{

    grid-template-columns:1fr;

    gap:18px;

}




.wm-house-rule-card{

    min-height:auto;

    padding:26px;

    border-radius:24px;

}



.wm-house-rule-top{

    margin-bottom:20px;

}




.wm-house-rule-icon{

    width:54px;

    height:54px;

}



.wm-house-rule-card h3{

    font-size:19px;

}



.wm-house-rule-card p{

    font-size:15px;

}



.wm-house-rules-note{

    flex-direction:column;

    margin-top:45px;

}



}
/*==========================================================
WHITE MAKUTI
STRONG ICON BREATHING PULSE
==========================================================*/


.wm-house-rule-icon{

    position:relative;

    overflow:visible;

    z-index:1;

}



/* outer pulse ring */

.wm-house-rule-icon::after{

    content:"";

    position:absolute;


    top:50%;

    left:50%;


    width:100%;

    height:100%;


    transform:
    translate(-50%,-50%)
    scale(1);


    border-radius:20px;


    background:
    rgba(15,76,129,.28);


    box-shadow:
    0 0 0 0 rgba(15,76,129,.35);


    z-index:-1;


    animation:
    wmStrongIconPulse 2.2s ease-out infinite;

}




@keyframes wmStrongIconPulse{


    0%{

        transform:
        translate(-50%,-50%)
        scale(1);


        opacity:.65;


        box-shadow:
        0 0 0 0 rgba(15,76,129,.35);

    }



    50%{

        transform:
        translate(-50%,-50%)
        scale(1.45);


        opacity:.15;


        box-shadow:
        0 0 0 18px rgba(15,76,129,0);

    }



    100%{

        transform:
        translate(-50%,-50%)
        scale(1);


        opacity:.65;


        box-shadow:
        0 0 0 0 rgba(15,76,129,0);

    }

}



/* icon stays sharp */

.wm-house-rule-icon i{

    position:relative;

    z-index:3;

}



/* stagger */

.wm-house-rule-card:nth-child(1)
.wm-house-rule-icon::after{

    animation-delay:0s;

}


.wm-house-rule-card:nth-child(2)
.wm-house-rule-icon::after{

    animation-delay:.4s;

}


.wm-house-rule-card:nth-child(3)
.wm-house-rule-icon::after{

    animation-delay:.8s;

}


.wm-house-rule-card:nth-child(4)
.wm-house-rule-icon::after{

    animation-delay:1.2s;

}


.wm-house-rule-card:nth-child(5)
.wm-house-rule-icon::after{

    animation-delay:1.6s;

}
/* Desktop only */
@media (min-width:1200px){

    .wm-house-rules-grid{
        gap:14px;
    }

    .wm-house-rule-card{
        padding:34px 18px;
    }

    .wm-house-rule-top{
        gap:10px;
    }

    .wm-house-rule-icon{
        width:52px;
        height:52px;
        border-radius:16px;
        font-size:21px;
    }

    .wm-house-rule-card h3{
        font-size:19px;
    }

}
/* Desktop only */
.desktop-break{
    display:none;
}

@media (min-width:1200px){
    .desktop-break{
        display:block;
    }
}
/* Center the 4 House Rule cards on desktop */
@media (min-width: 1024px) {

    .wm-house-rules-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-dc28a76 *//* ==========================================================
WHITE MAKUTI
BOOKING PAGE
========================================================== */

.wm-booking-page {
    width: 100%;
    padding: 90px 24px 70px;
    background:
        linear-gradient(
            180deg,
            #f7fbfc 0%,
            #ffffff 100%
        );
}

.wm-booking-container {
    width: 100%;
    max-width: 1150px;
    margin: 0 auto;
}


/* ==========================================================
MAIN BOOKING HEADING
========================================================== */

.wm-booking-heading {
    max-width: 780px;
    margin: 0 auto 75px;
    text-align: center;
}

.wm-booking-label {
    display: inline-block;
    margin-bottom: 15px;
    color: #b78a48;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.wm-booking-heading h1 {
    margin: 0 0 20px;
    color: #073e48;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(42px, 6vw, 64px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -0.02em;
}

.wm-booking-heading p {
    max-width: 720px;
    margin: 0 auto;
    color: #68767c;
    font-size: 17px;
    line-height: 1.8;
}


/* ==========================================================
AVAILABLE APARTMENTS HEADING
========================================================== */

.wm-booking-rooms-title {
    max-width: 720px;
    margin: 0 auto 40px;
    text-align: center;
}

.wm-booking-rooms-title > span {
    display: inline-block;
    margin-bottom: 12px;
    color: #b78a48;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.wm-booking-rooms-title h2 {
    margin: 0 0 15px;
    color: #073e48;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(34px, 4vw, 46px);
    font-weight: 500;
    line-height: 1.16;
}

.wm-booking-rooms-title p {
    max-width: 650px;
    margin: 0 auto;
    color: #6e787d;
    font-size: 16px;
    line-height: 1.7;
}


/* ==========================================================
ROOM LIST
========================================================== */

.wm-booking-rooms-list {
    display: flex;
    flex-direction: column;
    gap: 28px;
}


/* ==========================================================
ROOM CARD
========================================================== */

.wm-booking-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 42px;
    width: 100%;
    padding: 38px 42px;
    background: #ffffff;
    border: 1px solid rgba(7, 62, 72, 0.11);
    border-radius: 24px;
    box-shadow:
        0 16px 40px rgba(11, 56, 65, 0.07);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.wm-booking-summary:hover {
    transform: translateY(-4px);
    border-color: rgba(183, 138, 72, 0.34);
    box-shadow:
        0 22px 55px rgba(11, 56, 65, 0.11);
}


/* ==========================================================
ROOM LEFT SIDE
========================================================== */

.wm-booking-summary-left {
    flex: 1;
    min-width: 280px;
}

.wm-apartment-label {
    display: block;
    margin-bottom: 12px;
    color: #b78a48;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.wm-booking-summary h3 {
    margin: 0 0 15px;
    color: #073e48;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(30px, 3vw, 42px);
    font-weight: 500;
    line-height: 1.18;
}

.wm-booking-rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    color: #263f45;
    font-size: 15px;
}

.wm-stars {
    color: #d5a044;
    letter-spacing: 2px;
}

.wm-rating-number {
    color: #073e48;
    font-weight: 700;
}

.wm-reviews {
    color: #7b878b;
}


/* ==========================================================
VIEW DETAILS BUTTON
========================================================== */

.wm-room-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 24px;
    padding: 13px 25px;
    background: #073e48;
    border: 1px solid #073e48;
    border-radius: 999px;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
    text-decoration: none !important;
    box-shadow:
        0 8px 18px rgba(7, 62, 72, 0.14);
    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.wm-room-btn:visited,
.wm-room-btn:focus,
.wm-room-btn:hover {
    color: #ffffff !important;
    text-decoration: none !important;
}

.wm-room-btn:hover {
    background: #0d5663;
    border-color: #0d5663;
    transform: translateY(-2px);
    box-shadow:
        0 12px 24px rgba(7, 62, 72, 0.2);
}

.wm-room-btn span {
    display: inline-block;
    transition: transform 0.25s ease;
}

.wm-room-btn:hover span {
    transform: translateX(4px);
}


/* ==========================================================
ROOM DETAILS
========================================================== */

.wm-booking-summary-details {
    display: flex;
    align-items: stretch;
    gap: 16px;
}

.wm-booking-detail {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 215px;
    padding: 19px 20px;
    background: #f2f7f8;
    border: 1px solid rgba(7, 62, 72, 0.04);
    border-radius: 16px;
}

.wm-detail-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    background: #ffffff;
    border-radius: 50%;
    font-size: 19px;
    box-shadow:
        0 5px 15px rgba(7, 62, 72, 0.08);
}

.wm-booking-detail small {
    display: block;
    margin-bottom: 4px;
    color: #7f8b90;
    font-size: 12px;
    font-weight: 500;
}

.wm-booking-detail strong {
    display: block;
    color: #073e48;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}


/* ==========================================================
BOOKING FORM INTRODUCTION
========================================================== */

.wm-form-intro {
    max-width: 770px;
    margin: 95px auto 40px;
    text-align: center;
}

.wm-form-intro::before {
    content: "";
    display: block;
    width: 72px;
    height: 2px;
    margin: 0 auto 35px;
    background: #b78a48;
    border-radius: 20px;
}

.wm-form-intro-label {
    display: inline-block;
    margin-bottom: 14px;
    padding: 8px 18px;
    background: #f4eedf;
    border-radius: 999px;
    color: #b78a48;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.wm-form-intro h2 {
    margin: 0 0 18px;
    color: #073e48;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(34px, 4vw, 48px);
    font-weight: 500;
    line-height: 1.16;
}

.wm-form-intro p {
    max-width: 670px;
    margin: 0 auto;
    color: #68767c;
    font-size: 16px;
    line-height: 1.8;
}


/* ==========================================================
TABLET
========================================================== */

@media (max-width: 980px) {

    .wm-booking-page {
        padding: 70px 22px 55px;
    }

    .wm-booking-heading {
        margin-bottom: 60px;
    }

    .wm-booking-summary {
        flex-direction: column;
        align-items: stretch;
        gap: 28px;
        padding: 34px;
    }

    .wm-booking-summary-left {
        min-width: 0;
    }

    .wm-booking-summary-details {
        width: 100%;
    }

    .wm-booking-detail {
        flex: 1;
        min-width: 0;
    }
}


/* ==========================================================
MOBILE
========================================================== */

@media (max-width: 650px) {

    .wm-booking-page {
        padding: 48px 16px 40px;
    }

    .wm-booking-heading {
        margin-bottom: 52px;
        text-align: left;
    }

    .wm-booking-label {
        font-size: 11px;
    }

    .wm-booking-heading h1 {
        font-size: 41px;
    }

    .wm-booking-heading p {
        font-size: 15px;
        line-height: 1.7;
    }

    .wm-booking-rooms-title {
        margin-bottom: 28px;
        text-align: left;
    }

    .wm-booking-rooms-title > span {
        font-size: 11px;
    }

    .wm-booking-rooms-title h2 {
        font-size: 33px;
    }

    .wm-booking-rooms-title p {
        font-size: 15px;
    }

    .wm-booking-rooms-list {
        gap: 20px;
    }

    .wm-booking-summary {
        gap: 24px;
        padding: 24px 20px;
        border-radius: 18px;
    }

    .wm-booking-summary h3 {
        font-size: 29px;
    }

    .wm-booking-rating {
        font-size: 14px;
    }

    .wm-stars {
        letter-spacing: 1px;
    }

    .wm-room-btn {
        width: 100%;
        margin-top: 21px;
        padding: 14px 20px;
    }

    .wm-booking-summary-details {
        flex-direction: column;
        gap: 12px;
    }

    .wm-booking-detail {
        width: 100%;
        padding: 16px;
    }

    .wm-form-intro {
        margin: 65px auto 32px;
        text-align: left;
    }

    .wm-form-intro::before {
        margin: 0 0 26px;
    }

    .wm-form-intro h2 {
        font-size: 33px;
    }

    .wm-form-intro p {
        font-size: 15px;
        line-height: 1.7;
    }
}
.wm-room-list-label {
    margin: 0 0 24px;
    color: #b78a48;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-align: center;
    text-transform: uppercase;
}

@media (max-width: 650px) {

    .wm-room-list-label {
        margin-bottom: 18px;
        text-align: left;
        font-size: 11px;
    }
}
.wm-booking-page{

    padding:20px 20px 80px;

}/* End custom CSS */
/* Start custom CSS for form, class: .elementor-element-3235447 *//* Hide all Elementor form labels */
.elementor-form .elementor-field-label {
    display: none;
}

/* Show labels only for date fields */
.elementor-form .elementor-field-type-date .elementor-field-label {
    display: block !important;
    margin-bottom: 8px;
    color: #073e48;
    font-size: 14px;
    font-weight: 600;
}

/* Mobile date fields */
@media (max-width: 767px) {

    .elementor-form input[type="date"] {
        min-height: 50px;
        font-size: 16px;
        color: #5f6870;
        background: #f6f9fc;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8c18d08 *//* ==========================================================
WHITE MAKUTI
OTHER APARTMENT PREVIEW
Premium Luxury Version
========================================================== */

.wm-other-room-section{

    padding:110px 30px;

    background:#F7F9FC;

    overflow:hidden;

}

.wm-other-room-container{

    max-width:1280px;

    margin:auto;

}

/* ==========================================================
Heading
========================================================== */

.wm-other-room-heading{

    text-align:center;

    max-width:760px;

    margin:0 auto 70px;

}

.wm-other-room-label{

    display:inline-block;

    color:#1F4D8C;

    font-size:13px;

    font-weight:700;

    letter-spacing:4px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.wm-other-room-heading h2{

    font-size:52px;

    line-height:1.15;

    color:#173C73;

    margin-bottom:18px;

}

.wm-other-room-heading p{

    font-size:18px;

    line-height:1.9;

    color:#666;

}

/* ==========================================================
Card
========================================================== */

.wm-other-room-card{

    display:grid;

    grid-template-columns:430px minmax(0,1fr);

    align-items:center;

    gap:70px;

}

/* ==========================================================
Image
========================================================== */

.wm-other-room-image{

    display:flex;

    justify-content:center;

    align-items:center;

}

.wm-other-room-image img{

    width:100%;

    max-width:430px;

    aspect-ratio:4/5;

    object-fit:cover;

    object-position:center;

    border-radius:220px 220px 30px 30px;

    box-shadow:0 25px 55px rgba(0,0,0,.12);

    transition:.45s;

}

.wm-other-room-card:hover .wm-other-room-image img{

    transform:translateY(-6px);

}

/* ==========================================================
Content
========================================================== */

.wm-other-room-content{

    min-width:0;

    width:100%;

}

.wm-other-room-price{

    display:inline-block;

    padding:12px 22px;

    background:#EDF5FF;

    color:#1F4D8C;

    border-radius:50px;

    font-size:15px;

    font-weight:600;

    margin-bottom:24px;

}

.wm-other-room-content h3{

    font-size:clamp(38px,4vw,60px);

    line-height:1.1;

    color:#173C73;

    margin-bottom:22px;

    overflow-wrap:break-word;

}

.wm-other-room-rating{

    color:#F2A100;

    font-size:18px;

    margin-bottom:30px;

}

.wm-other-room-rating span{

    color:#666;

    margin-left:10px;

}

.wm-other-room-content p{

    max-width:640px;

    color:#666;

    font-size:18px;

    line-height:1.9;

    margin-bottom:42px;

}

/* ==========================================================
Features
========================================================== */

.wm-other-room-features{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

    margin-bottom:45px;

}

.wm-other-room-features div{

    background:#fff;

    border:1px solid #E8EDF4;

    border-radius:100px;

    padding:14px 22px;

    font-size:15px;

    color:#444;

    box-shadow:0 8px 18px rgba(0,0,0,.05);

}

/* ==========================================================
Button
========================================================== */

.wm-other-room-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-width:220px;

    height:60px;

    background:#1F4D8C;

    color:#fff !important;

    text-decoration:none !important;

    border-radius:12px;

    font-size:17px;

    font-weight:600;

    transition:.3s;

}

.wm-other-room-btn:hover{

    background:#173C73;

    color:#fff !important;

    transform:translateY(-3px);

}

/* ==========================================================
Laptop
========================================================== */

@media(max-width:1200px){

.wm-other-room-card{

    grid-template-columns:380px 1fr;

    gap:45px;

}

.wm-other-room-image img{

    max-width:380px;

}

.wm-other-room-content h3{

    font-size:46px;

}

}

/* ==========================================================
Tablet
========================================================== */

@media(max-width:991px){

.wm-other-room-card{

    grid-template-columns:1fr;

    gap:40px;

}

.wm-other-room-image{

    justify-content:center;

}

.wm-other-room-image img{

    max-width:400px;

}

.wm-other-room-content{

    text-align:center;

}

.wm-other-room-content p{

    max-width:100%;

}

.wm-other-room-features{

    justify-content:center;

}

}

/* ==========================================================
Mobile
========================================================== */

@media(max-width:768px){

.wm-other-room-section{

    padding:80px 20px;

}

.wm-other-room-heading{

    margin-bottom:45px;

}

.wm-other-room-heading h2{

    font-size:34px;

}

.wm-other-room-heading p{

    font-size:16px;

}

.wm-other-room-image img{

    width:100%;

    max-width:320px;

    border-radius:170px 170px 25px 25px;

}

.wm-other-room-content h3{

    font-size:32px;

}

.wm-other-room-content p{

    font-size:16px;

}

.wm-other-room-features{

    flex-direction:column;

}

.wm-other-room-features div{

    width:100%;

    text-align:center;

}

.wm-other-room-btn{

    width:100%;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8327375 *//* ==========================================================
WHITE MAKUTI
PREMIUM BOOKING CONTACT SECTION
========================================================== */

.wm-booking-help {
    width: 100%;
    padding: 95px 24px;
    background:
        linear-gradient(
            180deg,
            #f7fbfc 0%,
            #eef6f7 100%
        );
}

.wm-booking-help-inner {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}


/* ==========================================================
HEADING
========================================================== */

.wm-booking-help-heading {
    max-width: 760px;
    margin: 0 auto 48px;
    text-align: center;
}

.wm-booking-help-label {
    display: inline-block;
    margin-bottom: 14px;
    color: #b78a48;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.wm-booking-help-heading h2 {
    margin: 0 0 18px;
    color: #073e48;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(36px, 5vw, 52px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.wm-booking-help-heading p {
    max-width: 690px;
    margin: 0 auto;
    color: #65747a;
    font-size: 16px;
    line-height: 1.8;
}


/* ==========================================================
GRID
========================================================== */

.wm-booking-help-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}


/* ==========================================================
ALL CONTACT CARDS
========================================================== */

.wm-booking-help-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 150px;
    padding: 28px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(7, 62, 72, 0.1);
    border-radius: 22px;
    color: inherit;
    box-shadow:
        0 14px 36px rgba(12, 60, 69, 0.07);
    overflow: hidden;
}


/* ==========================================================
STATIC PHONE CARDS
========================================================== */

.wm-booking-help-static {
    cursor: default;
}


/* ==========================================================
CLICKABLE CARDS
========================================================== */

.wm-booking-help-link {
    padding-right: 68px;
    text-decoration: none !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease;
}

.wm-booking-help-link::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #b78a48;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.wm-booking-help-link:hover {
    transform: translateY(-5px);
    background: #ffffff;
    border-color: rgba(183, 138, 72, 0.35);
    box-shadow:
        0 22px 52px rgba(12, 60, 69, 0.12);
}

.wm-booking-help-link:hover::before {
    opacity: 1;
}

.wm-booking-help-link:visited,
.wm-booking-help-link:hover,
.wm-booking-help-link:focus {
    color: inherit;
    text-decoration: none !important;
}


/* ==========================================================
ICON
========================================================== */

.wm-booking-help-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    border-radius: 50%;
    background: #073e48;
    color: #ffffff;
    font-size: 24px;
    box-shadow:
        0 10px 22px rgba(7, 62, 72, 0.18);
}

.wm-booking-help-link .wm-booking-help-icon {
    transition:
        transform 0.3s ease,
        background 0.3s ease;
}

.wm-booking-help-link:hover .wm-booking-help-icon {
    transform: scale(1.05);
    background: #0b5663;
}


/* WhatsApp Icon */

.wm-booking-help-whatsapp .wm-booking-help-icon {
    background: #25d366;
}

.wm-booking-help-whatsapp:hover .wm-booking-help-icon {
    background: #1ebe5d;
}


/* ==========================================================
CONTENT
========================================================== */

.wm-booking-help-content {
    min-width: 0;
    flex: 1;
}

.wm-booking-help-small {
    display: block;
    margin-bottom: 6px;
    color: #a67d43;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.wm-booking-help-content h3 {
    margin: 0 0 7px;
    color: #073e48;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
}

.wm-booking-help-content p {
    margin: 0;
    color: #637178;
    font-size: 15px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}


/* ==========================================================
ARROW - ONLY ON CLICKABLE CARDS
========================================================== */

.wm-booking-help-arrow {
    position: absolute;
    right: 27px;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #f1f6f7;
    color: #073e48;
    font-size: 17px;
    transform: translateY(-50%);
    transition:
        transform 0.3s ease,
        background 0.3s ease,
        color 0.3s ease;
}

.wm-booking-help-link:hover .wm-booking-help-arrow {
    background: #073e48;
    color: #ffffff;
    transform: translate(4px, -50%);
}


/* ==========================================================
BOTTOM NOTE
========================================================== */

.wm-booking-help-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 30px;
    color: #6a777c;
    font-size: 14px;
    text-align: center;
}

.wm-booking-help-note i {
    color: #b78a48;
}


/* ==========================================================
TABLET
========================================================== */

@media (max-width: 900px) {

    .wm-booking-help {
        padding: 75px 22px;
    }

    .wm-booking-help-grid {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================
MOBILE
========================================================== */

@media (max-width: 600px) {

    .wm-booking-help {
        padding: 58px 16px;
    }

    .wm-booking-help-heading {
        margin-bottom: 32px;
        text-align: left;
    }

    .wm-booking-help-heading h2 {
        font-size: 35px;
    }

    .wm-booking-help-heading p {
        font-size: 15px;
        line-height: 1.7;
    }

    .wm-booking-help-grid {
        gap: 15px;
    }

    .wm-booking-help-card {
        min-height: 0;
        gap: 15px;
        padding: 22px 20px;
        border-radius: 18px;
    }

    .wm-booking-help-link {
        padding-right: 54px;
    }

    .wm-booking-help-icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
        font-size: 20px;
    }

    .wm-booking-help-content h3 {
        font-size: 19px;
    }

    .wm-booking-help-content p {
        font-size: 14px;
    }

    .wm-booking-help-arrow {
        right: 17px;
        width: 30px;
        height: 30px;
        font-size: 15px;
    }

    .wm-booking-help-note {
        align-items: flex-start;
        margin-top: 24px;
        font-size: 13px;
        line-height: 1.6;
        text-align: left;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3b3834c *//* ==========================================================
WHITE MAKUTI
OUR LOCATION
========================================================== */

.wm-map-section{

    background:#ffffff;
    padding:110px 20px;

}

.wm-map-container{

    max-width:1300px;
    margin:0 auto;

    display:grid;
    grid-template-columns:480px 1fr;
    gap:80px;

    align-items:center;

}

/* ==========================================================
LEFT CONTENT
========================================================== */

.wm-map-content{

    max-width:450px;

}

.wm-map-label{

    display:inline-block;

    color:#b8925e;

    font-size:13px;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.wm-map-title{

    margin:0 0 28px;

    font-family:"Playfair Display", serif;

    font-size:56px;

    line-height:1.15;

    font-weight:500;

    color:#123a63;

}

.wm-map-text{

    margin:0 0 35px;

    font-size:17px;

    line-height:1.9;

    color:#666;

}

/* ==========================================================
FEATURES
========================================================== */

.wm-map-features{

    display:flex;

    flex-direction:column;

    gap:18px;

    margin-bottom:40px;

}

.wm-map-feature{

    display:flex;

    align-items:center;

    gap:16px;

}

.wm-map-feature span{

    width:42px;

    height:42px;

    border-radius:50%;

    background:#f5f8fb;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:20px;

    flex-shrink:0;

}

.wm-map-feature p{

    margin:0;

    font-size:16px;

    color:#444;

}

/* ==========================================================
BUTTON
========================================================== */

.wm-map-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 38px;

    background:#123a63;

    color:#fff !important;

    text-decoration:none;

    border-radius:6px;

    font-weight:600;

    transition:.35s;

}

.wm-map-button:hover{

    background:#0c2d4c;

    color:#fff !important;

    transform:translateY(-3px);

}

/* ==========================================================
MAP
========================================================== */

.wm-map-wrapper{

    overflow:hidden;

    border-radius:18px;

    box-shadow:

    0 20px 60px rgba(0,0,0,.12);

    position:relative;

}

.wm-map-wrapper iframe{

    width:100%;

    height:650px;

    border:none;

    display:block;

}

/* Small floating card */

.wm-map-wrapper::before{

    content:"White Makuti Holiday Apartments";

    position:absolute;

    top:20px;

    left:20px;

    background:#ffffff;

    padding:14px 18px;

    border-radius:10px;

    font-weight:600;

    color:#123a63;

    box-shadow:0 10px 25px rgba(0,0,0,.12);

    z-index:5;

}

/* ==========================================================
TABLET
========================================================== */

@media (max-width:1024px){

.wm-map-container{

grid-template-columns:1fr;

gap:60px;

}

.wm-map-content{

max-width:100%;

}

.wm-map-title{

font-size:46px;

}

.wm-map-wrapper iframe{

height:520px;

}

}

/* ==========================================================
MOBILE
========================================================== */

@media (max-width:768px){

.wm-map-section{

padding:70px 20px;

}

.wm-map-container{

display:flex;

flex-direction:column;

}

.wm-map-content{

text-align:center;

order:1;

}

.wm-map-wrapper{

order:2;

width:100%;

}

.wm-map-title{

font-size:36px;

}

.wm-map-text{

font-size:16px;

}

.wm-map-features{

align-items:flex-start;

max-width:320px;

margin:0 auto 35px;

}

.wm-map-button{

width:100%;

max-width:230px;

margin:0 auto;

}

.wm-map-wrapper iframe{

height:400px;

}

.wm-map-wrapper::before{

left:15px;

top:15px;

font-size:14px;

padding:10px 14px;

}

}

/* ==========================================================
SMALL MOBILE
========================================================== */

@media (max-width:480px){

.wm-map-title{

font-size:30px;

}

.wm-map-wrapper iframe{

height:340px;

}

.wm-map-feature p{

font-size:15px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-89d4b15 *//* ==========================================================
WHITE MAKUTI
LUXURY WHATSAPP CHAT
========================================================== */

.wm-whatsapp-wrapper{

position:fixed;

right:28px;

bottom:28px;

z-index:999999;

display:flex;

align-items:center;

gap:14px;

}

/* ==============================
CHAT BUBBLE
============================== */

.wm-whatsapp-tooltip{

background:#fff;

padding:14px 18px;

border-radius:18px;

box-shadow:0 14px 45px rgba(0,0,0,.15);

display:flex;

flex-direction:column;

opacity:0;

transform:translateX(25px);

animation:wmBubble .6s ease forwards;

animation-delay:3s;

}

.wm-whatsapp-tooltip strong{

font-size:15px;

color:#143D79;

margin-bottom:2px;

font-weight:700;

}

.wm-whatsapp-tooltip span{

font-size:13px;

color:#666;

white-space:nowrap;

}

/* ==============================
ARROW
============================== */

.wm-whatsapp-tooltip:after{

content:"";

position:absolute;

right:-8px;

top:50%;

transform:translateY(-50%) rotate(45deg);

width:16px;

height:16px;

background:white;

}

/* ==============================
BUTTON
============================== */

.wm-whatsapp-wrapper a{

width:68px;

height:68px;

background:#25D366;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

box-shadow:

0 15px 40px rgba(0,0,0,.22);

transition:.35s;

animation:wmFloat 3s ease-in-out infinite;

}

.wm-whatsapp-wrapper a:hover{

transform:scale(1.08);

box-shadow:

0 20px 55px rgba(0,0,0,.28);

}

.wm-whatsapp-wrapper img{

width:36px;

height:36px;

display:block;

}

/* ==============================
FLOAT
============================== */

@keyframes wmFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}

/* ==============================
SHOW BUBBLE
============================== */

@keyframes wmBubble{

to{

opacity:1;

transform:translateX(0);

}

}

/* ==============================
MOBILE
============================== */

@media(max-width:768px){

.wm-whatsapp-wrapper{

right:18px;

bottom:18px;

}

.wm-whatsapp-wrapper a{

width:60px;

height:60px;

}

.wm-whatsapp-wrapper img{

width:32px;

height:32px;

}

.wm-whatsapp-tooltip{

padding:12px 15px;

}

.wm-whatsapp-tooltip span{

font-size:12px;

}

}/* End custom CSS */