/* KAVITOR — publicas.css: capa R1 LIGERA para las páginas públicas SEO (precios, cómo funciona,
   materiales, montaje, software, contacto). Chrome kavitor + tipografía + neutralizaciones mínimas;
   el re-vestido fino por página (R2) se hará con el director de arte delante. */

/* Plex y fondo base en toda la página (Bootstrap imponía Segoe y su blanco) */
body.pub-page { font-family: var(--font-ui); background: var(--bg-base); }

/* Utilidades Bootstrap con !important → contadores TRANSICIONALES (excepción §8.3, mueren en R3) */
.pub-page .bg-light { background: var(--bg-surface) !important; }
.pub-page .text-primary { color: var(--selection-indicator) !important; }

/* Tarjetas de features (compartidas por varias públicas): superficie del sistema, sin teatro */
.pub-page .feature-card { background: var(--bg-raised); border: var(--bw-1) solid var(--border-subtle); border-radius: var(--radius-panel, 4px); box-shadow: none; }
.pub-page .feature-card:hover { transform: none; border-color: var(--border-strong); box-shadow: none; }

/* Los k-btn conviven con anchors legacy */
.pub-page a.k-btn, .pub-page a.k-btn:hover { text-decoration: none; }

/* ── Contacto (R2): ficha + formulario en superficie del sistema ── */
.kv-contact { display: grid; grid-template-columns: 5fr 7fr; gap: var(--sp-12); align-items: start; }
.kv-contact__info h1 { margin: var(--sp-4) 0; }
.kv-contact__info > p { color: var(--text-secondary); }
.kv-contact__facts { list-style: none; padding: 0; margin: var(--sp-8) 0; border-top: var(--bw-1) solid var(--border-subtle); }
.kv-contact__facts li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-5); padding: var(--sp-4) 0; border-bottom: var(--bw-1) solid var(--border-subtle); font-size: var(--fs-sm); }
.kv-contact__facts li > span:first-child { font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary); }
.kv-contact__facts a { color: var(--link); text-decoration: none; }
.kv-contact__facts a:hover { color: var(--text-primary); }
.kv-contact__note { font-size: var(--fs-sm); color: var(--text-secondary); border-left: var(--bw-2) solid var(--selection-indicator); padding-left: var(--sp-5); max-width: 46ch; }

.kv-form { display: grid; gap: var(--sp-6); background: var(--bg-surface); border: var(--bw-1) solid var(--border-subtle); border-radius: var(--radius-panel, 4px); padding: var(--sp-8); }
.kv-form__title { font-size: var(--fs-lg); font-weight: var(--fw-semibold); margin: 0 0 var(--sp-2); }
.kv-form__sub { font-size: var(--fs-sm); color: var(--text-secondary); margin: 0; }
.kv-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
.kv-form label { display: block; font-size: var(--fs-xs); color: var(--text-secondary); margin-bottom: var(--sp-2); }
.kv-form__opt { color: var(--text-muted); }
.kv-form input, .kv-form select, .kv-form textarea { width: 100%; background: var(--bg-sunken); border: var(--bw-1) solid var(--control-border, var(--border)); border-radius: var(--radius-control); color: var(--text-primary); font: inherit; font-size: 15px; padding: var(--sp-3) var(--sp-4); }
.kv-form input::placeholder, .kv-form textarea::placeholder { color: var(--text-muted); }
.kv-form input:focus, .kv-form select:focus, .kv-form textarea:focus { outline: var(--bw-2) solid var(--focus-ring); outline-offset: 1px; border-color: var(--border-strong); }
.kv-form__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5); flex-wrap: wrap; }
.kv-captcha { display: inline-flex !important; align-items: center; gap: var(--sp-3); margin: 0 !important; font-size: var(--fs-sm) !important; color: var(--text-secondary) !important; }
.kv-captcha__op { font-family: var(--font-mono); color: var(--text-primary); }
.kv-captcha input { width: 64px; text-align: center; font-family: var(--font-mono); }

.kv-restricted { display: grid; justify-items: center; text-align: center; gap: var(--sp-5); background: var(--bg-surface); border: var(--bw-1) solid var(--border-subtle); border-radius: var(--radius-panel, 4px); padding: var(--sp-12) var(--sp-8); }
.kv-restricted h2 { margin: 0; }
.kv-restricted p { color: var(--text-secondary); max-width: 52ch; }
.kv-restricted__actions { display: flex; gap: var(--sp-4); flex-wrap: wrap; justify-content: center; }

