/* Mensaje al Cielo — anchos de página (cargar DESPUÉS de estilos.css)
   Registro / ingreso / pagos: 70vw · Perfil / inicio: 90vw
   Versión: 20250921d — busca este texto en Hostinger para confirmar la subida */

:root {
  --ancho-pagina: 90vw;
  --ancho-pagina-perfil: 90vw;
  --ancho-pagina-registro: 70vw;
  --margen-lateral: max(0.5rem, calc((100vw - var(--ancho-pagina)) / 2));
}

.principal {
  width: 100%;
  max-width: var(--ancho-pagina);
}

.principal--registro {
  max-width: var(--ancho-pagina-registro);
}

.principal--perfil {
  max-width: var(--ancho-pagina-perfil);
}

.bloque-registro,
.bloque-registro--proveedor {
  width: 100%;
  max-width: 100%;
}

.bloque-registro .bloque-intro {
  max-width: none;
}

.pie-contenido {
  width: 100%;
  max-width: var(--ancho-pagina);
}

/* Tipografia sitio (index, ingreso, registro, perfil…). No aplica a santuario-*.html */
.sitio {
  --mac-texto-oro: 15pt;
  --mac-texto-blanco: 15pt;
  --mac-script-oro: 58px;
  --mac-script-oro-movil: 44px;
  --mac-script-oro-plan: 48px;
  --mac-script-oro-plan-movil: 38px;
}

.sitio .minisesion-titulo,
.sitio .plan-precio,
.sitio .plan-santuario-enlace,
.sitio .modal-cuenta h2,
.sitio .bloque-registro h1,
.sitio .bloque-registro h2 {
  font-size: var(--mac-texto-oro) !important;
  line-height: 1.3 !important;
}

.sitio .bloque-intro,
.sitio .bloque-texto p,
.sitio .minisesion-texto,
.sitio .plan-nota,
.sitio .plan-beneficios li,
.sitio .plan-eslogan-plan,
.sitio .plan-aviso,
.sitio .perfil-plan,
.sitio .perfil-contador,
.sitio .formulario label,
.sitio .formulario p,
.sitio .formulario input,
.sitio .formulario select,
.sitio .formulario textarea,
.sitio .boton {
  font-size: var(--mac-texto-blanco) !important;
  line-height: 1.65 !important;
}

/* Logo encabezado — VERSION-MARCA-20260323a (px fijos; no usar regla 15pt del sitio) */
.sitio .encabezado .marca-logo {
  width: 128px !important;
  height: 128px !important;
}

