@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');

/* === CORRECCIÓN LÍNEA BLANCA Y ESCALADO MACOS / MÓVIL === */
* {
  box-sizing: border-box;
}
html, body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Wrapper: 100% para evitar overflow en móvil (100vw puede dar barra horizontal) */
.carrd-wrapper {
  font-family: 'Quicksand', sans-serif;
  background-color: #ffffff;
  width: 100%;
  max-width: 100%;
  position: relative;
  overflow-x: hidden;
}


:root {
  --color-yellow: #f6de5b;
  --color-orange-light: #f1b13e;
  --color-orange-dark: #de7d34;
  --color-warm-accent-new: #F46B1F;
  --color-teal-mid: #59a5a3;
  --color-primary-dark: #334155;
  --color-cool-accent-light-green: #d0e6e4;
  --color-image-bg: #ffdbc6;
  --gradient-main: linear-gradient(90deg, #16a3a3 0%, #108080 50%, #0c6a6a 100%);
}

/* === AJUSTE MASIVO DE FUENTES Y LAYOUT MÓVILES === */
@media (max-width: 768px) {
  html, body, .carrd-wrapper { overflow-x: hidden !important; }
  .carrd-wrapper { font-size: 18px !important; }
  .carrd-wrapper * { max-width: 100%; }
  img { max-width: 100% !important; height: auto !important; }
  nav img { height: 55px !important; width: auto !important; }
  .text-sm { font-size: 16px !important; line-height: 1.6 !important; }
  .text-base { font-size: 19px !important; line-height: 1.6 !important; }
  .text-lg { font-size: 21px !important; line-height: 1.5 !important; }
  .text-xl { font-size: 24px !important; line-height: 1.4 !important; }
  p, li, a, span, div.text-gray-600, div.text-gray-700 { font-size: 19px !important; line-height: 1.6 !important; }
  h2, .text-4xl, .text-5xl { font-size: 34px !important; line-height: 1.1 !important; }
  h3, .text-3xl { font-size: 28px !important; margin-bottom: 1.5rem !important; }
  h4, .text-2xl { font-size: 24px !important; }
  .cta-button { font-size: 20px !important; padding: 16px 32px !important; width: 100% !important; display: flex !important; justify-content: center !important; }
  .p-4, .p-6, .p-8, .p-10 { padding: 30px 20px !important; }
}

/* ESTILOS GENERALES (ESCRITORIO) */
strong { font-size: 1.15em; }
.font-heading { font-family: 'Quicksand', sans-serif; }
.font-cursive { font-family: 'Quicksand', sans-serif; font-weight: 400; font-style: italic; }
.text-gradient { background: var(--gradient-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; }
.text-primary-dark { color: var(--color-primary-dark); }
.color-warm-accent { color: var(--color-orange-dark); }
.color-warm-accent-new { color: var(--color-warm-accent-new); }
.bg-warm-accent-light { background-color: var(--color-orange-light); }
.color-cool-accent { color: var(--color-teal-mid); }
.color-teal-mid { color: var(--color-teal-mid); }
.bg-cool-accent-light-green { background-color: var(--color-cool-accent-light-green); }

/* BOTONES */
.cta-button {
  transition: all 0.5s ease;
  box-shadow: 0 15px 30px -8px rgba(22, 163, 163, 0.6), 0 0 20px rgba(12, 106, 106, 0.4);
  background-image: var(--gradient-main); background-size: 200% auto;
  color: white; font-weight: bold; border: 0; border-radius: 9999px; padding-left: 2rem; padding-right: 2rem;
}
.cta-button:hover { background-position: right center; transform: translateY(-5px); }

/* UTILIDADES VISUALES */
.hero-text-shadow { text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); }
.text-shadow-md { text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.15); }
.feature-icon-wrapper { width: 80px; height: 80px; display: inline-flex; align-items: center; justify-content: center; margin: 0 auto 20px auto; background-color: transparent; transition: all 0.3s ease-in-out; }
.feature-block:hover .feature-icon-wrapper { transform: scale(1.1); filter: drop-shadow(0 0 5px rgba(89, 165, 163, 0.5)); }
.feature-block:hover .feature-icon { color: var(--color-orange-dark); }
.fa-icon-size { font-size: 2.5rem; }
.fa-icon-color { color: var(--color-teal-mid); }
.fa-icon-orange-accent { color: var(--color-warm-accent-new); }

