/* ===== Departamentos (dep-) ===== */
.dep { box-sizing: border-box; max-width: 1080px; margin: 0 auto; padding: 8px 0 40px; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: #33352f; }
.dep *, .dep *::before, .dep *::after { box-sizing: border-box; }

.dep .dep-info { display: flex; flex-direction: column; gap: 20px; margin-bottom: 40px; }
.dep .dep-info-card { display: flex; align-items: flex-start; gap: 20px; padding: 24px 28px; background: var(--cofc-verde-fondo); border-left: 4px solid var(--cofc-verde); border-radius: 12px; box-shadow: 0 2px 8px rgba(60, 70, 40, .08); }
.dep .dep-info-icon { flex: 0 0 auto; width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--cofc-verde); color: #ffffff; font-size: 18px; }
.dep .dep-info-content { flex: 1 1 auto; min-width: 0; }
.dep .dep-info-title { margin: 0 0 10px; font-size: 18px; font-weight: 700; line-height: 1.35; color: var(--cofc-tinta); }
.dep .dep-info-text { margin: 0; font-size: 14px; line-height: 1.75; color: #5b6150; }
.dep .dep-info-list { margin: 0; padding: 0; list-style: none; }
.dep .dep-info-list li { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 8px; padding: 0; font-size: 14px; line-height: 1.7; color: #5b6150; }
.dep .dep-info-list li:last-child { margin-bottom: 0; }
.dep .dep-info-list li i { flex: 0 0 18px; margin-top: 5px; text-align: center; color: var(--cofc-verde-texto); }

.dep .dep-title { display: block; margin: 0 0 10px; padding: 0; font-size: 38px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; color: var(--cofc-verde); border: 0; }
.dep .dep-desc { margin: 0 0 40px; font-size: 18px; font-weight: 500; line-height: 1.5; text-align: center; color: #6b7160; }

.dep .dep-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch; }
.dep .dep-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 28px 24px; text-align: center; background: #ffffff; border: 1px solid #e5e9dc; border-radius: 16px; box-shadow: 0 4px 16px rgba(60, 70, 40, .08); }
.dep .dep-name { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.45; color: var(--cofc-tinta); }
.dep .dep-role { margin: 14px 0 0; padding: 0; font-size: 14px; font-weight: 700; letter-spacing: .02em; line-height: 1.5; text-transform: uppercase; color: var(--cofc-verde); border: 0; }

@media (max-width: 960px) { .dep .dep-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .dep .dep-grid { grid-template-columns: 1fr; }
  .dep .dep-title { font-size: 28px; }
  .dep .dep-desc { font-size: 16px; margin-bottom: 28px; }
  .dep .dep-info-card { flex-direction: column; padding: 18px; gap: 14px; }
}