/* ==========================================================
   VISITANOS — Stylesheet
   Prefijo: vis-
   Scope:   .vis-page
   Estilos compartidos (inner, section, hero, eyebrow, fade-up,
   buttons, card-icon) → ibg-base.css
   ========================================================== */


/* ----------------------------------------------------------
   Tipografía — override con alta especificidad contra Elementor
   Las clases ibg- en base ya definen los valores; acá solo
   sobreescribimos los tamaños específicos de esta página y
   blindamos contra el kit global del tema.
---------------------------------------------------------- */
.page-template-page-visitanos .vis-page h1.ibg-hero-title {
  font-size: 46px;         /* base: 44px — display grande, tendencia 2026 */
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.06;
  color: #fff;
  margin: 0 0 0.85rem;
  text-transform: none !important;
}

.page-template-page-visitanos .vis-page h2.ibg-section-title {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #3E3838;
  margin: 0 0 0.5rem;
  text-transform: none !important;
}

.page-template-page-visitanos .vis-page h2.vis-cta-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #3E3838;
  margin: 0 0 0.5rem;
  text-transform: none !important;
}

.page-template-page-visitanos .vis-page h3.vis-expect-title {
  font-size: 17px;         /* era 15px — cards más legibles */
  font-weight: 700;
  line-height: 1.3;
  color: #3E3838;
  margin: 0 0 0.5rem;
  text-transform: none !important;
}


/* ----------------------------------------------------------
   Hero — variantes específicas de visitanos
   La estructura base (.ibg-hero, .ibg-hero-overlay, etc.)
   vive en ibg-base.css.
---------------------------------------------------------- */

/* El eyebrow del hero es blanco en visitanos (vs naranja en home) */
.vis-page .ibg-hero-eyebrow {
  color: rgba(255,255,255,0.75);
  margin-bottom: 0.75rem;
}

.vis-page .ibg-hero-eyebrow-line {
  background: rgba(255,255,255,0.5);
}

/* Sub: visitanos usa 17px y distinto color/margen */
.vis-page .ibg-hero-sub {
  font-size: 17px;         /* base: 16px */
  color: rgba(255,255,255,0.8);
  margin: 0 0 1.6rem;
}


/* ----------------------------------------------------------
   QUÉ ESPERAR — grid 3 columnas
---------------------------------------------------------- */
.vis-expect-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.vis-expect-card {
  border: 0.5px solid #e8e8e8;
  border-radius: 14px;
  padding: 1.4rem;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
}

.vis-expect-card:hover {
  border-color: #FFCDB8;
  box-shadow: 0 4px 24px rgba(255,92,27,0.08);
}

.vis-expect-card .ibg-card-icon {
  margin-bottom: 0.8rem;
}

.vis-expect-desc {
  font-size: 15px;
  color: #555;
  line-height: 1.7;
  margin: 0;
}


/* ----------------------------------------------------------
   Horarios y ubicación → estilos en ibg-base.css
   (ibg-location-*, ibg-schedule-*, ibg-map-*, ibg-link)
---------------------------------------------------------- */


