/*traductor*/
.color_texto{
  color: #5a3f2f !important;
}
.color_texto p,ul,li{
  color: #5a3f2f !important;
}
/* contenedor superior */
.topbar{
  background:#f6efe8; border-bottom:1px solid #e9dfd6;
  font-size:14px; color:#3e2f27; position:relative; z-index:1000;
}
.topbar__inner{ max-width:1200px; margin:0 auto; padding:8px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
@media(max-width:768px){ .topbar__inner{flex-wrap:wrap; gap:8px;} }

/* gtranslate fix */
.gtranslate_wrapper{ position:relative; z-index:5; }

/* el menú que empuja (ocultarlo del flujo y flotarlo) */
.gtranslate_wrapper .gt_option{

  top:calc(100% + 6px);
  left:0;
  background:#fff;
  border:1px solid #e8e0d8;
  border-radius:8px;
  box-shadow:0 8px 25px rgba(0,0,0,.15);
  min-width:220px;
  max-height:260px;
  overflow:auto;
  z-index:10000;
  display:none !important;
}

/* cuando tiene el inline style display:block (lo forza el plugin) lo sobrescribimos */
.gtranslate_wrapper .gt_option[style*="display: block"],
.gtranslate_wrapper .gt_option[style*="display:block"]{
  display:block !important;
}

/* items */
.gtranslate_wrapper .gt_option a{
  display:flex; align-items:center; gap:.5rem; padding:6px 10px; white-space:nowrap;
}


/**declaracion de fuentes*/
@font-face{
  font-family: "Grenda";
  src: url("/wp/wp-content/themes/bidmont-onepage/assets/font/grenda.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family:"CocoGothic";
  src:url("/wp/wp-content/themes/bidmont-onepage/assets/font/CocoGothic_trial.ttf") format("opentype");
  font-weight:300; font-style:normal; font-display:swap;
}
/* clase utilitaria para usar Grenda */
.font-grenda{
  font-family: "Grenda", Georgia, "Times New Roman", serif;
  letter-spacing: .2px; /* opcional, afina tracking */
}
/* clase utilitaria para usar CocoGothic */
/* utilitaria */
.font-cocogothic{
  font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
@font-face{
  font-family:"Figurlce";
  src:url("/wp/wp-content/themes/bidmont-onepage/assets/font/Figurlce.otf") format("opentype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* clase utilitaria para aplicarla donde quieras */
.font-figurlce{
  font-family:"Figurlce";
}
@font-face{
  font-family:"BrandonGrotesque";
  src:url("/wp/wp-content/themes/bidmont-onepage/assets/font/Brandon_reg.otf") format("opentype");
  font-display:swap;
}

/* clase utilitaria para aplicarla donde quieras */
.font-brandongrotesque{
  font-family:"BrandonGrotesque";
  font-size: 15px;
}
/* Basic styles inspired by the provided mock */
:root { --c1:#3a2b23; --c2:#e6dccf; --text:#1e1e1e; }
*{box-sizing:border-box} body.onepage{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);}

/* ----- Header sobre el hero ----- */
.op-over-hero{
  position:absolute; top:0; left:0; right:0;
  background:transparent; border-bottom:none; z-index:50;
}
.op-over-hero .op-menu a{ color:#fff; }
.op-over-hero .op-menu a:hover{ background:rgba(255,255,255,.15); }
.op-over-hero .op-cta{ background:#fff; color:#111; }

/* Header cuando se hace scroll */
.op-over-hero.is-scrolled{
  position:fixed; background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.2) blur(6px);
  border-bottom:1px solid #eee;
}
.op-over-hero.is-scrolled .op-menu a{ color:#333; }
.op-over-hero.is-scrolled .op-menu a:hover{ background:#f2f2f2; }
.op-over-hero.is-scrolled .op-cta{ background:#3a2b23; color:#fff; }

/* Header */
.op-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eee;}
.op-container{width:min(1120px,92%);margin:auto;}
.op-header .op-container{display:flex;align-items:center;gap:16px;padding:12px 0;}
.op-brand{font-weight:700;letter-spacing:.06em;}
.op-menu, .op-nav ul{display:flex;gap:14px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.op-menu a{color:#444;text-decoration:none;padding:6px 8px;border-radius:8px}
.op-menu a:hover{background:#f3f3f3}
.op-cta{background:var(--c1);color:#fff;padding:8px 14px;border-radius:999px;text-decoration:none}

/* Hero */
/* Hero */
.op-hero{ position:relative; min-height:78vh; background:var(--hero) center/cover no-repeat; display:grid; place-items:center; text-align:center; }
/* cuando usamos <img> como fondo */
.op-hero.use-img{ background: none; }
.op-hero-bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: stretch;              /* << se adapta llenando */
  object-position: center center; /* centra la composición */
  z-index:0;
}
/*.op-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.45)); }*/
.op-hero::after{ content:""; position:absolute; inset:0; background: transparent; }
.op-hero .op-hero-content{ position:relative; z-index:1; color:#fff; padding:48px 16px; }
/* ----- HERO ----- */
.op-hero h1{margin:0 0 .25rem;font-size:95px;letter-spacing:.02em}
.op-btn,.op-btn-sm{display:inline-block;background:#fff;color:#111;padding:10px 18px;border-radius:999px;text-decoration:none}
.op-btn-sm{padding:8px 14px}
/* ===== Menú flotante del hero / 1 sola línea ===== */
.op-hero-nav{
  position:absolute;
  left:50%; bottom:28px; transform:translateX(-50%);
  z-index:2;
  width:min(1180px, 94vw);     /* limita el ancho para que quepa en 1 fila */
}
/* Una fila exacta con 5 columnas (ajusta el 5 si cambias el nº de items) */
.op-hero-menu{
  display:grid;
  grid-template-columns: repeat(5, minmax(160px, 1fr));
  gap:20px;                    /* separación entre pastillas */
  list-style:none; margin:0; padding:0;
  align-items:end;
}
.op-hero-menu li{ width:100%; position:relative; }
.op-hero-menu a{
  display:flex; align-items:center; justify-content:center;
  height:50px;                 /* altura fija de la pastilla */
  padding:0 18px;              /* sin padding vertical extra para que no crezca */
  text-transform:uppercase;
  letter-spacing:.20em;
  font-weight:bold;
  color:#623E2A;
  font-size: 10px;
  text-decoration:none;
  background:rgba(255,255,255,.60);/* el 62 es para la transparencia */
  border:0px;
  backdrop-filter: blur(6px) saturate(1.1);
}
.op-hero-menu li::after{
  content:""; position:absolute; z-index:-1;
  left:16px; right:16px; bottom:-12px; height:14px;
  background:rgba(0,0,0,.25); filter:blur(8px); border-radius:999px;
}
.op-hero-menu a:hover{ background:rgba(255,255,255,.95); }

/* En pantallas más angostas, reducimos todo un poco o dejamos 2 filas si no cabe */
@media (max-width:1100px){
  .op-hero-menu{ gap:18px; }
  .op-hero-menu a{ height:56px; letter-spacing:.14em; padding:0 14px; }
}
@media (max-width:820px){
  /* Si quieres seguir forzando 1 fila con scroll horizontal, descomenta:
  .op-hero-menu{ grid-auto-flow:column; grid-auto-columns:minmax(160px,1fr); overflow-x:auto; }
  .op-hero-nav{ width:100vw; left:50%; transform:translateX(-50%); }
  */
  /* O deja que pase a 2 filas ordenadas: */
  .op-hero-menu{ grid-template-columns: repeat(2, 1fr); }
  .op-title{
    font-weight: 400;
    font-size: 80px;
    line-height: 1.05;
    margin: 6px 0 8px;
    color: #fff;
    text-shadow: 0 6px 22px rgba(0,0,0,.35);
  }
  .op-subtitle p{
    font-size: 10px !important;
  }
  .op-subtitle{
    font-size: 10px !important;
  }
  .op-hero h1{margin:0 0 .25rem;font-size:70px;letter-spacing:.02em}
}
/* Tipos para el hero */
.op-title{
  font-weight: 400;
  font-size: clamp(48px, 9vw, 116px);
  line-height: 1.05;
  margin: 6px 0 8px;
  color: #fff;
  text-shadow: 0 6px 22px rgba(0,0,0,.35);
}
.op-subtitle{
  font-weight: 300;
  font-size: clamp(18px, 2.8vw, 36px);
  letter-spacing: .02em;
  color: #fff;
  margin: 0 0 22px;
  text-shadow: 0 6px 20px rgba(0,0,0,.30);
}
.op-kicker{
  display: inline-block;
  font-size: clamp(12px, 1.6vw, 16px);
  letter-spacing: .55em;      /* separación amplia */
  color: rgba(255,255,255,.92);
  text-transform: uppercase;
  margin-bottom: 10px;
  text-shadow: 0 4px 16px rgba(0,0,0,.35);
}

/* (por si bajaste el overlay del hero y el texto perdía contraste) */
.op-hero::after{
  background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.20));
}
/* Sections */
.op-section{padding:64px 0}
.op-section-muted{background:#faf7f2}
.op-grid-2{display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:900px){.op-grid-2{grid-template-columns:1fr}}
.op-img{width:100%;height:auto;border-radius:0px;}

/* Cards / Swiper */
.op-card{border:1px solid #eee;border-radius:0px;overflow:hidden;background:#fff}
.op-card-img{width:100%;height:260px;object-fit:cover}
.op-card-body{padding:14px}
.swiper-button-prev,.swiper-button-next{color:#333}



/* Eventos */
.evento-lista{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.evento{padding:10px 12px;border:1px solid #eee;border-radius:12px;background:#fff}
.evento-excerpt{display:block;color:#555;margin-top:.25rem}

/* Testimonial */
.opinion{max-width:760px;margin:0 auto;text-align:center}
.opinion p{margin:0 0 .5rem}
/* ===== Opiniones en texto (estilo similar a tu mock) ===== */
.opiniones-wrap{ background:#F4F1ED; padding:36px 0 42px; }
.opiniones-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:28px;
}
@media (max-width:900px){ .opiniones-grid{ grid-template-columns:1fr; } }

.testi{
  position:relative;
  background:#fbf7f2;
  border:1px solid #e4d8cd;
  border-radius:6px;
  padding:22px 22px 16px;
  color:#4a4038;
}

/* Comillas grandes decorativas */
.testi::before{
  content:"“";
  position:absolute;
  left:12px; top:6px;
  font-size:42px; line-height:1; opacity:.25;
  color:#5a3f2f; font-family: "Grenda", Georgia, serif;
}

/* Cuerpo del texto */
.testi-body p{
  margin:0 0 12px;
  line-height:1.8;
  text-align:justify;
  font-family:"BrandonGrotesque";
  font-size:15px;
  color:#5a3f2f;
}

/* Meta (estrellas + autor) */
.testi-meta{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; border-top:1px dashed #e2d6cb; padding-top:10px;
}

/* Estrellas: por defecto con unicode; si tienes Font Awesome, puedes cambiarlo */
.testi-stars{
  font-size:16px; letter-spacing:2px; color:#5a3f2f; white-space:nowrap;
}

/* Autor */
.testi-author{
  font-style:normal; font-weight:700; color:#5a3f2f;
  font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size:14px;
  text-align:right;
}

/* Variante de tono para alternar (opcional) */
.opiniones-grid .testi:nth-child(2n){
  background:#f7f2ec;
}


/* Footer */
.op-footer{padding:28px 0;border-top:1px solid #eee;background:#fff;}
.op-footer .op-container{display:flex;justify-content:space-between;align-items:center}
.op-social a{margin-left:10px;text-decoration:none;color:#666}

/* ===== Barra de Reserva ===== */
.bkbar{
  background:#f6f0e9;            /* beige muy claro de la maqueta */
  padding:18px 0 14px;
  position:relative;
  z-index:5;
  border-bottom:1px solid #ece3d9;
}
.bk-grid{
  display:grid;
  grid-template-columns: 96px 1.1fr .6fr .6fr .9fr 200px;
  align-items:end;
  gap:28px;
}
.bk-logo img{ width:120px; height:auto; display:block;padding:5px; }

.bk-field{ position:relative;top:-30px; }
.bk-label{
  display:block;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#4e463f;
  margin-bottom:8px;
}
.bk-field input{
  width:100%;
  border:none;
  border-bottom:3px solid #1e1e1e;
  background:transparent;
  padding:8px 6px 10px;
  font-size:16px;
  outline:none;
}
.bk-field input::-webkit-outer-spin-button,
.bk-field input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.bk-field input[type=number]{ -moz-appearance:textfield; }

.bk-cta{ position: relative; justify-content:flex-end; align-items:end;top:-30px; }
.bk-cta button{
  width:100%;
  height:44px;
  border:none;
  border-radius:8px;
  background:#e6d7cf;        /* botón rosado-beige */
  color:#2b2a28;
  letter-spacing:.25em;
  text-transform:uppercase;
  font-weight:700;
  cursor:pointer;
}
.bk-cta button:hover{ filter:brightness(0.95); }

@media (max-width:1100px){
  .bk-grid{
    grid-template-columns: 72px 1fr 1fr 1fr;
    grid-auto-rows:auto;
    gap:18px;
  }
  .bk-logo{ grid-column:1 / 2; grid-row:1; }
  .bk-field:nth-child(2){ 
   /* grid-column:2 / -1; */
  }      /* rango de fechas a lo ancho */
  .bk-cta{ grid-column:3 / -1; }
}
@media (max-width:680px){
  .bk-grid{ grid-template-columns: 1fr 1fr; }
  .bk-logo{ display:none; }
  .bk-cta{ grid-column:1 / -1; }
}
/* Bienestar slider */
.bienestar-swiper{ position:relative; border-radius:0px; overflow:hidden; }
.bienestar-swiper .swiper-slide img{
  width:450px; height:450px; object-fit:cover; display:block;
}
@media (max-width:900px){
  .bienestar-swiper .swiper-slide img{ height:300px; }
}

/* Paginación tipo “puntitos” blancos centrados, abajo */
.bienestar-swiper .swiper-pagination{
  bottom:10px !important;
  width:450px !important;
}
.bienestar-swiper .swiper-pagination-bullet{
  background:#fff; opacity:.55; width:8px; height:8px; margin:0 4px !important;
  box-shadow:0 1px 6px rgba(0,0,0,.4);
}
.bienestar-swiper .swiper-pagination-bullet-active{ opacity:1; }
/* Título “Recinto de Bienestar” */

#bienestar{
  background-color: #f5efe8;
}
#recinto{
  background-color: #F4F1ED;
}


#recinto h2{
  font-size: clamp(28px, 4vw, 48px);
  color:#5a3f2f;
  margin: 0 0 18px;
}
/* Párrafos y lista */
.op-bienestar p, .op-bienestar li{
  color:#4a4038;
  line-height:1.7;
  text-align: justify;
}
.op-bienestar ul{ padding-left:1.2rem; }
/* Galería por habitación (mini-slider dentro de la tarjeta) */
/* Fondo crema de la sección */
.op-section-cream{ background:#f3eee7; }
/* Título centrado y serif */
.sec-title{
  text-align:center;
  font-family: "Grenda", Georgia, "Times New Roman", serif;
  font-size:48px;
  color:#5a3f2f;
  margin:0 0 26px;
}
/* Tarjeta */
.room-card{ background:transparent; }
.room-media{ border-radius:0px; overflow:hidden; }
.room-img{ width:100%; height:260px; object-fit:cover; display:block; }
/* Borde + fondo propio de la descripción (como la referencia) */
.room-desc{
  margin-top:14px;
  padding:18px 20px;
  border:3px solid #d9cfc6;
  border-radius:0px;
  background:#f8f3ee;     /* ligeramente más claro que la sección */
}
.room-meta{
  color:#6b5a50; font-size:14px; line-height:1.6; margin-bottom:10px;
  font-family:"BrandonGrotesque";
  
}
.room-title{
  font-family: "Grenda", Georgia, "Times New Roman", serif;
  color:#4a3a2f;
  font-size:21px;
  margin:6px 0 8px;
}
.room-price{
  color:#553f33; font-size:12.9px;font-family:"BrandonGrotesque";
}

/*
.hab-gal-swiper{ position:relative; }
.hab-gal-swiper .op-card-img{
  width:100%; height:260px; object-fit:cover; display:block;
}*/
.hab-gal-swiper .swiper-pagination{ bottom:10px !important; }

.hab-gal-swiper .swiper-pagination-bullet{
  background:#fff; opacity:.6; width:8px; height:8px;
  box-shadow:0 1px 6px rgba(0,0,0,.35);
}
.hab-gal-swiper .swiper-pagination-bullet-active{ opacity:1; }
/* CTA centrado al final de la sección */
.rooms-cta{ text-align:center; margin:28px 0 4px; }
.rooms-btn{
  display:inline-block; padding:12px 28px; border-radius:0px;
  background:#e6d7cf; color:#2b2a28; letter-spacing:.22em;
  text-transform:uppercase; font-weight:700; text-decoration:none;
}
.rooms-btn:hover{ filter:brightness(.96); }
/* Móvil: apilar las HABITACIONES (carrusel grande) */
@media (max-width: 768px) {
  /* solo el wrapper DIRECTO del carrusel grande */
  .habitaciones-swiper > .swiper-wrapper {
    display: block !important;     /* deja de ser carrusel */
    transform: none !important;
    width: auto !important;
  }

  /* solo las slides DIRECTAS del carrusel grande */
  .habitaciones-swiper > .swiper-wrapper > .swiper-slide {
    width: 100% !important;
    margin: 0 0 28px 0 !important;
  }

  /* ocultar controles del carrusel grande */
  .habitaciones-swiper > .swiper-pagination,
  .habitaciones-swiper > .swiper-button-prev,
  .habitaciones-swiper > .swiper-button-next {
    display: none !important;
  }

  /* IMPORTANTE: NO tocar nada de la galería interna */
  /* .hab-gal-swiper ... (sin reglas aquí) */
}
/* ===== Amenidades (dos bloques) ===== */
#amenidades{
  padding-top: 30px;
  background-color: #F4F1ED;
}
.op-amen-top{ background:#F4F1ED; padding:0; }
.op-amen .sec-title{ margin-top:0; } 
.op-amen-bottom{ background:#f7f2ec; padding:150px 0 40px; }

.amen-text{
margin-right:50px;
}

.amen-text p, .amen-text li{ 
  color:#4a4038; 
  line-height:1.7;
  font-family:"BrandonGrotesque";
  font-size: 15.3px;
  text-align:justify;
 }
.amen-text ul{ padding-left:1.2rem; }

/* Slider derecha */
.amen-swiper{ position:relative; border-radius:0px; overflow:hidden; }
.amen-img{ width:100%; height:340px; object-fit:cover; display:block; }
.amen-swiper .swiper-pagination{ bottom:10px !important;text-align:right; }
.amen-swiper .swiper-pagination-bullet{
  background:#fff; opacity:.75; width:8px; height:8px; box-shadow:0 1px 6px rgba(0,0,0,.35);
}
.amen-swiper .swiper-pagination-bullet-active{ opacity:1; }

/* Caption enmarcado bajo el slider */
.amen-caption{
  margin-top:10px; text-align:center; font-size:10px; color:#6a5a50;
  border:1px solid #d9cfc6; border-radius:0px; padding:10px 12px; background:#faf6f2;
  font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Tarjetas de abajo (dos imágenes sin slider) */
.amen-card{ margin:0; }
.amen-card img{ width:100%; height:360px; object-fit:cover; border-radius:0px; display:block; }
.amen-card-caption{
  margin:12px auto 0; text-align:center; font-size:13px; line-height:1.6; color:#6a5a50;
  border:1px solid #d9cfc6; border-radius:0px; padding:10px 12px; width:100%;
  font-family:"BrandonGrotesque";
  background:#f3ede7;
}

/* Helpers ya usados en el tema */
.op-gap-lg{ gap:28px; }
@media (max-width:900px){
  .amen-img{ height:260px; }
  .amen-card img{ height:260px; }
}


/* ===== Experiencias ===== */
.op-exps{ background:#f3eee7; padding:28px 0 36px; }
.op-exps .sec-title{ text-align:center; margin-bottom:18px; }

/* Rejillas */
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
@media (max-width:1100px){ .grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .grid-4{ grid-template-columns:1fr; } }

/* Fila superior */
.exp-img{ width:100%; height:320px; object-fit:cover; border-radius:10px; display:block; }
.exp-swiper{ border-radius:10px; overflow:hidden; }
.exp-swiper .swiper-pagination{ bottom:8px !important; }
.exp-swiper .swiper-pagination-bullet{
  background:#fff; opacity:.75; width:8px; height:8px; box-shadow:0 1px 6px rgba(0,0,0,.35);
}
.exp-pill{
  display:block; text-align:center; margin-top:10px; padding:10px 14px;
  border:1px solid #d8cfc6; background:#f7f2ec; border-radius:8px; color:#5a4a3f;
}

/* Fila inferior */
.exp-activity-head{
  border:1px solid #d8cfc6; background:#efe7dc; border-radius:6px;
  padding:8px 10px; text-align:center; margin:0 0 8px; color:#5a4a3f;
}
.exp-act-img{ width:100%; height:340px; object-fit:cover; border-radius:10px; display:block; }
.exp-act-video{ width:100%; height:340px; object-fit:cover; border-radius:10px; display:block; }

/* Embeds responsivos */
.exp-embed{ width:100%; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#000; }
.exp-embed iframe{ width:100%; height:100%; border:0; display:block; }

/* Quita transiciones/opacidad que meten algunos lazy-loaders */
.exp-img,
.exp-act-img,
.exp-act-video {
  opacity: 1 !important;
  transition: none !important;
}

/* El contenedor del swiper siempre visible */
.exp-swiper { visibility: visible !important; }

/* Evita “fades” que provocan flash al cargar */
.op-img,
.room-img {
  opacity: 1 !important;
  transition: none !important;
}
/* ===== A&B | Eventos ===== */
.op-events{ background:#F4F1ED; } /* mismo fondo que experiencias/amenidades */
.events-text p, .events-text li{ 
  color:#4a4038; line-height:1.7;
  font-family:"BrandonGrotesque";
  font-size: 12.8px;

}
.events-text ul{ padding-left:1.2rem; }

/* Slider derecha */
.events-swiper{ position:relative; border-radius:0px; overflow:hidden; }
.events-img{ width:100%; height:600px; object-fit:cover; display:block; }
.events-swiper .swiper-pagination{ bottom:10px !important; }
.events-swiper .swiper-pagination-bullet{
  background:#fff; opacity:.75; width:8px; height:8px; box-shadow:0 1px 6px rgba(0,0,0,.35);
}
.events-swiper .swiper-pagination-bullet-active{ opacity:1; }

/* Botón/leyenda bajo el slider */
.events-cta{
  display:block; text-align:center; margin-top:12px; padding:12px 14px;
  border:1px solid #d9cfc6; background:#f7f2ec; border-radius:6px; color:#5a4a3f;
  text-decoration:none; letter-spacing:.06em;
  font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;

}
.events-cta:hover{ filter:brightness(0.97); }
.op-reviews-figure{ background-color: #f3eee7; }
.op-reviews-figure{ margin:0; }
.op-reviews-img{ width:100%; height:auto; display:block; border-radius:0; }
.reviews-source{ margin-top:12px; color:#7a6b62; }
.op-reviews{
  background:#F4F1ED;   /* cambia aquí al tono que quieras */
}

/* ====== Footer ====== */
.ft{ background:#f3eee7; padding:36px 0 26px; }

/* Head (logo + políticas) */
.ft-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:32px; margin-bottom:24px;
}
.ft-brand img{ max-width:460px; height:auto; display:block; }
.ft-policies{ text-align:right; }
.ft-policies-title{
  font-size:14px; letter-spacing:.18em; text-transform:uppercase;
  color:#5a4a3f; margin-bottom:8px;
}

/* 3 tarjetas */
.ft-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  margin-top:8px; margin-bottom:22px;
}
.ft-card h3{
  font-family: "Grenda", Georgia, "Times New Roman", serif;
  font-size: 21px;
}
.ft-card p{
  font-family: "Grenda", Georgia, "Times New Roman", serif;
  font-size: 14px;
}
.ft-card{
  border:2px solid #ffffff; background:#f7f2ec; padding:22px; border-radius:2px;
  color:#4a4038;
}
.ft-card-title{
  font-family:'Cormorant Garamond', serif;
  font-weight:600; color:#4a3a2f;
  font-size:clamp(20px, 2.2vw, 24px); margin:0 0 10px;
}
.ft-card-sub{ margin:.6rem 0 .25rem; font-weight:600; color:#5a4a3f; }
.ft-card a{ color:#3a2b23; text-decoration:none; border-bottom:1px solid rgba(58,43,35,.25); }
.ft-card a:hover{ border-bottom-color:transparent; }

/* Social */
.ft-social{ display:flex; gap:12px; margin:6px 0 8px; }
.ft-social-btn{
  width:40px; height:40px; border:1px solid #d9cfc6; border-radius:999px;
  display:grid; place-items:center; text-decoration:none; color:#5a4a3f;
  font-family: "Font Awesome 5 Free","Font Awesome 6 Free","Arial",sans-serif; /* o el set de iconos que uses */
  font-weight:900;
}
.ft-hint{ font-size:13px; color:#6a5a50; text-align:left; }
.ft-social-btn i{ font-size:18px; line-height:1; }
/* CTA */
.ft-cta{ text-align:center; margin:8px 0 4px; }
.rooms-btn{
  display:inline-block; padding:12px 28px; border-radius:0px;
  background:#e6d7cf; color:#2b2a28; letter-spacing:.22em; text-transform:uppercase; font-weight:700; text-decoration:none;
}
.rooms-btn:hover{ filter:brightness(.96); }

/* Bottom row */
.ft-bottom{
  display:flex; align-items:center; justify-content:center; gap:18px; margin-top:10px;
}
.ft-links{ display:flex; gap:18px; flex-wrap:wrap; }
.ft-links a{ color:#5a4a3f; text-decoration:none; border-bottom:1px dashed rgba(90,74,63,.4); }
.ft-links a:hover{ border-bottom-color:transparent; }
.ft-tags{
  display:flex; gap:18px; list-style:none; margin:0; padding:0; color:#5a4a3f; flex-wrap:wrap;
}

/* Responsive */
@media (max-width:980px){
  .ft-brand img{ max-width:360px; }
  .ft-cards{ grid-template-columns:1fr 1fr; }
}
@media (max-width:720px){
  .ft-head{ flex-direction:column; align-items:flex-start; }
  .ft-policies{ text-align:left; }
  .ft-badges{ justify-content:flex-start; }
  .ft-cards{ grid-template-columns:1fr; }
  .ft-bottom{ flex-direction:column; align-items:flex-start; }
}
/* Forzar que el bloque de Políticas quede a la misma altura del logo */
@media (min-width:981px){
  .op-footer-lg .ft-policies{
    position: relative;
    top: -150px;               /* ajusta -16 / -18 / -20 a tu gusto */
    margin-top: 0 !important; /* anula márgenes previos */
  }
  .op-footer-lg .ft-policies-title{
    margin: 0 0 8px;
    line-height: 1;
  }
}

.ft-links1{ display:grid !important; 
    gap:5px!important; 
     flex-wrap:wrap; 
     font-family:"BrandonGrotesque";
     font-size: 13.3px;
}
.ft-links1 a{ color:#5a4a3f; text-decoration:none; }
.ft-links1 a:hover{ text-decoration:underline; }

.ft-badges1{ 
    display:grid !important;
    gap:5px !important;  
    flex-wrap:wrap; 
    color:#5a4a3f; 
    text-align:right;
    font-family:"BrandonGrotesque";
     font-size: 13.3px;
  }

/* CTA central */
.ft-cta{ text-align:center; margin:26px 0 60px; }
.ft-cta-btn{
  display:inline-block; padding:12px 26px; border:2px solid white;
  background:#f7f2ec; color:#2b2a28; letter-spacing:.22em; text-transform:uppercase; font-weight:700; text-decoration:none;
  font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 10.3px;
}
.ft-cta-btn:hover{ filter:brightness(.96); }


/* ===== Ubicación y Cercanía ===== */
.section-ubicacion{
  background:#F2EEE8;                /* crema del sitio */
  padding:42px 0 36px;
  color:#3a2b23;
}
.section-ubicacion .op-container{ width:min(1120px,92%); margin:auto; }

/* Título con “rectángulo” */
.uc-header{ text-align:center; margin:0 0 16px; }
.uc-title{
  display:inline-block;
  margin:0;
  width:100%;;
  padding:10px 18px;
  background:#f7f2ec;
  border:1px solid #d9cfc6;
  border-radius:6px;
  font-family:'Cormorant Garamond', serif;
  font-weight:600;
  font-size:clamp(28px,4.5vw,48px);
  color:#5a3f2f;
  letter-spacing:.02em;
}

/* Mapa 100% ancho / alto controlado por variable */
.uc-map{
  width:100%;
  height:var(--uc-h, 420px);
  border:1px solid #d9cfc6;
  border-radius:6px;
  overflow:hidden;
  background:#eee;
}
.uc-map iframe{
  width:100%; height:100%;
  border:0; display:block;
}

/* Franja de dirección/enlace */
.uc-address{
  margin-top:10px;
  border:1px solid #d9cfc6;
  background:#f7f2ec;
  border-radius:6px;
  padding:10px 12px;
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
}
.uc-address .uc-addr{ font-weight:600; }
.uc-address .uc-link{
  color:#3a2b23;
  text-decoration:none;
  border-bottom:1px dashed rgba(58,43,35,.35);
}
.uc-address .uc-link:hover{ border-bottom-color:transparent; }

/* 3 columnas de cercanías */
.uc-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:16px;
}
.uc-col ul{ margin:0; padding-left:1.2rem; }
.uc-col li{ line-height:1.6; color:#4a4038; }

/* Caja de “Dato importante” */
.uc-notes{
  margin-top:14px;
  border:1px solid #d9cfc6;
  background:#f7f2ec;
  border-radius:6px;
  padding:12px;
}
.uc-notes h4{
  margin:0 0 8px;
  font-weight:700;
  letter-spacing:.05em;
  color:#5a3f2f;
  padding-left: 10px;
}
.uc-notes p{
  font-size: 13px;
}

/* Responsive */
@media (max-width:980px){
  .uc-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:680px){
  .uc-grid{ grid-template-columns:1fr; }
  .uc-map{ --uc-h:320px; }    /* un poco menos alto en móviles */
}

/* ===== Cercanías en 3 columnas dentro de una caja ===== */
/* Caja + 3 columnas */
.contact-nearby{
  background:#f7f2ec;
  padding:0px;
  margin:8px 0;
font-size:13px;
  list-style:none;
  color:#4a4038;

  display:grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap:8px 22px;
}
.contact-nearby li{ margin:0; }

/* Tablet → 2 columnas */
@media (max-width:1024px){
  .contact-nearby{ grid-template-columns: repeat(2, minmax(200px, 1fr)); }
}
/* Móvil → 1 columna */
@media (max-width:640px){
  .contact-nearby{ grid-template-columns: 1fr; }
}

/* Haz que la caja de cercanías se extienda a todo el ancho del bloque meta */
.contact-meta .contact-nearby{ grid-column: 1 / -1; }

/*para los spinner*/
/* Panel flotante (no interfiere con tus estilos) */
.bk-people-panel {
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  margin-top: 8px;
  width: min(380px, 92vw);
  background: #f6f0e9;
  border: 1px solid #e2ddd7;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0,0,0,.12);
}
.bk-people-panel[hidden] { display: none; }

.bk-people-panel .pp-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid #eee;
}
.bk-people-panel .pp-close {
  border: 0; background: transparent; font-size: 20px; line-height: 1; cursor: pointer;
}

.bk-people-panel .pp-body { max-height: 50vh; overflow: auto; padding: 10px 12px; }
.bk-people-panel .pp-row {
  display: grid; grid-template-columns: 1fr 140px; align-items: center; gap: 12px; padding: 10px 0;
}
.bk-people-panel .pp-row + .pp-row { border-top: 1px solid #f2f2f2; }

.bk-people-panel .pp-label { color: #444; font-weight: 600; }

/* El select del panel se ve “neutral” y no toca tus selects de la barra */
.bk-people-panel select {
  padding: 10px 12px;
  border: 1px solid #e2ddd7;
  border-radius: 3px;
  width:100%;
  background: #fff;
  font: inherit; line-height: 1.2;
  appearance: none; background-image: none;
}


/* Oculta el select nativo sin afectar el layout */
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Ancla del dropdown */
#rooms-field { position: relative; }

/* Dropdown (solo afecta .bk-dd) */
.bk-dd[hidden] { display: none; }
.bk-dd {
  position: absolute;
  z-index: 30;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #e2ddd7;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0,0,0,.12);
  padding: 6px;
}
.bk-dd button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 10px 12px;
  border-radius: 8px;
  font: inherit;
  cursor: pointer;
}
.bk-dd button:hover,
.bk-dd button:focus { background: #f6f2ee; outline: none; }

/*boton reservar en habitaciones*/
:root{
  /* tonos suaves del botón */
  --resv-bg:      #e6d6ce;   /* beige claro (fondo) */
  --resv-bd:      #d8c6bc;   /* borde */
  --resv-fg:      #2a2624;   /* texto */
  --resv-bg-h:    #ddc9bf;   /* hover */
  --resv-bd-h:    #ccb7ad;   /* hover borde */
}

/* contenedor inferior de la tarjeta (línea superior como en el diseño) */
.card-cta{
  border-top: 1px solid #ded3cb;
  padding: 0px;
  font-size: 10.4px;
}

/* Botón reservar: ancho completo, pill, tracking */
.btn-reservar,
.btn-reservar:link,
.btn-reservar:visited{
  display: block;
  text-align: center;
  width: 100%;
  min-height: 44px;
  padding: 12px 16px;
  margin-top:2px;
  background: var(--resv-bg);
  color: var(--resv-fg);
  border: 3px solid var(--resv-bd);
  border-radius: 0px;

  text-transform: uppercase;
  letter-spacing: .22em;
  font-weight: 700;
  font-size: 13px;  /* ajusta si lo prefieres un poco mayor */
  line-height: 1;
  text-decoration: none;

  transition: background .2s ease, border-color .2s ease, transform .06s ease;
}

/* Hover/Active */
.btn-reservar:hover{ background: var(--resv-bg-h); border-color: var(--resv-bd-h); transform: translateY(-1px); }
.btn-reservar:active{ transform: translateY(0); }

/* Variante “solo borde” (por si la necesitas en alguna tarjeta) */
.btn-reservar.is-outline{
  background: transparent;
}
.btn-reservar.is-outline:hover{
  background: rgba(230,214,206,.25);
}

/* Si el botón es <button> nativo, quita estilos por defecto del navegador */
button.btn-reservar{ appearance:none; -webkit-appearance:none; border-radius:12px; }


/*dos imagenes en eventos*/
/* 2 columnas desiguales: izquierda más ancha */
.op-grid-2.op-uneven {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr; /* ajústalo: 1.2/0.8 si quieres más diferencia */
  gap: var(--op-gap-lg, 24px);
}

/* Que las imágenes llenen bien la tarjeta */
.op-uneven img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* si quieres controlar la altura visual: */
  aspect-ratio: 4 / 3;  /* o 16/9 */
}

/* Responsive: en móvil se apilan 1 columna */
@media (max-width: 768px) {
  .op-grid-2.op-uneven {
    grid-template-columns: 1fr;
  }
}
/* Grid más compacto */
.bw-grid-4 {
  grid-template-columns: repeat(4, 1fr);
  gap: 12px; /* menos espacio entre cuadros */
}

/* El contenedor de cada tarjeta más reducido */
.bw-card {
  padding: 2px;
  border-radius: 1px;
}

/* Imágenes adaptadas */
.bw-card .bw-img,
.bw-card .bw-video {
  width: 100%;
  height: 400px;        /* o 200px, ajústalo */
  object-fit: cover;    /* rellena el cuadro sin deformar */
  border-radius: 0px;
}

/* Para móvil aún más pequeñas */
@media (max-width: 768px) {
  .bw-card .bw-img,
  .bw-card .bw-video {
    height: 140px;
  }
}
.bw-flyers{
  margin-bottom: 30px;
}

.ft-tagline{ 
  margin-top:10px; 
  font-size:13px; 
  color:#6a5a50; 
font-family:"CocoGothic", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
font-size: 13.3px !important;
text-align: right !important;
}

/*para la version mobile*/
/* ============ BASE MÓVIL SUAVE (sin tocar tus grids) ============ */
html, body { width:100%; min-height:100%; overflow-x:hidden; -webkit-text-size-adjust:100%; }
img, video, canvas, svg { max-width:100%; height:auto; display:block; }
figure { margin:0; }

/* evita que columnas/flex/grids se achiquen demasiado */
.op-container * { min-width:0; }

/* ============ SWIPER: asegura altura y contenido visible ============ */
.swiper,
.swiper-wrapper,
.swiper-slide { height:auto !important; }
.swiper-slide img,
.swiper-slide picture,
.swiper-slide video { width:100%; height:auto; display:block; }

/* si tu slider usa un div con background-image, dale alto mínimo */
.swiper-slide .slide-bg,
.swiper-slide .bg,
.swiper-slide .hero-img {
  min-height: 420px;         /* ajusta si lo necesitas */
  background-size: cover;
  background-position: center;
}

/* ============ TOPBAR (sin cambiar layout) ============ */
.topbar{
  background:#f6efe8; border-bottom:1px solid #e9dfd6;
  color:#3e2f27; font-size:14px; position:relative; z-index:1000;
}
.topbar__inner{ max-width:1200px; margin:0 auto; padding:8px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
@media (max-width:768px){ .topbar__inner{ flex-wrap:wrap; gap:8px; } }

/* ============ GTRANSLATE: flotar el menú sin empujar contenido ============ */
/* (no movemos nodos; solo posicionamos el menú cuando el plugin lo muestra) */
.gtranslate_wrapper{ position:relative; z-index:5; }
.gtranslate_wrapper .gt_selected a{ display:inline-flex; align-items:center; gap:.5rem; }

.gtranslate_wrapper .gt_option{
  position:fixed !important; /* FUERA del flujo */
  top:56px;                  /* ajusta según altura de tu topbar */
  right:16px;
  left:auto;
  min-width:220px; max-height:70vh; overflow:auto;
  background:#fff; border:1px solid #e8e0d8; border-radius:8px;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  z-index:100000; display:none;
}
/* Cuando el plugin pone inline display:block, lo respetamos pero flotante */
.gtranslate_wrapper .gt_option[style*="display:block"]{ display:block !important; }

.gtranslate_wrapper .gt_option a{
  display:flex; align-items:center; gap:.5rem; padding:8px 10px; white-space:nowrap;
}
/* ===== Experiencias Bienestar — SOLO MÓVIL ===== */
/* ===== EXPERIENCIAS BIENESTAR — MÓVIL: UNA SOLA COLUMNA ===== */
@media (max-width: 768px){
  /* usa el selector que tengas para la sección */
  .op-bienestar .bw-grid,
  .op-bienestar .bw-grid-videos{
    display: grid;
    grid-template-columns: 1fr !important; /* 1 columna */
    gap: 12px;
  }

  /* tarjetas a ancho completo y más altas */
  .op-bienestar .bw-card{ width:100%; max-width:100%; }

  /* altura mínima de cada recuadro (ajusta a tu gusto) */
  .op-bienestar .bw-card .bw-img,
  .op-bienestar .bw-card .bw-video{
    min-height: 420px;       /* prueba 360–520px si quieres */
    border-radius: 10px;
    overflow: hidden;
  }

  /* que la imagen/video llene el recuadro sin deformarse */
  .op-bienestar .bw-card .bw-img,
  .op-bienestar .bw-card .bw-img img,
  .op-bienestar .bw-card .bw-video video,
  .op-bienestar .bw-card .bw-video iframe{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
  }

  /* título/etiqueta debajo, centrado */
  .op-bienestar .bw-title{
    margin-top:8px;
    text-align:center;
    font-size:15px;
  }
  .ft-policies-icons img{
    display: inline !important;
  }
}
.ft-policies-icons img{
    display: inline !important;
  }
/*estilos para el panel cuando es movil*/
/* ===== BK BAR — SIMPLE MOBILE FIX (sin JS) ===== */
@media (max-width: 768px){
  :root{ --header-h: 64px; } /* altura aprox. de tu header; ajusta 56–80px */
.bkbar{
    padding-top: 30px;
  }
  /* 1 columna */
  .bkbar .bk-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  /* campos en bloque + controles a 100% */
  .bkbar .bk-field,
  .bkbar .bk-cta{ width:100%; }
  .bkbar input[type="text"],
  .bkbar input[type="number"],
  .bkbar input[type="date"],
  .bkbar select,
  .bkbar button{
    width:100% !important;
    min-height:46px;
    padding:10px 12px;
    font-size:16px;
  }

  /* panel de PERSONAS arriba, debajo del header */
  .bkbar #bk-people-panel{
    position:fixed !important;
    left:0; right:0;
    top:var(--header-h) !important;
    width:100vw !important;
    max-height:calc(100vh - var(--header-h) - 12px);
    overflow:auto;
    background:#f6efe8; /* iguala tu fondo */
    padding:16px;
    border-radius:0 0 12px 12px;
    box-shadow:0 8px 24px rgba(0,0,0,.18);
    z-index:100000;
  }

  /* dropdown de HABITACIONES igual que el panel */
  .bkbar #bk-rooms-dd{
    position:fixed !important;
    left:0; right:0;
    top:var(--header-h) !important;
    width:100vw !important;
    max-height:calc(100vh - var(--header-h) - 12px);
    overflow:auto;
    background:#f6efe8;
    padding:12px;
    border-radius:0 0 12px 12px;
    box-shadow:0 8px 24px rgba(0,0,0,.18);
    z-index:100000;
  }

  /* asegúrate que hidden realmente oculte */
  [hidden]{ display:none !important; }
}
/*para el menu de opciones*/
/* visible por defecto (móvil) */
#mobileNav { display:block; }

/* ocúltalo en escritorio (ajusta el breakpoint a tu diseño) */
@media (min-width: 1024px){
  #mobileNav { display:none; }
  .oc-toggle { 
    display: none;
  }
}
/* ===== Menú móvil como LISTA (sin tarjetas) ===== */
@media (max-width:768px){
  
  /* Panel lateral (tu nav dinámico) */
  .op-hero-nav{
    position:fixed; inset:0 auto 0 0; width:min(84vw,320px);
    color:#3e2f27; z-index:10005;
    transform:translateX(-100%); transition:transform .28s ease;
    overflow:auto; padding:8px 0;
  }
  .op-hero-nav.is-open{ transform:translateX(0); }

  /* RESET: elimina estilo de “tarjeta” si lo hubiera */
  .op-hero-menu{ list-style:none; margin:0; padding:8px 0; }
  .op-hero-menu li{ margin:0 !important; }
  .op-hero-menu a{
    display:flex; align-items:center; gap:10px;
    padding:14px 18px;
    text-decoration:none;
    color:#3e2f27;
    font-weight:600;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  /* Separador entre filas */
  .op-hero-menu li + li a{
    border-top:1px solid rgba(0,0,0,.08);
  }

  /* Chevron a la derecha (opcional) */
  .op-hero-menu a::after{
    content:"";
    margin-left:auto;
    width:6px; height:10px;
    border-right:2px solid currentColor;
    border-top:2px solid transparent;
    border-bottom:2px solid transparent;
    opacity:.35;
  }

  /* Estado activo/tap sutil */
  .op-hero-menu a:active{ background:rgba(0,0,0,.04) !important; }

  /* Botón hamburguesa de 3 líneas */
  .oc-toggle{
    position:fixed; top:14px; left:14px; z-index:10010;
    width:42px; height:42px; border:0; border-radius:10px;
    background:rgba(0,0,0,.35); backdrop-filter:blur(4px); cursor:pointer;
    display:flex; align-items:center; justify-content:center; flex-direction:column; gap:4px;
  }
  .oc-toggle span{ width:22px; height:2px; background:#fff; border-radius:2px; }

  /* Backdrop y bloqueo del body ya como lo tienes */
  .oc-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:10000; }
  .oc-no-scroll{ overflow:hidden; touch-action:none; }
}
/* ===== Menú móvil: lista vertical SIN sombras ===== */
@media (max-width:768px){

  /* El panel lateral (tu nav) se mantiene igual */
  .op-hero-nav{
    position:fixed; inset:0 auto 0 0; width:min(84vw,320px);
    background:#f6efe8; color:#3e2f27; z-index:10005;
    transform:translateX(-100%); transition:transform .28s ease;
    box-shadow:6px 0 24px rgba(0,0,0,.18);
    overflow:auto; padding:8px 0;
  }
  .op-hero-nav.is-open{ transform:translateX(0); }

  /* ——— LISTA EN UNA SOLA COLUMNA ——— */
  .op-hero-menu{
    /* si venía en columnas/grids, lo anulamos */
    display:block !important;
    column-count:1 !important;
    margin:0; padding:8px 0;
    list-style:none;
  }
  .op-hero-menu > li{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    box-shadow:none !important;
    background:none !important;
  }
  .op-hero-menu > li > a{
    display:block;
    width:100%;
    padding:14px 18px;
    text-decoration:none;
    color:#3e2f27;
    font-weight:600;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;   /* ← quita sombras */
  }

  /* Separador sutil entre items (opcional). Borra si no lo quieres */
  .op-hero-menu > li + li > a{
    border-top:1px solid rgba(0,0,0,.08);
  }

  /* Quita cualquier “/” o pseudo-elemento que hiciera de divisor */
  .op-hero-menu > li > a::after,
  .op-hero-menu > li > a::before{
    content:none !important;
  }
}
@media (max-width:768px){
  .oc-toggle{
    right:14px;        /* nuevo */
    left:auto;         /* quita el left */
  }
}
@media (max-width:768px){
  .op-hero-nav{
    inset:0 0 0 auto;          /* ancla a la derecha */
    transform:translateX(100%); /* inicia fuera a la derecha */
  }
  .op-hero-nav.is-open{ transform:translateX(0); }
}



/*para opiniones*/
/* Contenedor de la sección (opcional, si ya tienes estilos globales puedes omitir) */
.opiniones-wrap{
  background-color: #F4F1ED;
}

/* GRID: 1 columna móvil, 2 columnas a partir de 768px */
.opiniones-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 768px){
  .opiniones-grid{
    grid-template-columns: 1fr 1fr;
    gap: 28px 32px;
  }
}

/* Tarjeta de imagen (opcional si quieres bordes/redondeado) */
.op-card{
  margin:0;
  padding:0;
  border-radius: 12px;
  overflow:hidden;
  background: transparent;
}

/* Imágenes fluidas, cubren bien el cuadro */
.op-img{
  display:block;
  width:100%;
  height:auto;              /* si quieres alto uniforme, usa bloque con aspect-ratio */
  object-fit: cover;
}

/* Si prefieres alto uniforme, descomenta este bloque
.op-card{
  aspect-ratio: 4 / 3;      // o 16/9
}
.op-img{
  width:100%; height:100%;
  object-fit: cover;
}
*/
/*slider en experiencia y bienestar*/
/* Tarjeta flyer: mantiene estilo existente */
.bw-card--flyer { padding:10px 10px 14px; display:flex; flex-direction:column; }

/* El carrusel dentro de cada tarjeta */
.flyer-swiper .swiper-slide { height:auto; }

.bw-card--flyer .bw-img{
  width:100%;
  aspect-ratio: 3 / 4;      /* mismo alto que antes */
  object-fit:cover;
  border-radius:0px;
}

/* Paginación y flechas por tarjeta */
.flyer-swiper .swiper-pagination-bullet{
  background:#c8b5a6; opacity:.6;
}
.flyer-swiper .swiper-pagination-bullet-active{
  background:#6b4a3a; opacity:1;
}
.flyer-swiper .swiper-button-prev,
.flyer-swiper .swiper-button-next{
  color:#6b4a3a;
}


/*swiper para bienestar */
/* Deja que los hijos del grid/flex puedan encoger */
.bw-grid > * { min-width: 0; }

/* El contenedor del swiper dentro de la tarjeta */
.bw-card--flyer .swiper { 
  width: 100%;
  min-width: 0;         /* clave para que Swiper no calcule un ancho enorme */
}

/* (Opcional) quita restricciones extra */
.bw-card--flyer { 
  min-width: 0;
  overflow: hidden;     /* ya lo tienes, pero ayuda */
}

/* El wrapper no necesita altura fija si usamos autoHeight=false */
.flyer-swiper .swiper-wrapper { height: auto !important; }

/* Mantén el ratio con el IMG (como ya usabas) */
.bw-card--flyer .bw-img{
  width:100%;
  aspect-ratio: 3 / 4;
  object-fit:cover;
  border-radius:0px;
}
@media (min-width: 981px){
  .topbar__inner{
    max-width: 1400px; /* o 1500/1600 según te guste */
  }
}
.swiper-pagination-lock {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  justify-content: center;
}