/*
 Theme Name:   {{EMPRESA}} (Hello Elementor Child)
 Theme URI:    https://{{DOMINIO}}
 Description:  Child theme of Hello Elementor for {{EMPRESA}}. Built by Digital Checkmark on the wp-base-digitalchk kit.
 Author:       Digital Checkmark
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  hello-elementor-child
*/

/* ============================================================================
   Que hay aqui y que NO
   ============================================================================
   Solo lo que Elementor gratis no puede hacer: la cabecera y el pie (tema),
   el selector de idioma, el 404, el blog y los ajustes de Bit Form y Popup Maker.
   Colores y tipografias de las paginas viven en Elementor > Ajustes del sitio
   (globales, desde tokens.json). Las variables de abajo son los MISMOS valores
   para que cabecera y pie hagan juego: si cambia un token, se cambia aqui tambien.
   Origen: tema hijo de Superior (sept-2026), sin colores ni textos de Superior. */

:root {
	--dk-marca:          #A78562;   /* tokens: accent. Acentos grandes, lineas, iconos */
	--dk-primario:       #8A6A47;   /* tokens: primary. Botones con texto blanco (>= 4,5:1) */
	--dk-primario-hover: #6E5438;   /* el primario un 20 % mas oscuro */
	--dk-oscuro:         #3A2848;   /* tokens: dark */
	--dk-oscuro-2:       #4E3A60;   /* tokens: dark2 */
	--dk-barra:          #2A1C35;   /* barra de utilidad, un punto mas oscura que la cabecera */
	--dk-texto:          #3D3443;   /* tokens: text */
	--dk-gris:           #6B6272;   /* tokens: muted */
	--dk-linea:          #E6DEEE;   /* tokens: line */
	--dk-alterno:        #F7F3FF;   /* tokens: alt */
	--dk-resalte:        #C9B6DD;   /* tokens: highlight. Fondo claro con texto oscuro (aviso de idioma) y un solo detalle */
	--dk-foco:           #8562A8;   /* foco del teclado: >= 3:1 sobre blanco (LeVisa, 9-oct-2026) */
	--dk-titulos:        "Cormorant Garamond", Georgia, serif;   /* tokens: tipos disp/h/h3 */
	--dk-cuerpo:         "Jost", system-ui, sans-serif;   /* tokens: tipo body */
}

html { scroll-padding-top: 96px; }
body { font-family: var(--dk-cuerpo); color: var(--dk-texto); }

.dk-caja { max-width: 1200px; margin-inline: auto; padding-inline: 24px; }

/* foco visible en todo el sitio (teclado) */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--dk-foco);
	outline-offset: 2px;
}

