:root {
    --fs-body: clamp(16px,2vw,18px);
    --fs-h1: clamp(32px,5vw,36px);
    --fs-h2: clamp(28px,4vw,32px);
    --fs-h3: clamp(24px,3.5vw,28px);
    --fs-h4: clamp(24px,3.5vw,28px);
    --fs-h5: clamp(18px,2.5vw,22px);
    --fs-h6: clamp(16px,2vw,20px);
}



h1 {
    font-size: var(--fs-h1);
    line-height: 120%;
    margin-bottom: 1.5rem;
    margin-top: 2rem;
}

h2 {
    font-size: var(--fs-h2);
    line-height: 120%;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}

h3 {
    font-size: var(--fs-h3);
    line-height: 110%;
    margin-bottom: 0.5rem;
    margin-top: 1rem;
    letter-spacing: 0.02em;
}

h4 {
    font-size: var(--fs-h4);
    line-height: 120%;
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

h5 {
    font-size: var(--fs-h5);
    line-height: 110%;
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

h6 {
    font-size: var(--fs-h6);
    font-weight: 400;
    line-height: 110%;
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

html {
    font-size: var(--fs-body);
}

p {
    font-size: var(--fs-body);
    line-height: 120%;
}

select {
    font-size: 1rem;
}

#gridsearchbut {
    font-size: 1rem;
}

#menu-sub-footer {
    font-size: 0.7rem;
}

#menu-useful-links li {
    font-size: var(--fs-h6);
}

#reset-button {
    font-size: 1rem;
}

.accordion-header {
    font-size: 1.4em;
    font-weight: 700;
    line-height: 120%;
}


.infoheadertitle {
  font-size: clamp(1rem, 5vw, 2rem);
  line-height: 1.1;
    font-weight: 700;
    line-height: 110%;
}

.additionaltags div[class*="desc_"] {
    font-size: 1.2rem;
}

.additionaltags div[class*="tag_"] {
    font-size: 1.4rem;
}

.banner-headline h2 {
    font-size: 2.4rem;
    letter-spacing: 0.02em;
    line-height: 2.2rem;
    margin-top: 0px;
}

.banneremail, .bannerloc, .bannertel {
    font-weight: 700;
}

.bookingbutton {
    font-size: 32px;
}

.bookingbutton a {
    font-size: 32px;
}

.box1buttons .button {
    line-height: 110%;
}

.box1buttons a {
    font-size: 1.2rem;
    font-weight: 600;
}

.box1content h3, .box1content p {
    font-size: var(--fs-h5);
    line-height: 120%;
}

.box1title h2 {
    font-size: 2.4rem;
    letter-spacing: 0.02em;
    line-height: 120%;
    margin-top: 0px;
}

.caption-overlay {
    font-size: .8rem;
}

.contact-banner .button {
    font-size: 1.2rem;
    font-weight: 600;
}

.contentall p {
    font-size: 1.4em;
    line-height: 120%;
}

.contentsectionmore a {
    font-weight: 700;
}

.contenttitle {
    font-size: 1.6em;
    font-weight: 700;
}

.custom-infowindow {
    font-family: 'effra-cc', sans-serif;
    font-size: var(--fs-h3);
    line-height: 110%;
    letter-spacing: 0.02em;
}

.custom-infowindow .ciw-text {
    font-size: 1rem;
}

.custom-infowindow .ciw-title {
    font-size: 1.2rem;
}

.custom-infowindow .ciw-title a {
    font-family: 'effra-cc', sans-serif;
    font-size: 1.1em;
}

.custom-infowindow h3 {
    font-size: 0.9em;
}

.custom-post-base-content {
    font-weight: 300;
}

.custom-post-date-big {
    font-weight: 500;
}

.custom-post-main-content {
    font-size: clamp(14px, 1vw, 17px);
    line-height: clamp(16px, 1.2vw, 19px);
    margin: 0px;
   
}

.custom-post-main-content a {
    font-size: clamp(14px,0.9vw,17px);
   line-height: clamp(16px, 1.2vw, 19px);
    margin: 0px;
}


.custom-post-tag {
    font-size: .8rem;
}

.custom-post-title a {
    color: #509E2F;
    font-size: var(--fs-h3);
    font-weight: 600;
    line-height: 110%;
    text-decoration: none;
     letter-spacing: 0.02em;
}