.kv-flash { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5); margin-bottom: var(--sp-5); border-radius: var(--radius-control); font-size: var(--fs-sm); border: var(--bw-1) solid var(--border); background: var(--bg-raised); color: var(--text-primary); }
.kv-flash--ok { border-color: color-mix(in srgb, var(--success) 45%, transparent); }
.kv-flash--ok i { color: var(--success); }
.kv-flash--err { border-color: color-mix(in srgb, var(--danger) 45%, transparent); }
.kv-flash--err i { color: var(--danger); }

@media (max-width: 880px) {
  .kv-contact, .kv-form__row { grid-template-columns: 1fr; }
}

/* ── Legal (R1+abrigo): nav lateral con selección CAD, tarjeta en superficie ── */
.pub-page .legal-nav { display: grid; gap: 2px; position: sticky; top: 80px; }
.pub-page .legal-nav-link { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border-radius: var(--radius-control); border-left: var(--bw-2) solid transparent; color: var(--text-secondary); text-decoration: none; font-size: var(--fs-sm); }
.pub-page .legal-nav-link:hover { background: var(--hover-bg); color: var(--text-primary); }
.pub-page .legal-nav-link.active { background: var(--selection-wash); border-left-color: var(--selection-indicator); color: var(--text-primary); font-weight: var(--fw-medium); }
.pub-page .legal-card { background: var(--bg-surface); border: var(--bw-1) solid var(--border-subtle); border-radius: var(--radius-panel, 4px); padding: var(--sp-10); }
.pub-page .legal-card h1 { font-size: var(--fs-2xl, 1.75rem); margin-bottom: var(--sp-3); }
.pub-page .legal-card h4, .pub-page .legal-card h5 { color: var(--text-primary); font-weight: var(--fw-semibold); margin: var(--sp-8) 0 var(--sp-4); font-size: var(--fs-md); }
.pub-page .legal-card p, .pub-page .legal-card li { color: var(--text-secondary); font-size: var(--fs-sm); line-height: 1.65; }
.pub-page .legal-card strong { color: var(--text-primary); }
.pub-page .legal-card a { color: var(--link); }
.pub-page .legal-updated { display: inline-block; font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); border: var(--bw-1) solid var(--border); border-radius: var(--radius-control); padding: 2px var(--sp-3); margin-bottom: var(--sp-6); }
.pub-page .legal-info-box { display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-4) var(--sp-5); margin-bottom: var(--sp-6); background: color-mix(in srgb, var(--warning) 10%, var(--bg-surface)); border: var(--bw-1) solid color-mix(in srgb, var(--warning) 40%, transparent); border-left: 3px solid var(--warning); border-radius: var(--radius-control); color: var(--text-primary); font-size: var(--fs-sm); }
.pub-page .legal-info-box i { color: var(--warning); }
.pub-page .legal-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.pub-page .legal-table th { font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary); text-align: left; padding: var(--sp-3) var(--sp-4); border-bottom: var(--bw-1) solid var(--border); }
.pub-page .legal-table td { padding: var(--sp-4); border-bottom: var(--bw-1) solid var(--border-subtle); color: var(--text-secondary); vertical-align: top; }
.pub-page .legal-table code { font-family: var(--font-mono); color: var(--selection-indicator); background: var(--bg-sunken); padding: 1px var(--sp-2); border-radius: var(--radius-tight, 2px); }
.pub-page .legal-wrapper { padding: var(--sp-12) 0; }

/* Aviso de beta en Planes (mensaje del regalo de bienvenida, dinámico desde BD) */
.kv-beta-note {
    max-width: 760px;
    margin: 0 auto var(--sp-7);
    padding: var(--sp-4) var(--sp-6);
    background: color-mix(in srgb, var(--action-primary-bg) 10%, var(--bg-surface));
    border: var(--bw-1) solid color-mix(in srgb, var(--action-primary-bg) 35%, transparent);
    border-radius: var(--radius-panel, 8px);
    color: var(--text-primary);
    font-size: var(--fs-sm);
    line-height: 1.55;
    text-align: center;
}
.kv-beta-note__tag {
    display: inline-block;
    background: var(--action-primary-bg);
    color: var(--on-accent);
    font-size: var(--fs-micro);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 2px var(--sp-3);
    border-radius: 999px;
    margin-right: var(--sp-2);
    vertical-align: 1px;
}