/* MasEventos — comportamiento de interfaz compartido (landing + plantillas de evento) */

:root{
	--smi-verde-bosque:#2F5233;
	--smi-dorado:#C9A25B;
	--smi-gradient-brand:linear-gradient(135deg, var(--smi-verde-bosque), var(--smi-dorado));
	--smi-radius-sm:10px;
	--smi-radius-md:16px;
	--smi-radius-lg:24px;
	--smi-shadow-sm:0 4px 16px rgba(27,35,28,.07);
	--smi-shadow-md:0 16px 40px rgba(27,35,28,.10);
	--smi-shadow-lg:0 26px 60px rgba(27,35,28,.16);
	--smi-ease:cubic-bezier(.22,.61,.36,1);
}

.smi-gradient-bg{
	background:var(--smi-gradient-brand) !important;
}

/* Animación de aparición al hacer scroll */
.smi-reveal{
	opacity:0;
	transform:translateY(28px);
	transition:opacity .7s ease, transform .7s ease;
}
.smi-reveal.is-visible{
	opacity:1;
	transform:none;
}
@media (prefers-reduced-motion: reduce){
	.smi-reveal{ opacity:1; transform:none; transition:none; }
}

/* Nav responsive de la landing */
.smi-nav{
	position:relative;
	display:flex;
	align-items:center;
	gap:18px;
}
.smi-nav-links{
	display:flex;
	align-items:center;
	gap:20px;
	list-style:none;
	margin:0;
	padding:0;
}
.smi-nav-links a{
	font-family:"Public Sans", sans-serif;
	font-weight:600;
	font-size:14px;
	color:#1B231C;
	text-decoration:none;
	white-space:nowrap;
}
.smi-nav-links a:hover{
	opacity:.7;
}
.smi-nav-toggle{
	display:none !important;
	background:none !important;
	border:none !important;
	cursor:pointer;
	width:32px;
	height:32px;
	padding:0;
	align-items:center;
	justify-content:center;
	flex:0 0 auto;
}
.smi-nav-toggle span{
	position:relative;
	display:block;
	width:20px;
	height:2px;
	background:#1B231C;
	transition:background .25s ease;
}
.smi-nav-toggle span::before,
.smi-nav-toggle span::after{
	content:"";
	position:absolute;
	left:0;
	width:20px;
	height:2px;
	background:#1B231C;
	transition:transform .25s ease, top .25s ease, opacity .25s ease;
}
.smi-nav-toggle span::before{ top:-6px; }
.smi-nav-toggle span::after{ top:6px; }
.smi-nav-open .smi-nav-toggle span{ background:transparent; }
.smi-nav-open .smi-nav-toggle span::before{ top:0; transform:rotate(45deg); }
.smi-nav-open .smi-nav-toggle span::after{ top:0; transform:rotate(-45deg); }

@media (max-width:767px){
	.smi-nav-links{
		display:none;
		position:fixed;
		top:var(--smi-header-h, 90px);
		right:16px;
		left:auto;
		width:min(240px, calc(100vw - 32px));
		flex-direction:column;
		align-items:flex-start;
		background:#FFFFFF;
		border:1px solid #E7E2D6;
		border-radius:var(--smi-radius-md);
		padding:18px;
		box-shadow:var(--smi-shadow-lg);
		z-index:60;
	}
	.smi-nav-open .smi-nav-links{ display:flex; }
	.smi-nav-toggle{ display:inline-flex !important; }
}

/* Carrusel horizontal con scroll-snap nativo (sin librería) */
.smi-carousel{
	display:flex !important;
	flex-wrap:nowrap !important;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	-webkit-overflow-scrolling:touch;
	gap:20px;
	padding-bottom:10px;
	scrollbar-width:thin;
}
.smi-carousel > .smi-carousel-item{
	scroll-snap-align:start;
	flex:0 0 78%;
	max-width:78%;
}
@media (min-width:600px){
	.smi-carousel > .smi-carousel-item{ flex-basis:46%; max-width:46%; }
}
@media (min-width:1024px){
	.smi-carousel > .smi-carousel-item{ flex-basis:24%; max-width:24%; }
}

