/*
 * CBTI Widgets · página "Sobre CBTI" (ruta about del diseño "Web CBTI v3").
 * Valores tomados de los estilos en línea del diseño; los tokens viven en cbti-design.css del tema.
 * line-height: normal / color: inherit en títulos = valor computado del diseño (Woostify no debe pisarlo).
 */

/* ---------- Bloques oscuros (portada, pilares, contacto) ---------- */
.cbtiw-sobre-dark { background: var(--surface-inverse); color: var(--text-on-dark); }
.cbtiw-sobre-dark__in { max-width: var(--container); margin: 0 auto; padding: var(--space-20) var(--space-6); }
.cbtiw-sobre-display { margin: var(--space-6) 0 0; font-family: var(--font-display); font-size: var(--text-display-2); font-weight: var(--weight-black); line-height: var(--leading-snug); letter-spacing: var(--tracking-display); color: inherit; }
.cbtiw-sobre-hero__title { max-width: 900px; }
.cbtiw-sobre-hero__lead { margin: var(--space-6) 0 0; max-width: var(--container-narrow); font-size: var(--text-body-lg); line-height: var(--leading-body); color: var(--text-on-dark-muted); }
.cbtiw-sobre-contact { scroll-margin-top: 72px; }
.cbti-sh__title.cbtiw-sobre-on-dark { color: var(--text-on-dark); }
.cbti-sh__sub.cbtiw-sobre-on-dark-muted { color: var(--text-on-dark-muted); }

/* ---------- Bandas y rejillas ---------- */
.cbtiw-sobre-band { background: var(--surface-subtle); border-top: 1px solid var(--border-subtle); }
.cbtiw-sobre-compact { max-width: var(--container); margin: 0 auto; padding: var(--section-y-compact) var(--space-6); }
.cbtiw-sobre-grid300 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: var(--space-5); }
.cbtiw-sobre-grid240 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: var(--space-5); margin-top: var(--space-10); }
.cbtiw-sobre-grid240--wide { margin-top: var(--space-12); }
.cbtiw-sobre-grid230 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: var(--space-5); margin-top: var(--space-10); }
.cbtiw-sobre-grid200 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: var(--space-5); margin-top: var(--space-10); }

/* ---------- Piezas de tarjeta ---------- */
.cbtiw-sobre-accent { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; }
.cbtiw-sobre-kicker { font-size: var(--text-eyebrow); font-weight: var(--weight-bold); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
.cbtiw-sobre-accent-ink { color: var(--accent-strong); }
.cbtiw-sobre-purpose__p { margin: var(--space-5) 0 0; font-family: var(--font-display); font-size: var(--text-h3); font-weight: var(--weight-semibold); line-height: var(--leading-heading); color: var(--text-strong); text-wrap: pretty; }
.cbtiw-sobre-num { font-family: var(--font-mono); font-size: var(--text-caption); font-weight: var(--weight-semibold); color: var(--accent-strong); }
.cbtiw-sobre-h4 { margin: 0; font-family: var(--font-display); font-size: var(--text-h4); font-weight: var(--weight-bold); line-height: normal; color: var(--text-strong); }
.cbtiw-sobre-mt4 { margin-top: var(--space-4); }
.cbtiw-sobre-mt5 { margin-top: var(--space-5); }
.cbtiw-sobre-p { margin: var(--space-3) 0 0; font-size: var(--text-body-sm); line-height: var(--leading-body); color: var(--text-muted); }

/* ---------- Quiénes somos, misión, visión y valores ---------- */
/* [DERIVADO] Bloque nuevo (presentación · Bloque 2 y Valores): encabezado a la izquierda, párrafos a la derecha. */
.cbtiw-sobre-who { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6) var(--space-16); align-items: start; margin-bottom: var(--space-12); }
.cbtiw-sobre-who__body { display: flex; flex-direction: column; gap: var(--space-4); }
.cbtiw-sobre-who__p { margin: 0; font-size: var(--text-body-lg); line-height: var(--leading-body); color: var(--text-body); text-wrap: pretty; }
.cbtiw-sobre-who__p:last-child { color: var(--text-strong); font-weight: var(--weight-semibold); }
.cbtiw-sobre-purpose__more { margin: var(--space-4) 0 0; font-size: var(--text-body); line-height: var(--leading-body); color: var(--text-muted); text-wrap: pretty; }
.cbtiw-sobre-values { margin-top: var(--space-5); padding: var(--space-8); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); background: var(--surface-subtle); }
.cbtiw-sobre-values__list { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-6); }
@media (max-width: 1100px) { .cbtiw-sobre-values__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .cbtiw-sobre-values__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); } }
.cbtiw-sobre-value { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; }
.cbtiw-sobre-value__bar { width: 32px; height: 4px; border-radius: var(--radius-xs); }
.cbtiw-sobre-value__t { font-family: var(--font-display); font-size: var(--text-h4); font-weight: var(--weight-bold); line-height: var(--leading-heading); color: var(--text-strong); text-wrap: pretty; }
@media (max-width: 900px) {
	.cbtiw-sobre-who { grid-template-columns: minmax(0, 1fr); margin-bottom: var(--space-10); }
	.cbtiw-sobre-values { padding: var(--space-6); }
}

