/* ============================================================
   CASA VENECIA — Sistema visual
   assets/css/cv-estilos.css
   ============================================================ */

/* ─────────────────────────────────────────────
   TOKENS
   ───────────────────────────────────────────── */
:root {
    /* Paleta */
    --cv-turquesa:        #1aa59a;
    --cv-turquesa-oscuro: #138079;
    --cv-turquesa-claro:  #4dc4ba;
    --cv-crema:           #F3F1ED;
    --cv-crema-oscuro:    #E8E4DC;
    --cv-blanco:          #ffffff;
    --cv-negro:           #1a1a1a;
    --cv-gris-texto:      #6b7280;
    --cv-gris-borde:      #e5e7eb;
    --cv-gris-pizarra:    #252a2e;

    /* Tipografía */
    --cv-font-display: 'Cormorant Garamond', 'Georgia', serif;
    --cv-font-body:    'Jost', 'Helvetica Neue', sans-serif;

    /* Espaciado */
    --cv-gap:      1.5rem;
    --cv-radius:   6px;
    --cv-radius-lg: 12px;

    /* Sombras */
    --cv-shadow:    0 4px 24px rgba(0,0,0,0.08);
    --cv-shadow-lg: 0 12px 40px rgba(0,0,0,0.12);

    /* Transiciones */
    --cv-transition: 0.3s ease;
}

/* ─────────────────────────────────────────────
   RESET GLOBAL
   ───────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    font-family: var(--cv-font-body);
    font-weight: 300;
    color: var(--cv-negro);
    background-color: var(--cv-blanco);
    -webkit-font-smoothing: antialiased;
}

/* Reset Astra contenedores */
.site-content,
.ast-container,
#content,
.content-area,
.site-main {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ─────────────────────────────────────────────
   TIPOGRAFÍA GLOBAL
   ───────────────────────────────────────────── */
h1,
h2,
h3,
h4 {
    font-family: var(--cv-font-display);
    font-weight: 600;
    line-height: 1.15;
    text-align: center;
    color: var(--cv-gris-pizarra, #252a2e);
}

h1 {
    font-size: clamp(2.2rem, 5vw, 4rem);
}

h2 {
    font-size: clamp(1.8rem, 4vw, 3rem);
}

h3 {
    font-size: clamp(1.3rem, 3vw, 1.8rem);
}

.cv-hero h1.cv-hero__titulo {
    color: #fff;
}

/* ─────────────────────────────────────────────
   UTILIDADES
   ───────────────────────────────────────────── */
.cv-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.cv-container--narrow {
    max-width: 820px;
}

.cv-section {
    padding: 6rem 0;
}

.cv-section--crema {
    background-color: var(--cv-crema);
}

.cv-section--oscuro {
    background-color: var(--cv-negro);
    color: var(--cv-blanco);
}

.cv-section-header {
    text-align: center;
    margin-bottom: 3.5rem;
}

.cv-eyebrow {
    font-family: var(--cv-font-body);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--cv-turquesa);
    margin-bottom: 0.75rem;
    display: block;
}

.cv-titulo {
    font-family: var(--cv-font-display);
    font-weight: 600;
    color: var(--cv-negro);
    margin: 0 0 1rem;
}

/* ─────────────────────────────────────────────
   BOTONES
   ───────────────────────────────────────────── */
.cv-btn {
    font-family: var(--cv-font-body);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.85rem 2rem;
    border-radius: var(--cv-radius);
    border: none;
    cursor: pointer;
    transition: all var(--cv-transition);
    display: inline-block;
    text-align: center;
}

.cv-btn--turquesa {
    background: var(--cv-turquesa);
    color: var(--cv-negro);
}

.cv-btn--turquesa:hover {
    background: var(--cv-turquesa-oscuro);
    color: var(--cv-blanco);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26,165,154,0.3);
}

.cv-btn--outline {
    background: transparent;
    color: var(--cv-turquesa);
    border: 1.5px solid var(--cv-turquesa);
}

.cv-btn--outline:hover {
    background: var(--cv-turquesa);
    color: var(--cv-blanco);
}

.cv-btn--blanco {
    background: var(--cv-blanco);
    color: var(--cv-turquesa);
}