/* Ícono del acordeón de FAQ: rota en vez de solo cambiar de ícono */
.elementor-accordion .elementor-tab-title .elementor-accordion-icon .elementor-accordion-icon-opened{
	display:none !important;
}
.elementor-accordion .elementor-tab-title .elementor-accordion-icon .elementor-accordion-icon-closed{
	display:inline-flex !important;
	transition:transform .3s ease;
}
.elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-icon .elementor-accordion-icon-closed{
	transform:rotate(45deg);
}

/* Sobre de apertura de la invitación */
.smi-envelope{
	position:fixed;
	inset:0;
	z-index:9999;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:26px;
	text-align:center;
	padding:32px;
	background:var(--ev-color-secundario, #f7f2ea);
	opacity:1;
	visibility:visible;
	transition:opacity .6s ease, visibility 0s linear 0s;
}
.smi-envelope.is-open{
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:opacity .6s ease, visibility 0s linear .6s;
}
.smi-envelope-seal{
	width:92px;
	height:92px;
	border-radius:50%;
	border:2px solid var(--ev-color-primario, #8a6d3b);
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--ev-color-primario, #8a6d3b);
	font-family:"Cormorant", serif;
	font-size:32px;
}
.smi-envelope-text{
	font-family:"Cormorant", serif;
	font-size:22px;
	color:var(--ev-color-primario, #8a6d3b);
	max-width:320px;
}
.smi-envelope-btn{
	border:1px solid var(--ev-color-primario, #8a6d3b) !important;
	color:var(--ev-color-primario, #8a6d3b) !important;
	background:transparent !important;
	padding:12px 30px;
	font-family:"Public Sans", sans-serif;
	font-weight:600;
	font-size:12px;
	letter-spacing:.09em;
	text-transform:uppercase;
	border-radius:6px;
	cursor:pointer;
}
body.smi-envelope-locked{
	overflow:hidden;
	height:100vh;
}

/* RSVP visual: estado confirmado */
.ev-rsvp-boton.is-confirmed{
	background:var(--ev-color-primario, #2F5233);
	color:#fff !important;
	cursor:default;
}

/* Header flotante tipo "vidrio esmerilado": fijo arriba, semitransparente,
   con blur y una sombra sutil que aparece al hacer scroll. */
.smi-header{
	position:sticky !important;
	top:0;
	z-index:999;
	background:rgba(255,255,255,.82) !important;
	backdrop-filter:blur(14px) saturate(160%);
	-webkit-backdrop-filter:blur(14px) saturate(160%);
	transition:box-shadow .35s var(--smi-ease);
}
.smi-header.smi-scrolled{
	box-shadow:var(--smi-shadow-sm);
}
/* En Elementor, las columnas del header se apilan en celular por defecto;
   lo forzamos a quedarse en una sola fila compacta, como el nav de Convite. */
.smi-header .elementor-container{
	flex-wrap:nowrap !important;
	justify-content:space-between !important;
	align-items:center !important;
	gap:10px;
}
.smi-header .elementor-column{
	width:auto !important;
	max-width:none !important;
	flex:0 0 auto !important;
}
.smi-header .elementor-widget-wrap{
	flex-direction:row !important;
	flex-wrap:nowrap !important;
	align-items:center !important;
}
@media (max-width:480px){
	.smi-header .elementor-widget-text-editor,
	.smi-header .elementor-widget-text-editor p{
		font-size:19px !important;
	}
	.smi-header .elementor-widget-wrap{ gap:8px; }
	.smi-header a.elementor-button, .smi-header .elementor-button{
		padding:8px 14px !important;
		font-size:13px !important;
		white-space:nowrap;
	}
	/* "Iniciar sesión" no cabe junto al logo, el toggle y "Empezar" en una
	   fila angosta; se prioriza el CTA principal, igual que hace Convite
	   con su nav compacto de celular. */
	.elementor-element-3086738b{
		display:none !important;
	}
}

/* Resplandor suave detrás del hero y de la sección de precios, con
   nuestros propios colores (verde bosque / dorado) en vez de morado/rosa. */
.elementor-element-75448737,
.elementor-element-39102682{
	position:relative;
	overflow:hidden;
}
.elementor-element-75448737::before,
.elementor-element-39102682::before{
	content:"";
	position:absolute;
	inset:-15% -10%;
	background:
		radial-gradient(45% 45% at 18% 12%, rgba(47,82,51,.10), transparent 70%),
		radial-gradient(40% 40% at 88% 20%, rgba(201,162,91,.16), transparent 70%);
	pointer-events:none;
	z-index:0;
}
.elementor-element-75448737 > .elementor-container,
.elementor-element-39102682 > .elementor-container{
	position:relative;
	z-index:1;
}

/* Tarjetas del carrusel: esquinas redondeadas + elevación al pasar el mouse */
.smi-carousel-item img{
	border-radius:var(--smi-radius-md);
	box-shadow:var(--smi-shadow-sm);
	transition:transform .5s var(--smi-ease), box-shadow .35s ease;
}
.smi-carousel-item .elementor-widget-html > div{
	border-radius:var(--smi-radius-md);
	overflow:hidden;
}
.smi-carousel-item:hover img{
	transform:translateY(-6px) scale(1.02);
	box-shadow:var(--smi-shadow-md);
}

/* Tarjetas de precios: se ven como tarjetas reales, con la de Premium destacada.
   El color de fondo de Elementor vive en el ".elementor-widget-wrap" interno,
   así que el radio/padding/borde van ahí para que sea una sola tarjeta, y la
   sombra + elevación al pasar el mouse van en la columna exterior. */
.elementor-element-220a17c1,
.elementor-element-53ec135f,
.elementor-element-9fb7312{
	border-radius:var(--smi-radius-md);
	transition:transform .35s var(--smi-ease), box-shadow .35s var(--smi-ease);
	box-shadow:var(--smi-shadow-sm);
}
.elementor-element-220a17c1 > .elementor-widget-wrap,
.elementor-element-53ec135f > .elementor-widget-wrap,
.elementor-element-9fb7312 > .elementor-widget-wrap{
	border-radius:var(--smi-radius-md) !important;
	padding:36px 30px !important;
}
.elementor-element-53ec135f{
	box-shadow:var(--smi-shadow-md);
}
.elementor-element-53ec135f > .elementor-widget-wrap{
	border:1px solid rgba(201,162,91,.6);
}
.elementor-element-220a17c1:hover,
.elementor-element-53ec135f:hover,
.elementor-element-9fb7312:hover{
	transform:translateY(-6px);
	box-shadow:var(--smi-shadow-lg);
}

/* Botones: leve elevación y brillo al pasar el mouse */
.elementor-button,
.ev-rsvp-boton{
	transition:transform .25s var(--smi-ease), box-shadow .25s var(--smi-ease), filter .25s ease !important;
}
.elementor-button:hover,
.ev-rsvp-boton:hover{
	transform:translateY(-2px);
	box-shadow:var(--smi-shadow-sm);
	filter:brightness(1.05);
}

/* Foco de accesibilidad en nuestro verde, no en el rosa por defecto del tema */
.smi-nav-toggle:focus-visible,
.smi-envelope-btn:focus-visible,
.ev-rsvp-boton:focus-visible,
.elementor-button:focus-visible{
	outline:2px solid var(--smi-verde-bosque);
	outline-offset:2px;
}

/* Aparición escalonada: dentro de una sección revelada, cada columna entra
   un poco después que la anterior, en vez de aparecer todas de golpe. */
.smi-reveal .elementor-column,
.smi-reveal .smi-carousel-item{
	opacity:0;
	transform:translateY(18px);
	transition:opacity .6s var(--smi-ease), transform .6s var(--smi-ease);
}
.smi-reveal.is-visible .elementor-column,
.smi-reveal.is-visible .smi-carousel-item{
	opacity:1;
	transform:none;
}
.smi-reveal.is-visible .elementor-column:nth-child(1),
.smi-reveal.is-visible .smi-carousel-item:nth-child(1){ transition-delay:.05s; }
.smi-reveal.is-visible .elementor-column:nth-child(2),
.smi-reveal.is-visible .smi-carousel-item:nth-child(2){ transition-delay:.15s; }
.smi-reveal.is-visible .elementor-column:nth-child(3),
.smi-reveal.is-visible .smi-carousel-item:nth-child(3){ transition-delay:.25s; }
.smi-reveal.is-visible .elementor-column:nth-child(4),
.smi-reveal.is-visible .smi-carousel-item:nth-child(4){ transition-delay:.35s; }

@media (prefers-reduced-motion: reduce){
	.smi-reveal .elementor-column,
	.smi-reveal .smi-carousel-item{ opacity:1; transform:none; transition:none; }
	.elementor-button, .ev-rsvp-boton, .smi-carousel-item img{ transition:none !important; }
}
