.vv2-contact-shell { background: #fff; padding: 2rem 0 3rem; }
.vv2-contact-hero { background: linear-gradient(135deg, rgba(7, 43, 98, .94), rgba(9, 27, 54, .9)), url('/Imagenes/oficial/ce-bg-clean.jpg') center/cover no-repeat; border: 1px solid rgba(13, 110, 253, .12); border-radius: 1.75rem; box-shadow: 0 .85rem 2rem rgba(15, 23, 42, .1); color: #fff; }
.vv2-contact-hero .lead { color: rgba(255, 255, 255, .86); max-width: 45rem; }
.vv2-contact-back-btn { align-items: center; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .42); border-radius: 999px; color: #fff; display: inline-flex; font-size: .86rem; font-weight: 700; gap: .5rem; min-height: 2.5rem; padding: .45rem 1rem; text-decoration: none; }
.vv2-contact-back-btn:hover, .vv2-contact-back-btn:focus { background: rgba(255, 255, 255, .22); color: #fff; }
.vv2-contact-card { background: #fff; border: 1px solid var(--vv2-border); border-radius: 1.35rem; box-shadow: 0 .6rem 1.6rem rgba(15, 23, 42, .055); }
.vv2-contact-section-heading h2, .vv2-contact-help h2, .vv2-contact-guidance h2 { color: var(--vv2-text); font-weight: 800; }
.vv2-contact-layout { align-items: start; display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr) minmax(16rem, .38fr); }
.vv2-contact-form { padding: clamp(1.35rem, 3vw, 2.25rem); }
.vv2-contact-section-heading { border-bottom: 1px solid var(--vv2-border); margin-bottom: 1.5rem; padding-bottom: 1.2rem; }
.vv2-contact-section-heading h2, .vv2-contact-help h2, .vv2-contact-guidance h2 { font-size: 1.08rem; margin: 0 0 .35rem; }
.vv2-contact-section-heading p, .vv2-contact-help p, .vv2-contact-guidance p { color: var(--vv2-text-soft); font-size: .92rem; margin: 0; }
.vv2-contact-section-heading span, .vv2-contact-field label span { color: #b5473c; }
.vv2-contact-fields { display: grid; gap: 1.1rem; }
.vv2-contact-field { display: grid; gap: .45rem; }
.vv2-contact-field label { color: var(--vv2-text); font-size: .9rem; font-weight: 700; }
.vv2-contact-input, .vv2-contact-code-input { border-color: var(--vv2-border); box-shadow: none; min-height: 2.85rem; }
.vv2-contact-input:focus, .vv2-contact-code-input:focus { border-color: var(--vv2-accent); box-shadow: 0 0 0 .2rem rgba(45, 108, 76, .12); }
.vv2-contact-message { min-height: 8rem; resize: vertical; }
.vv2-contact-hint, .vv2-contact-validator { color: var(--vv2-text-soft); font-size: .8rem; }
.vv2-contact-validator { color: #b5473c; }
.vv2-contact-captcha { align-items: center; background: var(--vv2-surface-soft); border: 1px solid var(--vv2-border); border-radius: var(--vv2-radius-md); display: grid; gap: 1rem; grid-template-columns: minmax(13rem, 1fr) auto; margin-top: 1.75rem; padding: 1.15rem; }
.vv2-contact-captcha-copy { color: var(--vv2-text-soft); display: block; font-size: .86rem; margin-top: .2rem; }
.vv2-contact-captcha-controls, .vv2-contact-captcha-code { align-items: center; display: flex; gap: .45rem; }
.vv2-contact-captcha-part { align-items: center; border-radius: .45rem; color: #fff; display: inline-flex; font-size: 1rem; font-weight: 800; height: 2.65rem; justify-content: center; min-width: 2.65rem; }
.vv2-contact-captcha-part--one { background: #2d6c4c; }
.vv2-contact-captcha-part--two { background: #20476e; }
.vv2-contact-captcha-part--three { background: #18324a; }
.vv2-contact-code-input { max-width: 7.3rem; text-align: center; }
.vv2-contact-error { color: #b5473c; display: block; font-size: .9rem; margin-top: 1rem; }
.vv2-contact-actions { display: flex; justify-content: flex-end; margin-top: 1.5rem; }
.vv2-contact-aside { display: grid; gap: 1rem; }
.vv2-contact-help, .vv2-contact-guidance { padding: 1.35rem; }
.vv2-contact-help { background: linear-gradient(145deg, #eff7f2 0%, #fff 85%); }
.vv2-contact-help-icon { align-items: center; background: var(--vv2-accent-soft); border-radius: .7rem; color: var(--vv2-accent); display: inline-flex; font-size: 1.1rem; height: 2.6rem; justify-content: center; margin-bottom: 1rem; width: 2.6rem; }
.vv2-contact-guidance { border-left: 2px solid var(--vv2-border); }
.vv2-contact-guidance p + p { margin-top: .8rem; }
.vv2-contact-guidance a { color: var(--vv2-primary); display: block; font-size: .9rem; font-weight: 700; margin-top: .7rem; text-decoration: none; }
.vv2-contact-guidance a:hover, .vv2-contact-guidance a:focus { color: var(--vv2-accent); text-decoration: underline; }
.vv2-contact-guidance a + a { margin-top: .8rem; }
@media (max-width: 900px) { .vv2-contact-layout { grid-template-columns: 1fr; } .vv2-contact-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); } .vv2-contact-help { grid-row: span 2; } }
@media (max-width: 620px) { .vv2-contact-shell { padding: 1.25rem 0 2.5rem; } .vv2-contact-hero, .vv2-contact-card { border-radius: 1.2rem; } .vv2-contact-captcha { align-items: stretch; grid-template-columns: 1fr; } .vv2-contact-captcha-controls { flex-wrap: wrap; } .vv2-contact-code-input { flex: 1 1 7rem; } .vv2-contact-actions .vv2-btn-primary { width: 100%; } .vv2-contact-aside { grid-template-columns: 1fr; } .vv2-contact-help { grid-row: auto; } }