/* ==========================================================================
   Velvet - locked dark jewel-tone luxury theme (loaded AFTER vanilla).
   Deep aubergine/plum page, brass-gold accent, dramatic Playfair Display
   headings over Inter. Opulent and boutique.
     page #1e1320   cards #2b1a30   bands #120a15   accent brass #c8a24b
   ========================================================================== */

.theme-velvet {
    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Inter', system-ui, -apple-system, sans-serif;

    --color-accent: #c8a24b;
    --color-accent-hover: #d8b665;

    --color-bg: #1e1320;
    --color-surface: #2b1a30;
    --color-surface-dark: #120a15;
    --color-border: #3d2a42;

    --color-text: #f2e9ec;
    --color-text-secondary: #b9a3b0;
    --color-text-muted: #d8c4a0;
    --color-text-on-dark: #ffffff;
    --color-text-on-dark-muted: #9a8794;

    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-lg: 8px;
}

body.theme-velvet { background: var(--color-bg); }

/* Dramatic high-contrast serif headings. */
.theme-velvet h1,
.theme-velvet h2,
.theme-velvet h3,
.theme-velvet h4 { font-weight: 600; letter-spacing: 0; }
.theme-velvet .c-hero__title { font-weight: 500; font-size: clamp(3rem, 6.5vw, 5rem); }
.theme-velvet .c-nav__link,
.theme-velvet .c-nav__mobile a { letter-spacing: 0.06em; text-transform: uppercase; font-weight: 500; font-size: 0.92rem; }

/* Buttons: brass fill, dark plum label (white fails on brass). */
.theme-velvet .btn-primary,
.theme-velvet .btn--primary { color: #1e1320; font-weight: 600; }
.theme-velvet .btn-primary:hover,
.theme-velvet .btn--primary:hover { background: var(--color-accent-hover); color: #1e1320; }
.theme-velvet .btn-secondary,
.theme-velvet .btn--secondary { color: var(--color-text); border-color: var(--color-border); }
.theme-velvet .btn-secondary:hover,
.theme-velvet .btn--secondary:hover { border-color: var(--color-accent); }

/* Nav: translucent plum, brass CTA. */
.theme-velvet .c-nav { background: rgba(30, 19, 32, 0.9); border-bottom: 1px solid var(--color-border); }
.theme-velvet .c-nav__logo,
.theme-velvet .c-nav__link { color: var(--color-text); }
.theme-velvet .c-nav__link:hover { opacity: 0.62; }
.theme-velvet .c-nav__link--button { background: var(--color-accent); color: #1e1320; }
.theme-velvet .c-nav__link--button:hover { background: var(--color-accent-hover); opacity: 1; }
.theme-velvet .c-nav__hamburger span { background: var(--color-text); }
.theme-velvet .c-nav__mobile { background: rgba(30, 19, 32, 0.98); }
.theme-velvet .c-nav__mobile a { border-bottom-color: var(--color-border); }

/* Eyebrows in brass. */
.theme-velvet .c-hero__label,
.theme-velvet .c-section-head__label,
.theme-velvet .c-services__label,
.theme-velvet .c-label { color: var(--color-accent); letter-spacing: 0.16em; }
.theme-velvet .c-hero--image .c-hero__label { color: rgba(255, 255, 255, 0.9); }

/* Cards lifted off the plum page. */
.theme-velvet .c-service-card,
.theme-velvet .c-pricing-index__card,
.theme-velvet .oh-dept { background: var(--color-surface); }
.theme-velvet .c-service-card__image { background: var(--color-bg); }
.theme-velvet .c-service-card:hover { border-color: var(--color-accent); box-shadow: 0 16px 44px rgba(0, 0, 0, 0.5); }
.theme-velvet .c-pricing-index__card:hover { border-color: var(--color-accent); }
.theme-velvet .c-services,
.theme-velvet .c-tabs,
.theme-velvet .c-cta { background: var(--color-bg); }

/* Dark bands. */
.theme-velvet .c-footer,
.theme-velvet .c-stats,
.theme-velvet .c-quote-cta { background-color: var(--color-surface-dark); border-top: 1px solid var(--color-border); }

/* Prose links in brass. */
.theme-velvet .c-prose a { color: var(--color-accent); border-bottom-color: var(--color-accent); }

/* Forms: dark fields, brass focus ring. */
.theme-velvet .field input,
.theme-velvet .field select,
.theme-velvet .field textarea,
.theme-velvet .bk-search input { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.theme-velvet .field input::placeholder,
.theme-velvet .field textarea::placeholder { color: var(--color-text-secondary); }
.theme-velvet .field input:focus,
.theme-velvet .field select:focus,
.theme-velvet .field textarea:focus,
.theme-velvet .bk-search input:focus { border-color: var(--color-accent); box-shadow: 0 0 0 3px rgba(200, 162, 75, 0.22); }

/* Selected states: brass fill, plum mark. */
.theme-velvet .slot-btn { background: var(--color-surface); color: var(--color-text); }
.theme-velvet .slot-btn:hover { border-color: var(--color-accent); }
.theme-velvet .slot-btn.is-selected { background: var(--color-accent); color: #1e1320; border-color: var(--color-accent); }
.theme-velvet .bk-card,
.theme-velvet .bk-upsell { background: var(--color-surface); }
.theme-velvet .bk-cat summary:hover { background: var(--color-surface); }
.theme-velvet .bk-card.is-selected .bk-card__check,
.theme-velvet .bk-card--option:has(input:checked) .bk-card__check,
.theme-velvet .bk-upsell:has(input:checked) .bk-upsell__check { color: #1e1320; }
.theme-velvet .bk-cart__toggle { color: #1e1320; }
.theme-velvet .bk-cart__count { background: var(--color-surface-dark); color: var(--color-accent); }

/* Quote-CTA button on the dark band: brass fill, plum label. */
.theme-velvet .c-quote-cta .btn-primary,
.theme-velvet .c-quote-cta .btn--primary { background: var(--color-accent); color: #1e1320; }
.theme-velvet .c-quote-cta .btn-primary:hover,
.theme-velvet .c-quote-cta .btn--primary:hover { background: var(--color-accent-hover); }

/* ===== HERO: brass "banner" - plum text, plum button ===== */
.theme-velvet .c-hero--banner { background: var(--color-accent); color: #1e1320; }
.theme-velvet .c-hero--banner .c-hero__title,
.theme-velvet .c-hero--banner .c-hero__desc { color: #1e1320; }
.theme-velvet .c-hero--banner .c-hero__label { color: rgba(30, 19, 32, 0.7); }
.theme-velvet .c-hero--banner .btn-primary,
.theme-velvet .c-hero--banner .btn--primary { background: #1e1320; color: var(--color-accent); }
.theme-velvet .c-hero--banner .btn-primary:hover,
.theme-velvet .c-hero--banner .btn--primary:hover { background: #120a15; }