/** Shopify CDN: Minification failed

Line 1042:0 Unexpected "}"

**/
/* ============================================================
   Studio 1 Beauty — OVERRIDES CSS v5.2
   Purpose: Theme overrides + UI hiding + brand corrections
   Date: December 2025
   
   BRAND ALIGNMENT v5.2:
   - Typography: Plus Jakarta Sans (headlines), Inter (body), Cormorant Garamond (accent)
   - Primary Accent: Studio Violet #4524DB
   - Text: Rich Black #1a1a1a
   - Background: Warm Cream #faf9f7
   - Breakpoints: 768px (tablet), 1024px (desktop), 1440px (large)
   - Border Radius: 4px, 8px, 12px, 16px (8px grid system)
   - NO gold/champagne/legacy colors per brand guidelines
   
   CRITICAL: Contains cart/search/account hiding code - DO NOT REMOVE
   ============================================================ */

/* ============================================================
   SECTION 1: CSS CUSTOM PROPERTIES — Brand-Aligned
   ============================================================ */

:root {
  /* Brand Colors — Studio Violet System */
  --s1b-accent: #4524DB;
  --s1b-accent-rgb: 69, 36, 219;
  --s1b-accent-dark: #3a1db8;
  --s1b-accent-hover: #3318c0;
  --s1b-accent-light: #6b4ce8;
  --s1b-accent-ultra-light: #f0ecfc;
  --s1b-accent-gradient: linear-gradient(135deg, #4524DB 0%, #6b4ce8 100%);
  --s1b-accent-glow: rgba(69, 36, 219, 0.4);
  
  /* Primary Neutrals — Brand Palette */
  --s1b-text: #1a1a1a;
  --s1b-text-secondary: #4a4a4a;
  --s1b-text-tertiary: #718096;
  --s1b-bg: #faf9f7;
  --s1b-bg-alt: #f5f4f2;
  --s1b-bg-card: #ffffff;
  --s1b-bg-elevated: #ffffff;
  --s1b-border: #e0e0e0;
  --s1b-border-light: #ececec;
  --s1b-border-hover: #d0d0d0;
  
  /* Functional Colors — Brand-Aligned */
  --s1b-success: #2d7d46;
  --s1b-success-light: #d4edda;
  --s1b-error: #c53030;
  --s1b-error-light: #f8d7da;
  --s1b-warning: #d97706;
  --s1b-warning-light: #fff3cd;
  --s1b-info: #2b6cb0;
  --s1b-info-light: #d1ecf1;
  
  /* Secondary Accents — Brand Palette */
  --s1b-terracotta: #d4a574;
  --s1b-terracotta-light: rgba(212, 165, 116, 0.1);
  --s1b-espresso: #3d2c29;
  
  /* Typography — Brand Fonts */
  --s1b-font-headline: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --s1b-font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --s1b-font-accent: 'Cormorant Garamond', Georgia, serif;
  
  /* Spacing — 8px Rhythm System */
  --s1-gutter: 16px;
  --s1-section-pad: 48px;
  --s1-section-pad-mobile: 32px;
  --s1-card-gap: 24px;
  
  /* Border Radius — 8px Grid System */
  --s1-radius-sm: 4px;
  --s1-radius: 8px;
  --s1-radius-lg: 12px;
  --s1-radius-xl: 16px;
  --s1-radius-full: 9999px;
  
  /* Shadows — Premium Depth System */
  --s1-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --s1-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);
  --s1-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
  --s1-shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.15);
  --s1-shadow-hover: 0 8px 25px rgba(0, 0, 0, 0.12);
  
  /* Transitions */
  --s1-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --s1-transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* Z-Index Scale */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 500;
  --z-fixed: 900;
  --z-modal: 1000;
}

/* Desktop overrides */
@media (min-width: 1024px) {
  :root {
    --s1-gutter: 24px;
    --s1-section-pad: 80px;
    --s1-card-gap: 32px;
  }
}

