*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --acento: #059669;
    --acento-hover: #047857;
    --acento-light: rgba(5, 150, 105, 0.06);
    --fondo: #f8f9fb;
    --blanco: #ffffff;
    --texto: #0f172a;
    --texto-sec: #64748b;
    --texto-hint: #94a3b8;
    --borde: #e2e8f0;
    --borde-focus: #cbd5e1;
    --muted: #f1f5f9;
    --exito: #059669;
    --exito-fondo: #ecfdf5;
    --error: #dc2626;
    --error-fondo: #fef2f2;
    --sombra: 0 1px 2px rgba(0,0,0,0.04);
    --sombra-card: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --sombra-md: 0 4px 12px rgba(0,0,0,0.06);
    --radio: 8px;
    --radio-sm: 6px;
    --trans: 0.15s ease;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background: var(--fondo);
    color: var(--texto);
    line-height: 1.5;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
}

.container { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem; }

.header { display: flex; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.logo { height: 44px; width: auto; object-fit: contain; flex-shrink: 0; }
.empresa-info h1 { font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }
.empresa-info p { font-size: 0.8125rem; color: var(--texto-sec); margin-top: 1px; }

.page-title { font-size: 1.375rem; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 0.25rem; }
.page-subtitle { color: var(--texto-sec); font-size: 0.9375rem; margin-bottom: 2rem; line-height: 1.5; }

.layout-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 900px) { .layout-grid { grid-template-columns: 7fr 5fr; gap: 2.5rem; } }

.form-section { padding-bottom: 1.75rem; margin-bottom: 1.75rem; border-bottom: 1px solid var(--borde); }
.form-section:last-of-type { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.section-header { margin-bottom: 1.25rem; }
.section-title { font-size: 0.9375rem; font-weight: 600; color: var(--texto); }
.section-desc { font-size: 0.8125rem; color: var(--texto-sec); margin-top: 0.25rem; line-height: 1.5; }

.form-group { margin-bottom: 1rem; }
.form-group:last-child { margin-bottom: 0; }

label:not(.checkbox-item) { display: block; font-size: 0.8125rem; font-weight: 500; color: var(--texto); margin-bottom: 0.3rem; }

select, input[type="text"], input[type="email"], input[type="tel"] {
    width: 100%; padding: 0.5625rem 0.75rem; border: 1px solid var(--borde); border-radius: var(--radio-sm);
    font-size: 0.875rem; font-family: inherit; color: var(--texto); background: var(--blanco); transition: border-color var(--trans), box-shadow var(--trans);
}
select {
    cursor: pointer; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2394a3b8' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 5.646a.5.5 0 0 1 .708 0L8 8.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 0.625rem center; background-size: 1rem; padding-right: 2rem;
}
select:focus, input:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px var(--acento-light); }

.input-hint { font-size: 0.75rem; color: var(--texto-hint); margin-top: 0.3rem; line-height: 1.4; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }

.checkbox-group { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.checkbox-item {
    display: flex; align-items: center; gap: 0.5rem; padding: 0.4375rem 0.75rem; background: var(--blanco);
    border: 1px solid var(--borde); border-radius: var(--radio-sm); cursor: pointer; font-size: 0.8125rem;
    font-weight: 450; transition: all var(--trans); user-select: none;
}
.checkbox-item:hover { border-color: var(--borde-focus); }
.checkbox-item.checked { background: var(--acento-light); border-color: var(--acento); color: var(--acento); }
.checkbox-item input[type="checkbox"] { width: 15px; height: 15px; accent-color: var(--acento); cursor: pointer; flex-shrink: 0; }
.checkbox-precio { font-size: 0.6875rem; color: var(--texto-hint); }
.checked .checkbox-precio { color: var(--acento); opacity: 0.75; }

.info-panel { position: sticky; top: 2rem; align-self: start; }
.info-card { background: var(--muted); border: 1px solid var(--borde); border-radius: var(--radio); padding: 1.5rem; }
.info-card-title { font-size: 0.875rem; font-weight: 600; color: var(--texto); margin-bottom: 0.5rem; }
.info-card-text { font-size: 0.8125rem; color: var(--texto-sec); line-height: 1.6; margin-bottom: 1rem; }
.info-highlights { list-style: none; padding: 0; }
.info-highlights li { display: flex; align-items: center; gap: 0.5rem; padding: 0.375rem 0; font-size: 0.8125rem; color: var(--texto); }
.info-highlights li::before {
    content: ''; width: 18px; height: 18px; flex-shrink: 0; background: var(--acento); border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 10px;
}
.info-contact { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--borde); }
.info-contact p { font-size: 0.75rem; color: var(--texto-hint); margin-bottom: 0.25rem; }
.info-contact a { font-size: 0.8125rem; color: var(--acento); text-decoration: none; font-weight: 500; }
.info-contact a:hover { text-decoration: underline; }

