
.auth-page{position:relative;overflow:hidden;padding:54px 0 72px;background:radial-gradient(circle at top left,rgba(14,99,181,.08),transparent 34%),linear-gradient(180deg,#f8fafc 0%,#fff 100%)}
.auth-page:before,.auth-page:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.auth-page:before{width:340px;height:340px;top:-170px;right:-120px;background:rgba(14,99,181,.05)}.auth-page:after{width:250px;height:250px;bottom:-140px;left:-100px;background:rgba(255,106,0,.045)}
.auth-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);min-height:650px;border:1px solid #dde5ed;border-radius:14px;background:#fff;box-shadow:0 28px 70px rgba(15,45,78,.12);overflow:hidden}
.auth-visual{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:100%;padding:48px;color:#fff;background:linear-gradient(145deg,rgba(7,52,101,.96),rgba(14,99,181,.9)),url("https://images.unsplash.com/photo-1567789884554-0b844b597180?auto=format&fit=crop&w=1400&q=85") center/cover no-repeat}.auth-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 34%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.18),transparent 28%);pointer-events:none}.auth-visual>*{position:relative;z-index:1}
.auth-kicker{display:inline-flex;align-items:center;gap:9px;width:fit-content;padding:8px 12px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.08);font-size:12px;font-weight:700}.auth-kicker-dot{width:8px;height:8px;border-radius:50%;background:#31d158;box-shadow:0 0 0 4px rgba(49,209,88,.15)}
.auth-visual-copy{max-width:520px;margin:auto 0}.auth-visual h1{margin:0 0 18px;font-size:clamp(34px,4vw,52px);line-height:1.04;letter-spacing:-1.8px}.auth-visual p{max-width:500px;margin:0;color:rgba(255,255,255,.83);font-size:15px;line-height:1.75}.auth-benefits{display:grid;gap:13px;margin-top:30px}.auth-benefit{display:flex;align-items:center;gap:11px;color:rgba(255,255,255,.92);font-size:13px;font-weight:600}.auth-benefit-icon{display:inline-grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.13);font-size:14px}.auth-visual-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:28px;border-top:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.72);font-size:12px}
.auth-card{display:flex;align-items:center;padding:54px;background:#fff}.auth-card-inner{width:min(100%,460px);margin:auto}.auth-eyebrow{margin-bottom:11px;color:#0e63b5;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.auth-card h2{margin:0 0 10px;color:#172233;font-size:clamp(28px,3vw,38px);line-height:1.15;letter-spacing:-1px}.auth-intro{margin:0 0 30px;color:#6a7480;font-size:14px;line-height:1.7}.auth-form{display:grid;gap:18px}.auth-field-group{display:grid;gap:8px}.auth-label-row{display:flex;align-items:center;justify-content:space-between;gap:15px}.auth-label{color:#25344a;font-size:13px;font-weight:700}.auth-link{color:#0e63b5;font-size:13px;font-weight:700}.auth-link:hover{text-decoration:underline}.auth-input-wrap{position:relative}.auth-input{width:100%;height:50px;padding:0 46px 0 15px;border:1px solid #d7e0e9;border-radius:5px;outline:0;background:#fff;color:#172233;font:inherit;font-size:14px;transition:border-color .2s,box-shadow .2s}.auth-input::placeholder{color:#98a3af}.auth-input:hover{border-color:#b8c6d5}.auth-input:focus{border-color:#0e63b5;box-shadow:0 0 0 4px rgba(14,99,181,.1)}.auth-input-icon{position:absolute;top:50%;right:15px;transform:translateY(-50%);color:#7b8794;font-size:16px;pointer-events:none}.password-toggle{position:absolute;top:50%;right:9px;display:inline-grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:4px;transform:translateY(-50%);background:transparent;color:#6c7885;cursor:pointer}.password-toggle:hover{background:#f1f5f9;color:#0e63b5}.auth-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.auth-check{display:inline-flex;align-items:flex-start;gap:9px;color:#526173;font-size:13px;line-height:1.5;cursor:pointer}.auth-check input{width:15px;height:15px;margin:2px 0 0;accent-color:#0e63b5}.auth-submit{width:100%;height:50px;border:1px solid #0e63b5;border-radius:5px;background:#0e63b5;color:#fff;font:inherit;font-size:14px;font-weight:800;cursor:pointer;transition:.2s}.auth-submit:hover{border-color:#0b559d;background:#0b559d;transform:translateY(-1px);box-shadow:0 10px 22px rgba(14,99,181,.18)}.auth-divider{display:flex;align-items:center;gap:14px;margin:24px 0;color:#8b96a3;font-size:12px}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:#e2e8ef}.auth-alt-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;height:48px;border:1px solid #d8e1ea;border-radius:5px;background:#fff;color:#25344a;font-size:13px;font-weight:700;cursor:pointer}.auth-alt-button:hover{border-color:#b8c7d7;background:#f8fafc}.auth-bottom{margin:26px 0 0;color:#667484;font-size:13px;text-align:center}.auth-note{display:flex;align-items:flex-start;gap:11px;margin-top:22px;padding:14px;border:1px solid #dbe8f6;border-radius:5px;background:#f2f7fd;color:#506078;font-size:12px;line-height:1.55}.auth-note strong{color:#23405f}.auth-status-icon{display:grid;place-items:center;width:62px;height:62px;margin-bottom:24px;border-radius:50%;background:#eaf4ff;color:#0e63b5;font-size:28px;font-weight:800}.auth-password-meter{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}.auth-password-meter span{height:4px;border-radius:999px;background:#e2e8ef}.auth-password-meter span.active{background:#21b34b}.auth-help-text{margin-top:7px;color:#7b8794;font-size:11px;line-height:1.5}.auth-two-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}.auth-success-box{padding:16px;border:1px solid #cfe7d6;border-radius:5px;background:#f1fbf4;color:#2d6740;font-size:13px;line-height:1.6}
@media(max-width:1050px){.auth-shell{grid-template-columns:minmax(0,.88fr) minmax(390px,1.12fr)}.auth-visual,.auth-card{padding:40px}}
@media(max-width:860px){.auth-page{padding:30px 0 48px}.auth-shell{grid-template-columns:1fr;min-height:auto}.auth-visual{min-height:330px;padding:34px}.auth-visual-copy{margin:48px 0}.auth-card{padding:42px 34px}.auth-card-inner{width:min(100%,560px)}}
@media(max-width:560px){.auth-page{padding:18px 0 36px}.auth-shell{border-radius:8px}.auth-visual{min-height:275px;padding:26px 22px}.auth-visual-copy{margin:34px 0}.auth-visual h1{font-size:31px;letter-spacing:-1px}.auth-visual p{font-size:13px}.auth-benefits{display:none}.auth-visual-footer{align-items:flex-start;flex-direction:column;padding-top:18px}.auth-card{padding:32px 20px}.auth-card h2{font-size:28px}.auth-two-cols{grid-template-columns:1fr}.auth-row{align-items:flex-start;flex-direction:column;gap:12px}}


/* =========================================================
   HEADER LOGIN POPOVER
========================================================= */
.header-main {
  position: relative;
}

.login-trigger {
  position: relative;
  padding: 8px 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}

.login-trigger:hover,
.login-trigger[aria-expanded="true"] {
  background: #f1f6fc;
  color: #0e63b5;
}

.login-popover-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: none;
  background: rgba(11, 30, 51, 0.16);
}

