/* SLP Contact — Estilos */
#slp-contact-wrap {
    max-width: 680px;
    margin: 0 auto;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--slp-text, #1a1a1a);
}

/* Header */
#slp-form-header { margin-bottom: 28px; }
#slp-form-title {
    margin: 0 0 8px;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    font-weight: 700;
    color: var(--slp-text);
    letter-spacing: -.03em;
}
#slp-form-subtitle {
    margin: 0;
    color: var(--slp-muted, #6b7280);
    font-size: 15px;
    line-height: 1.6;
}

/* Grid */
.slp-row { margin-bottom: 18px; }
.slp-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
@media (max-width: 520px) {
    .slp-grid-2 { grid-template-columns: 1fr; gap: 0; }
    .slp-grid-2 .slp-field { margin-bottom: 18px; }
    .slp-grid-2 .slp-field:last-child { margin-bottom: 0; }
}

/* Campos */
.slp-field { display: flex; flex-direction: column; gap: 6px; }
.slp-field label {
    font-size: 13px;
    font-weight: 600;
    color: var(--slp-text);
    letter-spacing: .01em;
}
.slp-req { color: var(--slp-accent, #111); }

.slp-field input[type="text"],
.slp-field input[type="email"],
.slp-field input[type="tel"],
.slp-field input[type="date"],
.slp-field textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 14px;
    border: 1.5px solid var(--slp-border, #e5e7eb);
    border-radius: var(--slp-radius, 12px);
    background: var(--slp-bg, #fff);
    color: var(--slp-text);
    font-size: 14px;
    font-family: inherit;
    transition: border-color .2s, box-shadow .2s;
    outline: none;
    -webkit-appearance: none;
}
.slp-field input:focus,
.slp-field textarea:focus {
    border-color: var(--slp-accent, #111);
    box-shadow: 0 0 0 3px rgba(0,128,128,.15);
}
.slp-field textarea { resize: vertical; min-height: 100px; }

/* Opciones de servicio */
#slp-contact-wrap .slp-service-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
#slp-contact-wrap .slp-service-card {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 20px !important;
    border: 1.5px solid var(--slp-card-border, #e5e7eb) !important;
    border-radius: var(--slp-radius-btn, 8px) !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--slp-card-text, #1a1a1a) !important;
    background: var(--slp-card-bg, #fff) !important;
    transition: border-color .2s, background .2s, color .2s;
    user-select: none;
    margin: 0 !important;
    line-height: 1.4 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    float: none !important;
    width: auto !important;
}
#slp-contact-wrap .slp-service-card:hover {
    border-color: var(--slp-card-sel-border, #008080) !important;
    background: var(--slp-card-bg, #fff) !important;
    color: var(--slp-card-sel-bg, #008080) !important;
}
#slp-contact-wrap .slp-service-card.slp-selected {
    border-color: var(--slp-card-sel-border, #008080) !important;
    background: var(--slp-card-sel-bg, #008080) !important;
    color: var(--slp-card-sel-text, #fff) !important;
}

/* Botón */
#slp-btn-send {
    width: 100%;
    padding: 14px 24px;
    background: var(--slp-accent, #111);
    color: var(--slp-accent-text, #fff);
    border: none;
    border-radius: var(--slp-radius-btn, 8px);
    font-size: 15px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    transition: filter .15s, transform .1s;
    margin-top: 8px;
}
#slp-btn-send:hover { filter: brightness(1.1); }
#slp-btn-send:active { transform: scale(.98); }
#slp-btn-send:disabled { opacity: .6; cursor: not-allowed; }

/* Error */
#slp-error {
    padding: 12px 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: var(--slp-radius, 12px);
    color: #dc2626;
    font-size: 14px;
    margin-bottom: 14px;
}

/* Éxito */
#slp-success {
    text-align: center;
    padding: 48px 24px;
}
#slp-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--slp-accent);
    color: var(--slp-accent-text);
    font-size: 28px;
    margin: 0 auto 20px;
}
#slp-success-title {
    margin: 0 0 10px;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--slp-text);
}
#slp-success-msg {
    color: var(--slp-muted);
    font-size: 15px;
    margin: 0;
}
