/* =====================================================================
   3K AdoptaDog 2026 — MEJORAS C
   1. Barra fija Inscríbete / Dona (celular y escritorio)
   2. #patrocinadores: foto del stand a sangre + insignia de patrocinador
   Va después de mejoras-b.css. Solo usa tokens existentes.
   ===================================================================== */

/* ---------- 1. Barra fija Inscríbete / Dona ---------- */
.mobile-cta__actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.mobile-cta__donate { gap: .4em; padding-inline: 1em; border-width: 2px; }
.mobile-cta__donate svg { width: 1.05em; height: 1.05em; fill: currentColor; color: var(--c-gold-200); transition: color var(--dur-fast, .2s); }
.mobile-cta__donate:hover svg, .mobile-cta__donate:focus-visible svg { color: var(--c-red-500); }

/* Celular angosto: se quita la info para que quepan los dos botones */
@media (max-width: 419px) {
  .mobile-cta { padding: 8px; justify-content: center; }
  .mobile-cta__info { display: none; }
  .mobile-cta__actions { width: 100%; }
  .mobile-cta__actions .btn { flex: 1 1 0; padding-inline: .8em; }
}

/* Escritorio: píldora flotante abajo a la derecha (antes solo existía en celular) */
@media (min-width: 1024px) {
  .mobile-cta {
    display: flex;
    left: auto; right: 24px; bottom: 24px;
    gap: 18px; padding: 8px 8px 8px 24px;
    border: 1px solid rgba(255, 255, 255, .12);
  }
  .mobile-cta__info strong { font-size: var(--step-0); }
}

/* ---------- 2. #patrocinadores ---------- */
#patrocinadores .invite__art {
  padding: 0;
  align-content: stretch;
  min-height: 300px;
}
#patrocinadores .invite__art::before { display: none; }
#patrocinadores .invite__art > picture {
  position: relative; width: 100%; max-width: none; height: 100%;
  aspect-ratio: 4 / 3; border-radius: inherit; overflow: hidden;
}
#patrocinadores .invite__art picture img {
  width: 100%; height: 100%; object-fit: cover; object-position: 38% 55%;
  border: 0; border-radius: inherit; transform: none; box-shadow: none;
}
/* Velo cálido abajo para asentar la insignia */
#patrocinadores .invite__art > picture::after {
  content: ""; position: absolute; inset: 55% 0 0 0; pointer-events: none;
  background: linear-gradient(to top, rgba(74, 6, 16, .55), transparent);
}

/* Insignia: sello dorado "Patrocinador oficial" */
#patrocinadores .invite__art .c-seal {
  position: absolute; z-index: 2;
  left: clamp(12px, 2.2vw, 26px); bottom: clamp(12px, 2.2vw, 26px);
  width: clamp(104px, 7rem + 2vw, 150px); height: auto;
  filter: drop-shadow(0 14px 22px rgba(30, 2, 6, .45));
  transform: rotate(-10deg);
}
.c-seal__outer { fill: var(--c-gold-500); }
.c-seal__ring { fill: var(--c-red-700); }
.c-seal__inner { fill: var(--c-gold-200); stroke: var(--c-gold-600); stroke-width: 2; stroke-dasharray: 3 4; }
.c-seal__text {
  fill: var(--c-gold-100);
  font-family: var(--font-display); font-weight: 600; font-size: 13.4px; letter-spacing: 1.4px;
}
.c-seal__paw { fill: var(--c-red-700); }

@media (prefers-reduced-motion: no-preference) {
  .c-seal__text { transform-box: view-box; transform-origin: 50% 50%; animation: c-seal-spin 40s linear infinite; }
}
@keyframes c-seal-spin { to { transform: rotate(360deg); } }

@media (min-width: 900px) {
  /* La foto llena toda la altura del panel izquierdo */
  #patrocinadores .invite { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #patrocinadores .invite__art > picture { aspect-ratio: auto; position: absolute; inset: 0; }
}
@media (max-width: 899px) {
  #patrocinadores .invite__art { min-height: 0; }
  #patrocinadores .invite__art > picture { max-width: none; }
  /* En la foto horizontal los perritos quedan abajo a la izquierda: el sello va al cielo */
  #patrocinadores .invite__art .c-seal { left: auto; bottom: auto; right: 12px; top: 12px; width: clamp(84px, 22vw, 120px); transform: rotate(10deg); }
}
