:root {
          --wsi-blue-900:#1e3a8a;
          --wsi-blue-800:#1e40af;
          --wsi-blue-700:#1d4ed8;
          --slate-900:#0f172a;
          --wsi-slate-900:var(--slate-900);
          --slate-700:#334155;
          --wsi-slate-700:var(--slate-700);
          --slate-500:#64748b;
          --wsi-slate-500:var(--slate-500);
          --slate-200:#e2e8f0;
          --wsi-slate-200:var(--slate-200);
          --slate-50:#f8fafc;
          --wsi-slate-50:var(--slate-50);
          --white:#ffffff;
          --wsi-hero-title:var(--white);
          --wsi-hero-subtitle:#dbeafe;
          --wsi-bg-primary-light:var(--wsi-slate-50);
          --wsi-text-body:var(--wsi-slate-900);
          --wsi-hero-gradient-start:var(--wsi-blue-900);
          --wsi-hero-gradient-mid:var(--wsi-blue-800);
          --wsi-hero-gradient-end:var(--wsi-blue-700);
          --wsi-hero-gradient:linear-gradient(to right,var(--wsi-hero-gradient-start),var(--wsi-hero-gradient-mid),var(--wsi-hero-gradient-end));
          --wsi-card-bg:var(--white);
          --wsi-card-text:var(--wsi-text-body);
          --wsi-card-border:var(--wsi-slate-200);
          --wsi-card-radius:8px;
          --wsi-button-radius-pill:9999px;
          --wsi-container-max:1120px;
          --wsi-footer-bg:var(--white);
          --wsi-footer-text:var(--wsi-slate-500);
          --wsi-footer-link:var(--wsi-blue-700);
          --wsi-focus-ring:#f59e0b;
          --wsi-focus-shadow:rgba(245,158,11,.32);
        }
        * { box-sizing:border-box; }
        body {
          margin:0;
          min-height:100vh;
          font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
          background:var(--slate-50);
          color:var(--slate-900);
        }
        a,
        button,
        select,
        input,
        textarea {
          transition:
            color 160ms ease,
            background-color 160ms ease,
            border-color 160ms ease,
            box-shadow 160ms ease,
            outline-color 160ms ease;
        }
        a:focus-visible,
        button:focus-visible,
        select:focus-visible,
        input:focus-visible,
        textarea:focus-visible {
          outline:3px solid var(--wsi-focus-ring);
          outline-offset:3px;
          box-shadow:0 0 0 6px var(--wsi-focus-shadow);
        }
        .sr-only {
          position:absolute;
          width:1px;
          height:1px;
          padding:0;
          margin:-1px;
          overflow:hidden;
          clip:rect(0,0,0,0);
          white-space:nowrap;
          border:0;
        }
        .skip-link {
          position:absolute;
          left:18px;
          top:12px;
          z-index:10;
          transform:translateY(-160%);
          border-radius:999px;
          background:var(--wsi-blue-900);
          color:white;
          padding:10px 14px;
          font-size:14px;
          font-weight:900;
          text-decoration:none;
        }
        .skip-link:focus-visible {
          transform:translateY(0);
        }
        .topbar {
          background:white;
          border-bottom:1px solid var(--slate-200);
        }
        .topbar-inner {
          max-width:1100px;
          margin:auto;
          padding:14px 18px;
          display:flex;
          justify-content:space-between;
          align-items:center;
          gap:16px;
        }
        .brand {
          display:flex;
          align-items:center;
          gap:12px;
          text-decoration:none;
          color:var(--slate-900);
        }
        .logo {
          width:42px;
          height:42px;
          border-radius:999px;
          background:var(--wsi-blue-900);
          color:white;
          display:inline-flex;
          align-items:center;
          justify-content:center;
          font-weight:900;
        }
        .brand-title {
          font-size:18px;
          font-weight:900;
          line-height:1.15;
        }
        .brand-subtitle {
          font-size:13px;
          color:var(--slate-500);
          margin-top:2px;
        }
        .toplink {
          color:var(--wsi-blue-700);
          font-weight:800;
          text-decoration:none;
          font-size:14px;
        }
        .hero {
          background:var(--wsi-hero-gradient);
          color:white;
        }
        .hero-landing {
          width:100vw;
          margin-left:calc(50% - 50vw);
          margin-right:calc(50% - 50vw);
        }
        .hero-inner {
          width:100%;
          max-width:var(--wsi-container-max);
          margin:auto;
          padding:56px 18px;
          display:grid;
          grid-template-columns:minmax(0,1.3fr) minmax(280px,.8fr);
          gap:32px;
          align-items:center;
        }
        .badge {
          display:inline-flex;
          border-radius:999px;
          background:rgba(255,255,255,.12);
          border:1px solid rgba(219,234,254,.28);
          padding:8px 14px;
          color:#dbeafe;
          font-size:13px;
          font-weight:900;
          text-transform:uppercase;
          letter-spacing:.03em;
        }
        h1 {
          margin:20px 0 16px;
          font-size:clamp(34px,5vw,54px);
          line-height:1.08;
          letter-spacing:-.05em;
          font-weight:950;
          color:white;
        }
        .hero p {
          margin:0;
          color:#dbeafe;
          font-size:18px;
          line-height:1.7;
          max-width:720px;
        }
        .card {
          background:white;
          color:var(--slate-900);
          border-radius:22px;
          padding:28px;
          box-shadow:0 20px 45px rgba(15,23,42,.20);
          border:1px solid rgba(226,232,240,.8);
        }
        .card h2 {
          margin:0 0 12px;
          font-size:24px;
          letter-spacing:-.03em;
        }
        .card p {
          color:var(--slate-700);
          line-height:1.65;
          margin:0 0 20px;
        }
        .boundary-note {
          display:grid;
          gap:6px;
          margin:0 0 20px;
          padding:12px 14px;
          border:1px solid var(--wsi-card-border);
          border-left:4px solid var(--wsi-blue-700);
          border-radius:var(--wsi-card-radius);
          background:var(--wsi-bg-primary-light);
          color:var(--wsi-slate-700);
          font-size:14px;
          line-height:1.5;
        }
        .boundary-note strong {
          color:var(--wsi-slate-900);
          font-size:14px;
        }
        .boundary-note span {
          display:block;
        }
        .actions {
          display:grid;
          gap:12px;
        }
        .btn {
          display:inline-flex;
          justify-content:center;
          align-items:center;
          padding:13px 18px;
          border-radius:999px;
          font-weight:900;
          text-decoration:none;
          border:1px solid transparent;
        }
        .btn-primary {
          background:var(--wsi-blue-700);
          color:white;
        }
        .btn-primary:hover {
          background:var(--wsi-blue-800);
        }
        .btn-outline {
          color:var(--wsi-blue-800);
          border-color:#bfdbfe;
          background:#eff6ff;
        }
        .section {
          max-width:1100px;
          margin:auto;
          padding:36px 18px 48px;
          display:grid;
          grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
          gap:18px;
        }
        .info-card {
          background:white;
          border:1px solid var(--slate-200);
          border-radius:18px;
          padding:22px;
          box-shadow:0 8px 20px rgba(15,23,42,.045);
        }
        .info-card h3 {
          margin:0 0 8px;
          font-size:18px;
        }
        .info-card p {
          margin:0;
          color:var(--slate-700);
          line-height:1.6;
          font-size:14px;
        }
        footer {
          text-align:center;
          color:var(--slate-500);
          font-size:13px;
          padding:24px 18px 40px;
        }
        footer a {
          color:var(--wsi-blue-700);
          font-weight:800;
          text-decoration:none;
        }
        @media (max-width:760px) {
          .hero-inner { grid-template-columns:1fr; padding:42px 18px; }
          .topbar-inner { flex-direction:column; align-items:flex-start; }
        }
      
        .app-chip,
        .chip {
          text-decoration: none;
          display: inline-block;
        }
        .app-chip:hover,
        .chip:hover {
          background: #dbeafe;
          color: #1d4ed8;
        }
        
    .lang-switcher {
      display:flex;
      align-items:center;
      justify-content:flex-end;
      margin-left:auto;
    }

    .lang-switcher select {
      min-width:230px;
      min-height:44px;
      padding:0 12px;
      border:1px solid var(--wsi-slate-200);
      border-radius:999px;
      background:#fff;
      color:var(--wsi-slate-900);
      font-size:14px;
      font-weight:700;
    }

    @media (max-width:720px) {
      .topbar-inner {
        flex-wrap:wrap;
      }

      .lang-switcher {
        width:100%;
        justify-content:flex-start;
        order:3;
      }

      .lang-switcher select {
        width:100%;
      }
    }

/* KRP refined responsive header actions */
.topbar-actions {
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  flex-wrap:wrap;
}

.topbar-actions .toplink {
  white-space:nowrap;
}

.topbar-actions .lang-switcher {
  margin-left:0;
  width:auto;
}

.topbar-actions .lang-switcher select {
  min-width:260px;
  max-width:320px;
  min-height:44px;
}

@media (max-width:760px) {
  .topbar-inner {
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }

  .topbar-actions {
    width:100%;
    margin-left:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:nowrap;
  }

  .topbar-actions .toplink {
    font-size:13px;
    white-space:nowrap;
  }

  .topbar-actions .toplink {
    font-size:0;
  }

  .topbar-actions .toplink::after {
    content:"← Back to Portal";
    font-size:13px;
  }

  .topbar-actions .lang-switcher {
    flex:1;
    display:flex;
    justify-content:flex-end;
  }

  .topbar-actions .lang-switcher select {
    width:100%;
    max-width:210px;
    min-width:150px;
  }
}