.custom-select span {
    font-size: 1em;
    font-weight: 600;
}

.duo-post-content {
    font-size: 2em;
    font-weight: 700;
    line-height: 110%;
}

.eachmenulink h3 {
    font-size: 2vmax;
    font-weight: bold;
     letter-spacing: 0.02em;
}

.eventheaderdetails .eventheaderdetailstext {
    font-size: 1.5rem;
}

.eventheaderdetailstext {
    font-size: 1.2rem;
    line-height: 120%;
    font-weight: 700;
}

.eventtag {
    font-size: 1.2rem;
}

.footer-copyright {
    font-size: 0.7rem;
}

.footer-copyright p {
    font-size: 0.7rem;
}

.footer1 h3 {
    font-size: 32px;
     letter-spacing: 0.02em;
}

.footer1 h5 {
    font-size: 1.2em;
    font-weight: 400;
}

.footer4 p {
    font-size: .8rem;
}

.footerbutton button {
    font-size: 32px;
}

.formbuttons {
    font-size: 1rem;
}

.formprivdiv a {
    font-size: .8em;
}

.formsearchdate {
    font-size: 1rem;
}

.formsearchdate input[type="text"] {
    font-size: 1rem;
}

.formsearchdate span {
    font-size: 1em;
    font-weight: 600;
}

.fullscreen-menu .resourcemenu .resourceslink a {
    font-size: 1.4em;
}

.fullscreen-menu-buttons button {
    font-size: 1rem;
    font-weight: 600;
}

.fullscreen-navigation .fullscreen-menu-itrems a {
    font-size: 1.4rem;
}

.gfield_description {
    font-size: var(--fs-body) !important;
}

.gform-body label {
    font-size: var(--fs-body) !important;
}

.gform-body legend {
    font-size: var(--fs-body) !important;
}

.gform-footer input[type="submit"] {
    font-size: 1rem;
}

.gform-page-footer input[type="button"] {
    font-size: 1rem;
}

.gform-page-footer input[type="submit"] {
    font-size: 1rem;
}

.gform_confirmation_wrapper {
    font-size: 1.5rem;
}

.gform_wrapper.gravity-theme .gform_validation_errors {
    font-size: 1.5rem;
}

.ginput_container select {
    font-size: 1rem !important;
}

.ginput_container_number .instruction {
    display: none;
}

.gridsearchtext {
    font-size: 1rem;
}

.gsection_description {
    font-size: var(--fs-body) !important;
}

.header-ref p {
    line-height: 90%;
}

.headerbuttonlink a {
    font-size: 1.3rem;
    font-weight: bold;
}

.headerintro {
    font-size: clamp(1rem,1.8vh + 1rem,1.4rem);
    font-weight: 700;
    line-height: 110%;
    opacity: .9;
}

.headerintro1 {
    font-size: clamp(1rem,1.8vh + 1rem,1.4rem);
    font-weight: 700;
    line-height: 110%;
    opacity: .8;
}

.headerintro2 {
    font-size: clamp(1rem,1.8vh + 1rem,1.4rem);
    font-weight: 700;
    line-height: 110%;
    opacity: .9;
}



.headertitle.head3 {
    font-size: clamp(1.4rem, calc(5vh + 1rem), 2.4rem);
    font-weight: 700;
    text-align: center;
    width: auto;
}

.hero-caption {
    font-size: 0.7em;
}

.info_links_title {
    font-size: 1.5rem;
    font-weight: 700;
}

.kml-toggle-container button {
    font-size: 0.7rem;
    font-size: 0.8rem;
    line-height: 1rem;
}

.layout-toggle-buttons button {
    font-size: 0.8rem;
   line-height: 1rem;
}

.link-banner .button {
    font-size: 1.2rem;
    font-weight: 700;
}

.links-file-container {
    font-size: 1.2em;
    font-weight: 700;
}




.locheaderlink {
    font-size: 1rem;
    font-weight: 500;
}

.locheaderlink a {
    font-size: .9rem;
    font-weight: 500;
}

.mapcontrol {
    font-size: 0.8rem;
}

.mapintro1 {
    font-size: 1.4rem;
    font-size: 2rem;
    font-weight: 300;
    font-weight: 700;
    line-height: 1.6rem;
}

