.hub-page-main { overflow: hidden; }
.hub-hero { min-height: 650px; display: flex; align-items: center; padding-top: 170px; overflow: hidden; }
.hub-aurora { position: absolute; inset: -60% -20% -40%; opacity: 0.68; pointer-events: none; }
.hub-hero-inner { position: relative; z-index: 1; }
.hub-hero h1 { max-width: 920px; font-size: clamp(2.8rem, 6vw, 5.3rem); }
.hub-hero .lead { max-width: 740px; margin-top: 25px; }
.hub-facts { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.hub-facts span { padding: 7px 11px; border: 1px solid oklch(63% 0.14 315 / 0.32); border-radius: 999px; background: oklch(28% 0.07 298 / 0.35); color: oklch(82% 0.08 310); font-size: 0.68rem; font-weight: 650; }
.hub-facts span::before { margin-right: 7px; color: var(--color-pink); content: "✦"; }
.hub-featured { padding-top: 80px; }
.hub-featured-card { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(220px, 0.8fr) auto; gap: 32px; align-items: center; padding: 34px; border-radius: 22px; background: linear-gradient(135deg, oklch(29% 0.085 308 / 0.82), oklch(18% 0.035 273 / 0.92)); }
.hub-featured-card > div:first-child { display: grid; grid-template-columns: 58px 1fr; gap: 20px; align-items: start; }
.hub-featured-card h3 { margin: 2px 0 8px; font-size: 1.25rem; }
.hub-featured-card p { font-size: 0.86rem; }
.hub-featured-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.hub-featured-tags span { padding: 6px 9px; border-radius: 999px; background: oklch(35% 0.09 310 / 0.42); color: oklch(84% 0.09 325); font-size: 0.58rem; }
.hub-featured-card .button { white-space: nowrap; }
.hub-directory { padding-top: 100px; }
.hub-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.hub-card { min-height: 300px; padding: 30px; scroll-margin-top: 120px; border-radius: 20px; background: linear-gradient(145deg, oklch(23% 0.05 292 / 0.8), oklch(17% 0.03 270 / 0.88)); }
.hub-card-glyph { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 30px; border: 1px solid oklch(68% 0.17 320 / 0.5); border-radius: 14px; background: oklch(62% 0.21 300 / 0.14); color: oklch(84% 0.11 325); font-family: var(--font-mono); font-size: 0.65rem; font-weight: 700; }
.hub-card h3 { margin-bottom: 11px; font-size: 1.25rem; }
.hub-card > p { max-width: 620px; font-size: 0.84rem; line-height: 1.7; }
.hub-card-links { display: flex; flex-wrap: wrap; gap: 9px 16px; margin-top: 25px; }
.hub-card-links a { color: oklch(84% 0.09 325); font-size: 0.7rem; font-weight: 700; }
.hub-card-links a:hover { color: white; }
.hub-card-links span { color: var(--color-pink); }
.hub-cta-section { padding-top: 80px; }
@media (max-width: 980px) { .hub-featured-card { grid-template-columns: 1fr; }.hub-featured-card .button { width: fit-content; }.hub-grid { grid-template-columns: 1fr; } }
@media (max-width: 680px) { .hub-hero { min-height: 600px; padding-top: 130px; }.hub-hero h1 { font-size: clamp(2.35rem, 12vw, 3.7rem); }.hub-featured { padding-top: 45px; }.hub-featured-card { padding: 24px; }.hub-featured-card > div:first-child { grid-template-columns: 1fr; }.hub-featured-card .module-icon { margin-bottom: 0; }.hub-directory { padding-top: 75px; }.hub-card { min-height: 0; padding: 25px 22px; }.hub-card .hub-card-glyph { margin-bottom: 24px; } }