.cv-btn--blanco:hover {
    background: var(--cv-crema);
    color: var(--cv-turquesa-oscuro);
    transform: translateY(-2px);
}

.cv-btn--outline-blanco {
    background: transparent;
    color: var(--cv-blanco);
    border: 1.5px solid rgba(255,255,255,0.6);
}

.cv-btn--outline-blanco:hover {
    background: rgba(255,255,255,0.15);
    border-color: var(--cv-blanco);
}

/* ─────────────────────────────────────────────
   HERO
   ───────────────────────────────────────────── */
.cv-hero {
    position: relative;
    min-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%);
}

.cv-hero__bg {
    position: absolute;
    top: -10%;
    right: 0;
    bottom: auto;
    left: 0;

    width: 100%;
    height: 120%;

    object-fit: cover;
    object-position: center;

    z-index: 0;

    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.cv-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(26,26,26,0.35) 0%,
        rgba(26,26,26,0.25) 50%,
        rgba(26,26,26,0.55) 100%
    );
    z-index: 1;
}

.cv-hero__content {
    position: relative;
    z-index: 2;
    max-width: 860px;
    padding: 0 1.5rem;
}

.cv-hero__eyebrow {
    font-family: var(--cv-font-body);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.85);
    margin-bottom: 1.25rem;
    display: block;
}

.cv-hero__titulo {
    font-family: var(--cv-font-display);
    font-weight: 600;
    font-size: clamp(2.5rem, 6vw, 5rem);
    color: var(--cv-blanco);
    line-height: 1.08;
    margin: 0 0 1rem;
}

.cv-hero__subtitulo {
    font-family: var(--cv-font-display);
    font-weight: 400;
    font-style: italic;
    font-size: clamp(1.1rem, 2.5vw, 1.4rem);
    color: rgba(255,255,255,0.88);
    margin: 0 auto 2.5rem;
    max-width: 620px;
    line-height: 1.65;
}

.cv-hero__ctas {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* =====================================================
   AMENITIES — ETIQUETAS COMPACTAS
   ===================================================== */

.cv-amenities {
    padding: clamp(2.5rem, 4vw, 3.5rem) 1.25rem;
}

.cv-amenities__header {
    margin-bottom: 1.5rem;
}

.cv-amenities .cv-amenities__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;

    max-width: 900px;
    margin: 0 auto;
    padding: 0;

    gap: 0.55rem;

    list-style: none;
}

/* Etiqueta */

.cv-amenities .cv-amenities__grid > .cv-amenity {
    display: block;
    flex: 0 0 auto;

    width: auto;
    min-width: 0;
    min-height: 0;
    height: auto;

    margin: 0;
    padding: 0.5rem 0.85rem;

    background: #252a2e;
    border: 0;
    border-radius: 6px;
    box-shadow: none;
}

/* Texto */

.cv-amenities .cv-amenity h3.cv-amenity__title {
    margin: 0;

    font-family: var(--cv-font-display);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1;

    color: var(--cv-turquesa-claro);
}

.cv-amenities .cv-amenities__intro {
    text-align: center;
}

/* Móvil */

@media (max-width: 520px) {
    .cv-amenities {
        padding: 2.5rem 1rem;
    }

    .cv-amenities .cv-amenities__grid {
        gap: 0.45rem;
    }

    .cv-amenities .cv-amenities__grid > .cv-amenity {
        padding: 0.45rem 0.7rem;
    }

    .cv-amenities .cv-amenity h3.cv-amenity__title {
        font-size: 1.15rem;
    }
}

/* ─────────────────────────────────────────────
   DESCRIPCIÓN / INTRO
   ───────────────────────────────────────────── */
.cv-intro {
    background: var(--cv-blanco);
}

.cv-intro__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
}

.cv-intro__texto h2 {
    margin-bottom: 1.25rem;
}

.cv-intro__texto p {
    margin-bottom: 1.25rem;
    font-size: 1rem;
}

.cv-intro__imagen {
    position: relative;
    border-radius: var(--cv-radius-lg);
    overflow: hidden;
    aspect-ratio: 4/5;
    box-shadow: var(--cv-shadow-lg);
}

.cv-intro__imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    will-change: transform;
}

