
:root{--blue:#0052CC;--dark:#172B4D;--muted:#5E6C84;--border:#DFE1E6;--bg:#F7F9FC;--teal:#00A3BF;--green:#00875A}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--dark);background:linear-gradient(180deg,#F7F9FC 0%,#FFF 45%);line-height:1.65}
.page{max-width:1120px;margin:0 auto;padding:32px 24px 64px}
.hero{background:radial-gradient(circle at top right,rgba(0,163,191,.14),transparent 34%),linear-gradient(135deg,#FFF 0%,#F4F7FB 100%);border:1px solid var(--border);border-radius:24px;padding:34px;box-shadow:0 10px 32px rgba(9,30,66,.08);margin-bottom:28px}
.brand{display:flex;align-items:center;gap:18px;margin-bottom:24px}
.logo{width:112px;height:112px;object-fit:contain;border-radius:18px;background:#FFF;border:1px solid #EEF1F6;padding:10px}
.eyebrow{color:var(--blue);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px;margin-bottom:4px}
h1{margin:0;font-size:40px;line-height:1.15;letter-spacing:-.03em;color:#0C1F3F}
.subtitle{margin:14px 0 0;font-size:18px;color:var(--muted);max-width:820px}
.badges{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.badge{display:inline-flex;align-items:center;background:#DEEBFF;color:#0747A6;border:1px solid #B3D4FF;border-radius:999px;padding:8px 14px;font-weight:650;font-size:14px}
.badge.teal{background:#E6FCFF;color:#006C7F;border-color:#B3F5FF}.badge.green{background:#E3FCEF;color:#006644;border-color:#ABF5D1}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px}
.content{background:#FFF;border:1px solid var(--border);border-radius:20px;padding:32px;box-shadow:0 8px 24px rgba(9,30,66,.05)}
.sidebar{position:sticky;top:24px;align-self:start;background:#FFF;border:1px solid var(--border);border-radius:20px;padding:22px;box-shadow:0 8px 24px rgba(9,30,66,.05)}
.sidebar h3{margin-top:0;font-size:16px;color:#0C1F3F}.sidebar a{display:block;color:var(--muted);text-decoration:none;padding:8px 0;border-bottom:1px solid #F1F2F4;font-size:14px}.sidebar a:hover{color:var(--blue)}
h2{color:#0C1F3F;margin-top:34px;margin-bottom:12px;font-size:25px;letter-spacing:-.02em;padding-top:10px}h2:first-child{margin-top:0}h3{color:#172B4D;margin-top:24px;font-size:20px}
p{margin:0 0 14px}ul,ol{margin-top:8px;margin-bottom:20px;padding-left:24px}li{margin-bottom:8px}
.info{background:#F4F7FB;border:1px solid #E6EAF0;border-left:4px solid var(--blue);border-radius:14px;padding:18px 20px;margin:22px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0}.feature{border:1px solid #E6EAF0;border-radius:16px;padding:18px;background:#FFF}.feature strong{display:block;color:#0C1F3F;margin-bottom:6px}.feature span{color:var(--muted);font-size:14px}
.footer{margin-top:32px;padding-top:22px;border-top:1px solid var(--border);color:var(--muted);font-size:14px}a{color:var(--blue)}
@media(max-width:900px){.layout{grid-template-columns:1fr}.sidebar{position:static}h1{font-size:32px}.hero{padding:24px}.grid{grid-template-columns:1fr}.brand{align-items:flex-start}.logo{width:84px;height:84px}}
