.visual-system .hub-page { width:min(1200px,calc(100% - 48px));margin:0 auto;padding:0 0 60px; }
.hub-breadcrumb { display:flex;gap:10px;font-size:12px;line-height:1.5;color:#59616d;margin:0 0 28px; }
.hub-breadcrumb a { color:#03256c;text-decoration:none; }
.hub-overview { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:60px;align-items:center;margin-bottom:40px;background:url('/assets/page-drafting.svg') no-repeat 45% bottom/220px 250px; }
.hub-eyebrow { margin:0 0 18px;color:#59616d;font:700 11px/1.6 Roboto,Arial,sans-serif;letter-spacing:1px;text-transform:uppercase; }
.hub-eyebrow::before { content:'';display:inline-block;width:24px;height:3px;background:#e60012;margin:0 10px 3px 0; }
.visual-system .hub-overview h1 { margin:0 0 20px;font:700 clamp(38px,3.8vw,54px)/1.08 'Roboto Condensed',Roboto,Arial,sans-serif;color:#03256c;text-transform:none; }
.hub-intro { margin:0;max-width:580px;color:#59616d;font:400 17px/1.7 Roboto,Arial,sans-serif; }
.visual-system .hub-guide { display:block;padding:26px 28px;background:#03256c;color:#fff;border-radius:12px;border:0; }
.visual-system .hub-guide h2 { margin:0 0 20px;font:700 28px/1.2 'Roboto Condensed',Roboto,Arial,sans-serif;color:#fff;text-transform:none; }
.visual-system .hub-guide a { display:flex;gap:14px;align-items:center;border-top:1px solid #ffffff40;padding:16px 0;color:#fff;text-decoration:none; }
.hub-step { flex:0 0 20px;color:#b7c5e1;font:700 18px 'Roboto Condensed',Roboto,Arial,sans-serif; }
.hub-guide strong { display:block;font:500 15px/1.4 Roboto,Arial,sans-serif; }
.hub-guide small { display:block;margin-top:4px;color:#d1d9e9;font:400 11px/1.5 Roboto,Arial,sans-serif; }
.hub-guide a>span:last-child { margin-left:auto;font-size:22px; }
.hub-guide a:hover strong { text-decoration:underline; }
.hub-section-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px; }
.visual-system .hub-content h2,.visual-system .hub-info-section>h2 { color:#03256c;font:700 30px/1.2 'Roboto Condensed',Roboto,Arial,sans-serif;text-transform:none;margin:0; }
.hub-section-heading>span { font-size:12px;color:#59616d; }
.hub-search { display:block;margin:0 0 20px; }
.hub-search>label { display:block;margin-bottom:8px;font-size:13px;font-weight:500;color:#1a1f29; }
.hub-search>div { display:flex;gap:10px;align-items:center; }
.visual-system .hub-search input[type=search] { width:100%;min-width:0;margin:0;padding:12px 14px;border:1px solid #cbd1da;border-radius:7px;background:#fff;color:#1a1f29;font:400 15px/1.5 Roboto,Arial,sans-serif; }
.visual-system .hub-search button { padding:12px 22px;border:1px solid #0034ff;border-radius:7px;background:#0034ff;color:#fff;font:600 14px/1.5 Roboto,Arial,sans-serif;cursor:pointer; }
.visual-system .hub-search button:hover { background:#03256c;border-color:#03256c; }
.hub-reset { color:#03256c;font-size:12px;white-space:nowrap; }
.visual-system .hub-tabs { display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;padding:0;margin:0 0 20px;border:0; }
.visual-system .hub-tabs a { display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid #e0e0e0;border-radius:7px;color:#03256c;text-decoration:none;font:500 12px/1.5 Roboto,Arial,sans-serif;background:#fff; }
.visual-system .hub-tabs a[aria-current] { background:#03256c;border-color:#03256c;color:#fff; }
.hub-tabs a:hover { border-color:#03256c; }
.hub-tabs a>span { font-size:10px;opacity:.8; }
.hub-result-status { margin:0 0 16px;color:#59616d;font-size:12px;scroll-margin-top:24px; }
.hub-explanation { padding:16px 18px;border-left:3px solid #1e8e5a;border-radius:7px;background:#f5f5f5;font-size:14px;color:#59616d;line-height:1.7; }
.hub-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px; }
.hub-card { min-width:0;display:flex;flex-direction:column;border:1px solid #e0e0e0;border-radius:10px;background:#fff;padding:24px; }
.hub-card-meta { display:flex;flex-wrap:wrap;gap:4px 10px;margin-bottom:14px;font:500 11px/1.5 Roboto,Arial,sans-serif;color:#59616d; }
.hub-card-meta>span { color:#59616d;font-size:10px; }
.visual-system .hub-card h3 { margin:0 0 12px;font:700 23px/1.25 'Roboto Condensed',Roboto,Arial,sans-serif;color:#03256c;text-transform:none; }
.hub-card h3 a { color:inherit;text-decoration:none; }
.hub-card h3 a:hover { text-decoration:underline; }
.hub-card>p { margin:0 0 20px;color:#59616d;font:400 13px/1.7 Roboto,Arial,sans-serif; }
.visual-system .hub-card-action { margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#03256c;text-decoration:none;font:600 12px/1.5 Roboto,Arial,sans-serif; }
.hub-card-action span { font-size:22px; }
.hub-card-action:hover { text-decoration:underline; }
.visual-system .hub-pagination { display:flex;align-items:center;justify-content:center;gap:20px;margin:28px 0 0;padding:0;border:0;font-size:13px;color:#59616d; }
.hub-pagination a { color:#03256c; }
.hub-empty { grid-column:1/-1;padding:30px;background:#f5f5f5;border-radius:10px;color:#59616d; }
.hub-secondary-links { display:flex;flex-wrap:wrap;gap:18px 28px;margin-top:32px;padding-top:22px;border-top:1px solid #e0e0e0;font-size:13px; }
.hub-secondary-links a { color:#03256c;text-decoration:none; }
.hub-secondary-links a:hover { text-decoration:underline; }
.hub-info-section { margin:0 0 36px;scroll-margin-top:24px; }
.visual-system .hub-info-section>h2 { margin-bottom:20px; }
.hub-info-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.visual-system .hub-info-grid>a { display:flex;align-items:center;gap:16px;padding:24px 20px;background:#f5f5f5;border:1px solid #e0e0e0;border-radius:9px;color:#03256c;text-decoration:none; }
.hub-info-grid>a:hover { border-color:#03256c;background:#f0f2f6; }
.hub-info-grid strong { display:block;font:600 17px/1.35 'Roboto Condensed',Roboto,Arial,sans-serif; }
.hub-info-grid small { display:block;margin-top:6px;font:400 12px/1.6 Roboto,Arial,sans-serif;color:#59616d; }
.hub-info-grid>a>span:last-child { margin-left:auto;font-size:22px; }
@media(max-width:1000px) { .hub-overview { gap:32px; } .hub-grid,.hub-info-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .visual-system .hub-page { width:calc(100% - 32px); } .hub-overview { grid-template-columns:1fr;gap:26px;background-size:150px 180px;background-position:right top; } .visual-system .hub-overview h1 { font-size:38px; } .hub-intro { font-size:15px; } .visual-system .hub-guide { padding:24px; } .hub-section-heading { display:block; } .hub-section-heading>span { display:block;margin-top:8px; } .hub-search>div { flex-wrap:wrap; } .hub-search input[type=search] { flex:1 1 200px; } }
@media(max-width:480px) { .hub-grid,.hub-info-grid { grid-template-columns:1fr; } .hub-card { padding:22px; } .visual-system .hub-tabs a { font-size:11px;padding:8px 10px; } }
html[data-accessible] .hub-overview { background-image:none; }
.hub-news-list { display:grid;gap:16px; }
.hub-news-row { display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:24px;border:1px solid #e0e0e0;border-radius:10px;background:#fff; }
.hub-news-row.is-text-only { grid-template-columns:1fr; }
.hub-news-image { display:block;align-self:start;overflow:hidden;border:1px solid #e0e0e0;border-radius:7px;background:#f5f5f5;aspect-ratio:16/9; }
.hub-news-image img { display:block;width:100%;height:100%;object-fit:contain; }
.hub-news-meta { display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 10px;color:#59616d;font:400 11px/1.5 Roboto,Arial,sans-serif; }
.hub-news-meta>span { font-weight:500; }
.visual-system .hub-news-row h3 { margin:0 0 12px;color:#03256c;font:700 25px/1.25 'Roboto Condensed',Roboto,Arial,sans-serif;text-transform:none; }
.hub-news-row h3 a { color:inherit;text-decoration:none; }
.hub-news-row h3 a:hover { text-decoration:underline; }
.hub-news-row>div>p { margin:0 0 16px;color:#59616d;font:400 13px/1.7 Roboto,Arial,sans-serif; }
.visual-system .hub-news-read { display:inline-flex;gap:12px;align-items:center;color:#03256c;text-decoration:none;font:600 12px/1.5 Roboto,Arial,sans-serif; }
.hub-news-read>span { font-size:22px; }
.hub-news-read:hover { text-decoration:underline; }
@media(max-width:760px) { .hub-news-row { grid-template-columns:130px minmax(0,1fr);gap:18px;padding:20px; } .visual-system .hub-news-row h3 { font-size:22px; } }
@media(max-width:480px) { .hub-news-row { grid-template-columns:1fr;gap:16px; } .hub-news-image { width:160px; } .hub-news-row>div>p { display:none; } }