/* =====================================================
   SEPARADOR PARALLAX 
   ===================================================== */

.cv-parallax-break {
    position: relative;
    display: flex;
    min-height: 46vh;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-align: center;
}

.cv-parallax-break__bg {
    position: absolute;
    inset: 0;
    z-index: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: translate3d(0, 0, 0) scale(1.3);
    will-change: transform;
}

.cv-parallax-break::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    background: linear-gradient(
        rgba(17, 17, 17, 0.38),
        rgba(17, 17, 17, 0.28)
    );
}

.cv-parallax-break__inner {
    position: relative;
    z-index: 2;

    width: min(900px, 92%);
    margin: 0 auto;

    color: #fff;
}

.cv-parallax-break .cv-parallax-break__inner h2 {
    margin: 0 0 12px;

    font-family: var(--cv-font-display);
    font-size: clamp(34px, 4vw, 56px);
    font-weight: 600;
    line-height: 1.1;

    color: #fff;
}

.cv-parallax-break .cv-parallax-break__inner p {
    margin: 0;

    font-family: var(--cv-font-body);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.92);
}

@media (max-width: 768px) {
    .cv-parallax-break {
        min-height: 34vh;
    }

    .cv-parallax-break__bg {
        transform: scale(1.05);
        will-change: auto;
    }

    .cv-parallax-break .cv-parallax-break__inner p {
        font-size: 16px;
    }
}

/* =====================================================
   TABLET — 
   ===================================================== */

@media (min-width: 681px) and (max-width: 1100px) {

    /* ---------------------------------------------
       Separador: fallback estable sin parallax
       --------------------------------------------- */

    .cv-separador-parallax,
    .cv-entorno-banner,
    .cv-home-separador {
        background-attachment: scroll !important;
        background-position: center !important;
        background-size: cover !important;
    }

    .cv-separador-parallax img,
    .cv-entorno-banner img,
    .cv-home-separador img {
        display: block !important;
        width: 100% !important;
        height: clamp(280px, 42vw, 420px) !important;

        opacity: 1 !important;
        visibility: visible !important;

        object-fit: cover;
        object-position: center;

        transform: none !important;
    }


    /* ---------------------------------------------
       Estancias: exactamente 2 tarjetas por fila
       --------------------------------------------- */

    .cv-estancias-grid,
    .cv-alojamientos-grid,
    .cv-accommodation-grid {
        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        grid-auto-flow: row !important;
        grid-auto-rows: auto !important;

        align-items: stretch !important;
        gap: clamp(1rem, 2vw, 1.5rem) !important;
    }

    .cv-estancias-grid > *,
    .cv-alojamientos-grid > *,
    .cv-accommodation-grid > * {
        grid-column: auto !important;
        grid-row: auto !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
    }
}

/* ─────────────────────────────────────────────
   ESTANCIAS CARDS
   ───────────────────────────────────────────── */

.grid-tarjetas-chalf {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 60px;
}

.tarjeta-estancia {
  background: #252a2e;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,0.05);
  transition: transform .35s ease, box-shadow .35s ease;
}

.tarjeta-estancia img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  transition: transform .6s ease;
}

.grid-tarjetas-chalf .tarjeta-content h3 {
    margin: 0 0 0.75rem;

    font-family: var(
        --cv-font-display,
        "Cormorant Garamond",
        serif
    );
    font-size: clamp(1.75rem, 2.4vw, 2.25rem);
    font-weight: 600;
    line-height: 1.05;
    text-align: center;

    color: var(--cv-turquesa-claro, #6dd7cf);
}

.grid-tarjetas-chalf .tarjeta-content p {
    margin: 0;

    padding:
        0.35rem
        clamp(1rem, 2vw, 1.4rem)
        1.35rem;

    font-family: var(
        --cv-font-body,
        "Jost",
        sans-serif
    );
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.55;

    color: rgba(255, 255, 255, 0.84);
}

.tarjeta-estancia:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
}

.tarjeta-estancia:hover img {
  transform: scale(1.05);
}

.cv-estancias__cta {
    display: flex;
    justify-content: center;
    margin-top: clamp(2rem, 4vw, 3rem);
    padding-inline: 1rem;
}

