/* =========================
   ConectaDonaciones — Paleta
   ========================= */
:root{
  --conectadonaciones-primary:#373b78; /* base */
  --conectadonaciones-secondary:#4BA3C3;
  --conectadonaciones-accent-1:#E4BF2F;
  --conectadonaciones-accent-2:#F18E1C;
  --conectadonaciones-accent-3:#0F988A;
  --conectadonaciones-accent-4:#624075;

  --conectadonaciones-dark:#2A2A2A;
  --conectadonaciones-gray:#7A7A7A;
  --conectadonaciones-light:#F5F7FA;
  --conectadonaciones-white:#FFFFFF;
}

/* =========================
   Hero
   ========================= */
.conectadonaciones-container{
  position: relative;
  padding: 4rem 1.5rem;
  text-align: center;
  color: var(--conectadonaciones-white);
  border-radius: 0px;
  background:
    linear-gradient(rgba(55,59,120,.86), rgba(55,59,120,.86)),
    url('/sites/default/files/conecta_img.jpg');
  background-size: cover;
  background-position: center;
  height: 50vh;
}

.conectadonaciones-logo-container{
  display:flex; gap:1.25rem; justify-content:center; align-items:center;
  flex-wrap:wrap; margin-bottom:1.25rem;
}
.conectadonaciones-logo{ max-height:64px; height:auto; width:auto; }

.conectadonaciones-container h1{
  font-weight:800; 
  letter-spacing:.4px; 
  margin:.25rem 0 1rem;
}

.conectadonaciones-date-badge,
.conectadonaciones-registro-badge{
  display:inline-flex; align-items:center; gap:.25rem;
  padding:.5rem .75rem; border-radius:999px;
  font-weight:700; margin-bottom:.75rem;
  color:#001b24;
}

.conectadonaciones-date-badge{
  background: var(--conectadonaciones-secondary);
}

.conectadonaciones-registro-badge{
  background: var(--conectadonaciones-accent-1);
  border-radius:10px;
}
.conectadonaciones-registro-badge:hover{
    background: var(--conectadonaciones-accent-2);
}

/* =========================
   Secciones & Títulos
   ========================= */
section{ padding:3rem 0; }
section:nth-of-type(even){ background:var(--conectadonaciones-light); }

h1{
    color:var(--conectadonaciones-white) !important;
}

h2{
  color:var(--conectadonaciones-primary);
  border-bottom:3px solid var(--conectadonaciones-accent-2);
  display:inline-flex; align-items:center; gap:.35rem;
  padding-bottom:.35rem; margin-bottom:1rem;
}

h3{ color:var(--conectadonaciones-accent-4); margin-top:1rem; }

/* =========================
   Tarjetas
   ========================= */
