/* M05: filtros e comparação. */
.clmr-filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 7px; margin: 0 auto 14px; color: #fff; }
.clmr-chip {
	min-height: 40px;
	padding: 6px 14px;
	border: 1.4px solid rgba(255, 255, 255, .6);
	border-radius: 30px;
	background: transparent;
	color: #fff;
	font-family: Sora, sans-serif;
	font-size: 14px;
	cursor: pointer;
}
.clmr-chip[aria-pressed="true"] { border-color: #fff; background: #fff; color: #1b1613; font-weight: 600; }
.clmr-chip-clear { border-style: dashed; }
#clmr-filter-band {
	min-height: 40px;
	padding: 6px 12px;
	border: 1.4px solid rgba(255, 255, 255, .6);
	border-radius: 30px;
	background: #2a0a12;
	color: #fff;
	font-size: 14px;
}
.clmr-filter-status { width: 100%; margin: 2px 0 0; font-size: 13px; text-align: center; opacity: .85; }
.clmr-filter-empty { margin: 10px 0 24px; color: #fff; font-size: 15px; text-align: center; }
.nossasSuitesPG .row > [hidden] { display: none; }
/* Espaço da última linha da grade: os ramos da logo, sem o nome. */
.clmr-ramos { min-height: 120px; background: url(../img/ramos.svg) center / min(86%, 560px) auto no-repeat; }
/*
 * Última linha centralizada, com as duas hastes do ramo da logo, separadas e inteiras, em pé, uma de cada lado,
 * como pilares. A da direita fica espelhada, para as duas se abrirem para fora.
 */
.nossasSuitesPG .row:has(.cardSuiteGrid) { justify-content: center; }
.clmr-ramos.clmr-ramos-esq, .clmr-ramos.clmr-ramos-dir { align-self: stretch; min-height: 200px; margin: 10px 0; }
/* A mesma haste nos dois lados; a da direita, espelhada. */
.clmr-ramos.clmr-ramos-esq, .clmr-ramos.clmr-ramos-dir { background: url(../img/ramo-pe-1.svg) center / auto min(84%, 360px) no-repeat; }
.clmr-ramos.clmr-ramos-dir { transform: scaleX(-1); }

/* Comparar: menu flutuante, centralizado na parte de baixo da tela; a seleção abre para cima. */
.clmr-compare-menu {
	position: fixed;
	bottom: calc(16px + env(safe-area-inset-bottom));
	left: 50%;
	z-index: 140;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	width: min(560px, calc(100vw - 24px));
	transform: translateX(-50%);
	pointer-events: none;
}
.clmr-compare-menu > * { pointer-events: auto; }
body.pushy-open-left .clmr-compare-menu { display: none; }
.clmr-compare-menu .clmr-compare-toggle {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	background: #1c060b;
	border-color: #e2bc62;
	box-shadow: 0 8px 22px rgba(0, 0, 0, .65);
	color: #e2bc62;
	font-weight: 600;
}
.clmr-compare-menu .clmr-compare-toggle::after {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	margin-top: 4px;
	border: solid currentColor;
	border-width: 2px 0 0 2px;
	transform: rotate(45deg);
	transition: transform .2s ease;
}
.clmr-compare-menu .clmr-compare-toggle[aria-expanded="true"]::after { margin-top: -4px; transform: rotate(225deg); }
.clmr-compare-menu .clmr-compare-toggle:hover, .clmr-compare-menu .clmr-compare-toggle[aria-expanded="true"] { background: #e2bc62; color: #22070d; }
.clmr-compare-panel {
	box-sizing: border-box;
	width: 100%;
	max-height: min(60dvh, 420px);
	overflow-y: auto;
	padding: 14px 18px;
	border: 1px solid rgba(226, 188, 98, .55);
	border-radius: 16px;
	background: #1c060b;
	box-shadow: 0 12px 34px rgba(0, 0, 0, .7);
	color: #fff;
	text-align: center;
}
.clmr-compare-panel[hidden] { display: none; }
.clmr-compare-title { margin: 0 0 12px; color: #fff; font-family: Sora, sans-serif; font-size: 15px; font-weight: 600; }
.clmr-compare-options { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.clmr-compare-option {
	padding: 5px 12px;
	border: 1px solid rgba(226, 188, 98, .55);
	border-radius: 30px;
	background: transparent;
	color: #fff;
	font-size: 13px;
	cursor: pointer;
	transition: background-color .6s ease, color .6s ease;
}
.clmr-compare-option:hover { background: rgba(226, 188, 98, .22); transition-duration: .15s; }
.clmr-compare-option[aria-pressed="true"] { border-color: #e2bc62; background: #e2bc62; color: #22070d; font-weight: 700; }
.clmr-compare-option:disabled { opacity: .4; cursor: not-allowed; }
.clmr-compare-option:disabled:hover { background: transparent; }
/* "+" mostra que a suíte pode ser escolhida; "✓", que já foi. */
.clmr-compare-option::before { content: "+"; margin-right: 5px; color: #e2bc62; font-weight: 700; }
.clmr-compare-option[aria-pressed="true"]::before { content: "✓"; color: #22070d; }
.clmr-compare-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin-top: 14px; }
.clmr-compare-count { color: #efe9dc; font-size: 13px; }
.clmr-compare-count[hidden] { display: none; }
/* Botão principal sempre visível: tracejado enquanto faltam suítes; dourado e cheio quando já dá para comparar. */
.clmr-compare-actions #clmr-compare-open { flex: 1 1 100%; min-height: 44px; border: 1.4px solid #e2bc62; background: #e2bc62; color: #22070d; font-weight: 700; opacity: 1; }
.clmr-compare-actions #clmr-compare-open:disabled { border-style: dashed; background: transparent; color: #e2bc62; font-weight: 600; cursor: default; }
.clmr-compare-actions #clmr-compare-open:not(:disabled) { animation: clmr-cmp-pronto .6s cubic-bezier(.25, .8, .25, 1); }
@keyframes clmr-cmp-pronto {
	0% { transform: scale(.94); box-shadow: 0 0 0 rgba(226, 188, 98, 0); }
	55% { transform: scale(1.04); box-shadow: 0 0 22px rgba(226, 188, 98, .55); }
	100% { transform: scale(1); box-shadow: 0 0 0 rgba(226, 188, 98, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.clmr-compare-actions #clmr-compare-open:not(:disabled) { animation: none; }
}
.clmr-compare-clear { padding: 0; border: 0; background: none; color: #efe9dc; font-size: 13px; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.clmr-compare-clear[hidden] { display: none; }
.clmr-compare-actions .clmr-btn { min-height: 36px; padding: 5px 16px; font-size: 14px; }

.clmr-compare-table { overflow-x: auto; }
.clmr-compare-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.clmr-compare-table th, .clmr-compare-table td { padding: 8px; border-top: 1px solid rgba(127, 110, 80, .4); text-align: left; }
.clmr-compare-table thead th { border-top: 0; font-weight: 700; }
.clmr-compare-table tbody th { font-weight: 500; }
@media (max-width: 560px) {
	.clmr-compare-table table { font-size: 12.5px; }
	.clmr-compare-table th, .clmr-compare-table td { padding: 6px 4px; }
	.clmr-compare-table td { white-space: nowrap; }
	.clmr-compare-table tbody th { overflow-wrap: anywhere; }
}