/*
Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Template: generatepress
Author: Tom Usborne
Author URI: https://generatepress.com/about
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.6.1.1771945056
Updated: 2026-02-24 14:57:36

*/



h2{
	font-family: "Helvetica", Arial, "sans-serif";
	 text-transform: uppercase;
	font-style: italic;   
	font-weight: bold;  
	font-size: 20px; /* Tamaño más pequeño en PC */
}

@media only screen and (max-width: 768px) {
    h2 {
        font-size: 43px !important; /* Tamaño más grande en móvil */
        line-height: 1.2; /* Ajuste opcional para mejor legibilidad */
    }
}




/* CSS FONDOS DE TODOS*/
.hero {
background-image: url('https://ainvitaciones.com/wp-content/uploads/2026/03/LichitaHero001-scaled.png');
}


.horarios-titulo{
	color:#016685;
}
.horarios-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#c3d9ff+0,b1c8ef+41,98b0d9+100;Lavender+3D */
background: linear-gradient(to bottom,  #c3d9ff 0%,#b1c8ef 41%,#98b0d9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}



.contador-titulo{
	color:#00B4CC;
}
.contador-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a9e4f7+0,0fb4e7+100;Ble+3D+%235 */
background: linear-gradient(to bottom,  #a9e4f7 0%,#0fb4e7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}




.menciones-titulo{
	color:#CC9900;
}
.menciones-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffd65e+28,febf04+100 */
background: linear-gradient(to bottom,  #ffd65e 28%,#febf04 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}


.mencion-texto span {
	 text-transform: uppercase;
	font-style: italic;   
	color:#CC9900;	
}


.vestimenta-titulo{
	color:#00B4CC;
}
.vestimenta-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a9e4f7+0,0fb4e7+100;Ble+3D+%235 */
background: linear-gradient(to bottom,  #a9e4f7 0%,#0fb4e7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.iglesia-titulo{
	color:#016685;
}
.iglesia-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#c3d9ff+0,b1c8ef+41,98b0d9+100;Lavender+3D */
background: linear-gradient(to bottom,  #c3d9ff 0%,#b1c8ef 41%,#98b0d9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}


.salon-titulo{
	color:#CC9900;
}
.salon-section{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffd65e+28,febf04+100 */
background: linear-gradient(to bottom,  #ffd65e 28%,#febf04 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}


.calendario-titulo{
	color:#00B4CC;
;
}
.calendario-section {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a9e4f7+0,0fb4e7+100;Ble+3D+%235 */
background: linear-gradient(to bottom,  #a9e4f7 0%,#0fb4e7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}


.scriptlesssocialsharing{
background-color:#96DCF8;
}

.scriptlesssocialsharing h3{
	color:#16A1DB;	
}




/* Contenedor HERO*/

.hero {
  width: 100%;
  min-height: 100vh;               /* ocupa toda la pantalla */
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 24px;

  /* Imagen de fondo responsive */
 background-image: url('https://ainvitaciones.com/wp-content/uploads/2026/03/LichitaHero001-scaled.png');

  background-size: cover;          /* ajusta para cubrir */
  background-position: center;     /* centra la imagen */
  background-repeat: no-repeat;
}

/* Capa oscura para legibilidad del texto */
.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

/* Contenido encima del overlay */
.hero-content {
  position: relative;
  width: min(90%, 900px);          /* 90% en móvil, limita en desktop */
  text-align: center;
  color: #fff;
  padding: 28px 20px;
  border-radius: 16px;
  backdrop-filter: blur(4px);       /* si el navegador lo soporta */
}

/* Tipografía */
.hero-title {
  margin: 0 0 10px;
  font-size: clamp(4rem, 5vw, 3.2rem);
  line-height: 1.1;
}

.hero-subtitle {
  margin: 0 0 18px;
  font-size: clamp(2.2rem, 3.2vw, 2rem);
  font-weight: 600;
}

.hero-text {
  margin: 6px 0;
  font-size: clamp(2rem, 2.2vw, 1.25rem);
}

/* Ajustes extra para pantallas muy pequeñas */
@media (max-width: 480px) {
  .hero {
    padding: 18px;
  }
  .hero-content {
    padding: 22px 16px;
  }
}

/* Contenedor HERO responsive*/




/* Contenedor ITINERARIO*/


/* SECTION */
.horarios-section {
  width: 100%;
  padding: 60px 0;
}

.horarios-titulo {
  text-align: center;
  margin: 0 0 35px;
  font-size: 2rem;
}

/* GRID 2 columnas 50/50 | contenedor 90% */
.horarios-grid {
  width: 90%;
  margin: 0 auto;

  display: grid;
  grid-template-columns: 50% 50%;
  align-items: start;
  gap: 28px;
}

/* Columna (para centrar contenido al 90% de la columna) */
.horarios-col {
  display: flex;
  justify-content: center;
}

/* Tarjeta: 90% de la columna */
.horarios-card {
  width: 90%;
  background: #fff;
  border-radius: 14px;
  padding: 22px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.horarios-subtitulo {
  margin: 0 0 14px;
  font-size: 1.25rem;
}

/* Lista estilo itinerario */
.itinerario-lista {
  list-style: none;
  padding: 0;
  margin: 0;
}

.itinerario-item {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.itinerario-item:last-child {
  border-bottom: 0;
}

.itinerario-hora {
  font-weight: 700;
}

.itinerario-evento {
  opacity: 0.9;
}

/* Imagen: 90% de la columna */
.horarios-imgwrap {
  width: 90%;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.horarios-img {
  width: 100%;
  height: 100%;
  max-height: 420px;
  object-fit: cover; /* ajustable sin deformar */
  display: block;
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .horarios-grid {
    grid-template-columns: 1fr;
  }

  .horarios-card,
  .horarios-imgwrap {
    width: 100%;
  }

  .itinerario-item {
    grid-template-columns: 80px 1fr;
  }
}




.contador-section {
  width: 100%;
  padding: 40px 0;
  box-sizing: border-box;
  text-align: center;
}

.contador-titulo {
  margin: 0 0 25px 0;
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.2;
}

.contador-contenedor {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}

.contador-box {
  width: 90%;
  max-width: 1200px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  box-sizing: border-box;
}

.contador-item {
  background: #ffffff;
  border-radius: 18px;
  padding: 25px 15px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
}

.contador-item span {
  display: block;
  font-size: clamp(32px, 6vw, 72px);
  font-weight: 700;
  line-height: 1;
}

.contador-item p {
  margin: 12px 0 0;
  font-size: clamp(14px, 2vw, 20px);
  font-weight: 500;
}

.contador-mensaje {
  width: 90%;
  max-width: 900px;
  padding: 30px 20px;
  border-radius: 20px;
  font-size: clamp(24px, 4vw, 52px);
  font-weight: 700;
  text-align: center;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
  background: #ffffff;
}

/* Tablet */
@media (max-width: 992px) {
  .contador-box {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Celular */
@media (max-width: 576px) {
  .contador-section {
    padding: 30px 0;
  }

  .contador-box {
    width: 90%;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .contador-item {
    padding: 18px 10px;
  }

  .contador-mensaje {
    width: 90%;
    padding: 22px 14px;
  }
}









/* SECTION */
.vestimenta-section {
  width: 100%;
  padding: 60px 0;
}

.vestimenta-titulo {
  text-align: center;
  margin-bottom: 40px;
  font-size: 2rem;
}

/* GRID (90% ancho, 4 columnas en desktop) */
.vestimenta-grid {
  width: 90%;
  margin: 0 auto;

  display: grid;
  grid-template-columns: repeat(4, 25%);
  justify-content: space-between;
  gap: 0;
}

/* ITEM (imagen + texto) */
.vestimenta-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* IMAGEN responsiva */
.vestimenta-img {
  width: 90%;              /* opcional: si quieres que sea 100%, cámbialo */
  height: 280px;           /* ajustable */
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* PÁRRAFO breve ajustable */
.vestimenta-texto {
  width: 90%;
  margin: 12px 0 0;
  font-size: 0.95rem;
  line-height: 1.4;
  opacity: 0.9;
}






/* Contenedor PADRINOS*/

/* 1) SECTION */
.menciones-section {
  width: 100%;
  padding: 60px 0;
}

/* 2) TÍTULO */
.menciones-titulo {
  text-align: center;
  margin-bottom: 40px;
  font-size: 2rem;
}

/* 3) GRID 3 columnas: 30% / 30% / 30% | contenedor 90% */
.menciones-grid {
  width: 90%;
  margin: 0 auto;

  display: grid;
  grid-template-columns: repeat(3, 30%);
  justify-content: space-between; /* distribuye el 10% restante */
  gap: 0; /* opcional: puedes subirlo a 20px si deseas separación extra */
}

/* Columna: centra la tarjeta */
.menciones-col {
  display: flex;
  justify-content: center;
}

/* 4) TARJETA: 90% de la columna */
.mencion-card {
  width: 90%;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mencion-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.14);
}

/* Imagen ajustable */
.mencion-img {
  width: 100%;
  height: 220px;      /* ajusta si quieres más/menos alto */
  object-fit: cover;  /* recorta sin deformar */
  display: block;
}

.mencion-body {
  padding: 18px 18px 22px;
}

.mencion-nombre {
  margin: 0 0 10px;
  font-size: 1.25rem;
}

.mencion-texto {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
}

/* ✅ RESPONSIVE */
@media (max-width: 992px) {
  .menciones-grid {
    grid-template-columns: repeat(2, 48%);
    justify-content: space-between;
    gap: 24px;
  }
}

@media (max-width: 600px) {
  .menciones-grid {
    grid-template-columns: 100%;
    gap: 18px;
  }

  .mencion-img {
    height: 200px;
  }
}




/* Contenedor IGLESIA*/
.iglesia-section {
    width: 100%;
    padding: 60px 0;
}

.iglesia-titulo {
    text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
}

.iglesia-grid {
    display: grid;
    grid-template-columns: 40% 60%;
    width: 90%;
    margin: 0 auto;
    gap: 30px;
}

.iglesia-datos,
.iglesia-ubicacion {
    background: #f4f4f4;
    padding: 30px;
    border-radius: 8px;
}

.mapa {
    width: 100%;
    height: 300px;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mapa iframe{
    width: 100%;
    height: 300px;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}



/* Contenedor IGLESIA responsive*/

@media (max-width: 768px) {
    .iglesia-grid {
        grid-template-columns: 1fr;
    }
}


/* Contenedor SALÓN*/

.salon-section {
    width: 100%;
    padding: 60px 0;
}

.salon-titulo {
    text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
}

.salon-grid {
    display: grid;
    grid-template-columns: 40% 60%;
    width: 90%;
    margin: 0 auto;
    gap: 30px;
}

.salon-datos,
.salon-ubicacion {
    background: #f4f4f4;
    padding: 30px;
    border-radius: 8px;
}

.mapa {
    width: 100%;
    height: 300px;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}


.salon-section {
    width: 100%;
    padding: 60px 0;
}

.salon-titulo {
    text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
}

.salon-grid {
    display: grid;
    grid-template-columns: 40% 60%;
    width: 90%;
    margin: 0 auto;
    gap: 30px;
}

.salon-datos,
.salon-ubicacion {
    background: #f4f4f4;
    padding: 30px;
    border-radius: 8px;
}

.mapa {
    width: 100%;
    height: 300px;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Contenedor SALÓN responsive*/

@media (max-width: 768px) {
    .salon-grid {
        grid-template-columns: 1fr;
    }
}



/* Contenedor AGREGA*/

.calendario-section {
    width: 100%;
    padding: 60px 0;
}

.calendario-titulo {
    text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
}

.calendario-contenido {
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.calendario-boton {
    text-align: center;
}

/* Contenedor AGREGA responsive*/

@media (max-width: 768px) {
    .calendario-section {
        padding: 40px 0;
    }

    .calendario-titulo {
        font-size: 1.6rem;
    }
}


/* Contenedor COMPARTIR*/

.scriptlesssocialsharing__heading{
  display: flex;
  justify-content: center; /* Centrado horizontal */
  align-items: center;     /* Centrado vertical */
  height: 10vh;           /* Altura necesaria (ej. toda la pantalla) */	
  margin-bottom: 0px;
}




/* Contenedor SPOTIFY*/



/* Botón Volver arriba*/

.generate-back-to-top {
font-size: 33px;
border-radius: 13px;
right: 10px;
width: 60px;
bottom: 150px;
}


/* Footer Ancho*/

.inside-site-info {
    padding: 0px 0px;
}