/* site palette */
html:root {
--bg: #200F23;
--surface: #341939;
--surface-alt: #29142E;
--text: #EFECF0;
--text-muted: #BCB0BF;
--border: #433446;
--primary: #CA77DB;
--primary-hover: #BD57D2;
--on-primary: #111111;
--primary-text: #CA77DB;
--accent: #A2EB99;
--on-accent: #111111;
--accent-text: #A2EB99;
--dark-band: #140A16;
--on-dark: #FFFFFF;
--on-dark-muted: #C1B6C3;
--brand-btn-bg: #111111;
--brand-btn-text: #CA77DB;
--section-alt-bg: linear-gradient(194deg, #29142E 0%, #2F1734 100%);
--dark-band-bg: linear-gradient(124deg, #140A16 0%, #391140 100%);
--brand-band-bg: #CA77DB;
--hero-bg: linear-gradient(124deg, #140A16 0%, #391140 100%);
}
/* /site palette */
*,
*::before,
*::after {
box-sizing: border-box;
}
body {
margin: 0;
padding: 0;
font-family: 'Inclusive Sans', sans-serif;
background-color: var(--bg);
color: var(--text);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.text-muted {
color: var(--text-muted) !important;
}
.xfe-btn {
font-family: 'Inclusive Sans', sans-serif;
font-size: 0.9375rem;
font-weight: 600;
line-height: 1.2;
padding: 12px 24px;
border-radius: 4px;
border: 1px solid transparent;
background-color: var(--primary);
color: var(--on-primary);
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
text-decoration: none;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.xfe-btn:hover {
background-color: var(--primary-hover);
color: var(--on-primary);
}
.xfe-btn-alt {
font-family: 'Inclusive Sans', sans-serif;
font-size: 0.9375rem;
font-weight: 600;
line-height: 1.2;
padding: 12px 24px;
border-radius: 4px;
border: 1px solid var(--border);
background-color: transparent;
color: var(--primary-text);
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
text-decoration: none;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.xfe-btn-alt:hover {
border-color: var(--primary-text);
color: var(--text);
background-color: rgba(202, 119, 219, 0.08);
}
.xfe-card {
background-color: var(--surface);
color: var(--text);
border: 1px solid var(--border);
border-radius: 0px;
padding: 24px;
display: flex;
flex-direction: column;
transition: border-color 150ms ease;
}
.xfe-card:hover {
border-color: var(--primary);
}
.xfe-card .xfe-btn,
.xfe-card .xfe-btn-alt {
margin-top: auto;
}
@media (max-width: 640px) {
.xfe-card {
padding: 18px;
}
}
.xfe-media {
width: 100%;
aspect-ratio: 16 / 9;
flex-shrink: 0;
flex-grow: 0;
border-radius: 0px;
border: 1px solid var(--border);
overflow: hidden;
position: relative;
}
.xfe-media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.xfe-eyebrow {
font-size: 0.8125rem;
line-height: 1.2;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--primary-text);
margin-bottom: 8px;
display: inline-block;
}
.xfe-title {
font-size: clamp(2rem, 3.5vw, 2.75rem);
line-height: 1.15;
font-weight: 700;
letter-spacing: -0.015em;
color: var(--text);
margin-top: 0;
margin-bottom: 16px;
}
.xfe-badge {
display: inline-flex;
align-items: center;
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
padding: 4px 10px;
border-radius: 2px;
background-color: var(--surface-alt);
color: var(--primary-text);
border: 1px solid var(--border);
}
.xfe-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
border: 1px solid var(--border);
border-radius: 0px;
color: var(--primary-text);
background-color: var(--surface-alt);
}
.xfe-section {
padding-top: 6rem;
padding-bottom: 6rem;
background-color: var(--bg);
color: var(--text);
}
.xfe-section-alt {
padding-top: 6rem;
padding-bottom: 6rem;
background: var(--section-alt-bg);
color: var(--text);
}
.xfe-section-dark {
padding-top: 6rem;
padding-bottom: 6rem;
background: var(--dark-band-bg);
color: var(--on-dark);
}
.xfe-section-brand {
padding-top: 6rem;
padding-bottom: 6rem;
background-color: var(--brand-band-bg);
color: var(--on-primary);
}
@media (max-width: 768px) {
.xfe-section,
.xfe-section-alt,
.xfe-section-dark,
.xfe-section-brand {
padding-top: 3.5rem;
padding-bottom: 3.5rem;
}
}
.xfe-section-brand .xfe-btn {
background-color: var(--brand-btn-bg);
color: var(--brand-btn-text);
border: none;
}
.xfe-section-brand .xfe-btn:hover {
background-color: #222222;
color: var(--primary-hover);
}
.xfe-section-brand .xfe-btn-alt {
border-color: var(--on-primary);
color: var(--on-primary);
}
.xfe-section-brand .xfe-btn-alt:hover {
background-color: rgba(17, 17, 17, 0.15);
}
.xfe-on-dark {
color: var(--on-dark);
}
.xfe-section-dark,
.xfe-on-dark {
color: var(--on-dark);
}
.xfe-section-dark .xfe-title,
.xfe-on-dark .xfe-title {
color: var(--on-dark);
}
.xfe-section-dark .xfe-eyebrow,
.xfe-on-dark .xfe-eyebrow {
color: var(--primary-text);
}
.xfe-section-dark .text-muted,
.xfe-on-dark .text-muted {
color: var(--on-dark-muted) !important;
}
.xfe-section-dark .xfe-btn-alt,
.xfe-on-dark .xfe-btn-alt {
border-color: var(--on-dark);
color: var(--on-dark);
}
.xfe-section-dark .xfe-card,
.xfe-on-dark .xfe-card {
background-color: var(--surface);
color: var(--text);
border: 1px solid var(--border);
}
.xfe-section-dark .xfe-card .xfe-title,
.xfe-on-dark .xfe-card .xfe-title {
color: var(--text);
}
.xfe-section-dark .xfe-card .text-muted,
.xfe-on-dark .xfe-card .text-muted {
color: var(--text-muted) !important;
}
/* ===== header ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
/* ===== hero ===== */
.hero-section {
position: relative;
background-color: var(--dark-band);
}
.hero-section .hero-outline-btn {
background-color: transparent;
color: var(--on-dark);
border: 1px solid var(--on-dark);
border-radius: 4px;
}
.hero-section .hero-outline-btn:hover {
background-color: rgba(255, 255, 255, 0.12);
color: var(--on-dark);
}
.hero-section .hero-floating-box {
background-color: var(--primary);
color: var(--on-primary);
border-radius: 0px;
}
@media (max-width: 767px) {
.hero-section h1 {
font-size: 18px !important;
line-height: 1.2 !important;
}
}
/* ===== site-wide fixes (October 2026) ===== */
.header-root {
position: sticky !important;
top: 0;
z-index: 1000 !important;
box-shadow: 0 6px 20px rgba(20, 10, 22, 0.18);
}
/* Article templates previously rendered a flat colour in their hero area. */
.nba-detail-page > section:first-child,
.spurs-article-template > section:first-child,
.nba-article-detail > section:first-child,
.spurs-article-root > section:first-child,
main.flex-1 > section:first-child.spurs-hero-band,
main.flex-1 > section:first-child.pelicans-hero,
main.flex-1 > section:first-child.detail-hero-section,
main:not([class]) > section:first-child.xfe-section-dark {
background-image:
linear-gradient(90deg, rgba(20, 10, 22, 0.96) 0%, rgba(20, 10, 22, 0.84) 55%, rgba(57, 17, 64, 0.72) 100%),
url('../assets/images/uploads/nba-paris-games-2027-arena-ambiance.png') !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
}
/* Make the main hero media immediately visible instead of waiting for lazy load. */
.hero-bg-media,
.category-hero > .absolute.inset-0 {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
}
.hero-bg-media > img,
.category-hero > .absolute.inset-0 > img {
display: block !important;
width: 100%;
height: 100%;
object-fit: cover;
}
/* FAQ search uses a white field: keep entered text and placeholder legible. */
.faq-page-section .js-faq-search {
color: #140A16 !important;
caret-color: #140A16;
}
.faq-page-section .js-faq-search::placeholder {
color: #6f6272 !important;
opacity: 1;
}
/* Contact details are easier to scan in a single vertical column. */
.contact-section .contact-coords-grid {
grid-template-columns: minmax(0, 1fr) !important;
gap: 16px;
}
.contact-section .contact-coord-item {
width: 100%;
}
@media (max-width: 767px) {
.header-root .header-top-bar {
display: none !important;
}
}
/* ===== news_grid ===== */
.news-grid-section {
position: relative;
width: 100%;
}
.news-grid-section .news-grid-card {
border-radius: 0px;
transition: border-color 150ms ease, background-color 150ms ease;
}
.news-grid-section .news-grid-card:hover {
border-color: var(--primary);
}
.news-grid-section .news-grid-media img {
border-radius: 0px;
transition: transform 150ms ease;
}
.news-grid-section .news-grid-card:hover .news-grid-media img {
transform: scale(1.02);
}
.news-grid-section .news-grid-cta {
border-radius: 4px;
min-height: 44px;
}
@media (max-width: 767px) {
.news-grid-section .news-grid-items {
grid-template-columns: 1fr !important;
}
}
/* ===== teams_showcase ===== */
.teams-showcase {
position: relative;
}
.teams-showcase .teams-showcase__card {
transition: border-color 150ms ease;
}
.teams-showcase .teams-showcase__card:hover {
border-color: var(--primary-text);
}
.teams-showcase .teams-showcase__media {
border-radius: 0;
}
.teams-showcase .teams-showcase__media img {
border-radius: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.teams-showcase .teams-showcase__pill {
background-color: transparent;
color: var(--text-muted);
border: 1px solid var(--border);
border-radius: 9999px;
padding: 8px 18px;
font-size: 0.875rem;
font-weight: 600;
cursor: pointer;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.teams-showcase .teams-showcase__pill:hover {
border-color: var(--primary-text);
color: var(--text);
}
.teams-showcase .teams-showcase__pill.active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
}
.teams-showcase .teams-showcase__panel {
display: block;
}
.teams-showcase .teams-showcase__panel.is-hidden {
display: none;
}
.teams-showcase .teams-showcase__btn {
border-radius: 4px;
transition: background-color 150ms ease, color 150ms ease, transform 150ms ease;
}
.teams-showcase .teams-showcase__btn:hover {
background-color: var(--primary-hover);
color: var(--on-primary);
transform: translateY(-1px);
}
@media (max-width: 767px) {
.teams-showcase .teams-showcase__grid {
grid-template-columns: 1fr;
}
}
/* ===== teams_comparison_teaser ===== */
.spurs-pelicans-teaser {
background-color: var(--bg);
}
.spurs-pelicans-teaser__card {
border-radius: 0;
transition: border-color 150ms ease;
}
.spurs-pelicans-teaser__card:hover {
border-color: var(--primary-text);
}
.spurs-pelicans-teaser__tab-btn {
border-radius: 4px;
background-color: transparent;
color: var(--text-muted);
}
.spurs-pelicans-teaser__tab-btn:hover {
color: var(--text);
border-color: var(--primary-text);
}
.spurs-pelicans-teaser__tab-btn.active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
}
.spurs-pelicans-teaser__panel {
display: none;
}
.spurs-pelicans-teaser__panel.active {
display: block;
}
.spurs-pelicans-teaser__vs-badge {
border-radius: 4px;
letter-spacing: 0.15em;
}
@media (max-width: 767px) {
.spurs-pelicans-teaser .grid {
grid-template-columns: 1fr;
}
}
/* ===== fan_guide_teaser ===== */
.fan-guide-teaser-section {
word-break: break-word;
overflow-wrap: anywhere;
}
.fan-guide-teaser-section .fan-guide-card {
transition: border-color 150ms ease;
}
.fan-guide-teaser-section .fan-guide-card:hover {
border-color: var(--primary-text);
}
.fan-guide-teaser-section .xfe-media {
border-radius: 0;
}
@media (max-width: 767px) {
.fan-guide-teaser-section .grid {
grid-template-columns: 1fr;
}
}
/* ===== requirements_list ===== */
.requirements-block {
position: relative;
background-color: var(--bg);
}
.requirements-block__pill {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 8px 18px;
font-size: 0.875rem;
font-weight: 600;
border-radius: 9999px;
border: 1px solid var(--border);
color: var(--text-muted);
background-color: transparent;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
cursor: pointer;
}
.requirements-block__pill:hover {
border-color: var(--primary-text);
color: var(--text);
}
.requirements-block__pill--active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
}
.requirements-block__pill--active:hover {
background-color: var(--primary-hover);
color: var(--on-primary);
}
.requirements-block__card {
background-color: var(--surface);
border: 1px solid var(--border);
padding: 24px;
transition: border-color 150ms ease;
}
.requirements-block__card:hover {
border-color: var(--primary-text);
}
.requirements-block__check-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 12px;
background-color: var(--surface_alt);
border: 1px solid var(--border);
color: var(--text);
border-radius: 4px;
cursor: pointer;
width: fit-content;
transition: background-color 150ms ease, border-color 150ms ease;
}
.requirements-block__check-btn:hover {
border-color: var(--primary);
}
.requirements-block__check-box {
display: inline-flex;
align-items: center;
justify-content: center;
width: 18px;
height: 18px;
border: 1px solid var(--border);
background-color: var(--surface);
border-radius: 2px;
font-size: 12px;
color: transparent;
transition: all 150ms ease;
}
.requirements-block__check-btn[data-checked="true"] {
background-color: rgba(162, 235, 153, 0.12);
border-color: var(--accent);
}
.requirements-block__check-btn[data-checked="true"] .requirements-block__check-box {
background-color: var(--accent);
border-color: var(--accent);
color: var(--on-accent);
}
.requirements-block__progress-fill {
transition: width 200ms ease;
}
.requirements-block__media {
border-radius: 0px;
}
.requirements-block .is-hidden {
display: none !important;
}
@media (max-width: 767px) {
.requirements-block .grid {
grid-template-columns: 1fr;
}
.requirements-block__advisory {
flex-direction: column;
}
}
/* ===== founder_message ===== */
.founder-block {
position: relative;
width: 100%;
overflow: hidden;
}
.founder-block .founder-card {
border-radius: 4px;
box-sizing: border-box;
}
.founder-block .founder-image-box {
border-radius: 0px;
}
.founder-block .founder-image-box img {
display: block;
border-radius: 0px;
}
.founder-block .founder-badge {
display: inline-flex;
align-items: center;
border-radius: 4px;
background-color: var(--surface-alt);
border: 1px solid var(--border);
padding: 4px 10px;
}
.founder-block .founder-text-body p {
margin: 0;
overflow-wrap: anywhere;
}
.founder-block .founder-signature-wrap svg {
display: block;
}
.founder-block .founder-action .xfe-btn {
min-height: 40px;
padding: 8px 18px;
border-radius: 4px;
}
@media (max-width: 767px) {
.founder-block .founder-grid {
grid-template-columns: 1fr;
}
.founder-block .founder-image-box {
margin: 0 auto;
}
.founder-block .founder-footer {
flex-direction: column;
align-items: flex-start;
}
.founder-block .founder-action {
width: 100%;
}
.founder-block .founder-action .xfe-btn {
width: 100%;
justify-content: center;
}
}
/* ===== key_benefits ===== */
.key-benefits-block .benefits-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 4px;
padding: 24px;
transition: border-color 150ms ease, background-color 150ms ease;
}
.key-benefits-block .benefits-card:hover {
border-color: var(--primary-text);
background-color: var(--surface-alt);
}
.key-benefits-block .benefit-icon-box {
width: 44px;
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
background-color: var(--surface-alt);
border: 1px solid var(--border);
border-radius: 4px;
}
.key-benefits-block .benefits-card:hover .benefit-icon-box {
border-color: var(--primary-text);
}
@media (max-width: 767px) {
.key-benefits-block .grid {
grid-template-columns: 1fr;
}
.key-benefits-block .benefits-card {
padding: 20px;
}
}
/* ===== common_mistakes ===== */
#common-mistakes-section {
position: relative;
}
#common-mistakes-section .cm-filter-pill {
font-family: 'Inclusive Sans', sans-serif;
font-weight: 600;
font-size: 0.875rem;
padding: 8px 18px;
border-radius: 9999px;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
cursor: pointer;
border: 1px solid var(--border);
background-color: transparent;
color: var(--text-muted);
}
#common-mistakes-section .cm-filter-pill:hover {
border-color: var(--primary-text);
color: var(--text);
}
#common-mistakes-section .cm-filter-pill.is-active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
}
#common-mistakes-section .cm-card {
background-color: var(--surface);
border: 1px solid var(--border);
border-radius: 4px;
padding: 24px;
transition: border-color 150ms ease, background-color 150ms ease;
}
#common-mistakes-section .cm-card:hover {
border-color: var(--primary-text);
}
#common-mistakes-section .cm-card-title-link {
color: var(--text);
transition: color 150ms ease;
}
#common-mistakes-section .cm-card-title-link:hover {
color: var(--primary-hover);
}
#common-mistakes-section .cm-mistake-badge {
border-radius: 4px;
}
@media (max-width: 767px) {
#common-mistakes-section #common-mistakes-grid {
grid-template-columns: 1fr;
}
#common-mistakes-section .cm-card {
padding: 18px;
}
}
/* ===== footer ===== */
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
/* ===== PAGE: privacy ===== */
#privacy-content { background-color: var(--surface); border: 1px solid var(--border); padding: 32px 24px; color: var(--text-muted); font-family: 'Inclusive Sans', sans-serif; font-size: 1rem; line-height: 1.6; max-width: 860px; margin: 0 auto; box-sizing: border-box; } #privacy-content .policy-meta-bar { background-color: var(--surface-alt); border: 1px solid var(--border); padding: 12px 16px; margin-bottom: 28px; font-size: 0.875rem; color: var(--text-muted); border-radius: 4px; } #privacy-content .policy-meta-bar span { color: var(--primary-text); font-weight: 600; } #privacy-content h2 { color: var(--text); font-size: 24px; font-weight: 700; line-height: 1.3; margin-top: 36px; margin-bottom: 16px; border-bottom: 1px solid var(--border); padding-bottom: 8px; overflow-wrap: anywhere; } #privacy-content h2:first-of-type { margin-top: 0; } #privacy-content p { color: var(--text-muted); font-size: 0.9375rem; line-height: 1.65; margin-bottom: 16px; overflow-wrap: anywhere; } #privacy-content strong { color: var(--text); font-weight: 600; } #privacy-content ul { list-style: disc outside; margin-left: 20px; margin-bottom: 20px; padding-left: 0; } #privacy-content li { color: var(--text-muted); font-size: 0.9375rem; line-height: 1.6; margin-bottom: 8px; overflow-wrap: anywhere; } #privacy-content a { color: var(--primary-text); text-decoration: underline; text-underline-offset: 3px; transition: color 150ms ease; overflow-wrap: anywhere; } #privacy-content a:hover, #privacy-content a:focus { color: var(--primary-hover); } #privacy-content .policy-contact-card { background-color: var(--surface-alt); border: 1px solid var(--border); padding: 20px; margin-top: 20px; margin-bottom: 20px; border-radius: 4px; } #privacy-content .policy-contact-card p { margin-bottom: 10px; } #privacy-content .policy-contact-card p:last-child { margin-bottom: 0; } @media (max-width: 767px) { #privacy-content { padding: 20px 16px; hyphens: auto; } #privacy-content h2 { font-size: 16px; margin-top: 24px; margin-bottom: 12px; } #privacy-content p, #privacy-content li { font-size: 0.875rem; line-height: 1.55; } #privacy-content .policy-contact-card { padding: 16px; } }
/* ===== PAGE: terms ===== */
#privacy-content.policy-content{box-sizing:border-box;width:100%;max-width:880px;margin-left:auto;margin-right:auto;padding:48px 24px;color:var(--text-muted);font-family:'Inclusive Sans',sans-serif;overflow-wrap:anywhere;hyphens:auto}@media (max-width:767px){#privacy-content.policy-content{padding:32px 16px}}#privacy-content .policy-date{display:inline-block;font-size:13px;letter-spacing:0.05em;text-transform:uppercase;color:var(--primary-text);margin-bottom:24px;font-weight:600}#privacy-content .policy-intro{font-size:15px;line-height:1.65;color:var(--text);margin-bottom:32px;padding:20px 24px;background-color:var(--surface_alt);border:1px solid var(--border);border-radius:4px}@media (max-width:767px){#privacy-content .policy-intro{font-size:14px;padding:16px}}#privacy-content h2{color:var(--text);font-size:16px;line-height:1.25;font-weight:700;margin-top:36px;margin-bottom:14px;letter-spacing:-0.015em}@media (min-width:768px){#privacy-content h2{font-size:24px;margin-top:44px;margin-bottom:18px}}#privacy-content h3{color:var(--text);font-size:14px;line-height:1.3;font-weight:600;margin-top:24px;margin-bottom:12px}@media (min-width:768px){#privacy-content h3{font-size:18px;margin-top:28px;margin-bottom:14px}}#privacy-content p{color:var(--text-muted);font-size:15px;line-height:1.6;margin-bottom:16px}@media (min-width:768px){#privacy-content p{font-size:16px}}#privacy-content ul{list-style:none;padding:0;margin:0 0 24px 0}#privacy-content ul li{position:relative;padding-left:22px;margin-bottom:12px;color:var(--text-muted);font-size:15px;line-height:1.55}@media (min-width:768px){#privacy-content ul li{font-size:16px}}#privacy-content ul li::before{content:"»";position:absolute;left:0;top:0;color:var(--primary-text);font-weight:700;font-size:16px;line-height:1.55}#privacy-content a{color:var(--primary-text);text-decoration:underline;text-underline-offset:3px;transition:color 150ms ease}#privacy-content a:hover,#privacy-content a:focus{color:var(--primary-hover)}#privacy-content strong{color:var(--text);font-weight:600}#privacy-content .policy-highlight{background-color:var(--surface);border-left:3px solid var(--primary);padding:18px 22px;margin:24px 0 28px 0;border-radius:0 4px 4px 0}#privacy-content .policy-highlight p{margin-bottom:0;color:var(--text);font-size:14px}@media (min-width:768px){#privacy-content .policy-highlight p{font-size:15px}}#privacy-content .policy-contact-box{background-color:var(--surface);border:1px solid var(--border);border-radius:4px;padding:24px;margin-top:28px}#privacy-content .policy-contact-box p{margin-bottom:10px}#privacy-content .policy-contact-box p:last-child{margin-bottom:0}
/* ===== PAGE: cookies ===== */
#privacy-content.policy-content { width: 100%; max-width: 920px; margin: 0 auto; padding: 32px 16px; color: var(--text-muted); font-family: 'Inclusive Sans', sans-serif; box-sizing: border-box; overflow-wrap: anywhere; hyphens: auto; } @media (min-width: 768px) { #privacy-content.policy-content { padding: 56px 24px; } } #privacy-content .policy-article { display: block; width: 100%; } #privacy-content .policy-intro-box { background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--primary); padding: 18px 20px; margin-bottom: 28px; border-radius: 4px; } #privacy-content .policy-lead { font-size: 15px; line-height: 1.6; color: var(--text); margin: 0; } @media (min-width: 768px) { #privacy-content .policy-lead { font-size: 17px; line-height: 1.65; } } #privacy-content h2 { font-size: 16px; line-height: 1.25; font-weight: 700; color: var(--text); margin-top: 32px; margin-bottom: 14px; text-transform: none; } @media (min-width: 768px) { #privacy-content h2 { font-size: 24px; line-height: 1.3; margin-top: 48px; margin-bottom: 18px; } } #privacy-content h3 { font-size: 14px; line-height: 1.25; font-weight: 600; color: var(--text); margin-top: 20px; margin-bottom: 10px; text-transform: none; } @media (min-width: 768px) { #privacy-content h3 { font-size: 18px; line-height: 1.3; margin-top: 28px; margin-bottom: 12px; } } #privacy-content p { font-size: 14px; line-height: 1.6; color: var(--text-muted); margin-top: 0; margin-bottom: 16px; } @media (min-width: 768px) { #privacy-content p { font-size: 16px; line-height: 1.65; margin-bottom: 20px; } } #privacy-content ul { list-style: none; padding-left: 0; margin-top: 8px; margin-bottom: 20px; } #privacy-content li { position: relative; font-size: 14px; line-height: 1.55; color: var(--text-muted); padding-left: 20px; margin-bottom: 10px; } @media (min-width: 768px) { #privacy-content li { font-size: 15px; line-height: 1.6; padding-left: 24px; margin-bottom: 12px; } } #privacy-content li::before { content: '»'; position: absolute; left: 0; top: 0; color: var(--primary-text); font-weight: 700; font-size: 15px; } #privacy-content strong { color: var(--text); font-weight: 600; } #privacy-content a { color: var(--primary-text); text-decoration: underline; text-underline-offset: 3px; transition: color 150ms ease; } #privacy-content a:hover, #privacy-content a:focus { color: var(--primary-hover); } #privacy-content .policy-table-wrapper { width: 100%; overflow-x: auto; margin: 24px 0 32px 0; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); } #privacy-content .policy-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; } #privacy-content .policy-table th { background: var(--surface_alt); color: var(--text); font-weight: 600; padding: 12px 14px; border-bottom: 1px solid var(--border); white-space: nowrap; } #privacy-content .policy-table td { padding: 12px 14px; border-bottom: 1px solid var(--border); color: var(--text-muted); vertical-align: top; } #privacy-content .policy-table tr:last-child td { border-bottom: none; } #privacy-content .policy-badge { display: inline-block; background: var(--surface_alt); color: var(--primary-text); border: 1px solid var(--border); padding: 2px 8px; font-size: 12px; font-family: monospace; border-radius: 4px; } #privacy-content .policy-contact-card { background: var(--surface); border: 1px solid var(--border); padding: 20px; margin-top: 20px; margin-bottom: 28px; border-radius: 4px; } #privacy-content .policy-contact-card p { margin-bottom: 8px; } #privacy-content .policy-contact-card p:last-child { margin-bottom: 0; } @media (max-width: 767px) { #privacy-content .policy-table thead { display: none; } #privacy-content .policy-table, #privacy-content .policy-table tbody, #privacy-content .policy-table tr, #privacy-content .policy-table td { display: block; width: 100%; box-sizing: border-box; } #privacy-content .policy-table tr { border-bottom: 1px solid var(--border); padding: 10px 0; } #privacy-content .policy-table tr:last-child { border-bottom: none; } #privacy-content .policy-table td { border-bottom: none; padding: 6px 12px; display: flex; flex-direction: column; gap: 4px; } #privacy-content .policy-table td::before { content: attr(data-label); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--primary-text); } }
/* ===== PAGE: disclaimer ===== */
#privacy-content { width: 100%; max-width: 860px; margin-left: auto; margin-right: auto; padding-top: 48px; padding-bottom: 64px; padding-left: 20px; padding-right: 20px; color: var(--text-muted); font-family: 'Inclusive Sans', sans-serif; line-height: 1.65; font-size: 1rem; overflow-wrap: anywhere; word-break: normal; } #privacy-content h2 { font-size: 24px; line-height: 1.25; font-weight: 700; color: var(--text); margin-top: 40px; margin-bottom: 16px; letter-spacing: -0.015em; } #privacy-content h3 { font-size: 18px; line-height: 1.3; font-weight: 600; color: var(--text); margin-top: 28px; margin-bottom: 12px; } #privacy-content p { color: var(--text-muted); line-height: 1.65; margin-bottom: 18px; } #privacy-content ul { list-style-type: disc; padding-left: 24px; margin-top: 12px; margin-bottom: 22px; } #privacy-content li { color: var(--text-muted); line-height: 1.6; margin-bottom: 10px; } #privacy-content strong { color: var(--text); font-weight: 600; } #privacy-content em { font-style: italic; color: var(--text); } #privacy-content a { color: var(--primary-text); text-decoration: underline; text-underline-offset: 3px; transition: color 150ms ease; } #privacy-content a:hover, #privacy-content a:focus { color: var(--primary-hover); } @media (max-width: 767px) { #privacy-content { padding-top: 28px; padding-bottom: 40px; padding-left: 16px; padding-right: 16px; hyphens: auto; } #privacy-content h2 { font-size: 16px; margin-top: 28px; margin-bottom: 12px; } #privacy-content h3 { font-size: 14px; margin-top: 20px; margin-bottom: 10px; } #privacy-content p, #privacy-content li { font-size: 0.9375rem; line-height: 1.6; } #privacy-content ul { padding-left: 18px; margin-bottom: 18px; } }
/* ===== PAGE: news-and-events ===== */
.news-list-block { overflow-wrap: anywhere; }
.news-list-block .news-bento-grid .news-card { border-radius: 0px; }
.news-list-block .news-bento-grid .news-card:hover { border-color: var(--primary-text); }
.news-list-block .news-card img { border-radius: 0px; }
.news-list-block input::placeholder { color: var(--text-muted); opacity: 1; }
@media (max-width: 767px) {
.news-list-block .news-bento-grid { grid-template-columns: 1fr !important; }
.news-list-block .news-bento-grid .news-card { grid-column: span 1 / span 1 !important; }
}
/* ===== PAGE: san-antonio-spurs ===== */
.spurs-info-block .spurs-banner {
border-radius: 0px;
}
.spurs-info-block .spurs-card {
border-radius: 0px;
transition: border-color 150ms ease, background-color 150ms ease;
}
.spurs-info-block .spurs-card:hover {
border-color: var(--primary-text);
}
.spurs-info-block .spurs-card-hidden {
display: none !important;
}
.spurs-info-block .spurs-page-nav,
.spurs-info-block .spurs-page-num {
border-radius: 4px;
}
.spurs-info-block .spurs-page-num.active {
background-color: var(--primary) !important;
color: var(--on-primary) !important;
border-color: var(--primary) !important;
}
.spurs-info-block .spurs-link {
text-underline-offset: 3px;
}
@media (max-width: 767px) {
.spurs-info-block .spurs-grid {
grid-template-columns: 1fr;
}
}
/* ===== PAGE: new-orleans-pelicans ===== */
.pelicans-section { background-color: var(--bg); }
.pelicans-section .pelicans-list { display: flex; flex-direction: column; gap: 36px; }
.pelicans-section .pelicans-card { display: flex; flex-direction: row; align-items: stretch; background-color: var(--surface); border: 1px solid var(--border); border-radius: 4px; overflow: hidden; transition: border-color 150ms ease, background-color 150ms ease; }
.pelicans-section .pelicans-card:hover { border-color: var(--primary); }
.pelicans-section .pelicans-card-media { width: 35%; max-width: 360px; min-width: 250px; aspect-ratio: 1 / 1; flex-shrink: 0; position: relative; background-color: var(--surface-alt); }
.pelicans-section .pelicans-media-link { display: block; width: 100%; height: 100%; }
.pelicans-section .pelicans-img { width: 100%; height: 100%; object-fit: cover; border-radius: 0px; display: block; }
.pelicans-section .pelicans-card-body { flex: 1; display: flex; flex-direction: column; justify-content: space-between; align-items: center; text-align: center; padding: 28px 24px; min-width: 0; }
.pelicans-section .pelicans-card-title { font-weight: 700; line-height: 1.3; color: var(--text); margin-bottom: 12px; hyphens: auto; overflow-wrap: anywhere; }
.pelicans-section .pelicans-card-title a { color: var(--text); text-decoration: none; transition: color 150ms ease; }
.pelicans-section .pelicans-card-title a:hover { color: var(--primary-hover); }
.pelicans-section .pelicans-card-excerpt { font-size: 14px; line-height: 1.55; color: var(--text-muted); margin-bottom: 24px; max-width: 640px; }
.pelicans-section .pelicans-card-action { width: 100%; margin-top: auto; }
.pelicans-section .pelicans-card-action .xfe-btn { width: 100%; display: flex; align-items: center; justify-content: center; padding: 12px 24px; border-radius: 4px; background-color: var(--primary); color: var(--on-primary); font-weight: 600; text-decoration: none; transition: background-color 150ms ease; }
.pelicans-section .pelicans-card-action .xfe-btn:hover { background-color: var(--primary-hover); color: var(--on-primary); }
.pelicans-section .filter-pill { border-radius: 9999px; padding: 8px 18px; font-size: 14px; font-weight: 500; transition: all 150ms ease; cursor: pointer; border: 1px solid var(--border); color: var(--text-muted); background-color: transparent; }
.pelicans-section .filter-pill:hover { border-color: var(--primary-text); color: var(--text); }
.pelicans-section .filter-pill.is-active { background-color: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 600; }
.pelicans-section .search-input { background-color: var(--surface-alt); border: 1px solid var(--border); border-radius: 4px; padding: 10px 16px 10px 38px; color: var(--text); font-size: 14px; width: 100%; outline: none; transition: border-color 150ms ease; }
.pelicans-section .search-input::placeholder { color: var(--text-muted); opacity: 1; }
.pelicans-section .search-input:focus { border-color: var(--primary); }
@media (max-width: 767px) {
.pelicans-section .pelicans-card { flex-direction: column; }
.pelicans-section .pelicans-card-media { width: 100%; max-width: 100%; min-width: 0; aspect-ratio: 1 / 1; }
.pelicans-section .pelicans-card-body { padding: 20px 16px; }
}
/* ===== PAGE: spurs-vs-pelicans ===== */
.spurs-vs-pelicans-section h2, .spurs-vs-pelicans-section h3 { hyphens: auto; overflow-wrap: anywhere; }
.spurs-vs-pelicans-section .spurs-card { border-radius: 0; transition: border-color 150ms ease, background-color 150ms ease; }
.spurs-vs-pelicans-section .spurs-card:hover { border-color: var(--primary-text); }
.spurs-vs-pelicans-section .spurs-card img { border-radius: 0; }
.spurs-vs-pelicans-section .spurs-filter-pill { display: inline-flex; align-items: center; justify-content: center; border-radius: 9999px; padding: 8px 18px; font-size: 0.875rem; font-weight: 500; line-height: 1.2; background-color: transparent; color: var(--text-muted); border: 1px solid var(--border); transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; cursor: pointer; }
.spurs-vs-pelicans-section .spurs-filter-pill:hover { border-color: var(--primary-text); color: var(--text); }
.spurs-vs-pelicans-section .spurs-filter-pill.active { background-color: var(--primary); color: var(--on-primary); border-color: var(--primary); font-weight: 600; }
.spurs-vs-pelicans-section .spurs-filter-pill:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (max-width: 767px) {
.spurs-vs-pelicans-section .comparison-grid { grid-template-columns: 1fr; }
.spurs-vs-pelicans-section .stats-grid { grid-template-columns: 1fr; }
}
/* ===== PAGE: nba-paris-games ===== */
.paris-games-info { background-color: var(--bg); color: var(--text); overflow: hidden; }
.paris-games-info .paris-card { position: relative; display: flex; flex-direction: column; background-color: var(--surface); border: 1px solid var(--border); border-radius: 4px; padding: 20px; transition: border-color 150ms ease, background-color 150ms ease; overflow-wrap: anywhere; hyphens: auto; }
.paris-games-info .paris-card:hover { border-color: var(--primary); background-color: var(--surface_alt); }
.paris-games-info .paris-media-frame { position: relative; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; background-color: var(--surface_alt); border-radius: 0; }
.paris-games-info .paris-media-frame img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; display: block; }
.paris-games-info .paris-card-index { font-family: 'Inclusive Sans', sans-serif; color: var(--primary); letter-spacing: -0.03em; }
.paris-games-info .paris-card-heading { color: var(--text); line-height: 1.25; }
.paris-games-info .paris-card-heading a { color: var(--text); transition: color 150ms ease; }
.paris-games-info .paris-card:hover .paris-card-heading a { color: var(--primary_text); }
.paris-games-info .paris-stats-item { border: 1px solid var(--border); background-color: var(--surface); padding: 20px 16px; border-radius: 4px; }
@media (max-width: 767px) {
.paris-games-info .paris-cards-grid { grid-template-columns: 1fr; }
.paris-games-info .paris-stats-grid { grid-template-columns: 1fr; }
.paris-games-info .paris-card { padding: 16px; }
}
/* ===== PAGE: fan-guide ===== */
.fan-guide-section{position:relative;width:100%;background-color:var(--bg);}.fan-guide-section .fan-guide-filter-active{background-color:var(--primary);color:var(--on-primary);border-color:var(--primary);}.fan-guide-section .fan-guide-filter-inactive{background-color:transparent;color:var(--text-muted);border-color:var(--border);}.fan-guide-section .fan-guide-filter-inactive:hover{border-color:var(--primary-text);color:var(--text);}.fan-guide-section .fan-guide-card-img{aspect-ratio:3/2;width:100%;height:100%;object-fit:cover;}.fan-guide-section .fan-guide-search-input:focus{outline:none;border-color:var(--primary);}.fan-guide-section .fan-guide-btn-action{background-color:var(--primary);color:var(--on-primary);border-radius:4px;font-weight:600;transition:background-color 150ms ease,color 150ms ease;}.fan-guide-section .fan-guide-btn-action:hover{background-color:var(--primary-hover);color:var(--on-primary);}@media (max-width:767px){.fan-guide-section .fan-guide-grid{grid-template-columns:1fr;}}
/* ===== PAGE: nba-history ===== */
.nba-history-wrapper { background-color: var(--bg); }
.nba-history-wrapper .nba-filter-pill { display: inline-flex; align-items: center; justify-content: center; padding: 7px 16px; border-radius: 9999px; font-size: 0.8125rem; font-weight: 600; border: 1px solid var(--border); background-color: transparent; color: var(--text-muted); transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; cursor: pointer; text-decoration: none; }
.nba-history-wrapper .nba-filter-pill:hover { border-color: var(--primary-text); color: var(--text); }
.nba-history-wrapper .nba-filter-pill.active { background-color: var(--primary); color: var(--on-primary); border-color: var(--primary); }
.nba-history-wrapper .nba-history-card { background-color: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 0; overflow: hidden; transition: border-color 150ms ease, background-color 150ms ease; }
.nba-history-wrapper .nba-history-card:hover { border-color: var(--primary-text); background-color: var(--surface_alt); }
.nba-history-wrapper .nba-card-media-box { width: 100%; aspect-ratio: 1 / 1; border-radius: 0; overflow: hidden; background-color: var(--dark-band); }
@media (min-width: 768px) { .nba-history-wrapper .nba-card-media-box { width: 280px; max-width: 32%; aspect-ratio: 1 / 1; } }
.nba-history-wrapper .nba-card-body-box { padding: 18px 20px; }
@media (min-width: 768px) { .nba-history-wrapper .nba-card-body-box { padding: 24px 28px; } }
.nba-history-wrapper .nba-history-card img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; display: block; }
.nba-history-wrapper .js-history-item { transition: opacity 150ms ease; }
/* ===== PAGE: faq ===== */
.faq-page-section{position:relative;background:transparent}.faq-page-section .faq-filter-pill{background:transparent;color:var(--text-muted);border:1px solid var(--border);border-radius:9999px;padding:6px 16px;font-size:0.8125rem;font-weight:600;transition:all 150ms ease;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.faq-page-section .faq-filter-pill:hover{border-color:var(--primary);color:var(--text)}.faq-page-section .faq-filter-pill.filter-tab-active{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.faq-page-section .faq-accordion-item{background:var(--surface_alt);border:1px solid var(--border);border-radius:0;transition:border-color 150ms ease;overflow:hidden}.faq-page-section .faq-accordion-item.faq-item-open{border-color:var(--primary)}.faq-page-section .faq-accordion-header{width:100%;display:flex;align-items:center;justify-content:between;padding:16px 20px;background:transparent;border:none;cursor:pointer;transition:background-color 150ms ease}.faq-page-section .faq-accordion-header:hover{background-color:rgba(202,119,219,0.04)}.faq-page-section .faq-toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--border);color:var(--primary);flex-shrink:0;transition:all 150ms ease;background:var(--surface)}.faq-page-section .faq-item-open .faq-toggle-icon{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.faq-page-section .faq-accordion-content{max-height:0;overflow:hidden;transition:max-height 250ms cubic-bezier(0.4,0,0.2,1)}.faq-page-section .faq-content-inner{padding:18px 20px 22px 20px;border-top:1px solid var(--border);background:var(--surface);color:var(--text-muted);font-size:0.9375rem;line-height:1.6}.faq-page-section .faq-marker{color:var(--primary-text);font-weight:700;margin-right:8px;flex-shrink:0}
/* ===== PAGE: about ===== */
.about-block .about-media-wrapper img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 0;
}
.about-block .about-tab-btn {
border: 1px solid var(--border);
background-color: var(--surface);
color: var(--text-muted);
border-radius: 4px;
cursor: pointer;
}
.about-block .about-tab-btn:hover {
border-color: var(--primary-text);
color: var(--text);
}
.about-block .about-tab-btn.active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
}
.about-block .xfe-btn {
background-color: var(--primary);
color: var(--on-primary);
padding: 10px 20px;
border-radius: 4px;
transition: background-color 150ms ease, color 150ms ease;
}
.about-block .xfe-btn:hover {
background-color: var(--primary-hover);
color: var(--on-primary);
}
.about-block .xfe-btn-alt {
background-color: transparent;
color: var(--text);
border: 1px solid var(--border);
padding: 10px 20px;
border-radius: 4px;
transition: border-color 150ms ease, color 150ms ease;
}
.about-block .xfe-btn-alt:hover {
border-color: var(--primary-text);
color: var(--primary-text);
}
.about-block .xfe-badge {
background-color: var(--surface);
color: var(--primary-text);
border: 1px solid var(--border);
border-radius: 2px;
}
@media (max-width: 767px) {
.about-block .grid {
grid-template-columns: 1fr;
}
.about-block .about-tab-btn {
width: 100%;
text-align: center;
justify-content: center;
}
}
/* ===== PAGE: contact ===== */
.contact-section { position: relative; overflow: hidden; }
.contact-section .contact-form-card { box-shadow: none; }
.contact-section input, .contact-section textarea { color: var(--text); background-color: var(--surface-alt); }
.contact-section input::placeholder, .contact-section textarea::placeholder { color: var(--text-muted); opacity: 1; }
.contact-section input:-ms-input-placeholder, .contact-section textarea:-ms-input-placeholder { color: var(--text-muted); }
.contact-section input::-ms-input-placeholder, .contact-section textarea::-ms-input-placeholder { color: var(--text-muted); }
.contact-section .contact-btn { transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; }
.contact-section .contact-coord-item a { overflow-wrap: anywhere; }
@media (max-width: 767px) {
.contact-section .contact-grid { flex-direction: column; }
.contact-section .contact-coords-grid { grid-template-columns: 1fr; }
.contact-section .contact-fields-row { grid-template-columns: 1fr; }
.contact-section .contact-cutout-frame { max-width: 290px; }
}
.nba-comment-card {
background-color: #341939;
border: 1px solid #433446;
padding: 24px;
color: #EFECF0;
font-family: 'Inclusive Sans', sans-serif;
}
.nba-comment-header {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 14px;
}
.nba-avatar {
width: 48px;
height: 48px;
flex-shrink: 0;
background-color: #29142E;
border: 1px solid #CA77DB;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
overflow: hidden;
}
.nba-avatar img {
width: 48px;
height: 48px;
object-fit: cover;
display: block;
}
.nba-avatar-initials {
font-weight: 700;
font-size: 0.9375rem;
color: #EFECF0;
letter-spacing: 0.05em;
}
.nba-comment-meta {
display: flex;
flex-direction: column;
gap: 2px;
}
.nba-comment-author-row {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.nba-comment-author {
font-size: 1.0625rem;
font-weight: 600;
color: #EFECF0;
margin: 0;
line-height: 1.3;
}
.nba-badge-ticket {
font-size: 0.6875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.08em;
background-color: #200F23;
color: #CA77DB;
border: 1px solid #433446;
padding: 2px 8px;
border-radius: 4px;
}
.nba-comment-time {
font-size: 0.8125rem;
color: #BCB0BF;
}
.nba-comment-body {
margin-bottom: 16px;
}
.nba-comment-text {
font-size: 0.9375rem;
line-height: 1.6;
color: #EFECF0;
margin: 0;
}
.nba-comment-actions {
display: flex;
align-items: center;
gap: 12px;
}
.nba-comment-btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 16px;
font-size: 0.8125rem;
font-weight: 600;
font-family: inherit;
color: #BCB0BF;
background-color: #29142E;
border: 1px solid #433446;
border-radius: 4px;
cursor: pointer;
transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.nba-comment-btn:hover {
background-color: #200F23;
border-color: #CA77DB;
color: #EFECF0;
}
.nba-like-btn[aria-pressed="true"],
.nba-like-btn:active {
border-color: #CA77DB;
color: #CA77DB;
}
.nba-like-count {
font-variant-numeric: tabular-nums;
}
.nba-btn-icon {
width: 14px;
height: 14px;
flex-shrink: 0;
}
.nba-comment-reply {
background-color: #29142E;
border: 1px solid #433446;
border-left: 3px solid #CA77DB;
padding: 20px;
color: #EFECF0;
font-family: 'Inclusive Sans', sans-serif;
margin-top: 12px;
margin-left: 28px;
}
@media (max-width: 640px) {
.nba-comment-reply {
margin-left: 12px;
padding: 16px;
}
}
.nba-avatar-reply {
width: 40px;
height: 40px;
flex-shrink: 0;
background-color: #341939;
border: 1px solid #A2EB99;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
overflow: hidden;
}
.nba-avatar-reply img {
width: 40px;
height: 40px;
object-fit: cover;
display: block;
}
.nba-avatar-reply .nba-avatar-initials {
font-weight: 700;
font-size: 0.875rem;
color: #A2EB99;
letter-spacing: 0.05em;
}
.nba-badge-official {
font-size: 0.6875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.08em;
background-color: #140A16;
color: #A2EB99;
border: 1px solid #433446;
padding: 2px 8px;
border-radius: 4px;
}
.nba-comment-reply .nba-comment-author {
font-size: 1rem;
}
.nba-comment-reply .nba-comment-text {
font-size: 0.9375rem;
line-height: 1.6;
color: #EFECF0;
margin: 0;
}
.nba-comment-reply .nba-comment-btn:hover {
border-color: #A2EB99;
color: #EFECF0;
}
.nba-comment-reply .nba-like-btn[aria-pressed="true"],
.nba-comment-reply .nba-like-btn:active {
border-color: #A2EB99;
color: #A2EB99;
}
/* ===== PAGE TEMPLATE: news-and-events ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-detail-page {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-detail-page .nba-accent-title {
border-left: 4px solid var(--primary);
padding-left: 1rem;
hyphens: auto;
overflow-wrap: anywhere;
}
.nba-detail-page .nba-facts-container {
border-radius: 0px;
}
.nba-detail-page .nba-toc-card {
border-radius: 0px;
}
.nba-detail-page .nba-main-image-wrap {
border-radius: 0px;
}
.nba-detail-page .nba-main-image-wrap img {
border-radius: 0px;
}
.nba-detail-page .nba-pullquote {
border-radius: 0px;
}
.nba-detail-page .nba-author-card {
border-radius: 0px;
}
.nba-detail-page .nba-cta-box {
border-radius: 0px;
}
.nba-detail-page .nba-related-item {
border-radius: 0px;
}
.nba-detail-page .js-faq-toggle:hover {
background-color: var(--surface-alt);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
@media (max-width: 767px) {
.nba-detail-page .nba-facts-container dl {
grid-template-columns: 1fr;
}
.nba-detail-page .nba-author-card {
flex-direction: column;
text-align: center;
}
.nba-detail-page .nba-cta-box {
flex-direction: column;
}
}
/* ===== PAGE TEMPLATE: san-antonio-spurs ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.spurs-article-template {
font-family: 'Inclusive Sans', sans-serif;
}
.spurs-article-template .spurs-toc-link:hover span {
color: var(--primary-text);
}
.spurs-article-template .spurs-facts-table th,
.spurs-article-template .spurs-facts-table td {
overflow-wrap: anywhere;
}
.spurs-article-template .spurs-accordion-item {
border-radius: 4px;
transition: border-color 150ms ease;
}
.spurs-article-template .spurs-accordion-item.is-open {
border-color: var(--primary);
}
.spurs-article-template .spurs-accordion-item.is-open .js-faq-icon {
transform: rotate(45deg);
color: var(--primary-hover);
}
@media (max-width: 767px) {
.spurs-article-template .spurs-facts-table thead {
display: none;
}
.spurs-article-template .spurs-facts-table,
.spurs-article-template .spurs-facts-table tbody,
.spurs-article-template .spurs-facts-table tr,
.spurs-article-template .spurs-facts-table td {
display: block;
width: 100%;
}
.spurs-article-template .spurs-facts-table tr {
margin-bottom: 12px;
border-bottom: 1px solid var(--border);
}
.spurs-article-template .spurs-facts-table td {
padding: 8px 12px;
}
.spurs-article-template .spurs-facts-table td:first-child {
background-color: var(--surface-alt);
font-weight: 700;
border-bottom: 1px solid var(--border);
}
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
/* ===== PAGE TEMPLATE: new-orleans-pelicans ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
.pelicans-article-root {
font-family: 'Inclusive Sans', sans-serif;
}
.pelicans-article-root .pelicans-reading-bar {
position: fixed;
top: 0;
left: 0;
width: 0%;
height: 3px;
background-color: var(--primary);
z-index: 9999;
transition: width 80ms linear;
}
.pelicans-article-root .pelicans-prose.text-size-small {
font-size: 14px;
line-height: 1.6;
}
.pelicans-article-root .pelicans-prose.text-size-normal {
font-size: 16px;
line-height: 1.7;
}
.pelicans-article-root .pelicans-prose.text-size-large {
font-size: 18px;
line-height: 1.75;
}
.pelicans-article-root .pelicans-feature-card,
.pelicans-article-root .pelicans-takeaways,
.pelicans-article-root .pelicans-pullquote-wrapper,
.pelicans-article-root .pelicans-inline-cta {
border-radius: 0px;
}
@media (max-width: 767px) {
.pelicans-article-root .pelicans-prose.text-size-small {
font-size: 13px;
}
.pelicans-article-root .pelicans-prose.text-size-normal {
font-size: 14px;
}
.pelicans-article-root .pelicans-prose.text-size-large {
font-size: 16px;
}
}
/* ===== PAGE TEMPLATE: spurs-vs-pelicans ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
.spurs-article-root {
font-family: 'Inclusive Sans', sans-serif;
overflow-wrap: anywhere;
}
.spurs-article-root .spurs-toc-chip {
background-color: var(--surface-alt);
border-radius: 4px;
}
.spurs-article-root .spurs-toc-chip:hover,
.spurs-article-root .spurs-toc-chip:focus-visible {
border-color: var(--primary);
color: var(--primary-text);
}
.spurs-article-root .spurs-toc-chip.is-active {
background-color: var(--primary);
color: var(--on-primary);
border-color: var(--primary);
font-weight: 600;
}
.spurs-article-root .spurs-striped-table {
border-collapse: collapse;
}
.spurs-article-root .spurs-pullquote-container {
border-radius: 0px;
}
.spurs-article-root .spurs-article-cta {
border-radius: 4px;
}
.spurs-article-root .spurs-related-card {
border-radius: 0px;
}
@media (max-width: 767px) {
.spurs-article-root .spurs-striped-table thead {
display: none;
}
.spurs-article-root .spurs-striped-table,
.spurs-article-root .spurs-striped-table tbody,
.spurs-article-root .spurs-striped-table tr,
.spurs-article-root .spurs-striped-table td {
display: block;
width: 100%;
}
.spurs-article-root .spurs-striped-table td {
padding: 8px 12px;
}
.spurs-article-root .spurs-striped-table tr {
padding-top: 6px;
padding-bottom: 6px;
}
}
/* ===== PAGE TEMPLATE: nba-paris-games ===== */
.nba-detail-page {
font-family: 'Inclusive Sans', sans-serif;
}
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-detail-page .article-outer-frame {
border-radius: 0px;
}
.nba-detail-page .article-image-frame {
border-radius: 0px;
}
.nba-detail-page .article-image-frame img {
border-radius: 0px;
}
.nba-detail-page .article-striped-table th,
.nba-detail-page .article-striped-table td {
overflow-wrap: anywhere;
}
.nba-detail-page .faq-item {
border-radius: 4px;
}
.nba-detail-page .xfe-btn {
background-color: var(--primary);
color: var(--on-primary);
border-radius: 4px;
transition: background-color 150ms ease, color 150ms ease;
}
.nba-detail-page .xfe-btn:hover {
background-color: var(--primary-hover);
color: var(--on-primary);
}
.nba-detail-page .xfe-btn-alt {
background-color: transparent;
color: var(--text);
border: 1px solid var(--border);
border-radius: 4px;
transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease;
}
.nba-detail-page .xfe-btn-alt:hover {
border-color: var(--primary);
color: var(--primary-text);
background-color: var(--surface);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
@media (max-width: 767px) {
.nba-detail-page .article-striped-table thead {
display: none;
}
.nba-detail-page .article-striped-table,
.nba-detail-page .article-striped-table tbody,
.nba-detail-page .article-striped-table tr,
.nba-detail-page .article-striped-table td {
display: block;
width: 100%;
}
.nba-detail-page .article-striped-table tr {
padding: 6px 0;
}
.nba-detail-page .article-striped-table td {
padding: 6px 12px;
}
}
/* ===== PAGE TEMPLATE: fan-guide ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
.fan-guide-detail .section-heading-h2 {
position: relative;
padding-bottom: 12px;
}
.fan-guide-detail .section-heading-h2::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 44px;
height: 3px;
background-color: var(--primary);
}
.fan-guide-detail .fact-tile {
border-radius: 0px;
}
.fan-guide-detail .param-table tr:nth-child(even) {
background-color: rgba(41, 20, 46, 0.45);
}
.fan-guide-detail .faq-accordion-trigger[aria-expanded="true"] .js-faq-icon {
transform: rotate(45deg);
}
@media (max-width: 767px) {
.fan-guide-detail .param-table thead {
display: none;
}
.fan-guide-detail .param-table,
.fan-guide-detail .param-table tbody,
.fan-guide-detail .param-table tr,
.fan-guide-detail .param-table th,
.fan-guide-detail .param-table td {
display: block;
width: 100%;
}
.fan-guide-detail .param-table tr {
border-bottom: 1px solid var(--border);
padding: 12px 14px;
}
.fan-guide-detail .param-table th {
padding: 0 0 4px 0;
border: none;
}
.fan-guide-detail .param-table td {
padding: 0 0 6px 0;
border: none;
}
}
/* ===== PAGE TEMPLATE: nba-history ===== */
.header-root {
background-color: var(--surface);
color: var(--text);
}
.header-root .header-top-bar {
background-color: var(--primary);
color: var(--on-primary);
}
.header-root .header-top-bar a {
color: var(--on-primary);
}
.header-root .header-main-nav {
background-color: var(--surface);
}
.header-root .header-logo-img {
max-width: 44px;
height: 44px;
object-fit: contain;
}
.header-root .header-nav-link {
color: var(--text);
transition: color 150ms ease, background-color 150ms ease;
}
.header-root .header-nav-link:hover,
.header-root .header-nav-link:focus-visible {
color: var(--primary-text);
}
.header-root .header-dropdown.is-active .header-dropdown-btn {
color: var(--primary-text);
}
.header-root .header-caret {
transition: transform 150ms ease;
}
.header-root .header-dropdown.is-active .header-caret {
transform: rotate(180deg);
}
.header-root .header-dropdown-menu {
display: none;
background-color: var(--surface-alt);
border: 1px solid var(--border);
}
.header-root .header-dropdown.is-active .header-dropdown-menu {
display: block;
}
.header-root .header-dropdown-item {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-dropdown-item:hover,
.header-root .header-dropdown-item:focus-visible {
background-color: var(--surface);
color: var(--primary-text);
}
.header-root .header-cta-btn {
background-color: var(--dark-band);
color: var(--on-dark);
border: 1px solid var(--border);
transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.header-root .header-cta-btn:hover,
.header-root .header-cta-btn:focus-visible {
background-color: var(--surface);
border-color: var(--primary);
color: var(--on-dark);
}
.header-root .header-burger-btn {
background-color: var(--surface-alt);
}
.header-root .header-burger-btn:hover {
border-color: var(--primary);
}
.header-root .header-burger-btn.is-open .header-icon-open {
display: none;
}
.header-root .header-burger-btn.is-open .header-icon-close {
display: block;
}
.header-root .header-mobile-drawer {
display: none;
background-color: var(--surface);
}
.header-root .header-mobile-drawer.is-open {
display: block;
}
.header-root .header-mobile-link {
color: var(--text);
transition: background-color 150ms ease, color 150ms ease;
}
.header-root .header-mobile-link:hover,
.header-root .header-mobile-link:focus-visible {
background-color: var(--surface-alt);
color: var(--primary-text);
}
.nba-article-detail .detail-media-frame img {
border-radius: 0px;
}
.nba-article-detail .js-accordion-item.is-open .js-accordion-icon {
transform: rotate(180deg);
}
.nba-article-detail .js-faq-item.is-open .js-faq-icon {
transform: rotate(45deg);
}
.nba-footer {
font-family: 'Inclusive Sans', sans-serif;
}
.nba-footer a {
transition: color 150ms ease, border-color 150ms ease;
}
.nba-footer a:hover {
color: var(--primary-hover);
}
.nba-footer .footer-legal-callout {
border-radius: 0px;
}
@media (max-width: 767px) {
.nba-article-detail h1,
.nba-article-detail h2,
.nba-article-detail h3 {
overflow-wrap: anywhere;
}
}
/* mobile-text-guard */
@media (max-width: 767px) {
h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label {
overflow-wrap: anywhere;
}
a, button, .btn {
overflow-wrap: anywhere;
white-space: normal;
}
img, video, iframe {
max-width: 100%;
}
}