/* ===== josemedina.es · CSS base (tema hijo) =====
   Los colores, espacios y radios son variables globales de Bricks (--jm-*).
   Los componentes (botones, tarjetas…) son clases globales de Bricks (jm-*). */

@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("../fonts/plus-jakarta-sans.woff2") format("woff2");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* Selección de texto */
::selection {
	background: var(--jm-indigo-oscuro, #4F46E5);
	color: #fff;
}

/* Foco visible accesible: anillo cian */
:focus-visible {
	outline: 2px solid var(--jm-cian, #22D3EE);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Scrollbar fina en oscuro */
html {
	scrollbar-width: thin;
	scrollbar-color: #334155 var(--jm-fondo, #0B1530);
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--jm-fondo, #0B1530); }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 999px; border: 2px solid var(--jm-fondo, #0B1530); }

/* Enlace "Saltar al contenido" */
.jm-skip-link {
	position: absolute;
	left: 16px;
	top: -100px;
	z-index: 10000;
	padding: 12px 20px;
	border-radius: 12px;
	background: var(--jm-indigo-oscuro, #4F46E5);
	color: #fff;
	font-weight: 600;
}
.jm-skip-link:focus { top: 16px; }

/* Utilidad solo lectores de pantalla */
.jm-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}

/* Transición entre páginas (View Transitions API, si el navegador la soporta) */
@view-transition { navigation: auto; }

@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
	html { scroll-behavior: auto !important; }
}

/* Ángulo animable para los bordes degradados de jm-card y jm-plan--featured */
@property --jm-angle {
	syntax: "<angle>";
	inherits: false;
	initial-value: 0deg;
}
@keyframes jm-spin {
	to { --jm-angle: 360deg; }
}

/* Utilidades que se usan DENTRO de textos (Bricks solo imprime el CSS de una clase global
   cuando se asigna a un elemento, por eso viven aquí). */
.jm-grad {
	background: var(--jm-degradado);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
mark.jm-highlight,
.jm-highlight {
	color: inherit;
	background-color: transparent;
	background-image: linear-gradient(120deg, rgba(129, 140, 248, .28), rgba(168, 85, 247, .28));
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: 0 88%;
	padding: 0 .15em;
	border-radius: 4px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* SVG en línea del shortcode [jm_svg] */
.jm-svg { display: inline-flex; line-height: 0; }
.jm-svg svg { display: block; width: 100%; height: auto; }

/* Logo: animado solo en la primera visita de la sesión; en el resto, estado final */
html.jm-logo-seen .jm-logo :is(.jml-sh, .jml-jm, .jml-ti, .jml-ta),
.jm-logo--static :is(.jml-sh, .jml-jm, .jml-ti, .jml-ta) {
	animation: none !important;
	opacity: 1 !important;
	transform: none !important;
	stroke-dashoffset: 0 !important;
}

/* Botón flotante de WhatsApp (pie global). Aparece a los 3 s con rebote y late cada 8 s */
.jm-wa-float {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 900;
	width: 56px;
	height: 56px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--jm-whatsapp, #25D366);
	color: #fff;
	box-shadow: 0 10px 30px -8px rgba(37, 211, 102, .6);
	animation: jm-wa-in .6s cubic-bezier(.34, 1.56, .64, 1) 3s both;
	transition: transform .25s ease;
}
.jm-wa-float:hover { transform: scale(1.08); color: #fff; }
.jm-wa-float svg { width: 28px; height: 28px; }
.jm-wa-float::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid var(--jm-whatsapp, #25D366);
	opacity: 0;
	animation: jm-wa-pulse 8s ease-out 4s infinite;
	pointer-events: none;
}
@keyframes jm-wa-in { from { opacity: 0; transform: translateY(24px) scale(.6); } to { opacity: 1; transform: none; } }
@keyframes jm-wa-pulse { 0% { opacity: .7; transform: scale(1); } 12% { opacity: 0; transform: scale(1.7); } 100% { opacity: 0; transform: scale(1.7); } }
@media (max-width: 767px) { .jm-wa-float { right: 16px; bottom: 16px; width: 52px; height: 52px; } }
@media (prefers-reduced-motion: reduce) { .jm-wa-float { animation: none; } .jm-wa-float::after { display: none; } }

/* Cabecera fija sobre el hero: la primera sección de cada página deja hueco para ella */
:root { --jm-header-h: 84px; }
#brx-content > .brxe-section:first-child,
#brx-content > section:first-child {
	padding-top: calc(var(--jm-section-py) + var(--jm-header-h));
}
@media (max-width: 767px) { :root { --jm-header-h: 72px; } }
