:root { --wix-color-luxury: #8B4513; --gallery-gap: 1.25rem; }

/* Blue CTA buttons (Cómo llegar / Reservar por Whatsapp) */
.hero-cta-buttons { display: flex; gap: 0.75rem; justify-content: center; align-items: center; margin-top: 1rem; flex-wrap: wrap; }
.btn-blue { background: #3f49ac; color: #fff; font: var(--wix-font-button); letter-spacing: 0.04em; padding: 0.65rem 1.6rem; border-radius: 3rem; text-decoration: none; border: none; box-shadow: 0.1rem 0.1rem 0.3125rem rgba(0, 0, 0, 0.3); transition: background 0.2s ease, transform 0.1s ease; }
.btn-blue:hover { background: #323c8e; }
.btn-blue:active { transform: translateY(1px); }

/* Move page background to main so it starts below the fixed header */
.main-content {
    padding-top: 0; /* dejar que include.js establezca el offset del header dinámicamente */
    background-image: url('../images/9ca7ec_33299c12f8bb47e89556bdd04a093c84~mv2.webp');
    background-size: 100vw auto; /* 100vw wide, auto height to avoid distortion */
    background-repeat: repeat-y; /* repeat vertically down the page */
    background-position: top center;
}

/* Hero sits on top of the page background (no own bg) */
.page-hero {
    margin-top: 0;
    height: 60vh;
    background: none; /* use the main background image */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--wix-color-text-white);
}
.hero-content { max-width: min(90rem, 92vw); padding: 0 var(--container-padding); }
.hero-logo { width: clamp(12rem, 35vw, 18rem); height: auto; margin: 0 auto 0.9375rem; display: block; filter: drop-shadow(0 0.125rem 0.375rem rgba(0,0,0,0.4)); }
.hero-overline { font: var(--wix-font-menu); text-transform: uppercase; letter-spacing: 0.15em; color: var(--wix-color-text-white); opacity: 0.9; margin-bottom: 0.75rem; }
.hero-title { font: var(--wix-font-title); color: var(--wix-color-text-white); margin-top: 0rem;  }
.hero-subtitle { font: var(--wix-font-body); color: var(--wix-color-text-white); font-size: 1.125rem; margin-top: 0.75rem; }

/* Gallery (full width) */
.gallery-section {
    width: 100vw;
    margin-left: calc(50% - 50vw); /* full-bleed */
    padding: 3.75rem 0; /* remove side padding to keep 100vw */
}
.gallery-title { font: var(--wix-font-heading); font-size: 2rem; color: var(--wix-color-card-bg); text-align: center; margin: 0 1.25rem 1.75rem; }
.gallery-media { width: 100vw; margin-bottom: var(--gallery-gap); }
.gallery-media video { width: 100vw; height: auto; display: block; }
/* Justified gallery rows (no gaps at the bottom) */
.gallery-images { padding: 0 var(--gallery-gap); }
.jg-row { display: flex; gap: var(--gallery-gap); margin: 0 0 var(--gallery-gap); }
.jg-row:last-child { margin-bottom: 0; }
.jg-item { position: relative; overflow: hidden; border-radius: 0.25rem; }
.jg-item img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* General styles for sections */
section {
    padding: 4rem 0;
}

/* Pricing Section */
.pricing-section { background: #fff; padding: 4rem 1.25rem; }
.pricing-container { max-width: 70rem; margin: 0 auto; padding: 0 2.5rem; }
.pricing-title { font: normal normal 600 2.375rem/1.2em 'Raleway', sans-serif; color: var(--wix-color-card-bg); text-align: center; margin-bottom: 1rem; }
.pricing-subtitle { text-align: center; color: #666; margin-bottom: 2rem; font: var(--wix-font-body); }
.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; }
.price-card { background: var(--wix-color-card-bg); color: var(--wix-color-text-white); border-radius: 0.75rem; padding: 1.25rem; text-align: center; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.08); }
.price-card h4 { font: normal normal 700 1.125rem/1.3em 'Raleway', sans-serif; margin-bottom: 0.25rem; }
.price { font: normal normal 700 1.5rem/1.2em 'Raleway', sans-serif; color: var(--wix-color-secondary); }
.pricing-note { margin-top: 1.25rem; text-align: center; color: var(--wix-color-text-dark); font: var(--wix-font-body); }

/* Accommodation and Features sections grid */
.accommodation-grid, .features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap: 2rem;
}

/* Contact section buttons */
.contact-buttons {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* Animations base provided by common.css */

/* Navbar mobile styles */
@media (max-width: 48em) {
    .nav-toggle { display: inline-flex; }
    .header-container { flex-direction: row; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0 1rem; position: relative; }
    .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--wix-color-primary); padding: 0.75rem 1rem 1rem; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15); }
    .main-nav.open { display: block; }
    .nav-menu { flex-direction: column; gap: 0.5rem; }
    .btn-primary { width: 100%; justify-content: center; margin-top: 0.5rem; }
    .dropdown-menu { position: static; transform: none; opacity: 1; visibility: hidden; background: transparent; box-shadow: none; margin-top: 0; min-width: 0; padding-left: 0.75rem; }
    .nav-item.open > .dropdown-menu { visibility: visible; }

    .hero-title {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    .section-title {
        font-size: 1.75rem;
    }

    .accommodation-grid {
        grid-template-columns: 1fr;
    }

    .features-grid {
        grid-template-columns: 1fr;
    }

    .contact-buttons {
        flex-direction: column;
        align-items: center;
    }

    .main-content { padding-top: 0; }
}

/* Dropdown arrow provided by common.css */

/* JavaScript consistent classes */
.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Footer is in common.css */