/*
 * ============================================================
 * SOULMATE MUSIC & ART — Master Theme
 * Design: Inspired by elitepiano.org
 * Aesthetic: Pure Luxury Minimalism
 * Palette: Deep Black · Warm Ivory · Dusty Rose Gold
 * Fonts: Playfair Display + Futura/Nunito Light
 * ============================================================
 */

/* ── GOOGLE FONTS — removed, using site-wide font from Settings ── */

/* ── GLOBAL OVERFLOW FIX ── */
html, body { overflow-x: hidden !important; max-width: 100vw; }

/* ── DESIGN TOKENS ── */
:root {
  /* Core palette — inspired by elitepiano.org */
  --sm-black:       #050505;
  --sm-black2:      #0f0f0f;
  --sm-black3:      #1a1a1a;
  --sm-charcoal:    #2c2c2c;
  --sm-white:       #ffffff;
  --sm-ivory:       #faf8f5;
  --sm-ivory2:      #f4f0ea;
  --sm-ivory3:      #e8e1d6;
  --sm-ivory4:      #d4c9b8;

  /* Accent — gold from logo */
  --sm-accent:      #c9962a;
  --sm-accent2:     #c9962a;
  --sm-accent3:     #e8b84b;
  --sm-accent-pale: rgba(201,150,42,0.1);

  /* Text */
  --sm-text:        #0f0f0f;
  --sm-text2:       #3a3a3a;
  --sm-text3:       #1a1a1a;
  --sm-text4:       #333333;

  /* Layout */
  --sm-radius:      1px;
  --sm-radius2:     3px;

  /* Fonts — inherits from var(--font-family) set in header.php via Settings */

  /* Transitions */
  --sm-ease: 0.4s cubic-bezier(0.25, 0, 0, 1);
}

/* ════════════════════════════════════════
   BASE
════════════════════════════════════════ */
html { scroll-behavior: smooth; }

body {

  background: var(--sm-ivory) !important;
  color: var(--sm-text) !important;
  font-weight: 300 !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

h1, h2, h3, h4, h5 {

  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
}

p, li, span, td {

  font-weight: 300 !important;
}

/* Selection */
::selection { background: rgba(138,108,92,0.2); color: var(--sm-text); }

/* Scrollbar */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: var(--sm-ivory2); }
::-webkit-scrollbar-thumb { background: var(--sm-accent); border-radius: 2px; }

/* Focus */
:focus-visible { outline: 1.5px solid var(--sm-accent) !important; outline-offset: 3px !important; }

/* ════════════════════════════════════════
   HEADER / NAV — Clean White Minimalist
════════════════════════════════════════ */

.site-header, header.site-header {
  background: #fff !important;
  border-bottom: 1px solid rgba(0,0,0,.06) !important;
  box-shadow: none !important;
}

/* Top line — thin gold accent */
.site-header::before {
  content: '' !important;
  position: absolute !important;
  top: 0; left: 0; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, #c9962a 30%, #c4a88e 50%, #c9962a 70%, transparent) !important;
  pointer-events: none !important;
  display: block !important;
}

/* Announcement / sitewide bar */
.sitewide-bar, .announcement-bar {
  background: #0c0c0c !important;
  color: rgba(255,255,255,0.7) !important;
  border-bottom: none !important;
  font-size: 11px !important;

  font-weight: 300 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
}
.sitewide-bar a, .announcement-bar a {
  color: var(--sm-accent3) !important;
}

