/* Ajustes visuales propios del sitio (se cargan después del CSS de la app). */

/* Fotos del hero: acercamiento lento y profundo cada vez que una foto aparece (ver barona-effects.js) */
.ken-burns { animation: none; transform-origin: 50% 58%; will-change: transform; }
.ken-burns[data-bz] { animation: baronaZoom 16s cubic-bezier(.22, .61, .36, 1) forwards; }
@keyframes baronaZoom {
  from { transform: scale(1); }
  to { transform: scale(1.22); }
}
/* El acercamiento y el 360° de la entrada son parte del diseño pedido por el cliente: se muestran
   aunque el sistema tenga las animaciones reducidas (p. ej. Windows con "Mostrar animaciones" apagado). */

/* Entrada: panorámica 360° (Pannellum) a pantalla completa, sin controles ni textos del visor */
#barona-pano .pnlm-load-box, #barona-pano .pnlm-about-msg, #barona-pano .pnlm-controls-container,
#barona-pano .pnlm-panorama-info, #barona-pano .pnlm-orientation-button { display: none !important; }
/* La foto de respaldo de la presentación no se muestra: fondo negro con el logo hasta que entra el 360° */
.absolute.inset-0:has(> #barona-pano) > img { opacity: 0 !important; }
#barona-pano { position: absolute !important; inset: 0; width: 100%; height: 100%; background: transparent; overflow: hidden; }

/* ---------- Páginas propias: cotizador, preguntas frecuentes, cómo llegar, reseñas ---------- */
.bc-page { background: hsl(var(--obsidian)); padding: 128px 0 96px; min-height: 70vh; }
.bc-wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.bc-narrow { max-width: 860px; }
.bc-head { text-align: center; margin-bottom: 40px; }
.bc-eyebrow { font: 500 12px/1 var(--font-sans); letter-spacing: .3em; text-transform: uppercase; color: hsl(var(--gold)); margin-bottom: 16px; }
.bc-title { font: 700 clamp(30px, 5vw, 48px)/1.15 var(--font-heading); color: hsl(var(--ivory)); }
.bc-sub { font: 300 16px/1.7 var(--font-sans); color: hsl(var(--ivory) / .72); max-width: 680px; margin: 0 auto; }
.bc-center { text-align: center; }
.bc-card { border: 1px solid hsl(var(--gold) / .2); background: hsl(var(--card)); padding: 24px; }
.bc-step { display: flex; align-items: center; gap: 12px; font: 600 20px/1.3 var(--font-heading); color: hsl(var(--ivory)); margin-bottom: 18px; }
.bc-step span { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: none; border: 1px solid hsl(var(--gold) / .5); color: hsl(var(--gold)); font: 600 13px/1 var(--font-sans); }
.bc-note { font: 300 13px/1.6 var(--font-sans); color: hsl(var(--ivory) / .6); margin-top: 12px; }
.bc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 28px; background: hsl(var(--gold)); color: hsl(var(--obsidian)); font: 600 12px/1.2 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; text-decoration: none; border: 1px solid hsl(var(--gold)); transition: filter .2s; text-align: center; }
.bc-btn:hover { filter: brightness(1.1); }
.bc-btn-line { background: transparent; color: hsl(var(--gold)); }
.bc-btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.bc-btns.bc-center { justify-content: center; align-items: center; }
.bc-link { background: none; border: 0; color: hsl(var(--gold)); font: 500 13px var(--font-sans); text-decoration: underline; cursor: pointer; margin-top: 12px; padding: 0; }

.bc-quote { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.bc-steps { display: grid; gap: 20px; }
.bc-sticky { position: sticky; top: 110px; }
.bc-cabins { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bc-cabin { display: flex; flex-direction: column; text-align: left; border: 1px solid hsl(var(--gold) / .2); background: transparent; cursor: pointer; padding: 0; color: inherit; transition: border-color .2s; }
.bc-cabin img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.bc-cabin span { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; }
.bc-cabin strong { font: 600 17px var(--font-heading); color: hsl(var(--ivory)); }
.bc-cabin small { font: 400 12px var(--font-sans); color: hsl(var(--ivory) / .6); }
.bc-cabin.bc-on { border-color: hsl(var(--gold)); box-shadow: 0 0 0 1px hsl(var(--gold)); }

.bc-cal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.bc-hint { font: 500 14px var(--font-sans); color: hsl(var(--gold)); text-align: center; }
.bc-nav { width: 38px; height: 38px; border: 1px solid hsl(var(--gold) / .35); background: transparent; color: hsl(var(--gold)); font-size: 20px; cursor: pointer; }
.bc-nav:disabled { opacity: .3; cursor: default; }
.bc-cal { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bc-month-name { font: 600 16px var(--font-heading); color: hsl(var(--ivory)); text-align: center; margin-bottom: 10px; }
.bc-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.bc-dow { text-align: center; font: 500 11px var(--font-sans); color: hsl(var(--ivory) / .45); padding-bottom: 4px; }
.bc-day { position: relative; aspect-ratio: 1; border: 1px solid transparent; background: hsl(var(--ivory) / .04); color: hsl(var(--ivory) / .9); font: 500 13px var(--font-sans); cursor: pointer; padding: 0; }
.bc-day:hover:not(:disabled) { border-color: hsl(var(--gold) / .6); }
.bc-day.bc-high { background: hsl(var(--gold) / .14); }
.bc-day.bc-hol { color: hsl(var(--gold)); font-weight: 700; }
.bc-day.bc-range { background: hsl(var(--gold) / .32); }
.bc-day.bc-sel { background: hsl(var(--gold)); color: hsl(var(--obsidian)); }
.bc-day.bc-past { opacity: .25; cursor: default; }
.bc-empty { visibility: hidden; }
.bc-legend { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 14px; font: 400 12px var(--font-sans); color: hsl(var(--ivory) / .65); }
.bc-legend span { display: inline-flex; align-items: center; gap: 8px; }
.bc-dot { display: inline-block; width: 14px; height: 14px; }
.bc-dot.bc-low { background: hsl(var(--ivory) / .08); border: 1px solid hsl(var(--ivory) / .2); }
.bc-dot.bc-high { background: hsl(var(--gold) / .35); }

.bc-counter { display: flex; align-items: center; gap: 16px; font: 500 15px var(--font-sans); color: hsl(var(--ivory)); }
.bc-counter span { flex: 1; }
.bc-counter button { width: 40px; height: 40px; border: 1px solid hsl(var(--gold) / .4); background: transparent; color: hsl(var(--gold)); font-size: 20px; cursor: pointer; }
.bc-counter button:disabled { opacity: .3; cursor: default; }
.bc-counter strong { min-width: 24px; text-align: center; font-size: 20px; }
.bc-extras { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bc-extra { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid hsl(var(--gold) / .2); cursor: pointer; font: 400 14px var(--font-sans); color: hsl(var(--ivory) / .9); }
.bc-extra input { accent-color: hsl(var(--gold)); width: 16px; height: 16px; flex: none; }
.bc-extra span { flex: 1; }
.bc-extra small { color: hsl(var(--gold)); font-size: 12px; white-space: nowrap; }
.bc-extra.bc-on { border-color: hsl(var(--gold)); }

.bc-sum-title { font: 600 22px var(--font-heading); color: hsl(var(--ivory)); margin-bottom: 14px; }
.bc-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid hsl(var(--gold) / .1); font: 400 13px/1.4 var(--font-sans); color: hsl(var(--ivory) / .7); }
.bc-row strong { color: hsl(var(--ivory)); font-weight: 500; text-align: right; }
.bc-total { display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0 4px; font: 500 14px var(--font-sans); color: hsl(var(--ivory)); }
.bc-total strong { font: 700 26px var(--font-heading); color: hsl(var(--gold)); }
.bc-summary .bc-btn { width: 100%; margin-top: 18px; }

.bc-faq { display: grid; gap: 12px; margin-bottom: 48px; }
.bc-q { border: 1px solid hsl(var(--gold) / .2); background: hsl(var(--card)); }
.bc-q summary { cursor: pointer; list-style: none; padding: 18px 22px; font: 600 17px/1.4 var(--font-heading); color: hsl(var(--ivory)); display: flex; justify-content: space-between; gap: 16px; }
.bc-q summary::-webkit-details-marker { display: none; }
.bc-q summary::after { content: '+'; color: hsl(var(--gold)); font: 400 22px/1 var(--font-sans); }
.bc-q[open] summary::after { content: '−'; }
.bc-q p { padding: 0 22px 20px; font: 300 15px/1.75 var(--font-sans); color: hsl(var(--ivory) / .75); }
.bc-q a { color: hsl(var(--gold)); font-weight: 600; text-decoration: none; }

.bc-dir { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.bc-dir-steps { display: grid; gap: 16px; }
.bc-dir p { font: 300 15px/1.75 var(--font-sans); color: hsl(var(--ivory) / .75); }
.bc-map { position: relative; height: 420px; border: 1px solid hsl(var(--gold) / .2); overflow: hidden; background: #0d0d0d; }
.bc-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.bc-reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.bc-review { display: flex; flex-direction: column; gap: 14px; }
.bc-stars { color: hsl(var(--gold)); letter-spacing: 3px; }
.bc-review-text { flex: 1; font: italic 300 14px/1.7 var(--font-sans); color: hsl(var(--ivory) / .78); }
.bc-review footer { display: flex; flex-direction: column; gap: 2px; padding-top: 12px; border-top: 1px solid hsl(var(--gold) / .1); }
.bc-review strong { color: hsl(var(--ivory)); font: 600 14px var(--font-sans); }
.bc-review small { color: hsl(var(--gold)); font: 400 12px var(--font-sans); }
.bc-rating { width: 100%; font: 400 15px var(--font-sans); color: hsl(var(--ivory) / .8); }
.bc-rating strong { font: 700 28px var(--font-heading); color: hsl(var(--gold)); }

@media (max-width: 960px) {
  .bc-quote, .bc-dir { grid-template-columns: 1fr; }
  .bc-sticky { position: static; }
  .bc-reviews { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .bc-cal { grid-template-columns: 1fr; }
  .bc-cal .bc-month + .bc-month { display: none; }
  .bc-cabins, .bc-extras { grid-template-columns: 1fr; }
  .bc-card { padding: 18px; }
  .bc-page { padding-top: 110px; }
}

/* Mapa: colores normales de Google (el filtro oscuro de la app lo dejaba con tonos raros) */
.map-grayscale { filter: none; }