.login-popover {
  position: fixed;
  top: 112px;
  right: max(20px, calc((100vw - 1180px) / 2 + 126px));
  z-index: 1100;
  width: min(354px, calc(100vw - 32px));
  border: 1px solid #d8e1ea;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 24px 65px rgba(14, 42, 73, 0.22);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
}

.login-popover.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.login-popover-backdrop.open {
  display: block;
}

.login-popover-arrow {
  position: absolute;
  top: -9px;
  right: 42px;
  width: 17px;
  height: 17px;
  border-top: 1px solid #d8e1ea;
  border-left: 1px solid #d8e1ea;
  background: #ffffff;
  transform: rotate(45deg);
}

.login-popover-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 24px 14px;
}

.login-popover-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #0e63b5;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.login-popover-head h3 {
  margin: 0;
  color: #172233;
  font-size: 22px;
  line-height: 1.2;
}

.login-popover-close {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #0e63b5;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.login-popover-close:hover {
  background: #eef5fc;
}

.login-popover-form {
  display: grid;
  gap: 12px;
  padding: 0 24px 22px;
}

.login-popover-field {
  position: relative;
  display: block;
}

.login-popover-field input {
  width: 100%;
  height: 46px;
  padding: 0 44px 0 42px;
  border: 1px solid #ccd6e0;
  border-radius: 4px;
  outline: 0;
  background: #ffffff;
  color: #172233;
  font: inherit;
  font-size: 13px;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.login-popover-field input:focus {
  border-color: #0e63b5;
  box-shadow: 0 0 0 4px rgba(14, 99, 181, .1);
}

.login-popover-field-icon {
  position: absolute;
  top: 50%;
  left: 14px;
  z-index: 1;
  color: #0e63b5;
  font-size: 15px;
  transform: translateY(-50%);
}

.login-popover-password {
  position: absolute;
  top: 50%;
  right: 7px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  transform: translateY(-50%);
  background: transparent;
  cursor: pointer;
}

.login-popover-password:hover {
  background: #f1f5f9;
}

.login-popover-remember {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #637083;
  font-size: 12px;
  cursor: pointer;
}

.login-popover-remember input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: #0e63b5;
}

.login-popover-submit {
  width: 100%;
  height: 46px;
  margin-top: 2px;
  border: 1px solid #0e63b5;
  border-radius: 5px;
  background: #0e63b5;
  color: #ffffff;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.login-popover-submit:hover {
  background: #0b559d;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(14, 99, 181, .2);
}

.login-popover-links {
  display: grid;
  gap: 0;
  padding: 12px 24px;
  border-top: 1px solid #d8e5ef;
  border-radius: 0 0 8px 8px;
  background: #edf7fc;
  text-align: center;
}

.login-popover-links a {
  padding: 8px 4px;
  color: #075cac;
  font-size: 12px;
  font-weight: 600;
}

.login-popover-links a:hover {
  text-decoration: underline;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.login-popover-active {
  overflow: hidden;
}

@media (max-width: 900px) {
  .login-popover {
    top: 88px;
    right: 16px;
  }
}

@media (max-width: 560px) {
  .login-popover {
    top: 50%;
    right: auto;
    left: 50%;
    width: calc(100vw - 28px);
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    transform: translate(-50%, calc(-50% - 12px));
  }

  .login-popover.open {
    transform: translate(-50%, -50%);
  }

  .login-popover-arrow {
    display: none;
  }

  .login-popover-backdrop.open {
    background: rgba(8, 27, 48, .56);
  }
}