/* Logo */
.site-logo, .header-logo, .logo-text {

  color: #1a1a1a !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  font-size: 1.25rem !important;
}
.logo-accent { color: #c9962a !important; }

/* Nav links — dark on white */
.nav-item > a, .main-nav a, .header-nav a,
.desktop-nav-link {
  color: #1a1a1a !important;

  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  transition: color var(--sm-ease) !important;
  position: relative !important;
  text-decoration: none !important;
}
.nav-item > a:hover, .main-nav a:hover,
.header-nav a:hover, .desktop-nav-link:hover,
.nav-item.active > a {
  color: #c9962a !important;
}
/* Underline effect */
.nav-item > a::after {
  content: '' !important;
  position: absolute !important;
  bottom: -3px; left: 0; right: 100% !important;
  height: 1.5px !important;
  background: #c9962a !important;
  transition: right var(--sm-ease) !important;
}
.nav-item > a:hover::after,
.nav-item.active > a::after { right: 0 !important; }

/* Dropdown — white clean */
.nav-dropdown, .dropdown-menu {
  background: #fff !important;
  border: none !important;
  border-top: 2px solid #c9962a !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.1) !important;
  border-radius: 0 !important;
}
.nav-dropdown a, .dropdown-menu a, .dropdown-item {
  color: #555 !important;

  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  padding: 12px 20px !important;
  transition: all 0.2s !important;
}
.nav-dropdown a:hover, .dropdown-menu a:hover, .dropdown-item:hover {
  color: #1a1a1a !important;
  background: #f8f6f1 !important;
}

/* Header icons — dark */
.header-icon, .header-actions a, .cart-icon {
  color: #1a1a1a !important;
  transition: color var(--sm-ease) !important;
}
.header-icon:hover, .header-actions a:hover, .cart-icon:hover {
  color: #c9962a !important;
}
.cart-count, .badge-count {
  background: var(--sm-accent) !important;
  color: var(--sm-white) !important;
  font-size: 9px !important;

  font-weight: 500 !important;
}

/* Hamburger */
.hamburger span, .mobile-menu-btn span { background: #1a1a1a !important; }

/* Mobile menu — clean white */
.mobile-menu, .mobile-nav, .menu-panel {
  background: #fff !important;
  border-right: 1px solid rgba(0,0,0,.06) !important;
}
.mobile-menu a, .mobile-nav a, .menu-link, .menu-simple-item a {
  color: #1a1a1a !important;

  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(0,0,0,.04) !important;
  padding: 16px 24px !important;
  transition: all 0.2s !important;
}
.mobile-menu a:hover, .mobile-nav a:hover, .menu-link:hover {
  color: #c9962a !important;
  background: #f8f6f1 !important;
}
.menu-title, .menu-header {

  color: #1a1a1a !important;
  font-size: 12px !important;
  letter-spacing: 0.14em !important;
  font-weight: 400 !important;
}
.menu-close { color: #999 !important; }
.menu-close:hover { color: #1a1a1a !important; }

/* ════════════════════════════════════════
   HERO BANNER — Full black like elitepiano.org
════════════════════════════════════════ */

.hp-hero {
  background: var(--sm-black) !important;
}
.hp-hero__gradient {
  background: var(--sm-black) !important;
}
.hp-hero__overlay {
  background: linear-gradient(
    to bottom,
    rgba(5,5,5,0.4) 0%,
    rgba(5,5,5,0.05) 30%,
    rgba(5,5,5,0.6) 100%
  ) !important;
}

/* Hero typography — Playfair like elitepiano.org */
.hp-hero__sub {

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent3) !important;
  opacity: 0.9 !important;
}
.hp-hero__title {

  font-size: clamp(3rem, 8vw, 6rem) !important;
  font-weight: 400 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.08 !important;
  color: var(--sm-white) !important;
  font-style: italic !important;
}
.hp-hero__desc {

  font-size: clamp(13px, 1.3vw, 16px) !important;
  font-weight: 200 !important;
  letter-spacing: 0.07em !important;
  line-height: 1.9 !important;
  color: rgba(255,255,255,0.75) !important;
  text-transform: uppercase !important;
  max-width: 500px !important;
}

/* Hero buttons — elitepiano.org style: solid white or outlined */
.hp-hero__btns { gap: 1.5rem !important; }
.hp-hero__btn {

  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 16px 48px !important;
  transition: all var(--sm-ease) !important;
}
.hp-hero__btn--primary {
  background: var(--sm-white) !important;
  color: var(--sm-black) !important;
  border: none !important;
}
.hp-hero__btn--primary:hover {
  background: var(--sm-accent2) !important;
  color: var(--sm-white) !important;
}
.hp-hero__btn--ghost {
  background: transparent !important;
  color: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(255,255,255,0.75) !important;
}
.hp-hero__btn--ghost:hover {
  border-color: rgba(255,255,255,0.8) !important;
  color: var(--sm-white) !important;
  background: rgba(255,255,255,0.05) !important;
}

/* Scroll indicator */
.hp-hero__scroll span {

  font-size: 9px !important;
  letter-spacing: 0.16em !important;
  color: rgba(255,255,255,0.75) !important;
}
.hp-hero__scroll-line {
  background: linear-gradient(to bottom, rgba(255,255,255,0.25), transparent) !important;
}

/* ════════════════════════════════════════
   TRUST BAR
════════════════════════════════════════ */
.hp-trust {
  background: var(--sm-black2) !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
  padding: 20px 0 !important;
}
.hp-trust__icon { color: var(--sm-accent2) !important; width: 16px !important; height: 16px !important; }
.hp-trust__item span {

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.72) !important;
}

/* ════════════════════════════════════════
   HOME SECTIONS — Clean ivory like elitepiano.org's white sections
════════════════════════════════════════ */

.hp-section { background: var(--sm-white) !important; padding: 96px 0 !important; }
.hp-section.alt { background: var(--sm-ivory) !important; }

/* Section labels — Futura-style uppercase */
.hp-section__label {

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent) !important;
  margin-bottom: 8px !important;
}
.hp-section__title {

  font-size: clamp(1.6rem, 2.8vw, 2.5rem) !important;
  font-weight: 400 !important;
  color: var(--sm-black) !important;
  letter-spacing: 0.02em !important;
  line-height: 1.2 !important;
}
.hp-section__head {
  border-bottom: 1px solid var(--sm-ivory3) !important;
}
.hp-section__desc {

  font-size: 13px !important;
  font-weight: 300 !important;
  color: var(--sm-text3) !important;
  letter-spacing: 0.03em !important;
  line-height: 1.9 !important;
}
.hp-section__more {

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
  text-decoration: none !important;
  transition: all var(--sm-ease) !important;
}
.hp-section__more:hover {
  color: var(--sm-black) !important;
  letter-spacing: 0.14em !important;
}

/* WHY US — full black section */
.hp-why {
  background: var(--sm-black) !important;
  padding: 96px 0 !important;
  position: relative !important;
}
.hp-why__icon {
  width: 52px !important; height: 52px !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: var(--sm-accent2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 24px !important;
}
.hp-why__item h3 {

  color: var(--sm-white) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  letter-spacing: 0.06em !important;
}
.hp-why__item p {

  color: rgba(255,255,255,0.82) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.9 !important;
}
/* Why section title */
.hp-section__label[style*="color:#ad9861"],
.hp-why .hp-section__label { color: var(--sm-accent3) !important; }
.hp-why .hp-section__title { color: var(--sm-white) !important; font-style: italic !important; }

/* Brands */
.hp-brands { background: var(--sm-ivory) !important; }
.hp-brands__item img {
  filter: grayscale(100%) opacity(0.35) !important;
  transition: filter var(--sm-ease) !important;
}
.hp-brands__item:hover img { filter: grayscale(0%) opacity(1) !important; }
.hp-brands__item span {

  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
}

/* Blog */
.hp-blog__cat {

  font-size: 9px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent2) !important;
  font-weight: 400 !important;
}
.hp-blog__featured-content h3, .hp-blog__meta h3 {

  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
}
.hp-blog__item:hover .hp-blog__meta h3 { color: var(--sm-accent) !important; }
.hp-blog__date {

  font-size: 10px !important;
  letter-spacing: 0.09em !important;
  color: var(--sm-text4) !important;
}

/* Reviews */
.hp-reviews { background: var(--sm-ivory) !important; }
.hp-review-card {
  background: var(--sm-white) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.hp-review-card:hover {
  border: none !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.06) !important;
}
.hp-review-card__text {

  font-style: italic !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--sm-charcoal) !important;
  line-height: 1.9 !important;
  letter-spacing: 0.01em !important;
}
.hp-review-card__stars svg { fill: var(--sm-accent) !important; stroke: var(--sm-accent) !important; }
.hp-review-card__avatar {
  background: var(--sm-black) !important;
  color: rgba(255,255,255,0.8) !important;

}
.hp-review-card__author strong {

  font-size: 13px !important;
  font-weight: 500 !important;
}
.hp-review-card__author span {

  font-size: 10px !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  color: var(--sm-text4) !important;
}

