/* Surprising Getaways: the look of the retired Wix site. Primary (#004aad, the Wix blue) and accent (#fde047, the logo
   yellow) are the site's own colour settings; everything else is the generic site-chrome.css. */
.site-chrome {
    --site-heading-font: "Josefin Sans", ui-sans-serif, system-ui, sans-serif;
    --site-body-font: "Josefin Sans", ui-sans-serif, system-ui, sans-serif;
    --site-highlight: var(--site-primary);
    --sg-text: #333;
    color: var(--sg-text);
    font-weight: 300;
    font-size: 1.1rem;
}
.site-chrome strong, .site-chrome b { font-weight: 600; }
.site-chrome a { color: var(--site-primary); }

/* Header: wide logo centred above a single-line menu, search box at the right. */
.site-chrome .site-header { background: #fff; flex-wrap: wrap; justify-content: center; gap: 8px 24px; padding: 14px clamp(16px, 3vw, 32px) 10px; border-bottom: 1px solid #eee; }
.site-chrome .site-header .site-logo { order: 1; flex: 1 1 100%; text-align: center; }
.site-chrome .site-header .site-logo img { width: min(560px, 80vw); height: auto; max-height: 120px; margin: 0 auto; }
.site-chrome .site-header-search { order: 0; position: absolute; right: clamp(16px, 3vw, 32px); top: 24px; margin: 0; }
.site-chrome .site-header-search input { width: 170px; }
.site-chrome .site-nav { order: 2; margin: 0 auto; gap: 6px 28px; justify-content: center; }
.site-chrome .site-nav a { font-family: var(--site-body-font); font-weight: 400; font-size: 0.98rem; color: #222; }
.site-chrome .site-nav a.is-current { color: var(--site-primary); text-decoration: none; }
.site-chrome .site-menu-toggle { order: 2; }
@media (max-width: 1100px) {
    .site-chrome .site-header { justify-content: space-between; }
    .site-chrome .site-header .site-logo { flex: 0 1 auto; text-align: left; }
    .site-chrome .site-header .site-logo img { width: min(300px, 55vw); }
    .site-chrome .site-header-search { position: static; order: 1; }
    .site-chrome .site-nav { background: #fff; }
}
@media (max-width: 520px) { .site-chrome .site-header-search { display: none; } }

/* Headings */
.site-chrome h1, .site-chrome h2, .site-chrome h3 { color: var(--sg-text); font-weight: 400; }
.site-chrome .cms-display { color: var(--site-primary) !important; text-align: center; font-size: clamp(2rem, 4.5vw, 3rem) !important; text-transform: none; }
.site-chrome .cms-page-content h1 { text-transform: none; }

/* Home slideshow: photo with the title underneath, as on Wix. */
.site-chrome .home-carousel { width: min(900px, 100%); height: auto; min-height: 0; aspect-ratio: auto; margin: 10px auto 30px; background: none; color: var(--site-primary); }
.site-chrome .carousel-stage { position: relative; height: clamp(320px, 52vw, 560px); }
.site-chrome .carousel-slide > a { display: flex; flex-direction: column; text-decoration: none; }
.site-chrome .carousel-slide img { height: calc(100% - 64px); }
.site-chrome .carousel-shade, .site-chrome .story-kicker, .site-chrome .carousel-copy p, .site-chrome .story-link, .site-chrome .carousel-status > span { display: none; }
.site-chrome .carousel-copy { position: static; width: auto; padding: 14px 8px 0; text-align: center; }
.site-chrome .carousel-copy h1 { font: 400 clamp(1.1rem, 2.2vw, 1.5rem)/1.3 var(--site-heading-font); color: var(--site-primary); text-shadow: none; letter-spacing: 0.02em; }
.site-chrome .carousel-arrow { top: 42%; background: rgba(255, 255, 255, 0.85); color: var(--site-primary); border-color: var(--site-primary); }
.site-chrome .carousel-status { right: 50%; transform: translateX(50%); bottom: -18px; }
.site-chrome .carousel-dots button { background: #c9d6ee; }
.site-chrome .carousel-dots button.is-active { background: var(--site-primary); }

/* Surprising Guides: round photos with title, text and a pill button. */
.site-chrome .content-gallery.guide-cards { grid-template-columns: repeat(3, 1fr); gap: 40px 32px; margin: 20px 0 60px; }
.site-chrome .guide-cards .gallery-link { display: flex; flex-direction: column; align-items: center; text-align: center; text-decoration: none; color: var(--sg-text); }
.site-chrome .guide-cards img { width: 190px; height: 190px; border-radius: 50%; object-fit: cover; margin: 0 auto; }
.site-chrome .guide-cards figcaption { font: 300 1rem/1.5 var(--site-body-font); color: var(--sg-text); font-style: normal; margin-top: 12px; }
.site-chrome .guide-cards figcaption strong { display: block; font-size: 1.35rem; font-weight: 400; color: var(--site-primary); margin-bottom: 6px; }
.gallery-button { display: inline-block; margin-top: 12px; padding: 8px 22px; border-radius: 24px; background: var(--site-primary); color: #fff; font-weight: 400; }
.gallery-link:hover .gallery-button, .gallery-link:focus-visible .gallery-button { background: color-mix(in srgb, var(--site-primary) 80%, black); }

/* State cards: photo with a blue caption bar (State-By-State, Featured States); "captions-below" puts the name under it. */
.site-chrome .content-gallery.state-cards { grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 24px 0 36px; }
.site-chrome .state-cards .gallery-link { display: block; text-decoration: none; }
.site-chrome .state-cards figure { position: relative; margin: 0; }
.site-chrome .state-cards img { height: 220px; width: 100%; object-fit: cover; }
.site-chrome .state-cards figcaption { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 8px; background: var(--site-primary); text-align: center; font-style: normal; }
.site-chrome .state-cards figcaption strong { color: #fff; font: 400 1.35rem var(--site-heading-font); }
.site-chrome .state-cards.captions-below figcaption { position: static; background: none; }
.site-chrome .state-cards.captions-below figcaption strong { color: var(--site-primary); font-size: 1.6rem; }
.site-chrome .state-cards.captions-below img { height: 260px; }

/* Lodging by state: two wide photos per row with a light pill button. */
.site-chrome .content-gallery.lodging-cards { grid-template-columns: repeat(2, 1fr); gap: 40px 32px; margin: 24px 0 40px; }
.site-chrome .lodging-cards .gallery-link { display: flex; flex-direction: column; align-items: center; text-decoration: none; }
.site-chrome .lodging-cards img { height: 320px; width: 100%; object-fit: cover; }
.site-chrome .lodging-cards .gallery-button { background: #dde6fb; color: var(--site-primary); font-family: Georgia, serif; letter-spacing: 0.05em; padding: 6px 34px; }

/* Featured Articles grid with page numbers */
.site-chrome .recent-articles > h2 { color: var(--site-primary); text-align: center; font-size: clamp(2rem, 4.5vw, 3rem); }
.site-chrome .recent-articles-grid { grid-template-columns: repeat(3, 1fr); gap: 28px; }
.site-chrome .recent-article { border: 1px solid #e5e5e5; padding-bottom: 14px; }
.site-chrome .recent-article span { font: 400 1.25rem/1.3 var(--site-heading-font); padding: 0 16px; color: var(--sg-text); }
.site-chrome .recent-articles-pager { display: flex; justify-content: center; gap: 6px; margin-top: 24px; }
.site-chrome .recent-articles-pager button { min-width: 36px; padding: 6px 10px; border: 0; background: none; font: inherit; color: var(--sg-text); cursor: pointer; }
.site-chrome .recent-articles-pager button.is-current { color: var(--site-primary); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }

/* Buttons and forms */
.site-chrome .content-button a { background: var(--site-primary); border-radius: 24px; font-size: 1.1rem; }
.site-chrome .contact-form-block input, .site-chrome .contact-form-block textarea { border: 0; border-bottom: 1px solid #333; border-radius: 0; }
.site-chrome .contact-form-block button[type=submit] { background: #000; border-radius: 24px; font-size: 1.05rem; padding: 8px 60px; }
.site-chrome .cms-page-home .contact-form-block, .site-chrome .cms-page-subscribe .contact-form-block { background: var(--site-accent); padding: 32px clamp(16px, 4vw, 48px); margin: 50px calc(50% - 50vw) 40px; }
.site-chrome .cms-page-home .contact-form-block > h2, .site-chrome .cms-page-subscribe .contact-form-block > h2 { color: var(--site-primary); }
.site-chrome .cms-page-home .contact-form-block form, .site-chrome .cms-page-subscribe .contact-form-block form { max-width: 720px; }
.site-chrome .cms-page-home .contact-form-block input, .site-chrome .cms-page-subscribe .contact-form-block input { background: #fff; border: 1px solid #ccc; }
.site-chrome .cms-page-home .contact-form-block button[type=submit], .site-chrome .cms-page-subscribe .contact-form-block button[type=submit] { background: var(--site-primary); border-radius: 0; }
.site-chrome .cms-page-home .cms-page-content > p.cms-lead, .site-chrome .cms-page-home h2 + .cms-lead { color: var(--site-primary); }

/* Footer: blue pill links, social icons, the affiliate message in small print. */
.site-chrome .site-footer { background: #fff; color: var(--sg-text); border-top: 1px solid #eee; padding-bottom: 40px; }
.site-chrome .site-footer nav a { display: inline-block; padding: 8px 26px; border-radius: 24px; background: var(--site-primary); color: #fff; font-weight: 400; letter-spacing: 0.08em; }
.site-chrome .site-footer nav a[href="/about-4"] { background: none; color: var(--sg-text); text-decoration: underline; letter-spacing: 0; }
.site-chrome .site-footer > p:first-child, .site-chrome .site-footer > p:not(.site-copyright):not(.site-social) { font-size: 0.85rem; max-width: 900px; margin: 18px auto; font-style: italic; }
.site-chrome .site-social a { display: inline-block; width: 34px; height: 34px; margin: 0 4px; border-radius: 6px; overflow: hidden; color: transparent; font-size: 0; background: #222 center / 20px no-repeat; vertical-align: middle; }
.site-chrome .site-social a[href*="pinterest"] { background-color: #e60023; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2a10 10 0 0 0-3.6 19.3c-.1-.8-.2-2 0-2.9l1.2-5s-.3-.6-.3-1.5c0-1.4.8-2.5 1.8-2.5.9 0 1.3.6 1.3 1.4 0 .9-.6 2.2-.8 3.4-.2 1 .5 1.9 1.6 1.9 1.9 0 3.3-2 3.3-4.9 0-2.6-1.8-4.4-4.5-4.4-3 0-4.8 2.3-4.8 4.6 0 .9.4 1.9.8 2.4l.1.4-.3 1.2c0 .2-.2.3-.4.2-1.4-.7-2.2-2.7-2.2-4.3 0-3.5 2.5-6.7 7.3-6.7 3.8 0 6.8 2.7 6.8 6.4 0 3.8-2.4 6.9-5.8 6.9-1.1 0-2.2-.6-2.6-1.3l-.7 2.7c-.3 1-.9 2.2-1.4 2.9A10 10 0 1 0 12 2z'/%3E%3C/svg%3E"); }
.site-chrome .site-social a[href*="instagram"] { background-color: #d62976; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='white'/%3E%3C/svg%3E"); }
.site-chrome .site-social a[href*="facebook"] { background-color: #1877f2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M14 8h3V4h-3c-2.8 0-4 1.8-4 4.5V11H7v4h3v9h4v-9h3l1-4h-4V8.6c0-.4.3-.6.6-.6z'/%3E%3C/svg%3E"); }
.site-chrome .site-social a[href*="x.com"] { background-color: #000; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.8 3h3.1l-6.8 7.8L22 21h-6.2l-4.9-6.4L5.3 21H2.2l7.3-8.3L2 3h6.4l4.4 5.8zm-1.1 16.2h1.7L7.4 4.7H5.6z'/%3E%3C/svg%3E"); }
.site-chrome .site-social a[href*="youtube"] { background-color: #ff0000; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 7.5v9l7.5-4.5z'/%3E%3C/svg%3E"); }

@media (max-width: 900px) {
    .site-chrome .content-gallery.guide-cards, .site-chrome .content-gallery.state-cards, .site-chrome .recent-articles-grid { grid-template-columns: repeat(2, 1fr); }
    .site-chrome .content-gallery.lodging-cards { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .site-chrome .content-gallery.guide-cards, .site-chrome .content-gallery.state-cards, .site-chrome .recent-articles-grid { grid-template-columns: 1fr; }
}

/* Footer order as on Wix: pill links, social icons, copyright, then the affiliate message. No logo in the footer. */
.site-chrome .site-footer { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.site-chrome .site-footer .site-logo { display: none; }
.site-chrome .site-footer > p:first-of-type:not(.site-social):not(.site-copyright) { order: 4; }
.site-chrome .site-footer nav { order: 1; margin: 0; }
.site-chrome .site-footer .site-social { order: 2; margin: 0; }
.site-chrome .site-footer .site-copyright { order: 3; margin: 0; }
.site-chrome .cms-page-home h2 + .cms-lead, .site-chrome .cms-page-home .cms-page-content > h2:last-of-type { text-align: center; }

/* Wide banner photo at the top of a page (Accessibility) */
.site-chrome .content-image.page-banner { margin: 0 calc(50% - 50vw) 24px; }
.site-chrome .content-image.page-banner img { width: 100%; max-height: 360px; object-fit: cover; }

/* Galleries inside posts: a row of three, as on Wix (two on phones) */
.site-chrome .article-content .content-gallery { grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 24px 0; }
.site-chrome .article-content .content-gallery img { height: 240px; }
@media (max-width: 700px) {
    .site-chrome .article-content .content-gallery { grid-template-columns: repeat(2, 1fr); }
    .site-chrome .article-content .content-gallery img { height: 160px; }
}

/* Post pages in the Wix type: Josefin Sans (light body text), white page, blue title */
.site-chrome .article-content { font: 300 1.15rem/1.75 var(--site-body-font); color: var(--sg-text); }
.site-chrome .article-content h2, .site-chrome .article-content h3, .site-chrome .article-content h4 { font-family: var(--site-heading-font); font-weight: 400; color: var(--sg-text); }
.site-chrome .article-content strong { font-weight: 600; }
.site-chrome .article-hero { background: #fff; }
.site-chrome .article-heading h1 { font-family: var(--site-heading-font); color: var(--site-primary); }
.site-chrome .article-content figcaption { font: 300 0.95rem/1.4 var(--site-body-font); color: #555; text-align: center; }

/* Floating social icons on the right edge, as on Wix: small black circles */
.site-chrome .site-social-bar a { width: 26px; height: 26px; margin: 0; border-radius: 50%; background-color: #000 !important; background-size: 14px; }