/* ---------- Pilares ---------- */
.cbtiw-sobre-pillar { padding: var(--space-6); border: 1px solid var(--border-on-dark); border-radius: var(--radius-md); background: var(--glass-on-dark); }
.cbtiw-sobre-pillar__bar { width: 40px; height: 4px; }
.cbtiw-sobre-pillar__t { margin: var(--space-5) 0 0; font-family: var(--font-display); font-size: var(--text-h3); font-weight: var(--weight-bold); line-height: normal; color: inherit; }
.cbtiw-sobre-pillar__p { margin: var(--space-3) 0 0; font-size: var(--text-body-sm); line-height: var(--leading-body); color: var(--text-on-dark-muted); }

/* ---------- Directorio ---------- */
.cbtiw-sobre-avatar { height: 104px; display: flex; align-items: center; justify-content: center; background: var(--grad-navy); color: #fff; font-family: var(--font-display); font-weight: 900; font-size: 2.4rem; letter-spacing: 0.02em; }
.cbtiw-sobre-person { padding: var(--space-5); }
.cbtiw-sobre-person__n { margin-top: var(--space-3); font-family: var(--font-display); font-size: var(--text-h4); font-weight: var(--weight-bold); color: var(--text-strong); }
.cbtiw-sobre-person__o { margin-top: 6px; font-size: var(--text-caption); color: var(--text-muted); }
/* [DERIVADO] Pedido del lead (25/10/2026): foto (cubre la cabecera; sin foto, las iniciales), LinkedIn solo si hay URL
   y hasta 3 empresas en una fila bajo el nombre: logo de alto uniforme (opcional) + nombre siempre visible. */
.cbtiw-sobre-avatar--photo { padding: 0; overflow: hidden; background: var(--grey-100); }
.cbtiw-sobre-avatar--photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.cbtiw-sobre-person__n { display: flex; align-items: center; gap: 8px; }
.cbtiw-sobre-person__n > span { min-width: 0; overflow-wrap: anywhere; }
a.cbtiw-sobre-person__in { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--navy-600) !important; border-radius: var(--radius-xs); }
a.cbtiw-sobre-person__in:hover { color: var(--accent-strong) !important; }
.cbtiw-sobre-cos { list-style: none; margin: var(--space-4) 0 0; padding: var(--space-3) 0 0; border-top: 1px solid var(--border-subtle); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.cbtiw-sobre-cos > li { margin: 0; min-width: 0; max-width: 100%; }
.cbtiw-sobre-co { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; font-size: var(--text-caption); font-weight: var(--weight-semibold); line-height: 1.3; color: var(--text-strong); text-decoration: none; }
a.cbtiw-sobre-co { color: var(--accent-strong) !important; }
a.cbtiw-sobre-co:hover .cbtiw-sobre-co__n { text-decoration: underline; text-underline-offset: 3px; }
.cbtiw-sobre-co__n { min-width: 0; overflow-wrap: anywhere; }
.cbtiw-sobre-co__logo { display: inline-flex; align-items: center; flex: 0 0 auto; height: 24px; max-width: 72px; }
.cbtiw-sobre-co__logo img { display: block; width: auto; height: 24px; max-width: 72px; object-fit: contain; }
a.cbtiw-sobre-person__in:focus-visible, a.cbtiw-sobre-co:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-xs); }

