/* JRojas Cigars — capa de sistema sobre theme.json.
   Tokens: ver theme.json. Aquí solo lo que theme.json no expresa. */

:root {
	--jr-line: rgba(138, 123, 108, .4);
	--jr-line-soft: rgba(138, 123, 108, .28);
	--jr-focus: #231913;
	--jr-header-h: 74px;
}

html { scroll-padding-top: calc(var(--jr-header-h) + 16px); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
.jr-measure { max-width: 640px; }
.jr-measure-sm { max-width: 520px; }
.jr-mb { margin-bottom: 34px !important; }
/* En contenedores "constrained" de 1440px, los bloques de medida de lectura se alinean a la izquierda de la retícula, no al centro. */
.is-layout-constrained > :is(.jr-measure, .jr-measure-sm, .jr-form, .jr-section-head, .is-style-pendiente) {
	margin-left: max(0px, calc((100% - 1440px) / 2)) !important;
	margin-right: auto !important;
}

/* Rejillas: pistas minmax(0,1fr) para que las imágenes no desborden entre 900 y 1550px. */
.wp-block-columns > .wp-block-column { min-width: 0; }
.is-layout-grid { grid-template-columns: repeat(auto-fill, minmax(min(var(--jr-min, 280px), 100%), 1fr)); }
.is-layout-grid > * { min-width: 0; }

/* ---------- Foco visible (WCAG) ---------- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--jr-focus);
	outline-offset: 2px;
}
.has-tabaco-background-color :where(a, button, input, select, textarea):focus-visible,
.has-tabaco-footer-background-color :where(a, button):focus-visible,
.jr-header.is-scrolled :where(a, button):focus-visible,
.wp-block-navigation__responsive-container.is-menu-open :where(a, button):focus-visible {
	outline-color: #F3ECDF;
}

.skip-link.screen-reader-text:focus { background: #F3ECDF; color: #231913; padding: 12px 16px; z-index: 100000; }

/* ---------- Header persistente ---------- */
header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 60;
}
.jr-header {
	min-height: var(--jr-header-h);
	border-bottom: 1px solid var(--jr-line);
	transition: min-height .2s ease, background-color .2s ease, color .2s ease;
}
.jr-header.is-scrolled {
	--jr-header-h: 60px;
	background-color: #231913 !important;
	border-bottom-color: transparent;
}
.jr-header.is-scrolled,
.jr-header.is-scrolled a,
.jr-header.is-scrolled .wp-block-site-title a,
.jr-header.is-scrolled .wp-block-navigation__responsive-container-open { color: #F3ECDF !important; }
.jr-header.is-scrolled .wp-block-button__link { background: #F3ECDF; color: #231913 !important; }
.jr-header .wp-block-site-title .jr-sub { font-family: var(--wp--preset--font-family--ui); font-size: 10px; letter-spacing: .18em; color: #6D6155; margin-left: .4em; vertical-align: middle; }
.jr-header .wp-block-navigation-item.current-menu-item > a,
.jr-header .wp-block-navigation a[aria-current="page"] { font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.jr-header .wp-block-navigation a { text-decoration: none; padding-block: 12px; }
.jr-header .wp-block-navigation a:hover { text-decoration: underline; text-underline-offset: 6px; }

/* Menú hamburguesa por debajo de 900px (el núcleo lo pone a 600px). */
@media (min-width: 600px) and (max-width: 899.98px) {
	.jr-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.jr-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
@media (max-width: 899.98px) {
	.jr-header .jr-header-cta { display: none; }
	:root { --jr-header-h: 60px; }
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 32px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.7rem;
	width: 100%;
	border-bottom: 1px solid rgba(243, 236, 223, .16);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a { padding-block: 14px; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; justify-content: center; align-items: center; }

/* ---------- Etiquetas y marcadores ---------- */
.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: .65625rem !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #6D6155 !important;
	margin-bottom: 0;
}
.has-tabaco-background-color .is-style-eyebrow,
.wp-block-cover .is-style-eyebrow { color: rgba(243, 236, 223, .78) !important; }
.jr-kicker {
	font-size: .6875rem; letter-spacing: .22em; text-transform: uppercase;
	border-top: 1px solid rgba(243, 236, 223, .5); padding-top: 11px; width: fit-content;
}
.is-style-pendiente {
	font-family: var(--wp--preset--font-family--mono);
	font-size: .6875rem !important;
	color: #6D6155 !important;
	border-left: 2px solid #8A7B6C;
	padding-left: 12px;
	line-height: 1.7;
}
.jr-pendiente { font-family: var(--wp--preset--font-family--mono); font-size: .6875rem; color: #6D6155; }

/* ---------- Hero (cover) ---------- */
.wp-block-cover.jr-hero { align-items: flex-end; padding-left: var(--wp--preset--spacing--gutter); padding-right: var(--wp--preset--spacing--gutter); }
.wp-block-cover.jr-hero .wp-block-cover__inner-container { max-width: 1440px; margin-inline: auto; width: 100%; }
.wp-block-cover.jr-hero :where(h1, h2, p) { color: #F3ECDF; text-wrap: pretty; }
.wp-block-cover.jr-hero p.jr-lead { color: rgba(243, 236, 223, .86); max-width: 520px; }
@media (max-width: 899.98px) {
	.wp-block-cover.jr-hero .wp-block-cover__gradient-background { background: linear-gradient(180deg,rgba(35,25,19,.35) 0%,rgba(35,25,19,.2) 38%,rgba(35,25,19,.9) 100%) !important; }
	.wp-block-cover.jr-hero .wp-block-buttons { flex-direction: column; align-items: stretch; }
}

/* Con fotografía cargada, el velo se aplica solo (lateral en escritorio, inferior en móvil). */
.wp-block-cover.jr-hero:has(.wp-block-cover__image-background) .wp-block-cover__background {
	background: linear-gradient(90deg,rgba(35,25,19,.82) 0%,rgba(35,25,19,.5) 46%,rgba(35,25,19,.1) 78%) !important;
	opacity: 1 !important;
}
@media (max-width: 899.98px) {
	.wp-block-cover.jr-hero:has(.wp-block-cover__image-background) .wp-block-cover__background {
		background: linear-gradient(180deg,rgba(35,25,19,.35) 0%,rgba(35,25,19,.2) 38%,rgba(35,25,19,.9) 100%) !important;
	}
}
.jr-hero--home { min-height: clamp(470px, 70vh, 600px) !important; }
.jr-hero--sub { min-height: clamp(360px, 55vh, 460px) !important; }
.wp-block-cover.jr-hero .wp-block-cover__inner-container { padding-bottom: clamp(24px, 4.5vw, 56px); }
.wp-block-cover.jr-hero .jr-hero-copy { max-width: 700px; }

/* Hueco de foto como bloque Portada: al cargar una imagen desaparece el marcador. */
.wp-block-cover.jr-foto { min-height: clamp(320px, 45vw, 520px) !important; }
.wp-block-cover.jr-foto:not(:has(.wp-block-cover__image-background)) {
	background: repeating-linear-gradient(135deg, #EFE8DA 0 12px, #E9E1D1 12px 13px);
	outline: 1px dashed #8A7B6C; outline-offset: -1px;
}
.wp-block-cover.jr-foto:not(:has(.wp-block-cover__image-background)) .wp-block-cover__background { opacity: 0 !important; }
.wp-block-cover.jr-foto:has(.wp-block-cover__image-background) .wp-block-cover__background { opacity: 0 !important; }
.wp-block-cover.jr-foto:has(.wp-block-cover__image-background) .wp-block-cover__inner-container { display: none; }
.wp-block-cover.jr-foto p { font-family: var(--wp--preset--font-family--mono); font-size: .6875rem; color: #6D6155; text-align: center; max-width: 30ch; margin-inline: auto; }

/* ---------- Secciones ---------- */
.jr-section { padding-top: var(--wp--preset--spacing--80) !important; padding-bottom: var(--wp--preset--spacing--80) !important; }
.jr-bordered { border-top: 1px solid var(--jr-line); border-bottom: 1px solid var(--jr-line); }
.jr-border-top { border-top: 1px solid var(--jr-line); }
.jr-pilares > .wp-block-column { padding: clamp(28px, 3.5vw, 48px) clamp(0px, 2.8vw, 40px); }
.jr-pilares { border-bottom: 1px solid var(--jr-line); gap: 0 !important; }
@media (max-width: 781px) { .jr-pilares > .wp-block-column:not(:last-child) { border-bottom: 1px solid var(--jr-line-soft); } }
.jr-split { gap: 0 !important; }
.jr-split > .jr-split-text { padding: clamp(32px, 4.5vw, 64px) clamp(20px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; }
.jr-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 30px; }
.jr-cta-band :where(h2) { color: #F3ECDF; }
.jr-cta-band p { color: rgba(243, 236, 223, .8); }
.has-tabaco-background-color :where(h1, h2, h3) { color: #F3ECDF; }
.has-tabaco-background-color p { color: rgba(243, 236, 223, .82); }
.has-tabaco-background-color a:not(.wp-block-button__link) { color: #F3ECDF; }

/* ---------- Botones ---------- */
.wp-block-button__link { min-height: 44px; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
.wp-block-button.is-style-claro .wp-block-button__link { background: #F3ECDF; color: #231913; }
.wp-block-button.is-style-claro .wp-block-button__link:hover { background: #EFE8DA; }
.wp-block-button.is-style-borde .wp-block-button__link { background: transparent; color: inherit; border: 1px solid currentColor; }
.wp-block-button.is-style-borde .wp-block-button__link:hover { background: rgba(35, 25, 19, .06); }
.has-tabaco-background-color .wp-block-button.is-style-borde .wp-block-button__link,
.wp-block-cover .wp-block-button.is-style-borde .wp-block-button__link { color: #F3ECDF; border-color: rgba(243, 236, 223, .65); }
.has-tabaco-background-color .wp-block-button.is-style-borde .wp-block-button__link:hover,
.wp-block-cover .wp-block-button.is-style-borde .wp-block-button__link:hover { background: rgba(243, 236, 223, .08); }
.wp-block-button__link[aria-disabled="true"], .wp-block-button__link:disabled { opacity: .5; pointer-events: none; }

/* ---------- Tarjeta de marca ---------- */
.is-style-tarjeta {
	background: #EFE8DA;
	border: 1px solid rgba(138, 123, 108, .35);
	position: relative;
	transition: border-color .15s ease;
	height: 100%;
}
.is-style-tarjeta:hover { border-color: #8A7B6C; }
.is-style-tarjeta:focus-within { outline: 3px solid var(--jr-focus); outline-offset: 2px; }
.is-style-tarjeta .wp-block-post-featured-image { margin: 0; }
.is-style-tarjeta .jr-card-body { padding: 20px 22px 22px; }
.is-style-tarjeta .jr-card-head { border-bottom: 1px solid var(--jr-line); padding-bottom: 10px; }
.is-style-tarjeta .wp-block-post-title { font-size: 1.25rem; margin: 0; }
/* Toda la tarjeta es clicable a través del enlace del título. */
.is-style-tarjeta .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.is-style-tarjeta .wp-block-post-title a:focus-visible { outline: none; }
.is-style-tarjeta .wp-block-post-excerpt { font-size: .78125rem; color: #6D6155; }
.jr-monograma {
	width: 26px; height: 26px; flex: none;
	border: 1px solid #8A7B6C;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--wp--preset--font-family--display); font-size: 11px; color: #6D6155;
}

/* ---------- Pasos numerados ---------- */
.is-style-paso { border-top: 2px solid #231913; padding-top: 16px; }
.is-style-paso .jr-num { font-family: var(--wp--preset--font-family--display); font-size: 1.625rem; font-weight: 500; color: #231913; margin: 0; }
.is-style-paso h3 { font-family: var(--wp--preset--font-family--ui); font-size: .84375rem !important; font-weight: 500; margin: 8px 0 0; color: #3A2C22; }
.is-style-paso p { font-size: .8125rem; line-height: 1.65; }
.jr-pilar { border-top: 1px solid rgba(138, 123, 108, .5); padding-top: 18px; }

/* ---------- Lista de inspección ---------- */
ol.is-style-inspeccion { list-style: none; padding: 0; margin: 0; counter-reset: jr; }
ol.is-style-inspeccion li {
	counter-increment: jr; display: flex; gap: 12px;
	padding: 11px 0; border-bottom: 1px solid var(--jr-line-soft); font-size: .875rem; line-height: 1.6;
}
ol.is-style-inspeccion li::before {
	content: counter(jr, decimal-leading-zero);
	font-family: var(--wp--preset--font-family--mono); font-size: .65625rem; color: #6D6155; padding-top: 3px; flex: none;
}
.jr-list-title { font-size: .75rem !important; letter-spacing: .12em; text-transform: uppercase; color: #231913; border-bottom: 1px solid #8A7B6C; padding-bottom: 9px; margin-bottom: 6px !important; font-family: var(--wp--preset--font-family--ui) !important; font-weight: 500 !important; }

/* ---------- Hueco de fotografía (hasta tener material real) ---------- */
.is-style-foto-pendiente {
	background: repeating-linear-gradient(135deg, #EFE8DA 0 12px, #E9E1D1 12px 13px);
	border: 1px dashed #8A7B6C;
	display: flex; align-items: center; justify-content: center; text-align: center;
	min-height: 320px;
}
.is-style-foto-pendiente p { font-family: var(--wp--preset--font-family--mono); font-size: .6875rem; color: #6D6155; max-width: 28ch; }

/* ---------- Ficha técnica ---------- */
.jr-ficha { margin: 26px 0 0; border-top: 1px solid rgba(138, 123, 108, .5); }
.jr-ficha div { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-bottom: 1px solid rgba(138, 123, 108, .3); font-size: .8125rem; }
.jr-ficha dt { margin: 0; }
.jr-ficha dd { margin: 0; text-align: right; }
.jr-ficha dd.is-pendiente { font-family: var(--wp--preset--font-family--mono); font-size: .6875rem; color: #6D6155; }

/* ---------- Canales de contacto ---------- */
.jr-canales { border-top: 1px solid rgba(138, 123, 108, .5); }
.jr-canal { padding: 16px 0; border-bottom: 1px solid var(--jr-line-soft); }
.jr-canal .jr-tipo { font-family: var(--wp--preset--font-family--mono); font-size: .65625rem; letter-spacing: .14em; color: #6D6155; text-transform: uppercase; }
.jr-canal .jr-valor { font-size: .90625rem; margin-top: 7px; }
.jr-canal .jr-nota { font-size: .78125rem; color: #6D6155; margin-top: 5px; line-height: 1.6; }

/* ---------- Formularios ---------- */
.jr-form { max-width: 640px; }
.jr-form, .jr-form *, .jr-form *::before, .jr-form *::after { box-sizing: border-box; }
.jr-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.jr-form legend { padding: 0; }
.jr-field { margin-bottom: 18px; }
.jr-field label { display: block; font-size: .8125rem; font-weight: 500; margin-bottom: 6px; color: #3A2C22; }
.jr-field .jr-req { color: #6D6155; font-weight: 400; }
.jr-field input, .jr-field textarea, .jr-field select {
	width: 100%; font: inherit; font-size: 1rem; color: #3A2C22;
	background: #fff; border: 1px solid #8A7B6C; border-radius: 3px;
	padding: 11px 12px; min-height: 44px;
}
.jr-field textarea { min-height: 132px; resize: vertical; }
.jr-field input:focus-visible, .jr-field textarea:focus-visible, .jr-field select:focus-visible { outline: 3px solid #231913; outline-offset: 2px; border-color: #231913; }
.jr-field [aria-invalid="true"] { border-color: #8C2B1E; border-width: 2px; }
.jr-field-error { display: flex; gap: 6px; font-size: .78125rem; color: #8C2B1E; margin-top: 6px; }
.jr-field-error::before { content: "!"; font-weight: 700; border: 1px solid currentColor; border-radius: 50%; width: 16px; height: 16px; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; flex: none; margin-top: 2px; }
.jr-field-error:empty { display: none; }
.jr-motivos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.jr-motivos label { position: relative; cursor: pointer; }
.jr-motivos input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.jr-motivos span { display: inline-flex; align-items: center; min-height: 44px; font-size: .78125rem; padding: 10px 16px; border: 1px solid #8A7B6C; color: #3A2C22; background: transparent; }
.jr-motivos input:checked + span { background: #231913; color: #F3ECDF; border-color: #231913; }
.jr-motivos input:checked + span::before { content: "✓"; margin-right: 6px; }
.jr-motivos input:focus-visible + span { outline: 3px solid #231913; outline-offset: 2px; }
.jr-consent { display: flex; gap: 10px; align-items: flex-start; font-size: .8125rem; margin: 6px 0 18px; }
.jr-consent input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: #231913; }
.jr-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.jr-submit {
	font: inherit; font-size: .84375rem; font-weight: 500; cursor: pointer;
	background: #231913; color: #F3ECDF; border: 0; border-radius: 0;
	padding: 15px 26px; min-height: 44px;
}
.jr-submit:hover { background: #3A2C22; }
.jr-submit[disabled] { opacity: .6; cursor: progress; }
.jr-form-note { font-size: .75rem; color: #6D6155; margin-top: 12px; }
.jr-alert { padding: 14px 16px; margin-bottom: 18px; font-size: .875rem; border-left: 3px solid; }
.jr-alert[hidden] { display: none; }
.jr-alert.is-error { border-color: #8C2B1E; background: #F6E7E2; color: #5A1A11; }
.jr-alert.is-success { border-color: #231913; background: #EFE8DA; color: #231913; }
.jr-success h3 { margin-top: 0; }

/* ---------- WhatsApp flotante ---------- */
.jr-wa {
	position: fixed; right: 20px; bottom: 20px; z-index: 70;
	width: 52px; height: 52px;
	display: flex; align-items: center; justify-content: center;
	background: #F3ECDF; border: 1px solid #231913; color: #231913;
}
.jr-wa:hover { background: #EFE8DA; border-width: 2px; }
.jr-wa svg { width: 24px; height: 24px; }

/* ---------- Aviso de mayoría de edad ---------- */
.jr-age { position: fixed; inset: 0; z-index: 100; background: rgba(27, 18, 13, .96); color: #F3ECDF; display: flex; align-items: center; justify-content: center; padding: 20px; }
.jr-age[hidden] { display: none; }
.jr-age__box { max-width: 520px; text-align: left; }
.jr-age__box h2 { color: #F3ECDF; margin: 12px 0; }
.jr-age__box p { color: rgba(243, 236, 223, .82); }
.jr-age__actions { display: flex; gap: 12px; margin-top: 22px; flex-wrap: wrap; }
.jr-age__actions button { font: inherit; font-size: .875rem; min-height: 44px; padding: 13px 24px; cursor: pointer; border-radius: 0; }
.jr-age__yes { background: #F3ECDF; color: #231913; border: 0; font-weight: 500; }
.jr-age__no { background: transparent; color: #F3ECDF; border: 1px solid rgba(243, 236, 223, .6); }
.jr-age :focus-visible { outline-color: #F3ECDF; }
html.jr-age-open { overflow: hidden; }

/* ---------- Footer ---------- */
.jr-footer a { color: rgba(243, 236, 223, .85); text-decoration: none; }
.jr-footer a:hover { color: #F3ECDF; text-decoration: underline; }
.jr-footer .is-style-eyebrow { color: rgba(243, 236, 223, .72) !important; }
.jr-footer p { color: rgba(243, 236, 223, .8); }
.jr-footer .jr-footer-list { list-style: none; padding: 0; margin: 0; line-height: 2; font-size: .78125rem; }
.jr-footer .jr-canal, .jr-footer .jr-canales { border-color: rgba(243, 236, 223, .14); }
.jr-footer .jr-canal .jr-tipo, .jr-footer .jr-canal .jr-nota { color: rgba(243, 236, 223, .6); }
.jr-footer .jr-pendiente { color: rgba(243, 236, 223, .6); }

/* ---------- Movimiento ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
