/* Página /diagnostico: aterrizaje de anuncios y de la biografía de Instagram.
   El formulario se abre solo al cargar (analisis.js); esto es lo que queda detrás si se cierra:
   la promesa, los tres pasos y qué se revisa, con un botón para volver a abrirlo.
   Misma base visual que gracias.css. Sin estilos en línea: el CSP no los permite. */
.dg { background:#f4f8ff; }
.dg-hero { padding:clamp(72px,11vw,150px) 0 clamp(56px,8vw,110px); text-align:center; color:#fff; background:radial-gradient(760px 420px at 85% -10%, rgba(0,153,255,.36), transparent 62%), radial-gradient(640px 400px at -5% 110%, rgba(91,76,245,.32), transparent 60%), #040720; }
.dg-wrap { width:100%; max-width:780px; margin:0 auto; padding:0 24px; }
.dg-kicker { display:inline-block; margin-bottom:18px; color:#8fc3ff; font:700 .72rem/1.2 'JetBrains Mono',monospace; letter-spacing:.14em; text-transform:uppercase; }
.dg-hero h1 { margin:0 0 18px; color:#fff; font-size:clamp(2.1rem,5.4vw,3.8rem); line-height:1.04; letter-spacing:-.05em; }
.dg-lead { max-width:620px; margin:0 auto 30px; color:#c7d3f2; font-size:clamp(1.05rem,1.8vw,1.22rem); line-height:1.62; }
.dg-actions { display:flex; flex-wrap:wrap; gap:14px 24px; align-items:center; justify-content:center; }
.dg-link { color:#c7d3f2; font-weight:600; text-decoration:underline; text-underline-offset:4px; }
.dg-link:hover { color:#fff; }
.dg-link:focus-visible { outline:3px solid #8fc3ff; outline-offset:3px; border-radius:4px; }
.dg-steps { padding:clamp(44px,6vw,80px) 0 clamp(28px,4vw,48px); }
.dg-what { padding:0 0 clamp(56px,8vw,100px); }
.dg-title { max-width:1040px; margin:0 auto; padding:0 24px; }
.dg-title h2 { margin:0 0 18px; font:700 .74rem 'JetBrains Mono',monospace; letter-spacing:.12em; text-transform:uppercase; color:#4a5a80; }
.dg-list, .dg-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:1040px; margin:0 auto; padding:0 24px; list-style:none; }
.dg-list li, .dg-grid li { padding:20px 22px; border-radius:16px; background:#fff; border:1px solid #dbe5f7; color:#0a1024; }
.dg-num { display:inline-grid; place-items:center; width:30px; height:30px; margin-bottom:12px; border-radius:50%; background:#e6f0ff; color:#146cff; font:700 .85rem 'JetBrains Mono',monospace; }
.dg-list b, .dg-grid b { display:block; margin-bottom:4px; font-size:1.05rem; letter-spacing:-.02em; }
.dg-list p, .dg-grid p { margin:0; color:#566176; font-size:.9rem; line-height:1.5; }
.dg-note { max-width:1040px; margin:22px auto 0; padding:0 24px; color:#566176; font-size:.95rem; line-height:1.55; }
.dg-note a { color:#146cff; font-weight:600; }
.dg-again { max-width:1040px; margin:28px auto 0; padding:0 24px; text-align:center; }
@media (max-width: 900px) { .dg-list, .dg-grid { grid-template-columns:1fr 1fr; } }
@media (max-width: 600px) { .dg-list, .dg-grid { grid-template-columns:1fr; } }