/* ---------- Trayectoria e hitos ---------- */
/* [DERIVADO] Opción A del análisis (§5.1): eje vertical por etapas; rango a la izquierda y texto a la derecha.
   --tl-w: ancho de la columna del rango; --tl-gap: separación a cada lado del eje. */
.cbtiw-sobre-tl { --tl-w: 168px; --tl-gap: var(--space-8); position: relative; list-style: none; margin: var(--space-12) 0 0; padding: 0; }
.cbtiw-sobre-tl::before { content: ""; position: absolute; top: 10px; bottom: 0; left: calc(var(--tl-w) + var(--tl-gap)); width: 2px; margin-left: -1px; background: var(--navy-200); }
.cbtiw-sobre-tl__item { position: relative; display: grid; grid-template-columns: var(--tl-w) minmax(0, 1fr); column-gap: calc(var(--tl-gap) * 2); margin: 0; padding: 0 0 var(--space-10); }
.cbtiw-sobre-tl__item::before { content: ""; position: absolute; z-index: 1; top: 5px; left: calc(var(--tl-w) + var(--tl-gap) - 7px); width: 14px; height: 14px; box-sizing: border-box; border: 3px solid var(--navy-600); border-radius: 50%; background: var(--surface-subtle); }
.cbtiw-sobre-tl__when { font-family: var(--font-mono); font-size: var(--text-h3); font-weight: var(--weight-semibold); line-height: 1.2; color: var(--navy-600); text-align: right; white-space: nowrap; }
.cbtiw-sobre-tl__body { max-width: 720px; }
.cbtiw-sobre-tl__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.cbtiw-sobre-tl__t { margin: 0; font-family: var(--font-display); font-size: var(--text-h3); font-weight: var(--weight-bold); line-height: var(--leading-heading); color: var(--text-strong); text-wrap: pretty; }
.cbtiw-sobre-tl__p { margin: var(--space-3) 0 0; font-size: var(--text-body); line-height: var(--leading-body); color: var(--text-muted); text-wrap: pretty; }
a.cbtiw-sobre-tl__tag { display: inline-flex; align-items: center; text-decoration: none; }
a.cbtiw-sobre-tl__tag .cbti-badge { gap: 6px; transition: background var(--dur-base) var(--ease-standard), color var(--dur-base) var(--ease-standard); }
a.cbtiw-sobre-tl__tag:hover .cbti-badge { background: var(--green-600); color: #fff; }
a.cbtiw-sobre-tl__tag:focus-visible { outline: none; }
a.cbtiw-sobre-tl__tag:focus-visible .cbti-badge { box-shadow: var(--focus-ring); }
/* Tramo final "Nueva etapa": punto lleno en verde y sus hitos en rejilla. */
.cbtiw-sobre-tl__item--now { padding-bottom: 0; }
.cbtiw-sobre-tl__item--now::before { border-color: var(--green-500); background: var(--green-500); box-shadow: 0 0 0 4px var(--green-050); }
.cbtiw-sobre-tl__item--now .cbtiw-sobre-tl__when { color: var(--green-600); }
.cbtiw-sobre-tl__item--now .cbtiw-sobre-tl__body { max-width: none; }
.cbtiw-sobre-tl__now { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: var(--space-5); margin-top: var(--space-6); }
/* El eje termina en el último punto. */
.cbtiw-sobre-tl__item:last-child::after { content: ""; position: absolute; top: 19px; bottom: 0; left: calc(var(--tl-w) + var(--tl-gap) - 2px); width: 4px; background: var(--surface-subtle); }

.cbtiw-sobre-milestone { display: flex; flex-direction: column; gap: var(--space-4); padding-top: var(--space-5); border-top: 3px solid var(--navy-200); }
.cbtiw-sobre-milestone__y { font-family: var(--font-mono); font-size: var(--text-h3); font-weight: var(--weight-semibold); color: var(--navy-600); }
.cbtiw-sobre-milestone__t { font-family: var(--font-display); font-size: var(--text-h4); font-weight: var(--weight-bold); color: var(--text-strong); }
.cbtiw-sobre-milestone__p { margin: 0; font-size: var(--text-body-sm); line-height: var(--leading-body); color: var(--text-muted); }

/* Líneas de trabajo y legado (presentación · Bloques 4 y 5), en la misma banda. */
.cbtiw-sobre-work, .cbtiw-sobre-legacy { margin-top: var(--space-16); padding-top: var(--space-12); border-top: 1px solid var(--border-subtle); }
.cbtiw-sobre-subhead { margin: 0; font-family: var(--font-display); font-size: var(--text-h1); font-weight: var(--weight-bold); line-height: var(--leading-snug); letter-spacing: var(--tracking-heading); color: var(--text-strong); text-wrap: balance; }
.cbtiw-sobre-sublead { margin: var(--space-4) 0 0; max-width: 780px; font-size: var(--text-body-lg); line-height: var(--leading-body); color: var(--text-muted); }
.cbtiw-sobre-work .cbtiw-sobre-grid240 { margin-top: var(--space-8); }
.cbtiw-sobre-legacy { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6) var(--space-16); align-items: start; }
.cbtiw-sobre-legacy__head { display: flex; flex-direction: column; gap: var(--space-4); }
.cbtiw-sobre-legacy__body { display: flex; flex-direction: column; gap: var(--space-4); }
.cbtiw-sobre-legacy__p { margin: 0; font-size: var(--text-body-lg); line-height: var(--leading-body); color: var(--text-body); text-wrap: pretty; }
.cbtiw-sobre-legacy__hl { position: relative; margin: var(--space-4) 0 0; padding-left: var(--space-6); font-family: var(--font-display); font-size: var(--text-h2); font-weight: var(--weight-semibold); line-height: var(--leading-heading); color: var(--text-strong); text-wrap: pretty; }
.cbtiw-sobre-legacy__hl::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: var(--rule-tricolor-w); border-radius: var(--radius-xs); background: var(--grad-tricolor); }

