:root {
    --color-primary: #36B4B6;
    --color-secondary: #010101;
    --color-tertiary: #0f0d3e;
    --color-headline: #0D0D0D;
    --color-text: #303030;
    --color-light-text: #777777;
    --color-muted-text: #9291a5;
    --color-background-light: #f6f6f6;
    --color-white: #ffffff;
	
	--space-0: 0px!important;
	--space-5: 5px!important;
	--space-8: 8px!important;
	--space-10: 10px!important;
	--space-20: 20px!important;
	--space-30: 30px!important;
	--space-35: 35px!important;
	--space-40: 40px!important;
	
	--gap-0: 0px!important;
	--gap-5: 5px!important;
	--gap-10: 10px!important;
	--gap-15: 15px!important;
	--gap-20: 20px!important;
	--gap-40: 40px!important;
	
	--text-center: center!important;
	--text-left: left!important;
	--text-right: right!important;
	
	--margin-0: 0!important;
	--margin-1: 1em!important;
	--margin-0-5: 0.5em!important;
	--margin-1-1: 1.1em!important;
	--margin-1-2: 1.2em!important;
    --margin-1-5: 1.5em!important;
	--margin-1-8: 1.8em!important;
	--margin-2: 2em!important;
	--margin-4: 4em!important;
	
	--padding-0: 0!important;
	--padding-1: 1em!important;
	--padding-1-1: 1.1em!important;
	--padding-1-2: 1.2em!important;
	--padding-1-5: 1.5em!important;
	--padding-2: 2em!important;
	--padding-2-5: 2.5em!important;
	--padding-3: 3em!important;
	--padding-4: 4em!important;
	
	--height-0: 0!important;
	--height-0-5: 0.5em!important;
	--height-1: 1em!important;
	--height-1-1: 1.1em!important;
	--height-1-2: 1.2em!important;
	--height-2: 2em!important;
	--height-2-1: 2.1em!important;
	--height-2-2: 2.2em!important;
	--height-2-5: 2.5em!important;
	--height-3: 3em!important;
	--height-3-5: 3.5em!important;
	--height-4: 4em!important;
	--height-5: 5em!important;
	--height-6: 6em!important;

	/* special img variables */

	--width-3: 3em!important;
	--width-100: 100%!important;
	--height-auto: auto!important;
	
	--size-3: 3em!important;
	
	--v-height-5: 5vh!important;
	--v-height-10: 10vh!important;
	--v-height-20: 20vh!important;
	--v-height-40: 40vh!important;
	--v-height-60: 60vh!important;
	--v-height-65: 65vh!important;
	--v-height-80: 80vh!important;
	--v-height-100: 100vh!important;

    /* Typography Stack */
    --font-primary: "Figtree", sans-serif;
    --font-display: "Cormorant Garamond", serif;

      /* Text */
    --text-xs: clamp(0.69rem, 0.09vi + 0.67rem, 0.74rem);
    --text-s:  clamp(0.78rem, 0.21vi + 0.74rem, 0.89rem);
    --text-m:  clamp(0.88rem, 0.37vi + 0.80rem, 1.06rem);
    --text-l:  clamp(0.98rem, 0.57vi + 0.87rem, 1.27rem);
    --text-xl: clamp(1.11rem, 0.82vi + 0.94rem, 1.53rem);

    /* Headings */
    --heading-h6:    clamp(0.89rem, 0.19vi + 0.85rem, 0.99rem);
    --heading-h5:    clamp(1.00rem, 0.22vi + 0.96rem, 1.11rem);
    --heading-h4:    clamp(1.13rem, 0.24vi + 1.08rem, 1.25rem);
    --heading-h3:    clamp(1.27rem, 0.27vi + 1.21rem, 1.41rem);
    --heading-h2:    clamp(1.42rem, 0.31vi + 1.36rem, 1.58rem);
    --heading-h1:    clamp(1.60rem, 0.35vi + 1.53rem, 1.78rem);
    --heading-title: clamp(1.80rem, 0.39vi + 1.72rem, 2.00rem);
	
	--light-300: 300!important;
	--regular-400: 400!important;
	--medium-500: 500!important;
	--bold-700: 700!important;
	
}

.logo-wrapper svg {
  color: #010101;
  height: 42px;
  width: auto;
}

@media (max-width: 1024px) {
  .logo-wrapper svg {
    height: 40px;
  }
}