/* === CORRECCIÓN DEL MENÚ === */
.nav-link {
  padding: 0.5rem 1rem;
  color: var(--color-primary-dark);
  font-weight: 700;
  font-size: 1.1rem;
  transition: color 0.2s;
}
.nav-link:hover {
  color: var(--color-warm-accent-new);
}

@keyframes glow-expand { 0%, 100% { opacity: 0.75; transform: scale(1); filter: none; } 15% { opacity: 1; filter: drop-shadow(0 0 5px var(--color-yellow)); transform: scale(1.1); } 30% { opacity: 0.75; transform: scale(1); filter: none; } }
#twinkling-star { fill: var(--color-yellow); animation: glow-expand 5s infinite ease-in-out; }
.prof-image-container { padding: 0; background-color: transparent; border-radius: 0; box-shadow: none; max-width: 300px; margin: 0 auto; }
.clearfix::after { content: ""; display: table; clear: both; }
.grid-equal-height-lg { display: grid; grid-template-columns: 1fr; }
@media (min-width: 1024px) { .grid-equal-height-lg { grid-template-columns: 1fr 1fr; } .prof-image-col { display: flex; justify-content: center; } }

/* FAQ Sin bordes */
.faq-item { user-select: none; margin-bottom: 2rem; padding: 0; transition: none; }
.faq-header { padding: 0.5rem 0; padding-left: 1rem; padding-right: 1rem; cursor: pointer; border-bottom: 0; }
.faq-content { padding-top: 0; padding-left: 1rem; padding-right: 1rem; }
.faq-item.active .faq-content { padding-top: 1rem; }

.text-strong { font-weight: 700; }
.section-card { background-color: var(--color-cool-accent-light-green); border-radius: 0.75rem; padding: 2rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); }

/* === WHATSAPP FLOTANTE === */
.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 25px;
  right: 25px;
  background-image: var(--gradient-main);
  background-size: 200% auto;
  color: white;
  border-radius: 50%;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 9999;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  text-decoration: none !important;
}
.whatsapp-float:hover { background-position: right center; transform: scale(1.1); }
.whatsapp-float i { font-size: 34px !important; line-height: 1 !important; display: block !important; margin: 0 !important; }

/* === ESTILOS PARA BOTÓN DE AUDIO === */
#audio-toggle {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
#audio-toggle:hover {
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* === SELECTOR DE IDIOMA (desplegable a la derecha del CTA) === */
#lang-switcher,
#lang-switcher-mobile {
  position: relative;
  margin-left: 12px;
}
.lang-dropdown {
  position: relative;
}
.lang-dropdown-btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border: 1px solid var(--color-primary-dark);
  border-radius: 8px;
  background: white;
  color: var(--color-primary-dark);
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.lang-dropdown-btn:hover {
  background: rgba(22, 163, 163, 0.08);
  border-color: var(--color-teal-mid);
  color: var(--color-teal-mid);
}
.lang-dropdown-panel {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  min-width: 160px;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 1000;
  overflow: hidden;
}
.lang-dropdown-panel.lang-dropdown-open {
  display: block;
}
.lang-dropdown-item {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border: none;
  background: none;
  color: var(--color-primary-dark);
  font-size: 0.95rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s;
}
.lang-dropdown-item:hover {
  background: rgba(22, 163, 163, 0.1);
}
@media (max-width: 767px) {
  #lang-switcher-mobile { margin-left: 0; margin-bottom: 8px; }
  .lang-dropdown-panel { right: auto; left: 0; }
}