@import url('brand-settings.css');
/* One brand palette for every page. Dark text/buttons remain readable even for bright brand colors. */
:root {
  --color-amber-50: color-mix(in srgb, var(--brand-primary) 6%, white);
  --color-amber-100: color-mix(in srgb, var(--brand-primary) 12%, white);
  --color-amber-200: color-mix(in srgb, var(--brand-primary) 25%, white);
  --color-amber-300: color-mix(in srgb, var(--brand-primary) 40%, white);
  --color-amber-400: color-mix(in srgb, var(--brand-primary) 55%, white);
  --color-amber-500: color-mix(in srgb, var(--brand-primary) 50%, #182331);
  --color-amber-600: color-mix(in srgb, var(--brand-primary) 45%, #111827);
  --color-amber-700: color-mix(in srgb, var(--brand-primary) 35%, #111827);
  --color-amber-800: color-mix(in srgb, var(--brand-primary) 25%, #111827);
  --color-amber-900: color-mix(in srgb, var(--brand-primary) 15%, #111827);
}
#hero-section {
  --hero-bg: #091521; --hero-text: #f8fafc; --hero-muted: #dbe5ef;
  --hero-accent: color-mix(in srgb, var(--brand-primary) 35%, white);
  --hero-line: #64748b; --hero-card: #172736;
  isolation: isolate; background: var(--hero-bg); color: var(--hero-text);
  padding: clamp(3rem, 6vw, 6rem) 1rem; min-height: 0;
}
#hero-section[data-hero-theme='light'] {
  --hero-bg: #f3f7fa; --hero-text: #101f2c; --hero-muted: #334155;
  --hero-accent: color-mix(in srgb, var(--brand-primary) 35%, #111827);
  --hero-line: #94a3b8; --hero-card: #fff;
}
#hero-section > div:first-child { background: radial-gradient(ellipse at top right, color-mix(in srgb, var(--brand-primary) 30%, var(--hero-bg)), var(--hero-bg) 72%); }
#hero-section .hero-background-image { width:100%; height:100%; object-fit:cover; object-position:center; }
#hero-section .hero-background-image[hidden] { display:none; }
#hero-section .hero-overlay { position:absolute; inset:0; background:var(--hero-bg); opacity:var(--hero-overlay-opacity,.82); }
#hero-section h1 { color:var(--hero-text); font-size:clamp(2rem,4.4vw,3.75rem); line-height:1.13; text-wrap:balance; }
#hero-section #hero-content > p { color:var(--hero-muted); font-weight:500; }
#hero-section #hero-content > div:first-child:not(#hero-stats-grid) { color:var(--hero-accent); }
#hero-section #hero-stats-grid { background:var(--hero-card); border-color:var(--hero-line); gap:0; padding:1.25rem; margin-top:2.5rem; }
#hero-stats-grid > div { min-width:0; padding:1rem .65rem; border:0; }
#hero-stats-grid > div + div { border-left:1px solid var(--hero-line); }
#hero-section #hero-stats-grid p:first-of-type { color:var(--hero-text); font-size:clamp(1.25rem,2.6vw,1.875rem); }
#hero-section #hero-stats-grid p:last-of-type { color:var(--hero-muted); }
#hero-section #hero-stats-grid svg, #hero-section #hero-brands > p { color:var(--hero-accent); }
#hero-section #hero-brands > div { color:var(--hero-muted); }
#hero-section #hero-cta-buttons > :first-child { background:var(--color-amber-600); color:white; }
#hero-section #hero-cta-buttons > :last-child { background:var(--hero-card); border:1px solid var(--hero-line); color:var(--hero-text); }
#hero-section #hero-cta-buttons > * { min-height:52px; }
#logo-brand img { max-width:175px; max-height:40px; object-fit:contain; }
#footer-brand img { max-width:190px; }
@media(max-width:767px) {
  #hero-section #hero-stats-grid { padding:.75rem; }
  #hero-stats-grid > div + div { border-left:0; }
  #hero-stats-grid > div:nth-child(even) { border-left:1px solid var(--hero-line); }
  #hero-stats-grid > div:nth-child(n+3) { border-top:1px solid var(--hero-line); }
  #hero-section #hero-brands { margin-top:2.5rem; }
}
@media(max-width:420px) { #logo-brand img { max-width:145px; } }
#hero-section #hero-brands > div { opacity:1; }
#hero-section #hero-brands span { color:var(--hero-muted); }
#hero-section #hero-content > div:first-child:not(#hero-stats-grid) span { color:var(--hero-accent); }
footer img[src$='brand-logo.svg'] { filter:brightness(0) invert(1); }

/* Page audit fixes: readable shared components and keyboard controls. */
[hidden] { display:none !important; }
html { scroll-padding-top:100px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline:3px solid var(--brand-primary, #7c3aed) !important; outline-offset:4px;
}
.text-gray-400 { color:#5a6574; }
.plan-page-hero { background:linear-gradient(135deg,#101f2c,color-mix(in srgb, var(--brand-primary) 38%, #101f2c)); color:#fff; }
.plan-page-hero h1 { color:#fff; line-height:1.2; }
.plan-page-hero p { color:#dbe5ef; }
.plan-page-hero h1 span { color:color-mix(in srgb, var(--brand-primary) 35%, white); }
#sports-banner-section > div:first-child > div { background:linear-gradient(90deg,rgba(9,21,33,.92),rgba(9,21,33,.62)); }
#sports-banner-section img { filter:none; }
#faq-empty-state { padding:24px; margin-top:16px; border:1px solid color-mix(in srgb, var(--brand-primary) 14%, #e2e8f0); border-radius:16px; background:color-mix(in srgb, var(--brand-primary) 4%, #f8fafc); text-align:center; }
#faq-empty-state button { color:color-mix(in srgb, var(--brand-primary) 62%, black); text-decoration:underline; margin-top:12px; font-weight:700; }
[id^='btn-faq-cat-'][aria-pressed='false'] { background:#fff; color:#52606d; border-color:#dce2e7; }
[id^='btn-faq-cat-'][aria-pressed='true'] { background:color-mix(in srgb, var(--brand-primary) 10%, white); color:color-mix(in srgb, var(--brand-primary) 62%, black); border-color:color-mix(in srgb, var(--brand-primary) 50%, white); }
.calculator-pack { display:grid; gap:8px; color:#334155; font-size:13px; font-weight:700; }
.calculator-pack select { width:100%; min-width:0; padding:12px; background:white; border:1px solid #cbd5e1; border-radius:10px; color:#1e293b; font:inherit; }
#profit-calculator label { text-transform:none; letter-spacing:0; }
.reseller-hero-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:24px; }
.page-button { display:inline-flex; align-items:center; justify-content:center; padding:14px 22px; min-height:48px; border:1px solid color-mix(in srgb, var(--brand-primary) 62%, black); border-radius:12px; background:color-mix(in srgb, var(--brand-primary) 62%, black); color:#fff; font-size:14px; font-weight:750; }
.page-button-secondary { background:#fff; color:color-mix(in srgb, var(--brand-primary) 62%, black); }
.review-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.review-card { display:flex; align-items:flex-start; gap:16px; padding:24px; background:#fff; border:1px solid color-mix(in srgb, var(--brand-primary) 14%, #e2e8f0); border-radius:20px; }
.review-card > div:first-child { flex-shrink:0; }
.review-quote { color:#334155; font-size:14px; line-height:1.7; margin-top:12px; }
@media(min-width:1024px) {
 #pricing-card-plan-24-months > div { display:flex; flex-direction:row; align-items:stretch; }
 #pricing-card-plan-24-months > div > div:first-child { width:60%; min-width:0; }
 #pricing-card-plan-24-months > div > div:last-child { width:40%; min-width:0; }
}
@media(max-width:767px) {
 .review-grid { grid-template-columns:1fr; gap:16px; }
 #reseller-view { padding-top:36px; }
 #reseller-view > div > div:first-child { margin-bottom:36px; }
 #reseller-info-block { gap:28px; margin-bottom:40px; }
 #pricing-section { padding-top:40px; padding-bottom:40px; }
 #hero-section #hero-brands { display:none; }
 #sports-banner-section { padding-top:56px; padding-bottom:56px; }
 #why-choose-us { padding-top:48px; padding-bottom:48px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

footer .text-gray-400, .bg-slate-900 .text-gray-400, .bg-slate-800 .text-gray-400 { color:#b6c2ce; }