/* ============================================
   PUBLIC PAGES · v2 · Hero, Features, Galería, Stats, Testimonios
   ============================================ */

/* ===== HERO cinematic ===== */
.hero {
	position: relative; overflow: hidden;
	padding: clamp(4rem, 12vh, 9rem) 0 clamp(5rem, 14vh, 10rem);
	background:
		radial-gradient(900px 600px at 20% 10%, rgba(212,175,55,.18), transparent 60%),
		radial-gradient(700px 500px at 80% 90%, rgba(139,30,45,.30), transparent 60%),
		linear-gradient(180deg, #0b0b0e 0%, #14141a 100%);
}
.hero::before {
	/* subtle starfield */
	content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .35;
	background-image:
		radial-gradient(1px 1px at 20% 30%, #f5d678 50%, transparent),
		radial-gradient(1px 1px at 80% 70%, #f5d678 50%, transparent),
		radial-gradient(1px 1px at 60% 20%, #c0334a 50%, transparent),
		radial-gradient(1.5px 1.5px at 35% 80%, #f5d678 50%, transparent),
		radial-gradient(1px 1px at 50% 50%, #ffffff 50%, transparent);
	background-size: 200px 200px;
	animation: drift 60s linear infinite;
}
@keyframes drift {
	0% { background-position: 0 0, 0 0, 0 0, 0 0, 0 0; }
	100% { background-position: 400px 400px, -400px 400px, 400px -400px, -400px -400px, 0 200px; }
}
.hero__inner {
	position: relative; z-index: 2;
	display: grid; grid-template-columns: 1.15fr .85fr;
	align-items: center; gap: var(--s-8);
}
@media (max-width: 980px) { .hero__inner { grid-template-columns: 1fr; gap: var(--s-7); } }

.hero__eyebrow {
	display: inline-flex; align-items: center; gap: .5rem;
	font-size: .8rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
	padding: .4rem .9rem; border-radius: var(--r-pill);
	background: rgba(212,175,55,.12); color: var(--c-gold);
	border: 1px solid rgba(212,175,55,.3);
	margin-bottom: var(--s-5);
}
.hero__title {
	font-size: clamp(2.6rem, 6vw, 5rem); line-height: 1.05;
	margin-bottom: var(--s-5);
}
.hero__title em {
	font-style: italic; color: transparent;
	background: var(--g-gold); -webkit-background-clip: text; background-clip: text;
}
.hero__lead { font-size: 1.15rem; color: var(--c-text-soft); max-width: 560px; margin-bottom: var(--s-6); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-bottom: var(--s-6); }
.hero__highlight {
	display: flex; flex-wrap: wrap; gap: var(--s-5);
	color: var(--c-text-soft); font-size: .9rem;
}
.hero__highlight span { display: inline-flex; align-items: center; gap: .5rem; }
.hero__highlight i { color: var(--c-gold); }

/* Hero visual: stacked cards + decoration */
.hero__visual {
	position: relative; min-height: 380px;
	display: flex; align-items: center; justify-content: center;
}
.hero__card-main {
	position: relative; z-index: 3;
	background: linear-gradient(160deg, rgba(28,28,36,.95), rgba(20,20,26,.95));
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-lg); padding: var(--s-6);
	max-width: 360px; box-shadow: var(--shadow-lg);
	backdrop-filter: blur(10px);
}
.hero__card-main .icon-circle {
	width: 64px; height: 64px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--g-gold); color: #1a1305; font-size: 1.6rem;
	margin-bottom: var(--s-4); box-shadow: var(--shadow-gold);
}
.hero__card-bg {
	position: absolute; inset: auto auto 8% 8%;
	width: 280px; height: 280px;
	background: var(--g-ruby); border-radius: var(--r-lg);
	transform: rotate(-8deg); opacity: .65;
	box-shadow: 0 30px 60px -10px rgba(139,30,45,.5);
	z-index: 1;
}
.hero__card-bg-2 {
	position: absolute; inset: 5% 5% auto auto;
	width: 200px; height: 200px;
	border-radius: var(--r-lg);
	background: linear-gradient(135deg, rgba(212,175,55,.4), rgba(212,175,55,.05));
	border: 1px solid rgba(212,175,55,.3);
	transform: rotate(12deg); z-index: 1;
	backdrop-filter: blur(8px);
}

/* Marquee */
.marquee {
	overflow: hidden; padding: var(--s-5) 0;
	border-block: 1px solid var(--c-line);
	background: rgba(0,0,0,.3);
}
.marquee__track {
	display: flex; gap: var(--s-7);
	animation: marquee 30s linear infinite;
	white-space: nowrap; will-change: transform;
}
.marquee__item {
	display: inline-flex; align-items: center; gap: var(--s-3);
	font-family: var(--font-display); font-style: italic;
	font-size: 1.5rem; color: var(--c-gold);
	letter-spacing: .03em;
}
.marquee__item i { color: var(--c-text-muted); font-size: 1rem; }
@keyframes marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* Features grid */
.features-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: var(--s-5);
}
.feature {
	background: linear-gradient(160deg, var(--c-surface) 0%, var(--c-bg-2) 100%);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	padding: var(--s-6);
	transition: transform .3s, border-color .3s, box-shadow .3s;
	position: relative; overflow: hidden;
}
.feature::before {
	content:''; position: absolute; inset: 0;
	background: radial-gradient(400px 200px at 0% 0%, rgba(212,175,55,.1), transparent 70%);
	opacity: 0; transition: opacity .35s;
}
.feature:hover { transform: translateY(-6px); border-color: rgba(212,175,55,.4); box-shadow: var(--shadow-gold); }
.feature:hover::before { opacity: 1; }
.feature__icon {
	width: 56px; height: 56px; border-radius: var(--r);
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(212,175,55,.12); color: var(--c-gold);
	font-size: 1.5rem; margin-bottom: var(--s-4);
	border: 1px solid rgba(212,175,55,.25);
	position: relative;
}
.feature h4 { color: var(--c-text); margin-bottom: var(--s-2); position: relative; }
.feature p { color: var(--c-text-soft); margin: 0; position: relative; }

/* Stats bar */
.stats-bar {
	display: grid; grid-template-columns: repeat(4, 1fr);
	gap: var(--s-5); padding: var(--s-7) var(--s-6);
	background: linear-gradient(180deg, rgba(28,28,36,.7), rgba(20,20,26,.7));
	border: 1px solid var(--c-line-strong);
	border-radius: var(--r-lg);
	backdrop-filter: blur(10px);
}
@media (max-width: 720px) { .stats-bar { grid-template-columns: repeat(2, 1fr); } }
.stat { text-align: center; }
.stat__number {
	font-family: var(--font-display); font-weight: 700;
	font-size: clamp(2.2rem, 5vw, 3.5rem);
	background: var(--g-gold); -webkit-background-clip: text; background-clip: text;
	color: transparent; line-height: 1; margin-bottom: var(--s-2);
}
.stat__label { color: var(--c-text-soft); font-size: .85rem; letter-spacing: .15em; text-transform: uppercase; }

/* Steps */
.steps {
	display: grid; grid-template-columns: repeat(4, 1fr);
	gap: var(--s-5); counter-reset: step;
}
@media (max-width: 980px) { .steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } }
.step-card {
	position: relative;
	background: var(--c-surface);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	padding: var(--s-7) var(--s-5) var(--s-5);
	counter-increment: step;
	transition: transform .25s, border-color .25s;
}
.step-card:hover { transform: translateY(-4px); border-color: rgba(212,175,55,.35); }
.step-card::before {
	content: counter(step, decimal-leading-zero);
	position: absolute; top: -22px; left: var(--s-5);
	width: 56px; height: 56px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--g-gold); color: #1a1305;
	font-family: var(--font-display); font-weight: 700; font-size: 1.3rem;
	box-shadow: var(--shadow-gold);
}
.step-card h4 { color: var(--c-text); margin-bottom: var(--s-2); }
.step-card p { color: var(--c-text-soft); font-size: .95rem; margin: 0; }

/* Event types */
.event-types {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: var(--s-4);
}
.event-type {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: var(--s-3); padding: var(--s-5);
	background: var(--c-surface); border: 1px solid var(--c-line);
	border-radius: var(--r);
	color: var(--c-text-soft);
	transition: all .25s; text-align: center;
}
.event-type i { font-size: 1.8rem; color: var(--c-gold); transition: transform .3s; }
.event-type span { font-weight: 500; font-size: .9rem; }
.event-type:hover { border-color: rgba(212,175,55,.4); color: var(--c-text); transform: translateY(-3px); }
.event-type:hover i { transform: scale(1.15) rotate(-6deg); }

/* Testimonials */
.testimonials {
	display: grid; grid-template-columns: repeat(3, 1fr);
	gap: var(--s-5);
}
@media (max-width: 980px) { .testimonials { grid-template-columns: 1fr; } }
.testimonial {
	background: linear-gradient(180deg, rgba(28,28,36,.85), rgba(20,20,26,.95));
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	padding: var(--s-6);
	position: relative;
}
.testimonial::before {
	content: '\201C';
	position: absolute; top: -10px; left: 18px;
	font-family: var(--font-display); font-size: 5rem; line-height: 1;
	color: var(--c-gold); opacity: .35;
}
.testimonial__text { color: var(--c-text); font-style: italic; margin-bottom: var(--s-5); position: relative; }
.testimonial__author { display: flex; align-items: center; gap: var(--s-3); }
.testimonial__avatar {
	width: 46px; height: 46px; border-radius: 50%;
	background: var(--g-gold); color: #1a1305;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-family: var(--font-display);
}
.testimonial__name { font-weight: 600; color: var(--c-text); }
.testimonial__meta { color: var(--c-text-muted); font-size: .8rem; }
.testimonial__stars { color: var(--c-gold); margin-bottom: var(--s-3); font-size: .9rem; }

/* Gallery */
.gallery {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: 200px;
	gap: var(--s-3);
}
@media (max-width: 880px) { .gallery { grid-template-columns: repeat(2, 1fr); } }
.gallery__cell {
	position: relative; overflow: hidden; border-radius: var(--r);
	background: var(--c-surface); border: 1px solid var(--c-line);
	display: flex; align-items: center; justify-content: center;
	transition: transform .3s;
}
.gallery__cell:hover { transform: scale(1.02); }
.gallery__cell--tall { grid-row: span 2; }
.gallery__cell--wide { grid-column: span 2; }
.gallery__cell::after {
	content:''; position: absolute; inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.7));
	opacity: 0; transition: opacity .3s;
}
.gallery__cell:hover::after { opacity: 1; }
.gallery__cell i {
	font-size: 3rem; color: var(--c-gold-deep); opacity: .4;
}
.gallery__cell--gold { background: var(--g-gold); }
.gallery__cell--gold i { color: rgba(0,0,0,.45); opacity: .9; }
.gallery__cell--ruby { background: var(--g-ruby); }
.gallery__cell--ruby i { color: rgba(0,0,0,.5); opacity: .9; }
.gallery__caption {
	position: absolute; left: 12px; bottom: 12px; z-index: 2;
	color: #fff; font-weight: 600; font-size: .9rem;
	opacity: 0; transform: translateY(10px); transition: all .3s;
}
.gallery__cell:hover .gallery__caption { opacity: 1; transform: translateY(0); }

