/* login-page.css — Phase 4 extraction 2026-04-17. */

/* §1 */
:root{--blue:#1479A3;--blue-dark:#1366A0;--navy:#07192E;--off:#F4F8FC;--border:#DCE8F1;--text:#0D1829;--muted:#3D5266;--orange:#F97316;--shadow-sm:0 10px 28px rgba(7,25,46,.08);--grad-hero:radial-gradient(circle at top left,rgba(41,171,226,.24),transparent 36%),radial-gradient(circle at top right,rgba(249,115,22,.18),transparent 30%),linear-gradient(135deg,#07192E 0%,#0D2B45 100%);--font-h:'Poppins',system-ui,sans-serif;--font-b:'Inter',system-ui,sans-serif}
    *{box-sizing:border-box}html{scroll-behavior:smooth}
    /* Legacy standalone-page block removed 2026-07-01. Its bare element selectors
       (body / header / nav / footer / h1,h2,h3 / a) and generic classes
       (.skip .shell .head .brand .cta .hero .eyebrow .lede .hero-actions
        .section .grid .portal .note .band .foot) were overriding the global
       header, nav, footer, and headings that the /login page renders (this file
       loads only on /login, so the damage was scoped to that page — e.g. the
       mobile drawer wrapping into columns). /login is styled by .portal-hub below. */
    /* Kept: main's page padding — the .portal-hub hero overlap (margin-top:-36px)
       is tuned against it. Everything else from the legacy block is gone. */
    main{padding:36px 0 72px}
  
    /* ── HEADER ─────────────────────────────────────────── */
    header {
      position: sticky; top: 0; z-index: 300;
      background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.88) 100%);
      backdrop-filter: blur(28px) saturate(1.8) brightness(1.02);
      -webkit-backdrop-filter: blur(28px) saturate(1.8) brightness(1.02);
      border-bottom: 1px solid rgba(226,236,244,.5);
      box-shadow: 0 1px 0 rgba(226,236,244,.5), 0 0 0 0.5px rgba(255,255,255,.8), 0 2px 12px rgba(7,25,46,.04), 0 4px 24px rgba(7,25,46,.03), 0 8px 32px rgba(7,25,46,.04);
      overflow: visible;
    }
    header::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: rgba(255,255,255,.95);
      pointer-events: none;
      z-index: 1;
    }
    header::after {
      content: '';
      position: absolute;
      bottom: -8px; left: 0; right: 0;
      height: 8px;
      background: linear-gradient(180deg, rgba(7,25,46,.04) 0%, transparent 100%);
      pointer-events: none;
      z-index: -1;
    }