@media (max-width: 900px) {
	/* La etiqueta ALETI mide 40px táctiles; la pastilla visible sigue en 24px y el margen negativo no corre el título. */
	a.cbtiw-sobre-tl__tag { min-height: 40px; margin: -8px 0; }
	.cbtiw-sobre-legacy { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
	/* Una columna: eje a la izquierda, rango arriba del texto. */
	.cbtiw-sobre-tl { --tl-w: 0px; --tl-gap: 7px; }
	.cbtiw-sobre-tl__item { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-2); padding-left: var(--space-8); padding-bottom: var(--space-8); }
	.cbtiw-sobre-tl::before { left: 7px; }
	.cbtiw-sobre-tl__item::before { left: 0; top: 4px; }
	.cbtiw-sobre-tl__item:last-child::after { left: 5px; }
	.cbtiw-sobre-tl__when { text-align: left; font-size: var(--text-h4); }
	.cbtiw-sobre-legacy__hl { font-size: var(--text-h3); padding-left: var(--space-5); }
}

/* ---------- CBTI & ALETI (#aleti) ---------- */
/* [DERIVADO] Sección nueva (análisis §5.2): fondo oscuro como "Pilares", sin el animado de red del Inicio.
   scroll-margin-top = alto del encabezado fijo (franja de 3px + 72px + borde de 1px). */
