/* Cumple21: programa de socios (página pública, acceso y panel del socio). Se carga después de landing.css. */
.so-hero .wrap { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
@media (max-width: 960px) { .so-hero .wrap { grid-template-columns: minmax(0, 1fr); } }
.so-cifras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.so-cifras div { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 14px; padding: 1.1rem 1.2rem; }
.so-cifras b { display: block; color: #fff; font-size: 2rem; font-weight: 800; line-height: 1.1; letter-spacing: -0.02em; }
.so-cifras span { display: block; margin-top: .3rem; color: rgba(255,255,255,.75); font-size: .92rem; }
.so-pasos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) { .so-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .so-pasos { grid-template-columns: minmax(0, 1fr); } }
.so-ejemplo { margin-top: 2rem; background: var(--primary-soft); border-radius: 14px; padding: 1.2rem 1.4rem; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; align-items: baseline; color: var(--ink); }
.so-ejemplo b { font-size: 1.35rem; font-weight: 800; }
.so-ejemplo small { color: var(--body); font-size: .88rem; flex-basis: 100%; }
.so-para { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 2rem; }
@media (max-width: 860px) { .so-para { grid-template-columns: minmax(0, 1fr); } }
.so-para div { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1.1rem 1.2rem; }
.so-para h3 { font-size: 1.05rem; margin-bottom: .35rem; }
.so-para p { margin: 0; font-size: .95rem; }

.so-postular { display: grid; grid-template-columns: minmax(0, 19rem) minmax(0, 1fr); gap: 3rem; align-items: start; }
@media (max-width: 860px) { .so-postular { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; } }
.so-postular .intro p { margin: .8rem 0 0; }

/* Cajas y formularios */
.so-caja { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: clamp(1.2rem, 3vw, 2rem); box-shadow: 0 1px 2px rgba(15,31,61,.04); min-width: 0; }
.so-caja form, form.so-form { display: grid; gap: 1rem; }
.so-dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
@media (max-width: 560px) { .so-dos { grid-template-columns: minmax(0, 1fr); } }
.so-campo { display: grid; gap: .35rem; min-width: 0; }
.so-campo label { font-weight: 600; font-size: .9rem; color: var(--ink); }
.so-campo label i { font-style: normal; font-weight: 400; color: var(--muted); }
.so-campo input, .so-campo select, .so-campo textarea { font: 400 1rem var(--font); color: var(--ink); background: #fff; border: 1px solid #CBD3E1; border-radius: 10px; padding: .65rem .8rem; width: 100%; min-width: 0; }
.so-campo textarea { resize: vertical; min-height: 6rem; }
.so-campo input:focus, .so-campo select:focus, .so-campo textarea:focus { outline: 3px solid rgba(42,95,193,.25); border-color: var(--primary); }
.so-campo.error input, .so-campo.error select, .so-campo.error textarea { border-color: var(--red); }
.so-campo small { color: var(--red); font-size: .84rem; }
.so-campo .ayuda { color: var(--muted); font-size: .84rem; margin: 0; }
.so-casilla { display: flex; gap: .55rem; align-items: flex-start; font-size: .92rem; }
.so-casilla input { margin-top: .25rem; accent-color: var(--primary); width: 1rem; height: 1rem; flex: none; }
.so-casilla.error { color: var(--red); }
.so-errores { background: var(--red-soft); color: #7A2414; border-radius: 10px; padding: .7rem .9rem; font-size: .92rem; }
.so-estado { background: #E6F3EC; color: #1F5C42; border-radius: 10px; padding: .7rem .9rem; font-size: .92rem; }
.so-legal { margin: 0; font-size: .82rem; color: var(--muted); }
.so-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.so-ok h2 { font-size: 1.5rem; color: #1F7A4C; margin-bottom: .6rem; }
.so-ok p { margin: 0 0 .9rem; }
form .btn { justify-self: start; }
fieldset.so-grupo { border: 0; margin: 0; padding: 0; display: grid; gap: 1rem; }
fieldset.so-grupo legend { font-weight: 800; color: var(--ink); font-size: 1.05rem; padding: 0; margin-bottom: .2rem; }

/* Páginas de acceso (activar, ingresar, clave) */
.so-acceso { background: var(--bg); padding: clamp(2rem, 6vw, 4rem) 0 4rem; min-height: calc(100vh - 68px - 160px); }
.so-acceso .so-caja { max-width: 34rem; margin: 0 auto; }
.so-acceso .so-caja.ancha { max-width: 44rem; }
.so-acceso h1 { font-size: clamp(1.6rem, 3.4vw, 2rem); font-weight: 800; line-height: 1.15; margin-bottom: .5rem; }
.so-acceso p.lead { margin: 0 0 1.2rem; }
.so-codigo { display: inline-block; font: 700 .95rem ui-monospace, Menlo, monospace; background: var(--primary-soft); color: var(--primary); padding: .2rem .55rem; border-radius: 6px; }
.so-enlaces { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; font-size: .92rem; }

/* Términos */
.so-doc { max-width: 52rem; }
.so-doc h1 { font-size: clamp(1.9rem, 4vw, 2.5rem); font-weight: 800; line-height: 1.12; margin-bottom: .6rem; }
.so-doc h2 { font-size: 1.2rem; margin: 2rem 0 .5rem; }
.so-doc p, .so-doc li { font-size: 1rem; }
.so-doc ol, .so-doc ul { padding-left: 1.3rem; }
.so-doc .version { color: var(--muted); font-size: .9rem; }

/* Panel del socio */
.so-panel { background: var(--bg); padding: 2rem 0 4rem; }
.so-panel-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.4rem; }
.so-panel-cab h1 { font-size: clamp(1.6rem, 3.4vw, 2.1rem); font-weight: 800; }
.so-panel-cab p { margin: .25rem 0 0; color: var(--muted); }
.so-enlace { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem 1rem; align-items: center; }
@media (max-width: 640px) { .so-enlace { grid-template-columns: minmax(0, 1fr); } }
.so-enlace code { display: block; font: 600 .98rem ui-monospace, Menlo, monospace; color: var(--ink); background: #F6F8FC; border: 1px solid var(--line); border-radius: 10px; padding: .7rem .85rem; overflow-wrap: anywhere; }
.so-enlace .acciones { display: flex; flex-wrap: wrap; gap: .5rem; }
.so-enlace p { grid-column: 1 / -1; margin: 0; font-size: .88rem; color: var(--muted); }
.so-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0; }
@media (max-width: 900px) { .so-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .so-kpis { grid-template-columns: minmax(0, 1fr); } }
.so-kpi { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.1rem; min-width: 0; }
.so-kpi small { display: block; color: var(--muted); font-size: .82rem; font-weight: 600; }
.so-kpi b { display: block; font-size: 1.7rem; font-weight: 800; color: var(--ink); line-height: 1.15; margin-top: .2rem; letter-spacing: -0.02em; }
.so-kpi span { font-size: .84rem; }
.so-kpi.oscuro { background: var(--navy); border-color: var(--navy); }
.so-kpi.oscuro small { color: #F6D98D; } .so-kpi.oscuro b { color: #fff; } .so-kpi.oscuro span { color: #C8D4EA; }
.so-bloque { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.2rem 1.3rem; margin-bottom: 1rem; min-width: 0; }
.so-bloque h2 { font-size: 1.1rem; font-weight: 800; margin-bottom: .8rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem; align-items: baseline; }
.so-bloque h2 span { font-size: .86rem; font-weight: 500; color: var(--muted); }
.so-cols { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
@media (max-width: 900px) { .so-cols { grid-template-columns: minmax(0, 1fr); } }
.so-tabla { overflow-x: auto; }
.so-tabla table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.so-tabla th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 700; padding: .5rem .6rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
.so-tabla td { padding: .65rem .6rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.so-tabla tr:last-child td { border-bottom: 0; }
.so-tabla .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.so-st { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 700; padding: .18rem .5rem; border-radius: 6px; white-space: nowrap; }
.so-st::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.so-st.ok { background: #E6F3EC; color: #2E7D5B; } .so-st.pr { background: var(--primary-soft); color: var(--primary); } .so-st.no { background: var(--bg); color: var(--muted); }
.so-vacio { color: var(--muted); margin: 0; font-size: .93rem; }
.so-lista { list-style: none; margin: 0; padding: 0; }
.so-lista li { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-top: 1px solid var(--line); font-size: .93rem; }
.so-lista li:first-child { border-top: 0; padding-top: 0; }
.so-lista b { color: var(--ink); font-variant-numeric: tabular-nums; }
.so-lista small { display: block; color: var(--muted); }
.so-datos dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .35rem 1rem; margin: 0 0 .8rem; font-size: .93rem; }
.so-datos dt { color: var(--muted); }
.so-datos dd { margin: 0; color: var(--ink); font-weight: 600; }
.so-datos details summary { cursor: pointer; color: var(--primary); font-weight: 600; font-size: .93rem; }
.so-datos details[open] summary { margin-bottom: .8rem; }
.so-aviso { background: var(--amber-soft); color: #5A3D08; border-radius: 10px; padding: .7rem .9rem; font-size: .9rem; margin: 0 0 .8rem; }
.so-salir { display: inline; margin: 0; }
.so-salir button { background: none; border: 0; padding: 0; font: inherit; color: #D3DDF0; cursor: pointer; font-weight: 500; font-size: .95rem; }
.so-salir button:hover { color: #fff; }
.so-pie-panel { font-size: .85rem; color: var(--muted); margin: 1.2rem 0 0; }