/* TABLETS (iPad y similares) */
@media (max-width: 900px) {

  .grid-tarjetas-chalf {
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
  }

  .tarjeta-estancia img {
    height: 180px;
  }
}

/* MÓVIL: 1 tarjeta por fila */
@media (max-width: 640px) {
  .grid-tarjetas-chalf {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 40px;
  }

  .tarjeta-estancia img {
    height: 220px;
  }

  .tarjeta-estancia h3 {
    font-size: 21px;
    padding: 18px 18px 8px;
  }

  .tarjeta-estancia p {
    font-size: 15px;
    padding: 0 18px 22px;
  }
}

/* ─────────────────────────────────────────────
   REVEAL
   ───────────────────────────────────────────── */

.reveal {
    opacity: 0;
    transform: translateY(50px);
    transition:
        opacity 1.8s cubic-bezier(.22, .61, .36, 1),
        transform 1.8s cubic-bezier(.22, .61, .36, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.reveal-card {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity 1.8s cubic-bezier(.22, .61, .36, 1),
        transform 1.8s cubic-bezier(.22, .61, .36, 1);
}

.reveal-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .reveal,
    .reveal-card {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ─────────────────────────────────────────────
   RESEÑAS
   ───────────────────────────────────────────── */
   
.cv-reviews{
  padding: 60px 20px;
  background: #F3F1ED;
}

.cv-reviews + .cv-reviews{
  padding-top: 20px;
}

.cv-reviews, .cv-reviews * { box-sizing: border-box; }
.cv-track-wrap { overflow: visible; }

/* --- CABECERA PLATAFORMA --- */
.cv-platform-head{
  max-width: 1200px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;

  padding: 18px 22px;
  border: 1px solid #C7A24D;
  border-radius: 18px;
  background: transparent;
}

.cv-platform-left{
  display: flex;
  align-items: center;
  gap: 12px;
}

.cv-platform-logo{
  height: 34px;
  width: auto;
  display: block;
  opacity: .95;
}

.cv-platform-meta{ line-height: 1.1; }
.cv-platform-score strong{ font-size: 18px; }
.cv-platform-stars{ color: #C7A24D; margin-left: 8px; letter-spacing: 1px; }
.cv-platform-sub{ font-size: 13px; color: #666; margin-top: 6px; }

.cv-platform-actions{
  display: flex;
  align-items: center;
  gap: 10px;
}

.cv-platform-link{
  font-weight: 600;
  color: #1E1E1E;
  text-decoration: none;
  white-space: nowrap;
  padding: 10px 14px;
  border: 1px solid #C7A24D;
  border-radius: 6px;
  display: inline-block;
  background: transparent;
  transition: all .25s ease;
}

.cv-platform-link:hover{
  background: #C7A24D;
  color: #1E1E1E;
}

/* --- FLECHAS --- */
.cv-arrow{
  width: 38px;
  height: 38px;
  border-radius: 6px;
  border: 1px solid #C7A24D;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .25s ease;
}

.cv-arrow:hover{
  background: #C7A24D;
  transform: translateY(-1px);
}

/* --- TRACK / SLIDER --- */
.cv-track{
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 18px;
  overflow-x: auto;
  padding: 8px 4px 18px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

/* Ocultar scrollbar */
.cv-track::-webkit-scrollbar{ display:none; }
.cv-track{ scrollbar-width:none; }

/* --- TARJETAS --- */
.cv-card{
  flex: 0 0 340px;
  min-height: 290px;
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(6px);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 18px 45px rgba(0,0,0,.10);
  scroll-snap-align: start;
  border: 1px solid rgba(0,0,0,.06);

  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.cv-text{
  font-style: italic;
  font-size: 15px;
  line-height: 1.65;
  margin: 0 0 16px;
  color: #2B2B2B;

  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cv-author{
  display:flex;
  align-items:center;
  gap: 12px;
}

.cv-avatar{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: #3CA9A3;
  color: #fff;
  font-weight: 800;
  display:flex;
  align-items:center;
  justify-content:center;
}

.cv-who strong{ display:block; font-size: 15px; }
.cv-who span{ display:block; font-size: 13px; color:#666; margin-top:2px; }

.cv-note{
  max-width: 1200px;
  margin: 14px auto 0;
  font-size: 13px;
  color:#666;
  text-align:center;
}

@media (max-width: 768px){
  .cv-platform-actions{
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

/* ─────────────────────────────────────────────
   UBICACIÓN
   ───────────────────────────────────────────── */

.cv-ubicacion {
    padding: clamp(3.5rem, 7vw, 6rem) 1.25rem;
    background: var(--cv-crema);
}

.cv-ubicacion__contenedor {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    width: min(100%, 1180px);
    min-height: clamp(440px, 48vw, 560px);
    margin-inline: auto;

    overflow: hidden;
    border-radius: 16px;
}

/* Mapa */

.cv-ubicacion__mapa {
    min-width: 0;
    min-height: 100%;
}

.cv-ubicacion__mapa iframe {
    display: block;

    width: 100%;
    height: 100%;
    min-height: 440px;

    border: 0;
}

/* Contenido */

.cv-ubicacion__contenido {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-width: 0;
    padding: clamp(2.25rem, 5vw, 4.5rem);

    background: #252a2e;
}

.cv-ubicacion__eyebrow {
    display: block;
    margin-bottom: 0.8rem;

    font-family: var(
        --cv-font-body,
        "Jost",
        sans-serif
    );
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--cv-turquesa-claro);
}

.cv-ubicacion .cv-ubicacion__titulo {
    max-width: 580px;
    margin: 0 0 1.25rem;

    font-family: var(
        --cv-font-display,
        "Cormorant Garamond",
        serif
    );
    font-size: clamp(2.4rem, 4vw, 3.7rem);
    font-weight: 600;
    line-height: 1;

    color: #fff;
}

.cv-ubicacion .cv-ubicacion__texto {
    max-width: 570px;
    margin: 0 0 0.9rem;

    font-family: var(
        --cv-font-body,
        "Jost",
        sans-serif
    );
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;

    color: rgba(255, 255, 255, 0.82);
}

.cv-ubicacion__cta {
    margin-top: 1.25rem;
}

/* Tablet y móvil */

@media (max-width: 820px) {
    .cv-ubicacion__contenedor {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .cv-ubicacion__mapa iframe {
        min-height: 360px;
    }

    .cv-ubicacion__contenido {
        padding: clamp(2rem, 7vw, 3.5rem);
    }
}

@media (max-width: 520px) {
    .cv-ubicacion {
        padding: 3rem 1rem;
    }

    .cv-ubicacion__contenedor {
        border-radius: 10px;
    }

    .cv-ubicacion__mapa iframe {
        min-height: 300px;
    }

    .cv-ubicacion__contenido {
        padding: 2rem 1.4rem;
    }

    .cv-ubicacion .cv-ubicacion__titulo {
        font-size: 2.35rem;
    }
}

/* ─────────────────────────────────────────────
   BANNER ENTORNO
   ───────────────────────────────────────────── */

.cv-environment-banner {
    position: relative;
    width: 100vw;
    margin: clamp(2.5rem, 5vw, 4rem) 0;
    margin-left: calc(50% - 50vw);

    overflow: hidden;
    border-radius: 0;
    background: var(--cv-gris-pizarra, #252a2e);
}

.cv-env-link {
    position: relative;
    display: block;
    min-height: clamp(260px, 32vw, 380px);

    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

.cv-env-image {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    z-index: 0;
}

.cv-env-overlay {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: center;

    min-height: inherit;
    padding: clamp(2rem, 4vw, 3.25rem)
             clamp(1.25rem, 6vw, 5rem);

    background: linear-gradient(
        90deg,
        rgba(20, 24, 26, 0.78) 0%,
        rgba(20, 24, 26, 0.52) 55%,
        rgba(20, 24, 26, 0.18) 100%
    );
}

.cv-env-content {
    max-width: 620px;
}

.cv-env-eyebrow {
    display: inline-block;
    margin-bottom: 0.75rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.16em;
    text-transform: uppercase;

    color: var(--cv-turquesa-claro, #4dc4ba);
}

.cv-environment-banner .cv-env-content h2 {
    margin: 0 0 1rem;

    font-family: var(
        --cv-font-display,
        "Cormorant Garamond",
        serif
    );
    font-size: clamp(2.5rem, 5vw, 4.25rem);
    font-weight: 600;
    line-height: 1;
    text-align: left;

    color: #fff;
}

.cv-environment-banner .cv-env-content p {
    max-width: 560px;
    margin: 0 0 1.5rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;

    color: rgba(255, 255, 255, 0.88);
}

/* CTA visual */

.cv-env-cta {
    display: inline-block;
    padding-bottom: 0.25rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.95rem;
    font-weight: 600;

    color: #fff;
    border-bottom: 2px solid
        var(--cv-turquesa-claro, #4dc4ba);
}

.cv-env-link:hover .cv-env-cta,
.cv-env-link:focus-visible .cv-env-cta {
    color: var(--cv-turquesa-claro, #4dc4ba);
}

/* Accesibilidad por teclado */

.cv-env-link:focus-visible {
    outline: 3px solid
        var(--cv-turquesa-claro, #4dc4ba);
    outline-offset: 4px;
}

 @media (max-width: 768px) {
    .cv-environment-banner {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        border-radius: 0;
    }

    .cv-env-link {
        min-height: 320px;
    }

    .cv-env-overlay {
        align-items: flex-end;
        padding: 2.25rem 1.25rem;

        background: linear-gradient(
            180deg,
            rgba(20, 24, 26, 0.12) 0%,
            rgba(20, 24, 26, 0.84) 100%
        );
    }
}

/* =====================================================
   GALERÍA — CASA VENECIA
   ===================================================== */

.cv-galeria-intro {
    padding: clamp(3.5rem, 7vw, 6rem) 1.25rem;
    background: var(--cv-crema, #f3f1ed);
}

.cv-galeria-intro__inner {
    width: min(100%, 820px);
    margin-inline: auto;
    text-align: center;
}

.cv-galeria-intro__eyebrow {
    display: block;
    margin-bottom: 0.75rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.76rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--cv-turquesa, #1aa59a);
}

.cv-galeria-intro h2 {
    margin: 0 0 1.25rem;

    font-family:
        var(--cv-font-display, "Cormorant Garamond", serif);
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 600;
    line-height: 1.05;
    text-align: center;

    color: var(--cv-gris-pizarra, #252a2e);
}

.cv-galeria-intro p {
    max-width: 700px;
    margin: 0 auto;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: clamp(1rem, 1.5vw, 1.08rem);
    font-weight: 400;
    line-height: 1.55;

    color: var(--cv-gris-texto, #6b7280);
}


/* =====================================================
   ESTANCIA
   ===================================================== */

.cv-galeria-estancia {
    padding:
        clamp(3.5rem, 7vw, 6rem)
        1.25rem;

    background: var(--cv-blanco, #ffffff);
}

.cv-galeria-estancia:nth-of-type(even) {
    background: var(--cv-crema, #f3f1ed);
}


/* =====================================================
   CABECERA DE CADA ESTANCIA
   ===================================================== */

.cv-galeria-estancia__header {
    width: min(100%, 820px);
    margin:
        0 auto
        clamp(2rem, 4vw, 3rem);

    text-align: center;
}

.cv-galeria-estancia__eyebrow {
    display: block;
    margin-bottom: 0.65rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.74rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--cv-turquesa, #1aa59a);
}

.cv-galeria-estancia__header h2 {
    margin: 0 0 1rem;

    font-family:
        var(--cv-font-display, "Cormorant Garamond", serif);
    font-size: clamp(2.3rem, 4.5vw, 3.7rem);
    font-weight: 600;
    line-height: 1.05;
    text-align: center;

    color: var(--cv-gris-pizarra, #252a2e);
}

.cv-galeria-estancia__header p {
    max-width: 700px;
    margin: 0 auto;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;

    color: var(--cv-gris-texto, #6b7280);
}


/* =====================================================
   GALERÍA — MOSAICO COMPACTO
   ===================================================== */

.cv-galeria-estancia__imagenes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;

    width: min(100%, 960px);
    margin-inline: auto;
}

/*
 * Integra las miniaturas en el grid principal
 * sin necesidad de cambiar el HTML.
 */
.cv-galeria-estancia__miniaturas {
    display: contents;
}

.cv-galeria-estancia__principal,
.cv-galeria-estancia__miniatura {
    position: relative;

    min-width: 0;
    min-height: 0;
    margin: 0;

    aspect-ratio: 3 / 2;
    overflow: hidden;

    border-radius: 12px;
    background: var(--cv-crema-oscuro, #e8e4dc);
}

.cv-galeria-estancia__imagenes img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}


/* =====================================================
   TABLET
   ===================================================== */

@media (max-width: 760px) {

    .cv-galeria-estancia__imagenes {
        width: min(100%, 680px);
        gap: 0.6rem;
    }

    .cv-galeria-estancia__principal,
    .cv-galeria-estancia__miniatura {
        border-radius: 10px;
    }
}


/* =====================================================
   MÓVIL
   ===================================================== */

@media (max-width: 520px) {

    .cv-galeria-intro,
    .cv-galeria-estancia {
        padding: 3.5rem 1rem;
    }

    .cv-galeria-estancia__imagenes {
        grid-template-columns: 1fr;
        gap: 0.6rem;
    }

    .cv-galeria-estancia__principal,
    .cv-galeria-estancia__miniatura {
        aspect-ratio: 3 / 2;
    }
}

/* =====================================================
   CTA FINAL — RESERVA DIRECTA
   ===================================================== */

.cv-reserva-final {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding: clamp(3.5rem, 7vw, 6rem) 1.25rem;

    background: var(--cv-gris-pizarra, #252a2e);
}

.cv-reserva-final__inner {
    width: min(100%, 780px);
    margin-inline: auto;
    text-align: center;
}

.cv-reserva-final__eyebrow {
    display: block;
    margin-bottom: 0.75rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--cv-turquesa-claro, #4dc4ba);
}

.cv-reserva-final h2 {
    margin: 0 0 1rem;

    font-family: var(
        --cv-font-display,
        "Cormorant Garamond",
        serif
    );
    font-size: clamp(3rem, 6vw, 5rem);
    font-weight: 600;
    line-height: 1.05;

    color: #fff;
}

.cv-reserva-final p {
    max-width: 620px;
    margin: 0 auto 1.75rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;

    color: rgba(255, 255, 255, 0.82);
}

/* =====================================================
   RESERVAS — INTRO
   ===================================================== */

.cv-reservas-intro {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    padding:
        clamp(4.5rem, 8vw, 7rem)
        1.25rem
        clamp(3.5rem, 7vw, 5.5rem);

    overflow: hidden;
    background: var(--cv-gris-pizarra, #252a2e);
}

.cv-reservas-intro__inner {
    width: min(100%, 780px);
    margin-inline: auto;
    text-align: center;
}

.cv-reservas-intro__eyebrow {
    display: block;
    margin-bottom: 0.75rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: var(--cv-turquesa-claro, #4dc4ba);
}

.cv-reservas-intro h1 {
    margin: 0 0 1.25rem;

    font-family:
        var(--cv-font-display, "Cormorant Garamond", serif);
    font-size: clamp(2.8rem, 6vw, 4.8rem);
    font-weight: 600;
    line-height: 1;
    text-align: center;

    color: #fff;
}

.cv-reservas-intro p {
    max-width: 680px;
    margin: 0 auto;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.55;

    color: rgba(255, 255, 255, 0.84);
}

.cv-reservas-intro p + p {
    margin-top: 0.8rem;
}

/* =====================================================
   PRECIO — SPLASH TURQUESA
   ===================================================== */

.cv-reservas-intro__precio {
    position: absolute;
    top: clamp(1rem, 3vw, 2rem);
    right: clamp(1rem, 4vw, 3rem);
    z-index: 2;
    isolation: isolate;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 170px;
    min-height: 140px;
    padding: 1.25rem;

    font-family: var(--cv-font-body, "Jost", sans-serif);
    text-align: center;

    color: var(--cv-gris-pizarra, #252a2e);
    background: transparent;
}

/* Mancha principal irregular */

.cv-reservas-intro__precio::before {
    content: "";
    position: absolute;
    inset: -12px;
    z-index: -1;

    background: var(--cv-turquesa-claro, #4dc4ba);

    clip-path: polygon(
        50% 0%,
        59% 10%,
        69% 4%,
        74% 16%,
        88% 12%,
        84% 27%,
        100% 35%,
        87% 44%,
        97% 56%,
        83% 62%,
        89% 78%,
        73% 76%,
        67% 94%,
        54% 83%,
        43% 100%,
        36% 84%,
        18% 92%,
        21% 73%,
        3% 68%,
        14% 55%,
        0% 43%,
        16% 35%,
        8% 20%,
        25% 22%,
        31% 5%
    );

    transform: rotate(-4deg);

    filter: drop-shadow(
        0 10px 18px rgba(0, 0, 0, 0.18)
    );
}

/* Gotas y salpicaduras exteriores */

.cv-reservas-intro__precio::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 2px;
    z-index: -2;

    width: 11px;
    height: 11px;

    background: var(--cv-turquesa-claro, #4dc4ba);
    border-radius: 50%;

    box-shadow:
        -21px 28px 0 2px
            var(--cv-turquesa-claro, #4dc4ba),

        34px -18px 0 -2px
            var(--cv-turquesa-claro, #4dc4ba),

        92px -20px 0 1px
            var(--cv-turquesa-claro, #4dc4ba),

        158px 15px 0 -2px
            var(--cv-turquesa-claro, #4dc4ba),

        174px 58px 0 3px
            var(--cv-turquesa-claro, #4dc4ba),

        151px 125px 0 -1px
            var(--cv-turquesa-claro, #4dc4ba),

        102px 151px 0 2px
            var(--cv-turquesa-claro, #4dc4ba),

        30px 145px 0 1px
            var(--cv-turquesa-claro, #4dc4ba),

        -15px 105px 0 -3px
            var(--cv-turquesa-claro, #4dc4ba);
}

/* Texto */

.cv-reservas-intro__precio span,
.cv-reservas-intro__precio small,
.cv-reservas-intro__precio strong {
    position: relative;
    z-index: 1;
}

.cv-reservas-intro__precio span,
.cv-reservas-intro__precio small {
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cv-reservas-intro__precio strong {
    margin-block: 0.15rem;

    font-family: var(
        --cv-font-display,
        "Cormorant Garamond",
        serif
    );
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 0.9;
}

@media (max-width: 700px) {

    .cv-reservas-intro {
        padding-top: 9rem;
    }

    .cv-reservas-intro__precio {
        top: 1rem;
        right: 50%;

        width: 150px;
        min-height: 122px;
        padding: 1rem;

        transform: translateX(50%);
    }

    .cv-reservas-intro__precio::before {
        inset: -9px;
    }

    .cv-reservas-intro__precio strong {
        font-size: 2.1rem;
    }
}

/* ─────────────────────────────────────────────
   RESPONSIVE
   ───────────────────────────────────────────── */
@media (max-width: 1024px) {
    .cv-intro__grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .cv-hero {
        clip-path: none;
        min-height: 80vh;
    }
}

@media (max-width: 768px) {
    .cv-section {
        padding: 4rem 0;
    }

    .cv-hero {
        min-height: 75vh;
    }

    .cv-hero__titulo {
        font-size: clamp(2rem, 8vw, 3rem);
    }

    .cv-hero__ctas {
        flex-direction: column;
        align-items: center;
    }

    .cv-intro__imagen {
        aspect-ratio: 16/9;
    }
}

/* ─────────────────────────────────────────────
   ACCESIBILIDAD
   ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition: none !important;
        animation: none !important;
    }
}

.cv-btn:focus-visible {
    outline: 2px solid var(--cv-turquesa);
    outline-offset: 3px;
}

/* =====================================================
   AJUSTE FINAL GALERÍA — TABLET
   ===================================================== */

@media (max-width: 900px) {

    .cv-galeria-estancia
    .cv-galeria-estancia__imagenes {
        width: 100%;
        max-width: 680px;
        margin-right: auto;
        margin-left: auto;
    }

    .cv-galeria-estancia
    .cv-galeria-estancia__principal {
        width: 100%;
        min-height: 0;
        aspect-ratio: 3 / 2;
    }
}