/* Calculadora de reforma de baño · Chic & Decó */
.cdc-calc {
	--cdc-blue: var(--wp--preset--color--primary, #2E6DB4);
	--cdc-navy: var(--wp--preset--color--primary-dark, #1B3A63);
	--cdc-ink: var(--wp--preset--color--ink, #172033);
	--cdc-muted: var(--wp--preset--color--muted, #5A6577);
	--cdc-line: var(--wp--preset--color--line, #DDE3EA);
	--cdc-surface: var(--wp--preset--color--surface, #F3F5F8);
	--cdc-accent: var(--wp--preset--color--accent, #86BFF4);
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.5rem;
	margin: 2rem 0;
	color: var(--cdc-ink);
	font-size: 1rem;
	line-height: 1.5;
}
@media (min-width: 900px) {
	.cdc-calc { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
	.cdc-result { position: sticky; top: 1.5rem; }
}
.cdc-calc *, .cdc-calc *::before, .cdc-calc *::after { box-sizing: border-box; }
.cdc-form { display: grid; gap: 1.5rem; margin: 0; }
.cdc-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.cdc-form fieldset[hidden] { display: none; }
.cdc-form legend { font-weight: 500; color: var(--cdc-navy); font-size: 1.0625rem; margin-bottom: 0.7rem; padding: 0; }

.cdc-opts { display: grid; gap: 0.6rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) {
	.cdc-opts--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cdc-opts--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.cdc-opt { position: relative; display: block; cursor: pointer; margin: 0; }
.cdc-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cdc-opt span {
	display: block; height: 100%;
	background: #fff;
	border: 1.5px solid var(--cdc-line);
	border-radius: 4px;
	padding: 0.75rem 0.9rem;
	transition: border-color 0.12s, background 0.12s;
}
.cdc-opt strong { display: block; font-weight: 500; font-size: 0.975rem; }
.cdc-opt small { display: block; color: var(--cdc-muted); font-size: 0.8125rem; margin-top: 0.15rem; line-height: 1.4; }
.cdc-opt:hover span { border-color: #B7C3D3; }
.cdc-opt input:checked + span { border-color: var(--cdc-blue); background: var(--wp--preset--color--accent-soft, #EAF4FE); box-shadow: inset 0 0 0 1px var(--cdc-blue); }
.cdc-opt input:focus-visible + span { outline: 2px solid var(--cdc-accent); outline-offset: 2px; }

.cdc-range { display: flex; align-items: center; gap: 1rem; }
.cdc-range input[type=range] { flex: 1; accent-color: var(--cdc-blue); height: 1.5rem; }
.cdc-range__val {
	min-width: 4.5rem; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums;
	background: var(--cdc-surface); border-radius: 4px; padding: 0.35rem 0.6rem;
}
.cdc-hint { margin: 0.4rem 0 0; font-size: 0.8125rem; color: var(--cdc-muted); }

.cdc-checks { display: grid; gap: 0.5rem; }
.cdc-check { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.6rem; cursor: pointer; margin: 0; font-weight: 500; }
.cdc-check[hidden] { display: none; }
.cdc-check input { width: 1.1rem; height: 1.1rem; accent-color: var(--cdc-blue); transform: translateY(2px); }
.cdc-check small { flex-basis: 100%; padding-left: 1.7rem; color: var(--cdc-muted); font-size: 0.8125rem; font-weight: 400; }

.cdc-result {
	background: #fff;
	border: 1px solid var(--cdc-line);
	border-top: 5px solid var(--cdc-accent);
	border-radius: 4px;
	padding: 1.4rem 1.4rem 1.2rem;
	box-shadow: 0 1px 2px rgba(16,37,77,.06), 0 8px 24px rgba(16,37,77,.08);
}
.cdc-result p { margin: 0; }
.cdc-result__label { font-weight: 700; color: var(--cdc-muted); font-size: 0.875rem; }
.cdc-result__range {
	font-size: clamp(1.7rem, 1.2rem + 1.8vw, 2.25rem); font-weight: 500; letter-spacing: -0.01em;
	color: var(--cdc-navy); font-variant-numeric: tabular-nums; margin-top: 0.25rem !important; line-height: 1.15;
}
.cdc-result__meta { color: var(--cdc-muted); font-size: 0.875rem; margin-top: 0.35rem !important; }
.cdc-table { width: 100%; border-collapse: collapse; margin: 1.2rem 0 0.6rem; font-size: 0.875rem; font-variant-numeric: tabular-nums; }
.cdc-table caption { text-align: left; font-weight: 700; font-size: 0.8125rem; color: var(--cdc-muted); padding-bottom: 0.4rem; }
.cdc-table th, .cdc-table td { border: 0; border-bottom: 1px solid var(--cdc-line); padding: 0.45rem 0; text-align: left; font-weight: 400; background: none; }
.cdc-table td { text-align: right; white-space: nowrap; padding-left: 0.75rem; }
.cdc-table .cdc-total th, .cdc-table .cdc-total td { font-weight: 600; border-bottom: 0; padding-top: 0.6rem; }
.cdc-result__m2 { font-size: 0.8125rem; color: var(--cdc-muted); }
.cdc-note {
	margin-top: 1rem !important; font-size: 0.8125rem; color: var(--cdc-ink);
	background: var(--wp--preset--color--accent-soft, #EAF4FE); border-radius: 4px; padding: 0.7rem 0.8rem; line-height: 1.45;
}

.cdc-sticky {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
	display: none; justify-content: space-between; align-items: center; gap: 1rem;
	background: var(--cdc-navy); color: #fff;
	padding: 0.8rem 1.25rem calc(0.8rem + env(safe-area-inset-bottom, 0px));
	cursor: pointer; font-size: 0.875rem;
}
.cdc-sticky strong { font-size: 1.0625rem; font-weight: 500; font-variant-numeric: tabular-nums; }
@media (max-width: 899px) { .cdc-sticky.is-visible { display: flex; } }
@media (prefers-reduced-motion: reduce) { .cdc-opt span { transition: none; } }
.cdc-result__range span { white-space: nowrap; }

/* Resultados con varias cifras (placas, aerotermia, materiales) */
.cdc-stats { display: grid; gap: 0.6rem; margin-top: 1.1rem; }
.cdc-stats:empty { display: none; }
.cdc-stat {
	display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
	background: var(--cdc-surface); border-radius: 4px; padding: 0.7rem 0.85rem;
}
.cdc-stat > span { font-size: 0.8125rem; color: var(--cdc-muted); }
.cdc-stat strong { text-align: right; font-weight: 600; color: var(--cdc-navy); font-variant-numeric: tabular-nums; }
.cdc-stat strong small { display: block; font-weight: 400; font-size: 0.75rem; color: var(--cdc-muted); }
.cdc-stat strong span { white-space: nowrap; }
.cdc-result__range .cdc-small { font-size: 0.55em; font-weight: 400; color: var(--cdc-muted); }
.cdc-result__range .cdc-sep { color: var(--cdc-accent); }
.cdc-table[hidden] { display: none; }
.cdc-form fieldset.cdc-single { margin-top: -0.75rem; }
.cdc-form fieldset.cdc-single + fieldset.cdc-single { margin-top: -1rem; }

/* Índice de calculadoras */
.cdc-hub {
	--cdc-blue: var(--wp--preset--color--primary, #2E6DB4);
	--cdc-navy: var(--wp--preset--color--primary-dark, #1B3A63);
	--cdc-ink: var(--wp--preset--color--ink, #26324A);
	--cdc-muted: var(--wp--preset--color--muted, #667389);
	--cdc-line: var(--wp--preset--color--line, #DCEAF9);
	--cdc-accent: var(--wp--preset--color--accent, #86BFF4);
}
.cdc-hub { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); margin: 2rem 0; }
.cdc-hub a {
	position: relative; display: block; text-decoration: none !important; color: var(--cdc-ink);
	background: #fff; border: 1px solid var(--cdc-line); border-top: 3px solid var(--cdc-accent);
	padding: 1.4rem 1.4rem 1.25rem; transition: border-color .15s, box-shadow .15s;
}
.cdc-hub a:hover { border-color: var(--wp--preset--color--powder, #CAE3FC); border-top-color: var(--cdc-blue); box-shadow: 0 8px 24px rgba(27,58,99,.08); }
.cdc-hub strong { display: block; font-weight: 500; font-size: 1.125rem; color: var(--cdc-navy); }
.cdc-hub span { display: block; margin-top: .4rem; font-size: .9375rem; color: var(--cdc-muted); line-height: 1.55; }

/* Fuentes externas para contrastar precios */
.cdc-fuentes {
	--cdc-line: var(--wp--preset--color--line, #DCEAF9);
	--cdc-muted: var(--wp--preset--color--muted, #667389);
	--cdc-navy: var(--wp--preset--color--primary-dark, #1B3A63);
	--cdc-blue: var(--wp--preset--color--primary, #2E6DB4);
	background: var(--wp--preset--color--surface, #F3F8FE);
	border: 1px solid var(--cdc-line);
	border-top: 3px solid var(--wp--preset--color--accent, #86BFF4);
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2.25rem);
	margin: 2.5rem 0;
}
.cdc-fuentes h2 { margin: 0 !important; font-size: var(--wp--preset--font-size--large, 1.25rem); font-weight: 500; color: var(--cdc-navy); }
.cdc-fuentes__intro { margin: .5rem 0 0; color: var(--cdc-muted); }
.cdc-fuentes__grupo { margin-top: 1.5rem; }
.cdc-fuentes h3 {
	margin: 0 !important; font-size: .75rem !important; font-weight: 500; text-transform: uppercase;
	letter-spacing: .14em; color: var(--cdc-blue);
}
.cdc-fuentes__grupo > p { margin: .35rem 0 0; font-size: .875rem; color: var(--cdc-muted); }
.cdc-fuentes ul { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
.cdc-fuentes li { margin: 0 !important; background: #fff; border: 1px solid var(--cdc-line); padding: .8rem 1rem; }
.cdc-fuentes li a { font-weight: 500; color: var(--cdc-navy); text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent, #86BFF4); text-underline-offset: 3px; }
.cdc-fuentes li a::after { content: " ↗"; font-size: .8em; color: var(--cdc-blue); }
.cdc-fuentes li span { display: block; margin-top: .25rem; font-size: .875rem; color: var(--cdc-muted); line-height: 1.5; }
.cdc-fuentes__nota { margin: 1.25rem 0 0; font-size: .75rem; color: var(--cdc-muted); }
.cdc-note a { color: inherit; }
.cdc-hub a { padding-top: 0; overflow: hidden; }
.cdc-hub img { display: block; width: calc(100% + 2.8rem); max-width: none; height: auto; aspect-ratio: 3 / 2; margin: 0 -1.4rem 1rem; border-bottom: 1px solid var(--cdc-line); }