.logo-wrapper a {
  display: flex;
  line-height: 0;
  transition: opacity 0.2s ease;
}

.logo-wrapper a:hover {
  opacity: 0.85;
}

.navigation-logo {
    width: 210px;
    margin-inline: auto;
    padding-top: 3rem;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
    opacity: 0.6;
    text-decoration: none;
}
.responsive {width: 100%; height: auto;}
.grecaptcha-badge { visibility: hidden; }

/* Booking Widget */
.guesty-widget__container {
    background: white !important;
    padding: 0.75rem 1rem !important;
    border-radius: 12px !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.guesty-widget__item.cities-dropdown {
    display: none !important;
}

.guesty-widget__item {
    flex: 2 !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.guesty-widget__item.guests-dropdown {
    flex: 1 !important;
}

.guesty-widget__item:last-child {
    flex: 0 0 auto !important;
}

#guesty-search-widget__datepicker {
    display: flex !important;
    flex-direction: row !important;
    gap: 0.5rem !important;
    align-items: center !important;
    width: 100% !important;
}

#guesty-search-widget__datepicker > div {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
}

/* Uniform height across all three fields */
.guesty-root-element #guesty-search-widget__datepicker .__super-input,
.guesty-root-element .selectr-selected,
.guesty-widget__container .guesty-search-submit-btn {
    box-sizing: border-box !important;
    height: 47.48px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Check-in / Check-out */
.guesty-root-element #guesty-search-widget__datepicker .__super-input {
    padding-left: 15px !important;
    padding-right: 15px !important;
    border: 1px solid #E2E8F0 !important;
    width: 100% !important;
}