/* ============================================================
   SECTION 2: HIDE SEARCH, CART, ACCOUNT — OPTIMIZED WITH :is()
   CRITICAL: This section hides shopping functionality per business requirements
   DO NOT REMOVE - Required for current business phase
   ============================================================ */

/* Comprehensive header icon hiding using :is() for efficiency */
:is(header, .header, .site-header, .header-wrapper, .header__wrapper, .shopify-section-header, #shopify-section-header, [data-section-type="header"]) :is(
  /* Search Elements */
  .header__icon--search,
  .header__search,
  .search-modal,
  .search-modal-opener,
  .header-search,
  .site-header__search,
  [data-search],
  [href*="/search"],
  button[aria-label*="Search"],
  button[aria-label*="search"],
  .predictive-search,
  .search-form,
  .header__icon[href*="search"],
  .header__icon.header__icon--search,
  details-modal[data-modal="search"],
  
  /* Cart Elements */
  .header__icon--cart,
  .header__cart,
  .cart-icon,
  .cart-count,
  .cart-count-bubble,
  .cart-drawer,
  .cart-notification,
  .site-header__cart,
  [data-cart],
  [href="/cart"],
  [href*="/cart"],
  button[aria-label*="Cart"],
  button[aria-label*="cart"],
  .header__icon[href*="cart"],
  .header__icon.header__icon--cart,
  cart-notification,
  cart-drawer,
  .js-cart-count,
  .cart-link,
  
  /* Account Elements */
  .header__icon--account,
  .header__account,
  .account-icon,
  .customer-account,
  .site-header__account,
  [data-account],
  [href="/account"],
  [href*="/account"],
  button[aria-label*="Account"],
  button[aria-label*="account"],
  button[aria-label*="Log in"],
  .header__icon[href*="account"],
  .header__icon.header__icon--account,
  .customer-links,
  .login-link
) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  clip: rect(0, 0, 0, 0) !important;
}

/* Secondary selectors for maximum coverage */
.header-icons :is(.search, .cart, .account),
.header__icons :is(.search, .cart, .account),
.header-item--icons :is([class*="search"], [class*="cart"], [class*="account"]),
header [class*="icon"] :is([href*="search"], [href*="cart"], [href*="account"]),
.header__inline-menu ~ :is(.header__icon--search, .header__icon--cart, .header__icon--account) {
  display: none !important;
  visibility: hidden !important;
}

/* Expanse theme specific selectors */
.header-item--icons .header__icon:is(
  [href*="search"],
  [href*="cart"],
  [href*="account"],
  [aria-label*="Search"],
  [aria-label*="Cart"],
  [aria-label*="Account"]
) {
  display: none !important;
}

/* Hide any cart drawer or notification that might appear */
cart-drawer,
cart-notification,
.cart-drawer,
.cart-notification,
#cart-drawer,
#cart-notification,
[id*="cart-drawer"],
[id*="cart-notification"],
.mini-cart,
.minicart,
#mini-cart {
  display: none !important;
  visibility: hidden !important;
}

/* Hide search modal/predictive search */
.search-modal,
#search-modal,
.predictive-search,
predictive-search,
.search__results,
[id*="search-modal"],
[id*="predictive-search"] {
  display: none !important;
  visibility: hidden !important;
}

/* ============================================================
   SECTION 3: MOBILE DRAWER CLEANUP
   Hide cart/account in mobile menu drawer
   ============================================================ */

/* Mobile menu drawer - hide cart/account links */
:is(.menu-drawer, .mobile-nav, .drawer, .mobile-menu, [data-drawer], .header__drawer) :is(
  [href="/cart"],
  [href*="/cart"],
  [href="/account"],
  [href*="/account"],
  [href*="login"],
  .cart-link,
  .account-link,
  .customer-link,
  [class*="cart"],
  [class*="account"]
):not(.menu-drawer__menu):not(.mobile-nav__menu) {
  display: none !important;
  visibility: hidden !important;
}

/* Specifically target Expanse drawer items */
.menu-drawer__navigation :is(
  a[href="/cart"],
  a[href="/account"],
  a[href*="/account/login"],
  .menu-drawer__utility-links a[href*="cart"],
  .menu-drawer__utility-links a[href*="account"]
) {
  display: none !important;
}

/* Hide footer cart/account links in drawer */
.menu-drawer__footer :is(
  [href*="cart"],
  [href*="account"],
  .cart-icon,
  .account-icon
) {
  display: none !important;
}

/* ============================================================
   SECTION 4: TYPOGRAPHY — Brand Fonts
   ============================================================ */

/* Base typography */
html {
  font-size: clamp(16px, 0.9vw + 12px, 18px);
}

body {
  font-family: var(--s1b-font-body);
  color: var(--s1b-text);
  background: var(--s1b-bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--s1b-font-headline);
  color: var(--s1b-text);
  line-height: 1.2;
  margin: 0;
}

h1, .h1 {
  font-size: clamp(2rem, 5vw + 1rem, 3rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

h2, .h2 {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

h3, .h3 {
  font-size: clamp(1.25rem, 2vw + 0.5rem, 1.75rem);
  font-weight: 600;
  letter-spacing: -0.01em;
}

h4, .h4 {
  font-size: clamp(1.125rem, 1.5vw + 0.5rem, 1.375rem);
  font-weight: 600;
}

h5, .h5 {
  font-size: clamp(1rem, 1.2vw + 0.5rem, 1.125rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Body text */
p, li, span, div {
  font-family: var(--s1b-font-body);
}

/* Accent font for testimonials/quotes */
.testimonial__quote,
.quote,
blockquote,
.s1b-testimonial__quote {
  font-family: var(--s1b-font-accent);
  font-style: italic;
}

/* ============================================================
   SECTION 5: LINK STYLES — Brand Colors
   ============================================================ */

a {
  color: var(--s1b-accent);
  text-decoration: none;
  transition: color var(--s1-transition);
}

a:hover {
  color: var(--s1b-accent-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}

a:focus-visible {
  outline: 3px solid var(--s1b-accent);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ============================================================
   SECTION 6: BUTTONS — Brand-Aligned CTAs
   ============================================================ */

/* Primary buttons */
.button,
.btn,
button[type="submit"],
input[type="submit"],
.shopify-payment-button button,
.product-form__submit {
  font-family: var(--s1b-font-body);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--s1b-accent);
  color: #fff;
  border: 2px solid var(--s1b-accent);
  border-radius: var(--s1-radius-sm);
  padding: 16px 32px;
  min-height: 52px;
  cursor: pointer;
  transition: all var(--s1-transition);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.button:hover,
.btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: var(--s1b-accent-dark);
  border-color: var(--s1b-accent-dark);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--s1-shadow-hover);
}

/* Secondary/outline buttons */
.button--secondary,
.btn--secondary,
.button--outline {
  background: transparent;
  color: var(--s1b-accent);
  border: 2px solid var(--s1b-accent);
}

.button--secondary:hover,
.btn--secondary:hover,
.button--outline:hover {
  background: var(--s1b-accent);
  color: #fff;
}

/* ============================================================
   SECTION 7: FORM INPUTS — Brand Styling
   ============================================================ */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
textarea,
select {
  font-family: var(--s1b-font-body);
  font-size: 16px;
  color: var(--s1b-text);
  background: #fff;
  border: 2px solid var(--s1b-border);
  border-radius: var(--s1-radius);
  padding: 14px 16px;
  width: 100%;
  transition: border-color var(--s1-transition), box-shadow var(--s1-transition);
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--s1b-accent);
  box-shadow: 0 0 0 4px rgba(69, 36, 219, 0.1);
}

input::placeholder,
textarea::placeholder {
  color: var(--s1b-text-tertiary);
  opacity: 0.8;
}

label {
  font-family: var(--s1b-font-body);
  font-weight: 600;
  color: var(--s1b-text);
  font-size: 1rem;
  display: block;
  margin-bottom: 8px;
}

/* ============================================================
   SECTION 8: CARDS — Brand-Aligned Styling
   ============================================================ */

.card,
.card__inner,
.product-card,
.collection-card {
  background: var(--s1b-bg-card);
  border: 1px solid var(--s1b-border-light);
  border-radius: var(--s1-radius);
  transition: transform var(--s1-transition), box-shadow var(--s1-transition), border-color var(--s1-transition);
}

.card:hover,
.card__inner:hover,
.product-card:hover,
.collection-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--s1-shadow-lg);
  border-color: var(--s1b-accent-light);
}

/* ============================================================
   SECTION 9: NAVIGATION — Brand Styling
   ============================================================ */

.site-nav__link,
.header__menu-item,
.menu-drawer__menu-item {
  font-family: var(--s1b-font-body);
  font-weight: 500;
  color: var(--s1b-text);
  transition: color var(--s1-transition);
}

.site-nav__link:hover,
.header__menu-item:hover,
.menu-drawer__menu-item:hover {
  color: var(--s1b-accent);
}

/* Dropdown menus */
.site-nav__dropdown,
.header__submenu,
.mega-menu {
  background: var(--s1b-bg-card);
  border-radius: var(--s1-radius);
  box-shadow: var(--s1-shadow-lg);
  border: 1px solid var(--s1b-border-light);
}

/* ============================================================
   SECTION 10: FOOTER — Brand Styling
   ============================================================ */

.footer,
#shopify-section-footer,
.site-footer {
  font-family: var(--s1b-font-body);
}

.footer a,
.site-footer a {
  color: inherit;
  transition: color var(--s1-transition);
}

.footer a:hover,
.site-footer a:hover {
  color: var(--s1b-accent);
}

/* Social icons */
.footer__social a,
.social-icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(69, 36, 219, 0.08);
  color: var(--s1b-accent);
  transition: all var(--s1-transition);
}

.footer__social a:hover,
.social-icons a:hover {
  background: var(--s1b-accent);
  color: #fff;
  transform: translateY(-3px);
}

/* ============================================================
   SECTION 11: ANNOUNCEMENT BAR — Brand Styling
   ============================================================ */

.announcement-bar,
.announcement,
[data-section-type="announcement-bar"] {
  font-family: var(--s1b-font-body);
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ============================================================
   SECTION 12: HERO/SLIDESHOW — Brand Styling
   ============================================================ */

.slideshow__text,
.banner__text,
.hero__text {
  font-family: var(--s1b-font-headline);
}

.slideshow__heading,
.banner__heading,
.hero__heading {
  font-family: var(--s1b-font-headline);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.slideshow .button,
.banner .button,
.hero .button {
  font-family: var(--s1b-font-body);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--s1b-accent);
  color: #fff;
  border: 2px solid var(--s1b-accent);
  border-radius: var(--s1-radius-sm);
  min-height: 52px;
  padding: 16px 32px;
}

.slideshow .button:hover,
.banner .button:hover,
.hero .button:hover {
  background: var(--s1b-accent-dark);
  border-color: var(--s1b-accent-dark);
  transform: translateY(-3px);
  box-shadow: var(--s1-shadow-hover);
}

@media (min-width: 1024px) {
  .slideshow .button,
  .banner .button,
  .hero .button {
    min-height: 60px;
    padding: 20px 44px;
    font-size: 18px;
  }
}

/* ============================================================
   SECTION 13: PRODUCT PAGES — Brand Styling
   ============================================================ */

.product__title,
.product-single__title {
  font-family: var(--s1b-font-headline);
  font-weight: 700;
  color: var(--s1b-text);
}

.product__price,
.product-single__price,
.price {
  font-family: var(--s1b-font-headline);
  font-weight: 700;
  color: var(--s1b-text);
}

.product__vendor,
.product-single__vendor {
  font-family: var(--s1b-font-body);
  font-weight: 600;
  color: var(--s1b-accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}

/* ============================================================
   SECTION 14: COLLECTION PAGES — Brand Styling
   ============================================================ */

.collection__title,
.collection-hero__title {
  font-family: var(--s1b-font-headline);
  font-weight: 700;
  color: var(--s1b-text);
}

.collection__description {
  font-family: var(--s1b-font-body);
  color: var(--s1b-text-secondary);
}

/* Filters */
.collection-filters,
.facets {
  font-family: var(--s1b-font-body);
}

/* ============================================================
   SECTION 15: MOBILE STICKY CTA — Brand Styling
   ============================================================ */

.s1b-sticky-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.98);
  border-top: 1px solid var(--s1b-border-light);
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: var(--z-fixed);
  box-shadow: 0 -6px 16px rgba(0, 0, 0, 0.1);
}

@supports (backdrop-filter: blur(12px)) {
  .s1b-sticky-cta {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }
}

@media (min-width: 768px) {
  .s1b-sticky-cta {
    display: none;
  }
}

.s1b-sticky-cta__btn {
  font-family: var(--s1b-font-body);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--s1b-accent);
  color: #fff;
  border: 2px solid var(--s1b-accent);
  border-radius: var(--s1-radius-sm);
  padding: 14px 32px;
  min-height: 52px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all var(--s1-transition);
}