/* NAV CSS extracted to assets/site.css — see _scripts/extract_nav_css.py */

    /* ── FOOTER ─────────────────────────────────────────── */
    footer { background: #040E1A; padding: 64px 32px 32px; color: rgba(255,255,255,.72); }
    .ft { max-width: 1200px; margin: 0 auto; }
    .ft-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
    .ft-logo img { height: 36px; width: auto; display: block; margin-bottom: 14px; }
    .ft-tagline { font-family: var(--font-b); font-size: 13.5px; color: rgba(255,255,255,.30); line-height: 1.65; margin-bottom: 20px; }
    .ft-phone {
      display: inline-flex; align-items: center; gap: 7px;
      font-family: var(--font-b); font-size: 14.5px; font-weight: 700;
      color: var(--blue); text-decoration: none; transition: color .15s;
    }
    .ft-phone:hover { color: #7DD4F5; }
    .ft-col h3 {
      font-family: var(--font-b); font-size: 11px; font-weight: 700;
      letter-spacing: 1.4px; text-transform: uppercase;
      color: rgba(255,255,255,.70); margin-bottom: 16px;
    }
    .ft-col a {
      display: block; font-family: var(--font-b); font-size: 14px;
      color: rgba(255,255,255,.88); text-decoration: none;
      margin-bottom: 10px; transition: color .15s;
    }
    .ft-col a:hover { color: #fff; }
    .ft-bottom {
      border-top: 1px solid rgba(255,255,255,.06);
      padding-top: 28px; display: flex;
      justify-content: space-between; align-items: center;
      flex-wrap: wrap; gap: 12px;
      font-family: var(--font-b); font-size: 12.5px;
    }
    .ft-legal { display: flex; gap: 20px; }
    .ft-legal a { color: rgba(255,255,255,.26); text-decoration: none; transition: color .15s; }
    .ft-legal a:hover { color: #fff; }
    @media (max-width: 1024px) {
      footer { padding: 48px 20px 24px; }
      .ft-top { grid-template-columns: 1fr; gap: 32px; }
    }

    /* ── MOBILE STICKY CTA BAR ─────────────────────────── */
    .mob-sticky-cta {
      display: none;
      position: fixed; bottom: 0; left: 0; right: 0;
      z-index: 400;
      background: rgba(255,255,255,.95);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-top: 1px solid var(--border);
      padding: 12px 16px;
      box-shadow: 0 -4px 20px rgba(7,25,46,.08);
    }
    @media (max-width: 1024px) {
      .mob-sticky-cta { display: flex; gap: 10px; align-items: center; }
      body { padding-bottom: 72px; }
    }
    .mob-sticky-cta .mob-cta-btn {
      flex: 1; padding: 14px 20px; border-radius: 12px;
      font-family: var(--font-h); font-size: 15px; font-weight: 700;
      text-align: center; text-decoration: none;
      transition: transform 0.15s ease;
    }
    .mob-sticky-cta .mob-cta-btn:active { transform: scale(0.97); }
    .mob-sticky-cta .mob-cta-primary {
      background: var(--orange); color: #fff;
      box-shadow: 0 4px 14px rgba(249,115,22,.18);
    }
    .mob-sticky-cta .mob-cta-secondary {
      background: transparent; color: var(--navy);
      border: 1.5px solid var(--border);
    }

  /* reduced-motion-v1 */
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}}
/* mobile-qa-v1 */
@media (max-width: 767px) {
  .btn, button, .btn-primary, .btn-secondary, .btn-outline, .cta, [class*="btn-"]:not([class*="-icon"]):not(svg), a.button, input[type="submit"], input[type="button"] {
    min-height: 44px !important;
    min-width: 44px !important;
  }
  /* mobile-qa-v1 font floor (font-size:max(14px,1em)!important) removed 2026-07-02:
     1em resolves to the PARENT size, so it inflated all authored micro/pill type to
     body size. Surgical mobile type floors live in mobile-optimize.css. */
  body, main, section, div, table, .container, .wrap, [class*="-wrap"], [class*="-grid"] {
    max-width: 100% !important;
  }
  img, video, iframe, svg { max-width: 100% !important; height: auto; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .mob-drawer, [class*="drawer"], .nav-drawer { width: 88vw !important; max-width: 320px !important; }
  html { overflow-x: hidden !important; }
}
@media (max-width: 359px) {
  .mob-drawer, [class*="drawer"], .nav-drawer { width: 96vw !important; max-width: 100vw !important; }
}
/* scroll-margin-anchor-v2 */
[id], section[id], h1[id], h2[id], h3[id], h4[id] { scroll-margin-top: 130px; }

/* §2 */
@media (max-width: 1024px) {
  .cb-fab, .callback-trigger { bottom: calc(90px + env(safe-area-inset-bottom, 0px)) !important; }
  .cb-panel, .callback-panel { bottom: calc(160px + env(safe-area-inset-bottom, 0px)) !important; width: min(320px, 90vw) !important; }
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  .mob-sticky-cta { padding-bottom: env(safe-area-inset-bottom, 0px); }
}

/* ============================================================
   Portal login hub (/login) — premium navy hero + elevated panel.
   Rebuilt 2026-06-29. NO orange fills on portal rows (orange is the
   conversion-CTA colour only). Plain divs, no landmark tags.
   ============================================================ */
.portal-hub{--ph-navy:#07192E;--ph-blue:#1779B8;--ph-muted:#5B6B7E;--ph-line:#E2ECF4;background:#fff;padding-bottom:64px;margin-top:-36px;}

/* Hero ---------------------------------------------------------- */
.portal-hub .ph-hero{position:relative;overflow:hidden;text-align:center;color:#fff;padding:66px 24px 106px;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(23,121,184,.30) 0%, transparent 46%),
    radial-gradient(120% 120% at 100% 0%, rgba(125,212,245,.16) 0%, transparent 40%),
    linear-gradient(160deg,#07192E 0%,#0C2741 55%,#103a5e 100%);}
.portal-hub .ph-hero-inner{max-width:720px;margin:0 auto;position:relative;z-index:1;}
.portal-hub .ph-eyebrow{display:inline-block;font-family:var(--font-h);font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#7DD4F5;margin:0 0 14px;}
/* max-width:none + margin auto override the legacy bare h1{max-width:11ch;margin-top:18px}
   in this page's old CSS, which was left-anchoring the centered headline. */
.portal-hub .ph-title{font-family:var(--font-h);font-size:clamp(30px,4.6vw,46px);font-weight:800;line-height:1.1;letter-spacing:-.02em;color:#fff;margin:0 auto 14px;max-width:none;}
.portal-hub .ph-sub{font-family:var(--font-b);font-size:16px;line-height:1.6;color:rgba(226,238,248,.82);margin:0 auto;max-width:560px;}
.portal-hub .ph-sub strong{color:#fff;font-weight:700;white-space:nowrap;}
.portal-hub .ph-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:9px 14px;margin-top:22px;font-family:var(--font-b);font-size:13px;color:rgba(226,238,248,.72);}
.portal-hub .ph-trust-item strong{color:#fff;font-family:var(--font-h);font-weight:800;}
.portal-hub .ph-trust-dot{width:4px;height:4px;border-radius:50%;background:rgba(226,238,248,.35);}

/* Elevated panel ------------------------------------------------ */
.portal-hub .ph-panel{position:relative;z-index:2;width:min(920px,calc(100% - 40px));margin:-66px auto 0;
  display:grid;grid-template-columns:1fr 1fr;gap:0 36px;background:#fff;border:1px solid var(--ph-line);border-radius:24px;padding:30px 34px;
  box-shadow:0 30px 60px -28px rgba(7,25,46,.32),0 8px 22px -14px rgba(7,25,46,.16);}
.portal-hub .ph-col{display:flex;flex-direction:column;}
.portal-hub .ph-col--divide{padding-left:36px;border-left:1px solid var(--ph-line);}
.portal-hub .ph-col-head{display:flex;align-items:center;gap:12px;margin:0 0 16px;}
.portal-hub .ph-col-ic{flex:0 0 42px;width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:#EEF5FB;color:var(--ph-blue);border:1px solid rgba(23,121,184,.14);}
.portal-hub .ph-col-ic svg{width:22px;height:22px;}
.portal-hub .ph-col-title{font-family:var(--font-h);font-size:18px;font-weight:800;color:var(--ph-navy);margin:0;line-height:1.15;letter-spacing:-.01em;}
.portal-hub .ph-col-sub{font-family:var(--font-b);font-size:13px;color:var(--ph-muted);margin:2px 0 0;line-height:1.35;}

/* Portal rows — clean, uniform, NO orange ----------------------- */
.portal-hub .ph-row{display:flex;align-items:center;gap:13px;text-decoration:none;padding:12px 14px;border-radius:13px;border:1px solid var(--ph-line);background:#fff;margin-top:10px;
  transition:transform .14s cubic-bezier(.22,1,.36,1),border-color .15s,box-shadow .18s,background .15s;}
.portal-hub .ph-row:first-of-type{margin-top:0;}
.portal-hub .ph-row--lead{background:#F4F9FD;border-color:#D5E6F2;}
.portal-hub .ph-row:hover{transform:translateY(-1px);border-color:var(--ph-blue);box-shadow:0 10px 22px -12px rgba(23,121,184,.4);background:#fff;}
.portal-hub .ph-row-ic{flex:0 0 38px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:#EEF5FB;color:var(--ph-blue);border:1px solid rgba(23,121,184,.12);transition:background .15s,color .15s,border-color .15s;}
.portal-hub .ph-row-ic svg{width:19px;height:19px;}
.portal-hub .ph-row:hover .ph-row-ic{background:var(--ph-blue);color:#fff;border-color:var(--ph-blue);}
.portal-hub .ph-row-txt{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0;}
.portal-hub .ph-row-t{font-family:var(--font-h);font-size:15px;font-weight:700;color:var(--ph-navy);line-height:1.25;letter-spacing:-.01em;}
.portal-hub .ph-row-s{font-family:var(--font-b);font-size:12px !important;color:var(--ph-muted);line-height:1.3;}
.portal-hub .ph-row-go{flex:0 0 18px;width:18px;height:18px;color:#A8BACC;transition:color .15s,transform .15s;}
.portal-hub .ph-row:hover .ph-row-go{color:var(--ph-blue);transform:translateX(3px);}
.portal-hub .ph-col-note{font-family:var(--font-b);font-size:12px;line-height:1.45;color:#8294A6;margin:14px 2px 0;}

/* Help band ----------------------------------------------------- */
.portal-hub .ph-help{display:flex;align-items:center;gap:18px;flex-wrap:wrap;width:min(920px,calc(100% - 40px));margin:22px auto 0;padding:18px 24px;border-radius:18px;background:#F7FAFD;border:1px solid var(--ph-line);}
.portal-hub .ph-help-ic{flex:0 0 44px;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:#fff;border:1px solid var(--ph-line);color:var(--ph-blue);}
.portal-hub .ph-help-ic svg{width:22px;height:22px;}
.portal-hub .ph-help-body{flex:1;min-width:260px;}
.portal-hub .ph-help-title{font-family:var(--font-h);font-size:16px;font-weight:800;color:var(--ph-navy);margin:0 0 3px;}
.portal-hub .ph-help-text{font-family:var(--font-b);font-size:13px;color:var(--ph-muted);line-height:1.5;margin:0;}
.portal-hub .ph-help-text strong{color:var(--ph-navy);}
.portal-hub .ph-help-call{display:inline-flex;align-items:center;gap:11px;text-decoration:none;padding:10px 16px;border-radius:12px;background:#fff;border:1px solid var(--ph-line);transition:border-color .15s,box-shadow .18s,transform .14s;}
.portal-hub .ph-help-call:hover{border-color:var(--ph-blue);box-shadow:0 8px 18px -12px rgba(23,121,184,.4);transform:translateY(-1px);}
.portal-hub .ph-help-call svg{width:18px;height:18px;color:var(--ph-blue);flex:0 0 18px;}
.portal-hub .ph-help-call-txt{display:flex;flex-direction:column;line-height:1.2;}
.portal-hub .ph-help-call-num{font-family:var(--font-h);font-size:16px;font-weight:800;color:var(--ph-navy);}
.portal-hub .ph-help-call-hrs{font-family:var(--font-b);font-size:11.5px !important;color:#8294A6;}

@media (max-width:820px){
  .portal-hub .ph-panel{grid-template-columns:1fr;gap:0;padding:24px 20px;margin-top:-58px;}
  .portal-hub .ph-col--divide{padding-left:0;border-left:0;border-top:1px solid var(--ph-line);margin-top:22px;padding-top:22px;}
}
@media (max-width:600px){
  .portal-hub .ph-hero{padding:48px 18px 94px;}
  .portal-hub .ph-help{flex-direction:column;align-items:flex-start;gap:14px;margin-top:16px;}
  .portal-hub .ph-help-call{width:100%;justify-content:center;}
}
