/* Knowledge Hub, Insights, articles, self-assessment, glossary, security, search */
.hub-head { padding:44px 0 28px; }
.hub-toolbar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 22px; }
.hub-filters { display:flex; gap:8px; flex-wrap:wrap; }
.chip { border:1px solid var(--line-2); background:#fff; color:var(--steel); border-radius:999px; padding:7px 14px; font:600 13px Inter,sans-serif; cursor:pointer; transition:.15s; }
.chip:hover { border-color:var(--blue); color:var(--blue); } .chip[aria-pressed="true"] { background:var(--navy); border-color:var(--navy); color:#fff; }
.hub-search { display:flex; gap:8px; } .hub-search input { padding:9px 13px; border:1px solid var(--line-2); border-radius:10px; font:inherit; font-size:14px; min-width:220px; }
.res-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.res-card { display:flex; flex-direction:column; gap:10px; padding:22px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:var(--shadow); color:inherit; transition:transform .15s, border-color .15s; }
.res-card:hover { transform:translateY(-3px); border-color:rgba(26,111,216,.4); }
.res-type { display:inline-flex; align-items:center; gap:6px; width:max-content; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:4px 10px; border-radius:999px; background:#eaf4ff; color:var(--blue); }
.res-type.checklist { background:#e9fbf1; color:#087443; } .res-type.template { background:#fff4e5; color:#8a5a00; } .res-type.tool { background:#f1e9ff; color:#5b21b6; } .res-type.policy,.res-type.advisory { background:#fdecec; color:#b42318; } .res-type.news { background:#eef2f7; color:var(--steel); }
.res-card h3 { margin:0; font-size:17.5px; line-height:1.3; } .res-card p { margin:0; color:var(--steel); font-size:14px; }
.res-meta { margin-top:auto; padding-top:8px; font-size:12.5px; color:var(--muted); display:flex; gap:10px; flex-wrap:wrap; }
.sev { font-weight:800; text-transform:uppercase; font-size:11px; padding:3px 8px; border-radius:6px; } .sev.low{background:#e9fbf1;color:#087443} .sev.medium{background:#fff4e5;color:#8a5a00} .sev.high{background:#fdecec;color:#b42318} .sev.critical{background:#b42318;color:#fff}
/* Article */
.article-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:40px; align-items:start; }
.article { max-width:760px; }
.article h1 { font-size:clamp(28px,4vw,42px); line-height:1.1; letter-spacing:-.02em; margin:10px 0 14px; }
.article .lede { font-size:18px; color:var(--steel); margin:0 0 20px; }
.article-meta { display:flex; gap:14px; flex-wrap:wrap; font-size:13px; color:var(--muted); padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:26px; }
.md { font-size:16.5px; line-height:1.75; color:var(--body); }
.md h2 { font-size:24px; margin:34px 0 10px; letter-spacing:-.01em; } .md h3 { font-size:19px; margin:26px 0 8px; } .md h4 { font-size:16px; margin:20px 0 6px; }
.md p { margin:0 0 16px; } .md ul,.md ol { margin:0 0 16px; padding-left:24px; } .md li { margin-bottom:6px; }
.md blockquote { margin:18px 0; padding:14px 18px; border-left:4px solid var(--blue); background:var(--bg-2); border-radius:0 10px 10px 0; } .md blockquote p { margin:0; }
.md code { font-family:ui-monospace,monospace; font-size:.92em; background:var(--bg-2); padding:1px 6px; border-radius:5px; } .md pre { background:var(--navy); color:#dbe5f6; padding:16px; border-radius:12px; overflow:auto; } .md pre code { background:none; padding:0; color:inherit; }
.md-table { overflow:auto; margin:0 0 18px; border:1px solid var(--line); border-radius:12px; } .md table { border-collapse:collapse; width:100%; min-width:520px; font-size:14.5px; } .md th,.md td { padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; } .md th { background:var(--bg-2); color:var(--ink); } .md tr:last-child td { border-bottom:0; }
.md hr { border:0; border-top:1px solid var(--line); margin:28px 0; }
.aside-card { position:sticky; top:92px; display:grid; gap:18px; }
.aside-box { border:1px solid var(--line); border-radius:14px; background:#fff; padding:18px; box-shadow:var(--shadow); }
.aside-box h4 { margin:0 0 10px; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.aside-box ol { margin:0; padding-left:18px; font-size:14px; line-height:1.5; } .aside-box li { margin-bottom:6px; } .aside-box a { color:var(--steel); } .aside-box a:hover { color:var(--blue); }
.aside-box.cta { background:linear-gradient(160deg,var(--navy),var(--navy-2)); color:#cbd9ee; border-color:transparent; } .aside-box.cta h4 { color:#9fb0cb; } .aside-box.cta p { margin:0 0 12px; font-size:14px; } .aside-box.cta strong { color:#fff; }
.share-row { display:flex; gap:8px; flex-wrap:wrap; } .share-row button { border:1px solid var(--line-2); background:#fff; border-radius:8px; padding:7px 12px; font:600 12.5px Inter,sans-serif; cursor:pointer; color:var(--steel); } .share-row button:hover { border-color:var(--blue); color:var(--blue); }
.disclaimer { font-size:13px; color:var(--muted); border-top:1px solid var(--line); padding-top:14px; margin-top:28px; }
/* Self-assessment */
.sa-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:28px; align-items:start; }
.sa-domain { border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:var(--shadow); margin-bottom:18px; overflow:hidden; }
.sa-domain > h3 { margin:0; padding:16px 20px; background:var(--bg-2); border-bottom:1px solid var(--line); font-size:16px; display:flex; justify-content:space-between; align-items:center; } .sa-domain > h3 small { font-weight:600; color:var(--muted); font-size:12.5px; }
.sa-q { padding:14px 20px; border-bottom:1px solid var(--line); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; } .sa-q:last-child { border-bottom:0; }
.sa-q p { margin:0; font-size:14.5px; color:var(--ink); } .sa-q small { display:block; color:var(--muted); font-size:12.5px; margin-top:2px; }
.sa-opts { display:flex; gap:4px; background:var(--bg-2); border-radius:10px; padding:4px; }
.sa-opts label { cursor:pointer; } .sa-opts input { position:absolute; opacity:0; pointer-events:none; }
.sa-opts span { display:inline-block; padding:7px 12px; border-radius:8px; font-size:12.5px; font-weight:700; color:var(--steel); }
.sa-opts input:checked + span { background:#fff; color:var(--ink); box-shadow:var(--shadow); } .sa-opts input:focus-visible + span { outline:3px solid rgba(26,111,216,.55); }
.sa-opts input[value="2"]:checked + span { color:#087443; } .sa-opts input[value="0"]:checked + span { color:#b42318; }
.sa-panel { position:sticky; top:92px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:var(--shadow); padding:22px; }
.sa-score { text-align:center; margin-bottom:14px; } .sa-ring { width:140px; height:140px; margin:0 auto 8px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--blue) calc(var(--p,0)*1%), var(--bg-3) 0); position:relative; }
.sa-ring::before { content:""; position:absolute; inset:12px; border-radius:50%; background:#fff; } .sa-ring b { position:relative; font-size:30px; color:var(--ink); } .sa-ring b small { font-size:14px; color:var(--muted); font-weight:600; }
.sa-band { font-weight:800; color:var(--ink); } .sa-progress { font-size:12.5px; color:var(--muted); margin-top:4px; }
.sa-bars { display:grid; gap:10px; margin:16px 0; } .sa-bar { font-size:12.5px; } .sa-bar div { display:flex; justify-content:space-between; margin-bottom:3px; color:var(--steel); } .sa-bar i { display:block; height:7px; border-radius:99px; background:var(--bg-3); overflow:hidden; } .sa-bar i::after { content:""; display:block; height:100%; width:var(--w,0%); background:linear-gradient(90deg,var(--blue),var(--green)); border-radius:99px; transition:width .3s; }
.sa-recs { font-size:13.5px; color:var(--steel); } .sa-recs h4 { margin:12px 0 6px; font-size:13px; color:var(--ink); } .sa-recs ul { margin:0; padding-left:18px; } .sa-recs li { margin-bottom:5px; }
.sa-form { margin-top:16px; border-top:1px solid var(--line); padding-top:16px; } .sa-form .form-field { margin-bottom:10px; } .sa-form label { font-size:12.5px; }
/* Glossary */
.glossary-az { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 24px; } .glossary-az a { display:inline-grid; place-items:center; width:34px; height:34px; border:1px solid var(--line-2); border-radius:8px; font-weight:700; font-size:13px; color:var(--steel); } .glossary-az a:hover { border-color:var(--blue); color:var(--blue); }
.glossary-list { display:grid; gap:14px; max-width:860px; } .glossary-letter { font-size:26px; font-weight:800; color:var(--blue); margin:18px 0 4px; letter-spacing:-.02em; }
.gl-term { border:1px solid var(--line); border-radius:14px; background:#fff; padding:16px 18px; } .gl-term dt { font-weight:800; color:var(--ink); font-size:16px; margin-bottom:5px; } .gl-term dd { margin:0; color:var(--steel); font-size:14.5px; line-height:1.6; }
/* Security page */
.vdp-grid { display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:28px; align-items:start; }
.vdp-grid .md { font-size:15.5px; }
/* Search */
.search-box { display:flex; gap:10px; max-width:720px; margin:0 auto 26px; } .search-box input { flex:1; padding:14px 18px; border:1px solid var(--line-2); border-radius:12px; font:inherit; font-size:17px; }
.search-results { max-width:820px; margin:0 auto; display:grid; gap:12px; }
.sr { display:block; padding:16px 18px; border:1px solid var(--line); border-radius:14px; background:#fff; color:inherit; } .sr:hover { border-color:rgba(26,111,216,.45); }
.sr .res-type { margin-bottom:6px; } .sr h3 { margin:0 0 4px; font-size:16.5px; } .sr p { margin:0; color:var(--steel); font-size:14px; } .sr mark { background:#fff3bf; padding:0 2px; border-radius:3px; }
/* Newsletter */
.newsletter { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; padding:28px 30px; border-radius:18px; background:linear-gradient(135deg,var(--navy),var(--navy-2)); color:#cbd9ee; }
.newsletter h3 { margin:0 0 4px; color:#fff; font-size:20px; } .newsletter p { margin:0; font-size:14px; }
.newsletter form { display:flex; gap:8px; flex-wrap:wrap; } .newsletter input { padding:11px 14px; border-radius:10px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff; font:inherit; min-width:240px; } .newsletter input::placeholder { color:#9fb0cb; }
.newsletter .form-result { flex-basis:100%; font-size:13px; }
/* Nav search */
.nav-search { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:9px; border:1px solid var(--line-2); background:#fff; color:var(--navy); margin-right:6px; } .nav-search:hover { border-color:var(--navy); }
@media (max-width:980px) { .res-grid { grid-template-columns:1fr 1fr; } .article-layout,.sa-layout,.vdp-grid { grid-template-columns:1fr; } .aside-card,.sa-panel { position:static; } .newsletter { grid-template-columns:1fr; } }
@media (max-width:600px) { .res-grid { grid-template-columns:1fr; } .sa-q { grid-template-columns:1fr; } .hub-search input { min-width:0; width:100%; } }