:root{
  --blue:#0b5cab;--blue2:#0d71c8;--navy:#073b6f;--gold:#f4b400;
  --bg:#f4f7fb;--card:#fff;--text:#17324d;--muted:#64778b;--line:#dce6ef;
  --ok:#16875b;--warn:#b06b00;--shadow:0 12px 34px rgba(10,63,109,.12);
  --radius:20px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.5}
a{color:inherit}.container{width:min(1180px,calc(100% - 32px));margin:auto}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:16px;top:16px;z-index:99;background:#fff;padding:10px 14px;border-radius:10px}
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:48px;height:48px;color:var(--blue)}
.brand-mark svg{width:100%;height:100%}.brand-kicker{font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--blue)}
.brand-title{font-weight:900;font-size:20px;color:var(--navy);letter-spacing:.02em}
.icon-btn{width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:22px;cursor:pointer}
.icon-btn:hover{background:#eef5fb}
.hero{background:linear-gradient(135deg,#074a89 0%,#0b69b8 55%,#1688d6 100%);color:#fff;overflow:hidden}
.hero-grid{min-height:350px;display:grid;grid-template-columns:1.4fr .8fr;gap:34px;align-items:center;padding:54px 0}
.eyebrow{text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:800;margin:0 0 10px;color:#bfe5ff}
.hero h1{font-size:clamp(36px,6vw,64px);line-height:1.04;margin:0 0 16px;letter-spacing:-.03em}
.hero-text{font-size:18px;max-width:720px;color:#e8f5ff;margin:0 0 22px}
.hero-badges{display:flex;gap:10px;flex-wrap:wrap}.hero-badges span{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.10);padding:8px 12px;border-radius:999px;font-size:13px}
.hero-panel{height:250px;position:relative;display:grid;place-items:center}
.hero-card{width:260px;background:rgba(255,255,255,.96);color:var(--navy);padding:28px;border-radius:26px;box-shadow:0 24px 60px rgba(0,0,0,.22);display:flex;flex-direction:column;gap:6px;position:relative;z-index:2}
.hero-card-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#e9f5ff;color:var(--blue);font-size:26px;margin-bottom:8px}
.hero-card span{font-size:13px;color:var(--muted)}
.hero-orb{position:absolute;border-radius:50%;filter:blur(2px);background:rgba(255,255,255,.13)}.orb-1{width:190px;height:190px;right:6%;top:-25px}.orb-2{width:120px;height:120px;left:3%;bottom:-15px}
.section{padding:42px 0 54px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}
.section-heading .eyebrow{color:var(--blue)}.section-heading h2{font-size:30px;margin:0;color:var(--navy)}
.search-wrap{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 12px;min-width:280px}
.search-wrap input{border:0;outline:0;background:transparent;width:100%;padding:12px 4px;font-size:15px;color:var(--text)}
.apps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.app-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;min-height:245px;box-shadow:0 4px 16px rgba(19,67,107,.04);transition:.2s ease}
.app-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#bfd9ef}
.app-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.app-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#eaf5ff;color:var(--blue);font-size:27px}
.app-status{font-size:12px;font-weight:800;border-radius:999px;padding:6px 9px;background:#e9f7f1;color:var(--ok)}.app-status.soon{background:#fff4df;color:var(--warn)}
.app-card h3{font-size:20px;margin:18px 0 8px;color:var(--navy)}.app-card p{color:var(--muted);margin:0 0 20px;font-size:14px;flex:1}
.app-actions{display:flex;align-items:center;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;border:0;border-radius:12px;padding:11px 14px;font-weight:800;font-size:14px;cursor:pointer}
.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:var(--navy)}.btn-disabled{background:#eef2f5;color:#8695a5;cursor:not-allowed}
.app-code{font-size:11px;color:#94a3b3;margin-left:auto}
.empty-state{text-align:center;background:#fff;border:1px dashed #b9c9d8;padding:28px;border-radius:16px;color:var(--muted)}
.quick-info{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 0}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.info-grid article{display:flex;gap:13px;align-items:center}
.info-icon{width:42px;height:42px;border-radius:13px;background:#edf6ff;display:grid;place-items:center;color:var(--blue);font-weight:900}
.info-grid strong,.info-grid span{display:block}.info-grid span{color:var(--muted);font-size:13px;margin-top:2px}
.footer{padding:28px 0 42px}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer p{margin:4px 0 0;color:var(--muted);font-size:13px}
.footer-status{font-size:13px;color:var(--muted);white-space:nowrap}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22a06b;margin-right:6px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-panel{display:none}.apps-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.container{width:min(100% - 22px,1180px)}.topbar-inner{min-height:68px}.brand-mark{width:42px;height:42px}.brand-kicker{font-size:9px}.brand-title{font-size:16px}.hero-grid{padding:38px 0;min-height:auto}.hero h1{font-size:40px}.hero-text{font-size:15px}.section{padding:30px 0}.section-heading{align-items:stretch;flex-direction:column}.section-heading h2{font-size:25px}.search-wrap{min-width:0;width:100%}.apps-grid{grid-template-columns:1fr}.app-card{min-height:220px}.info-grid{grid-template-columns:1fr}.footer-inner{align-items:flex-start;flex-direction:column}}