.s1b-sticky-cta__btn:hover {
  background: var(--s1b-accent-dark);
  border-color: var(--s1b-accent-dark);
  color: #fff;
}

/* ============================================================
   SECTION 16: ACCESSIBILITY ENHANCEMENTS
   ============================================================ */

/* Focus states */
:focus-visible {
  outline: 3px solid var(--s1b-accent);
  outline-offset: 3px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--s1b-accent);
  outline-offset: 3px;
}

/* Skip link */
.skip-to-content {
  position: absolute;
  top: -9999px;
  left: 0;
  background: var(--s1b-accent);
  color: #fff;
  padding: 14px 24px;
  z-index: var(--z-modal);
  font-family: var(--s1b-font-body);
  font-weight: 600;
}

.skip-to-content:focus {
  top: 0;
  position: fixed;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================
   SECTION 17: UTILITY CLASSES
   ============================================================ */

/* Text alignment */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

/* Container */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: var(--s1-gutter);
  padding-right: var(--s1-gutter);
}

/* Section padding */
.section-padding {
  padding-top: var(--s1-section-pad-mobile);
  padding-bottom: var(--s1-section-pad-mobile);
}

@media (min-width: 1024px) {
  .section-padding {
    padding-top: var(--s1-section-pad);
    padding-bottom: var(--s1-section-pad);
  }
}