/* CTA section — full black */
.hp-cta { background: var(--sm-black) !important; }
.hp-cta__inner h2 {

  font-weight: 400 !important;
  font-style: italic !important;
  font-size: clamp(1.8rem, 3.5vw, 3rem) !important;
  color: var(--sm-white) !important;
  letter-spacing: 0.02em !important;
}
.hp-cta__inner p {

  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.75) !important;
  font-weight: 300 !important;
}

/* SEO section */
.hp-seo { background: var(--sm-white) !important; }
.hp-seo__text h3, .hp-seo__full h3 {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
}
.hp-seo__text p, .hp-seo__full p {

  font-weight: 300 !important;
  color: var(--sm-text3) !important;
  letter-spacing: 0.02em !important;
}
.hp-seo__toggle {

  font-size: 9px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 12px 40px !important;
  transition: all var(--sm-ease) !important;
}
.hp-seo__toggle:hover {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border-color: var(--sm-black) !important;
}

/* ════════════════════════════════════════
   PRODUCT CARDS — Very clean minimal
════════════════════════════════════════ */

.bo-card {
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: all var(--sm-ease) !important;
}
.bo-card:hover { transform: none !important; box-shadow: none !important; }
/* Hover on image only */
.bo-card:hover .bo-card__media { box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important; }
.bo-card__media { border-radius: 0 !important; overflow: hidden !important; }

.bo-card__name {

  color: var(--sm-black) !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  letter-spacing: 0.01em !important;
}
.bo-card__subtitle {

  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--sm-text4) !important;
  font-weight: 400 !important;
}
.bo-card__price {

  color: var(--sm-black) !important;
  font-weight: 500 !important;
  font-size: 16px !important;
}
.bo-card__price--contact {

  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
}
.bo-card__price-original {
  color: var(--sm-text4) !important;
  text-decoration: line-through !important;
}
.bo-card__sale {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;

  font-size: 9px !important;
  font-weight: 400 !important;
  letter-spacing: 0.09em !important;
  border-radius: 0 !important;
}
.bo-card__btn, .bo-card__wish {
  border-radius: 0 !important;
  border-color: var(--sm-ivory3) !important;
  color: var(--sm-text3) !important;

  font-size: 10px !important;
  letter-spacing: 0.09em !important;
}
.bo-card__btn:hover {
  background: var(--sm-black) !important;
  border-color: var(--sm-black) !important;
  color: var(--sm-white) !important;
}
.bo-card__wish:hover { color: var(--sm-accent) !important; }