/* Título script dorado: logo + títulos de recuadros (.bloque h1/h2) */
.sitio .encabezado .marca-nombre,
.sitio .bloque > h1,
.sitio .bloque > h2:not(.plan-nombre) {
  font-family: "Alex Brush", cursive !important;
  font-weight: 400 !important;
  font-size: var(--mac-script-oro) !important;
  line-height: 1.05 !important;
  color: var(--oro-claro, #e8c96a) !important;
}

.sitio .plan-nombre {
  font-family: "Alex Brush", cursive !important;
  font-weight: 400 !important;
  font-size: var(--mac-script-oro-plan) !important;
  line-height: 1.08 !important;
  color: var(--oro-claro, #e8c96a) !important;
}

.sitio .encabezado .marca-nombre {
  line-height: 1 !important;
  text-shadow:
    0 0 20px rgba(232, 201, 106, 0.5),
    0 0 8px rgba(212, 175, 55, 0.4);
}

.sitio .encabezado .marca-eslogan {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  color: var(--blanco) !important;
  max-width: 22rem;
  opacity: 0.95;
}

@media (max-width: 860px) {
  .sitio .encabezado .marca-logo {
    width: 104px !important;
    height: 104px !important;
  }

  .sitio .encabezado .marca-nombre,
  .sitio .bloque > h1,
  .sitio .bloque > h2:not(.plan-nombre) {
    font-size: var(--mac-script-oro-movil) !important;
  }

  .sitio .plan-nombre {
    font-size: var(--mac-script-oro-plan-movil) !important;
  }

  .sitio .encabezado .marca-eslogan {
    font-size: 14px !important;
  }
}

@media (max-width: 480px) {
  .sitio .encabezado .marca-logo {
    width: 92px !important;
    height: 92px !important;
  }
}

/* Pie de página — logo y título como encabezado; textos más legibles */
.sitio .pie .pie-logo {
  width: 128px !important;
  height: 128px !important;
}

.sitio .pie .pie-nombre {
  font-family: "Alex Brush", cursive !important;
  font-size: var(--mac-script-oro) !important;
  line-height: 1 !important;
  color: var(--oro-claro, #e8c96a) !important;
  text-shadow:
    0 0 20px rgba(232, 201, 106, 0.5),
    0 0 8px rgba(212, 175, 55, 0.4);
}

.sitio .pie .pie-seccion h2 {
  font-family: "Alex Brush", cursive !important;
  font-size: 44px !important;
  line-height: 1.08 !important;
  color: var(--oro-claro, #e8c96a) !important;
}

.sitio .pie .pie-eslogan,
.sitio .pie .pie-enlace,
.sitio .pie .pie-contacto-item,
.sitio .pie .pie-red {
  font-size: 17px !important;
  line-height: 1.55 !important;
}

@media (max-width: 860px) {
  .sitio .pie .pie-logo {
    width: 104px !important;
    height: 104px !important;
  }

  .sitio .pie .pie-nombre {
    font-size: var(--mac-script-oro-movil) !important;
  }

  .sitio .pie .pie-seccion h2 {
    font-size: 36px !important;
  }

  .sitio .pie .pie-eslogan,
  .sitio .pie .pie-enlace,
  .sitio .pie .pie-contacto-item,
  .sitio .pie .pie-red {
    font-size: 16px !important;
  }
}

@media (max-width: 480px) {
  .sitio .pie .pie-logo {
    width: 92px !important;
    height: 92px !important;
  }
}

/* Tarjetas de santuario en perfil / vitrina: conservan estilos.css + santuario-*.css */
.sitio .santuarios-grid,
.sitio .santuarios-grid *,
.sitio .lista-recuperacion-santuarios,
.sitio .lista-recuperacion-santuarios * {
  font-size: revert !important;
  line-height: revert !important;
}

/* Menú superior: celdas iguales, alineado (escritorio) */
@media (min-width: 861px) {
  .sitio .encabezado .navegacion {
    align-items: stretch;
    gap: 0.5rem;
  }

  .sitio .encabezado .idioma {
    display: flex;
    align-items: stretch;
  }

  .sitio .encabezado .nav-enlace,
  .sitio .encabezado .idioma-boton {
    box-sizing: border-box;
    width: 7.35rem !important;
    min-width: 7.35rem !important;
    max-width: 7.35rem !important;
    min-height: 5.1rem;
    padding: 0.45rem 0.3rem 0.38rem !important;
    margin: 0;
    display: grid !important;
    flex-direction: column !important;
    grid-template-rows: 1fr auto;
    align-items: center;
    justify-items: center;
    justify-content: center !important;
    gap: 0.28rem;
    border: 1px solid rgba(212, 175, 55, 0.38);
    border-radius: 10px;
    background: rgba(4, 8, 18, 0.35);
  }

  .sitio .encabezado .nav-enlace.activo,
  .sitio .encabezado .nav-enlace:hover,
  .sitio .encabezado .idioma-boton:hover,
  .sitio .encabezado .idioma-boton[aria-expanded="true"] {
    border-color: var(--oro);
    background: rgba(212, 175, 55, 0.1);
    color: var(--oro-claro);
  }

  .sitio .encabezado .nav-enlace span,
  .sitio .encabezado .idioma-boton span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.65rem;
    max-width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 1.2 !important;
    font-size: 12pt !important;
    letter-spacing: 0.01em;
    hyphens: manual;
  }

  .sitio .encabezado .nav-enlace.activo span,
  .sitio .encabezado .nav-enlace:hover span,
  .sitio .encabezado .idioma-boton:hover span,
  .sitio .encabezado .idioma-boton[aria-expanded="true"] span {
    font-size: 12pt !important;
    color: var(--oro-claro);
  }

  .sitio .encabezado .nav-enlace svg,
  .sitio .encabezado .idioma-boton svg {
    width: 24px !important;
    height: 24px !important;
    flex-shrink: 0;
    stroke: var(--oro);
    fill: none;
    stroke-width: 1.7;
  }
}

/* Refuerzo final (gana sobre MAC-TIPO 15pt si estilos.css está desactualizado) */
html body .sitio header.encabezado a.marca span.marca-nombre,
html body .sitio .bloque > h1,
html body .sitio .bloque > h2:not(.plan-nombre) {
  font-size: var(--mac-script-oro) !important;
}

html body .sitio .plan-nombre {
  font-size: var(--mac-script-oro-plan) !important;
}

html body .sitio header.encabezado a.marca span.marca-nombre {
  line-height: 1 !important;
}

html body .sitio header.encabezado a.marca span.marca-eslogan {
  font-size: 16px !important;
  line-height: 1.4 !important;
}

@media (max-width: 860px) {
  html body .sitio header.encabezado a.marca span.marca-nombre,
  html body .sitio .bloque > h1,
  html body .sitio .bloque > h2:not(.plan-nombre) {
    font-size: var(--mac-script-oro-movil) !important;
  }

  html body .sitio .plan-nombre {
    font-size: var(--mac-script-oro-plan-movil) !important;
  }

  html body .sitio header.encabezado a.marca span.marca-eslogan {
    font-size: 14px !important;
  }
}