.cbtiw-sobre-aleti { scroll-margin-top: 76px; }
.cbtiw-sobre-aleti__top { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--space-10) var(--space-16); align-items: end; }
.cbtiw-sobre-aleti__title { margin: var(--space-6) 0 0; font-family: var(--font-display); font-size: var(--text-display-3); font-weight: var(--weight-bold); line-height: var(--leading-snug); letter-spacing: var(--tracking-heading); color: var(--text-on-dark); text-wrap: balance; }
.cbtiw-sobre-aleti__hl { margin: var(--space-6) 0 0; padding-left: var(--space-4); border-left: 3px solid var(--green-500); font-family: var(--font-display); font-size: var(--text-h3); font-weight: var(--weight-semibold); line-height: var(--leading-heading); color: var(--text-on-dark); text-wrap: pretty; }
.cbtiw-sobre-aleti__p { margin: 0; font-size: var(--text-body); line-height: var(--leading-body); color: var(--text-on-dark-muted); text-wrap: pretty; }
.cbtiw-sobre-aleti__intro { margin: var(--space-5) 0 0; font-size: var(--text-body); font-weight: var(--weight-semibold); line-height: var(--leading-body); color: var(--text-on-dark); }
.cbtiw-sobre-aleti__t { margin: var(--space-5) 0 0; font-family: var(--font-display); font-size: var(--text-h4); font-weight: var(--weight-bold); line-height: var(--leading-heading); color: inherit; }
.cbtiw-sobre-aleti__close { margin: var(--space-12) 0 0; max-width: 900px; font-family: var(--font-display); font-size: var(--text-h2); font-weight: var(--weight-bold); line-height: var(--leading-heading); color: var(--text-on-dark); text-wrap: pretty; }
.cbtiw-sobre-aleti__ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-8); }
/* :is(a, button).cbti-btn (cbti-theme.css) redefine el borde con más especificidad que .cbti-btn--outline-dark: se repone aquí. */
.cbtiw-sobre-aleti__ctas a.cbti-btn--outline-dark { border-color: rgba(255, 255, 255, 0.42); }
.cbtiw-sobre-aleti__ctas a.cbti-btn--outline-dark:hover { border-color: rgba(255, 255, 255, 0.7); }
@media (max-width: 900px) {
	.cbtiw-sobre-aleti__top { grid-template-columns: minmax(0, 1fr); align-items: start; }
}
@media (max-width: 600px) {
	.cbtiw-sobre-aleti__ctas .cbti-btn { width: 100%; white-space: normal; text-align: center; }
}

/* ---------- Comisiones ---------- */
.cbtiw-sobre-com__top { display: flex; align-items: center; justify-content: space-between; }
.cbtiw-sobre-com__n { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); }
.cbtiw-sobre-com__t { margin-top: var(--space-4); line-height: var(--leading-heading); }
.cbtiw-sobre-com__p { margin-top: var(--space-2); }
.cbtiw-sobre-com__meta { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--border-subtle); display: grid; gap: var(--space-2); }
.cbtiw-sobre-com__k { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); }
.cbtiw-sobre-com__v { font-size: var(--text-body-sm); color: var(--text-strong); }
.cbtiw-sobre-com__v--b { font-weight: var(--weight-semibold); }
a.cbtiw-sobre-go { display: inline-flex; margin-top: var(--space-4); font-size: var(--text-body-sm); font-weight: var(--weight-semibold); color: var(--accent-strong) !important; }
/* [DERIVADO] Decisiones del lead (25/10/2026): ancla por comisión (#comision-…, la enlaza el Foro), etiqueta de la
   mesa del Foro y hasta 3 representantes con iniciales, LinkedIn (solo si hay URL) y "Contactar". */