.mapintro2 {
    font-size: 1.4rem;
    line-height: 120%;
}

.menu-search-input {
    font-size: 14px;
}

.menu-search-submit {
    font-size: 20px;
}

.menunav {
    font-size: 1.5rem;
    line-height: 1.6rem;
}

.nid-caption-overlay {
    font-size: .8rem;
}

.normalgridtitle h3 {
    font-size: 2em;
    font-weight: 700;
    line-height: 110%;
    margin: 0px;
    padding: 40px 0px 20px 0px;
}

.osrefdiv {
    font-size: 1rem;
    font-weight: 500;
}

.overlay h3 {
    font-size: 1.4rem;
    font-weight: bold;
     letter-spacing: 0.02em;
}

.overlay p {
    color: #fff;
    font-size: 1.2rem;
}

.place-toggle-container button {
    font-size: 0.7rem;
    font-size: 0.8rem;
    line-height: 1rem;
}

.primarytext a {
    font-size: 1.2rem;
    font-weight: 600;
}

.primarytext li {
    font-size: 1.2rem;
}

.primarytext p {
    font-size: 1.2rem;
}

.primarytext strong {
    font-weight: 700;
}

.priority-post .custom-post-main-content a {
    font-size: 1.1rem;
    line-height: 120%;
}

.priority-post .custom-post-title a {
     font-size: 2.4rem;
    line-height: 2.4rem;
}

.priority-post .custom-post-title p {
     font-size: 2.4rem;
    line-height: 2.4rem;
}

.prioritygridtitle {
    font-size: 1.2rem;
    font-weight: 700;
}

.search-input {
    font-size: 14px;
}

.search-submit {
    font-size: 20px;
}

.slideheaderintro1 {
   font-size: clamp(0.75rem, 3.5vw, 1.4rem);
    font-weight: 700;
    line-height: 110%;
    opacity: 0.8;
    margin-bottom: 10px;
}

.slideheadertitle {
   font-size: clamp(1rem, 5vw, 2.8rem);
    font-weight: 700;
    line-height: 110%;
    margin-bottom: 15px;
}

.slideheaderlink {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    text-align: right;
}

.slidercontrols .hero-description {
    font-size: clamp(.8rem, 3vw, 1.2rem);
    font-weight: 400;
}

.slidercontrols .sliderheadertext {
   font-size: clamp(1rem, 5vw, 2.4rem);
    font-weight: 700;
}

.slidercontrols p {
    font-size: 1rem;
}

.three-col.left-col * {
    font-size: 1.3em;
}

.three-col.middle-col * {
    font-size: 1.3em;
}

.three-col.right-col * {
    font-size: 1.3em;
}

.wwwrefdiv {
    font-size: 1rem;
    font-weight: 500;
}