/* Carousel buttons */
.hp-carousel__btn {
  border-radius: 0 !important;
  background: var(--sm-white) !important;
  border: 1px solid var(--sm-ivory3) !important;
  box-shadow: none !important;
}
.hp-carousel__btn:hover {
  background: var(--sm-black) !important;
  border-color: var(--sm-black) !important;
}

/* ════════════════════════════════════════
   BLOG CARDS
════════════════════════════════════════ */
.blog-card, .post-card {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.blog-card:hover, .post-card:hover {
  transform: none !important;
  box-shadow: none !important;
}
.blog-card__title, .post-card__title, .blog-card h2, .blog-card h3 {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
  letter-spacing: 0.01em !important;
}
.blog-card:hover h2, .blog-card:hover h3, .post-card:hover .post-card__title {
  color: var(--sm-accent) !important;
}
.blog-card__cat, .post-card__cat, .tag {
  background: transparent !important;
  color: var(--sm-accent2) !important;
  border: none !important;

  font-size: 9px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.blog-card__date, .post-card__date {

  font-size: 10px !important;
  letter-spacing: 0.09em !important;
  color: var(--sm-text4) !important;
}
.blog-hero, .blog-header { background: var(--sm-black) !important; }
.blog-hero h1, .blog-header h1 {

  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--sm-white) !important;
}

/* ════════════════════════════════════════
   PRODUCT LISTING / FILTERS
════════════════════════════════════════ */
.product-filter, .filter-sidebar {
  background: var(--sm-white) !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
}
.filter-title {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
  font-size: 15px !important;
  border-bottom-color: var(--sm-ivory3) !important;
}
.filter-checkbox:checked, input[type="checkbox"]:checked { accent-color: var(--sm-black) !important; }
.filter-tag.active, .filter-tag:hover {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border-color: var(--sm-black) !important;
  border-radius: 0 !important;
}

/* Page headings */
.page-hero, .category-hero, .brand-hero {
  background: var(--sm-black) !important;
}
.page-hero h1, .category-hero h1, .brand-hero h1 {

  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--sm-white) !important;
}
.page-hero p, .category-hero p { color: rgba(255,255,255,0.7) !important; }

/* Breadcrumb */
.breadcrumb, .breadcrumbs {
  background: var(--sm-ivory) !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
}
.breadcrumb a, .breadcrumbs a {
  color: var(--sm-text3) !important;

  font-size: 11px !important;
  letter-spacing: 0.06em !important;
}
.breadcrumb a:hover, .breadcrumbs a:hover { color: var(--sm-black) !important; }
.breadcrumb span, .breadcrumbs span { color: var(--sm-text4) !important; }

/* Pagination */
.pagination a, .page-link {
  border: 1px solid var(--sm-ivory3) !important;
  color: var(--sm-text3) !important;
  border-radius: 0 !important;

  font-size: 11px !important;
  letter-spacing: 0.06em !important;
}
.pagination a:hover, .page-link:hover {
  background: var(--sm-black) !important;
  border-color: var(--sm-black) !important;
  color: var(--sm-white) !important;
}
.pagination a.active, .page-link.active {
  background: var(--sm-black) !important;
  border-color: var(--sm-black) !important;
  color: var(--sm-white) !important;
}

