/* Academia Arrieta — estilos scoped bajo .aa-scope para no interferir
   con el theme ni con los estilos de Elementor del resto del sitio.

   Paleta y tipografía tomadas del sitio principal germanarrieta.com
   (extraídas de los estilos computados en vivo): fondo blanco, texto
   navy oscuro, acento azul, botones tipo píldora, encabezados en
   Inter Tight en negrita, cuerpo en Inter. */

.aa-scope {
	--aa-bg: #ffffff;
	--aa-bg-alt: #f5f5f7;
	--aa-bg-card: #f5f5f7;
	--aa-borde: rgba(10, 24, 52, 0.1);
	--aa-texto: #0a1834;
	--aa-texto-tenue: rgba(10, 24, 52, 0.62);
	--aa-azul: #0068d6;
	--aa-azul-oscuro: #2235dd;

	font-family: 'Inter', -apple-system, 'system-ui', 'Helvetica Neue', Arial, sans-serif;
	color: var(--aa-texto);
	background: var(--aa-bg);
	box-sizing: border-box;
}
.aa-scope *, .aa-scope *::before, .aa-scope *::after { box-sizing: inherit; }

.aa-scope h1, .aa-scope h2, .aa-scope h3 {
	font-family: 'Inter Tight', -apple-system, 'system-ui', 'Helvetica Neue', Arial, sans-serif;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 0.5em;
	color: var(--aa-texto);
}

.aa-container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.aa-py { padding-top: 56px; padding-bottom: 64px; }
.aa-py-chico { padding-top: 0; padding-bottom: 48px; }
.aa-mt { margin-top: 24px; }

/* Home */
.aa-hero { text-align: center; max-width: 720px; margin: 0 auto; padding-bottom: 48px; }
.aa-hero .aa-eyebrow { justify-content: center; }
.aa-hero-sub { color: var(--aa-texto-tenue); font-size: 1.05rem; margin-top: 16px; }
.aa-hero-ctas { display: flex; gap: 16px; justify-content: center; margin-top: 32px; flex-wrap: wrap; }
.aa-home-footer-nav { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; border-top: 1px solid var(--aa-borde); padding-top: 40px; }

.aa-h1 { font-size: 2.5rem; line-height: 1.15; }
.aa-h2 { font-size: 1.5rem; }
.aa-eyebrow {
	display: inline-flex; align-items: center;
	text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.75rem; font-weight: 600;
	color: var(--aa-azul); margin-bottom: 12px;
}

/* Nav propia de la academia (reemplaza al header del theme en las páginas
   que corren a canvas). */
