/* ── 2. Popup modal base ── */
    .pest-modal-backdrop {
      position: fixed; inset: 0; z-index: 1200;
      background: rgba(5,18,10,0.72);
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
      display: flex; align-items: center; justify-content: center; padding: 1rem;
      opacity: 0; pointer-events: none; transition: opacity 0.25s ease;
    }
    .pest-modal-backdrop.open { opacity: 1; pointer-events: all; }
 
    .pest-modal {
      background: #fff; border-radius: 20px;
      box-shadow: 0 24px 80px rgba(0,0,0,0.3);
      width: 100%; max-width: 480px; overflow: hidden;
      transform: translateY(20px) scale(0.97);
      transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
      max-height: 92vh; overflow-y: auto;
    }
    .pest-modal-backdrop.open .pest-modal { transform: translateY(0) scale(1); }
 
    /* Header — plaga (amarillo) */
    .pest-modal-header {
      display: flex; align-items: center; gap: 1rem;
      padding: 1.25rem 1.5rem; background: #ffde00; position: relative;
    }
    /* Header — incendios (rojo) */
    .pest-modal-header.fire {
      background: linear-gradient(135deg, rgba(239,68,68,0.15), rgba(251,146,60,0.12));
      border-bottom: 2px solid rgba(239,68,68,0.2);
    }
    .pest-modal-header.fire h3 { color: #7f1d1d; }
    .pest-modal-header.fire p  { color: #b91c1c; opacity: 0.8; }
 
    .pest-modal-img { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
    .pest-modal-header h3 {
      font-family: 'Sen', sans-serif; font-size: 1.2rem; font-weight: 800;
      color: #0d2b1a; margin: 0; line-height: 1.2;
    }
    .pest-modal-header p { font-size: 0.78rem; color: rgba(13,43,26,0.65); margin: 0.2rem 0 0; }
    .pest-modal-close {
      position: absolute; top: 0.75rem; right: 0.9rem;
      width: 30px; height: 30px; border-radius: 50%; border: none;
      background: rgba(13,43,26,0.12); color: #0d2b1a;
      font-size: 0.9rem; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background 0.2s; line-height: 1;
    }
    .pest-modal-close:hover { background: rgba(13,43,26,0.22); }
 
    .pest-modal-body { padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; }
    .pest-modal-desc { font-size: 0.9rem; color: #3d5247; line-height: 1.65; margin: 0; }
 
    .pest-modal-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
    .pest-modal-tag {
      font-size: 0.7rem; font-weight: 600; padding: 0.3rem 0.75rem;
      border-radius: 30px; background: #f0fdf4; color: #2d6b40;
      border: 1px solid #bbf7d0; text-transform: uppercase; letter-spacing: 0.04em;
    }
    .pest-modal-tag.fire { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
 
    .pest-modal-tips {
      background: #f8f9f7; border-radius: 10px;
      padding: 1rem 1.1rem; border-left: 3px solid #4caf70;
    }
    .pest-modal-tips.fire { border-left-color: #ef4444; }
    .pest-modal-tips-title {
      font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.07em; color: #2d6b40; margin-bottom: 0.5rem;
    }
    .pest-modal-tips.fire .pest-modal-tips-title { color: #b91c1c; }
    .pest-modal-tips ul { margin: 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: 0.3rem; }
    .pest-modal-tips ul li { font-size: 0.83rem; color: #3d5247; line-height: 1.5; }
 
    .pest-modal-cta { display: flex; gap: 0.75rem; flex-wrap: wrap; }
    .pest-modal-cta a {
      flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
      padding: 0.7rem 1rem; border-radius: 30px; font-size: 0.85rem; font-weight: 600;
      text-decoration: none; transition: all 0.2s; white-space: nowrap;
    }
    .pest-modal-cta .cta-primary { background: #0d2b1a; color: #fff; }
    .pest-modal-cta .cta-primary:hover { background: #2d6b40; transform: translateY(-1px); }
    .pest-modal-cta .cta-wa { background: #25d366; color: #fff; }
    .pest-modal-cta .cta-wa:hover { background: #1da851; transform: translateY(-1px); }
 
    /* Clickable cursors */
    .pest-card { cursor: pointer; }
    .ext-type-row[data-popup-title],
    .acc-item[data-popup-title] { cursor: pointer; }
    .ext-type-row[data-popup-title]:hover {
      border-color: rgba(239,68,68,0.5) !important;
      background: rgba(239,68,68,0.06) !important;
    }
    .acc-item[data-popup-title]:hover {
      border-color: rgba(239,68,68,0.4) !important;
      box-shadow: 0 4px 10px rgba(239,68,68,0.12);
    }