/* Guests dropdown */
.guesty-root-element .selectr-selected {
    padding-left: 20px !important;
    padding-right: 52px !important;
    border: 1px solid #E2E8F0 !important;
    top: 0 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* Dropdown label vertical centering */
.guesty-root-element .selectr-selected .selectr-label {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.guesty-widget__container .selectr-container {
    width: 100% !important;
}

/* Search button */
.guesty-widget__container .guesty-search-submit-btn {
    padding-left: 20px !important;
    padding-right: 20px !important;
    width: 100% !important;
}

/* Tablet: stack to column, halved gap */
@media (max-width: 768px) {
    .guesty-widget__container {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.25rem !important;
        padding: 0.75rem !important;
    }

    .guesty-widget__item {
        width: 100% !important;
        flex: unset !important;
    }

    .guesty-widget__container .guesty-search-submit-btn {
        width: 100% !important;
    }

    /* Override Guesty's .small-size rules */
    .guesty-root-element.small-size .guesty-widget__item {
        width: 100% !important;
        margin: 0 !important; /* remove Guesty's 15px top/bottom margin */
    }

    .guesty-root-element.small-size .guesty-widget__item .selectr-container,
    .guesty-root-element.small-size .guesty-widget__item #guesty-search-widget__datepicker,
    .guesty-root-element.small-size .guesty-widget__item .guesty-search-submit-btn {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Even spacing: use padding on container instead of item margins */
    .guesty-root-element.small-size .guesty-widget__container {
        padding: 15px !important; /* matches Guesty's original 15px, now applied evenly on all sides */
        gap: 0.5rem !important;
    }
}
/* end of widget */

div.my_team_social_link {
    color: #C0C0C0 !important;
    text-align: center !important;
    font-size: 18px !important;
    line-height: 1 !important;
    border-radius: 50% !important;
    padding: 16px !important;
    background: var(--color-content-bg) !important;
}
div.my_team_social_link a {color: #C0C0C0 !important;}
.my_team_social_link a:hover, .my_team_social_link:hover, .my_team_social_link:hover a {
    color: #FFFFFF!important;
    background: var(--color-verdigris) !important;
}
div.my_outer_main_box, div.my_outer_main_box_green {
	margin-top: 0.6rem!important; margin-bottom: 0.6rem!important;
}

div.my_outer_main_box div.vc_column-inner {
    margin-left: 1.2rem !important;
    margin-right: 1.2rem !important;
    padding-top: var(--height-2-5) !important;
    padding-bottom: var(--height-5) !important;
}

div.my_outer_main_box_green div.vc_column-inner {margin-left: 1.2rem !important; margin-right: 1.2rem !important; padding-top: var(--height-2-5) !important; padding-bottom: var(--height-5) !important;}
div.my_outer_main_box div.my_main_box div.w-iconbox-title {color: var(--color-content-heading)!important;}
div.my_outer_main_box_green div.my_main_box div.w-iconbox-title {color: var(--color-seasalt)!important;}
div.my_main_box { }
.icon-box-heading div.w-iconbox-title {font-size: var(--heading-h6)!important; text-transform: uppercase!important; font-weight: var(--bold-700)!important; font-family: var(--h2-font-family)!important;}
div.my_main_box a.w-iconbox-link div.w-iconbox-icon, div.my_main_box a.w-iconbox-link:hover div.w-iconbox-icon {background-color: #FFFFFF!important;}
div.my_main_box a.w-iconbox-link div.w-iconbox-icon {line-height: 90px!important; height: 90px!important; width: 90px!important;}
div.my_main_box a.w-iconbox-link div.w-iconbox-icon {color: #FFFFFF!important;}
div.my_main_box div.w-iconbox-title {padding-top: var(--height-1)!important; padding-bottom: var(--height-0-5)!important; text-transform: uppercase; font-family: var(--h2-font-family)!important;
	font-weight: var(--h2-font-weight)!important;}
div.my_main_box div.w-iconbox-text {padding-bottom: var(--height-1)!important; padding-top: var(--height-0-5)!important;}

.service_list_btn {
    -webkit-transform: translate(-50%, -70%);
    -moz-transform: translate(-50%, -70%);
    -ms-transform: translate(-50%, -70%);
    -o-transform: translate(-50%, -70%);
    transform: translate(-50%, -70%);
}

ul.my_ul {margin-left: 1.5rem!important;}
ul.my_ul li {text-align: left!important;}
ul.my_ul li::marker {content: "\f058  "; color: #36B4B6; font-family: "fontawesome"; font-weight: var(--light-300); font-size: var(--text-m)!important;}

li span.content {position: relative; left: 0.5rem;}
div.my_special_container {text-align: center;}
div.my_special_container ul.my_ul_white {display: table; text-align: left; margin-left: auto; margin-right: auto;}
ul.my_ul_white {margin-left: 2.5rem!important;}
ul.my_ul_white li::marker {content: "\f058"; color: #FFFFFF; font-family: "fontawesome"; var(--light-300);}

ul.my_ul_2_col {margin-left: 1.5rem!important;}
ul.my_ul_2_col li {margin-right: 2.5rem!important;}
ul.my_ul_2_col li::marker {content: "\f058  "; color: #36B4B6; font-family: "fontawesome"; font-weight: var(--light-300);}
ul.my_ul_2_col {columns: 2; -webkit-columns: 2; -moz-columns: 2;}


.my_special_link_one:hover {background-color: var(--color-seasalt)!important; color: var(--color-verdigris)!important;}
.my_special_link_two:hover {background-color: var(--color-verdigris)!important; color: var(--color-white)!important;}
div.my-bread-crump {font-size: var(--text-s)!important;}
a.my-home-bc {font-weight: 700; text-decoration: none; color: var(--color-verdigris)!important;}
.my_single_post_content h2, .my_single_post_content h3, .my_single_post_content h4, .my_single_post_content h5, .my_single_post_content h6 {padding-top: 0!important; padding-bottom: 1.5rem!important;}
.my_single_post_content p {font-size: var(--text-s)!important;}
.my_single_post_content ul, .my_single_post_content li  {font-size: var(--text-s)!important;}

div.small-icon-box {margin-bottom: 1.2rem!important;}
/*div.small-icon-box svg path.cls-1 {stroke: #FFFFFF!important;}*/

section.my_zero_margin_row div.vc_column_container {margin-bottom: 0!important; margin-bottom: 0!important;}
section.my_zero_margin_row .g-cols.via_flex.type_default>div[class*="vc_col-md-"], .g-cols.via_flex.type_default>div[class*="vc_col-lg-"] {margin-bottom: 0!important; margin-bottom: 0!important;}

div.my_footer_links a {color: var(--color-white)!important;}
div.my_footer_links a:hover span {border-bottom: 1px solid!important;}

div.my_recent_posts h2 {padding-bottom: var(--height-2-2)!important;}

.my_side_bar .w-iconbox-text {margin-left: var(--margin-1-5)!important; margin-right: var(--margin-1-5)!important;}
.my_green_box i {position: absolute!important; right: var(--padding-1)!important;}
.my_gray_box i {position: absolute!important; right: var(--padding-1)!important;}
@media (max-width: 600px) {
    .my_green_box i {position: absolute!important; right: var(--padding-3)!important;}
	.my_gray_box i {position: absolute!important; right: var(--padding-3)!important;}
}
.my_green_box:hover {background: var(--color-verdigris)!important; color: var(--color-white)!important; }
.my_gray_box:hover {background: var(--color-seasalt)!important; color: var(--color-verdigris)!important;}

.my_social_footer a.w-socials-item-link {line-height: 3rem!important; width: 3rem!important;}
div.my_social_footer .w-socials-item-link {
    background-color: #40484A!important;
    color: #FFFFFF!important;
}

div.my_social_footer .w-socials-item-link:hover {
    background-color: #36B4B6!important;
    color: #FFFFFF!important;
}

div.my_social_footer .w-socials-item.instagram .w-socials-item-link-hover,
div.my_social_footer .w-socials-item.facebook .w-socials-item-link-hover {
    background: var(--color-verdigris)!important;
}

.my_whatsapp {
    float: none;
    margin-right: 0;
    margin-left: 0;
}
span.message_whatsapp {font-size: 80%;}

.gform_confirmation_message, .form_saved_message_sent {font-size: var(--text-m)!important; color: var(--color-verdigris)!important;}
.gform_required_legend {font-size: var(--text-s) !important; padding-bottom: var(--padding-1) !important;}

/* Accommodation Section CSS */

.main-accommodation-tagline {
    font-family: var(--font-primary);
    font-size: var(--heading-h4);
    font-weight: 300;
    margin-inline: auto;
    text-align: center;
}

.main-accommodation-title {
    font-family: var(--font-display);
    font-size: var(--heading-h1);
    font-weight: 500;
    margin-inline: auto;
    text-align: center;
}

.main-accommodation-intro {
    font-family: var(--font-primary);
    font-size: var(--text-m);
    font-weight: 400;
    width: 100%;
    margin-inline: auto;
}

@media (min-width: 1025px) {
    .main-accommodation-intro {
        font-family: var(--font-primary);
        font-size: var(--text-m);
        font-weight: 400;
        width: 70%;
        margin-inline: auto;
    }  
}

.main-accommodation-sub-title {
    font-family: var(--font-display);
    font-size: var(--heading-h2);
    font-weight: 500;
    margin-inline: auto;
    text-align: center;
}

/* Accommodation Listing Grid */

:root {
    --card-radius: 0;
    --card-padding: 1rem;
    --card-gap: .75rem;
    --card-gap-lg: 1rem;
    --card-bg: #fff;
    --card-text: #242428;
    --card-muted: #6b7280;
    --card-border: #e5e7eb;
    --btn-bg: #36B4B6;
    --btn-bg-hover: #059e8e;
    --btn-text: #fff;
    --shadow-1: 0 10px 20px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.06);
}

.listing-grid .w-grid-item-h {
    background: #f5f5f5;
    color: var(--card-text);
    /*border-radius: var(--card-radius);*/
    /*box-shadow: var(--shadow-1);*/
    overflow: hidden
}

.listing-grid .listing-card__inner {
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    gap: var(--card-gap)
}

.listing-grid .blog-post__inner {
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    gap: var(--card-gap)
}

.listing-grid .listing-card__media {
    aspect-ratio: 3 / 2;
    overflow: hidden
}

.listing-grid .listing-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.listing-grid .listing-card__title {
    padding: 0 var(--card-padding);
    margin: 0;
    font-size: clamp(1.08rem, 1.0182rem + 0.1647vw, 1.15rem);
    line-height: 1.25;
    font-weight: 700
}

.listing-grid .listing-card__location {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 0 var(--card-padding);
    color: var(--color-dark, #121212);
    font-size: .9375rem
}

.listing-grid .listing-card__location .fa-map-marker-alt {
    font-size: 1rem;
    line-height: 1;
    opacity: .9
}

.listing-grid .listing-card__content {
    padding: 0 var(--card-padding);
    font-size: .9375rem
}

.listing-grid .listing-card__features {
    display: flex;
    gap: 0;
    padding: .75rem var(--card-padding) 0;
    border-top: 1px solid var(--card-border);
    justify-content: space-between;
    flex-wrap: wrap;
    color: var(--card-text)
}

.listing-grid .listing-card__features .listing-feature {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: .35rem;
    font-size: .875rem;
    min-width: 0
}

.listing-grid .listing-card__features .listing-feature svg {
    width: 1.45rem;
    height: 1.45rem;
    flex: 0 0 1.45rem;
    display: block;
    color: inherit;
    opacity: .95
}

.listing-grid .listing-card__features .listing-feature__value {
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .78rem
}

.listing-grid .listing-card__button {
    margin: .75rem var(--card-padding) var(--card-padding);
    display: block;
    text-align: center;
    width: auto;
    padding: 1.0em 2.0em;
    border-radius: 50px;
    background: var(--btn-bg);
    color: var(--btn-text);
    font-weight: 700;
    text-decoration: none;
    transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
}

.listing-grid .listing-card__button:hover {
    background: var(--btn-bg-hover);
    transform: translateY(-1px)
}

.listing-grid .listing-card__button:active {
    transform: translateY(0)
}

.listing-grid .blogpost-card_cta {
    margin: .75rem var(--card-padding) var(--card-padding)
}

.listing-grid .listing-card__features .w-html {
    display: contents;
}

/* ═══════════════════════════════════════════════
   Service Grid
   Styles for the CPT 'service' grid on the
   homepage/services section. 3-column layout
   with light-gray (cols 1-2) and turquoise
   (col 3) card variants.
   ═══════════════════════════════════════════════ */

/* ── Background per position ─────────────────── */
.service-grid .w-grid-item:nth-child(1),
.service-grid .w-grid-item:nth-child(2) {
    background-color: #f5f5f5;
}

.service-grid .w-grid-item:nth-child(3) {
    background-color: #36B4B6;
}

/* ── Grid item inner spacing ─────────────────── */
.service-grid .w-grid-item-h {
    padding: var(--height-2-5) 1.2rem var(--height-2-5);
    height: 100%;
}

/* ── Vwrapper as flex column for button alignment ── */
.service-grid .service-item {
    display: flex !important;
    flex-direction: column;
    height: 100%;
}

/* ── Title ────────────────────────────────────── */
.service-grid .service-title,
.service-grid .service-title a {
    color: #303030 !important;
    padding-top: var(--height-1) !important;
    padding-bottom: var(--height-0-5) !important;
    font-size: var(--heading-h4);
    text-transform: uppercase;
    font-family: var(--h2-font-family) !important;
    font-weight: var(--h2-font-weight) !important;
}

/* ── Content ──────────────────────────────────── */
.service-grid .service-content,
.service-grid .service-content p {
    color: #303030 !important;
    padding-bottom: var(--height-1) !important;
    padding-top: var(--height-0-5) !important;
    font-size: var(--text-s);
    flex: 1;
}

/* ── Turquoise text overrides ─────────────────── */
.service-grid .w-grid-item:nth-child(3) .service-title a,
.service-grid .w-grid-item:nth-child(3) .service-content p {
    color: #fff !important;
}

/* ── Icon white circle ────────────────────────── */
.service-grid .service-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.service-grid .service-icon svg {
    width: 48px;
    height: 48px;
    color: #36B4B6;
}

/* ── Button aligned to bottom ─────────────────── */
.service-grid .service-button {
    margin-top: auto !important;
}

/* ── 3rd card button ──────────────────────────── */
.service-grid .w-grid-item:nth-child(3) .service-button {
    background-color: #f6f6f6 !important;
    color: #303030 !important;
}

.service-grid .w-grid-item:nth-child(3) .service-button:hover {
    background-color: var(--btn-hover-background) !important;
    color: #ffffff !important;
}

/* Icon box item layout */
.icon-box-item {
  display: flex;
  align-items: flex-start;
}

/* SVG icon size and color */
.icon-box-icon svg {
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
  color: #36B4B6;
}

/* Title */
.icon-box-title {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #1a1a1a;
  line-height: 1.3;
}

/* Content text */
.icon-box-content {
  font-size: 0.9rem;
  line-height: 1.7;
  color: #444;
}

.icon-box-content p {
  margin: 0 0 0.8em;
}

.icon-box-content p:last-child {
  margin-bottom: 0;
}