/* Orfeo IT · web pública del producto (landing, precios). Sin dependencias externas; claro/oscuro; responsive. */
:root {
    --bg: #f6f8ff; --panel: #ffffff; --panel2: #eef2fd; --border: #d9e0f3; --text: #151c36; --muted: #5a6486;
    --accent: #2f5fe0; --accent-txt: #ffffff; --warm: #c0614a; --sombra: 0 10px 30px rgba(32, 52, 120, .10);
}
@media (prefers-color-scheme: dark) {
    :root { --bg: #0b1230; --panel: #121a3d; --panel2: #0f1736; --border: #26325f; --text: #e8ecff; --muted: #9aa5cf; --accent: #6b93ff; --accent-txt: #0b1230; --sombra: 0 10px 30px rgba(0, 0, 0, .35); }
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: clamp(2rem, 5vw, 3.4rem); letter-spacing: -.02em; }
h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); text-align: center; }
h3 { font-size: 1.15rem; }
.saltar { position: absolute; left: -999px; top: 8px; background: var(--accent); color: var(--accent-txt); padding: 8px 14px; border-radius: 8px; z-index: 100; }
.saltar:focus { left: 8px; }
.pub-ancho { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
.pub-estrecho { max-width: 760px; }

.pub-cab { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); }
.pub-cab-in { display: flex; align-items: center; gap: 20px; min-height: 62px; }
.pub-marca { display: flex; align-items: center; gap: 8px; color: var(--text); text-decoration: none; font-size: 1.2rem; font-weight: 600; }
.pub-marca b { font-weight: 800; }
.pub-nav { display: flex; gap: 4px; flex: 1; }
.pub-nav-enlace { color: var(--muted); text-decoration: none; padding: 8px 12px; border-radius: 8px; font-size: .95rem; }
.pub-nav-enlace:hover, .pub-nav-enlace.activo { color: var(--text); background: var(--panel2); }
.pub-acciones { display: flex; align-items: center; gap: 8px; }
.pub-idioma { color: var(--muted); text-decoration: none; font-size: .9rem; padding: 6px 10px; border-radius: 8px; border: 1px solid var(--border); }

.pub-btn { display: inline-block; background: var(--accent); color: var(--accent-txt); text-decoration: none; font-weight: 600; padding: 9px 18px; border-radius: 10px; border: 1px solid var(--accent); cursor: pointer; font-size: .95rem; }
.pub-btn:hover { filter: brightness(1.08); }
.pub-btn-sec { background: transparent; color: var(--text); border-color: var(--border); }
.pub-btn-grande { padding: 13px 26px; font-size: 1.05rem; }
.pub-btn:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: 2px; }

.pub-hero { padding: 84px 0 64px; text-align: center; background: radial-gradient(900px 400px at 50% -10%, color-mix(in srgb, var(--accent) 18%, transparent), transparent); }
.pub-hero-corto { padding: 56px 0 24px; }
.pub-sobre { color: var(--warm); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .8rem; margin: 0 0 12px; }
.pub-lead { font-size: 1.2rem; color: var(--muted); max-width: 680px; margin: 0 auto 28px; }
.pub-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.pub-nota { text-align: center; color: var(--muted); font-size: .9rem; margin: 18px 0 0; }

.pub-seccion { padding: 72px 0; }
.pub-alt { background: var(--panel2); }
.pub-sub { text-align: center; color: var(--muted); max-width: 640px; margin: 0 auto 32px; }
.pub-rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; margin-top: 32px; }
.pub-tarjeta { background: var(--panel); border: 1px solid var(--border); border-radius: 16px; padding: 24px; box-shadow: var(--sombra); }
.pub-tarjeta p { margin: 0; color: var(--muted); }

.pub-pasos { list-style: none; counter-reset: p; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; padding: 0; margin: 32px 0 0; }
.pub-pasos li { counter-increment: p; background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 4px; }
.pub-pasos li::before { content: counter(p); width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color: var(--accent-txt); display: flex; align-items: center; justify-content: center; font-weight: 700; margin-bottom: 6px; }
.pub-pasos span { color: var(--muted); font-size: .92rem; }