/* ════════════════════════════════════════
   PRODUCT DETAIL
════════════════════════════════════════ */
.product-title, .single-product h1 {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
  font-style: italic !important;
}
.product-price, .price-main {

  color: var(--sm-black) !important;
  font-weight: 500 !important;
}
.product-brand {

  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--sm-text4) !important;
}
.btn-addcart, .btn-cart, .add-to-cart {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border: none !important;
  border-radius: 0 !important;

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  transition: all var(--sm-ease) !important;
}
.btn-addcart:hover, .btn-cart:hover, .add-to-cart:hover {
  background: var(--sm-charcoal) !important;
  transform: none !important;
}
.btn-contact, .btn-enquire {
  background: transparent !important;
  color: var(--sm-black) !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;

  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.btn-contact:hover, .btn-enquire:hover {
  border-color: var(--sm-black) !important;
  background: transparent !important;
}
.product-tab.active, .product-tab:hover,
.tab-btn.active, .tab-btn:hover {
  color: var(--sm-black) !important;
  border-bottom-color: var(--sm-black) !important;
}
.stars svg, .star-filled { fill: var(--sm-accent) !important; color: var(--sm-accent) !important; }

/* ════════════════════════════════════════
   BUTTONS (Global)
════════════════════════════════════════ */
.btn-primary, .btn.primary, button.primary {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border: none !important;
  border-radius: 0 !important;

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  transition: all var(--sm-ease) !important;
  padding: 14px 40px !important;
}
.btn-primary:hover { background: var(--sm-charcoal) !important; color: var(--sm-white) !important; }
.btn-secondary, .btn.secondary {
  background: transparent !important;
  color: var(--sm-black) !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;

  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.btn-secondary:hover { border-color: var(--sm-black) !important; }
.btn-outline {
  background: transparent !important;
  border: 1px solid var(--sm-black) !important;
  color: var(--sm-black) !important;
  border-radius: 0 !important;

  font-size: 10px !important;
  letter-spacing: 0.14em !important;
}
.btn-outline:hover { background: var(--sm-black) !important; color: var(--sm-white) !important; }

/* ════════════════════════════════════════
   FORMS
════════════════════════════════════════ */
input[type="text"], input[type="email"], input[type="tel"],
input[type="search"], input[type="password"], input[type="number"],
select, textarea {
  border: 1px solid var(--sm-ivory3) !important;
  background: var(--sm-white) !important;
  color: var(--sm-text) !important;
  border-radius: 0 !important;

  font-size: 13px !important;
  font-weight: 300 !important;
  letter-spacing: 0.03em !important;
  transition: border-color 0.25s !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--sm-black) !important;
  box-shadow: none !important;
  outline: none !important;
}
.search-btn, .search-submit {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border: none !important;
  border-radius: 0 !important;
}

/* ════════════════════════════════════════
   CART / CHECKOUT
════════════════════════════════════════ */
.cart-table th, .checkout-section-title {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
}
.cart-total-label {

  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
}
.cart-total-value {

  color: var(--sm-black) !important;
  font-weight: 500 !important;
}
.checkout-btn, .place-order-btn {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border: none !important;
  border-radius: 0 !important;

  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-size: 10px !important;
}

/* ════════════════════════════════════════
   FOOTER — Full black like elitepiano.org
════════════════════════════════════════ */

footer, .site-footer {
  background: #f8f1e4 !important;
  color: #1a1a1a !important;
  border-top: none !important;
}
footer::before {
  content: '' !important;
  display: block !important;
  height: 3px !important;
  background: linear-gradient(90deg, transparent, rgba(201,150,42,0.3) 30%, rgba(201,150,42,0.7) 50%, rgba(201,150,42,0.3) 70%, transparent) !important;
}

.footer-title, .footer-heading, footer h3, footer h4 {

  color: #1a1a1a !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(0,0,0,0.12) !important;
}

footer a {
  color: rgba(0,0,0,0.7) !important;

  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  transition: color var(--sm-ease) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  margin-bottom: 10px !important;
}
footer a::before { display: none !important; }
footer a:hover { color: #c9962a !important; }

.footer-bottom {
  border-top: 1px solid rgba(0,0,0,0.12) !important;
  color: rgba(0,0,0,0.55) !important;

  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  font-weight: 400 !important;
}
.footer-bottom a { color: #1a1a1a !important; display: inline !important; }
.footer-bottom a:hover { color: #c9962a !important; }

/* Footer logo in footer */
footer .site-logo, footer .footer-logo-text {

  color: #ffffff !important;
  font-weight: 400 !important;
  font-size: 1.4rem !important;
  letter-spacing: 0.04em !important;
  display: block !important;
  margin-bottom: 4px !important;
}

/* Footer social */
.footer-social a {
  background: rgba(0,0,0,0.06) !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  width: 32px !important; height: 32px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  padding: 0 !important;
  margin: 0 8px 0 0 !important;
  color: #1a1a1a !important;
  transition: all var(--sm-ease) !important;
}
.footer-social a:hover {
  background: #c9962a !important;
  color: #ffffff !important;
  border-color: #c9962a !important;
}
.footer-social a::before { display: none !important; }

/* ════════════════════════════════════════
   SECTION STYLES OVERRIDE (page builder)
════════════════════════════════════════ */
/* Old navy blue → black */
[style*="color: #111941"], [style*="color:#111941"] { color: var(--sm-black) !important; }
[style*="background: #111941"], [style*="background:#111941"],
[style*="background-color: #111941"], [style*="background-color:#111941"] { background: var(--sm-black) !important; }
/* Old gold → new accent */
[style*="color: #ad9861"], [style*="color:#ad9861"] { color: var(--sm-accent2) !important; }
[style*="color: #8a7a4e"], [style*="color:#8a7a4e"] { color: var(--sm-accent) !important; }

/* ════════════════════════════════════════
   NOTIFICATIONS / ALERTS
════════════════════════════════════════ */
.toast-success, .alert-success, .flash-success {
  background: rgba(0,0,0,0.04) !important;
  border: 1px solid var(--sm-ivory3) !important;
  color: var(--sm-text) !important;
  border-radius: 0 !important;
}

/* ════════════════════════════════════════
   COURSES / TEACHERS pages
════════════════════════════════════════ */
.courses-hero::after, .teachers-hero::after {
  background: rgba(0,0,0,0.06) !important;
  height: 1px !important;
}
.courses-hero-badge, .teachers-hero-badge {
  background: transparent !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
  color: rgba(0,0,0,0.5) !important;
  letter-spacing: 0.14em !important;
  font-size: 9px !important;

  font-weight: 400 !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}
.courses-hero h1, .teachers-hero h1 {

  font-weight: 700 !important;
  color: #1a1a1a !important;
}
.courses-hero h1 span, .teachers-hero h1 span { color: #c9962a !important; }
.courses-hero p, .teachers-hero p { color: rgba(0,0,0,0.55) !important; }
.hero-stat-num {

  color: #1a1a1a !important;
  font-weight: 400 !important;
}

/* Teachers hero — has dark bg image, text must be white */
.teachers-hero-badge {
  border: 1px solid rgba(255,255,255,0.25) !important;
  color: rgba(255,255,255,0.7) !important;
}
.teachers-hero h1 {
  color: #ffffff !important;
}
.teachers-hero h1 span { color: #c9962a !important; }
.teachers-hero p { color: rgba(255,255,255,0.85) !important; }
.teachers-hero .hero-stat-num {
  color: #ffffff !important;
}
.teachers-hero .hero-stat-label {
  color: rgba(255,255,255,0.7) !important;
}

/* Courses hero — has dark bg image, text must be white */
.courses-hero-badge {
  border: 1px solid rgba(255,255,255,0.25) !important;
  color: rgba(255,255,255,0.7) !important;
}
.courses-hero h1 {
  color: #ffffff !important;
}
.courses-hero h1 span { color: #c9962a !important; }
.courses-hero p { color: rgba(255,255,255,0.85) !important; }
.courses-hero .hero-stat-num {
  color: #ffffff !important;
}
.courses-hero .hero-stat-label {
  color: rgba(255,255,255,0.7) !important;
}
.hero-stat-label {
  font-size: 18px !important;
  letter-spacing: 0.06em !important;
  color: rgba(255,255,255,0.85) !important;
  font-weight: 500 !important;
}

/* Teacher cards */
.teacher-card {
  border: none !important;
  border-radius: 0 !important;
  background: var(--sm-white) !important;
}
.teacher-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.1) !important;
  border: none !important;
}
.teacher-card::before { display: none !important; }
.tc-title-tag {

  font-size: 9px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent) !important;
  font-weight: 400 !important;
}
.tc-name {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
  font-size: 1.2rem !important;
}
.tc-headline {

  font-size: 12px !important;
  font-weight: 300 !important;
  color: var(--sm-text3) !important;
  letter-spacing: 0.03em !important;
}
.tc-spec-tag {
  background: transparent !important;
  color: var(--sm-text3) !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;

  font-size: 9px !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  padding: 3px 10px !important;
}
.tc-stars { color: var(--sm-accent) !important; }
.tc-rating-num { }
.tc-rating-count {

  font-size: 11px !important;
  color: var(--sm-text4) !important;
}
.tc-stat-pill {
  background: rgba(0,0,0,0.6) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.8) !important;
  border-radius: 0 !important;

  font-size: 9px !important;
  letter-spacing: 0.06em !important;
}
.tc-footer { border-top-color: var(--sm-ivory3) !important; }
.tc-courses-count {

  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  color: var(--sm-text4) !important;
}
.tc-cta {

  font-size: 9px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sm-black) !important;
}

/* Teachers section background */
.teachers-section { background: var(--sm-ivory) !important; }

/* Teachers - Mobile: 2 columns under 800px, stacked details */
@media (max-width: 800px) {
    .teachers-grid { gap: 10px !important; }
    .tc-stats-overlay { flex-direction: column !important; align-items: center !important; gap: 4px !important; }
    .tc-footer { flex-direction: column !important; align-items: center !important; gap: 6px !important; }
    .section-title-main { font-size: 1.5rem !important; white-space: nowrap !important; }
}
.section-label {
  font-size: 13px !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent) !important;
  font-weight: 700 !important;
}
.section-title-main {

  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--sm-black) !important;
}
.section-title-main span { color: var(--sm-accent) !important; }
.section-divider { background: var(--sm-accent) !important; height: 1px !important; }

/* Teachers CTA banner */
.teachers-cta-banner { background: #f8f1e4 !important; text-align: center !important; }
.teachers-cta-banner::before { background: none !important; }
.teachers-cta-banner h2 {

  font-weight: 700 !important;
  color: #1a1a1a !important;
}
.teachers-cta-banner p { color: rgba(0,0,0,0.55) !important; }
.btn-cta-gold {
  background: #c9962a !important;
  color: #ffffff !important;
  border-radius: 6px !important;

  font-size: 12px !important;
  letter-spacing: 0.07em !important;
  box-shadow: 0 4px 20px rgba(201,150,42,0.35) !important;
}
.btn-cta-gold:hover {
  background: #b8871f !important;
  color: #ffffff !important;
}
.btn-cta-outline {
  border: 2px solid rgba(0,0,0,0.2) !important;
  border-radius: 6px !important;

  font-size: 12px !important;
  letter-spacing: 0.07em !important;
  color: #1a1a1a !important;
}
.btn-cta-outline:hover {
  border-color: #c9962a !important;
  color: #c9962a !important;
}

/* ════════════════════════════════════════
   TEACHER PROFILE PAGE
════════════════════════════════════════ */

/* Breadcrumb on teacher profile */
.tp-breadcrumb {
  background: var(--sm-ivory) !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
}
.tp-breadcrumb a { color: var(--sm-text3) !important; }
.tp-breadcrumb a:hover { color: var(--sm-black) !important; }

/* Hero */
.tp-hero { background: var(--sm-black) !important; }
.tp-hero::after { background: rgba(255,255,255,0.04) !important; height: 1px !important; }
.tp-hero::before { background: none !important; }

.tp-hero-badge {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.5) !important;
  border-radius: 0 !important;

  font-size: 9px !important;
  letter-spacing: 0.14em !important;
}
.tp-hero-title {

  font-size: 9px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.75) !important;
  font-weight: 400 !important;
}
.tp-hero-name {

  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--sm-white) !important;
}
.tp-hero-headline {

  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  color: rgba(255,255,255,0.65) !important;
  font-style: normal !important;
}
/* rating removed from teacher cards */
.tp-spec-tag {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
  color: #fff !important;
  border-radius: 0 !important;

  font-size: 12px !important;
  letter-spacing: 0.07em !important;
}
.tp-btn-primary {
  background: var(--sm-white) !important;
  color: var(--sm-black) !important;
  border-radius: 0 !important;

  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}
.tp-btn-primary:hover {
  background: var(--sm-accent2) !important;
  color: var(--sm-white) !important;
}
.tp-btn-outline {
  border: 1px solid rgba(255,255,255,0.5) !important;
  color: #fff !important;
  border-radius: 0 !important;

  font-size: 12px !important;
  letter-spacing: 0.1em !important;
}
.tp-btn-outline:hover {
  border-color: rgba(255,255,255,0.6) !important;
  color: var(--sm-white) !important;
}

/* Avatar area */
.tp-avatar-img-wrap {
  border-radius: 0 !important;
  border: none !important;
  border-bottom: none !important;
}
.tp-avatar-img-wrap::before { display: none !important; }
.tp-avatar-img-wrap img { filter: none !important; }
.tp-avatar-stats {
  background: rgba(255,255,255,0.04) !important;
  border: none !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}
.tp-avatar-stat { border-right-color: rgba(255,255,255,0.06) !important; }
.tp-avatar-stat-num { color: var(--sm-white) !important; }
.tp-avatar-stat-label {

  font-size: 11px !important;
  letter-spacing: 0.09em !important;
  color: #fff !important;
}

/* Content area */
.tp-main { background: var(--sm-ivory) !important; }
.tp-section-title {

  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--sm-black) !important;
}
.tp-section-title::after { background: var(--sm-accent) !important; width: 24px !important; height: 1px !important; }
.tp-section-label {

  font-size: 9px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--sm-accent) !important;
  font-weight: 400 !important;
}

/* Bio short quote block */
.tp-bio-short {
  background: var(--sm-black) !important;
  border-left: 1px solid var(--sm-accent2) !important;
  border-radius: 0 !important;
}
.tp-bio-short p { color: rgba(255,255,255,0.6) !important; font-weight: 300 !important; }

/* Timeline */
.tp-timeline::before { background: var(--sm-ivory3) !important; }
.tp-timeline-item::before {
  background: var(--sm-black) !important;
  border-color: var(--sm-white) !important;
  box-shadow: none !important;
}
.tp-timeline-year { font-size: 9px !important; letter-spacing: 0.1em !important; color: var(--sm-accent) !important; }
.tp-timeline-title { font-weight: 400 !important; color: var(--sm-black) !important; }
.tp-timeline-sub { font-size: 12px !important; color: var(--sm-text3) !important; }

/* Cert cards */
.tp-cert-card {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--sm-white) !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
}
.tp-cert-card:hover { box-shadow: none !important; border-color: var(--sm-ivory3) !important; }
.tp-cert-icon {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  width: 36px !important; height: 36px !important;
  border-radius: 0 !important;
  font-size: 14px !important;
}
.tp-cert-name { font-weight: 400 !important; }
.tp-cert-issuer { font-size: 11px !important; font-weight: 300 !important; }
.tp-cert-year { font-size: 9px !important; letter-spacing: 0.1em !important; color: var(--sm-accent) !important; }

/* Teaching styles */
.tp-style-item {
  background: var(--sm-white) !important;
  border: none !important;
  border-left: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
}
.tp-style-icon {
  background: transparent !important;
  width: 28px !important; height: 28px !important;
  border-radius: 0 !important;
  color: var(--sm-accent) !important;
}
.tp-style-text { font-size: 13px !important; font-weight: 300 !important; }

/* Course item */
.tp-course-item {
  border: none !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.tp-course-item:hover {
  box-shadow: none !important;
  background: var(--sm-ivory) !important;
  border-color: var(--sm-ivory3) !important;
  padding-left: 24px !important;
}
.tp-course-name { font-weight: 400 !important; }
.tp-course-arrow { color: var(--sm-text4) !important; }

/* Sidebar */
.tp-sidebar-card {
  border: none !important;
  border-radius: 0 !important;
  background: var(--sm-white) !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
}
.tp-sidebar-card-header {
  background: var(--sm-black) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
.tp-sidebar-card-header h3 {

  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.7) !important;
}

/* Contact form in sidebar */
.tp-contact-form label {

  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sm-text3) !important;
  font-weight: 400 !important;
}
.tp-contact-form input,
.tp-contact-form select,
.tp-contact-form textarea {
  border: none !important;
  border-bottom: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
  background: transparent !important;

  font-size: 13px !important;
  font-weight: 300 !important;
  padding: 8px 0 !important;
}
.tp-contact-form input:focus,
.tp-contact-form select:focus,
.tp-contact-form textarea:focus {
  border-bottom-color: var(--sm-black) !important;
  box-shadow: none !important;
  background: transparent !important;
}
.tp-contact-submit {
  background: var(--sm-black) !important;
  color: var(--sm-white) !important;
  border-radius: 0 !important;

  font-size: 9px !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}
.tp-contact-submit:hover { background: var(--sm-charcoal) !important; transform: none !important; }

/* Quick info card */
.tp-qi-icon {
  background: transparent !important;
  border: 1px solid var(--sm-ivory3) !important;
  border-radius: 0 !important;
  color: var(--sm-accent) !important;
}
.tp-qi-label { font-size: 9px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; }
.tp-qi-value { font-weight: 400 !important; }
.tp-qi-item { border-bottom-color: var(--sm-ivory2) !important; }

/* Other teachers in sidebar */
.tp-other-teacher { border-bottom-color: var(--sm-ivory2) !important; }
.tp-other-teacher:hover { padding-left: 4px !important; }
.tp-other-avatar {
  border-radius: 0 !important;
  background: var(--sm-black) !important;
  border: none !important;

  color: rgba(255,255,255,0.5) !important;
}
.tp-other-name { font-weight: 400 !important; }
.tp-other-spec { font-size: 10px !important; letter-spacing: 0.06em !important; }

/* ════════════════════════════════════════
   COURSE PAGES (same styling)
════════════════════════════════════════ */
.course-card {
  border: none !important;
  border-radius: 0 !important;
  background: var(--sm-white) !important;
}
.course-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.1) !important;
}
.course-title {

  font-weight: 400 !important;
  color: var(--sm-black) !important;
}
.course-level, .course-badge {
  background: transparent !important;
  border: 1px solid var(--sm-ivory3) !important;
  color: var(--sm-text3) !important;
  border-radius: 0 !important;

  font-size: 9px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}
.course-price {

  color: var(--sm-black) !important;
  font-weight: 500 !important;
}
.course-enroll-btn, .btn-enroll {
  background: #c9962a !important;
  color: #ffffff !important;
  border-radius: 6px !important;

  font-size: 12px !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  border: none !important;
}
.course-enroll-btn:hover, .btn-enroll:hover { background: #b8871f !important; }

/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media (max-width: 768px) {
  .hp-hero__title { font-size: clamp(2.5rem, 10vw, 3.5rem) !important; }
  .hp-trust__inner { grid-template-columns: repeat(2, 1fr) !important; }
  .hp-why__grid { grid-template-columns: 1fr !important; }
}

/* ════════════════════════════════════════
   ACCOUNT / AUTH
════════════════════════════════════════ */
.account-sidebar .nav-item.active a, .account-nav .active {
  color: var(--sm-black) !important;
  background: var(--sm-ivory) !important;
  border-left-color: var(--sm-black) !important;
}

/* ════════════════════════════════════════
   ANIMATIONS
════════════════════════════════════════ */
@keyframes smFadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.bo-card { animation: smFadeUp 0.5s ease both; }
.bo-card:nth-child(1) { animation-delay: 0.05s; }
.bo-card:nth-child(2) { animation-delay: 0.10s; }
.bo-card:nth-child(3) { animation-delay: 0.15s; }
.bo-card:nth-child(4) { animation-delay: 0.20s; }

/* ════════════════════════════════════════
   HERO BACKGROUND IMAGE SUPPORT
════════════════════════════════════════ */
.section-hero-bg {
  position: relative;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
.section-hero-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(10,10,10,0.72) 0%, rgba(10,10,10,0.50) 100%);
  pointer-events: none;
  z-index: 0;
}
.section-hero-bg > * { position: relative; z-index: 1; }
.section-hero-bg.overlay-light::before { background: linear-gradient(135deg, rgba(10,10,10,0.45) 0%, rgba(10,10,10,0.25) 100%); }
.section-hero-bg.overlay-heavy::before { background: linear-gradient(135deg, rgba(10,10,10,0.85) 0%, rgba(10,10,10,0.65) 100%); }