
.forgot-pro-page { min-height: 100vh; position: relative; overflow: hidden; isolation: isolate; display: flex; align-items: center; padding: clamp(1.2rem, 3vw, 2.5rem) 0; background: #08111f; }
.forgot-pro-bg { position: absolute; inset: 0; z-index: -2; background-image: radial-gradient(circle at 12% 0%, rgba(255,255,255,.22), transparent 24rem), radial-gradient(circle at 90% 8%, rgba(213,10,10,.24), transparent 26rem), linear-gradient(135deg, rgba(1,51,105,.74), rgba(8,17,31,.78)), var(--forgot-auth-background, none); background-position: center; background-size: auto, auto, auto, cover; background-repeat: no-repeat; }
.forgot-pro-page::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .18; background-image: linear-gradient(rgba(255,255,255,.22) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.22) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom, #000, transparent 78%); }
.forgot-pro-container { position: relative; z-index: 2; max-width: 1180px; }
.forgot-pro-container.narrow { max-width: 720px; }
.forgot-pro-hero, .forgot-card { height: 100%; border: 1px solid rgba(255,255,255,.24); border-radius: 30px; box-shadow: 0 28px 76px rgba(0,0,0,.34); overflow: hidden; backdrop-filter: blur(22px); }
.forgot-pro-hero { position: relative; padding: clamp(1.35rem, 4vw, 2.5rem); color: #fff; background: radial-gradient(circle at 12% 8%, rgba(255,255,255,.28), transparent 28%), linear-gradient(135deg, rgba(1,51,105,.92), rgba(213,10,10,.82)); }
.forgot-pro-hero::after { content: ""; position: absolute; width: 320px; height: 320px; right: -130px; bottom: -150px; border: 42px solid rgba(255,255,255,.11); border-radius: 999px; }
.forgot-logo-wrap { width: 86px; height: 86px; display: grid; place-items: center; margin-bottom: 1.15rem; border: 1px solid rgba(255,255,255,.22); border-radius: 26px; background: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 18px 34px rgba(0,0,0,.20); }
.forgot-logo-wrap img { width: 68px; height: 68px; object-fit: contain; filter: drop-shadow(0 12px 22px rgba(0,0,0,.25)); }
.forgot-kicker { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: .85rem; padding: .45rem .75rem; border: 1px solid rgba(255,255,255,.26); border-radius: 999px; background: rgba(255,255,255,.13); color: rgba(255,255,255,.88); font-size: .74rem; font-weight: 900; letter-spacing: .10em; text-transform: uppercase; }
.forgot-title { margin: 0 0 .9rem; color: #fff; font-size: clamp(2rem, 4.4vw, 4rem); font-weight: 950; line-height: .96; letter-spacing: -.065em; text-shadow: 0 18px 44px rgba(0,0,0,.26); }
.forgot-copy { max-width: 560px; margin: 0; color: rgba(255,255,255,.84); font-size: 1.02rem; font-weight: 700; line-height: 1.65; }
.forgot-points { display: grid; gap: .75rem; margin-top: 1.55rem; }
.forgot-point { display: flex; align-items: flex-start; gap: .75rem; padding: .85rem .95rem; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: rgba(255,255,255,.10); color: rgba(255,255,255,.88); font-weight: 760; line-height: 1.35; }
.forgot-point i { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.16); color: #fff; }
.forgot-card { background: rgba(255,255,255,.96); color: #111827; }
.forgot-card-head { position: relative; padding: 1.5rem 1.5rem 1.05rem; text-align: center; border-bottom: 1px solid rgba(15,23,42,.08); background: radial-gradient(circle at top right, rgba(1,51,105,.12), transparent 38%), radial-gradient(circle at bottom left, rgba(213,10,10,.08), transparent 36%); }
.forgot-card-head img { width: 78px; height: 78px; object-fit: contain; margin-bottom: .8rem; padding: .55rem; border: 1px solid rgba(15,23,42,.08); border-radius: 24px; background: #fff; box-shadow: 0 14px 30px rgba(15,23,42,.12); }
.forgot-card-head h2 { margin: 0; color: #111827; font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 950; letter-spacing: -.055em; }
.forgot-card-head p { max-width: 470px; margin: .5rem auto 0; color: #64748b; font-weight: 700; line-height: 1.5; }
.forgot-card-body { padding: 1.5rem; }
.forgot-form-label { color: #111827; font-weight: 900; letter-spacing: -.02em; }
.forgot-input { min-height: 52px; border: 1px solid rgba(15,23,42,.11); border-radius: 17px; background: rgba(248,250,252,.92); color: #111827; font-size: .98rem; font-weight: 750; box-shadow: 0 10px 22px rgba(15,23,42,.06); }
.forgot-input:focus { border-color: #013369; background: #fff; color: #111827; box-shadow: 0 0 0 4px rgba(1,51,105,.14), 0 12px 26px rgba(15,23,42,.10); }
.forgot-submit { min-height: 52px; border: 0; border-radius: 17px; background: linear-gradient(135deg,#013369,#d50a0a); color: #fff; font-weight: 950; box-shadow: 0 16px 36px rgba(1,51,105,.22); }
.forgot-submit:hover { color: #fff; transform: translateY(-1px); filter: brightness(1.03); }
.forgot-back { display: inline-flex; align-items: center; justify-content: center; width: 100%; margin-top: 1rem; padding: .85rem 1rem; border: 1px solid rgba(1,51,105,.18); border-radius: 17px; color: #013369; text-decoration: none; font-weight: 900; }
.forgot-back:hover { color: #d50a0a; background: rgba(1,51,105,.06); }
.reset-card { max-width: 680px; margin: 0 auto; }
.reset-invalid-state { display:flex; align-items:flex-start; gap:1rem; margin-bottom:1.15rem; padding:1rem; border:1px solid rgba(220,38,38,.18); border-radius:19px; background:rgba(220,38,38,.07); color:#334155; }
.reset-invalid-state > i { width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; border-radius:15px; background:#fee2e2; color:#b91c1c; }
.reset-invalid-state strong { display:block; color:#991b1b; font-weight:950; }
.reset-invalid-state p { margin:.35rem 0 0; color:#64748b; font-size:.88rem; line-height:1.55; font-weight:650; }
@media (max-width: 991px) { .forgot-pro-page { align-items: flex-start; } }
