/* Fluid Typography & Image Scaling */
.fluid-hero-title {
  font-size: clamp(2.25rem, 7vw, 3rem);
  line-height: clamp(1.1, 5vw, 1.2);
}

.fluid-hero-subtitle {
  font-size: clamp(1.125rem, 2.8vw, 1.25rem);
}

.fluid-section-title {
  font-size: clamp(1.875rem, 5vw, 3rem);
}

.fluid-section-subtitle {
  font-size: clamp(1rem, 2.5vw, 1.25rem);
}

.fluid-hero-image {
  width: clamp(12rem, 28vw, 32rem);
  height: auto;
}

.fluid-card-title {
  font-size: clamp(1.125rem, 3vw, 1.25rem);
}

/* Responsive overrides for very small screens */
@media (max-width: 480px) {
  .fluid-hero-title {
    font-size: clamp(2rem, 8vw, 2.5rem);
  }
}

/* Responsive overrides for medium screens */
@media (min-width: 768px) {
  .fluid-section-title {
    font-size: clamp(2.5rem, 4vw, 3rem);
  }
}

/* Responsive overrides for large screens */
@media (min-width: 1024px) {
  .fluid-hero-subtitle {
    font-size: clamp(1.2rem, 2vw, 1.3rem);
  }
}

/* Logo Styles */

/* CSS Variables for logo colors - Fixed colors as specified */
:root {
  --logo-text: #1F2023; /* Gris carbón muy oscuro */
  --logo-dot: #2F80ED;  /* Azul vibrante, estilo Royal Blue */
}

/* Logo container and alignment */
.holo-logo {
  display: flex;
  align-items: baseline; /* Alineación precisa en línea base para el punto */
  font-family: 'Poppins', sans-serif;
  font-weight: 600; /* SemiBold */
  font-size: 2rem; /* Tamaño original del header */
  letter-spacing: -0.025em; /* Kerning ajustado entre -0.02em y -0.03em */
  color: var(--logo-text);
  transition: color 0.3s ease;
}

/* Logo text span */
.holo-text {
  color: var(--logo-text);
  transition: color 0.3s ease;
}

/* Logo dot span */
.holo-dot {
  color: var(--logo-dot);
  transition: color 0.3s ease;
  margin-left: 0.05em; /* Espaciado mínimo entre texto y punto */
}

/* Footer Logo Styles - Colors for footer specifically */

.holo-logo-footer {
  display: flex;
  align-items: baseline; /* Alineación precisa en línea base para el punto */
  font-family: 'Poppins', sans-serif;
  font-weight: 600; /* SemiBold */
  font-size: 2.25rem; /* Tamaño aumentado 50%: 1.5rem x 1.5 = 2.25rem */
  letter-spacing: -0.025em; /* Kerning ajustado entre -0.02em y -0.03em */
  color: #F3F4F6 !important; /* Blanco hueso para el texto del footer */
}

/* Footer logo text span */
.holo-text-footer {
  color: #F3F4F6 !important; /* Blanco hueso */
}

/* Footer logo dot span */
.holo-dot-footer {
  color: #3B82F6 !important; /* Azul ligeramente más claro */
  margin-left: 0.05em; /* Espaciado mínimo entre texto y punto */
}