/* Scope por contenedor para no afectar al resto del sitio */
#agents-landing { --brand: #005ad6; --border: #222428; --muted: #9aa1ab; --text: #eaeef5; }
#agents-landing .ag-container { max-width: 1120px; margin: 0 auto; padding: 32px 16px; }

#agents-landing .ag-muted { color: var(--muted); }
#agents-landing .ag-small { font-size: 12px; }
#agents-landing .ag-tiny { font-size: 11px; }

#agents-landing .ag-hero { text-align:center; margin-bottom: 28px; }
#agents-landing .ag-bordered { border:1px solid var(--border); border-radius: 24px; }
#agents-landing .ag-hero.ag-bordered { padding: 40px 20px; background: linear-gradient(135deg, rgba(255,255,255,0.03), transparent); }
#agents-landing .ag-hero__inner { max-width: 720px; margin: 0 auto; padding: 32px 16px;}
#agents-landing .ag-hero h1 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 8px; }

#agents-landing .ag-section { margin-top: 18px;; padding: 32px 16px; }
#agents-landing .ag-section__head { display:flex; align-items: flex-end; justify-content: space-between; margin-bottom: 12px; }
#agents-landing .ag-section__head h2 { font-size: 22px; margin: 0; }

#agents-landing .ag-grid { display:grid; gap: 16px; grid-template-columns: repeat(1, minmax(0,1fr)); }
@media (min-width: 640px){ #agents-landing .ag-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px){ #agents-landing .ag-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); } }

#agents-landing .ag-card { border:1px solid var(--border); border-radius: 18px; background: rgba(255,255,255,0.02); }
#agents-landing .ag-card__head { display:flex; gap:14px; padding:16px 16px 4px; }
#agents-landing .ag-card__body { padding: 0 16px 16px; }
#agents-landing .ag-card__titles h3 { margin:0; font-size: 18px; }
#agents-landing .ag-card__titles p { margin:4px 0 0; }

#agents-landing .ag-icon.ag-dot { background: rgba(0,0,0,.25); border:1px solid var(--border); border-radius: 12px; width: 42px; height: 42px; display:grid; place-items:center; color: var(--brand); }

#agents-landing .ag-row { display:flex; align-items:center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

#agents-landing .ag-btn { appearance:none; border:1px solid var(--border); background: transparent; color: inherit; border-radius: 12px; padding: 10px 14px; cursor:pointer; }
#agents-landing .ag-btn:hover { border-color: #2b2f36; }
#agents-landing .ag-btn--primary { background: var(--brand); border-color: var(--brand); color: white; }
#agents-landing .ag-btn--primary:hover { filter: brightness(1.05); }

#agents-landing .ag-details { padding: 16px; }
#agents-landing .ag-details__summary { display:flex; align-items:center; justify-content: space-between; list-style:none; cursor:pointer; }
#agents-landing .ag-details__title { font-weight: 600; font-size: 20px; }
#agents-landing .ag-details__hint { color: var(--muted); font-size: 13px; }

#agents-landing .ag-plans { display:grid; gap: 16px; margin-top: 16px; grid-template-columns: repeat(1, minmax(0,1fr)); }
@media (min-width: 640px){ #agents-landing .ag-plans{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 900px){ #agents-landing .ag-plans{ grid-template-columns: repeat(3, minmax(0,1fr)); } }

#agents-landing .ag-card--accent { border-color: rgba(0,90,214,0.15); }
#agents-landing .ag-card--strong { border-color: rgba(0,90,214,0.30); }
#agents-landing .ag-list { margin:0; padding-left: 18px; display:grid; gap: 6px; }
#agents-landing .ag-pill { font-size: 11px; color: var(--brand); background: rgba(0,90,214,0.12); padding: 2px 8px; border-radius: 999px; }

#agents-landing .ag-note { margin-top: 8px; }

/* Apariencia botón deshabilitado en /agents */
#agents-landing .ag-btn:disabled,
#agents-landing .ag-btn[aria-disabled="true"] {
  opacity: .5;
  cursor: not-allowed;
  background: rgba(0,0,0,.15);
  border-color: #2b2f36;
}