.conectadonaciones-card{
  background:var(--conectadonaciones-white);
  border:1px solid color-mix(in oklab, var(--conectadonaciones-primary) 15%, #fff);
  border-left:6px solid var(--conectadonaciones-accent-2);
  box-shadow:0 6px 20px rgba(0,0,0,.06);
  border-radius:14px; padding:1.25rem; max-width:1100px;
}

/* =========================
   Botón principal (Inscripción)
   ========================= */
.conectadonaciones-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; width:44px; border-radius:8px; margin-right:.5rem;
  background:var(--conectadonaciones-accent-1);
  color:#1e1600; text-decoration:none; font-weight:800;
  box-shadow:0 4px 12px rgba(228,191,47,.25);
  transition:transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
.conectadonaciones-btn + a{
  display:inline-block; font-weight:800; text-decoration:none;
  color:var(--conectadonaciones-primary);
  background:linear-gradient(to top, transparent 55%, color-mix(in oklab, var(--conectadonaciones-accent-1) 35%, #fff) 55%);
  padding:0 .15rem;
}
.conectadonaciones-btn:hover{ transform:translateY(-1px); filter:saturate(1.1); }
.conectadonaciones-btn:active{ transform:translateY(0); }

/* =========================
   Listas & iconos
   ========================= */
ul{ margin-left:1.25rem; }
li{ margin:.35rem 0; }
i.fa-solid{ color:var(--conectadonaciones-secondary); }

/* =========================
   Grid de criterios
   ========================= */
.conectadonaciones-criteria-grid{
  display:grid; gap:1rem; margin:1rem 0;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.conectadonaciones-criterion{
  background:#fff; border:1px solid #eaecef; border-radius:12px; padding:1rem;
  box-shadow:0 4px 12px rgba(0,0,0,.04);
}
.conectadonaciones-criterion h3{
  color:var(--conectadonaciones-primary);
  border-left:4px solid var(--conectadonaciones-accent-3);
  padding-left:.5rem; margin-bottom:.25rem;
}

/* =========================
   Timeline
   ========================= */
.conectadonaciones-timeline{ position:relative; margin:1.5rem 0; }
.conectadonaciones-timeline::before{
  content:""; position:absolute; left:14px; top:0; bottom:0; width:3px;
  background:linear-gradient(
    var(--conectadonaciones-accent-3),
    var(--conectadonaciones-accent-2),
    var(--conectadonaciones-accent-4)
  );
  opacity:.7;
}
.conectadonaciones-timeline-item{ position:relative; padding-left:48px; margin:1.25rem 0; }
.conectadonaciones-timeline-item::before{
  content:""; position:absolute; left:6px; top:.45rem; width:16px; height:16px; border-radius:50%;
  background:var(--conectadonaciones-accent-1);
  box-shadow:0 0 0 4px #ffffff, 0 4px 10px rgba(0,0,0,.15);
}
.conectadonaciones-timeline-content{
  background:#fff; border:1px solid #eef0f4; border-radius:12px; padding:1rem;
}
.conectadonaciones-timeline-content h3{
  color:var(--conectadonaciones-accent-4);
}

/* =========================
   Organizadores, Aliados y Media Partners
   ========================= */
.conectadonaciones-organizers,
.conectadonaciones-aliados,
.conectadonaciones-mediapartners {
  display:grid; gap:1rem; margin:1rem 0;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.conectadonaciones-organizer-card,
.conectadonaciones-aliados-card {
  background:#fff; border:1px solid #eceff3; border-radius:12px; padding:1rem;
}
.conectadonaciones-organizer-card h3,
.conectadonaciones-aliados-card h3{
  color:var(--conectadonaciones-primary);
  border-left:4px solid var(--conectadonaciones-secondary);
  padding-left:.5rem;
}

/* =========================
   Contacto
   ========================= */
.conectadonaciones-contact-info strong{ color:var(--conectadonaciones-primary); }
.conectadonaciones-contact-info a{ color:var(--conectadonaciones-secondary); text-decoration:none; }
.conectadonaciones-contact-info a:hover{ text-decoration:underline; }

/* =========================
   Accesibilidad & ajustes
   ========================= */
.conectadonaciones-container p{ max-width:980px; margin:.5rem auto 0; }
@media (max-width:640px){
  .conectadonaciones-logo{ max-height:50px; }
  .conectadonaciones-container{ padding:3rem 1rem; }
}

img.conecta-logo{
  width:auto !important;
  height:auto !important;
  max-width: 200px !important;
  max-width:100%;
  height:auto;
}

/* =========================
   Botón destacado (registro grande)
   ========================= */
.conectadonaciones-btn-lg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem 2.5rem;
  font-size: 1.25rem;
  font-weight: 800;
  color: #1e1600;
  background: var(--conectadonaciones-accent-1);
  border-radius: 2.5rem;
  box-shadow: 0 6px 20px rgba(228, 191, 47, 0.35);
  text-decoration: none;
  transition: all 0.3s ease;
}

.conectadonaciones-btn-lg:hover {
  background: var(--conectadonaciones-accent-2);
  color: #1e1600;
  text-decoration: none;
  transform: translateY(-2px);
}

.conectadonaciones-btn-lg:active {
  transform: translateY(0);
}
