.gp-portal-page{
  --gp-navy:#003A57;
  --gp-navy-light:#0B5578;
  --gp-cyan:#00BDF2;
  --gp-cyan-dark:#009FCE;
  --gp-bg:#F4F8FB;
  --gp-card:#FFFFFF;
  --gp-border:#E1E8EE;
  --gp-text:#1F2937;
  --gp-muted:#5B6B7A;
  --gp-shadow:0 1px 2px rgba(0,58,87,.06), 0 20px 48px rgba(0,58,87,.12);
  --gp-radius:20px;
}

.gp-portal-page,
.gp-portal-page * {
  box-sizing:border-box;
}

.gp-subcontractor-portal-body{
  margin:0;
  padding:0;
  background:#F4F8FB;
}

.gp-portal-page {
  min-height:100vh;
  background:
    radial-gradient(1100px 520px at 15% -10%, rgba(0,189,242,.10), transparent 60%),
    linear-gradient(180deg, #EEF6FB 0%, var(--gp-bg) 100%);
  color:var(--gp-text);
  font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.gp-portal-page a { color:inherit; text-decoration:none; }

/* ============ Page centering ============ */
.gp-portal-auth-page {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100vh;
  padding:40px 20px;
}

.gp-portal-auth-shell{
  width:100%;
  max-width:420px;
  margin:0 auto;
  background:var(--gp-card);
  border:1px solid var(--gp-border);
  border-radius:var(--gp-radius);
  box-shadow:var(--gp-shadow);
  overflow:hidden;
}

.gp-portal-panel{ min-width:0; }

.gp-portal-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:28px;
}

.gp-portal-brand-centered{
  justify-content:center;
  text-align:left;
}

.gp-portal-brand-mark{
  width:44px;
  height:44px;
  border-radius:12px;
  background:var(--gp-cyan);
  color:var(--gp-navy);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:15px;
  flex-shrink:0;
}

.gp-portal-brand-title{
  font-weight:800;
  font-size:17px;
  color:#fff;
}

.gp-portal-brand-subtitle{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#9FD8EE;
  margin-top:2px;
}

.gp-portal-panel-heading{
  font-size:28px;
  font-weight:800;
  line-height:1.25;
  margin:0 0 12px;
  color:#fff;
}

.gp-portal-panel-copy{
  font-size:14.5px;
  line-height:1.6;
  color:#BFE0F0;
  margin:0 0 28px;
  max-width:34ch;
}

.gp-portal-panel-points{
  list-style:none;
  margin:0;
  padding:20px 0 0;
  border-top:1px solid rgba(255,255,255,.14);
  display:flex;
  flex-direction:column;
  gap:14px;
}

.gp-portal-panel-points li{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13.5px;
  font-weight:600;
  color:#E6F5FB;
}

.gp-portal-point-icon{
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(0,189,242,.22);
  color:var(--gp-cyan);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

/* ---- Right: form panel ---- */
.gp-portal-panel-form{
  background:var(--gp-card);
  padding:40px 32px;
  display:flex;
  align-items:center;
}

.gp-portal-panel-form-inner{ width:100%; max-width:340px; margin:0 auto; }

.gp-portal-form-head h2{
  font-size:22px;
  font-weight:800;
  color:var(--gp-navy);
  margin:0 0 6px;
}

.gp-portal-form-head p{
  font-size:13.5px;
  color:var(--gp-muted);
  margin:0 0 26px;
  line-height:1.5;
}

.gp-portal-form-head-centered{
  text-align:center;
}

.gp-portal-form-simple{
  display:grid;
  gap:16px;
}

.gp-portal-form-simple label{
  display:grid;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:var(--gp-text);
}

.gp-portal-form-simple input{
  width:100%;
  padding:12px 14px;
  border:1px solid var(--gp-border);
  border-radius:10px;
  background:var(--gp-bg);
  color:var(--gp-text);
  font-size:14px;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.gp-portal-form-simple input::placeholder{ color:#9AA9B4; }

.gp-portal-form-simple input:focus{
  outline:none;
  background:#fff;
  border-color:var(--gp-cyan);
  box-shadow:0 0 0 3px rgba(0,189,242,.18);
}

.gp-portal-button-simple{
  border:none;
  border-radius:10px;
  background:var(--gp-cyan);
  color:#fff;
  padding:13px 16px;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  margin-top:4px;
  transition:background .15s ease, transform .05s ease;
}

.gp-portal-button-simple:hover{ background:var(--gp-cyan-dark); }
.gp-portal-button-simple:active{ transform:translateY(1px); }

.gp-portal-button-simple:disabled{
  opacity:.7;
  cursor:wait;
}

.gp-portal-button-simple.is-loading::after{
  content:'';
  display:inline-block;
  width:13px;
  height:13px;
  margin-left:8px;
  vertical-align:-2px;
  border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;
  border-radius:50%;
  animation:gp-portal-spin .8s linear infinite;
}

@keyframes gp-portal-spin{
  to{transform:rotate(360deg);}
}

.gp-portal-form-footnote{
  font-size:12.5px;
  color:var(--gp-muted);
  text-align:center;
  margin:22px 0 0;
}

/* ---- Notices ---- */
.gp-portal-notice{
  border-radius:10px;
  padding:11px 14px;
  margin-bottom:18px;
  font-weight:600;
  font-size:13px;
}

.gp-portal-notice.is-error{
  background:#FEE2E2;
  color:#991B1B;
}

.gp-portal-notice.is-success{
  background:#E5F7EE;
  color:#146641;
}

/* ============ Responsive: stack on smaller screens ============ */
@media (min-width:760px){
  .gp-portal-auth-shell{
    max-width:460px;
  }
}

@media (max-width:759.98px){
  .gp-portal-auth-page{ padding:18px 14px; }
  .gp-portal-auth-shell{
    max-width:480px;
  }
  .gp-portal-panel-form{ padding:32px 24px 36px; }
  .gp-portal-brand-centered{ justify-content:center; }
  .gp-portal-panel-heading{ font-size:22px; }
}
