/* JB Leads · formulario y página del recurso.
   Estilo limpio como el tema (José, 22-oct-2026): blanco, negro y gris claro, esquinas rectas, sin sombras duras.
   El lima solo en el botón de enviar. Usa las variables del tema con valores de respaldo. */
.jbl, .jbl-aviso, .jbl-file, .jbl-gate {
	--jbl-ink: var(--jb-ink, var(--wp--preset--color--ink, #0F0F0F));
	--jbl-gray: var(--jb-gray, var(--wp--preset--color--gray, #F6F6F6));
	--jbl-line-c: var(--jb-line, var(--wp--preset--color--line, #E6E6E6));
	--jbl-lime: var(--jb-lime, var(--wp--preset--color--lime, #CCFF00));
	--jbl-white: #fff;
	--jbl-muted: var(--jb-muted, var(--wp--preset--color--muted, #6B6B6B));
	box-sizing: border-box;
	color: var(--jbl-ink);
}
.jbl *, .jbl *::before, .jbl *::after { box-sizing: border-box; }

/* Etiqueta */
.jbl-etiqueta { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--jbl-muted); }

/* Contenedor */
.jbl { margin-block: 2.5rem; }
.jbl--tarjeta { background: var(--jbl-gray); padding: clamp(22px, 4vw, 40px); }
.jbl--banda {
	background: var(--jbl-ink); color: var(--jbl-white);
	padding: clamp(36px, 6vw, 72px) max(16px, calc((100% - 1240px) / 2));
	display: grid; gap: 18px 48px;
}
@media (min-width: 900px) { .jbl--banda { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; } }
.jbl--banda .jbl-etiqueta { color: rgba(255,255,255,.6); }
.jbl--compacto { border-block: 1px solid var(--jbl-line-c); padding-block: 20px; }

/* Cabecera */
.jbl__head { margin-bottom: 20px; }
.jbl--banda .jbl__head { margin-bottom: 0; }
.jbl__title { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 800; line-height: 1.15; letter-spacing: -.015em; margin: 10px 0 8px; }
.jbl--compacto .jbl__title { font-size: 1.2rem; margin-top: 6px; }
.jbl__text { margin: 0; font-size: 1.0625rem; color: #4A4A4A; }
.jbl--banda .jbl__text { color: rgba(255,255,255,.75); }

/* Campos */
.jbl-fields { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.jbl-field { flex: 1 1 200px; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.jbl-field label { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.jbl-field label span { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--jbl-muted); }
.jbl--banda .jbl-field label span { color: rgba(255,255,255,.6); }
.jbl-field input {
	width: 100%; font: inherit; font-size: 16px; /* evita el zoom de iOS */
	color: var(--jbl-ink); background: var(--jbl-white);
	border: 1px solid #CFCFCF; border-radius: 0; padding: 13px 14px; min-height: 52px; appearance: none;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.jbl-field input::placeholder { color: #9A9A9A; opacity: 1; }
.jbl-field input:focus { outline: none; border-color: var(--jbl-ink); box-shadow: 0 0 0 1px var(--jbl-ink); }

/* Botón: el único lima */
.jbl-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 13px 24px;
	font: inherit; font-weight: 700; font-size: .875rem; letter-spacing: .06em; text-transform: uppercase; line-height: 1;
	color: var(--jbl-ink); background: var(--jbl-lime); border: 0; border-radius: 0;
	cursor: pointer; text-decoration: none; flex: 0 0 auto; transition: background-color .2s ease, color .2s ease;
}
.jbl-btn:hover { background: var(--jbl-ink); color: var(--jbl-white); }
.jbl--banda .jbl-btn:hover { background: var(--jbl-white); color: var(--jbl-ink); }
.jbl-btn:focus-visible { outline: 2px solid var(--jbl-ink); outline-offset: 3px; }
.jbl--banda .jbl-btn:focus-visible { outline-color: var(--jbl-white); }
.jbl-form.is-busy .jbl-btn { opacity: .6; cursor: progress; }
@media (max-width: 520px) { .jbl-btn { width: 100%; } }

/* Consentimiento y datos */
.jbl-consent { display: flex; gap: 10px; align-items: flex-start; margin: 16px 0 0; font-size: .9rem; line-height: 1.5; }
.jbl-consent input { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--jbl-ink); }
.jbl--banda .jbl-consent input { accent-color: var(--jbl-lime); }
.jbl-consent a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.jbl-legal { margin-top: 10px; font-size: .78rem; line-height: 1.5; color: var(--jbl-muted); }
.jbl--banda .jbl-legal { color: rgba(255,255,255,.55); }
.jbl-legal summary { cursor: pointer; }
.jbl-legal p { margin: 6px 0 0; }

/* Mensajes */
.jbl-msg { margin: 12px 0 0; font-weight: 600; }
.jbl-msg:empty { display: none; }
.jbl-msg.is-error { color: #B42318; }
.jbl--banda .jbl-msg.is-error { color: #FF8A80; }
.jbl-done { background: var(--jbl-white); border: 1.5px solid var(--jbl-ink); padding: 20px 22px; outline: none; }
.jbl--banda .jbl-done { color: var(--jbl-ink); }
.jbl-done p { margin: 0; }
.jbl-done__title { font-weight: 800; font-size: 1.2rem; line-height: 1.25; margin-bottom: 6px !important; }

/* Trampa para robots */
.jbl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Página del recurso */
.jbl-aviso { background: var(--jbl-gray); padding: 14px 18px; margin: 0 0 24px; }
.jbl-aviso .jbl-etiqueta { margin-right: 8px; color: var(--jbl-ink); }
.jbl-file { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; background: var(--jbl-gray); padding: 20px 22px; margin: 32px 0; }
.jbl-file__name { margin: 0; flex: 1 1 200px; font-weight: 700; word-break: break-word; }
.jbl-file__name span { font-weight: 400; font-size: .85em; color: var(--jbl-muted); }
.jbl-gate__teaser { margin-bottom: 8px; }

@media (prefers-reduced-motion: reduce) { .jbl-btn, .jbl-field input { transition: none; } }