@import url('/brand/brand-orbit.css?v=20260826j');

:root { --ink: #08172f; --muted: #5d6b82; --line: #dce5f0; --blue: #1268f3; --soft: #f4f8fc; --navy: #04142e; }
* { box-sizing: border-box; }
body { margin: 0; font-family: Manrope, Arial, sans-serif; color: var(--ink); background: var(--soft); min-height: 100vh; }
.portal { min-height: 100vh; display: grid; grid-template-columns: 1.06fr .94fr; }
.portal-aside { background: radial-gradient(circle at 72% 44%, #0b3871 0, #061d42 29%, #04142e 68%); color: #fff; padding: 62px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.portal-aside::before, .portal-aside::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(39, 157, 255, .22); pointer-events: none; }
.portal-aside::before { width: 500px; height: 500px; right: -120px; bottom: -200px; }
.portal-aside::after { width: 350px; height: 350px; right: -45px; bottom: -125px; border-style: dashed; animation: opx-ring-spin 28s linear infinite; }
.portal-aside > * { position: relative; z-index: 2; }
.portal-aside .opx-logo { --opx-size: 78px; gap: 20px; }
.portal-aside .opx-wordmark strong { font-size: 34px; }
.portal-aside .opx-wordmark span { font-size: 28px; }
.portal-aside .opx-word-a { width: 32px; height: 34px; }
.portal-aside h1 { font-size: clamp(40px, 5vw, 68px); line-height: 1.02; letter-spacing: -.055em; max-width: 660px; margin: 42px 0 18px; }
.portal-aside p { color: #abc0dc; line-height: 1.75; max-width: 590px; font-size: 17px; }
.portal-aside small { color: #7893b5; }
.portal-main { padding: 50px; display: grid; place-items: center; background: radial-gradient(circle at 50% 35%, #fff, #f3f7fc 76%); }
.portal-card { width: min(530px, 100%); background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 28px; padding: 42px; box-shadow: 0 25px 70px rgba(14, 44, 85, .14); }
.portal-card > span { font-size: 10px; color: var(--blue); font-weight: 800; letter-spacing: .14em; }
.portal-card h2 { font-size: 31px; margin: 14px 0; }
.portal-card p { color: var(--muted); line-height: 1.75; font-size: 13px; }
.portal-actions { display: grid; gap: 10px; margin-top: 28px; }
.portal-actions a { height: 52px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; border: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.portal-actions a:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(10, 65, 140, .10); }
.portal-actions .primary { background: linear-gradient(135deg, #0c63e9, #1787ff); color: #fff; border-color: var(--blue); }
@media (max-width: 850px) {
  .portal { grid-template-columns: 1fr; }
  .portal-aside { min-height: 390px; padding: 34px; }
  .portal-aside .opx-logo { --opx-size: 58px; gap: 13px; }
  .portal-aside .opx-wordmark strong { font-size: 24px; }
  .portal-aside .opx-wordmark span { font-size: 20px; }
  .portal-aside .opx-word-a { width: 23px; height: 25px; }
  .portal-aside h1 { font-size: 42px; margin-top: 55px; }
  .portal-main { padding: 24px; }
  .portal-card { padding: 28px; }
}