/* solicitud_online.html (la base del formulario está en main.css) */

.so{background:var(--bg)}
.so-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,4vw,3.5rem);align-items:start}
.so-intro h2{color:var(--brand-dark);font-size:clamp(1.6rem,2.6vw,2.1rem);margin-bottom:.75rem}
:root[data-theme="dark"] .so-intro h2{color:var(--brand-light)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .so-intro h2{color:var(--brand-light)}}
.so-intro>p{color:var(--muted)}

/* Datos de contacto */
.so-contact{list-style:none;margin:2rem 0 0;padding:0;display:grid;gap:1.2rem}
.so-contact li{display:flex;align-items:center;gap:18px}
.so-contact svg{width:28px;height:28px;flex:none;fill:none;stroke:var(--brand-dark);stroke-width:2;stroke-linejoin:miter}
:root[data-theme="dark"] .so-contact svg{stroke:var(--brand-light)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .so-contact svg{stroke:var(--brand-light)}}
.so-contact strong{display:block;font-weight:600}
.so-contact span{display:block;color:var(--muted)}

@media (max-width:900px){
  .so-layout{grid-template-columns:1fr}
}