/* ----------------------------------------------------------
   FAQ — accordion
   Todo el bloque scopeado a .page-template-page-visitanos .vis-page
   para ganar specificity contra Kava / Elementor Kit
---------------------------------------------------------- */
.page-template-page-visitanos .vis-page .vis-faq-grid {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.page-template-page-visitanos .vis-page .vis-faq-item {
  background: #fff;
  border: 0.5px solid #e8e8e8;
  border-radius: 14px;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.page-template-page-visitanos .vis-page .vis-faq-item--open {
  border-color: #FFCDB8;
  box-shadow: 0 4px 24px rgba(255,92,27,0.07);
}

/* — Trigger (button) — reset completo contra el tema — */
.page-template-page-visitanos .vis-page .vis-faq-trigger {
  /* reset de browser y tema */
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  margin: 0 !important;
  /* layout */
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.4rem !important;
  cursor: pointer;
  text-align: left;
  /* tipografía — hereda del page, no del tema */
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  /* transición suave del fondo en hover */
  transition: background-color 0.15s;
}

/* Hover: fondo muy sutil + pregunta naranja */
.page-template-page-visitanos .vis-page .vis-faq-trigger:hover {
  background-color: #fdfaf8 !important;
}

.page-template-page-visitanos .vis-page .vis-faq-trigger:hover .vis-faq-q {
  color: #FF5C1B !important;
}

/* Focus visible — accesible, no molesta al mouse */
.page-template-page-visitanos .vis-page .vis-faq-trigger:focus-visible {
  outline: 2px solid #FF5C1B !important;
  outline-offset: -2px !important;
  border-radius: 14px !important;
}

/* — Texto de la pregunta — */
.page-template-page-visitanos .vis-page .vis-faq-q {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #3E3838 !important;
  line-height: 1.4 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  transition: color 0.15s;
  background: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* — Chevron — */
.page-template-page-visitanos .vis-page .vis-faq-chevron {
  flex-shrink: 0;
  color: #bbb;
  transition: transform 0.3s ease, color 0.2s;
  display: flex;
  align-items: center;
  pointer-events: none;
  line-height: 0;
}

.page-template-page-visitanos .vis-page .vis-faq-item--open .vis-faq-chevron {
  transform: rotate(180deg);
  color: #FF5C1B;
}

/* — Cuerpo — animación con CSS grid trick — */
.page-template-page-visitanos .vis-page .vis-faq-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.32s ease;
}

.page-template-page-visitanos .vis-page .vis-faq-item--open .vis-faq-body {
  grid-template-rows: 1fr;
}

.page-template-page-visitanos .vis-page .vis-faq-body-inner {
  overflow: hidden;
}

.page-template-page-visitanos .vis-page .vis-faq-a {
  padding: 0.85rem 1.4rem 1.3rem;
  font-size: 16px;
  color: #555;
  line-height: 1.75;
  margin: 0;
  border-top: 0.5px solid #f0ede8;
}

.page-template-page-visitanos .vis-page .vis-faq-a em {
  font-style: normal;
  font-weight: 600;
  color: #3E3838;
}


/* ----------------------------------------------------------
   CTA FINAL
---------------------------------------------------------- */
.vis-section--cta {
  text-align: center;
}

.vis-cta-block {
  max-width: 480px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.vis-cta-icon-wrap {
  width: 52px;
  height: 52px;
  background: #FFF0EB;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.vis-cta-desc {
  font-size: 16px;
  color: #555;
  line-height: 1.7;
  margin: 0 0 1rem;
}

.vis-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #FF5C1B;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  padding: 14px 28px;
  border-radius: 8px;
  text-decoration: none;
  transition: opacity 0.15s, transform 0.1s;
  min-height: 44px;
}

.vis-cta-btn:hover { opacity: 0.9; transform: translateY(-1px); }


/* ----------------------------------------------------------
   RESPONSIVE — mobile ≤ 640px
   Los estilos compartidos (hero, sections, inner) → ibg-base.css
---------------------------------------------------------- */
@media (max-width: 640px) {

  /* Hero — overrides específicos de visitanos */
  .page-template-page-visitanos .vis-page h1.ibg-hero-title {
    font-size: 34px;       /* base mobile: 30px — más presencia en visitanos */
    line-height: 1.1;
  }

  .page-template-page-visitanos .vis-page h2.ibg-section-title {
    font-size: 24px;
  }

  .page-template-page-visitanos .vis-page h2.vis-cta-title {
    font-size: 22px;
  }

  .page-template-page-visitanos .vis-page h3.vis-expect-title {
    font-size: 16px;
  }

  .vis-page .ibg-hero-sub {
    font-size: 16px;
  }

  /* ¿Qué esperar? pasa a 1 col */
  .vis-expect-grid {
    grid-template-columns: 1fr;
  }

  /* Location → responsive en ibg-base.css */

  /* FAQ — accordion */
  .page-template-page-visitanos .vis-page .vis-faq-trigger {
    padding: 1rem 1.25rem !important;
  }

  .page-template-page-visitanos .vis-page .vis-faq-q {
    font-size: 15px !important;
  }

  .page-template-page-visitanos .vis-page .vis-faq-a {
    padding: 0.75rem 1.25rem 1.1rem;
    font-size: 15px;
  }

}