.pub-planes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; align-items: stretch; }
.pub-plan { position: relative; background: var(--panel); border: 1px solid var(--border); border-radius: 18px; padding: 28px 24px; display: flex; flex-direction: column; gap: 6px; }
.pub-plan.destacado { border-color: var(--accent); box-shadow: var(--sombra); }
.pub-etiqueta { position: absolute; top: -12px; left: 24px; background: var(--accent); color: var(--accent-txt); font-size: .75rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.pub-precio { margin: 4px 0 0; }
.pub-precio b { font-size: 2.4rem; letter-spacing: -.02em; }
.pub-precio span { color: var(--muted); margin-left: 4px; }
.pub-precio-anual { margin: 0; color: var(--muted); font-size: .9rem; }
.pub-plan ul { list-style: none; padding: 0; margin: 14px 0 20px; flex: 1; }
.pub-plan li { padding: 5px 0 5px 24px; position: relative; font-size: .95rem; }
.pub-plan li::before { content: "✓"; position: absolute; left: 0; color: var(--accent); font-weight: 700; }
.pub-plan .pub-btn { text-align: center; }
.pub-lista { padding-left: 20px; }
.pub-lista li { padding: 4px 0; }

details { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px 18px; margin-bottom: 10px; }
summary { cursor: pointer; font-weight: 600; }
details p { color: var(--muted); margin: 10px 0 0; }

.pub-final { text-align: center; }
.pub-final h2 { margin-bottom: 20px; }

.pub-pie { border-top: 1px solid var(--border); padding: 36px 0; color: var(--muted); font-size: .92rem; }
.pub-pie-in { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }
.pub-pie nav { display: flex; flex-direction: column; gap: 6px; }
.pub-pie p { margin: 4px 0 0; }
.pub-copy { grid-column: 1 / -1; }

@media (max-width: 760px) {
    .pub-nav { display: none; }
    .pub-cab-in { gap: 10px; }
    .pub-acciones { margin-left: auto; }
    .pub-acciones .pub-btn-sec { display: none; }
    .pub-hero { padding: 56px 0 44px; }
    .pub-seccion { padding: 52px 0; }
    .pub-pie-in { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Alta de empresa */
.pub-form fieldset { border: 1px solid var(--border); border-radius: 16px; background: var(--panel); padding: 20px 22px 22px; margin: 0 0 18px; }
.pub-form legend { font-weight: 700; padding: 0 8px; }
.pub-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pub-ancho2 { grid-column: 1 / -1; }
.pub-campo { display: flex; flex-direction: column; gap: 4px; }
.pub-campo label { font-size: .9rem; font-weight: 600; }
.pub-campo input, .pub-campo select { font: inherit; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg); color: var(--text); }
.pub-campo input:focus-visible, .pub-campo select:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 1px; }
.pub-campo small, .pub-nota-form { color: var(--muted); font-size: .85rem; }
.pub-opciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-bottom: 10px; }
.pub-opcion { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; cursor: pointer; background: var(--bg); }
.pub-opcion:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.pub-opcion:has(input:disabled) { opacity: .5; cursor: not-allowed; }
.pub-opcion-cuerpo { display: flex; flex-direction: column; gap: 2px; }
.pub-opcion-cuerpo small { color: var(--muted); }
.pub-resumen { font-weight: 600; margin: 8px 0 2px; }
.pub-check { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; font-size: .92rem; }
.pub-error, .pub-ok { border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; font-weight: 600; }
.pub-error { background: color-mix(in srgb, #d64545 14%, var(--panel)); border: 1px solid #d64545; }
.pub-ok { background: color-mix(in srgb, #2f9e63 14%, var(--panel)); border: 1px solid #2f9e63; }
@media (max-width: 620px) { .pub-cols { grid-template-columns: 1fr; } }
