/* Ajustes para que el WordPress con Kadence se vea IGUAL que la maqueta aprobada.
   Orden de carga: style.css, maqueta.css, sueltos.css, wordpress.css y esta hoja; todas se vuelven a
   enlazar al pie, después del CSS de bloques que WordPress imprime ahí, así el tema manda en los
   empates igual que en la maqueta. Cada bloque dice qué regla de la maqueta replica; los números son
   los medidos allá (radiografia.js y pixeles.js). */

/* ═══ Cabecera (constructor de Kadence) = header.wp-block-template-part de la maqueta ═══════════ */
.site-header{box-shadow:0 1px 8px rgba(0,0,0,.05)}
.site-header .site-header-row-container-inner,.site-header .site-container,.site-header .site-header-row,.site-header .site-header-section{overflow:visible}
/* Logo, nombre y bajada (.ciet-logo): logo de 44 px, 11 px de separación, textos en una caja de 60 px
   pegada arriba (nombre 44 px + bajada 16 px). */
.site-branding a.brand{gap:11px;align-items:center}
.site-branding a.brand img{height:44px;width:auto}
.site-branding .site-title-wrap{min-height:60px;display:flex;flex-direction:column;justify-content:flex-start}
.site-branding .site-title{margin:0;min-height:44px;display:flex;align-items:center;font-size:20px;line-height:1.1;font-weight:850;letter-spacing:-.4px;color:#16212b}
.site-branding .site-description{margin:0;font-size:12.5px;line-height:1.3;font-weight:600;letter-spacing:0;text-transform:none;color:#5b6975}
/* Bajo 1440 px la maqueta esconde la bajada (con ocho entradas el menú no cabe junto al bloque del logo completo). */
@media (max-width:1439px){.site-branding .site-description{display:none}}
/* Menú (.ciet-nav a): 14,5 px negrita 600, relleno 10×11, esquinas 7, alto 44, 5 px entre ítems.
   Desde 1440 px el bloque de menú de la maqueta desborda 79 px por la derecha (400 + 24 + 835 > 1180): se replica.
   Entre 1200 y 1439 px cabe (265 + 24 + 835 < 1180) y bajo 1200 px va el menú de teléfono (header_mobile_switch). */
.site-header .site-header-section > .site-header-item{margin-right:5px}
.site-header .site-header-section > .site-header-item:last-child{margin-right:0}
@media (min-width:1440px){.site-header .site-header-main-section-right{margin-right:-79px}}
.site-header .header-navigation .header-menu-container > ul.menu{display:flex;flex-wrap:nowrap;gap:5px;margin:0;padding:0;list-style:none}
.site-header .header-navigation .header-menu-container > ul.menu > li{margin:0;padding:0;display:flex;align-items:center}
.site-header .header-navigation .header-menu-container > ul.menu > li > a{padding:10px 11px;min-height:44px;height:auto;box-sizing:border-box;border-radius:7px;font-size:14.5px;line-height:23.925px;font-weight:600;color:#4a5964;text-decoration:none;white-space:nowrap;display:flex;align-items:center;background:transparent}
.site-header .header-navigation .header-menu-container > ul.menu > li > a:hover{background:#f4f7f8;color:#c8352c}
.site-header .header-navigation .header-menu-container > ul.menu > li > a::after{display:none}
.site-header .header-button{white-space:nowrap}
/* Móvil (≤768 px): logo de 38 px, nombre de 17 px, sin bajada; botón del menú de 44×44 con el ícono
   de dos líneas de 24 px de WordPress (el de la maqueta). */
@media (max-width:768px){
  .site-branding a.brand img{height:38px}
  .site-branding .site-title-wrap{min-height:44px}
  .site-branding .site-title{font-size:17px}
}
.mobile-toggle-open-container .menu-toggle-open{width:44px;height:44px;padding:10px;margin:0;border:0;justify-content:center;color:#4a5964;background:transparent;box-shadow:none}
.menu-toggle-open .menu-toggle-icon{width:24px;height:24px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234a5964'%3E%3Cpath d='M4 7.5h16v1.5H4z'/%3E%3Cpath d='M4 15h16v1.5H4z'/%3E%3C/svg%3E") center/24px 24px no-repeat}
.menu-toggle-open .menu-toggle-icon svg,.menu-toggle-open .menu-toggle-label{display:none}

/* Video del dron de fondo en la portada: ciet.js le quita el src en el teléfono y con «reducir movimiento», y queda la
   foto de póster, que cubre la fila igual que la imagen de la maqueta. */
.ciet-hero .kb-blocks-bg-video{object-fit:cover}

/* ═══ Pie (constructor de Kadence) = footer.wp-block-template-part ═════════════════════════════
   Las tres columnas llevan los mismos bloques que el pie de la maqueta (título, párrafo, menú), así
   sus reglas («footer h3», «footer .wp-block-navigation-item», «p.has-gris-color a»…) aplican igual. */
.site-footer{font-size:14.5px}
.site-footer .widget{margin:0;padding:0}
.site-footer .widget > * + *,.site-footer .widget .widget-content > * + *{margin-block-start:24px}   /* la columna de la maqueta es «flow»: 24 px entre bloques */
.site-footer .widget > :first-child,.site-footer .widget .widget-content > :first-child{margin-block-start:0}
.site-footer .widget p,.site-footer .widget h3{margin-block-end:0}
.site-middle-footer-inner-wrap{column-gap:30px;row-gap:30px}
.site-footer .wp-block-navigation-item__content{line-height:23.925px}          /* Kadence le pone 1.8 a los enlaces del pie */
.site-footer .widget p a{color:#93a5b1}                                         /* footer a{color:#93a5b1} de la maqueta */
.site-footer .widget p a:hover{color:#fff}
/* Logo en negativo en la primera columna (= footer figure.ciet-pie-logo de la maqueta) */
.site-footer .widget .ciet-pie-logo{margin:0}
.site-footer .ciet-pie-logo a{display:inline-block}
.site-footer .ciet-pie-logo img{height:64px;width:auto;display:block}
/* Línea y año: el separador de la maqueta (2 px, gris al 12 %), 24 px hasta el ©, 34 px abajo */
.site-footer .site-bottom-footer-inner-wrap{border-top:2px solid rgba(74,89,100,.12);padding:24px 0 34px;min-height:0}
.site-footer .footer-html,.site-footer .footer-html p{margin:0}
/* Entre cabecera, contenido y pie no va espacio (son hijos de .wp-site-blocks y WordPress les pondría
   el espaciado entre bloques). */
.site.wp-site-blocks > *{margin-block-start:0;margin-block-end:0}

/* ═══ Modelo de caja como en la maqueta ═════════════════════════════════════════════════════════
   Kadence hereda border-box a todo; en la maqueta solo los bloques de WordPress son border-box y los
   divs sueltos miden sin relleno (content-box). Lo que allá era un div suelto vuelve a content-box. */
.ciet-libre,
.ciet-libre :where(div,span,figure,figcaption,ul,ol,li,b,em,i,small,a,label):not([class*="wp-block"]):not([class*="kb-"]):not([class*="kt-"]):not(.mb-planta),
.ciet-busc,.ciet-busc :where(div,span,label,b,em,small,p,i),
.ciet-ordbar,.ciet-ordbar :where(div,span,label),
.ciet-mapa,.ciet-mapa :where(div,span,b,em),
.mb-hero-fig,.mb-hero-fig figcaption,
.v3-ic,
#ciet-contacto,#ciet-contacto :where(div,label,p){box-sizing:content-box}
.mb-planta{box-sizing:border-box}
/* Kadence le da su estilo a todo <button>, <input>, <select> y <textarea>. Los componentes propios de
   CIET vuelven al estilo base del navegador, como en la maqueta, y ahí aplican sus reglas. */
:where(.ciet-busc, .ciet-ordbar, .ciet-form, .ciet-cot, .ciet-mapa) :is(button, input, select, textarea){all:revert}
.ciet-form select,.ciet-cot select{-webkit-appearance:auto;appearance:auto}
.ciet-form button[type=submit],.ciet-cot button,.ciet-form input,.ciet-form select,.ciet-form textarea,.ciet-cot input,.ciet-cot textarea{line-height:normal}
.ciet-busc input[type=range]{-webkit-appearance:auto;appearance:auto;border:0;border-radius:0;padding:0;background:transparent;box-shadow:none;width:100%}
/* Cabecera de la tabla de precios: la línea de 3 px bajo los títulos toma el color del texto (#4a5964),
   como en la maqueta (Kadence le pone su gris claro). */
.ciet-tabla thead{border-bottom-color:#4a5964}
.ciet-form input,.ciet-form select,.ciet-form textarea{box-shadow:none}

/* ═══ Secciones (filas de Kadence) ═════════════════════════════════════════════════════════════ */
/* Cifras de mini bodegas y construcción: el relleno (34 px arriba y abajo, 0 a los lados) va en la fila,
   editable; la regla «.mb-cifras{padding:34px 0 !important}» de la maqueta no debe sumarse en el contenedor. */
.kb-row-layout-wrap.mb-cifras,.kb-row-layout-wrap.cm-cifras{padding:0!important}
/* Comparativa «Lo que hacemos siempre / Si se libera una bodega»: la clase queda en la fila; el reparto
   de columnas lo hace la fila, así que el contenedor deja de ser flex. */
.kb-row-layout-wrap.ciet-comp{display:block}
/* Cifras y precios: en la maqueta son divs con el texto directo; en WordPress el texto va en un párrafo
   editable dentro del div, sin margen propio. */
.ciet-libre > p.ciet-texto{margin:0}
/* Títulos dentro de contenedores propios de la maqueta: los márgenes del navegador que tenían allá. */
.ciet-libre > h1.wp-block-kadence-advancedheading{margin-block:.67em}
.ciet-libre > h2.wp-block-kadence-advancedheading{margin-block:.83em}
.ciet-libre > h3.wp-block-kadence-advancedheading{margin-block:1em}
.ciet-libre > h4.wp-block-kadence-advancedheading{margin-block:1.33em}
@media (max-width:640px){.ciet-form > h3.wp-block-kadence-advancedheading{margin:0 0 4px}}
/* Mini bodegas (diseño aprobado el 5-oct): las secciones .p2 llevan su relleno lateral (Kadence pone
   padding 0 a todo .alignfull) y sus títulos no llevan los márgenes de navegador de los grupos libres. */
.entry-content .p2.alignfull{padding-left:24px;padding-right:24px}
@media (max-width:781px){.entry-content .p2.alignfull{padding-left:20px;padding-right:20px}}
.p2 .ciet-libre > :is(h1,h2,h3,h4).wp-block-kadence-advancedheading{margin-block:0}
/* El diseño nuevo mide todo en border-box (la regla de arriba devuelve content-box a los grupos libres) y la figura
   de la portada es un bloque de imagen del núcleo, que trae márgenes propios: se anulan. */
.entry-content .p2,.entry-content .p2 *,.entry-content .p2 *::before,.entry-content .p2 *::after{box-sizing:border-box !important}
.p2 figure.wp-block-image{margin:0}
.p2 figure.wp-block-image > figcaption.wp-element-caption{margin:12px 0 0;font-size:13.5px;line-height:1.45;color:#9fb0bc;text-align:left}
/* Botones de Kadence: en los heros de mini bodegas y construcción van a la izquierda; en el celular
   con texto que se parte (reglas .wp-block-buttons de la maqueta). */
.mb-hero-k .kb-buttons-wrap,.cm-hero-k .kb-buttons-wrap{justify-content:flex-start!important}
@media (max-width:781px){.kb-button{white-space:normal;text-align:center;max-width:100%}}
/* Tablas sin el margen inferior que agrega Kadence; pies de la galería sin margen y a la izquierda. */
.ciet-contenido .wp-block-table > table{margin-bottom:0}
.v3-galeria .wp-element-caption{margin:0;text-align:left}
/* La planta del contenedor del hero de mini bodegas: el margen de la maqueta. */
.mb-hero-fig{margin:0 0 17px}

/* ═══ Franja con foto (.v3-banda de la maqueta) → fila «v3-banda-k» con la foto editable ═══════
   Replica «.v3-banda{position:relative;min-height:320px;display:flex;align-items:center}» y, en el
   celular, «min-height:300px;align-items:flex-end». El degradado lo pone la capa de la fila. */
.v3-banda-k{position:relative;min-height:320px;display:flex;align-items:center}
.v3-banda-k > .kt-row-column-wrap{width:100%}
.v3-banda-k .kt-inside-inner-col{display:flex;flex-direction:row}   /* la caja de texto es ítem flex y se encoge en el celular, como en la maqueta */
.v3-banda-k .v3-banda__in{width:100%;max-width:1180px;margin:0 auto;padding:44px 24px;box-sizing:content-box}
@media (max-width:781px){
  .v3-banda-k{min-height:300px;align-items:flex-end}
  .v3-banda-k > .kt-row-column-wrap{align-content:flex-end!important}
}

/* ═══ Heros interiores (.v3-hero de la maqueta) → «v3-hero-k», con la foto editable ══════════════
   La regla de fondo de la maqueta para .v3-hero taparía la foto; aquí va el resto de su diseño. */
.v3-hero-k{position:relative;color:#fff}
.v3-hero-k h1,.v3-hero-k h2,.v3-hero-k strong{color:#fff!important}
.v3-hero-k .ciet-eyebrow{color:#ff9c92!important}
.v3-hero-k p:not(.ciet-eyebrow),.v3-hero-k .ciet-sd{color:#d3dce3!important}
.v3-hero-k h1{letter-spacing:-.02em!important}
/* Enlaces dentro de una portada oscura: el rojo de la marca sobre tinta no llega a 4,5:1 (revisión del 5-oct). */
.v3-hero-k a:not(.kb-button):not(.wp-block-button__link){color:#ffc4bd!important;text-decoration:underline;text-underline-offset:3px}
.v3-hero-k a:not(.kb-button):not(.wp-block-button__link):hover{color:#fff!important}
/* Hero de construcción a medida (.cm-hero) → «cm-hero-k» */
.cm-hero-k{color:#fff;position:relative;overflow:hidden}
.cm-hero-k .ciet-eyebrow{color:#ff9c92;text-align:left}
.cm-hero-k h1{color:#fff;text-align:left!important;letter-spacing:-1.3px;max-width:17ch}
.cm-hero-k .ciet-sd{color:#c3ccd6;text-align:left!important;max-width:56ch;margin-left:0}
.cm-hero-k .cm-gancho{border-left:4px solid #c8352c;padding:4px 0 4px 20px;margin:0 0 26px;font-size:19px;line-height:1.55;color:#fff;max-width:56ch}
.cm-hero-k .cm-gancho b{color:#ff9c92}
.cm-hero-k h1{letter-spacing:-.02em!important}

/* ═══ Hero de mini bodegas (.mb-hero) → «mb-hero-k» ════════════════════════════════════════════ */
.mb-hero-k{color:#fff;position:relative;overflow:hidden}
.mb-hero-k .ciet-eyebrow{color:#ff9c92; text-align:left}
.mb-hero-k h1{color:#fff; text-align:left !important;
  font-size:clamp(30px,4.2vw,46px) !important; line-height:1.06; letter-spacing:-1.4px;
  max-width:16ch;}
.mb-hero-k .ciet-sd{color:#c3ccd6; text-align:left !important; max-width:52ch; margin-left:0}
.mb-hero-k .wp-block-buttons{justify-content:flex-start !important}
.mb-hero-k .mq-p{text-align:left}
.mb-hero-k .mb-hero-rej{max-width:1180px !important; width:100%; margin-left:auto; margin-right:auto}
@media(min-width:900px){.mb-hero-k .mb-hero-rej{grid-template-columns:minmax(0,1fr) 290px}}
.mb-hero-k .mb-hero-rej > div{min-width:0}
.mb-hero-k .ciet-sd{margin-left:0!important}
.ciet-hero h1,.v3-hero h1,.mb-hero-k h1,.cm-hero h1{letter-spacing:-.02em!important}

/* ═══ Preguntas frecuentes (acordeón de Kadence) ═══════════════════════════════════════════════
   Con tarjetas, como «.ciet-faq .wp-block-details» de la maqueta; la variante «plano» replica las
   preguntas que en la maqueta van sin tarjeta (filas sueltas de 36 px). */
.ciet-acordeon{max-width:760px;margin-left:auto;margin-right:auto}
.ciet-acordeon .kt-accordion-inner-wrap{display:block}
.ciet-acordeon .kt-accordion-pane{background:#fff;border:1px solid #dde4e8;border-radius:12px;padding:18px 22px;margin:0 0 24px}
.ciet-acordeon .kt-accordion-pane:last-child{margin-bottom:12px}
.ciet-acordeon .kt-blocks-accordion-header{background:none!important;border:0!important;padding:0!important;color:#4a5964!important;font-weight:750;font-size:16.5px;line-height:1.65;min-height:0;text-align:left;display:flex!important;justify-content:space-between;align-items:center;gap:14px}
.ciet-acordeon .kt-blocks-accordion-title-wrap{padding:0!important;margin:0!important;flex:1 1 auto;min-width:0}
.ciet-acordeon .kt-blocks-accordion-title{font-weight:750}
.ciet-acordeon .kt-blocks-accordion-icon-trigger{display:none!important}
.ciet-acordeon .kt-blocks-accordion-header::after{content:"+";font-size:22px;font-weight:400;color:#c8352c;flex-shrink:0;line-height:1.65}   /* 22 × 1,65 = 36,3 px de alto, como el summary de la maqueta */
.ciet-acordeon .kt-blocks-accordion-header.kt-accordion-panel-active::after{content:"–"}
.ciet-acordeon .kt-accordion-panel-inner{padding:0!important;border:0!important;background:none!important}
.ciet-acordeon .kt-accordion-panel-inner p{margin:11px 0 0;font-size:15px;line-height:1.6;color:#4a5964;max-width:66ch}
.ciet-acordeon--plano .kt-accordion-pane{background:none;border:0;border-radius:0;padding:0;margin:0}
.ciet-acordeon--plano .kt-accordion-pane:last-child{margin-bottom:0}
.ciet-acordeon--plano .kt-accordion-panel-inner p{margin:0;font-size:17px;line-height:1.65;color:#4a5964}

/* ── Barra de cifras de la portada (seis datos, 22-sep-2026) ───────────────
   En la maqueta la fila es .wp-block-columns; acá es una fila de Kadence, así que los
   separadores y el cierre contra la franja con foto se escriben con las clases de Kadence. */
.ciet-cifras + .v3-banda-k{margin-block-start:0}
.ciet-cifras-rej > .kt-row-column-wrap > .wp-block-kadence-column{position:relative}
.ciet-cifras-rej > .kt-row-column-wrap > .wp-block-kadence-column + .wp-block-kadence-column::before{content:"";position:absolute;left:-11.5px;top:0;bottom:0;width:1px;background:rgba(255,255,255,.14)}
@media (max-width:1024px){
  .ciet-cifras-rej > .kt-row-column-wrap > .wp-block-kadence-column:nth-child(3n+1)::before{display:none}
}
@media (max-width:767px){
  .ciet-cifras-rej > .kt-row-column-wrap > .wp-block-kadence-column:nth-child(odd)::before{display:none}
  .ciet-cifras-rej > .kt-row-column-wrap > .wp-block-kadence-column:nth-child(even)::before{display:block}
}
