.tables-page { overflow: clip; }
.tables-page .tables-hero { padding: var(--space-8) 0 var(--space-16); background: var(--color-obsidian-950); }
.tables-page .tables-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); align-items: stretch; }
.tables-page .tables-hero__copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-6); padding: var(--space-6); background: rgba(10, 10, 12, .88); box-shadow: var(--glow-gold); }
.tables-page .tables-hero__copy > * { min-width: 0; margin: 0; }
.tables-page .tables-hero h1 { max-width: 620px; }
.tables-page .tables-hero h1 span { color: var(--color-light-champagne); }
.tables-page .tables-hero .lead { max-width: 560px; }
.tables-page .tables-hero__actions { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); width: 100%; min-width: 0; }
.tables-page .tables-hero__media { position: relative; width: 100%; min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--color-border-subtle); border-radius: var(--radius-md); aspect-ratio: 16 / 10; }
.tables-page .tables-hero__media::after, .tables-page .atmosphere__scene figure::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to bottom, rgba(10,10,12,.08), rgba(10,10,12,.5)); }
.tables-page .tables-hero__media img, .tables-page .roulette-feature__media img, .tables-page .dealers__media img, .tables-page .atmosphere__scene figure img { width: 100%; height: 100%; object-fit: cover; }
.tables-page .tables-text-link { font-weight: 700; }
.tables-page .tables-overview { background: var(--color-graphite-900); }
.tables-page .tables-overview__intro { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); margin-bottom: var(--space-12); }
.tables-page .tables-overview__intro > * { min-width: 0; margin: 0; }
.tables-page .tables-overview__intro p { max-width: 520px; color: var(--color-text-muted); }
.tables-page .tables-overview__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
.tables-page .tables-table-card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); min-width: 0; padding: var(--space-6); }
.tables-page .tables-table-card > * { min-width: 0; margin: 0; }
.tables-page .tables-table-card__number, .tables-page .rhythm__number { color: var(--color-champagne-gold); font-family: var(--font-heading); font-weight: 800; letter-spacing: var(--tracking-label); }
.tables-page .tables-table-card a { margin-top: auto; font-weight: 700; }
.tables-page .roulette-feature { background: var(--color-obsidian-950); }
.tables-page .roulette-feature__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.tables-page .roulette-feature__copy, .tables-page .roulette-feature__details { min-width: 0; }
.tables-page .roulette-feature__copy > :last-child { margin-bottom: 0; }
.tables-page .roulette-feature__copy p:not(.eyebrow) { max-width: 540px; }
.tables-page .roulette-feature__media { width: 100%; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--radius-md); aspect-ratio: 4 / 3; }
.tables-page .roulette-feature__details { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-6); }
.tables-page .roulette-feature__details > * { min-width: 0; margin: 0; }
.tables-page .roulette-feature__details p { max-width: 540px; }
.tables-page .roulette-feature__notice { display: flex; flex-direction: column; gap: var(--space-3); max-width: 420px; border: 1px solid rgba(66,214,164,.42); padding: var(--space-4); }
.tables-page .roulette-feature__notice > * { margin: 0; }
.tables-page .rhythms { background: var(--color-graphite-900); }
.tables-page .rhythms__lead { max-width: 620px; }
.tables-page .rhythms__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-12); }
.tables-page .rhythm { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); min-width: 0; border: 1px solid var(--color-border); border-left: 1px solid var(--color-border); padding: var(--space-6); background: rgba(27,29,36,.48); transition: border-color var(--transition-base), background-color var(--transition-base); }
.tables-page .rhythm:nth-child(2) { background: rgba(10,10,12,.46); }
.tables-page .rhythm:hover { border-left-color: var(--color-champagne-gold); background: rgba(27,29,36,.78); }
.tables-page .rhythm > * { min-width: 0; margin: 0; }
.tables-page .rhythm__copy p { max-width: 560px; margin-bottom: 0; }
.tables-page .rhythm__fit { max-width: 230px; color: var(--color-light-champagne); font-family: var(--font-heading); font-weight: 700; }
.tables-page .dealers { background: var(--color-obsidian-950); }
.tables-page .dealers__intro { max-width: 610px; }
.tables-page .dealers__intro > :last-child { margin-bottom: 0; }
.tables-page .dealers__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); margin-top: var(--space-12); }
.tables-page .dealers__media { width: 100%; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--radius-md); aspect-ratio: 4 / 5; }
.tables-page .dealers__cards { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.tables-page .dealers__cards > * { width: 100%; min-width: 0; }
.tables-page .dealers__card { padding: var(--space-6); }
.tables-page .atmosphere { background: var(--color-graphite-900); }
.tables-page .atmosphere__intro { max-width: 540px; }
.tables-page .atmosphere__intro > :last-child { margin-bottom: 0; }
.tables-page .atmosphere__scene { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-12); }
.tables-page .atmosphere__scene figure { position: relative; width: 100%; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--radius-md); aspect-ratio: 3 / 2; }
.tables-page .atmosphere__cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); min-width: 0; }
.tables-page .atmosphere__card { min-width: 0; padding: var(--space-6); }
.tables-page .atmosphere__card > :last-child { margin-bottom: 0; }
.tables-page .safety { background: var(--color-graphite-900); }
.tables-page .safety__lead { max-width: 650px; }
.tables-page .safety__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-12); }
.tables-page .safety__panel { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); min-width: 0; border: 1px solid var(--color-border); padding: var(--space-6); background: rgba(18,18,22,.82); }
.tables-page .safety__panel > * { min-width: 0; margin: 0; }
.tables-page .safety__panel p { max-width: 340px; }
.tables-page .safety__panel:first-child { border-top-color: rgba(66,214,164,.6); }
.tables-page .safety__age { color: var(--color-light-champagne); font-family: var(--font-heading); font-size: var(--text-xl); font-weight: 800; }
.tables-page .process { background: var(--color-obsidian-950); }
.tables-page .process__intro { max-width: 540px; }
.tables-page .process__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-12); }
.tables-page .process__step { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--space-4); min-width: 0; border-left: 1px solid var(--color-slate-700); padding: var(--space-4) 0 var(--space-4) var(--space-4); }
.tables-page .process__step > * { min-width: 0; }
.tables-page .process__step > span { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--color-border-subtle); color: var(--color-light-champagne); font-family: var(--font-heading); font-weight: 800; }
.tables-page .process__step div > :last-child { margin-bottom: 0; }
.tables-page .quote-cta { background: var(--color-obsidian-950); }
.tables-page .quote-cta__panel { position: relative; overflow: hidden; border: 1px solid var(--color-border-subtle); padding: var(--space-8); background: var(--color-slate-800); box-shadow: var(--shadow-soft); }
.tables-page .quote-cta__panel::after { content: ""; position: absolute; width: 28rem; height: 28rem; right: -10rem; top: 50%; transform: translateY(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(212,175,55,.16), transparent 68%); pointer-events: none; }
.tables-page .quote-cta__copy { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-6); max-width: 560px; min-width: 0; }
.tables-page .quote-cta__copy > * { min-width: 0; margin: 0; }
.tables-page .quote-cta__note { max-width: 520px; color: var(--color-text-muted); font-size: var(--text-sm); }
.tables-page .quote-cta__note span { color: var(--color-success); font-weight: 700; }
.tables-page .faq { background: var(--color-graphite-900); }
.tables-page .faq__content { max-width: 820px; }
.tables-page .faq__intro { max-width: 680px; }
.tables-page .faq__list { display: flex; flex-direction: column; gap: var(--space-3); }
.tables-page .faq__item { border-bottom: 1px solid var(--color-border); }
.tables-page .faq__item h3 { margin: 0; }
.tables-page .faq__item button { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); width: 100%; min-height: 48px; border: 0; background: transparent; padding: var(--space-4) 0; color: var(--color-platinum); font-family: var(--font-heading); font-size: var(--text-lg); font-weight: 800; line-height: 1.35; text-align: left; }
.tables-page .faq__item button span { flex: 0 0 auto; color: var(--color-champagne-gold); font-size: 1.5rem; transition: transform var(--transition-fast); }
.tables-page .faq__item button[aria-expanded="true"] { color: var(--color-light-champagne); }
.tables-page .faq__item button[aria-expanded="true"] span { transform: rotate(45deg); }
.tables-page .faq__item [role="region"] { max-width: 680px; }
.tables-page .faq__item [role="region"] p { margin-bottom: var(--space-6); }
@media (min-width: 37.5rem) { .tables-page .tables-overview__grid, .tables-page .safety__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 48rem) { .tables-page .tables-hero__copy { padding: var(--space-8); } .tables-page .process__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); } }
@media (min-width: 55rem) { .tables-page .rhythm { grid-template-columns: minmax(0, 12fr) minmax(0, 58fr) minmax(0, 30fr); align-items: start; } .tables-page .rhythm__fit { justify-self: end; } }
@media (min-width: 57.5rem) { .tables-page .atmosphere__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 60rem) { .tables-page .tables-hero__inner { grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); gap: 0; } .tables-page .tables-hero__copy { align-self: center; z-index: 1; margin-right: calc(var(--space-8) * -1); } .tables-page .tables-hero__media { aspect-ratio: auto; min-height: 38rem; border-radius: 0 var(--radius-md) var(--radius-md) 0; } .tables-page .roulette-feature__layout { grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); align-items: start; } .tables-page .roulette-feature__copy { grid-column: 1; } .tables-page .roulette-feature__media { grid-column: 2; grid-row: 1 / span 2; height: 100%; min-height: 34rem; } .tables-page .roulette-feature__details { grid-column: 1; } .tables-page .dealers__layout { grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); } .tables-page .atmosphere__cards { position: absolute; right: var(--space-6); bottom: calc(var(--space-6) * -1); width: min(56%, 680px); } }
@media (min-width: 62.5rem) { .tables-page .process__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); position: relative; } .tables-page .process__grid::before { content: ""; position: absolute; top: 38px; left: 6%; right: 6%; height: 1px; background: var(--color-slate-700); } .tables-page .process__step { grid-template-columns: minmax(0, 1fr); border: 0; padding: 0; } .tables-page .process__step > span { position: relative; z-index: 1; background: var(--color-obsidian-950); } }
@media (min-width: 67.5rem) { .tables-page .tables-overview__intro { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: end; } .tables-page .tables-overview__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .tables-page .safety__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 37.4375rem) { .tables-page .tables-hero__actions .button { width: 100%; } .tables-page .quote-cta__copy .button { width: 100%; } .tables-page .quote-cta__panel { padding: var(--space-6); } .tables-page .quote-cta__panel::after { display: none; } }
@media (prefers-reduced-motion: no-preference) { .tables-page .tables-overview, .tables-page .roulette-feature, .tables-page .rhythms, .tables-page .dealers, .tables-page .atmosphere, .tables-page .safety, .tables-page .process, .tables-page .quote-cta, .tables-page .faq { opacity: 0; transform: translateY(12px); transition: opacity 220ms ease, transform 220ms ease; } .tables-page .is-revealed { opacity: 1; transform: translateY(0); } }