/* Visually hidden */
.visually-hidden,
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ============================================================
   SECTION 18: PRINT STYLES
   ============================================================ */

@media print {
  .s1b-sticky-cta,
  .site-header,
  .site-footer,
  nav,
  .announcement-bar {
    display: none !important;
  }
  
  body {
    background: #fff;
    color: #000;
  }
}

/* ============================================================
   SECTION 19: THEME-SPECIFIC OVERRIDES — Expanse Theme
   ============================================================ */

/* Override Expanse button styles */
body[data-button_style] .button,
body[data-button_style='square'] .button,
body[data-button_style='rounded'] .button {
  border-radius: var(--s1-radius-sm) !important;
}

/* Header alignment fixes */
.header-wrapper {
  font-family: var(--s1b-font-body);
}

/* Mobile nav fixes */
.site-header__mobile-nav {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.site-header__mobile-nav .drawer__inner,
.site-header__mobile-nav .drawer__content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Menu drawer styling */
.menu-drawer {
  font-family: var(--s1b-font-body);
}

.menu-drawer a {
  color: var(--s1b-accent);
}

.menu-drawer a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
   SECTION 20: DARK MODE SUPPORT
   ============================================================ */

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    
    --s1b-text: #f5f5f5;
    --s1b-text-secondary: #c0c0c0;
    --s1b-text-tertiary: #a0a0a0;
    --s1b-bg: #0f0f0f;
    --s1b-bg-alt: #141414;
    --s1b-bg-card: #1a1a1a;
    --s1b-border: #2a2a2a;
    --s1b-border-light: #242424;
    
    --s1b-accent: #6b4ce8;
    --s1b-accent-dark: #8066ee;
    --s1b-accent-light: #9580f2;
    --s1b-accent-ultra-light: #2a2440;
  }
  
  body {
    background: var(--s1b-bg);
    color: var(--s1b-text);
  }
  
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  input[type="number"],
  input[type="search"],
  textarea,
  select {
    background: #1f1f1f;
    border-color: var(--s1b-border);
    color: var(--s1b-text);
  }
  
  .card,
  .card__inner,
  .product-card,
  .collection-card {
    background: var(--s1b-bg-card);
    border-color: var(--s1b-border);
  }
  
  .site-nav__dropdown,
  .header__submenu,
  .mega-menu {
    background: rgba(26, 26, 26, 0.98);
    border-color: var(--s1b-border);
  }
  
  .s1b-sticky-cta {
    background: rgba(26, 26, 26, 0.98);
    border-top-color: var(--s1b-border);
  }
}
  /* ============================================================
   SECTION 21: STYLISTS CTA BUTTON — Rich-Text Section
   Plus Jakarta Sans + Studio Violet Premium Button
   ============================================================ */

