/* =========================================
   CEDI.PHP — CSS AISLADO (NO PISA HEADER)
   Paleta estricta (usa variables globales si existen)
========================================= */

/* ✅ NO uses :root aquí para no pisar el sitio completo.
   Usa variables LOCALES dentro de .cedi-page */
.cedi-page{
  --cedi-bg: #EDEBE6;        /* Arena clara */
  --cedi-card: #FAFAF7;      /* Blanco cálido */
  --cedi-accent: #6B8E85;    /* Verde salvia */
  --cedi-text: #333333;      /* Gris carbón */
  --cedi-muted: #8B8B8B;     /* Gris suave */
  --cedi-radius: 16px;

  background: var(--cedi-bg);
  color: var(--cedi-text);
}

/* ✅ “Firewall” para que nada dentro de cedi.css afecte el header */
.cedi-header,
.cedi-header *{
  /* no declaramos nada aquí (solo evitamos que tus reglas genéricas lo alcancen) */
}

/* =========================
   Sección superior
========================= */
.cedi-page .cedi-title{
  color: var(--cedi-text);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.cedi-page .cedi-text{
  color: var(--cedi-text);
  opacity: .92;
  line-height: 1.85;
  max-width: 82ch;
}

.cedi-page .cedi-card{
  background: var(--cedi-card);
  border: none;
  border-radius: var(--cedi-radius);
}

.cedi-page .cedi-quicklist{
  display: grid;
  gap: 14px;
}

.cedi-page .cedi-quickitem{
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.cedi-page .cedi-quickicon{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(107,142,133,.10);
  flex: 0 0 auto;
}

.cedi-page .cedi-quickicon i{
  color: var(--cedi-accent);
  font-size: 1.05rem;
}

.cedi-page .cedi-quicklabel{
  font-size: .78rem;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: var(--cedi-muted);
  margin-bottom: 2px;
}

.cedi-page .cedi-quickvalue{
  color: var(--cedi-text);
  font-weight: 600;
}

.cedi-page .cedi-link{
  color: var(--cedi-accent);
  text-decoration: none;
  font-weight: 700;
}
.cedi-page .cedi-link:hover{
  text-decoration: underline;
}

/* =========================
   Directorio: Lista Ejecutiva
========================= */
.cedi-page .cedi-subtitle{
  color: var(--cedi-text);
  font-weight: 800;
  letter-spacing: -0.02em;
}

.cedi-page .cedi-dirbox{
  background: var(--cedi-card);
  border-radius: var(--cedi-radius);
  overflow: hidden;
}

/* Fila */
.cedi-page .cedi-dirrow{
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 18px;
  border-bottom: 1px solid var(--cedi-bg);
  transition: background .18s ease;
}

.cedi-page .cedi-dirrow.is-last{
  border-bottom: none;
}

/* Indicador hover */
.cedi-page .cedi-dirrow::before{
  content:"";
  position:absolute;
  left:0;
  top: 12px;
  bottom: 12px;
  width: 4px;
  background: transparent;
  border-radius: 999px;
  transition: background .18s ease;
}

/* Hover */
.cedi-page .cedi-dirrow:hover{
  background: rgba(237,235,230,.55);
}
.cedi-page .cedi-dirrow:hover::before{
  background: var(--cedi-accent);
}

/* Izquierda */
.cedi-page .cedi-name{
  color: var(--cedi-text);
  font-weight: 800;
  line-height: 1.25;
}

.cedi-page .cedi-role{
  margin-top: 6px;
  color: var(--cedi-accent);
  font-weight: 600;
  font-size: .92rem;
  line-height: 1.45;
}

/* Derecha */
.cedi-page .cedi-dirright{
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  color: var(--cedi-muted);
}

.cedi-page .cedi-contact{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--cedi-muted);
  font-weight: 600;
}

.cedi-page .cedi-contact i{
  color: var(--cedi-muted);
  font-size: 1rem;
}

.cedi-page .cedi-contactlink{
  color: var(--cedi-muted);
  text-decoration: none;
  font-weight: 600;
  word-break: break-word;
}

.cedi-page .cedi-contactlink:hover{
  color: var(--cedi-accent);
  text-decoration: underline;
}

/* Móvil: contacto debajo */
@media (max-width: 768px){
  .cedi-page .cedi-dirrow{
    flex-direction: column;
    align-items: flex-start;
  }
  .cedi-page .cedi-dirright{
    text-align: left;
    align-items: flex-start;
  }
}