/* =========================
   EIMI UI (LIMPIO / ÚNICO)
   ========================= */
   :root{
    --eimi-primary:#E01678;
    --eimi-bg:#f8f6f6;
    --eimi-text:#181113;
    --eimi-muted:#7a5a63;
    --eimi-border:#e5dcde;
    --eimi-soft:#f5f0eb;
    --eimi-shadow: 0 18px 50px rgba(0,0,0,.10);
    --eimi-radius: 18px;
  }
  
  html{ scroll-behavior:smooth; }
  
  .eimi-body{ background: var(--eimi-bg); color: var(--eimi-text); }
  .eimi-main{ background: var(--eimi-bg); color: var(--eimi-text); }
  
  .eimi-section-white{ background:#fff; }
  .eimi-section-soft{ background: var(--eimi-bg); }
  
  /* =========================
     BOTONES
     ========================= */
  .eimi-btn{
    border-radius: 12px;
    font-weight: 900;
    padding:.62rem 1rem;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  
  .eimi-btn-primary{
    background: var(--eimi-primary);
    color:#fff;
    border:0;
    box-shadow: 0 12px 30px rgba(224,22,120,.18);
  }
  .eimi-btn-primary:hover{ filter: brightness(.95); color:#fff; }
  
  .eimi-btn-soft{
    background: var(--eimi-soft);
    color: var(--eimi-text);
    border:1px solid var(--eimi-border);
  }
  .eimi-btn-soft:hover{ border-color: rgba(224,22,120,.35); }
  
  .eimi-btn-white{
    background:#fff;
    color:var(--eimi-text);
    border:1px solid var(--eimi-border);
  }
  
  .eimi-btn-outline{
    background: transparent;
    color:#fff;
    border:2px solid rgba(255,255,255,.35);
  }
  .eimi-btn-outline:hover{ background: rgba(255,255,255,.10); color:#fff; }
  
  /* =========================
     HEADER 2 (DESKTOP + MOBILE)
     ========================= */
  .eimi-header2{
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--eimi-border);
  }
  
  .eimi-brand{ display:flex; align-items:center; text-decoration:none; }
  
  .eimi-logo2{ height: 54px; width:auto; display:block; }
  @media(min-width:992px){ .eimi-logo2{ height: 62px; } }
  
  /* Desktop bar */
  .eimi-nav-desktop{
    display:flex;
    align-items:center;
    gap: 18px;
    padding: 14px 0;
  }
  
  /* ✅ CAMBIO PEDIDO: el nav se alinea a la derecha (sin “pegarse” a los botones) */
  .eimi-links{
    display:flex;
    align-items:center;
    justify-content: end !important; /* <-- LO QUE PEDISTE */
    gap: 22px;
    flex: 1;                  /* ocupa el espacio central */
    padding-right: 10px;       /* separa del bloque CTAs */
  }
  
  .eimi-link{
    color: var(--eimi-text);
    font-weight: 900;
    font-size: 14px;
    text-decoration:none;
    padding: 10px 10px;
    border-radius: 12px;
    white-space: nowrap;
  }
  .eimi-link:hover{
    color: var(--eimi-primary);
    background: rgba(224,22,120,.06);
  }
  
  .eimi-ctas{
    display:flex;
    align-items:center;
    gap: 10px;
  }
  
  /* Mobile top bar */
  .eimi-nav-mobile{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: 12px 0;
  }
  
  .eimi-burger{
    width: 44px; height:44px;
    border-radius: 12px;
    border: 1px solid var(--eimi-border);
    background: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    color: var(--eimi-text);
    font-size: 22px;
  }
  .eimi-burger:focus{ outline:none; box-shadow:none; }
  .eimi-burger:hover{
    border-color: rgba(224,22,120,.25);
    color: var(--eimi-primary);
  }
  
  /* Mobile dropdown panel (animated) */
  .eimi-mobile-panel{
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transform: translateY(-6px);
    transition: max-height .35s ease, opacity .25s ease, transform .25s ease;
    border-radius: 18px;
    border: 1px solid var(--eimi-border);
    background: #fff;
    box-shadow: var(--eimi-shadow);
    margin-bottom: 12px;
  }
  
  .eimi-mobile-panel.is-open{
    max-height: 520px;
    opacity: 1;
    transform: translateY(0);
  }
  
  .eimi-mobile-links{
    display:grid;
    gap: 6px;
    padding: 12px;
  }
  
  .eimi-mobile-link{
    display:flex;
    align-items:center;
    gap: 10px;
    padding: 12px 12px;
    border-radius: 14px;
    text-decoration:none;
    color: var(--eimi-text);
    font-weight: 900;
    background: var(--eimi-bg);
    border: 1px solid var(--eimi-border);
  }
  .eimi-mobile-link i{ color: var(--eimi-primary); font-size: 18px; }
  .eimi-mobile-link:hover{
    background: rgba(224,22,120,.06);
    border-color: rgba(224,22,120,.22);
    color: var(--eimi-primary);
  }
  
  .eimi-mobile-ctas{
    display:grid;
    gap: 10px;
    padding: 0 12px 12px;
  }
  
  /* =========================
     HERO
     ========================= */
  .eimi-pill{
    display:inline-block;
    padding:.35rem .9rem;
    border-radius:999px;
    background: rgba(224,22,120,.20);
    border:1px solid rgba(255,255,255,.20);
    color:#fff;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:12px;
  }
  
  .eimi-hero{
    position:relative;
    min-height: 640px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 70px 0;
    overflow:hidden;
    border-bottom: 1px solid var(--eimi-border);
  }
  .eimi-hero-bg{
    position:absolute; inset:0;
    background-size: cover;
    background-position: center;
    background-repeat:no-repeat;
  }
  .eimi-hero-overlay{
    position:absolute; inset:0;
    background: linear-gradient(rgba(0,0,0,.40), rgba(0,0,0,.65));
  }
  .eimi-hero-content{ position:relative; z-index:2; max-width: 920px; }
  
  .eimi-hero-title{
    color:#fff;
    font-weight: 900;
    letter-spacing:-1px;
    font-size: clamp(2.2rem, 4.2vw, 4.0rem);
    line-height:1.05;
    margin: 18px 0 14px;
  }
  .eimi-hero-subtitle{
    color: rgba(255,255,255,.90);
    font-size: 1.08rem;
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.7;
  }
  
  /* =========================
     TIPOGRAFÍA / TITULOS
     ========================= */
  .eimi-h2{
    font-weight:900;
    letter-spacing:-.6px;
    font-size: clamp(1.7rem, 2.5vw, 2.4rem);
    margin:0;
  }
  .eimi-kicker{
    color: var(--eimi-primary);
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:12px;
    margin-bottom: 8px;
  }
  .eimi-lead{ color:#5a4348; font-size: 1.05rem; line-height: 1.7; }
  .eimi-muted{ color: var(--eimi-muted); }
  
  /* =========================
     STATS
     ========================= */
  .eimi-stat{
    background: var(--eimi-soft);
    border: 1px solid var(--eimi-border);
    border-radius: var(--eimi-radius);
    padding: 22px 14px;
  }
  .eimi-stat-num{
    color: var(--eimi-primary);
    font-weight: 900;
    font-size: 2.2rem;
    line-height:1;
  }
  .eimi-stat-label{
    margin-top:8px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:12px;
    color: var(--eimi-muted);
  }
  
  /* =========================
     MEDIA
     ========================= */
  .eimi-media-card{
    border-radius: var(--eimi-radius);
    overflow:hidden;
    box-shadow: var(--eimi-shadow);
    height: 420px;
    background:#fff;
  }
  @media(max-width:576px){ .eimi-media-card{ height: 320px; } }
  
  /* Info cards */
  .eimi-info{
    display:flex;
    gap:12px;
    padding:14px;
    border-radius: 14px;
    border: 1px solid var(--eimi-border);
    background:#fff;
  }
  .eimi-info-ico{
    width:42px; height:42px;
    border-radius: 12px;
    display:flex; align-items:center; justify-content:center;
    background: rgba(224,22,120,.10);
    color: var(--eimi-primary);
    flex: 0 0 auto;
  }
  .eimi-info-title{ font-weight:900; }
  .eimi-info-text{ color: var(--eimi-muted); font-size: 14px; }
  
  /* Program cards */
  .eimi-card{
    border-radius: 18px;
    border: 1px solid var(--eimi-border);
    background: var(--eimi-bg);
    padding: 22px;
    transition: .2s ease;
  }
  .eimi-card:hover{ transform: translateY(-2px); box-shadow: var(--eimi-shadow); }
  .eimi-card-ico{
    width:52px; height:52px;
    border-radius: 14px;
    background: rgba(224,22,120,.10);
    color: var(--eimi-primary);
    display:flex; align-items:center; justify-content:center;
    font-size: 22px;
    margin-bottom: 12px;
  }
  .eimi-card-title{ font-weight:900; margin:0 0 6px; }
  .eimi-card-text{ color: var(--eimi-muted); margin:0 0 10px; }
  .eimi-card-link{ color: var(--eimi-primary); font-weight:900; text-decoration:none; }
  .eimi-card-link:hover{ text-decoration:underline; }
  
  /* Help block */
  .eimi-help{
    border-radius: 26px;
    overflow:hidden;
    background: var(--eimi-primary);
    color:#fff;
    box-shadow: var(--eimi-shadow);
    display:flex;
    flex-direction: column;
  }
  .eimi-help-left{ padding: 28px; }
  .eimi-help-title{ font-weight:900; letter-spacing:-.6px; margin:0 0 10px; font-size: 2rem; }
  .eimi-help-text{ color: rgba(255,255,255,.85); margin:0 0 18px; line-height:1.7; }
  .eimi-help-right{ background:#fff; }
  .eimi-help-right img{ width:100%; height:100%; object-fit:cover; display:block; min-height: 260px; }
  
  @media(min-width:992px){
    .eimi-help{ flex-direction: row; }
    .eimi-help-left{ width:52%; padding: 52px; }
    .eimi-help-right{ width:48%; }
  }
  
  /* Impact cards */
  .eimi-post-card{
    border-radius: 18px;
    overflow:hidden;
    border: 1px solid var(--eimi-border);
    background:#fff;
    transition:.2s ease;
  }
  .eimi-post-card:hover{ box-shadow: var(--eimi-shadow); }
  .eimi-post-cover img{ width:100%; height: 210px; object-fit: cover; display:block; }
  .eimi-post-meta{
    display:flex; flex-wrap:wrap;
    gap:10px; align-items:center;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--eimi-muted);
  }
  .eimi-post-meta .dot{ width:6px; height:6px; border-radius:999px; background: var(--eimi-primary); display:inline-block; }
  .eimi-post-meta a{ color: var(--eimi-muted); text-decoration:none; }
  .eimi-post-meta a:hover{ color: var(--eimi-primary); }
  .eimi-post-title{ font-weight:900; margin:10px 0 8px; }
  .eimi-post-title a{ color: var(--eimi-text); text-decoration:none; }
  .eimi-post-title a:hover{ color: var(--eimi-primary); }
  .eimi-post-excerpt{ color: var(--eimi-muted); margin:0 0 10px; }
  .eimi-post-link{ color: var(--eimi-primary); font-weight: 900; text-decoration:none; }
  .eimi-post-link:hover{ text-decoration:underline; }
  
  /* Donate redesign */
  .eimi-quick3{ display:grid; gap:12px; }
  .eimi-quick3__item{
    display:flex; gap:12px; align-items:center;
    padding:14px; background:#fff; border:1px solid var(--eimi-border);
    border-radius: 16px;
  }
  .eimi-quick3__ico{
    width:44px; height:44px; border-radius: 14px;
    display:flex; align-items:center; justify-content:center;
    background: rgba(224,22,120,.10);
    color: var(--eimi-primary);
    font-size: 20px; flex: 0 0 auto;
  }
  .eimi-quick3__title{ font-weight: 900; line-height:1.1; }
  .eimi-quick3__text{ color: var(--eimi-muted); font-size: 14px; }
  
  .eimi-accordion .accordion-item{
    border:1px solid var(--eimi-border);
    border-radius: 16px;
    overflow:hidden;
    background:#fff;
    margin-bottom: 10px;
  }
  .eimi-accordion .accordion-button{
    font-weight: 900;
    color: var(--eimi-text);
    background:#fff;
  }
  .eimi-accordion .accordion-button:not(.collapsed){
    color: var(--eimi-primary);
    background: rgba(224,22,120,.06);
    box-shadow:none;
  }
  .eimi-accordion .accordion-body{ color: #5a4348; line-height: 1.7; }
  
  .eimi-note{
    display:flex; align-items:center; gap:10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px dashed rgba(224,22,120,.35);
    background: rgba(224,22,120,.06);
    color: var(--eimi-text);
    font-weight: 900;
  }
  .eimi-note i{ color: var(--eimi-primary); font-size:18px; }
  
  .eimi-cta2{
    background:#fff;
    border:1px solid var(--eimi-border);
    border-radius: 18px;
    padding: 22px;
    box-shadow: var(--eimi-shadow);
  }
  .eimi-cta2__top{ display:flex; gap:12px; align-items:flex-start; }
  .eimi-cta2__badge{
    width:46px; height:46px; border-radius: 16px;
    display:flex; align-items:center; justify-content:center;
    background: var(--eimi-primary);
    color:#fff; font-size: 18px; flex: 0 0 auto;
  }
  .eimi-cta2__title{ font-weight: 900; letter-spacing:-.3px; }
  .eimi-cta2__text{ color: var(--eimi-muted); line-height: 1.6; }
  
  .eimi-cta2__meta{
    display:grid; gap:8px;
    color: var(--eimi-muted);
    font-weight: 800;
    font-size: 14px;
  }
  .eimi-cta2__meta i{ color: var(--eimi-primary); margin-right: 8px; }
  
  /* Footer */
  .eimi-footer{
    background:#fff;
    border-top:1px solid var(--eimi-border);
  }
  .eimi-footer-logo{ height: 40px; width:auto; }
  .eimi-footer-link{ color: var(--eimi-muted); text-decoration:none; }
  .eimi-footer-link:hover{ color: var(--eimi-primary); text-decoration:underline; }
  
  .eimi-social{
    width:40px; height:40px; border-radius: 999px;
    background: var(--eimi-soft);
    border:1px solid var(--eimi-border);
    display:flex; align-items:center; justify-content:center;
    color: var(--eimi-primary);
    text-decoration:none;
  }
  .eimi-social:hover{ background: var(--eimi-primary); color:#fff; }
  
  .eimi-icon{ color: var(--eimi-primary); }
  .eimi-hr{ border-color: var(--eimi-border); opacity: 1; }
  
  /* Inputs look EIMI (sin romper Bootstrap) */
.eimi-input{
  border-radius:14px !important;
  border:1px solid var(--eimi-border) !important;
  padding:.8rem 1rem !important;
  background:#fff !important;
}

.eimi-input:focus{
  border-color: rgba(224,22,120,.45) !important;
  box-shadow: 0 0 0 .25rem rgba(224,22,120,.15) !important;
}

/* Optional: placeholder si no hay imagen */
.eimi-post-cover--placeholder{
  height:210px;
  background: linear-gradient(135deg, rgba(224,22,120,.10), rgba(0,0,0,.02));
}

/* eimi-help sin imagen */
.eimi-help--solo { display:block; }

/* =========================
   BANDAS DE TONO (SUAVE)
   ========================= */

/* 2 tonos suaves (nada de blanco pleno que corta) */
:root{
  --eimi-band-a: var(--eimi-bg); /* el que ya usás */
  --eimi-band-b: #ffffff;        /* blanco para descansar */
  --eimi-band-c: #f4f1f2;        /* suave, similar pero distinto al bg */
}

/* Banda: padding + borde suave + transiciones visuales */
.eimi-band{
  border-radius: 24px;
  padding: 26px;
  border: 1px solid rgba(0,0,0,.03);
}

/* Alternancia */
.eimi-band--a{ background: var(--eimi-band-a); }
.eimi-band--b{ background: var(--eimi-band-b); }
.eimi-band--c{ background: var(--eimi-band-c); }

/* Separación entre bandas */
.eimi-band + .eimi-band{
  margin-top: 22px;
}

/* En mobile, menos padding para que no se “inflen” */
@media (max-width: 576px){
  .eimi-band{ padding: 18px; border-radius: 20px; }
}