.hub-main { color: #0b1220; }
.hub-wrap { max-width: 1152px; margin-inline: auto; padding-inline: 24px; }
.hub-breadcrumb { padding-block: 18px; color: #64748b; font-size: .875rem; }
.hub-breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }
.hub-hero { background: #fff7ed; border-block: 1px solid #fed7aa; padding-block: 64px; }
.hub-eyebrow { color: #c2410c; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 12px; }
.hub-hero h1 { font-size: clamp(2.6rem, 5.4vw, 4.5rem); font-weight: 800; line-height: 1.07; letter-spacing: -.045em; max-width: 850px; }
.hub-intro { margin-top: 24px; max-width: 690px; font-size: 1.125rem; line-height: 1.75; color: #475569; }
.hub-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 30px; font-weight: 600; }
.hub-actions > a:not(.hub-button) { color: #9a3412; text-decoration: underline; text-underline-offset: 4px; }
.hub-button { display: inline-block; background: #c2410c; color: white; padding: 13px 20px; border-radius: 8px; font-size: .95rem; font-weight: 700; }
.hub-button:hover { background: #9a3412; }
.hub-caption { margin-top: 30px; font-size: .8125rem; color: #78716c; }
.hub-section { margin-block: 64px; }
.hub-main h2 { font-size: clamp(1.65rem, 3.2vw, 2.25rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.2; }
.hub-section-intro { max-width: 740px; margin-block: 16px 28px; line-height: 1.75; color: #475569; }
.hub-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.hub-path { border: 1px solid #e2e8f0; border-radius: 16px; padding: 26px; background: #fff; }
.hub-number { display: inline-grid; place-items: center; border-radius: 50%; width: 40px; height: 40px; color: #c2410c; background: #ffedd5; font-size: .875rem; font-weight: 800; }
.hub-path h3 { margin-top: 20px; font-size: 1.25rem; font-weight: 800; line-height: 1.35; }
.hub-path > p { margin-top: 12px; color: #475569; font-size: .9375rem; line-height: 1.7; }
.hub-path ol { list-style: decimal; padding-left: 20px; margin-top: 20px; color: #c2410c; }
.hub-path li { padding: 6px 0 6px 3px; font-size: .9375rem; }
.hub-path a { text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.hub-new { padding: 28px; background: #f8fafc; border-radius: 16px; }
.hub-new > div:first-child { margin-bottom: 22px; }
.hub-new > div:first-child > p:last-child { margin-top: 10px; color: #475569; }
.hub-articles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.hub-article { display: block; padding: 20px; background: white; border: 1px solid #e2e8f0; border-radius: 12px; transition: border-color .15s; }
.hub-article:hover { border-color: #ea580c; }
.hub-article h3 { display: flex; justify-content: space-between; gap: 16px; font-size: 1rem; line-height: 1.4; font-weight: 750; }
.hub-article h3 span { color: #c2410c; flex-shrink: 0; }
.hub-article p { margin-top: 8px; font-size: .875rem; color: #475569; line-height: 1.65; }
.hub-topics { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 24px 40px; }
.hub-topics a { padding: 9px 13px; border-radius: 24px; background: #fff7ed; border: 1px solid #fed7aa; font-size: .8125rem; font-weight: 600; color: #9a3412; }
.hub-topic { padding-block: 32px; border-top: 1px solid #e2e8f0; }
.hub-topic-heading { margin-bottom: 24px; }
.hub-topic-heading h2 { font-size: 1.5rem; }
.hub-topic-heading p { margin-top: 10px; color: #475569; line-height: 1.7; }
.hub-main [id] { scroll-margin-top: 110px; }
.hub-contact { padding: 36px; border-radius: 16px; background: #0b1220; color: #fff; }
.hub-contact .hub-eyebrow { color: #fdba74; }
.hub-contact > p:not(.hub-eyebrow) { color: #cbd5e1; max-width: 720px; line-height: 1.75; margin-block: 16px 24px; }
.hub-note { font-size: .8125rem; line-height: 1.7; color: #64748b; padding-block: 24px 0; }
.hub-main a:focus-visible, .hub-breadcrumb a:focus-visible { outline: 3px solid #ea580c; outline-offset: 4px; }
@media (max-width: 767px) {
  .hub-wrap { padding-inline: 16px; }
  .hub-hero { padding-block: 40px; }
  .hub-paths, .hub-articles { grid-template-columns: minmax(0, 1fr); }
  .hub-section { margin-block: 40px; }
  .hub-path, .hub-new, .hub-contact { padding: 22px; }
  .hub-actions { gap: 18px; }
  .hub-intro { font-size: 1rem; }
  .hub-main [id] { scroll-margin-top: 185px; }
  .hub-main h1, .hub-main h2, .hub-main h3, .hub-topics a { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }