/* ═══════════════════════════════════════════════════════════════════════════
   Kosher SushiMon — Brand Theme Override
   Minimal, high contrast, institutional but cinematic.
   Premium without flash, slightly austere. Monochrome-first.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── 1. CSS Custom Properties ─────────────────────────────────────────── */
:root {
  /* Brand primaries */
  --ks-black: #0a0a0a;
  --ks-offwhite: #faf9f7;
  --ks-charcoal: #2d2d2d;
  --ks-charcoal-light: #4a4a4a;
  --ks-red: #8b1a1a;
  --ks-red-light: #a52020;
  --ks-red-glow: rgba(139, 26, 26, 0.3);
  --ks-red-subtle: rgba(139, 26, 26, 0.12);
  --ks-red-faint: rgba(139, 26, 26, 0.06);

  /* Surfaces */
  --ks-dark-bg: #0a0a0a;
  --ks-dark-bg-alt: #111111;
  --ks-dark-surface: rgba(10, 10, 10, 0.95);
  --ks-dark-surface-alt: rgba(17, 17, 17, 0.96);
  --ks-light-bg: #faf9f7;
  --ks-light-surface: #ffffff;
  --ks-border-dark: rgba(255, 255, 255, 0.08);
  --ks-border-light: rgba(0, 0, 0, 0.08);

  /* Typography */
  --ks-font: 'Inter', 'Helvetica Neue', 'Arial', sans-serif;
  --ks-text-dark: #0a0a0a;
  --ks-text-muted: #4a4a4a;
  --ks-text-light: rgba(255, 255, 255, 0.85);
  --ks-text-light-muted: rgba(255, 255, 255, 0.55);

  /* Override any existing orange-derived variables */
  --review-star: #d4a017;
  --ss-primary: #8b1a1a;
  --brand-color: #8b1a1a;
}


/* ─── 2. Global Typography & Body ──────────────────────────────────────── */
body {
  font-family: var(--ks-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--ks-offwhite);
  color: var(--ks-text-dark);
}


/* ═══════════════════════════════════════════════════════════════════════════
   NAVIGATION (.nav- / .top-nav / .burger-)
   Clean, minimal, strong typography
   ═══════════════════════════════════════════════════════════════════════════ */
.top-nav {
  background: var(--ks-dark-surface) !important;
  backdrop-filter: blur(24px) saturate(1.2);
  -webkit-backdrop-filter: blur(24px) saturate(1.2);
  font-family: var(--ks-font);
}

/* Replace orange gradient strip with deep red */
.top-nav::before {
  background: var(--ks-red) !important;
  background-size: 100% 100% !important;
  height: 2px !important;
}

.nav-container {
  border-bottom-color: var(--ks-border-dark);
}

/* Logo text — premium uppercase styling */
.top-nav .logo-wrap .logo-text {
  font-family: var(--ks-font);
  font-weight: 300;
  letter-spacing: 4px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.7);
}
.top-nav .logo-wrap:hover .logo-text {
  color: rgba(255, 255, 255, 0.95);
}
.top-nav .logo-wrap:focus-visible {
  outline-color: var(--ks-red);
}

/* Burger toggle — minimal */
.burger-toggle {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: 4px;
}
.burger-toggle:hover {
  background: rgba(139, 26, 26, 0.1) !important;
  border-color: rgba(139, 26, 26, 0.25) !important;
  color: var(--ks-red-light) !important;
  box-shadow: none !important;
}
.burger-toggle:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Remove orange glow animation from burger */
@keyframes burger-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(139, 26, 26, 0); }
  50% { box-shadow: 0 0 0 3px rgba(139, 26, 26, 0.08); }
}

/* Close button */
.menu-close-btn:hover {
  background: rgba(139, 26, 26, 0.12) !important;
  border-color: rgba(139, 26, 26, 0.2) !important;
  color: var(--ks-red-light) !important;
}
.menu-close-btn:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Mega-menu panel */
.burger-panel {
  background: var(--ks-dark-surface-alt) !important;
  backdrop-filter: blur(24px);
}

/* Menu column styles */
.menu-column {
  border-right-color: var(--ks-border-dark);
}

.menu-column-title {
  font-family: var(--ks-font);
  font-weight: 400;
  letter-spacing: 3px;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.35);
  border-bottom-color: var(--ks-border-dark);
}
.menu-column-title:hover {
  color: var(--ks-red-light) !important;
  text-shadow: none !important;
  border-bottom-color: rgba(139, 26, 26, 0.15) !important;
}
.menu-column-title:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Menu links — replace orange shimmer with subtle red */
.menu-column-list > li > a {
  font-family: var(--ks-font);
  font-weight: 400;
  letter-spacing: 0.02em;
}
.menu-column-list > li > a::before {
  background: linear-gradient(
    120deg,
    transparent 0%, transparent 30%,
    rgba(139, 26, 26, 0.04) 45%,
    rgba(139, 26, 26, 0.06) 50%,
    rgba(139, 26, 26, 0.04) 55%,
    transparent 70%, transparent 100%
  ) !important;
}
.menu-column-list > li > a::after {
  background: var(--ks-red) !important;
}
.menu-column-list > li > a:hover {
  background: rgba(139, 26, 26, 0.06) !important;
  text-shadow: none !important;
}
.menu-column-list > li > a:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Sublist links */
.menu-column-sublist a:hover {
  background: rgba(139, 26, 26, 0.05) !important;
}
.menu-column-sublist a:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Scrollbar — subtle dark red */
.menu-column-list::-webkit-scrollbar-thumb {
  background: rgba(139, 26, 26, 0.2) !important;
}
.menu-column-list::-webkit-scrollbar-thumb:hover {
  background: rgba(139, 26, 26, 0.35) !important;
}

/* Mobile menu */
@media (max-width: 768px) {
  .burger-panel {
    background: rgba(10, 10, 10, 0.97) !important;
  }
  .top-nav .logo-wrap .logo-text {
    font-weight: 300;
    letter-spacing: 3px;
  }
  .top-nav .logo-wrap:focus-visible {
    outline-color: var(--ks-red) !important;
  }
}


/* ═══════════════════════════════════════════════════════════════════════════
   HERO BANNER (.hero-)
   Cinematic — larger typography, more whitespace
   ═══════════════════════════════════════════════════════════════════════════ */
.hero-banner {
  background: var(--ks-dark-bg) !important;
  min-height: 580px;
  font-family: var(--ks-font);
}

.hero-bg-fallback {
  background:
    radial-gradient(ellipse 70% 60% at 20% 30%, rgba(139, 26, 26, 0.15) 0%, transparent 70%),
    radial-gradient(ellipse 50% 50% at 80% 60%, rgba(139, 26, 26, 0.08) 0%, transparent 60%),
    linear-gradient(135deg, var(--ks-dark-bg-alt) 0%, var(--ks-dark-bg) 100%) !important;
}

.hero-content {
  padding: 100px 40px 80px;
  max-width: 960px;
}

.hero-badge {
  font-family: var(--ks-font);
  font-weight: 400;
  letter-spacing: 5px;
  font-size: 11px;
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.1);
  margin-bottom: 28px;
}

.hero-title {
  font-family: var(--ks-font);
  font-size: 58px;
  font-weight: 200;
  letter-spacing: 0.02em;
  line-height: 1.1;
  text-shadow: none;
  margin-bottom: 20px;
}

.hero-subtitle {
  font-family: var(--ks-font);
  font-weight: 300;
  font-size: 20px;
  letter-spacing: 0.01em;
  color: rgba(255, 255, 255, 0.75);
  text-shadow: none;
  line-height: 1.6;
}

.hero-excerpt {
  font-family: var(--ks-font);
  font-weight: 300;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.55);
  letter-spacing: 0.01em;
  line-height: 1.8;
}

.hero-banner *:focus-visible {
  outline-color: var(--ks-red-light) !important;
}

@media (max-width: 768px) {
  .hero-banner { min-height: 460px; }
  .hero-content { padding: 70px 24px 56px; }
  .hero-title { font-size: 36px; font-weight: 200; letter-spacing: 0.01em; }
  .hero-subtitle { font-size: 17px; }
}

@media (min-width: 1200px) {
  .hero-banner { min-height: 660px; }
  .hero-title { font-size: 68px; }
  .hero-subtitle { font-size: 22px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   BUSINESS INFO (.bi-)
   ═══════════════════════════════════════════════════════════════════════════ */
.bi-hero {
  background: var(--ks-dark-bg) !important;
  font-family: var(--ks-font);
}

.bi-hero-overlay {
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.7) 0%, rgba(10, 10, 10, 0.88) 100%) !important;
}

.bi-hero-glass {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}

.bi-name {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.03em;
  font-size: 38px;
}

.bi-slogan {
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.01em;
}

.bi-chip svg {
  color: var(--ks-red-light) !important;
}

.bi-expertise-tag {
  color: var(--ks-red-light) !important;
  background: rgba(139, 26, 26, 0.08) !important;
  border-color: rgba(139, 26, 26, 0.15) !important;
}
.bi-expertise-tag:hover {
  background: rgba(139, 26, 26, 0.15) !important;
}

.bi-dd-link:hover {
  background: rgba(139, 26, 26, 0.1) !important;
  color: var(--ks-red-light) !important;
}

.bi-tag-dropdown {
  background: rgba(10, 10, 10, 0.95) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   HOURS OF OPERATION (.hrs-)
   ═══════════════════════════════════════════════════════════════════════════ */
.hrs-section {
  background-color: var(--ks-offwhite);
  font-family: var(--ks-font);
}

.hrs-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.hrs-divider-accent {
  background: var(--ks-red) !important;
}

.hrs-today {
  border-left-color: var(--ks-red) !important;
}
.hrs-today::before {
  background: radial-gradient(ellipse at left center, rgba(139, 26, 26, 0.04), transparent 70%) !important;
}

.hrs-today-badge {
  background: var(--ks-red) !important;
  box-shadow: 0 2px 8px rgba(139, 26, 26, 0.2) !important;
}

.hrs-today .hrs-day-name { color: var(--ks-text-dark) !important; }
.hrs-today .hrs-time { color: var(--ks-text-dark) !important; }

.hrs-section *:focus-visible { outline-color: var(--ks-red) !important; }

/* Dot pattern — more subtle */
.hrs-section {
  background-image: radial-gradient(circle, rgba(0, 0, 0, 0.02) 1px, transparent 1px) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   AWARDS (.aw-)
   ═══════════════════════════════════════════════════════════════════════════ */
.aw-section {
  background: var(--ks-dark-bg) !important;
  font-family: var(--ks-font);
}

.aw-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.aw-divider-accent {
  background: var(--ks-red) !important;
}

.aw-card:hover {
  border-color: rgba(139, 26, 26, 0.2) !important;
}

.aw-year-badge {
  background: linear-gradient(135deg, rgba(139, 26, 26, 0.15), rgba(139, 26, 26, 0.06)) !important;
  color: var(--ks-red-light) !important;
  border-color: rgba(139, 26, 26, 0.1) !important;
}

.aw-org {
  color: var(--ks-red-light) !important;
  background: rgba(139, 26, 26, 0.08) !important;
}

.aw-link {
  color: var(--ks-red-light) !important;
}
.aw-link:focus-visible {
  outline-color: rgba(139, 26, 26, 0.5) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   TRUSTED PARTNERS (.tp-)
   ═══════════════════════════════════════════════════════════════════════════ */
.tp-section {
  font-family: var(--ks-font);
  background-color: var(--ks-offwhite);
}

.tp-section::before {
  background-image: linear-gradient(135deg, var(--ks-red), var(--ks-red-light)) !important;
}

.tp-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.tp-divider-accent {
  background: var(--ks-red) !important;
}

.tp-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Dot pattern — subtler */
.tp-section {
  background-image: radial-gradient(circle, rgba(0, 0, 0, 0.015) 1px, transparent 1px) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SERVICE AREAS (.sa-)
   ═══════════════════════════════════════════════════════════════════════════ */
.sa-section {
  font-family: var(--ks-font);
}

.sa-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
  color: var(--ks-text-dark);
}

.sa-divider-accent {
  background: var(--ks-red) !important;
}

.sa-link:hover {
  color: var(--ks-red-light) !important;
}

.sa-link:focus-visible {
  outline-color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CONTACT FORM (.cf-)
   ═══════════════════════════════════════════════════════════════════════════ */
.cf-section {
  background: linear-gradient(135deg, var(--ks-dark-bg) 0%, var(--ks-dark-bg-alt) 50%, var(--ks-dark-bg) 100%) !important;
  font-family: var(--ks-font);
}
.cf-section::before {
  background-image: radial-gradient(circle at 20% 50%, rgba(139, 26, 26, 0.05) 0%, transparent 50%),
                    radial-gradient(circle at 80% 20%, rgba(139, 26, 26, 0.03) 0%, transparent 40%) !important;
}

.cf-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.cf-accent {
  background: var(--ks-red) !important;
}

.cf-info-icon {
  background: rgba(139, 26, 26, 0.12) !important;
  color: var(--ks-red-light) !important;
}

.cf-info-value a:hover { color: var(--ks-red-light) !important; }
.cf-required { color: var(--ks-red-light) !important; }

.cf-input:focus {
  border-color: rgba(139, 26, 26, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(139, 26, 26, 0.1) !important;
}

/* Submit button — dark, minimal, red accent */
.cf-submit {
  background: var(--ks-red) !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 12px rgba(139, 26, 26, 0.25) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 14px !important;
  font-weight: 500 !important;
}
.cf-submit:hover {
  filter: brightness(1.15) !important;
  box-shadow: 0 4px 20px rgba(139, 26, 26, 0.35) !important;
}
.cf-submit:focus-visible {
  outline-color: var(--ks-red-light) !important;
}

.cf-strip-link:hover { color: var(--ks-red-light) !important; }
.cf-strip-link svg { color: var(--ks-red-light) !important; }

.cf-section *:focus-visible {
  outline-color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CONTACT (.ct-)
   ═══════════════════════════════════════════════════════════════════════════ */
.ct-section {
  background: linear-gradient(180deg, var(--ks-dark-bg) 0%, var(--ks-dark-bg-alt) 100%) !important;
  font-family: var(--ks-font);
}

.ct-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.ct-divider-accent {
  background: var(--ks-red) !important;
}

.ct-icon-email {
  background: rgba(139, 26, 26, 0.12) !important;
  color: var(--ks-red-light) !important;
}

.ct-btn-email {
  background: rgba(139, 26, 26, 0.15) !important;
  color: var(--ks-red-light) !important;
}

.ct-mini-email {
  background: rgba(139, 26, 26, 0.1) !important;
  color: var(--ks-red-light) !important;
}
.ct-mini-email:hover {
  background: rgba(139, 26, 26, 0.18) !important;
}

.ct-hours-current {
  background: rgba(139, 26, 26, 0.1) !important;
  color: var(--ks-red-light) !important;
}

.ct-cta-link {
  color: var(--ks-red-light) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   TEAM (.tm-)
   ═══════════════════════════════════════════════════════════════════════════ */
.tm-section {
  font-family: var(--ks-font);
  background-color: var(--ks-offwhite);
}

.tm-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.tm-accent {
  background: var(--ks-red) !important;
}

.tm-photo-placeholder {
  background: linear-gradient(135deg, rgba(139, 26, 26, 0.1), rgba(139, 26, 26, 0.04)) !important;
}
.tm-photo-placeholder span {
  color: var(--ks-red) !important;
}

.tm-owner-badge {
  background: var(--ks-red) !important;
}

.tm-name {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
}

.tm-role {
  color: var(--ks-red) !important;
}

.tm-stat-num {
  color: var(--ks-red) !important;
}

.tm-skill-tag {
  color: var(--ks-red) !important;
  background: rgba(139, 26, 26, 0.04) !important;
  border-color: rgba(139, 26, 26, 0.08) !important;
}

a.tm-cert:hover {
  color: var(--ks-red) !important;
  background: rgba(139, 26, 26, 0.06) !important;
}

.tm-social-link:hover {
  color: var(--ks-red) !important;
  background: rgba(139, 26, 26, 0.06) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   TEAM GREETINGS (.tg-)
   ═══════════════════════════════════════════════════════════════════════════ */
.tg-section {
  font-family: var(--ks-font);
}

.tg-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.tg-accent {
  background: var(--ks-red) !important;
}

.tg-photo-placeholder {
  background: linear-gradient(135deg, rgba(139, 26, 26, 0.1), rgba(139, 26, 26, 0.04)) !important;
}

.tg-initials {
  color: var(--ks-red) !important;
}

.tg-name {
  color: var(--ks-text-dark) !important;
}

.tg-role {
  color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   LATEST ARTICLES (.la-)
   ═══════════════════════════════════════════════════════════════════════════ */
.la-section {
  font-family: var(--ks-font);
  background-color: var(--ks-offwhite);
}

.la-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.la-divider-accent {
  background: var(--ks-red) !important;
}

.la-card:hover {
  border-color: rgba(139, 26, 26, 0.12) !important;
}

.la-card-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
}

.la-card-read {
  color: var(--ks-red) !important;
}
.la-card:hover .la-card-read {
  color: var(--ks-red-light) !important;
}

/* View all button */
.la-viewall {
  background: var(--ks-red) !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 10px rgba(139, 26, 26, 0.2) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.la-viewall:hover {
  box-shadow: 0 4px 16px rgba(139, 26, 26, 0.3) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   FOOTER (.ft-)
   Dark premium feel
   ═══════════════════════════════════════════════════════════════════════════ */
.ft-footer {
  background: var(--ks-dark-surface) !important;
  font-family: var(--ks-font);
  border-top-color: var(--ks-border-dark);
}

/* Replace orange gradient strip with solid deep red */
.ft-footer::before {
  background: var(--ks-red) !important;
  background-size: 100% 100% !important;
  height: 2px !important;
}

.ft-biz-name {
  font-family: var(--ks-font);
  font-weight: 300;
  letter-spacing: 0.05em;
}

.ft-logo-link:hover {
  filter: drop-shadow(0 0 8px rgba(139, 26, 26, 0.15)) !important;
}

/* Footer nav */
.ft-nav-heading {
  font-family: var(--ks-font);
  font-weight: 400;
  letter-spacing: 3px;
}

.ft-nav-heading-link:hover {
  color: var(--ks-red-light) !important;
  text-shadow: none !important;
}
.ft-nav-heading-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

.ft-nav-link:hover {
  text-shadow: none !important;
}
.ft-nav-link::after {
  background: var(--ks-red) !important;
}
.ft-nav-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Hours table in footer */
.ft-hours-table tr[aria-current="date"] th,
.ft-hours-table tr[aria-current="date"] td {
  color: var(--ks-red-light) !important;
  text-shadow: none !important;
}

/* Footer custom HTML links */
.ft-custom-html a {
  color: var(--ks-red-light) !important;
  text-decoration-color: rgba(139, 26, 26, 0.25) !important;
}
.ft-custom-html a:hover {
  color: #c43030 !important;
  text-decoration-color: #c43030 !important;
}

/* Social links — subtle, no glow */
.ft-social-link:hover {
  background: rgba(139, 26, 26, 0.08) !important;
  border-color: rgba(139, 26, 26, 0.15) !important;
  color: var(--ks-red-light) !important;
  box-shadow: none !important;
  transform: translateY(-2px);
}
.ft-social-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Payment badge */
.ft-pay-badge:hover {
  background: rgba(139, 26, 26, 0.06) !important;
}

/* Legal links */
.ft-legal-link:hover { color: var(--ks-red-light) !important; }
.ft-legal-link:focus-visible { outline-color: var(--ks-red) !important; }


/* ═══════════════════════════════════════════════════════════════════════════
   PRICING PACKAGES (.pp-)
   ═══════════════════════════════════════════════════════════════════════════ */
.pp-section {
  background: var(--ks-dark-bg) !important;
  font-family: var(--ks-font);
}

/* Dot pattern — subtler */
.pp-section {
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.015) 1px, transparent 1px) !important;
}

.pp-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.pp-popular-badge {
  background: var(--ks-red) !important;
}

.pp-price {
  color: var(--ks-red-light) !important;
}

.pp-check {
  color: var(--ks-red-light) !important;
}

.pp-cta {
  background: var(--ks-red) !important;
  border-radius: 4px !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 500 !important;
  font-size: 13px !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CUSTOM HTML / HTML BLOCKS (.hb-)
   ═══════════════════════════════════════════════════════════════════════════ */
.html-block, .hb-content {
  font-family: var(--ks-font);
}

.html-block h1, .hb-content h1,
.html-block h2, .hb-content h2,
.html-block h3, .hb-content h3 {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 600;
  letter-spacing: 0.01em;
}

.html-block h2, .hb-content h2 {
  border-bottom-color: rgba(139, 26, 26, 0.08) !important;
}

.html-block a, .hb-content a {
  color: var(--ks-red) !important;
  background-image: linear-gradient(var(--ks-red), var(--ks-red-light)) !important;
}

.html-block a:focus-visible, .hb-content a:focus-visible {
  outline-color: var(--ks-red) !important;
}

.html-block li::marker, .hb-content li::marker {
  color: var(--ks-red) !important;
}

.html-block blockquote, .hb-content blockquote {
  border-color: rgba(139, 26, 26, 0.06) !important;
  box-shadow: 0 2px 12px rgba(139, 26, 26, 0.03) !important;
}

.html-block blockquote::before, .hb-content blockquote::before {
  background: linear-gradient(180deg, var(--ks-red), var(--ks-red-light)) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   GOOGLE REVIEWS (.gr- / .google-reviews-)
   ═══════════════════════════════════════════════════════════════════════════ */
.google-reviews-section {
  --review-star: #d4a017;
  --review-bg: var(--ks-offwhite);
  --review-border: rgba(0, 0, 0, 0.06);
  --review-text: var(--ks-text-dark);
  --review-muted: var(--ks-text-muted);
  font-family: var(--ks-font);
}

.reviews-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.review-card {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.05);
}
.review-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

.review-source a {
  color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   PAGE SECTIONS (.ps-)
   ═══════════════════════════════════════════════════════════════════════════ */
.ps-section {
  font-family: var(--ks-font);
  background-color: var(--ks-offwhite);
}

.ps-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.ps-divider-accent {
  background: var(--ks-red) !important;
}

.ps-card-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

.ps-card-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
}
.ps-card-link:hover .ps-card-title {
  color: var(--ks-red) !important;
}

.ps-card-read {
  color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   FAQs (.fa- / .fq-)
   ═══════════════════════════════════════════════════════════════════════════ */
.fq-section {
  font-family: var(--ks-font);
  background-color: var(--ks-offwhite);
  /* Subtler dot pattern */
  background-image: radial-gradient(circle, rgba(0, 0, 0, 0.02) 1px, transparent 1px) !important;
}

.fq-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.fq-accent {
  background: var(--ks-red) !important;
}

.fq-question:focus-visible {
  outline-color: var(--ks-red) !important;
}

.fq-num {
  color: var(--ks-red) !important;
}

.fq-num-circle {
  background: var(--ks-red) !important;
}

.fq-item[open] .fq-q-text {
  color: var(--ks-text-dark) !important;
}

.fq-item[open] .fq-chevron {
  color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   IMAGE SLIDESHOW (.ss-)
   ═══════════════════════════════════════════════════════════════════════════ */
.ss-section {
  --ss-primary: var(--ks-red) !important;
  font-family: var(--ks-font);
}

.ss-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.ss-divider-accent {
  background: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   VIDEO GALLERY (.vg-)
   ═══════════════════════════════════════════════════════════════════════════ */
.vg-section {
  font-family: var(--ks-font);
}

.vg-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.vg-progress-bar {
  background: var(--ks-red) !important;
}

.vg-progress-dot {
  background: var(--ks-red-light) !important;
  box-shadow: 0 0 8px rgba(139, 26, 26, 0.4) !important;
}

.vg-progress-track {
  background: linear-gradient(90deg, var(--ks-red), var(--ks-red-light), var(--ks-red)) !important;
}

.vg-thumb {
  color: var(--ks-text-dark) !important;
}
.vg-thumb:focus-visible {
  outline-color: var(--ks-red) !important;
}

.vg-thumb:hover {
  border-color: rgba(139, 26, 26, 0.15) !important;
  box-shadow: 0 4px 20px rgba(139, 26, 26, 0.08) !important;
}

.vg-thumb-active {
  border-color: var(--ks-red) !important;
  box-shadow: 0 0 0 3px rgba(139, 26, 26, 0.1), 0 4px 24px rgba(139, 26, 26, 0.1) !important;
}

.vg-thumb-active .vg-thumb-title {
  color: var(--ks-red) !important;
}

.vg-play-btn {
  background: var(--ks-red) !important;
  box-shadow: 0 2px 10px rgba(139, 26, 26, 0.25) !important;
}

/* Pulsing glow — red instead of orange */
@keyframes vg-glow-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(139, 26, 26, 0);
  }
  50% {
    background: rgba(139, 26, 26, 0.15);
    border-color: rgba(139, 26, 26, 0.4);
    box-shadow: 0 0 48px 12px rgba(139, 26, 26, 0.1);
  }
}


/* ═══════════════════════════════════════════════════════════════════════════
   BEFORE / AFTER (.ba-)
   ═══════════════════════════════════════════════════════════════════════════ */
.ba-section {
  font-family: var(--ks-font);
}

.ba-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.ba-divider-accent {
  background: var(--ks-red) !important;
}

.ba-slider-handle {
  background: var(--ks-red) !important;
  border-color: var(--ks-red) !important;
}

.ba-slider-line {
  background: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   FLOATING PHONE (.floating-phone) — keep green, just refine
   ═══════════════════════════════════════════════════════════════════════════ */
/* No color changes needed — phone uses green which is appropriate */


/* ═══════════════════════════════════════════════════════════════════════════
   BREADCRUMB (.breadcrumb-)
   ═══════════════════════════════════════════════════════════════════════════ */
.breadcrumb-section {
  font-family: var(--ks-font);
}

.breadcrumb-current {
  color: var(--ks-red) !important;
}

.breadcrumb-link:hover {
  color: var(--ks-red) !important;
}

.breadcrumb-link:focus-visible {
  outline-color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   FACTS (.ft- within facts context)
   ═══════════════════════════════════════════════════════════════════════════ */
.facts-section .ft-title,
section[aria-label*="fact"] .ft-title {
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
  color: var(--ks-text-dark) !important;
}

.facts-section .ft-accent,
section[aria-label*="fact"] .ft-accent {
  background: var(--ks-red) !important;
}

.ft-source-link {
  color: var(--ks-red) !important;
}
.ft-source-link:focus-visible {
  outline-color: var(--ks-red) !important;
}

/* Facts SVG icon fills */
.fact-card .fact-icon-bg {
  fill: var(--ks-red-light);
}


/* ═══════════════════════════════════════════════════════════════════════════
   HOW-TO STEPS (.ht-)
   ═══════════════════════════════════════════════════════════════════════════ */
.ht-section {
  font-family: var(--ks-font);
}

.ht-title {
  color: var(--ks-text-dark) !important;
  font-family: var(--ks-font);
  font-weight: 200;
  letter-spacing: 0.02em;
}

.ht-accent {
  background: var(--ks-red) !important;
}

.ht-meta strong {
  color: var(--ks-red) !important;
}

.ht-clock {
  color: var(--ks-red) !important;
}

.ht-num {
  background: var(--ks-red) !important;
  box-shadow: 0 4px 16px rgba(139, 26, 26, 0.25), 0 0 0 4px rgba(139, 26, 26, 0.06) !important;
}

.ht-connector::before {
  background: linear-gradient(180deg, rgba(139, 26, 26, 0.2), rgba(139, 26, 26, 0.02)) !important;
}

.ht-step-card {
  border-image: linear-gradient(180deg, var(--ks-red), rgba(139, 26, 26, 0.15)) 1 !important;
}

.ht-step-name {
  color: var(--ks-text-dark) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   PAYMENT METHODS (.pm-)
   ═══════════════════════════════════════════════════════════════════════════ */
.pm-section {
  font-family: var(--ks-font);
}

.pm-divider-accent {
  background: var(--ks-red) !important;
}

.pm-card:hover {
  border-color: rgba(139, 26, 26, 0.08) !important;
}

.pm-emoji {
  color: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   SOCIAL LINKS (.sl-)
   ═══════════════════════════════════════════════════════════════════════════ */
.sl-section {
  font-family: var(--ks-font);
}

.sl-divider-accent {
  background: var(--ks-red) !important;
}

.sl-card:hover .sl-icon-circle {
  background: var(--ks-red) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CHILD ARTICLES — article listing pages
   ═══════════════════════════════════════════════════════════════════════════ */
.child-articles {
  font-family: var(--ks-font);
}


/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL OVERRIDES — Catch-all for remaining orange references
   ═══════════════════════════════════════════════════════════════════════════ */

/* All focus-visible outlines across the site */
*:focus-visible {
  outline-color: var(--ks-red);
}

/* Any remaining gradient accents that use orange */
[class*="-accent"],
[class*="-divider-accent"] {
  background: var(--ks-red) !important;
}

/* Override any lingering linear-gradient usage of orange in buttons */
button[class*="cta"],
a[class*="cta"],
button[class*="submit"],
a[class*="viewall"],
button[class*="viewall"] {
  font-family: var(--ks-font);
  letter-spacing: 0.06em;
}

/* Global section title refinements */
[class$="-title"] {
  font-family: var(--ks-font);
}

/* Light section backgrounds */
.la-section,
.tm-section,
.tg-section,
.ps-section,
.fq-section,
.hrs-section,
.tp-section,
.sa-section,
.pm-section,
.sl-section,
.ba-section,
.google-reviews-section {
  background-color: var(--ks-offwhite);
}

/* Dark section backgrounds */
.aw-section,
.pp-section,
.ct-section,
.cf-section {
  background-color: var(--ks-dark-bg);
}


/* ═══════════════════════════════════════════════════════════════════════════
   404 PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
.error-page {
  font-family: var(--ks-font);
  background: var(--ks-dark-bg);
}

.error-page a {
  color: var(--ks-red-light);
}


/* ═══════════════════════════════════════════════════════════════════════════
   PRINT STYLES — Maintain clean output
   ═══════════════════════════════════════════════════════════════════════════ */
@media print {
  .top-nav, .ft-footer, .floating-phone { display: none !important; }
  body { background: #fff; color: #000; font-family: var(--ks-font); }
}