.precio-card {
    background: var(--blanco); border: 1px solid var(--borde); border-radius: var(--radio);
    padding: 1.25rem; margin-bottom: 1rem; box-shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.06);
}
.precio-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.precio-card-label { font-size: 0.75rem; font-weight: 500; color: var(--texto-sec); text-transform: uppercase; letter-spacing: 0.04em; }
.precio-card-valor { font-size: 2.25rem; font-weight: 700; color: var(--texto); letter-spacing: -0.03em; line-height: 1.1; }
.precio-card-badge {
    display: inline-block; font-size: 0.6875rem; font-weight: 500; color: var(--exito); background: var(--exito-fondo);
    padding: 0.125rem 0.5rem; border-radius: 99px; margin-top: 0.375rem;
}
.precio-card-bar-wrap { height: 6px; background: var(--muted); border-radius: 99px; margin-top: 1rem; overflow: hidden; }
.precio-card-bar { height: 100%; background: var(--acento); border-radius: 99px; width: 0%; transition: width 0.5s ease; }
.precio-card-sep { height: 1px; background: var(--borde); margin: 0.875rem 0; }
.precio-card-lines { list-style: none; padding: 0; }
.precio-card-lines li { display: flex; justify-content: space-between; align-items: center; padding: 0.3125rem 0; font-size: 0.8125rem; color: var(--texto-sec); }
.precio-card-lines li span:last-child { font-weight: 500; color: var(--texto); font-variant-numeric: tabular-nums; }
.precio-card-totals { display: flex; flex-direction: column; gap: 0.25rem; }
.precio-card-row { display: flex; justify-content: space-between; font-size: 0.8125rem; color: var(--texto-sec); }
.precio-card-row span:last-child { font-weight: 500; color: var(--texto); font-variant-numeric: tabular-nums; }
.precio-card-row-total { margin-top: 0.25rem; padding-top: 0.5rem; border-top: 2px solid var(--texto); }
.precio-card-row-total span { font-size: 0.9375rem; font-weight: 700 !important; color: var(--texto) !important; }

.btn-enviar {
    width: 100%; padding: 0.75rem; margin-top: 1.25rem; background: var(--acento); color: #fff; border: none;
    border-radius: var(--radio-sm); font-size: 0.9375rem; font-weight: 600; font-family: inherit; cursor: pointer;
    transition: background var(--trans), box-shadow var(--trans); letter-spacing: 0.005em;
}
.btn-enviar:hover { background: var(--acento-hover); box-shadow: var(--sombra-md); }
.btn-enviar:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; }

.mensaje { padding: 1.25rem; border-radius: var(--radio); margin-top: 1.5rem; font-size: 0.9375rem; font-weight: 500; text-align: center; line-height: 1.5; }
.mensaje.exito { background: var(--exito-fondo); color: var(--exito); border: 1px solid #a7f3d0; }
.mensaje.error { background: var(--error-fondo); color: var(--error); border: 1px solid #fecaca; }

.footer { margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--borde); text-align: center; font-size: 0.75rem; color: var(--texto-hint); }

.loading { display: flex; justify-content: center; padding: 4rem 0; }
.spinner { width: 32px; height: 32px; border: 3px solid var(--borde); border-top-color: var(--acento); border-radius: 50%; animation: spin 0.65s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 640px) {
    .container { padding: 1.25rem 1rem; }
    .header { gap: 0.75rem; }
    .form-row { grid-template-columns: 1fr; }
    .checkbox-group { flex-direction: column; }
    .checkbox-item { width: 100%; }
    .precio-preview { flex-direction: column; text-align: center; }
}
