/* ---------- Banner superior ---------- */
.ge-cat-hero { position: relative; overflow: hidden; color: var(--ge-white); min-height: 560px; display: grid; align-items: center; }
.ge-cat-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ge-cat-hero-overlay { position: absolute; inset: 0; background: linear-gradient(100deg, var(--ge-green-950) 0%, rgba(16,38,26,0.85) 45%, rgba(16,38,26,0.2) 100%); }

.ge-cat-hero-content { position: relative; z-index: 1; max-width: 620px; margin-left: 200px; padding: 3rem 1.5rem 2.5rem 0; }
.ge-cat-hero-bar { display: block; width: 2.5rem; height: 4px; background: var(--ge-orange-400); border-radius: 2px; margin-bottom: 1rem; }
.ge-cat-hero-content h1 { color: var(--ge-white); margin-bottom: 0.9rem; }
.ge-cat-hero-content p { color: rgba(255,255,255,0.85); margin-bottom: 0.8rem; }
.ge-cat-hero-mobile-cta { display: none; }

.ge-cat-hero-highlights { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1.6rem; }
.ge-cat-hero-highlights li { display: flex; align-items: center; gap: 0.6rem; }
.ge-cat-hero-highlight-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 2.4rem; height: 2.4rem; border-radius: 50%;
	background: rgba(255,255,255,0.12); color: var(--ge-orange-400); flex-shrink: 0;
}
.ge-cat-hero-highlight-icon .ge-icon { width: 1.2rem; height: 1.2rem; }
.ge-cat-hero-highlights strong { display: block; font-size: 0.88rem; }
.ge-cat-hero-highlights span { display: block; font-size: 0.8rem; color: rgba(255,255,255,0.75); }

.ge-cat-hero-datos {
	position: absolute; z-index: 1; top: 2.5rem; right: 200px;
	max-width: 260px; background: var(--ge-green-950); color: var(--ge-white);
	border-radius: var(--ge-radius); padding: 1.2rem 1.4rem; display: flex; flex-direction: column; gap: 1rem;
}
.ge-cat-hero-dato { display: flex; align-items: center; gap: 0.8rem; }
.ge-cat-hero-dato-icon {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 2.2rem; height: 2.2rem; border-radius: var(--ge-radius-sm);
	background: rgba(255,255,255,0.1); color: var(--ge-orange-400);
}
.ge-cat-hero-dato-icon .ge-icon { width: 1.15rem; height: 1.15rem; }
.ge-cat-hero-dato p { font-weight: 700; font-size: 0.88rem; line-height: 1.3; margin: 0; }

@media (max-width: 1100px) {
	.ge-cat-hero-content { margin-left: 0; padding-left: 1.5rem; }
	.ge-cat-hero-datos { position: relative; top: auto; right: auto; margin: 1.5rem 1.5rem 0; max-width: none; }
}

@media (max-width: 600px) {
	/* Igual que el hero de Inicio: en móvil esta fila de íconos superpuesta
	   a la foto satura la vista, así que se quita en todas las fichas de
	   categoría y queda solo título/descripción + este botón de WhatsApp. */
	.ge-cat-hero-highlights, .ge-cat-hero-datos { display: none; }
	.ge-cat-hero-mobile-cta { display: inline-flex; margin-top: 1.2rem; }
}

/* ---------- Sección título reutilizable ---------- */
.ge-cat-section-title { text-align: center; margin-bottom: 2.5rem; position: relative; padding-bottom: 0.9rem; }
.ge-cat-section-title::after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 2.5rem; height: 3px; background: var(--ge-green-600); border-radius: 2px; }

/* ---------- Fila de características ---------- */
.ge-cat-caracteristicas { padding: 3rem 0 4.5rem; background: var(--ge-bg-alt); }
.ge-cat-caracteristicas-grid { display: flex; flex-wrap: wrap; gap: 2rem; justify-content: center; }
.ge-cat-caracteristica { display: flex; align-items: flex-start; gap: 0.9rem; max-width: 240px; }
.ge-cat-caracteristica-icon {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 2.8rem; height: 2.8rem; border-radius: 50%; background: var(--ge-green-600); color: var(--ge-white);
}
.ge-cat-caracteristica-icon .ge-icon { width: 1.3rem; height: 1.3rem; }
.ge-cat-caracteristica h3 { font-size: 0.92rem; margin-bottom: 0.3rem; }
.ge-cat-caracteristica p { font-size: 0.82rem; color: var(--ge-text-muted); }

/* ---------- Preguntas frecuentes (2 columnas) ---------- */
.ge-cat-faq { padding: 4.5rem 0; }
.ge-cat-faq-cols { max-width: 1000px; margin: 0 auto; }
.ge-cat-faq-cols .ge-accordion { column-count: 2; column-gap: 2rem; }
.ge-cat-faq-cols .ge-accordion-item { break-inside: avoid; }

/* ---------- CTA final ---------- */
.ge-cat-cta { padding: 4.5rem 0; background: var(--ge-green-800); color: var(--ge-white); overflow: hidden; }
.ge-cat-cta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
.ge-cat-cta-text h2 { color: var(--ge-white); margin-bottom: 0.8rem; }
.ge-cat-cta-text p { color: rgba(255,255,255,0.85); margin-bottom: 1.5rem; }
.ge-cat-cta-contact { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1.2rem; }
.ge-cat-cta-contact a { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; }
.ge-cat-cta-contact a:hover { color: var(--ge-orange-300); }

.ge-cat-cta-media { position: relative; }
.ge-cat-cta-media > img { width: 100%; border-radius: var(--ge-radius); aspect-ratio: 4/3; object-fit: cover; }
.ge-cat-cta-checklist {
	position: absolute; right: 1.5rem; bottom: -1.5rem;
	background: var(--ge-white); color: var(--ge-text); border-radius: var(--ge-radius);
	box-shadow: var(--ge-shadow); padding: 1.2rem 1.4rem; max-width: 230px;
	display: flex; flex-direction: column; gap: 0.8rem;
}
.ge-cat-cta-checklist li { display: flex; align-items: center; gap: 0.6rem; font-size: 0.82rem; font-weight: 600; }
.ge-cat-cta-checklist li span {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--ge-green-100); color: var(--ge-green-700);
}
.ge-cat-cta-checklist li span .ge-icon { width: 0.95rem; height: 0.95rem; }

@media (max-width: 960px) {
	.ge-cat-marcas-grid { grid-template-columns: repeat(2, 1fr); }
	.ge-cat-cta-grid { grid-template-columns: 1fr; }
	.ge-cat-cta-checklist { position: static; margin-top: -2rem; margin-left: auto; margin-right: auto; }
	.ge-cat-faq-cols .ge-accordion { column-count: 1; }
}
@media (max-width: 560px) {
	.ge-cat-marcas-grid { grid-template-columns: 1fr; }
}