/* CTA banner */
.cta-banner {
	position: relative; overflow: hidden;
	background: var(--g-ruby);
	border-radius: var(--r-lg); padding: var(--s-9) var(--s-7);
	text-align: center; color: #fff;
}
.cta-banner::before {
	content:''; position: absolute; inset: 0;
	background:
		radial-gradient(600px 300px at 20% 30%, rgba(212,175,55,.4), transparent 60%),
		radial-gradient(500px 300px at 80% 70%, rgba(0,0,0,.35), transparent 60%);
}
.cta-banner > * { position: relative; }
.cta-banner h2 { color: #fff; }
.cta-banner p { color: rgba(255,255,255,.85); max-width: 600px; margin: 0 auto var(--s-5); font-size: 1.1rem; }
.cta-banner .btn { background: #fff; color: var(--c-ruby); }
.cta-banner .btn:hover { background: var(--c-gold); color: #1a1305; }

/* Page header */
.page-header {
	padding: var(--s-9) 0 var(--s-7);
	text-align: center;
	background:
		radial-gradient(800px 400px at 50% 0%, rgba(212,175,55,.15), transparent 60%),
		linear-gradient(180deg, var(--c-bg-2), var(--c-bg));
	border-bottom: 1px solid var(--c-line);
}
.page-header h1 { margin-bottom: var(--s-3); }
.page-header p { color: var(--c-text-soft); max-width: 640px; margin: 0 auto; font-size: 1.05rem; }

/* Lookup box */
.lookup-box {
	max-width: 480px; margin: 0 auto;
	display: flex; gap: var(--s-3);
	padding: var(--s-4); background: var(--c-surface); border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
}
.lookup-box input { flex: 1; }

/* Solicitud summary */
.solicitud-summary {
	background: var(--c-surface); border: 1px solid var(--c-line);
	border-radius: var(--r-lg); padding: var(--s-5); margin-bottom: var(--s-5);
}
.solicitud-summary h4 { color: var(--c-gold); font-family: var(--font-body); font-size: .85rem; letter-spacing: .15em; text-transform: uppercase; margin-bottom: var(--s-4); }
.solicitud-summary dl { display: grid; grid-template-columns: 160px 1fr; gap: var(--s-3) var(--s-5); margin: 0; }
.solicitud-summary dt { color: var(--c-text-muted); font-size: .85rem; }
.solicitud-summary dd { margin: 0; color: var(--c-text); }

/* Multistep form */
.form-progress { margin-bottom: var(--s-6); }
.form-progress__steps {
	display: flex; justify-content: space-between; gap: var(--s-2);
	margin-bottom: var(--s-3); flex-wrap: wrap;
}
.form-progress__steps span {
	font-size: .75rem; letter-spacing: .1em; text-transform: uppercase;
	color: var(--c-text-muted); font-weight: 600;
}
.form-progress__steps .is-active { color: var(--c-gold); }
.form-progress__bar {
	height: 4px; background: var(--c-surface-2); border-radius: 4px; overflow: hidden;
}
.form-progress__bar > div {
	height: 100%; background: var(--g-gold);
	transition: width .35s ease;
}
.step h3 { color: var(--c-gold-2); font-family: var(--font-body); font-size: 1.1rem; margin-bottom: var(--s-4); }
.step__nav {
	display: flex; justify-content: space-between; gap: var(--s-3);
	margin-top: var(--s-6); padding-top: var(--s-5);
	border-top: 1px solid var(--c-line);
}
.step__nav.text-right { justify-content: flex-end; }

/* ===== Auth pages ===== */
.auth-section { padding: var(--s-8) 0; }
.auth-grid {
display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-7);
align-items: center; max-width: 1080px;
}
@media (max-width: 880px) { .auth-grid { grid-template-columns: 1fr; } }
.auth-aside h1 { font-size: clamp(2rem, 4vw, 3rem); margin-top: var(--s-4); }
.auth-bullets { list-style: none; padding: 0; margin: var(--s-5) 0 0; display: grid; gap: var(--s-3); }
.auth-bullets li { display: flex; align-items: center; gap: var(--s-3); color: var(--c-text-soft); }
.auth-bullets i { color: var(--c-gold); }
.auth-card { max-width: 460px; width: 100%; margin: 0 auto; }
.auth-card h2 { margin-bottom: var(--s-5); font-size: 1.6rem; }
.w-100 { width: 100%; }

.btn-google {
background: #fff; color: #1f1f1f;
border: 1px solid #dadce0; font-weight: 500;
}
.btn-google:hover { background: #f8f9fa; color: #1f1f1f; box-shadow: 0 2px 6px rgba(0,0,0,.15); }
.btn-google i { color: #4285f4; }

.auth-divider {
display: flex; align-items: center; gap: var(--s-3);
margin: var(--s-5) 0; color: var(--c-text-muted); font-size: .85rem;
}
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--c-line); }

/* ===== User menu (header dropdown) ===== */
.user-menu { position: relative; }
.user-menu__trigger {
display: inline-flex; align-items: center; gap: .5rem;
background: var(--c-surface); border: 1px solid var(--c-line-strong);
color: var(--c-text); cursor: pointer;
padding: .35rem .8rem .35rem .35rem; border-radius: var(--r-pill);
font-family: inherit; font-size: .9rem; font-weight: 500;
transition: border-color .2s, background .2s;
}
.user-menu__trigger:hover { border-color: var(--c-gold); }
.user-menu__trigger img,
.user-menu__initial {
width: 32px; height: 32px; border-radius: 50%; object-fit: cover;
display: inline-flex; align-items: center; justify-content: center;
background: var(--g-gold); color: #1a1305; font-weight: 700; font-size: .9rem;
}
.user-menu__name { display: inline-block; max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu__dropdown {
position: absolute; right: 0; top: calc(100% + 10px); min-width: 240px;
background: linear-gradient(180deg, var(--c-surface), var(--c-surface-2));
border: 1px solid var(--c-line-strong); border-radius: var(--r);
padding: var(--s-3); box-shadow: var(--shadow-lg);
opacity: 0; transform: translateY(-6px); pointer-events: none;
transition: opacity .2s, transform .2s; z-index: 200;
}
.user-menu.is-open .user-menu__dropdown { opacity: 1; transform: translateY(0); pointer-events: auto; }
.user-menu__head { padding: var(--s-3); border-bottom: 1px solid var(--c-line); margin-bottom: var(--s-2); }
.user-menu__head strong { display: block; color: var(--c-text); }
.user-menu__head small { color: var(--c-text-muted); font-size: .78rem; }
.user-menu__dropdown a {
display: flex; align-items: center; gap: .6rem;
padding: .55rem .75rem; border-radius: var(--r-sm);
color: var(--c-text-soft); font-size: .9rem;
}
.user-menu__dropdown a:hover { background: rgba(212,175,55,.1); color: var(--c-gold); }
.user-menu__dropdown hr { border: 0; border-top: 1px solid var(--c-line); margin: var(--s-2) 0; }

/* ===== Profile page ===== */
.profile-section { padding: var(--s-7) 0 var(--s-9); }
.profile-grid { display: grid; grid-template-columns: 320px 1fr; gap: var(--s-6); align-items: start; }
@media (max-width: 880px) { .profile-grid { grid-template-columns: 1fr; } }
.profile-aside { text-align: center; position: sticky; top: 90px; }
.profile-avatar {
width: 110px; height: 110px; margin: 0 auto var(--s-4);
border-radius: 50%; overflow: hidden; position: relative;
background: var(--g-gold); display: inline-flex; align-items: center; justify-content: center;
box-shadow: var(--shadow-gold);
}
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-avatar span { font-size: 2.4rem; font-weight: 700; color: #1a1305; font-family: var(--font-display); }
.profile-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--s-5); gap: var(--s-3); flex-wrap: wrap; }

.empty-state { text-align: center; padding: var(--s-8) var(--s-5); color: var(--c-text-soft); }
.empty-state i { font-size: 3rem; color: var(--c-gold); opacity: .6; margin-bottom: var(--s-4); display: block; }

.solicitudes-list { display: grid; gap: var(--s-3); }
.solicitud-row {
display: grid; grid-template-columns: 64px 1fr auto;
align-items: center; gap: var(--s-4); padding: var(--s-4);
background: rgba(0,0,0,.25); border: 1px solid var(--c-line);
border-radius: var(--r); color: inherit;
transition: border-color .25s, transform .25s, background .25s;
}
.solicitud-row:hover { border-color: rgba(212,175,55,.45); transform: translateX(3px); background: rgba(0,0,0,.4); }
.solicitud-row__date {
width: 64px; height: 64px; border-radius: var(--r);
background: linear-gradient(180deg, rgba(212,175,55,.15), rgba(212,175,55,.05));
border: 1px solid rgba(212,175,55,.25);
display: flex; flex-direction: column; align-items: center; justify-content: center;
color: var(--c-gold);
}
.solicitud-row__date strong { font-family: var(--font-display); font-size: 1.4rem; line-height: 1; }
.solicitud-row__date small { font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; margin-top: 2px; }
.solicitud-row__title { font-weight: 600; color: var(--c-text); margin-bottom: 2px; }
.solicitud-row__meta { color: var(--c-text-muted); font-size: .85rem; }
.solicitud-row__side { text-align: right; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }

/* ===== Bottom navigation (mobile, app feel) ===== */
.bottom-nav { display: none; }
@media (max-width: 880px) {
.has-bottom-nav { padding-bottom: 80px; }
.bottom-nav {
display: grid; grid-template-columns: repeat(4, 1fr);
position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
background: rgba(11,11,14,.94); backdrop-filter: blur(20px) saturate(180%);
-webkit-backdrop-filter: blur(20px) saturate(180%);
border-top: 1px solid var(--c-line);
padding: 6px 0 calc(6px + env(safe-area-inset-bottom));
}
.bottom-nav a {
display: inline-flex; flex-direction: column; align-items: center; gap: 2px;
color: var(--c-text-muted); font-size: .68rem; font-weight: 500;
padding: 6px 4px; text-decoration: none;
}
.bottom-nav a i { font-size: 1.15rem; }
.bottom-nav a.is-active { color: var(--c-gold); }
.bottom-nav__avatar { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
.fab-whatsapp { bottom: 84px; }
}

/* ===== Hero login card ===== */
.sr-only {
position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.hero-login {
display: flex; flex-direction: column; gap: var(--s-3);
text-align: center;
}
.hero-login__head h3 { margin-bottom: 4px; }
.hero-login__head p { margin: 0; }
.hero-login__avatar {
width: 84px; height: 84px; border-radius: 50%; margin: 0 auto var(--s-3);
overflow: hidden; background: var(--g-gold);
display: inline-flex; align-items: center; justify-content: center;
box-shadow: var(--shadow-gold);
}
.hero-login__avatar img { width: 100%; height: 100%; object-fit: cover; }
.hero-login__avatar span { font-size: 2rem; font-weight: 700; color: #1a1305; font-family: var(--font-display); }
.hero-login__form { display: flex; flex-direction: column; gap: var(--s-3); margin-top: var(--s-2); }
.hero-login__form .input { font-size: 1rem; }
.hero-login__actions { display: flex; flex-direction: column; gap: var(--s-2); margin-top: var(--s-3); }
.hero-login__foot { margin: var(--s-3) 0 0; font-size: .9rem; }
.hero-login__foot a { color: var(--c-gold); }

/* Make hero card a touch wider for the form */
.hero--split .hero__card-main { max-width: 420px; padding: var(--s-6) var(--s-5); }

/* ===== Gate (login screen as homepage) ===== */
.is-gate { background: var(--c-bg, #0b0b0e); min-height: 100vh; padding-bottom: 0 !important; }
.site-header--minimal { background: transparent; border-bottom: 0; box-shadow: none; }
.site-header--minimal .site-header__inner { justify-content: center; padding-top: var(--s-5); }
.site-footer--minimal { border-top: 0; padding: var(--s-5) 0 var(--s-6); text-align: center; }
.site-footer--minimal a { color: var(--c-gold); }

.gate {
min-height: calc(100vh - 200px);
display: flex; align-items: center; justify-content: center;
padding: var(--s-6) var(--s-4) var(--s-7); position: relative; overflow: hidden;
}
.gate__bg {
position: absolute; inset: -10%; z-index: 0; pointer-events: none;
background:
radial-gradient(circle at 20% 20%, rgba(212,175,55,.18), transparent 45%),
radial-gradient(circle at 80% 70%, rgba(139,30,45,.22), transparent 50%),
radial-gradient(circle at 50% 100%, rgba(212,175,55,.10), transparent 60%);
filter: blur(40px);
}
.gate__inner { position: relative; z-index: 1; width: 100%; max-width: 460px; text-align: center; }
.gate__brand { margin-bottom: var(--s-6); }
.gate__brand img { width: 64px; height: 64px; margin-bottom: var(--s-3); filter: drop-shadow(0 0 24px rgba(212,175,55,.35)); }
.gate__brand h1 {
font-family: var(--font-display); font-size: clamp(2.2rem, 6vw, 3rem);
margin: 0 0 var(--s-2); letter-spacing: -0.02em;
}
.gate__brand h1 span { color: var(--c-gold); }
.gate__brand p { color: var(--c-text-muted); margin: 0; font-size: .95rem; }

.gate__card {
padding: var(--s-5) var(--s-5) var(--s-4);
border-radius: var(--r-lg, 18px);
box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(212,175,55,.1);
}
.gate__tabs {
display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
background: rgba(0,0,0,.35); padding: 4px; border-radius: var(--r-pill);
margin-bottom: var(--s-5);
}
.gate__tab {
padding: .65rem 1rem; border-radius: var(--r-pill);
color: var(--c-text-muted); font-weight: 600; font-size: .9rem;
text-decoration: none; transition: background .2s, color .2s;
}
.gate__tab.is-active {
background: linear-gradient(180deg, var(--c-gold), #b8941f);
color: #1a1305; box-shadow: 0 4px 12px rgba(212,175,55,.3);
}
.gate__form { display: flex; flex-direction: column; gap: var(--s-2); text-align: left; }
.gate__form label { font-size: .85rem; font-weight: 600; color: var(--c-text-soft); margin-top: var(--s-2); }
.gate__form .input { font-size: 1rem; padding: .8rem 1rem; }
.gate__foot { text-align: center; margin-top: var(--s-4); padding-top: var(--s-4); border-top: 1px solid var(--c-line); }
.gate__foot a { font-size: .9rem; }
.gate__legal { margin-top: var(--s-5); font-size: .8rem; }
.gate__legal a { color: var(--c-gold); }

/* ===== Dashboard (perfil) ===== */
.dash { padding: var(--s-6) 0 var(--s-9); }
.dash__hello {
display: flex; align-items: center; gap: var(--s-4);
margin-bottom: var(--s-5);
}
.dash__avatar {
width: 64px; height: 64px; border-radius: 50%; flex-shrink: 0;
overflow: hidden; background: var(--g-gold); box-shadow: var(--shadow-gold);
display: inline-flex; align-items: center; justify-content: center;
}
.dash__avatar img { width: 100%; height: 100%; object-fit: cover; }
.dash__avatar span { font-size: 1.6rem; font-weight: 700; color: #1a1305; font-family: var(--font-display); }
.dash__hello-text { flex: 1; min-width: 0; }
.dash__hello-text small { color: var(--c-text-muted); font-size: .85rem; }
.dash__hello-text h1 { margin: 0; font-size: 1.6rem; font-family: var(--font-display); }
.dash__hello-text p { margin: 2px 0 0; font-size: .85rem; }

.dash__cta {
display: flex; align-items: center; justify-content: space-between;
padding: var(--s-5); margin-bottom: var(--s-5);
background: linear-gradient(135deg, rgba(212,175,55,.18), rgba(139,30,45,.22));
border: 1px solid rgba(212,175,55,.35); border-radius: var(--r-lg, 18px);
color: inherit; text-decoration: none;
transition: transform .25s, box-shadow .25s;
}
.dash__cta:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,.4); }
.dash__cta small { color: var(--c-gold); font-size: .75rem; letter-spacing: .15em; text-transform: uppercase; }
.dash__cta h2 { font-family: var(--font-display); margin: 4px 0 6px; font-size: 1.6rem; }
.dash__cta p { margin: 0; color: var(--c-text-soft); font-size: .9rem; }
.dash__cta-icon {
width: 64px; height: 64px; border-radius: 50%;
background: linear-gradient(180deg, var(--c-gold), #b8941f);
display: flex; align-items: center; justify-content: center;
color: #1a1305; font-size: 1.6rem; flex-shrink: 0;
box-shadow: 0 6px 20px rgba(212,175,55,.4);
}

.dash__stats {
display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-2);
margin-bottom: var(--s-5);
}
.dash__stat {
background: rgba(0,0,0,.3); border: 1px solid var(--c-line);
border-radius: var(--r); padding: var(--s-3); text-align: center;
}
.dash__stat strong { display: block; font-size: 1.5rem; font-family: var(--font-display); color: var(--c-gold); }
.dash__stat small { color: var(--c-text-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; }

.dash__tiles {
display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-3);
margin-bottom: var(--s-5);
}
@media (max-width: 720px) { .dash__tiles, .dash__stats { grid-template-columns: repeat(2, 1fr); } }
.dash__tile {
display: flex; flex-direction: column; align-items: center; text-align: center;
gap: 4px; padding: var(--s-4) var(--s-3);
background: rgba(0,0,0,.25); border: 1px solid var(--c-line);
border-radius: var(--r); color: inherit; text-decoration: none;
transition: border-color .2s, transform .2s, background .2s;
}
.dash__tile:hover { border-color: rgba(212,175,55,.45); transform: translateY(-2px); background: rgba(0,0,0,.4); }
.dash__tile i { font-size: 1.6rem; color: var(--c-gold); margin-bottom: 4px; }
.dash__tile strong { font-size: .92rem; }
.dash__tile small { color: var(--c-text-muted); font-size: .75rem; }

.dash__block { margin-bottom: var(--s-5); padding: var(--s-5); }
.dash__block h3 { margin: 0 0 var(--s-4); display: flex; align-items: center; gap: .6rem; }
.dash__block h3 i { color: var(--c-gold); }

.dash__info { display: grid; grid-template-columns: 140px 1fr; gap: .6rem var(--s-4); margin: 0; }
.dash__info dt { color: var(--c-text-muted); font-size: .85rem; }
.dash__info dd { margin: 0; color: var(--c-text); font-size: .92rem; }
@media (max-width: 560px) {
.dash__info { grid-template-columns: 1fr; gap: .2rem var(--s-3); }
.dash__info dd { margin-bottom: .6rem; }
}

/* ===== Gate alt CTA (eres mariachi?) ===== */
.gate__alt {
display: flex; align-items: center; justify-content: space-between; gap: var(--s-3);
margin-top: var(--s-4); padding: var(--s-4) var(--s-5);
background: rgba(0,0,0,.35); border: 1px dashed rgba(212,175,55,.35);
border-radius: var(--r); color: inherit; text-decoration: none;
transition: border-color .25s, background .25s, transform .25s;
}
.gate__alt:hover { border-color: var(--c-gold); background: rgba(0,0,0,.5); transform: translateY(-2px); }
.gate__alt small { display: block; color: var(--c-text-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; }
.gate__alt strong { display: block; color: var(--c-gold); font-family: var(--font-display); font-size: 1.2rem; margin: 2px 0; }
.gate__alt > i { font-size: 1.8rem; color: var(--c-gold); opacity: .8; }

/* ===== Form helpers ===== */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
@media (max-width: 560px) { .grid-2 { grid-template-columns: 1fr; } }
.dash__block textarea.input { font-family: inherit; min-height: 90px; resize: vertical; }

/* ===== Repertorio editor ===== */
.rep-add { display: grid; grid-template-columns: 2fr 1fr auto; gap: var(--s-2); margin: var(--s-4) 0; }
@media (max-width: 560px) { .rep-add { grid-template-columns: 1fr; } }
.rep-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.rep-list li {
display: flex; align-items: center; justify-content: space-between;
padding: .6rem .9rem; background: rgba(0,0,0,.25); border: 1px solid var(--c-line);
border-radius: var(--r-sm);
}
.rep-list li form { display: inline; }
.rep-public { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem .8rem; }
@media (max-width: 560px) { .rep-public { grid-template-columns: 1fr; } }
.rep-public li { padding: .35rem 0; color: var(--c-text-soft); }
.rep-public li i { color: var(--c-gold); margin-right: .4rem; }

/* ===== Mariachis grid ===== */
.mariachis-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: var(--s-4); }
.mariachi-card {
display: flex; flex-direction: column; align-items: center; text-align: center;
padding: var(--s-5); color: inherit; text-decoration: none;
transition: transform .25s, box-shadow .25s, border-color .25s;
}
.mariachi-card:hover { transform: translateY(-3px); border-color: rgba(212,175,55,.5); box-shadow: var(--shadow-lg); }
.mariachi-card__pic {
width: 90px; height: 90px; border-radius: 50%; overflow: hidden;
background: var(--g-gold); display: inline-flex; align-items: center; justify-content: center;
margin-bottom: var(--s-3);
}
.mariachi-card__pic img { width: 100%; height: 100%; object-fit: cover; }
.mariachi-card__pic span { font-size: 2rem; font-weight: 700; color: #1a1305; font-family: var(--font-display); }
.mariachi-card h3 { margin: 0 0 4px; font-size: 1.05rem; }
.mariachi-card__meta { list-style: none; padding: 0; margin: var(--s-3) 0 0; display: flex; gap: var(--s-3); flex-wrap: wrap; justify-content: center; }
.mariachi-card__meta li { color: var(--c-text-muted); font-size: .78rem; }
.mariachi-card__meta i { color: var(--c-gold); }

/* ===== Detalle de mariachi ===== */
.musico-detalle { max-width: 880px; margin: 0 auto; }
.musico-head { display: grid; grid-template-columns: 140px 1fr; gap: var(--s-5); padding: var(--s-5); }
@media (max-width: 560px) { .musico-head { grid-template-columns: 1fr; text-align: center; } .musico-head__stats { justify-content: center; } }
.musico-head__pic {
width: 140px; height: 140px; border-radius: var(--r); overflow: hidden;
background: var(--g-gold); display: inline-flex; align-items: center; justify-content: center;
box-shadow: var(--shadow-gold);
}
.musico-head__pic img { width: 100%; height: 100%; object-fit: cover; }
.musico-head__pic span { font-size: 3rem; font-weight: 700; color: #1a1305; font-family: var(--font-display); }
.musico-head h1 { font-family: var(--font-display); margin: 0 0 4px; }
.musico-head__stats { list-style: none; padding: 0; margin: var(--s-3) 0; display: flex; gap: var(--s-5); flex-wrap: wrap; }
.musico-head__stats li { display: flex; flex-direction: column; }
.musico-head__stats strong { font-size: 1.4rem; font-family: var(--font-display); color: var(--c-gold); }
.musico-head__stats small { color: var(--c-text-muted); text-transform: uppercase; letter-spacing: .1em; font-size: .7rem; }