/* Salto al contenido (lo imprime el tema padre) */
.skip-link.screen-reader-text:focus { background: #FFFFFF; color: var(--dk-oscuro); z-index: 1000; }

/* ------------------------------------------------------------ botones */
.dk-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--dk-cuerpo);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.2;
	padding: 14px 26px;
	border-radius: 4px;
	text-decoration: none;
	border: 2px solid transparent;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.dk-btn--primario { background: var(--dk-primario); color: #FFFFFF; }
.dk-btn--primario:hover { background: var(--dk-primario-hover); color: #FFFFFF; }
.dk-btn--linea { border-color: rgb(255 255 255 / .55); color: #FFFFFF; }
.dk-btn--linea:hover { background: #FFFFFF; color: var(--dk-oscuro); }
.dk-btn--oscuro { border-color: var(--dk-oscuro); color: var(--dk-oscuro); }
.dk-btn--oscuro:hover { background: var(--dk-oscuro); color: #FFFFFF; }

/* ------------------------------------------------- barra de utilidad */
.dk-topbar {
	background: var(--dk-barra);
	color: rgb(255 255 255 / .78);
	font-size: 14px;
	line-height: 1;
}
.dk-topbar__in {
	display: flex;
	align-items: center;
	gap: 18px;
	min-height: 40px;
}
.dk-topbar__tel {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: #FFFFFF;
	font-weight: 600;
	text-decoration: none;
	letter-spacing: .01em;
}
.dk-topbar__tel svg { color: var(--dk-marca); }
.dk-topbar__tel:hover { color: var(--dk-resalte); }
.dk-topbar__lic { flex: 1 1 auto; }

.dk-langs { display: inline-flex; border: 1px solid rgb(255 255 255 / .25); border-radius: 4px; overflow: hidden; }
.dk-lang {
	color: rgb(255 255 255 / .75);
	text-decoration: none;
	font-weight: 600;
	font-size: 13px;
	padding: 6px 10px;
}
.dk-lang abbr { text-decoration: none; cursor: inherit; }
.dk-lang:hover { color: #FFFFFF; background: rgb(255 255 255 / .1); }
.dk-lang--actual { background: #FFFFFF; color: var(--dk-oscuro); }
.dk-lang--actual:hover { background: #FFFFFF; color: var(--dk-oscuro); }

@media (max-width: 767px) {
	.dk-topbar__lic { display: none; }
	.dk-topbar__in { justify-content: space-between; }
}

/* ------------------------------------------------------------ cabecera */
.site-header {
	background: var(--dk-oscuro);
	border-bottom: 3px solid var(--dk-marca);
	padding-block: 0;
	z-index: 200;
}
#site-header.site-header { position: sticky; top: 0; padding-block: 0; }
#site-header.site-header .header-inner,
.site-header .header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	max-width: 1200px;
	width: 100%;
	margin-inline: auto;
	padding: 14px 24px;
	transition: padding .22s ease;
}
.site-header .site-branding { flex: 0 0 auto; }
.site-header .site-branding img { max-height: 58px; width: auto; display: block; transition: max-height .22s ease; }
#site-header.site-header.dchk-compacta .header-inner { padding-block: 8px; }
#site-header.site-header.dchk-compacta .site-branding img { max-height: 42px; }

.site-header .site-navigation { flex: 1 1 auto; }
.site-header .site-navigation ul.menu {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 4px 26px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--dk-titulos);
	font-size: 19px;
	font-weight: 600;
	letter-spacing: .01em;
}
.site-header .site-navigation ul.menu li { display: flex; position: relative; }
.site-header .site-navigation a {
	color: rgb(255 255 255 / .88);
	text-decoration: none;
	padding: 8px 0;
	border-bottom: 2px solid transparent;
}
.site-header .site-navigation a:hover { color: #FFFFFF; border-bottom-color: var(--dk-marca); }
.site-header .site-navigation .current-menu-item > a,
.site-header .site-navigation .current-menu-ancestor > a { color: #FFFFFF; border-bottom-color: var(--dk-marca); }

/* Elemento del menu con clase menu-cta: boton primario */
.site-header .site-navigation .menu-cta > a {
	background: var(--dk-primario);
	color: #FFFFFF;
	border: 0;
	border-radius: 4px;
	padding: 11px 20px;
	font-family: var(--dk-cuerpo);
	font-size: 15px;
}
.site-header .site-navigation .menu-cta > a:hover { background: var(--dk-primario-hover); }
.site-header .menu-cta::after { display: none !important; }

/* submenus */
.site-header .site-navigation ul.menu li.menu-item-has-children { padding-inline-end: 14px; }
.site-header .site-navigation ul.menu li.menu-item-has-children::after { color: rgb(255 255 255 / .6); font-size: .7em; transition: transform .18s ease; }
.site-header .site-navigation ul.menu li.menu-item-has-children.itr-abierto::after { transform: rotate(180deg); }
.site-header .site-navigation ul.menu li ul {
	display: block;
	position: absolute;
	top: 100%;
	left: -16px;
	z-index: 80;
	min-width: 260px;
	margin: 0;
	padding: 8px;
	list-style: none;
	background: #FFFFFF;
	border-top: 3px solid var(--dk-marca);
	border-radius: 0 0 6px 6px;
	box-shadow: 0 18px 40px rgb(0 0 0 / .2);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-.3rem);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
	font-family: var(--dk-cuerpo);
	font-size: 16px;
	font-weight: 500;
}
.site-header .site-navigation ul.menu li ul li { display: block; }
.site-header .site-navigation ul.menu li ul a {
	display: block;
	white-space: nowrap;
	padding: 10px 14px;
	border-radius: 4px;
	border: 0;
	color: var(--dk-texto);
}
.site-header .site-navigation ul.menu li ul a:hover { background: var(--dk-alterno); color: var(--dk-primario); }
.site-header .site-navigation ul.menu li.menu-item-has-children.itr-abierto > ul,
.site-header .site-navigation ul.menu li.menu-item-has-children:focus-within > ul { opacity: 1; visibility: visible; transform: none; }
@media (hover: hover) and (pointer: fine) {
	.site-header .site-navigation ul.menu li.menu-item-has-children:hover > ul { opacity: 1; visibility: visible; transform: none; }
}

/* boton movil y desplegable */
.site-header .site-navigation-toggle-holder { display: none; }
.site-header .site-navigation-toggle {
	background: transparent;
	border: 2px solid rgb(255 255 255 / .35);
	border-radius: 4px;
	padding: 10px;
	color: #FFFFFF;
}

@media (max-width: 1024px) {
	#site-header.site-header .site-navigation { display: none !important; }
	#site-header.site-header .site-navigation-toggle-holder { display: flex !important; }
	.site-header .site-branding img { max-height: 46px; }
}
.site-navigation-dropdown ul.menu { background: #FFFFFF; }
.site-navigation-dropdown ul.menu li a {
	text-decoration: none;
	color: var(--dk-texto);
	background: #FFFFFF;
	box-shadow: inset 0 -1px 0 var(--dk-linea);
	font-weight: 600;
	padding: 16px 24px;
}
.site-navigation-dropdown ul.menu li.current-menu-item > a { background: var(--dk-alterno); color: var(--dk-primario); }
.site-navigation-dropdown ul.sub-menu,
.site-navigation-dropdown ul.menu li ul { display: none; margin: 0; padding-left: 16px; list-style: none; border-left: 3px solid var(--dk-marca); }
.site-navigation-dropdown .menu-item-has-children.itr-abierto > ul { display: block; }
.site-navigation-dropdown .menu-cta > a { color: var(--dk-primario); }

@media (prefers-reduced-motion: reduce) {
	.site-header .header-inner,
	.site-header .site-branding img,
	.site-header .site-navigation ul.menu li ul,
	.site-header .site-navigation ul.menu li.menu-item-has-children::after { transition: none; }
}

/* ------------------------------------------------------------ pie */
.dk-pie { background: var(--dk-oscuro); color: rgb(255 255 255 / .74); font-size: 16px; }
.dk-pie a { color: rgb(255 255 255 / .86); text-decoration: none; }
.dk-pie a:hover { color: #FFFFFF; text-decoration: underline; text-underline-offset: 3px; }

.dk-pie__cta { background: var(--dk-primario); color: #FFFFFF; }
.dk-pie__cta-in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px 40px;
	flex-wrap: wrap;
	padding-block: 40px;
}
.dk-pie .dk-pie__cta-tit {
	font-family: var(--dk-titulos);
	font-weight: 700;
	font-size: clamp(26px, 3.2vw, 36px);
	line-height: 1.1;
	color: #FFFFFF;
	margin: 0 0 6px;
	max-width: 640px;
}
.dk-pie__cta-sub { margin: 0; color: rgb(255 255 255 / .9); }
.dk-pie__cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.dk-pie__cta .dk-btn--primario { background: #FFFFFF; color: var(--dk-primario); }
.dk-pie__cta .dk-btn--primario:hover { background: var(--dk-oscuro); color: #FFFFFF; text-decoration: none; }
/* Boton "Call" de la franja del pie: ".dk-pie a:hover" (0,2,1) ganaba a ".dk-btn--linea:hover" (0,2,0) y dejaba el texto
   blanco sobre el fondo blanco del hover; en el celular el hover se queda pegado tras tocarlo (The Retreat, 12-oct-2026) */
.dk-pie__cta .dk-btn--linea:hover,
.dk-pie__cta .dk-btn--linea:focus-visible { background: #FFFFFF; color: var(--dk-oscuro); text-decoration: none; }

.dk-pie__cols {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
	gap: 40px;
	padding-block: 56px 40px;
}
.dk-pie__logo { width: 200px; height: auto; margin-bottom: 18px; }
.dk-pie__col p { margin: 0 0 14px; line-height: 1.6; }
.dk-pie .dk-pie__h {
	font-family: var(--dk-titulos);
	font-weight: 600;
	font-size: 20px;
	color: #FFFFFF;
	margin: 0 0 14px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--dk-marca);
	display: inline-block;
}
.dk-pie__col ul { list-style: none; margin: 0; padding: 0; }
.dk-pie__col li { margin-bottom: 10px; }
.dk-pie__lic strong { color: #FFFFFF; letter-spacing: .03em; }
.dk-pie__dir { font-style: normal; line-height: 1.6; margin: 0 0 14px; }
.dk-pie__tel { font-family: var(--dk-titulos); font-size: 24px; font-weight: 700; color: #FFFFFF !important; }
.dk-pie__social { display: inline-flex; align-items: center; gap: 8px; }

.dk-pie__base { border-top: 1px solid rgb(255 255 255 / .12); font-size: 14px; }
.dk-pie__base-in { display: flex; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap; padding-block: 18px; }

@media (max-width: 960px) { .dk-pie__cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dk-pie__cols { grid-template-columns: 1fr; gap: 32px; } }

/* ------------------------------------------------------------ 404 */
.dk-404 { min-height: 56vh; display: flex; align-items: center; padding: 72px 24px; }
.dk-404__in { max-width: 640px; margin-inline: auto; }
.dk-404__codigo {
	display: inline-block;
	font-family: var(--dk-titulos);
	font-weight: 600;
	letter-spacing: .08em;
	background: var(--dk-alterno);
	color: var(--dk-primario);
	padding: 6px 12px;
	border-radius: 3px;
	margin: 0 0 18px;
}
.dk-404 h1 { font-family: var(--dk-titulos); font-size: clamp(36px, 5vw, 56px); margin: 0 0 12px; color: var(--dk-oscuro); }
.dk-404__btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }

/* La pagina sin titulo de Hello (todo es Elementor) y sin desborde lateral en movil */
.page-header .entry-title { box-sizing: border-box; }
main.site-main { box-sizing: border-box !important; margin-left: auto !important; margin-right: auto !important; }

/* Aviso de idioma (mu-plugin dchk-sugerencia-idioma) */
.dchk-idioma {
	display: flex; align-items: center; justify-content: center; gap: 8px 18px; flex-wrap: wrap;
	padding: 10px 16px; background: var(--dk-resalte); color: var(--dk-oscuro); font-size: 15px;
}
.dchk-idioma__txt { margin: 0; font-weight: 500; }
.dchk-idioma__acciones { display: flex; gap: 10px; align-items: center; }
.dchk-idioma__si { background: var(--dk-oscuro); color: #FFFFFF !important; border-radius: 4px; padding: 6px 16px; font-weight: 600; text-decoration: none; }
.dchk-idioma button.dchk-idioma__no {
	background: transparent !important; border: 0 !important; box-shadow: none !important;
	color: var(--dk-oscuro) !important; text-decoration: underline; cursor: pointer;
	font: inherit !important; padding: 5px 4px !important; text-transform: none !important;
}

/* ------------------------------------------------ ayudas de las paginas */
/* Iconos pixel art (si el diseno los usa): que no se suavicen al escalar */
.dk-pixel img { image-rendering: pixelated; }
.dk-grid .elementor-image-box-title a { color: inherit; text-decoration: none; }
.dk-grid .elementor-image-box-title a:hover { color: var(--dk-primario); }
/* Pasos del proceso: linea superior que une los pasos */
.dk-step { border-top: 3px solid var(--dk-linea); }
.dk-step:first-child { border-top-color: var(--dk-marca); }
/* Logos de marcas: misma altura visual */
.dk-logo img { max-height: 56px; width: auto !important; object-fit: contain; }
/* Pie de foto */
.elementor-widget-image .widget-image-caption { font-size: 14px; color: var(--dk-gris); margin-top: 10px; }

/* ------------------------------------------------------------ blog */
.dk-blog__hero { background: var(--dk-oscuro); color: #FFFFFF; padding: 80px 0 72px; }
.dk-blog__hero h1 { font-family: var(--dk-titulos); font-weight: 700; font-size: clamp(40px, 5vw, 60px); line-height: 1.02; color: #FFFFFF; margin: 0 0 16px; max-width: 900px; }
.dk-blog__hero p { font-size: 20px; line-height: 1.5; color: rgb(255 255 255 / .86); margin: 0; max-width: 720px; }
.dk-blog__hero .dk-blog__meta { font-size: 15px; margin: 0 0 14px; }
.dk-blog__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 14px; color: var(--dk-gris); margin: 0 0 10px; }
.dk-blog__hero .dk-blog__meta { color: rgb(255 255 255 / .7); }
.dk-blog__cat { font-weight: 600; color: var(--dk-primario); text-decoration: none; }
.dk-blog__hero .dk-blog__cat { color: var(--dk-resalte); }
.dk-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding-block: 72px 32px; }
.dk-blog__card { background: #FFFFFF; border: 1px solid var(--dk-linea); border-top: 3px solid var(--dk-marca); border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; }
.dk-blog__img img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.dk-blog__body { padding: 22px 24px 26px; }
.dk-blog__title { font-family: var(--dk-titulos); font-weight: 600; font-size: 24px; line-height: 1.15; margin: 0 0 10px; }
.dk-blog__title a { color: var(--dk-oscuro); text-decoration: none; }
.dk-blog__title a:hover { color: var(--dk-primario); }
.dk-blog__excerpt { margin: 0; font-size: 16px; line-height: 1.55; color: var(--dk-texto); }
.dk-blog__pag { padding-bottom: 72px; }
.dk-blog__pag .nav-links { display: flex; gap: 12px; }
@media (max-width: 1024px) { .dk-blog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .dk-blog__grid { grid-template-columns: 1fr; padding-block: 48px 24px; } .dk-blog__hero { padding: 56px 0 48px; } }

.dk-post__body { max-width: 808px; margin: 0 auto; padding: 56px 24px 72px; }
.dk-post__img { margin: 0 0 40px; }
.dk-post__img img { display: block; width: 100%; height: auto; border-radius: 6px; }
.dk-post__content { font-size: 18px; line-height: 1.7; }
.dk-post__content h2 { font-family: var(--dk-titulos); font-weight: 700; font-size: 32px; line-height: 1.1; color: var(--dk-oscuro); margin: 44px 0 14px; }
.dk-post__content ul { padding-left: 1.2em; margin: 0 0 1.2em; }
.dk-post__content li { margin-bottom: .5em; }
.dk-post__content a { color: var(--dk-primario); }
.dk-post__content .has-small-font-size { font-size: 14px; color: var(--dk-gris); border-top: 1px solid var(--dk-linea); padding-top: 16px; margin-top: 40px; }
.dk-post__back { margin: 40px 0 0; font-weight: 600; }
.dk-post__back a { color: var(--dk-oscuro); }
/* Blog: la cabecera grafito a todo el ancho (Hello limita .site-main al contenedor) */
main.site-main.dk-blog, main.site-main.dk-post { max-width: none; width: 100%; padding: 0; }
/* Movil: mismo margen lateral (16px) en cabecera, barra y contenido */
@media (max-width: 767px) {
	.dk-caja { padding-inline: 16px; }
	#site-header.site-header .header-inner { padding: 12px 16px; }
}
.site-navigation-dropdown ul.menu li.menu-cta > a { color: var(--dk-primario); font-weight: 700; }

/* ------------------------------------------- formularios (Bit Form) */
/* Bit Form trae azul por defecto en la barra de pasos y el foco: se pasan a la marca */
[class*="_frm-b"][class*="-progress-fill"] { background-color: var(--dk-primario) !important; }
[class*="_frm-b"] input:focus, [class*="_frm-b"] textarea:focus, [class*="_frm-b"] select:focus { border-color: var(--dk-oscuro) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--dk-resalte) 35%, transparent) !important; }
[class*="_frm-b"] input[type="checkbox"]:checked, [class*="_frm-b"] input[type="radio"]:checked { accent-color: var(--dk-primario); }

/* ---------- Galerias (widget nativo de Elementor) ----------
   Aprendido en JCP Photography (8-oct-2026): la galeria de WordPress flota y en el celular quedaba a 1 columna,
   y recortar todo a una misma proporcion cortaba gente en las fotos apaisadas.
   - Rejilla real de 1 a 4 columnas; 2 en el celular.
   - Verticales a 4:5 por defecto; apaisadas a 3:2 con la clase dk-gal-h en el widget (gallery(..., { cls: 'dk-gal-h' })).
     Regla: cada galeria lleva fotos de una sola orientacion.
   - En el celular, con numero impar de fotos, la primera va a lo ancho (no queda una sola en la ultima fila).
   - Dos verticales a todo el ancho quedaban de 750 px de alto: se limitan a 800 px de ancho. */
.elementor-image-gallery .gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 !important; }
.elementor-image-gallery .gallery br { display: none; }
.elementor-image-gallery .gallery-item { margin: 0 !important; padding: 0 !important; width: auto !important; max-width: none !important; }
.elementor-image-gallery .gallery-item img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; height: auto; display: block; border-radius: 0 !important; box-shadow: none !important; }
.elementor-image-gallery .gallery-columns-4 { grid-template-columns: repeat(4, 1fr); }
.elementor-image-gallery .gallery-columns-2 { grid-template-columns: repeat(2, 1fr); }
.elementor-image-gallery .gallery-columns-1 { grid-template-columns: 1fr; }
.dk-gal-h.elementor-widget-image-gallery .gallery-item img { aspect-ratio: 3 / 2; }
.elementor-widget-image-gallery:not(.dk-gal-h) .gallery-columns-2 { max-width: 800px; }
@media (max-width: 767px) {
	.elementor-image-gallery .gallery { grid-template-columns: repeat(2, 1fr); gap: 6px; }
	.elementor-image-gallery .gallery-item:first-child:nth-last-child(odd) { grid-column: 1 / -1; }
	.elementor-image-gallery .gallery-item:first-child:nth-last-child(odd) img { aspect-ratio: 3 / 2; object-position: 50% 30%; }
}

/* ===== LeVisa (9-oct-2026): fotos en arco, tarjetas de rituales, rejilla de servicios con foto ===== */
.dk-eyebrow p { font-family: var(--dk-titulos); font-style: normal; font-size: 21px; font-weight: 500; letter-spacing: .01em; margin: 0; }   /* sin mayusculas (DISENO.md, revision contra lo generico). Normal, no cursiva, desde el 17-oct: la cursiva era un archivo de fuente mas que llegaba tarde y movia el hero (CLS 0,019) */
.dk-eyebrow p::before { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-right: 12px; }
.elementor-widget-heading .elementor-heading-title { text-wrap: balance; }

/* fotos verticales del local en arco: lo memorable de la marca */
.dk-arco img { width: 100%; aspect-ratio: 4 / 5.4; object-fit: cover; border-radius: 999px 999px 18px 18px; display: block; }
.dk-arco-bajo img { aspect-ratio: 4 / 5; }
.dk-arco-ancho img { aspect-ratio: 4 / 4.4; max-width: 460px; margin-inline: auto; }
/* fotos en arco fuera del hero: tamano contenido para que no dominen la seccion */
.dk-arco:not(.dk-hero .dk-arco) img { max-width: 440px; margin-inline: auto; }
.dk-hero-fotos .dk-arco-bajo { margin-bottom: 48px; }
.dk-hero .dk-arco img { box-shadow: 0 30px 60px -30px rgb(0 0 0 / .55); }

/* tarjetas de rituales */
.dk-tarjeta { overflow: hidden; box-shadow: 0 20px 50px -30px rgb(58 40 72 / .35); transition: transform .25s ease, box-shadow .25s ease; }
.dk-tarjeta:hover { transform: translateY(-4px); box-shadow: 0 28px 60px -30px rgb(58 40 72 / .45); }
.dk-tarjeta-foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }

/* rejilla de servicios: foto arriba 3:2, sin iconos */
.dk-servicio .elementor-image-box-wrapper { text-align: left; }
.dk-servicio .elementor-image-box-img { width: 100% !important; margin: 0 0 18px !important; }
.dk-servicio .elementor-image-box-img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 16px; transition: transform .35s ease; }
.dk-servicio:hover .elementor-image-box-img img { transform: scale(1.02); }
.dk-servicio .elementor-image-box-title a { color: inherit; }

/* galeria del local (fotos verticales) */
.elementor-widget-image-gallery .gallery-item img { border-radius: 14px; }

@media (max-width: 767px) {
	.dk-hero-fotos { flex-direction: row !important; }
	.dk-hero-fotos > .e-con { width: 50% !important; }
	.dk-hero-fotos .dk-arco-bajo { margin-bottom: 24px; }
}

/* Reservas: widget de Square embebido (c-reservar.mjs). Nace a 500 px fijos con scroll interno: se le da altura aqui */
.dk-reservas iframe { width: 100% !important; height: 1150px !important; border: 0; border-radius: 16px; background: #FFFFFF; box-shadow: 0 20px 50px -30px rgb(58 40 72 / .35); }
@media (max-width: 767px) { .dk-reservas iframe { height: 1400px !important; border-radius: 0; } }

/* Movimiento: quieto y completo si el usuario lo pide (DISENO.md, principio 2) */
@media (prefers-reduced-motion: reduce) {
	.dk-tarjeta, .dk-servicio .elementor-image-box-img img { transition: none !important; }
	.dk-tarjeta:hover, .dk-servicio:hover .elementor-image-box-img img { transform: none !important; }
}

/* Reseñas de Google: los estilos van en el plugin DC Reviews (Kit-prospectos-web/plugins-propios/dc-reviews) */

/* ===== Formulario de admisión (Bit Form 5, página intake · 15-oct-2026) =====
   Bit Form escribe sus colores en su propio CSS (sin variables): aquí se reviste con la marca dentro de .dk-intake.
   Las opciones van como botones en línea (más cortas que en columna): por eso se quita la altura mínima de la rejilla. */
.dk-intake { --in-radio: 14px; }
.dk-intake .bf-form-wrapper {
	background: #fff; border: 1px solid var(--dk-linea); border-radius: 24px;
	padding: clamp(20px, 4vw, 44px); box-shadow: 0 24px 60px -36px rgb(58 40 72 / .35);
	font-family: var(--dk-cuerpo); color: var(--dk-texto); max-width: 880px; margin: 0 auto;
}
.dk-intake .btcd-fld-itm { min-height: 0 !important; }
.dk-intake .bf-fld-wrp { padding: 6px 0 !important; }
.dk-intake .bf-lbl { font-family: var(--dk-cuerpo) !important; font-size: 16px !important; font-weight: 500 !important; color: var(--dk-oscuro) !important; line-height: 1.4 !important; margin-bottom: 6px !important; }
.dk-intake .bf-req-smbl { color: var(--dk-primario) !important; }
.dk-intake .bf-fld, .dk-intake .bf-fld-wrp select, .dk-intake .bf-fld-wrp textarea, .dk-intake .bf-phone-fld-container {
	border: 1px solid var(--dk-linea) !important; border-radius: var(--in-radio) !important; background: #fff !important;
	font-family: var(--dk-cuerpo) !important; font-size: 16px !important; color: var(--dk-texto) !important; box-shadow: none !important;
}
.dk-intake input.bf-fld, .dk-intake select.bf-fld { min-height: 48px; padding: 10px 14px !important; }
.dk-intake textarea.bf-fld { padding: 12px 14px !important; }
.dk-intake .bf-fld:focus, .dk-intake .bf-fld-wrp select:focus, .dk-intake .bf-fld-wrp textarea:focus, .dk-intake .bf-phone-fld-container:focus-within {
	border-color: var(--dk-foco) !important; box-shadow: 0 0 0 3px rgb(133 98 168 / .18) !important; outline: none !important;
}
.dk-intake [class*="hlp-txt"] { font-style: normal !important; font-size: 13.5px !important; color: var(--dk-gris) !important; margin-top: 6px !important; }
/* Opciones (radio y casillas) como botones */
.dk-intake .bf-cc { display: flex !important; flex-wrap: wrap; gap: 10px; }
.dk-intake .bf-cw { margin: 0 !important; }
.dk-intake .bf-ci { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dk-intake .bf-cl {
	display: inline-flex !important; align-items: center; gap: 10px; margin: 0 !important; cursor: pointer;
	border: 1px solid var(--dk-linea); border-radius: 999px; padding: 10px 18px 10px 12px; background: #fff;
	font-size: 15px; color: var(--dk-texto); transition: border-color .15s, background-color .15s;
}
.dk-intake .bf-cl:hover { border-color: var(--dk-resalte); }
.dk-intake .bf-ci:checked + .bf-cl { border-color: var(--dk-primario); background: var(--dk-alterno); color: var(--dk-oscuro); }
.dk-intake .bf-ci:focus-visible + .bf-cl { outline: 2px solid var(--dk-foco); outline-offset: 2px; }
.dk-intake .bf-bx { border-color: var(--dk-resalte) !important; }
.dk-intake .bf-ci:checked + .bf-cl .bf-bx { background: var(--dk-primario) !important; border-color: var(--dk-primario) !important; }
/* Pasos y progreso */
/* Bit Form pinta el paso activo con 3 clases y carga despues: aqui hace falta mas especificidad */
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr ._frm-b-stp-hdr-icn-wrp { border-color: var(--dk-resalte) !important; background: transparent !important; }
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr ._frm-b-stp-icn-cntn { background: #fff !important; color: var(--dk-oscuro) !important; }
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr ._frm-b-stp-icn-cntn span { color: inherit !important; }
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr.active ._frm-b-stp-hdr-icn-wrp,
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr.completed ._frm-b-stp-hdr-icn-wrp { border-color: var(--dk-primario) !important; }
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr.active ._frm-b-stp-icn-cntn,
.dk-intake .bf-form-wrapper ._frm-b-stp-hdr.completed ._frm-b-stp-icn-cntn { background: var(--dk-primario) !important; color: #fff !important; }
/* Separacion entre campos lado a lado (rejilla de 60 columnas sin hueco) */
.dk-intake ._frm-b { margin-inline: -8px; }
.dk-intake ._frm-b > .btcd-fld-itm { padding-inline: 8px; }
.dk-intake [class*="-stp-hdr-lbl"] { font-family: var(--dk-cuerpo) !important; font-weight: 500 !important; color: var(--dk-oscuro) !important; }
.dk-intake [class*="-stp-hdr-sub-titl"] { color: var(--dk-gris) !important; }
.dk-intake [class*="-stp-progress-bar"] { background: var(--dk-linea) !important; border-radius: 99px !important; height: 6px !important; overflow: hidden; font-size: 0 !important; }
.dk-intake [class*="progress-fill"] { background: var(--dk-marca) !important; border-radius: 99px !important; font-size: 0 !important; }
@media (max-width: 767px) { .dk-intake [class*="-stp-hdr-sub-titl"] { display: none !important; } }
/* Botones */
.dk-intake .next-step-btn, .dk-intake .prev-step-btn, .dk-intake .bf-button {
	font-family: var(--dk-cuerpo) !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: .02em;
	border-radius: 999px !important; padding: 14px 30px !important; box-shadow: none !important; border: 1px solid var(--dk-primario) !important;
}
.dk-intake .next-step-btn, .dk-intake .bf-button { background: var(--dk-primario) !important; color: #fff !important; }
.dk-intake .next-step-btn:hover, .dk-intake .bf-button:hover { background: var(--dk-primario-hover) !important; border-color: var(--dk-primario-hover) !important; }
.dk-intake .prev-step-btn { background: transparent !important; color: var(--dk-primario) !important; }
.dk-intake .prev-step-btn:hover { background: var(--dk-alterno) !important; }
/* Títulos de bloque, aviso de privacidad, acuerdo y firma */
.dk-intake .bf-fld-wrp h3 { font-family: var(--dk-titulos); font-size: 30px; font-weight: 600; color: var(--dk-oscuro); border-top: 1px solid var(--dk-linea); padding-top: 18px; }
.dk-intake details summary { color: var(--dk-primario); }
.dk-intake details li { margin: 0 0 6px; font-size: 14.5px; line-height: 1.55; }
.dk-intake [class*="signature-pad"], .dk-intake canvas { border: 1px dashed var(--dk-resalte) !important; border-radius: var(--in-radio) !important; background: #fff !important; }
.dk-intake .bf-clr-btn, .dk-intake [class*="undo-btn"], .dk-intake [class*="redo-btn"] { background: transparent !important; color: var(--dk-primario) !important; border: 1px solid var(--dk-linea) !important; border-radius: 999px !important; }
/* La × del mensaje de exito: el tema pinta todos los button de marron y quedaba un ovalo suelto bajo el formulario */
.dk-intake .bf-msg-close { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; min-width: 0 !important; width: 32px !important; height: 32px !important; color: var(--dk-oscuro) !important; }
/* Mensaje de exito: oculto mientras no se envia (Bit Form lo deja en la pagina con la clase "deactive").
   Al enviar, ventana centrada sobre fondo oscurecido. Bit Form no genera estilos para el mensaje de un formulario
   importado, asi que la ventana entera se define aqui. */
.dk-intake [class*="msg-container"].deactive { display: none !important; }
.dk-intake [class*="msg-container"]:not(.deactive) {
	position: fixed !important; inset: 0 !important; z-index: 99999 !important; display: flex !important;
	align-items: center; justify-content: center; padding: 20px; background: rgb(42 28 53 / .55) !important;
	animation: dk-intake-fundido .25s ease-out;
}
.dk-intake [class*="msg-container"]:not(.deactive) .msg-backdrop { display: contents !important; }
.dk-intake [class*="msg-container"]:not(.deactive) .bf-msg-content {
	position: relative !important; width: min(460px, 100%) !important; max-width: 100% !important; margin: 0 !important;
	background: #fff !important; color: var(--dk-texto) !important; border: 1px solid var(--dk-linea) !important;
	border-radius: 22px !important; padding: 38px 34px 32px !important; box-shadow: 0 30px 80px -30px rgb(42 28 53 / .55) !important;
	font-family: var(--dk-cuerpo); font-size: 16px; line-height: 1.6; text-align: center;
}
.dk-intake [class*="msg-container"]:not(.deactive) .bf-msg-content::before {
	content: ""; display: block; width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 50%;
	background: var(--dk-alterno) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A6A47' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 28px no-repeat;
}
.dk-intake [class*="msg-container"]:not(.deactive) .bf-msg-close { position: absolute !important; top: 12px; right: 12px; color: var(--dk-gris) !important; }
.dk-intake .bf-msg-close svg { width: 18px !important; height: 18px !important; }
/* Tras enviar (script de la pagina): el formulario de detras desaparece */
.dk-intake--enviado .bf-form-wrapper > form { visibility: hidden !important; }
@keyframes dk-intake-fundido { from { opacity: 0; } to { opacity: 1; } }
/* Ultimo paso: "Previous" a la izquierda y "Submit" a la derecha, en la misma fila */
.dk-intake .btcd-fld-itm:has(.bf-button) .bf-inp-wrp, .dk-intake .btcd-fld-itm:has(.bf-button) > div { display: flex !important; justify-content: flex-end; }
.dk-intake [role="tabpanel"]:last-of-type [class*="stp-btn-wrpr"] { margin-top: -66px; pointer-events: none; }
.dk-intake [role="tabpanel"]:last-of-type [class*="stp-btn-wrpr"] button { pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .dk-intake .bf-cl { transition: none; } .dk-intake [class*="msg-container"] { animation: none !important; } }