/* Estilos específicos de contacto.html — extraídos de <style> inline para CSP. */
    .honeypot-field { display: none !important; }
    .form-error { display: none; color: #dc2626; font-size: 0.82rem; margin-top: 0.3rem; }
    .form-error:not(:empty) { display: block; }
    .is-invalid { border-color: #dc2626 !important; }
    .form-hint { display: block; font-size: 0.8rem; color: #888; margin-top: 0.3rem; }
    .radio-card-group {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
      gap: 0.75rem; margin-bottom: 0.5rem;
    }
    .radio-card { cursor: pointer; }
    .radio-card input { position: absolute; opacity: 0; width: 0; height: 0; }
    .radio-card__content {
      display: flex; flex-direction: column; align-items: center; gap: 0.4rem;
      border: 2px solid #e2e8f0; border-radius: var(--radius); padding: 0.85rem 0.6rem;
      text-align: center; transition: all 0.2s; background: white;
    }
    .radio-card__content svg { width: 26px; height: 26px; color: #94a3b8; transition: color 0.2s; stroke: currentColor; }
    .radio-card__content strong { font-size: 0.85rem; color: var(--dark-gray); display: block; }
    .radio-card__content small { font-size: 0.75rem; color: #94a3b8; line-height: 1.3; display: block; }
    .radio-card input:checked + .radio-card__content { border-color: var(--primary); background: #f0fdf4; }
    .radio-card input:checked + .radio-card__content svg { color: var(--primary); }
    .radio-card input:checked + .radio-card__content strong { color: var(--primary-dark); }
    .radio-card:focus-within .radio-card__content { outline: 2px solid var(--primary); }
    .contact-layout { display: grid; grid-template-columns: 1fr 320px; gap: 2.5rem; align-items: start; }
    @media (max-width: 900px) { .contact-layout { grid-template-columns: 1fr; } }
    /* Fix real horizontal overflow at narrow viewports (320–414px): grid/flex items
       default to min-width:auto, so a long <select> option or radio-card label can
       force the grid track (and the whole page) wider than the viewport. */
    .contact-layout,
    .contact-layout > * { min-width: 0; max-width: 100%; }
    .contact-form-wrapper { min-width: 0; max-width: 100%; }
    .contact-form-wrapper form { min-width: 0; max-width: 100%; }
    .form-row { min-width: 0; max-width: 100%; }
    .form-row > * { min-width: 0; max-width: 100%; }
    .form-group { min-width: 0; max-width: 100%; }
    .form-group input,
    .form-group select,
    .form-group textarea { min-width: 0; max-width: 100%; }
    .radio-card-group { min-width: 0; max-width: 100%; }
    .radio-card-group > * { min-width: 0; max-width: 100%; }
    .form-success {
      display: flex; align-items: flex-start; gap: 1rem;
      background: #f0fdf4; border: 1.5px solid #22c55e;
      border-radius: var(--radius); padding: 1.5rem; margin-top: 1.5rem;
    }
    .form-success svg { width: 48px; height: 48px; color: #22c55e; flex-shrink: 0; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 2; }
    .form-success strong { display: block; font-size: 1.05rem; color: #15803d; margin-bottom: 0.35rem; }
    .form-success p { color: #166534; margin: 0; line-height: 1.5; }
    .btn-wa-submit { display: inline-flex; align-items: center; gap: 0.65rem; background: var(--wa-green, #25d366); border-color: var(--wa-green, #25d366); }
    .btn-wa-submit:hover { background: var(--wa-green-dark, #128c7e) !important; border-color: var(--wa-green-dark, #128c7e) !important; }
    .btn-wa-submit svg { fill: white; width: 20px; height: 20px; flex-shrink: 0; }