.cbtiw-sobre-com { scroll-margin-top: 92px; }
.cbtiw-sobre-com:target { box-shadow: 0 0 0 2px var(--accent), var(--shadow-xs); }
a.cbtiw-sobre-com__mesa { display: inline-flex; align-items: center; margin-top: var(--space-3); text-decoration: none; }
a.cbtiw-sobre-com__mesa .cbti-badge { gap: 6px; transition: background var(--dur-base) var(--ease-standard), color var(--dur-base) var(--ease-standard); }
a.cbtiw-sobre-com__mesa:hover .cbti-badge { background: var(--navy-700); color: #fff; }
a.cbtiw-sobre-com__mesa:focus-visible { outline: none; }
a.cbtiw-sobre-com__mesa:focus-visible .cbti-badge { box-shadow: var(--focus-ring); }
.cbtiw-sobre-reps { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.cbtiw-sobre-rep { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: var(--space-3); align-items: start; margin: 0; }
.cbtiw-sobre-rep__av { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--grad-navy); color: #fff; font-family: var(--font-display); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.02em; }
.cbtiw-sobre-rep__b { min-width: 0; }
.cbtiw-sobre-rep__n { display: flex; align-items: center; gap: 6px; font-size: var(--text-body-sm); font-weight: var(--weight-semibold); line-height: 1.35; color: var(--text-strong); }
.cbtiw-sobre-rep__n > span { min-width: 0; overflow-wrap: anywhere; }
a.cbtiw-sobre-rep__in { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--navy-600) !important; border-radius: var(--radius-xs); }
a.cbtiw-sobre-rep__in:hover { color: var(--accent-strong) !important; }
.cbtiw-sobre-rep__o { margin-top: 2px; font-size: var(--text-caption); line-height: 1.4; color: var(--text-muted); }
a.cbtiw-sobre-rep__ct { display: inline-flex; align-items: center; margin-top: 2px; font-size: var(--text-caption); font-weight: var(--weight-semibold); color: var(--accent-strong) !important; text-decoration: underline; text-underline-offset: 3px; }
a.cbtiw-sobre-rep__ct:hover { color: var(--green-700) !important; }
a.cbtiw-sobre-rep__in:focus-visible, a.cbtiw-sobre-rep__ct:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-xs); }

