/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Sep 12 2026 | 08:35:56 */
@font-face { 
	font-family: 'BonVivantSerif'; 
	src: url('https://canvasbeachhotelpuri.com/wp-content/uploads/2026/08/BonVivantSerif.woff2') format('woff2'); 
	font-weight: 400; 
	font-style: normal; 
	font-display: swap; 
}
html { scroll-behavior: smooth; }

.heading-custom-fonts h2 { font-family: 'BonVivantSerif', serif !important; }
.heading-custom-fonts h3 { font-family: 'BonVivantSerif', serif !important; }
.single-hotel_rooms .hotel_rooms { padding-top: 174px; }

/*---------------- Header Start ----------------*/
.page-id-2 .main-header-web { background-color: #413628; }
.single-hotel_rooms .main-header-web { background-color: #413628; }
.page-id-16 .main-header-web { background-color: #413628; }
.page-id-18 .main-header-web { background-color: #413628; }
.she-header-yes .logo img { transition: height 0.5s ease !important; }
.she-header .logo img { max-height: 60px; }

/* =========================================================
   TABLET PORTRAIT
   ========================================================= */
@media (min-width: 881px) and (max-width: 1024px) { 
   .logged-in .mobile-header { top: 48px !important }
   .logged-in .she-header { top: 0 !important; }
   .single-hotel_rooms .mobile-header { background-color: #413628; }
   .page-id-16 .mobile-header { background-color: #413628; }
   .page-id-18 .mobile-header { background-color: #413628; }
   .page-id-2 .mobile-header { background-color: #413628; }
}

/* =========================================================
   MOBILE LANDSCAPE
   ========================================================= */
@media (min-width: 768px) and (max-width: 881px) { 
   .logged-in .mobile-header { top: 48px !important }
   .logged-in .she-header { top: 0 !important; }
   .single-hotel_rooms .mobile-header { background-color: #413628; }
   .page-id-16 .mobile-header { background-color: #413628; }
   .page-id-18 .mobile-header { background-color: #413628; }
   .page-id-2 .mobile-header { background-color: #413628; }
}

/* =========================================
   MOBILE
========================================= */
@media (max-width: 767px) {
	.logged-in .mobile-header { top: 48px !important }
	.logged-in .she-header { top: 0 !important; }
   .single-hotel_rooms .mobile-header { background-color: #413628; }
   .page-id-16 .mobile-header { background-color: #413628; }
   .page-id-18 .mobile-header { background-color: #413628; }
   .page-id-2 .mobile-header { background-color: #413628; }
}
/*---------------- Header End ----------------*/

/* =====================================================
   CANVAS HOTEL HOTEL PURI
   BEWARE OF FAKE WEBSITES MODAL
   ===================================================== */
#canvas-fake-website-popup { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.25s ease, visibility 0.25s ease; }
#canvas-fake-website-popup.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
#canvas-fake-website-popup .canvas-fake-popup__overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.55); }
#canvas-fake-website-popup .canvas-fake-popup__box { position: relative; z-index: 1; width: min(650px, 100%); box-sizing: border-box; padding: 50px 50px 45px; background: #ffffff; border-radius: 20px; text-align: center; box-shadow: 0 20px 70px rgba(0, 0, 0, 0.25); transform: translateY(12px); transition: transform 0.25s ease; }
#canvas-fake-website-popup.is-visible
.canvas-fake-popup__box { transform: translateY(0); }
#canvas-fake-website-popup .canvas-fake-popup__icon { margin: 0 auto 22px; display: flex; align-items: center; justify-content: center; }
#canvas-fake-website-popup .canvas-fake-popup__icon img { width: 50px; }
#canvas-fake-website-popup .canvas-fake-popup__title { color: #000000; font-family: 'BonVivantSerif', serif !important; font-size: clamp(38px, 5vw, 32px); font-weight: 400; line-height: 1.12; margin: 0 0 10px; }
#canvas-fake-website-popup .canvas-fake-popup__text { color: #414141; font-family: "Inter", sans-serif; font-size: 20px; font-weight: 400; line-height: 1.55; margin: 0 auto;max-width: 520px;  }
#canvas-fake-website-popup .canvas-fake-popup__close { position: absolute; top: 18px; right: 18px; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #222222; font-size: 34px; font-weight: 300; line-height: 46px; text-align: center; cursor: pointer; z-index: 2; }
#canvas-fake-website-popup .canvas-fake-popup__close:hover { background: #f1f1f1; }
#canvas-fake-website-popup .canvas-fake-popup__close:focus-visible { outline: 3px solid #222222; outline-offset: 3px; }
body.canvas-fake-popup-open { overflow: hidden; }
@media (max-width: 767px) {
   #canvas-fake-website-popup { padding: 16px; }
   #canvas-fake-website-popup .canvas-fake-popup__box { padding: 58px 25px 42px; border-radius: 16px; }
   #canvas-fake-website-popup .canvas-fake-popup__icon { width: 52px; height: 52px; margin-bottom: 18px; font-size: 32px; border-radius: 12px; }
   #canvas-fake-website-popup .canvas-fake-popup__title { font-size: 36px; margin-bottom: 20px; }
   #canvas-fake-website-popup .canvas-fake-popup__text { font-size: 17px; line-height: 1.5; }
   #canvas-fake-website-popup .canvas-fake-popup__close { top: 10px; right: 10px; }
}
@media (prefers-reduced-motion: reduce) { 
   #canvas-fake-website-popup, #canvas-fake-website-popup .canvas-fake-popup__box { transition: none; }
}
/*---------------- BEWARE OF FAKE WEBSITES MODAL End ----------------*/


/*---------------- Home Banner Start ----------------*/

/* =========================================
   EXPLORE ROOMS BUTTON
========================================= */
.explore-rooms-btn { bottom: 35px; left: 50%; position: absolute; transform: translateX(-50%); z-index: 20; }

/* Button itself */
.explore-rooms-btn .elementor-button { align-items: flex-start; background: transparent; /*border: 1px solid rgba(255,255,255,0.75);*/ border: none; border-radius: 0; color: #ffffff; font-size: 12px; font-weight: 400; display: flex; justify-content: center; line-height: 1.3; position: relative; min-height: 100px; min-width: 105px; padding: 17px 10px; text-decoration: none; transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease; }

/* Downward line */
.explore-rooms-btn .elementor-button::after { background: rgba(255,255,255,0.8); bottom: 12px; content: ""; height: 30px; left: 50%; position: absolute; transform: translateX(-50%); width: 1px; }

/* Small animated arrow */
.explore-rooms-btn .elementor-button::before { animation: exploreRoomsArrow 1.6s ease-in-out infinite; border-right: 1px solid #ffffff; border-bottom: 1px solid #ffffff; bottom: 10px; content: ""; height: 7px; left: 50%; position: absolute; transform: translateX(-50%) rotate(45deg); width: 7px; }

/* Hover */
.explore-rooms-btn .elementor-button:hover { background: rgba(255,255,255,0.08); }

/* Animation */
@keyframes exploreRoomsArrow { 
   0% { opacity: 0; transform: translate(-50%, -6px) rotate(45deg); }
   50% { opacity: 1; transform: translate(-50%, 2px) rotate(45deg); }
   100% { opacity: 0; transform: translate(-50%, 8px) rotate(45deg); }
}

/********* TABLET PORTRAIT *********/
@media (min-width: 881px) and (max-width: 1024px) { 
   .explore-rooms-btn { bottom: 51px; }
}

/* =========================================
   MOBILE
========================================= */
@media (max-width: 767px) { 
   .explore-rooms-btn { bottom: 51px; }
   .explore-rooms-btn .elementor-button { font-size: 11px; min-height: 85px; min-width: 85px; padding-top: 13px; }
   .explore-rooms-btn .elementor-button::after { bottom: 9px; height: 23px; }
   .explore-rooms-btn .elementor-button::before { bottom: 7px; }
}
/*---------------- Home Banner End ----------------*/



/*---------------- Home Page Start ----------------*/

.home-slider .wpr-slider-title h2 { font-family: 'BonVivantSerif', serif !important; }

/********* 
MOBILE LANDSCAPE / SMALL TABLET
768px - 880px 
*********/
@media (min-width: 768px) and (max-width: 880px) { 
   .hero-bottom-icon .elementor-image-box-wrapper { justify-content: center; }
   .hero-bottom-icon .elementor-image-box-content { width: auto; }
}

/* =====================================================
   CANVAS HOTEL
   HOTEL ROOMS CAROUSEL
   ===================================================== */
.canvas-rooms-carousel { position: relative; width: 100%; }

/* =====================================================
   VIEWPORT
   ===================================================== */
.canvas-rooms-carousel__viewport { overflow: hidden; position: relative; width: 100%; }

/* =====================================================
   TRACK
   ===================================================== */
.canvas-rooms-carousel__track { display: flex; gap: 30px; transition: transform 0.6s ease; will-change: transform; width: max-content; }

/* =====================================================
   ROOM CARD
   ===================================================== */
.canvas-room-card { background: #fff; display: flex; flex: 0 0 calc((100vw - 60px) / 3); flex-direction: column; max-width: 437px; overflow: hidden; }

/* =====================================================
   IMAGE
   ===================================================== */
.canvas-room-card__image-link { border-radius: 20px; display: block; overflow: hidden; position: relative; width: 100%; }
.canvas-room-card__image { border-radius: 20px; display: block; height: 229px !important; object-fit: cover; transition: transform 0.5s ease; width: 100%; }
.canvas-room-card:hover .canvas-room-card__image { transform: scale(1.04); }
.canvas-room-card__image-link .canvas-room-card__detail { align-items: center; background: #FFFFFFCC; border-radius: 20px; display: flex; flex-direction: row; gap: 4px; left: 15px; padding: 8px 14px; position: absolute; top: 16px; }
.canvas-room-card__image-link .canvas-room-card__label { color: #414040; font-family: "Inter", sans-serif; font-size: 13px; font-weight: 600; }
.canvas-room-card__image-link .canvas-room-card__value { color: #414040; font-family: "Inter", sans-serif; font-size: 13px; font-weight: 600; }

/* =====================================================
   CONTENT
   ===================================================== */
.canvas-room-card__content { padding: 25px 0 0; }

/* =====================================================
   TITLE
   ===================================================== */
.canvas-room-card__title { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 24px; font-weight: 600; line-height: 1.1; margin: 0 0 19px; }
.canvas-room-card__title a { color: #2F4F3E; display: block; text-decoration: none; }

/* =====================================================
   DETAILS
   ===================================================== */
.canvas-room-card__details { display: flex; gap: 12px 11px; flex-wrap: wrap; margin-bottom: 22px; }
.canvas-room-card__details .canvas-room-card__detail { align-items: center; background: #F8DBB799; border-radius: 20px; display: flex; flex-direction: row; gap: 8px; padding: 8px 12px; }
.canvas-room-card__details .canvas-room-card__detail .canvas-room-card__value { color: #000000; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 400; }

/* =====================================================
   AMENITIES
   ===================================================== */
.canvas-room-card__amenities { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 24px; }
.canvas-room-card__amenity { background: url(https://canvasbeachhotelpuri.com/wp-content/uploads/2026/08/blck-dots-circle.png) no-repeat 0 7px; color: #454545; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 400; padding: 0 0 0 14px; }
.canvas-room-card__amenity:nth-child(3n + 1) { width: calc(40% - 14px); }
.canvas-room-card__amenity:nth-child(3n + 2) { width: calc(25% - 14px); }
.canvas-room-card__amenity:nth-child(3n + 3) { width: calc(35% - 14px); }

/* =====================================================
   BUTTON
   ===================================================== */
.canvas-room-card__button { align-items: center; background: #C87500; border-radius: 10px; color: #FFFFFF; display: inline-flex; font-family: "Inter", sans-serif; font-size: 16px; font-weight: 500; justify-content: center; min-height: 51px; text-decoration: none; transition: background-color 0.3s ease, transform 0.3s ease; width: 100%; }
.canvas-room-card__button:hover { background: #315843; color: #FFFFFF; transform: translateY(-2px); }

/* =====================================================
   NAVIGATION
   ===================================================== */
.canvas-rooms-carousel__navigation { display: flex; gap: 0; justify-content: flex-end; margin-top: 0; }
.canvas-rooms-carousel__arrow { align-items: center; border: none; cursor: pointer; display: flex; height: 56px; justify-content: center; margin-top: -28px; padding: 0; position: absolute; top: 20%; transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease; width: 56px; z-index: 1; }
.canvas-rooms-carousel__arrow--prev { left: 0; }
.canvas-rooms-carousel__arrow--next { right: 19px; }
.canvas-rooms-carousel__arrow:disabled { opacity: 0.3; cursor: default; }
.canvas-rooms-carousel__arrow:hover, .canvas-rooms-carousel__arrow:focus { background: none; }

/* =====================================================
   LAPTOP
   ===================================================== */
@media (max-width: 1367px) { 
   .canvas-room-card { max-width: 427px; }
   .canvas-rooms-carousel__arrow--next { right: 5px; }
}

/* =====================================================
   TABLET PORTRAIT
   881px - 1024px
   TWO COMPLETE CARDS
   ===================================================== */
@media (min-width: 881px) and (max-width: 1024px) { 
   .canvas-rooms-carousel__viewport { width: 100%; overflow: hidden; }
   .canvas-rooms-carousel__track { width: 100%; max-width: none; gap: 30px; }
   .canvas-room-card { flex: 0 0 calc((100% - 30px) / 2); width: calc((100% - 30px) / 2); max-width: none; }
}

/* =====================================================
   MOBILE LANDSCAPE / SMALL TABLET
   768px - 880px
   TWO COMPLETE CARDS
   ===================================================== */
@media (min-width: 768px) and (max-width: 880px) { 
   .canvas-rooms-carousel__viewport { overflow: hidden; width: 100%; }
   .canvas-rooms-carousel__track { gap: 20px; max-width: none; width: 100%; }
   .canvas-room-card { flex: 0 0 calc((100% - 20px) / 2); max-width: none; width: calc((100% - 20px) / 2); }
   .canvas-rooms-carousel__track .room-title-section { display: flex; margin-bottom: 19px; min-height: 53px; }
   .canvas-rooms-carousel__track .room-title-section .canvas-room-card__title { margin-bottom: 0; }
}

/* =====================================================
   MOBILE
   BELOW 768px
   ONE CARD
   ===================================================== */
@media (max-width: 767px) { 
   .canvas-rooms-carousel__track { gap: 0; width: max-content; }
   .canvas-room-card { flex: 0 0 calc(100cqw - 30px); max-width: calc(100cqw - 30px); }
   .canvas-room-card__image { height: 250px; }
   .canvas-room-card__content { padding: 24px 0; }
   .canvas-room-card__title { font-size: 28px; }
   .canvas-room-card__details { grid-template-columns: 1fr 1fr; }
   .canvas-rooms-carousel__navigation { justify-content: center; }
   .canvas-rooms-carousel__arrow--next { right: 0; }
}

/* =========================================
   Amazing Attractions Section START
========================================= */
.home-feature-carousel .elementor-image-carousel-wrapper { /*padding-right: 82px;*/ }
.home-feature-carousel .elementor-image-carousel-wrapper .elementor-image-carousel { /*padding-right: 82px;*/ }
.home-feature-carousel .swiper-slide-inner::after { background: linear-gradient(0deg, #333232 10%, rgba(51, 50, 50, 0) 60%); border-radius: 12px; content: ""; pointer-events: none; position: absolute; inset: 0; z-index: 1; }
.home-feature-carousel .elementor-image-carousel-caption { bottom: 20px; padding: 0 25px; position: absolute; text-align: left !important; width: 100%; z-index: 2; }

/* =========================================================
   CANVAS BEACH HOTEL PURI REVIEWS CAROUSEL START
   ========================================================= */

/********* SECTION / OUTER WRAPPER *********/
.reviews-section { background: #F8E2BC; overflow: hidden; width: 100%; }

/********* CAROUSEL VIEWPORT *********/
.reviews-carousel { overflow: hidden; position: relative; width: 100%; }

/********* REVIEWS TRACK *********/
.reviews-track { align-items: stretch; display: flex; flex-wrap: nowrap; gap: 30px; max-width: none; transform: translate3d(-53px, 0, 0); transition: transform 0.8s ease; width: max-content; will-change: transform; }

/********* INDIVIDUAL REVIEW CARD *********/
.review-card { background: #FFFCE3; border-radius: 20px; color: #2F4F3E; display: flex; flex-direction: column; flex: 0 0 423px; height: 428px; min-width: 423px; overflow: hidden; padding: 40px; position: relative; transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease; width: 423px; }

/********* HOVER STATE *********/
.review-card:hover { background: #315843; color: #FFFFFF; transform: translateY(-2px); }

/********* STARS *********/
.review-stars { color: #C06D05; font-size: 21px; line-height: 1; letter-spacing: 1px; margin-bottom: 56px; transition: color 0.3s ease; }

/********* Stars become cream on hover *********/
.review-card:hover .review-stars { color: #FFF4D6; }

/********* ROOM *********/
.review-room { color: #2F4F3E; font-family: "Inter", Sans-serif; font-size: 15px; font-weight: 500; line-height: 1; margin-bottom: 10px; transition: color 0.3s ease; }
.review-card:hover .review-room { color: #FFFFFF; }

/********* REVIEWER NAME *********/
.review-name { color: #2F4F3E; font-family: "Inter", Sans-serif; font-size: 22px; font-weight: 500; line-height: 1; margin-bottom: 23px; transition: color 0.3s ease; }
.review-card:hover .review-name { color: #FFFFFF; }

/********* REVIEW TEXT *********/
.review-text { color: #2F4F3E; font-family: "Inter", Sans-serif; font-size: 18px; font-weight: 400; line-height: 1.5; margin: 0; transition: color 0.3s ease; }
.review-card:hover .review-text { color: #FFFFFF; }

/********* DATE *********/
.review-date { color: #2F4F3EBF; font-family: "Inter", Sans-serif; font-size: 16px; font-weight: 600; line-height: 1; margin-top: auto; transition: color 0.3s ease; }
.review-card:hover .review-date { color: #C8D8CC; }

/*
 * If an old review card has the class
 *
 * review-card-dark
 *
 * it will behave exactly like the other cards.
 *
 * Green appears ONLY when the user hovers.
 */
.review-card.review-card-dark { background: #FFFBEA; color: #284F3D; }
.review-card.review-card-dark .review-stars { color: #C87500; }
.review-card.review-card-dark .review-room,
.review-card.review-card-dark .review-name,
.review-card.review-card-dark .review-text { color: #284F3D; }
.review-card.review-card-dark .review-date { color: #6C806F; }

/*
 * Hover still overrides the old dark-card styling.
 */
.review-card.review-card-dark:hover { background: #315843; color: #FFFFFF; }
.review-card.review-card-dark:hover .review-stars { color: #FFF4D6; }
.review-card.review-card-dark:hover .review-room,
.review-card.review-card-dark:hover .review-name,
.review-card.review-card-dark:hover .review-text { color: #FFFFFF; }
.review-card.review-card-dark:hover .review-date { color: #C8D8CC; }

/********* DESKTOP *********/
@media (min-width: 1025px) { 
   .reviews-section { overflow: hidden; }
   .reviews-carousel { overflow: hidden; width: 100%; }
   .reviews-track { transform: translate3d(-53px, 0, 0); }
}

/********* TABLET PORTRAIT *********/
@media (min-width: 881px) and (max-width: 1024px) { 
   .reviews-track { gap: 14px; transform: translateX(-35px); }
   .review-card { flex: 0 0 300px; height: auto; min-width: 300px; padding: 25px 20px 22px; width: 300px; }
}

/* =====================================================
   MOBILE LANDSCAPE / SMALL TABLET
   768px - 880px
===================================================== */
@media (min-width: 768px) and (max-width: 880px) { 
   .reviews-track { gap: 14px; transform: translateX(-35px); }
   .review-card { flex: 0 0 300px; height: auto; min-width: 300px; padding: 25px 20px 22px; width: 300px; }
}

/********* MOBILE *********/
@media (max-width: 767px) { 
   .reviews-carousel { width: 100%; overflow: hidden; padding: 0 20px; }
   .reviews-track { gap: 12px; 
      /*
      * IMPORTANT:  * JavaScript controls the transform.
      * Do not add a negative mobile offset here.
      */
      transform: none; }
   .review-card { 
      /*
      * One complete card should fit inside
      * the mobile viewport.
      */
      flex: 0 0 calc(100vw - 40px); height: 250px; min-width: calc(100vw - 40px); padding: 25px 20px 22px; width: calc(100vw - 40px); }
   .review-stars { font-size: 17px; }
   .review-room { font-size: 10px; }
   .review-name { font-size: 15px; }
   .review-text { font-size: 12px; line-height: 1.3; }
}
/*---------------- Home Page End ----------------*/







/*---------------- About Page Start ----------------*/

/* =========================================================
   ABOUT PAGE VIDEO START
   ========================================================= */
#wpr-popup-id-316 .canvas-hotel-video, #wpr-popup-id-1039 .canvas-about-video { display: block; width: 100%; max-width: 100%; height: auto; margin: 0 auto; }

/* =========================================
   CANVAS HOTEL VIDEO POPUPS
   ========================================= */
/* Hide both video popups initially */
#wpr-popup-id-316,
#wpr-popup-id-1039 { display: none !important; }

/* Show Home video popup */
#wpr-popup-id-316.canvas-video-popup-active { display: block !important; }

/* Show About video popup */
#wpr-popup-id-1039.canvas-video-popup-active { display: block !important; }

/* =========================================================
   CANVAS BEACH HOTEL
   UNIQUE EXPERIENCES MARQUEE
   ========================================================= */

/* ---------------------------------------------------------
   MAIN SECTION
   --------------------------------------------------------- */
.experiences-marquee-section { background: #FFFFFF; margin: 0; overflow: hidden; padding: 0; width: 100%; }

/* ---------------------------------------------------------
   MARQUEE VIEWPORT
   --------------------------------------------------------- */
.experiences-marquee { margin: 0; overflow: hidden; padding: 0; position: relative; width: 100%; }

/* ---------------------------------------------------------
   MOVING TRACK
   --------------------------------------------------------- */
.experiences-marquee-track { display: flex; flex-wrap: nowrap; margin: 0; max-width: none; padding: 0; will-change: transform; animation: experiencesMarqueeMove 40s linear infinite; width: max-content; }

/* ---------------------------------------------------------
   EACH IMAGE GROUP
   --------------------------------------------------------- */
.experiences-marquee-group { align-items: stretch; display: flex; flex-wrap: nowrap; flex: 0 0 auto; gap: 10px; 
   /*
   * Creates the same gap at the
   * group-to-group loop point.
   */
   padding-right: 10px; }

/* ---------------------------------------------------------
   INDIVIDUAL IMAGE WRAPPER
   --------------------------------------------------------- */
.experience-image { flex: 0 0 auto; height: 227px; margin: 0; padding: 0; overflow: hidden; }

/* ---------------------------------------------------------
   IMAGE
   --------------------------------------------------------- */
.experience-image img { border: 0; display: block; height: 227px; margin: 0; max-width: none; 
     /*
     * Keep the original image proportions.
     */
    object-fit: contain; padding: 0; width: auto; }

/* ---------------------------------------------------------
   INFINITE ANIMATION
   --------------------------------------------------------- */
@keyframes experiencesMarqueeMove { 
   from { transform: translate3d(0, 0, 0); }
   to { transform: translate3d(-50%, 0, 0); }
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 1024px) { 
   .experiences-heading { padding-top: 12px; }
   .experiences-heading h2 { font-size: 46px; }
   .experiences-heading-line { margin-bottom: 40px; margin-top: 18px; }
   .experience-image { height: 200px; }
   .experience-image img { height: 200px; }
   .experiences-marquee-track { animation-duration: 30s; }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 767px) { 
   .experiences-heading { padding: 10px 15px 0; }
   .experiences-heading h2 { font-size: 36px; }
   .experiences-heading-line { margin-bottom: 30px; margin-top: 15px; width: 90px; }
   .experiences-marquee-group { gap: 8px; padding-right: 8px; }
   .experience-image { height: 180px; }
   .experience-image img { height: 180px; }
   .experiences-marquee-track { animation-duration: 25s; }
}
/*---------------- About Page End ----------------*/







/*---------------- Rooms Page Start ----------------*/
.canvas-rooms-listing { display: flex; gap: 30px; flex-wrap: wrap; }

@media screen and (max-width: 1367px) { 
   .canvas-rooms-listing { gap: 20px; }
}

/* =====================================================
   MOBILE LANDSCAPE / SMALL TABLET
   768px - 880px
===================================================== */
@media (min-width: 768px) and (max-width: 880px) { 
   .canvas-rooms-listing .room-title-section { display: flex; margin-bottom: 19px; min-height: 53px; }
   .canvas-rooms-listing .canvas-room-card__title { margin-bottom: 0; }
}
/*---------------- Rooms Page End ----------------*/







/*---------------- Rooms Deatils Page Start ----------------*/

.single-hotel_rooms .page-header { display: none; }

/* =====================================================
   CANVAS HOTEL ROOM DETAILS
===================================================== */
.canvas-room-details { width: 100%; max-width: 1170px; margin: 0 auto; padding: 30px 0 80px; }

/* =====================================================
   ROOM HEADER
===================================================== */
.canvas-room-header { margin-bottom: 28px; width: 100%; }

/* =====================================================
   MAX GUESTS
===================================================== */
.canvas-room-header__guests { background: #FFFFFFCC; border: 1px solid #BFBFBF; border-radius: 5px; color: #414040; display: inline-block; font-family: "Inter", sans-serif; font-size: 13px; font-weight: 600; line-height: 30.4px; margin-bottom: 10px; padding: 0 14px; }

/* =====================================================
   ROOM TITLE
===================================================== */
.canvas-room-header__title { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 34px; font-weight: 700; line-height: 1.15; margin: 0 0 10px; }

/* =====================================================
   TOP ROOM FEATURES
===================================================== */
.canvas-room-header__features { align-items: center; color: #000000; display: flex; flex-wrap: wrap; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 400; line-height: 1.4; width: 100%; }

/* =====================================================
   INDIVIDUAL FEATURE
===================================================== */
.canvas-room-header__feature { align-items: center; border-right: 1px solid #BFBFBF; display: inline-flex; min-height: 18px; padding: 0 12px; }
.canvas-room-header__feature:first-child { padding-left: 0; }
.canvas-room-header__feature:last-child { border-right: 0; }

/* =====================================================
   FEATURE ICON
===================================================== */
.canvas-room-header__feature-icon { align-items: center; display: inline-flex; justify-content: center; margin-right: 8px; }

/* =====================================================
   MAIN LAYOUT
===================================================== */
.canvas-room-details__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: stretch; }

/* =====================================================
   GALLERY
===================================================== */
.canvas-room-gallery { min-width: 0; }

/* =====================================================
   ROOM GALLERY GRID
===================================================== */
.canvas-room-gallery__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%; }

/* =====================================================
   MAIN FEATURED IMAGE
===================================================== */
.canvas-room-gallery__grid .canvas-room-media:first-child { grid-column: 1; grid-row: 1 / 3; min-height: 438px; }

/* =====================================================
   VIDEO THUMBNAIL
===================================================== */
.canvas-room-gallery__grid .canvas-room-media:nth-child(2) { grid-column: 2; grid-row: 1; }

/* =====================================================
   SECOND IMAGE
===================================================== */
.canvas-room-gallery__grid .canvas-room-media:nth-child(3) { grid-column: 2; grid-row: 2; }

/* =====================================================
   ALL MEDIA BUTTONS
===================================================== */
.canvas-room-media { background: transparent; border: none; border-radius: 8px; cursor: pointer; display: block; height: 100%; margin: 0; min-height: 0; overflow: hidden; padding: 0; position: relative; width: 100%; }

/* =====================================================
   IMAGES
===================================================== */
.canvas-room-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* =====================================================
   VIDEO THUMBNAIL IMAGE
===================================================== */
.canvas-room-media--video img { transition: transform 0.3s ease; }
.canvas-room-media--video:hover img { transform: scale(1.03); }

/* =====================================================
   VIDEO PLAY BUTTON
===================================================== */
.canvas-room-video-play { position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; border: 2px solid #fff; border-radius: 50%; background: #FFFFFF99; color: #315843; font-size: 18px; line-height: 1; padding-left: 3px; pointer-events: none; box-sizing: border-box; transition: background 0.3s ease, color 0.3s ease; }
.canvas-room-video-play img { height: auto; width: 12px; }
.canvas-room-media--video:hover .canvas-room-video-play { background: rgba(49, 88, 67, 0.85); color: #ffffff; }

/* =====================================================
   VIEW ALL PHOTOS BUTTON
===================================================== */
.canvas-room-gallery__photos-button { position: absolute; right: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; border-radius: 30px; background: rgba(40, 40, 40, 0.75); color: #ffffff; font-family: "Inter", sans-serif; font-size: 15px; font-weight: 400; white-space: nowrap; }

/* =====================================================
   INFORMATION CARD
===================================================== */
.canvas-room-info-card { background: #ffffff; border: 1px solid #BFBFBF; border-radius: 8px; color: #2F4F3E; font-family: "Inter", sans-serif;  padding: 22px; }
.canvas-room-info-card__title { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 18px; font-weight: 700; line-height: 1.2; margin: 0 0 12px; }
.canvas-room-info-card__summary { color: #403F3F; display: flex; font-family: "Inter", sans-serif; font-size: 13px; font-weight: 400; gap: 10px; margin-bottom: 20px; }
.canvas-room-info-card__summary span { align-items: center; display: flex; gap: 5px; }
.canvas-room-info-card__summary span:nth-child(1) { border-right: 1px solid #BFBFBF; padding-right: 10px;  }
.canvas-room-info-card__features {  color: #C06D05; display: flex; flex-direction: column; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 500; gap: 10px; line-height: 1.4; }
.canvas-room-info-card__features div { display: flex; gap: 6px; }
.canvas-room-info-card__price-label { color: #000000; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; margin-top: 25px; }
.canvas-room-info-card__price { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 24px; font-weight: 800; margin-top: 4px; }
.canvas-room-info-card__price small { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 14px; font-weight: 600; text-transform: uppercase; }
.canvas-room-info-card__price .gst-text-span { color: #403F3F; display: block; font-family: "Inter", sans-serif; font-size: 12px; font-weight: 400; }
.canvas-room-info-card__button { background: #c87500; border: none; border-radius: 7px; color: #ffffff; display: block; font-family: "Inter", sans-serif; font-size: 16px; font-weight: 500; margin-top: 14px; padding: 12px 0; text-align: center; text-decoration: none !important; }
.canvas-room-info-card__button:hover { background: #315843; color: #ffffff; }

/* =====================================================
   DESCRIPTION
===================================================== */
.canvas-room-description { margin: 45px auto 0; max-width: 970px; text-align: center; }
.canvas-room-description img { display: inline-block; }
.canvas-room-description h3 { color: #2F4F3E; font-family: 'BonVivantSerif', serif !important; font-size: 48px; font-weight: 400; margin: 10px 0 10px; }
.canvas-room-description .room-details-heading-border-bottom { border-bottom: 1px solid #C06D05; display: inline-block; margin: 0 0 30px; width: 100px; }
.canvas-room-description__text { color: #454545; font-family: "Inter", sans-serif; font-size: 18px; line-height: 1.55; }

/* =====================================================
   ROOM LIGHTBOX
===================================================== */
.canvas-room-lightbox { position: fixed; inset: 0; z-index: 999999; display: none; align-items: center; justify-content: center; padding: 40px; background: rgba(0, 0, 0, 0.88); box-sizing: border-box; }
.canvas-room-lightbox.is-active { display: flex; }

/* =====================================================
   LIGHTBOX CONTENT
===================================================== */
.canvas-room-lightbox__content { position: relative; display: flex; align-items: center; justify-content: center; width: min(90vw, 1100px); height: min(85vh, 750px); }
.canvas-room-lightbox__content img, .canvas-room-lightbox__content video { display: block; max-width: 100%; max-height: 85vh; width: auto; height: auto; object-fit: contain; }

/* =====================================================
   VIDEO
===================================================== */
.canvas-room-lightbox__content video { max-width: 90vw; max-height: 85vh; }

/* =====================================================
   CLOSE BUTTON
===================================================== */
.canvas-room-lightbox__close { align-items: center; background: #2F4F3E99; border: 2px solid #2F4F3E; border-radius: 50%; color: #ffffff; cursor: pointer;     display: inline-flex; font-size: 34px; justify-content: center; line-height: 1; height: 36px; padding: 0; position: absolute; right: 25px; top: 20px; width: 36px; z-index: 10;  }
.canvas-room-lightbox__close img { height: auto; width: 24px; }
.canvas-room-lightbox__close:hover, .canvas-room-lightbox__close:focus { background: #2F4F3E99; }

/* =====================================================
   PREVIOUS / NEXT
===================================================== */
.canvas-room-lightbox__prev, .canvas-room-lightbox__next { position: absolute; top: 50%; z-index: 10; width: 52px; height: 52px; transform: translateY(-50%); border: 0; border-radius: 50%; background: none; border: none; cursor: pointer; padding: 0; }
.canvas-room-lightbox__prev { left: 25px; }
.canvas-room-lightbox__next { right: 25px; }
.canvas-room-lightbox__prev:hover, .canvas-room-lightbox__next:hover, .canvas-room-lightbox__prev:focus, .canvas-room-lightbox__next:focus { background: none; }

/* =====================================================
   PREVENT PAGE SCROLL
===================================================== */
body.canvas-room-lightbox-open { overflow: hidden; }

/* =========================================================
   TABLET PORTRAIT
   881px - 1024px
   ========================================================= */
@media (min-width: 881px) and (max-width: 1024px) { 
   .single-hotel_rooms .hotel_rooms { max-width: 100% !important; padding-left: 20px; padding-right: 20px; }
   .canvas-room-details__layout { grid-template-columns: 1fr; }
   .canvas-room-info-card { width: 100%; box-sizing: border-box; }
   .canvas-room-description h3 { font-size: 42px; }
}

/* =====================================================
   TABLET
===================================================== */
@media (max-width: 900px) { 
   .canvas-room-details__layout { grid-template-columns: 1fr; }
   .canvas-room-info-card { width: 100%; box-sizing: border-box; }
}

/* =====================================================
   MOBILE LANDSCAPE / SMALL TABLET
   768px - 880px
===================================================== */
@media (min-width: 768px) and (max-width: 880px) {
   .single-hotel_rooms .hotel_rooms { max-width: 100% !important; padding-left: 20px; padding-right: 20px; padding-top: 150px; }
   .canvas-room-description { margin-top: 50px; }
   .canvas-room-description h3 { font-size: 36px; }
   .canvas-room-description__text { font-size: 16px; }
}

/* =====================================================
   MOBILE
===================================================== */
@media (max-width: 767px) { 
   .single-hotel_rooms .hotel_rooms { padding-left: 15px !important; padding-right: 15px !important; padding-top: 150px; }
   .canvas-room-details { padding: 15px 0; }
   .canvas-room-header__title { font-size: 32px; }
   .canvas-room-header__features { gap: 12px 8px; }
   .canvas-room-header__feature { padding: 0 8px 0 0; }
   .canvas-room-gallery__grid { display: flex; flex-wrap: wrap; height: auto; /*grid-template-columns: 2fr 1fr;*/ gap: 8px; }
   .canvas-room-gallery__grid .canvas-room-media:first-child { flex: 0 0 100%; max-width: 100%; min-height: auto; }
   .canvas-room-gallery__grid .canvas-room-media:nth-child(2) { flex: 0 0 calc(50% - 4px); max-width: calc(50% - 4px); }
   .canvas-room-gallery__grid .canvas-room-media:nth-child(2) img { height: 135px; object-fit: cover; }
   .canvas-room-gallery__grid .canvas-room-media:nth-child(3) { flex: 0 0 calc(50% - 4px); max-width: calc(50% - 4px); }
   .canvas-room-gallery__grid .canvas-room-media:nth-child(3) img { height: 135px; object-fit: cover; }
   .canvas-room-gallery__photos-button { right: 8px; bottom: 8px; padding: 8px 11px; font-size: 10px; }
   .canvas-room-video-play img { height: auto !important; }
   .canvas-room-info-card { padding: 18px; }
   .canvas-room-description { margin-top: 45px; }
   .canvas-room-description h2 { font-size: 28px; }
   .canvas-room-lightbox { padding: 15px; }
   .canvas-room-lightbox__content { width: 100%; height: 80vh; }
   .canvas-room-lightbox__prev { left: 8px; font-size: 45px; }
   .canvas-room-lightbox__next { right: 8px; font-size: 45px; }
}

/* =====================================================
   ROOM AMENITIES
===================================================== */
.canvas-room-amenities { margin: 100px auto 0; max-width: 972px; width: 100%; }

/* =====================================================
   AMENITIES TITLE
===================================================== */
.canvas-room-amenities__title { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 24px; font-weight: 600; line-height: 1.25; margin: 0 0 25px; }

/* =====================================================
   AMENITIES LIST
===================================================== */
.canvas-room-amenities__category { border-bottom: 1px solid #d9d9d9; display: grid; grid-template-columns: 190px 1fr; column-gap: 10px; padding: 25px 0; }
.canvas-room-amenities__category:first-of-type { padding-top: 10px; }

/* =====================================================
   AMENITY cATEGORY TITLE
===================================================== */
.canvas-room-amenities__category-title { color: #27382F; font-family: "Inter", sans-serif; font-size: 18px; font-weight: 600; line-height: 1.3; margin-top: 2px; }

.canvas-room-amenities__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 35px; row-gap: 20px; }


/* =====================================================
   SINGLE AMENITY
===================================================== */
.canvas-room-amenity { align-items: start; display: flex; gap: 10px; color: #333333; font-size: 13px; line-height: 1.4; }

/* =====================================================
   AMENITY CHECK
===================================================== */
.canvas-room-amenity__check { align-items: center; display: inline-flex; flex: 0 0 auto; height: 31px; justify-content: center; width: 31px; }

/* =====================================================
   AMENITY TEXT
===================================================== */
.canvas-room-amenity__text { color: #000000; display: block; font-family: "Inter", sans-serif; font-size: 18px; font-weight: 400; line-height: 1.25; }

/* =====================================================
   CONTACT DETAILS
===================================================== */
.canvas-room-contact { text-align: center; margin-top: 85px; padding-bottom: 30px; }
.canvas-room-contact__heading { color: #2F4F3E; font-family: "Inter", sans-serif; font-size: 68px; line-height: 1.1; letter-spacing: -2px; }
.canvas-room-contact__heading-main { font-weight: 500; }
.canvas-room-contact__heading-light { font-weight: 400; font-family: 'BonVivantSerif', serif !important; }
.canvas-room-contact__phone { border-bottom: 6px solid #C06D05; color: #C06D05 !important; display: inline-block; font-family: "Inter", sans-serif; font-size: 68px; font-weight: 800; letter-spacing: 1px; line-height: 1.1; margin-top: 8px; color: inherit; text-decoration: none !important; }

/* =====================================================
   TABLET
===================================================== */
@media (max-width: 1024px) { .canvas-room-amenities__category { grid-template-columns: 170px 1fr; }
    .canvas-room-amenities__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .canvas-room-contact__heading,
    .canvas-room-contact__phone { font-size: 42px; }
}

/* =====================================================
   MOBILE
===================================================== */
@media (max-width: 767px) {
   .canvas-room-amenities { margin: 55px auto 50px; }
   .canvas-room-amenities__category { display: block; padding: 22px 0; }
   .canvas-room-amenities__category-title { margin-bottom: 18px; }
   .canvas-room-amenities__items { grid-template-columns: 1fr; row-gap: 15px; }
   .canvas-room-amenity__text { font-size: 16px; }
   .canvas-room-contact { margin-top: 55px; }
   .canvas-room-contact__heading { font-size: 32px; line-height: 1.15; letter-spacing: -1px; }
   .canvas-room-contact__phone { font-size: 32px; letter-spacing: 0; }
}
/*---------------- Rooms Deatils Page End ----------------*/

/*---------------- Contact Page Start ----------------*/

/* =========================================================
   CANVAS BEACH HOTEL
   MAIN CONTACT FORM
   ========================================================= */

/* ---------------------------------------------------------
   FORM WRAPPER
   --------------------------------------------------------- */
.canvas-main-contact-form { width: 100%; }

/* ---------------------------------------------------------
   REMOVE DEFAULT CF7 PARAGRAPH SPACING
   --------------------------------------------------------- */
.canvas-main-contact-form p { margin: 0; padding: 0; }

/* ---------------------------------------------------------
   INDIVIDUAL FIELD
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-field { margin: 0 0 14px; width: 100%; }

/* ---------------------------------------------------------
   LABEL
   --------------------------------------------------------- */
.canvas-main-contact-form label { display: block; color: #003B5C; font-family: "Inter", sans-serif; font-size: 17px; font-weight: 500; line-height: 1.3; margin: 0 0 8px; }

/* ---------------------------------------------------------
   TEXT / EMAIL / PHONE INPUT
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-input, .canvas-main-contact-form .canvas-phone-input, .canvas-main-contact-form .canvas-form-select, .canvas-main-contact-form .canvas-form-textarea { background: #F0EDC7; border: none; border-radius: 9px; box-shadow: none; color: #003451; font-family: "Inter", sans-serif; font-size: 15px; font-weight: 400; outline: none; transition: background-color 0.2s ease, box-shadow 0.2s ease; width: 100%; }

/* ---------------------------------------------------------
   TEXT / EMAIL INPUT
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-input { height: 48px; padding: 0 22px; }

/* ---------------------------------------------------------
   PLACEHOLDER
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-input::placeholder, .canvas-main-contact-form .canvas-phone-input::placeholder, .canvas-main-contact-form .canvas-form-textarea::placeholder { color: #24556D; opacity: 1; }

/* ---------------------------------------------------------
   INPUT FOCUS
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-input:focus, .canvas-main-contact-form .canvas-phone-input:focus, .canvas-main-contact-form .canvas-form-select:focus, .canvas-main-contact-form .canvas-form-textarea:focus { background: #EAE6BC; box-shadow: none; outline: none; }

/* ---------------------------------------------------------
   PHONE WRAPPER
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-phone-wrapper { background: #F0EDC7; border-radius: 9px; display: flex; height: 48px; overflow: hidden; width: 100%; }
.canvas-main-contact-form .canvas-phone-wrapper p { display: flex; }

/* ---------------------------------------------------------
   PHONE PREFIX
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-phone-prefix { align-items: center; background: #E8E5C8; border-right: 1px solid #fff; border-radius: 9px 0 0 9px; display: flex; color: #003451; font-family: "Inter", sans-serif; font-size: 15px; font-weight: 500; flex: 0 0 48px; justify-content: center;  width: 48px; }

/* ---------------------------------------------------------
   PHONE INPUT
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-phone-input { background: #F0EDC7; border-radius: 0; flex: 1; height: 48px; min-width: 0; padding: 0 14px; }

/* ---------------------------------------------------------
   SELECT
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-select { appearance: auto; cursor: pointer; height: 48px; padding: 0 45px 0 20px; }

/* ---------------------------------------------------------
   MESSAGE
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-message-field { margin-bottom: 27px; }

/* ---------------------------------------------------------
   TEXTAREA
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-textarea { height: 86px; line-height: 1.4; min-height: 86px; resize: none; padding: 17px 20px; }

/* ---------------------------------------------------------
   SUBMIT WRAPPER
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-form-submit { margin-top: 0; width: 100%; }

/* ---------------------------------------------------------
   SUBMIT BUTTON
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-submit { background: #C87500; border: none; border-radius: 7px; box-shadow: none;  color: #FFFFFF; cursor: pointer; display: block; font-family: "Inter", sans-serif; font-size: 16px; font-weight: 600; height: 49px; line-height: 49px; padding: 0; text-align: center; transition: background-color 0.25s ease, transform 0.2s ease; width: 100%; }

/* ---------------------------------------------------------
   SUBMIT HOVER
   --------------------------------------------------------- */
.canvas-main-contact-form .canvas-submit:hover { background: #315843; transform: none; }

/* ---------------------------------------------------------
   CF7 VALIDATION
   --------------------------------------------------------- */
.canvas-main-contact-form .wpcf7-not-valid-tip { color: #B42318; display: block; font-family: "Inter", sans-serif; font-size: 12px; line-height: 1.3; margin-top: 5px; }

/* ---------------------------------------------------------
   CF7 INVALID INPUT
   --------------------------------------------------------- */
.canvas-main-contact-form .wpcf7-not-valid { box-shadow: 0 0 0 1px #B42318; }

/* ---------------------------------------------------------
   CF7 RESPONSE
   --------------------------------------------------------- */
.canvas-main-contact-form .wpcf7-response-output { border-radius: 7px; font-family: "Inter", sans-serif; font-size: 13px; line-height: 1.4; margin: 15px 0 0 !important; padding: 10px 14px !important; }

/* =========================================================
   TABLET PORTRAIT
   ========================================================= */
@media (min-width: 769px) and (max-width: 1024px) { 
   .canvas-main-contact-form .canvas-form-field { margin-bottom: 17px; }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 768px) { 
   .canvas-main-contact-form .canvas-form-field { margin-bottom: 17px; }
   .canvas-main-contact-form label { font-size: 15px; margin-bottom: 8px; }
   .canvas-main-contact-form .canvas-form-input, .canvas-main-contact-form .canvas-phone-input, .canvas-main-contact-form .canvas-form-select { font-size: 14px; height: 48px; }
   .canvas-main-contact-form .canvas-form-textarea { font-size: 14px; height: 90px; min-height: 90px; }
   .canvas-main-contact-form .canvas-submit { font-size: 15px; height: 49px; line-height: 49px; }
}
/*---------------- Contact Page End ----------------*/

/*---------------- Reviews Page Start ----------------*/

/* =========================================================
  REVIEWS CARD START
   ========================================================= */

/********* REVIEWS TRACK *********/
.reviews-content-section { align-items: stretch; display: flex; flex-wrap: wrap; gap: 30px; max-width: none; transform: translate3d(0, 0, 0); transition: transform 0.8s ease; width: 100%; will-change: transform; }

/********* Accordion *********/
.faq-accordion .wpr-accordion-item-wrap { border-bottom: 1px solid #DADADA; }
.faq-accordion .wpr-acc-title-text { /*font-family: 'BonVivantSerif', serif !important;*/ }

/********* TABLET PORTRAIT *********/
@media (min-width: 881px) and (max-width: 1024px) { 
   .reviews-content-section { gap: 20px; }
   .reviews-content-section .review-card {  flex: 0 0 calc((100% - 20px) / 2); height: auto; max-width: none; width: calc((100% - 20px) / 2); }
}

/* =====================================================
   MOBILE LANDSCAPE / SMALL TABLET
   768px - 880px
===================================================== */
@media (min-width: 768px) and (max-width: 880px) { 
   .reviews-content-section .review-card { flex: 0 0 calc(50% - 30px); max-height: none; min-width: 0; width: calc(50% - 30px); }
}


/********* MOBILE *********/
@media (max-width: 767px) { 
   .reviews-content-section { gap: 12px; 
      /*
      * IMPORTANT:  * JavaScript controls the transform.
      * Do not add a negative mobile offset here.
      */
      transform: none; }
   .reviews-content-section .review-card { flex: 0 0 calc(100% - 3px); min-width: calc(100% - 3px);  width: calc(100% - 3px); }
}
/*---------------- Reviews Page End ----------------*/


/*---------------- Footer Start ----------------*/

/* =========================================
   ROOM BOOKING FORM START
========================================= */
.booking-form { width: 100%; }

/********* TWO COLUMN ROW *********/
.booking-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }

/********* FIELD *********/
.booking-field { width: 100%; }

/********* LABELS *********/
.booking-form label { color: #003B5C; display: block; font-family: "Inter", Sans-serif; font-size: 17px; font-weight: 500; line-height: 1; margin-bottom: 11px; }

/********* INPUTS + SELECT *********/
.booking-form input[type="text"],
.booking-form input[type="email"],
.booking-form input[type="tel"],
.booking-form select,
.booking-form textarea { background: rgba(255, 255, 255, 0.28); border: 1px solid #ffffff; border-radius: 10px; color: #003451CC; font-family: "Inter", Sans-serif; font-size: 15px; font-weight: 400; width: 100%; }

/********* INPUT HEIGHT *********/
.booking-form input[type="text"],
.booking-form input[type="email"],
.booking-form input[type="tel"],
.booking-form select { height: 48px; padding: 0 27px 0 10px; }

/********* TEXTAREA *********/
.booking-form textarea { height: 84px; min-height: 84px; padding: 16px 20px 16px 10px; resize: none; }

/********* PLACEHOLDER *********/
.booking-form input::placeholder,
.booking-form textarea::placeholder { color: #31566D; opacity: 1; }

/********* SELECT *********/
.booking-form select { appearance: auto; cursor: pointer; }

/********* FOCUS *********/
.booking-form input:focus,
.booking-form select:focus,
.booking-form textarea:focus { border-color: #ffffff; box-shadow: none; outline: none; }

/********* MESSAGE *********/
.booking-message { margin-bottom: 44px; width: 100%; }

/********* SUBMIT BUTTON *********/
.booking-submit { width: 100%; }
.booking-submit input[type="submit"] { background: #28543F; border: none; border-radius: 10px; cursor: pointer; color: #ffffff; font-family: "Inter", Sans-serif; font-size: 17px; font-weight: 400; height: 49px; padding: 0 20px; transition: all 0.25s ease; width: 100%; }

/********* BUTTON HOVER *********/
.booking-submit input[type="submit"]:hover { background: #214734; }

/********* REMOVE CF7 DEFAULT MARGINS *********/
.booking-form p { margin: 0; }

/* =========================================
   MOBILE
========================================= */
@media (max-width: 767px) { 
	.booking-row { grid-template-columns: 1fr; gap: 20px; margin-bottom: 20px; }
   .booking-form label { font-size: 18px; }
   .booking-form input[type="text"],
   .booking-form input[type="email"],
   .booking-form input[type="tel"],
   .booking-form select { height: 52px; }
   .booking-form textarea { height: 110px; min-height: 110px; }
   .booking-message { margin-bottom: 30px; }
}

.footer-header-custom-font .elementor-heading-title .custom-font-span { font-family: 'BonVivantSerif', serif !important; letter-spacing: 0; }

/********* TABLET PORTRAIT *********/
@media (min-width: 881px) and (max-width: 1024px) { 
   .footer-menu .elementor-icon-list-items { display: flex; flex-wrap: wrap; gap: 0 30px; }
   .footer-menu .elementor-icon-list-items .elementor-icon-list-item { flex: 0 0 calc(40% - 30px); max-width:  calc(40% - 30px); }
}


/* =========================================
   MOBILE
========================================= */
@media (max-width: 767px) { 
   .footer-contact-info .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-icon { display: none; }
   .footer-contact-info .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-text { padding-inline-start: 0; }
}

/* =========================================
   FIXED WHATSAPP BOX START
========================================= */
.whatsapp-fixed-box { background: #ffffff; border-radius: 5px; box-shadow: 0 4px 20px rgba(0,0,0,0.18); bottom: 19px; min-height: 64px; overflow: visible; position: fixed; right: 20px; width: 239px; z-index: 99999; }
.whatsapp-hidden { display: none; }

/* WhatsApp clickable area */
.whatsapp-content { align-items: center; color: #2d493c; display: flex; gap: 10px; min-height: 64px; padding: 19.5px 16px; text-decoration: none; }

/* Icon */
.whatsapp-icon { align-items: center; display: flex; justify-content: center; }
.whatsapp-icon img { height: 51px; width: 51px; }

/* Text */
.whatsapp-text { display: flex; flex-direction: column; line-height: 1.2; }
.whatsapp-label { color: #2F4F3E; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.whatsapp-number { color: #2F4F3E; font-size: 22px; font-weight: 700; white-space: nowrap; }

/* Close button */
.whatsapp-close { background: transparent; border: 0; color: #222222; cursor: pointer; font-size: 15px; line-height: 18px; height: 18px; margin: 0; padding: 0; position: absolute; right: 3px; top: 3px; width: 18px; z-index: 2; }
.whatsapp-close:hover { background: none; color: #000000; }

/* Hover */
.whatsapp-content:hover { color: #2d493c; text-decoration: none; }
/*---------------- Footer End ----------------*/