/* Override Expanse element-button CSS variables */
.rte a.element-button,
.rte.clearfix a.element-button,
.rich-text a.element-button,
a.element-button[href*="meet"],
a.element-button[href*="stylists"] {
  --element-button-radius: 9999px;
  --radius: 9999px;
  --element-button-color-primary: #4524DB;
  --color-primary: #4524DB;
  --color-background: #4524DB;
  --element-button-padding-block: 16px;
  --element-button-padding-inline: 32px;
  
  background: #4524DB !important;
  background-color: #4524DB !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
  border: 2px solid #4524DB !important;
  padding: 16px 32px !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  min-height: 56px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.07) !important;
  transition: all 250ms ease !important;
  text-decoration: none !important;
}

/* Inner text span */
.rte a.element-button span,
.rte.clearfix a.element-button span,
a.element-button[href*="meet"] span,
a.element-button[href*="stylists"] span {
  color: #ffffff !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  background: transparent !important;
}

/* Hover state */
.rte a.element-button:hover,
.rte.clearfix a.element-button:hover,
a.element-button[href*="meet"]:hover,
a.element-button[href*="stylists"]:hover {
  --color-background: #3b1ec4;
  --color-primary: #3b1ec4;
  
  background: #3b1ec4 !important;
  background-color: #3b1ec4 !important;
  color: #ffffff !important;
  border-color: #3b1ec4 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(69, 36, 219, 0.35) !important;
}

.rte a.element-button:hover span,
a.element-button[href*="meet"]:hover span,
a.element-button[href*="stylists"]:hover span {
  color: #ffffff !important;
}

/* Active state */
.rte a.element-button:active,
a.element-button[href*="meet"]:active,
a.element-button[href*="stylists"]:active {
  transform: translateY(0) !important;
  background: #2f18a3 !important;
}

/* Focus state */
.rte a.element-button:focus-visible,
a.element-button[href*="meet"]:focus-visible,
a.element-button[href*="stylists"]:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(69,36,219,0.5), 0 8px 25px rgba(69,36,219,0.35) !important;
}
}

/* ============================================================
   END OF OVERRIDES CSS v5.2 — BRAND ALIGNED
   ============================================================ */