/* Formulario "Escribe a una comisión": encabezado a la izquierda, formulario a la derecha (como el legado). */
.cbtiw-sobre-comct { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6) var(--space-16); align-items: start; margin-top: var(--space-16); padding-top: var(--space-12); border-top: 1px solid var(--border-subtle); scroll-margin-top: 76px; }
.cbtiw-sobre-comct [hidden] { display: none !important; }
.cbtiw-sobre-comct__head { display: flex; flex-direction: column; gap: var(--space-4); }
.cbtiw-sobre-comct__head .cbtiw-sobre-sublead { margin: 0; }
.cbtiw-sobre-comct__form { display: flex; flex-direction: column; gap: var(--space-6); height: auto; }
.cbtiw-sobre-comct__ok { height: auto; }
.cbtiw-sobre-comct__again { margin-top: var(--space-5); }
.cbtiw-sobre-comct .cbtiw-sobre-input { width: 100%; height: 44px; margin: 0; padding: 0 14px; border: 1px solid var(--border-strong, #C3CAD4); border-radius: var(--radius-sm); background: var(--white); font: inherit; font-size: var(--text-body-sm); color: var(--text-strong); box-shadow: none; }
.cbtiw-sobre-comct .cbtiw-sobre-textarea { height: auto; min-height: 110px; padding: 10px 14px 0; resize: vertical; }
.cbtiw-sobre-comct .af-err { margin-top: 0; }
.cbtiw-sobre-comct__note { display: flex; gap: var(--space-2); align-items: flex-start; margin: var(--space-4) 0 0; font-size: var(--text-caption); line-height: 1.5; color: var(--text-muted); }
.cbtiw-sobre-comct__note .cbti-ico { margin-top: 1px; }

/* ---------- Contacto ---------- */
.cbtiw-sobre-asks { display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-8); max-width: 620px; }
.cbtiw-sobre-ask { display: flex; gap: var(--space-3); align-items: flex-start; }
.cbtiw-sobre-ask > span:last-child { font-size: var(--text-body); color: rgba(255, 255, 255, 0.88); }
.cbtiw-sobre-contact__close { margin: var(--space-8) 0 0; font-family: var(--font-display); font-size: var(--text-h2); font-weight: var(--weight-bold); }

/* ---------- Formulario + datos ---------- */
.cbtiw-sobre-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: var(--space-16); align-items: start; }
.cbtiw-sobre-ctform { display: flex; flex-direction: column; gap: var(--space-5); margin-top: var(--space-10); }
.cbtiw-sobre-ctok { margin-top: var(--space-10); }
.cbtiw-sobre-split .cbtiw-sobre-input { width: 100%; height: 44px; margin: 0; padding: 0 14px; border: 1px solid var(--border-strong, #C3CAD4); border-radius: var(--radius-sm); background: var(--white); font: inherit; font-size: var(--text-body-sm); color: var(--text-strong); box-shadow: none; }
.cbtiw-sobre-split .cbtiw-sobre-textarea { height: auto; min-height: 110px; padding: 10px 14px 0; resize: vertical; }
.cbtiw-sobre-info { position: relative; background: var(--surface-subtle); color: var(--text-body); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); padding: var(--space-8); font-family: var(--font-body); box-shadow: none; overflow: hidden; }
.cbtiw-sobre-info__list { display: flex; flex-direction: column; gap: var(--space-5); margin-top: var(--space-6); }
.cbtiw-sobre-info__row { display: flex; gap: var(--space-4); align-items: center; }
.cbtiw-sobre-info__row > a { font-size: var(--text-body); font-weight: var(--weight-semibold); color: var(--green-600); }
.cbtiw-sobre-info__row > a:hover { color: var(--green-700); }
.cbtiw-sobre-info__row > span:not(.cbti-ico) { font-size: var(--text-body); color: var(--text-body); }
.cbtiw-sobre-info__foot { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--border-subtle); }
.cbtiw-sobre-info__foot .cbti-btn { display: flex; width: 100%; }

/* El diseño usa <a href="#"> en estos enlaces: en ≤900px toman la regla táctil aunque se les dé destino. */
@media (max-width: 900px) {
	a.cbtiw-sobre-go,
	.cbtiw-sobre-split .ct-note a { min-height: 40px; display: inline-flex; align-items: center; }
	/* 40px táctiles sin agrandar la tarjeta: margen negativo alrededor de la pieza visible. */
	a.cbtiw-sobre-com__mesa { min-height: 40px; margin: calc(var(--space-3) - 8px) 0 -8px; }
	a.cbtiw-sobre-rep__in { min-width: 40px; min-height: 40px; margin: -12px -12px -12px -12px; }
	a.cbtiw-sobre-person__in { min-width: 40px; min-height: 40px; margin: -11px; }
	a.cbtiw-sobre-co { min-height: 40px; margin: -8px 0; }
	a.cbtiw-sobre-rep__ct { min-height: 40px; margin: -9px 0 -11px; }
	.cbtiw-sobre-comct { grid-template-columns: minmax(0, 1fr); margin-top: var(--space-12); padding-top: var(--space-10); }
}
@media (max-width: 600px) {
	.cbtiw-sobre-comct__form { padding: var(--space-5); }
	.cbtiw-sobre-comct__form .cbti-btn { width: 100%; white-space: normal; }
}