* { box-sizing: border-box; }
body { margin: 0; font-family: "Euclid Circular", Arial, sans-serif; color: #071a33; background: #f8fafc; }
a { color: inherit; }
.recovery-page { min-height: 100vh; min-height: 100svh; display: grid; grid-template-columns: 55.2% 44.8%; }
.recovery-visual { position: relative; min-height: 100%; padding: clamp(32px, 4.3vw, 72px); display: flex; flex-direction: column; justify-content: space-between; gap: 90px; color: #fff; background: linear-gradient(90deg, rgba(7, 26, 51, .35), rgba(7, 26, 51, .05)), url("../images/fundo_esqueci.png") center / cover no-repeat; background-color: #071a33; }
.recovery-logo { align-self: flex-start; }
.recovery-logo img { width: clamp(130px, 12.3vw, 206px); height: auto; display: block; }
.recovery-copy { margin-bottom: 12px; }
.recovery-accent { display: block; width: 72px; height: 7px; background: #ffd400; border-radius: 2px; margin-bottom: 20px; }
.recovery-copy h2 { font-size: clamp(30px, 2.65vw, 45px); line-height: 1.12; letter-spacing: -.025em; margin: 0 0 14px; }
.recovery-copy em { color: #00cb25; font-style: normal; }
.recovery-copy p { margin: 0; color: #d8e1eb; font-size: clamp(17px, 1.45vw, 24px); line-height: 1.5; }
.recovery-panel { display: flex; align-items: center; justify-content: center; padding: 72px clamp(32px, 4.8vw, 80px); }
.recovery-box { width: 100%; max-width: 550px; }
.recovery-eyebrow { color: #008b1a; text-transform: uppercase; letter-spacing: .09em; font-size: 17px; font-weight: 700; margin: 0 0 20px; }
.recovery-box h1 { font-size: clamp(30px, 2.9vw, 48px); line-height: 1.15; letter-spacing: -.035em; margin: 0 0 22px; }
.recovery-intro { font-size: clamp(18px, 1.45vw, 24px); line-height: 1.4; color: #596b89; margin: 0 0 46px; }
.recovery-box label { display: block; font-size: 21px; font-weight: 700; margin-bottom: 10px; }
.recovery-input { position: relative; }
.recovery-input svg { position: absolute; left: 24px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; color: #78869c; pointer-events: none; }
.recovery-input input { width: 100%; height: 69px; border: 1px solid #cbd5e4; border-radius: 11px; padding: 12px 20px 12px 85px; background: #fff; color: #071a33; font: inherit; font-size: 21px; }
.recovery-input input::placeholder { color: #7d889b; opacity: 1; }
.recovery-help { color: #596b89; font-size: 17px; line-height: 1.4; margin: 9px 0 35px; }
.recovery-submit { width: 100%; min-height: 65px; padding: 16px; border: 0; border-radius: 12px; background: #052349; color: #fff; font: inherit; font-size: 23px; font-weight: 700; display: flex; align-items: center; justify-content: center; gap: 18px; cursor: pointer; }
.recovery-submit svg { width: 27px; height: 27px; }
.recovery-submit:hover { background: #103d70; }
.recovery-submit:disabled { opacity: .7; cursor: default; }
.recovery-back { display: inline-flex; align-items: center; gap: 17px; margin-top: 29px; color: #003c91; font-size: 21px; text-decoration: none; }
.recovery-back span { font-size: 32px; line-height: 1; }
.recovery-signup { border-top: 1px solid #dae1ec; margin-top: 52px; padding-top: 37px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.recovery-signup p { margin: 0; color: #596b89; font-size: 19px; }
.recovery-signup a { border: 1px solid #002e75; border-radius: 11px; padding: 15px 30px; min-width: 175px; text-align: center; color: #002e75; font-size: 20px; font-weight: 700; text-decoration: none; }
.recovery-back:hover, .recovery-signup a:hover { text-decoration: underline; }
:focus-visible { outline: 3px solid #1673d6; outline-offset: 4px; }
.recovery-feedback { padding: 14px 16px; margin: 0 0 20px; border-radius: 8px; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.recovery-feedback.is-error { color: #8f1717; background: #fff0f0; border: 1px solid #efbebe; }
.recovery-feedback.is-success { color: #126b38; background: #e9f8ef; border: 1px solid #bfe8cd; }
@media (min-width: 1400px) { .recovery-panel { padding-left: 7vw; padding-right: 4.8vw; } }
@media (max-width: 1100px) { .recovery-signup { flex-wrap: wrap; } .recovery-panel { padding: 50px 30px; } }
@media (max-width: 760px) { .recovery-page { grid-template-columns: 1fr; } .recovery-visual { min-height: 280px; padding: 28px; gap: 32px; background-position: center 65%; } .recovery-logo img { width: 100px; } .recovery-copy h2 { font-size: 28px; } .recovery-copy p { font-size: 16px; } .recovery-accent { margin-bottom: 12px; height: 5px; width: 48px; } .recovery-panel { padding: 38px 24px; } .recovery-intro { margin-bottom: 30px; } .recovery-eyebrow { font-size: 14px; } .recovery-signup { margin-top: 32px; padding-top: 26px; } .recovery-input input { font-size: 18px; padding-left: 65px; } .recovery-input svg { left: 20px; width: 24px; } .recovery-submit { font-size: 20px; } }