.sidemenutitle h3 {
    font-size: var(--fs-h4);
    line-height: 120%;
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

@container slidebox (max-width: 280px) {
    .slideheaderintro1 {
        font-size: 1.2rem line-height: 110%;
        font-weight: 700;
        margin-right: 20px;
    }

    .slideheadertitle {
        font-size: 1.8rem;
    }
}

@container slidebox (max-width: 320px) {
    .slideheaderintro1 {
        font-size: 1.4rem;
    }

    .slideheadertitle {
        font-size: 2rem;
    }
}

@container slidebox (max-width: 400px) {
    .slideheaderintro1 {
        font-size: 1.6rem;
    }

    .slideheadertitle {
        font-size: 2.4rem;
    }
}

@media (max-width: 480px) {
    :root {
        --fs-body: clamp(14px,3vw,16px);
        --fs-h1: clamp(22px,7vw,26px);
        --fs-h2: clamp(20px,6vw,24px);
        --fs-h3: clamp(18px,5vw,22px);
        --fs-h4: clamp(16px,4vw,20px);
        --fs-h5: clamp(14px,3.5vw,18px);
        --fs-h6: clamp(12px,3vw,16px);
    }

    .custom-infowindow .ciw-text {
        font-size: 0.9rem;
    }

    .custom-infowindow .ciw-title {
        font-size: 1.1rem;
    }
}

@media (max-width: 768px) {
    :root {
        --fs-body: clamp(14px,3vw,16px);
        --fs-h1: clamp(28px,6vw,32px);
        --fs-h2: clamp(24px,4.5vw,28px);
        --fs-h3: clamp(22px,3.5vw,24px);
        --fs-h4: clamp(18px,3vw,22px);
        --fs-h5: clamp(16px,2.5vw,20px);
        --fs-h6: clamp(14px,2vw,18px);
    }
}

@media screen and (max-width: 768px) {
    .custom-post-tag {
        font-size: .8rem;
    }

    .custom-post-title a {
        font-size: 1.6rem;
        font-weight: 600;
        line-height: 110%;
    }

.custom-post-main-content {
       font-size: 1rem;
        line-height: 125%;
    margin: 0px;
   
}
    
    .custom-post-main-content a {
        font-size: 1.1rem;
        line-height: 100%;
    }



    .footer1 h3 {
        font-size: 26px;
         letter-spacing: 0.02em;
    }

    .footer1 h5 {
        font-size: 20px;
    }

    .footer4 p {
        font-size: 1rem;
    }

    .headerbuttonlink a {
        font-size: 1.3rem;
        font-weight: bold;
    }

    .headerlink {
        font-size: 1rem;
        font-weight: 500;
    }
    .infoheadertitle {
        font-size: clamp(3rem, 15vw, 3rem);
        line-height: 1.1;
        font-weight: 700;
        line-height: 110%;
    }
    .menunav {
        font-size: 1.5rem;
        line-height: 1.6rem;
    }

    .slidercontrols .sliderdetails {
        font-size: 0.8rem;
    }

    .slidercontrols .sliderheadertext {
        font-size: 1.2rem;
    }

    .slidercontrols p {
        font-size: 0.8rem;
    }
}


.locationcontentbox,
.midlocationcontentbox,
.mobilecontentbox {
  container-type: inline-size;  
  container-name: overlaybox;

  box-sizing: border-box;
  display: flex;
  flex-direction: column;

  padding: 32px 42px 32px 28px;
  gap: 20px;

  
  overflow: visible;
  z-index: 10;
}



@media (min-width: 1061px){
  .locationcontentbox{
    position: absolute;
    top: 100px;
    left: 40px;
    border-radius: 22px;
    width: clamp(340px, 36vw, 500px);
   min-height: clamp(200px, 32vh, 380px);
    max-height: clamp(360px, 42vh, 520px); /* allow breathing room */
    height: auto;
  }
  .midlocationcontentbox,
  .mobilecontentbox{ display: none; }
}


@media (min-width: 769px) and (max-width: 1060px){
  .midlocationcontentbox{
    display: flex;
    position: absolute;
    border-radius: 22px;
    top: 90px;
    left: 40px;
    width: clamp(320px, 44vw, 560px);
  min-height: clamp(200px, 30vh, 340px);
    max-height: clamp(340px, 40vh, 480px);
    height: auto;
  }
  .locationcontentbox,
  .mobilecontentbox{ display: none; }
}


@media (max-width: 768px){
  .mobilecontentbox{
    display: flex;
    position: relative;
    width: 100%;
    height: auto;
    padding: 18px 16px;
  overflow: visible; 
  }
  .locationcontentbox,
  .midlocationcontentbox{ display: none; }
}


/* ===== Base fallback (no container units) ===== */
.headertitle{
  font-size: clamp(2.7rem, 5.0vw, 4.2rem);
  font-weight: 800;
  line-height: 1.02;
}

.locationintro{
  font-size: clamp(1.4rem, 2.8vw, 2.1rem);
  font-weight: 650;
  line-height: 1.22;
  max-width: 34ch;
}

/* ===== Container-query upgrade (preferred when supported) ===== */
@supports (font-size: 1cqw) {
  .headertitle{
    font-size: clamp(2.9rem, 13cqw, 4.4rem);
  }
  .locationintro{
    font-size: clamp(1.45rem, 7.0cqw, 2.2rem);
  }
}

/* ===== Mobile (slightly smaller, still strong) ===== */
@media (max-width: 768px){
  .mobilecontentbox .headertitle{
    font-size: clamp(2.2rem, 7.2vw, 2.9rem);
  }
  .mobilecontentbox .locationintro{
    font-size: clamp(1.15rem, 4.4vw, 1.4rem);
  }
}

/* ===== Desktop overlay extra punch (your “designer spec” tuning) ===== */
@supports (font-size: 1cqw) {
  @media (min-width: 1061px){
    .locationcontentbox .headertitle{
      font-size: clamp(3.2rem, 12cqw, 4.6rem);
    }
    .locationcontentbox .locationintro{
      font-size: clamp(1.5rem, 7.4cqw, 2.3rem);
    }
  }
}


.headertitle,
.locationintro{
  overflow-wrap: anywhere;
}

@media (max-width: 768px){
  .singlecontentcontainer{
    overflow: visible; /* was hidden */
  }
}

.mobilecontentbox{
  min-height: fit-content;
}

@media (max-width: 768px) {
  .mobilecontentbox {
    display: flex;
    position: relative;
    width: 100%;
       /* Fixed mobile header height: intentional for layout stability 
    height: 160px; */
    min-height: 140px; /* safety net */
    overflow: visible;
  }
}

@media (max-width: 768px) {
  .mobilecontentbox {
    padding: 16px 16px;
    gap: 8px;
  }
}



@media screen and (max-width: 1368px) {
.contentbox2, .contentbox3 {
    width: 60%;
    display: flex;
    overflow: hidden;
    padding: 30px 30px 20px 30px;
    border-radius: 22px;
}
.Headerimage {
    border-radius: 0px 0 0 0px;
    flex: 1;
    height: 86vh;
    overflow: hidden;
    position: relative;
}
.singleheaderimage {
    border-radius: 0px 0 0 0px;
    flex: 1;
    height: 86vh;
    overflow: hidden;
    position: relative;
}

    
    
}



@media screen and (max-width: 1368px) {
.contentbox2, .contentbox3 {
    width: 60%;
    display: flex;
    overflow: hidden;
    padding: 30px 30px 20px 30px;
    border-radius: 22px;
}
.Headerimage {
    border-radius: 0px 0 0 0px;
    flex: 1;
    height: 76vh;
    overflow: hidden;
    position: relative;
}
.singleheaderimage {
    border-radius: 0px 0 0 0px;
    flex: 1;
    height: 86vh;
    overflow: hidden;
    position: relative;
}

    
    
}




@media (min-height: 621px) and (max-height: 800px) {
.Headerimage, .singleheaderimage {
    height: 72dvh !important;
  }
    
    .locationcontentbox, .midlocationcontentbox {
        width: 50%;
    }
            .locationcontentbox .headertitle,  .midlocationcontentbox .headertitle {
            font-size: clamp(2.4rem, 8.8cqw, 2.8rem);

}
    
    .locationcontentbox .locationintro,     .midlocationcontentbox .locationintro {
            font-size: clamp(1.1rem, 5.2cqw, 1.8rem);
        }
    }

@media (min-height: 431px) and (max-height: 620px) {
.Headerimage, .singleheaderimage {
    height: 86dvh !important;
  }
    
    .locationcontentbox, .midlocationcontentbox {
    width: 50%;
    }
            .locationcontentbox .headertitle,  .midlocationcontentbox .headertitle {
            font-size: clamp(1.4rem, 7cqw, 3.2rem);

}
    
    .locationcontentbox .locationintro,     .midlocationcontentbox .locationintro {
     font-size: clamp(1.2rem, 3.6cqw, 2.8rem);
        }
    
        .locationcontentbox, ,  .midlocationcontentbox {
        position: absolute;
        top: 70px;
        min-height: clamp(200px, 12vh, 180px);
    }
    
    }

@media (max-height: 430px) {
.Headerimage, .singleheaderimage {
    height: 80dvh !important;
  }
    
    .locationcontentbox, .midlocationcontentbox {
display: none;
    }
.mobilecontentbox {
    display: flex;}

.locationintro {
    font-size: clamp(1.4rem, 2.8vw, 2.1rem);
    font-weight: 650;
    line-height: 1.22;
    max-width: 64ch;
}

      .mobilecontentbox  .locationintro {
     font-size: clamp(1.2rem, 2.6cqw, 1.8rem);
        }

      .mobilecontentbox .headertitle {
            font-size: clamp(1.4rem, 7cqw, 3.2rem);
          line-height: clamp(1.2rem, 6cqw, 2.8rem);
    
    }