.aa-nav {
	position: sticky; top: 0; z-index: 20;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--aa-borde);
}
.aa-nav-inner {
	max-width: 1120px; margin: 0 auto; padding: 16px 24px;
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.aa-nav-logo {
	font-family: 'Inter Tight', -apple-system, 'system-ui', 'Helvetica Neue', Arial, sans-serif;
	font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase;
	font-size: 0.9rem; color: var(--aa-texto); text-decoration: none;
}
.aa-nav-links { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.aa-nav-links a {
	color: var(--aa-texto); text-decoration: none; font-size: 0.9rem; font-weight: 500;
}
.aa-nav-links a:hover { color: var(--aa-azul); }
.aa-nav-links a.aa-nav-cta {
	background: var(--aa-azul); color: #fff; font-weight: 600;
	padding: 8px 18px; border-radius: 980px;
}
.aa-nav-links a.aa-nav-cta:hover { background: var(--aa-azul-oscuro); color: #fff; }

/* Footer propio de la academia */
.aa-footer { border-top: 1px solid var(--aa-borde); margin-top: 24px; }
.aa-footer-inner {
	max-width: 1120px; margin: 0 auto; padding: 32px 24px;
	display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
	color: var(--aa-texto-tenue); font-size: 0.85rem;
}
.aa-footer-inner a { color: var(--aa-texto-tenue); }
.aa-footer-inner a:hover { color: var(--aa-azul); }

.aa-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 12px 28px; font-size: 0.9rem; font-weight: 600;
	text-decoration: none; border: 1px solid transparent; border-radius: 980px;
	cursor: pointer; transition: background-color .15s, color .15s, border-color .15s;
}
.aa-btn-primary { background: var(--aa-azul); color: #fff; }
.aa-btn-primary:hover { background: var(--aa-azul-oscuro); color: #fff; }
.aa-btn-outline { border-color: var(--aa-borde); color: var(--aa-texto); background: transparent; }
.aa-btn-outline:hover { border-color: var(--aa-azul); color: var(--aa-azul); }
.aa-w-full { width: 100%; }

/* Catálogo / tarjetas de curso */
.aa-catalogo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 32px; }
@media (max-width: 900px) { .aa-catalogo-grid { grid-template-columns: 1fr; } }

.aa-curso-card {
	display: block; text-decoration: none; color: inherit;
	background: var(--aa-bg-card); border: 1px solid var(--aa-borde); border-radius: 20px; padding: 24px;
	transition: border-color .15s, box-shadow .15s;
}
.aa-curso-card:hover { border-color: rgba(0, 104, 214, 0.4); box-shadow: 0 8px 24px rgba(10, 24, 52, 0.08); }
.aa-curso-thumb { aspect-ratio: 16/9; background: #e9e9eb; margin-bottom: 16px; overflow: hidden; border-radius: 12px; }
.aa-curso-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aa-curso-titulo { font-size: 1.1rem; margin-bottom: 8px; }
.aa-curso-desc { font-size: 0.9rem; color: var(--aa-texto-tenue); margin: 0; }
.aa-curso-cta { display: inline-block; margin-top: 16px; font-size: 0.85rem; font-weight: 600; color: var(--aa-azul); }

/* Módulos / lecciones */
.aa-curso-descripcion { max-width: 640px; color: var(--aa-texto-tenue); margin-bottom: 40px; }
.aa-modulos { display: flex; flex-direction: column; gap: 40px; }
.aa-modulo-titulo { font-size: 1.1rem; color: var(--aa-texto); border-bottom: 1px solid var(--aa-borde); padding-bottom: 8px; }
.aa-leccion-lista { list-style: none; margin: 0; padding: 0; }
.aa-leccion-link {
	display: flex; align-items: center; justify-content: space-between;
	padding: 12px 8px; color: var(--aa-texto-tenue); text-decoration: none;
	border-bottom: 1px solid var(--aa-borde); border-radius: 8px;
}
.aa-leccion-link:hover, .aa-leccion-activa { color: var(--aa-azul); background: var(--aa-bg-alt); }
.aa-badge-gratis { font-size: 0.7rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; color: var(--aa-azul); }

/* Reproductor / lección */
.aa-leccion-layout { display: grid; grid-template-columns: 1fr 300px; gap: 40px; }
@media (max-width: 900px) { .aa-leccion-layout { grid-template-columns: 1fr; } }
.aa-video-wrap { position: relative; aspect-ratio: 16/9; background: var(--aa-bg-alt); overflow: hidden; border-radius: 16px; }
.aa-video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.aa-paywall, .aa-video-vacio {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 16px; text-align: center; border: 1px solid var(--aa-borde);
}
.aa-leccion-descripcion { color: var(--aa-texto-tenue); margin-top: 12px; }
.aa-leccion-sidebar { border-left: 1px solid var(--aa-borde); padding-left: 24px; }

/* Auth / cuenta */
.aa-auth-box, .aa-cuenta-box { max-width: 380px; margin: 0 auto; padding: 48px 24px; }
.aa-form { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }
.aa-input {
	background: var(--aa-bg-alt); border: 1px solid var(--aa-borde); border-radius: 12px; color: var(--aa-texto);
	padding: 12px 16px; font-family: inherit; font-size: 0.95rem;
}
.aa-input:focus { outline: none; border-color: var(--aa-azul); }
.aa-error { color: #d92d20; font-size: 0.9rem; }
.aa-nota { color: var(--aa-texto-tenue); font-size: 0.9rem; }
.aa-auth-switch { margin-top: 24px; font-size: 0.9rem; color: var(--aa-texto-tenue); }
.aa-auth-switch a { color: var(--aa-azul); }
.aa-label { font-size: 0.8rem; color: var(--aa-texto-tenue); margin-top: 16px; margin-bottom: 2px; }
.aa-valor { font-size: 1rem; }
.aa-estado { text-transform: uppercase; font-size: 0.7rem; font-weight: 600; letter-spacing: .05em; color: var(--aa-azul); }
.aa-estado-cancelada, .aa-estado-vencida { color: #d92d20; }

/* Precios */
.aa-precios-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; max-width: 720px; }
.aa-plan-card { background: var(--aa-bg-card); border: 1px solid var(--aa-borde); border-radius: 20px; padding: 32px; }
.aa-plan-nombre { font-size: 1.4rem; }
.aa-plan-desc { color: var(--aa-texto-tenue); font-size: 0.9rem; }
.aa-plan-precio { font-size: 2.25rem; color: var(--aa-azul); font-weight: 700; margin: 20px 0; }
.aa-plan-periodo { font-size: 1rem; color: var(--aa-texto-tenue); font-weight: 400; }
