/** Shopify CDN: Minification failed

Line 132:0 All "@import" rules must come first

**/
/* ============================================
   MJS Global Theme Settings
   Design System v2 — Approved by Jay
   ============================================
   
   Color Palette:
   - Primary Dark: #1A1A1A
   - Accent Gold: #C9A86A
   - Gold Light: #D4BA8A
   - Warm Blush: #F1E2DC
   - Background: #F9F9F9
   - White: #FFFFFF
   - Text: #2C2C2C
   - Text Light: #6B6B6B
   - Border: #E5E5E5
   
   Typography: Inter (Google Font)
   - Bold/Semi-Bold for headings
   - Regular for body
   
   Buttons: Pill style (24px radius)
   Aesthetic: Minimalist Luxury + Warm Premium + Bold Modern
   ============================================ */

/* === CSS CUSTOM PROPERTIES === */
:root {
  /* Brand Colors */
  --mjs-color-primary: #1A1A1A;
  --mjs-color-primary-rgb: 26, 26, 26;
  --mjs-color-accent: #C9A86A;
  --mjs-color-accent-rgb: 180, 143, 94;
  --mjs-color-accent-light: #D4BA8A;
  --mjs-color-accent-hover: #9A7A4E;
  --mjs-color-blush: #FFF8F8;
  --mjs-color-background: #F9F9F9;
  --mjs-color-surface: #FFFFFF;
  --mjs-color-text: #2C2C2C;
  --mjs-color-text-light: #6B6B6B;
  --mjs-color-text-muted: #999999;
  --mjs-color-border: #E5E5E5;
  --mjs-color-border-light: #F0ECE6;
  --mjs-color-success: #22C55E;
  --mjs-color-error: #EF4444;
  --mjs-color-warning: #F59E0B;

  /* Typography */
  --mjs-font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mjs-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mjs-font-mono: 'SF Mono', 'Fira Code', monospace;

  /* Font Sizes (fluid) */
  --mjs-text-xs: 11px;
  --mjs-text-sm: 13px;
  --mjs-text-base: 15px;
  --mjs-text-md: 16px;
  --mjs-text-lg: 18px;
  --mjs-text-xl: clamp(20px, 2.5vw, 24px);
  --mjs-text-2xl: clamp(24px, 3vw, 32px);
  --mjs-text-3xl: clamp(28px, 3.5vw, 40px);
  --mjs-text-4xl: clamp(32px, 4vw, 48px);
  --mjs-text-5xl: clamp(36px, 5vw, 56px);
  --mjs-text-hero: clamp(40px, 6vw, 72px);

  /* Font Weights */
  --mjs-weight-light: 300;
  --mjs-weight-regular: 400;
  --mjs-weight-medium: 500;
  --mjs-weight-semibold: 600;
  --mjs-weight-bold: 700;

  /* Line Heights */
  --mjs-leading-tight: 1.1;
  --mjs-leading-snug: 1.25;
  --mjs-leading-normal: 1.5;
  --mjs-leading-relaxed: 1.7;

  /* Letter Spacing */
  --mjs-tracking-tight: -0.02em;
  --mjs-tracking-normal: 0;
  --mjs-tracking-wide: 0.08em;
  --mjs-tracking-wider: 0.12em;
  --mjs-tracking-widest: 0.2em;

  /* Spacing Scale */
  --mjs-space-1: 4px;
  --mjs-space-2: 8px;
  --mjs-space-3: 12px;
  --mjs-space-4: 16px;
  --mjs-space-5: 20px;
  --mjs-space-6: 24px;
  --mjs-space-8: 32px;
  --mjs-space-10: 40px;
  --mjs-space-12: 48px;
  --mjs-space-16: 64px;
  --mjs-space-20: 80px;
  --mjs-space-section: clamp(48px, 8vw, 80px);

  /* Border Radius */
  --mjs-radius-sm: 4px;
  --mjs-radius-md: 8px;
  --mjs-radius-lg: 12px;
  --mjs-radius-xl: 16px;
  --mjs-radius-pill: 24px;
  --mjs-radius-full: 50%;

  /* Shadows */
  --mjs-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --mjs-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --mjs-shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
  --mjs-shadow-xl: 0 16px 48px rgba(0,0,0,0.12);
  --mjs-shadow-gold: 0 4px 20px rgba(180,143,94,0.15);

  /* Transitions */
  --mjs-transition-fast: 150ms ease;
  --mjs-transition-base: 300ms ease;
  --mjs-transition-slow: 500ms ease;

  /* Layout */
  --mjs-container-max: 1200px;
  --mjs-container-narrow: 800px;
  --mjs-container-wide: 1400px;
  --mjs-container-padding: 24px;
  --mjs-header-height: 72px;
}

/* === GOOGLE FONT IMPORT === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* === GLOBAL RESETS === */
.mjs-section * { box-sizing: border-box; }
.mjs-section img { max-width: 100%; height: auto; }

/* === TYPOGRAPHY UTILITIES === */
.mjs-heading-1 {
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-5xl);
  font-weight: var(--mjs-weight-bold);
  line-height: var(--mjs-leading-tight);
  letter-spacing: var(--mjs-tracking-tight);
  color: var(--mjs-color-primary);
}
.mjs-heading-2 {
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-3xl);
  font-weight: var(--mjs-weight-bold);
  line-height: var(--mjs-leading-tight);
  letter-spacing: var(--mjs-tracking-tight);
  color: var(--mjs-color-primary);
}
.mjs-heading-3 {
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-2xl);
  font-weight: var(--mjs-weight-semibold);
  line-height: var(--mjs-leading-snug);
  color: var(--mjs-color-primary);
}
.mjs-heading-4 {
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-xl);
  font-weight: var(--mjs-weight-semibold);
  line-height: var(--mjs-leading-snug);
  color: var(--mjs-color-primary);
}
.mjs-body { font-family: var(--mjs-font-body); font-size: var(--mjs-text-base); line-height: var(--mjs-leading-relaxed); color: var(--mjs-color-text); }
.mjs-body-sm { font-family: var(--mjs-font-body); font-size: var(--mjs-text-sm); line-height: var(--mjs-leading-normal); color: var(--mjs-color-text-light); }
.mjs-eyebrow {
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-xs);
  font-weight: var(--mjs-weight-semibold);
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--mjs-color-accent);
}

/* === BUTTON SYSTEM === */
.mjs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--mjs-font-heading);
  font-size: var(--mjs-text-sm);
  font-weight: var(--mjs-weight-semibold);
  letter-spacing: var(--mjs-tracking-wide);
  text-transform: uppercase;
  text-decoration: none;
  border: none; cursor: pointer;
  transition: all var(--mjs-transition-base);
  border-radius: var(--mjs-radius-pill);
}
.mjs-btn-primary {
  padding: 14px 28px;
  background: var(--mjs-color-accent);
  color: var(--mjs-color-surface);
}
.mjs-btn-primary:hover { background: var(--mjs-color-accent-hover); transform: translateY(-1px); }
.mjs-btn-secondary {
  padding: 14px 28px;
  background: transparent;
  color: var(--mjs-color-primary);
  border: 2px solid var(--mjs-color-primary);
}
.mjs-btn-secondary:hover { background: var(--mjs-color-primary); color: var(--mjs-color-surface); }
.mjs-btn-dark {
  padding: 14px 28px;
  background: var(--mjs-color-primary);
  color: var(--mjs-color-surface);
}
.mjs-btn-dark:hover { background: var(--mjs-color-accent); }
.mjs-btn-ghost {
  padding: 14px 28px;
  background: transparent;
  color: var(--mjs-color-accent);
  border: 1px solid var(--mjs-color-border);
}
.mjs-btn-ghost:hover { border-color: var(--mjs-color-accent); }

/* === CONTAINER === */
.mjs-container { max-width: var(--mjs-container-max); margin: 0 auto; padding: 0 var(--mjs-container-padding); }
.mjs-container-narrow { max-width: var(--mjs-container-narrow); margin: 0 auto; padding: 0 var(--mjs-container-padding); }
.mjs-container-wide { max-width: var(--mjs-container-wide); margin: 0 auto; padding: 0 var(--mjs-container-padding); }

/* === SECTION SPACING === */
.mjs-section-padding { padding-top: var(--mjs-space-section); padding-bottom: var(--mjs-space-section); }

/* === CARD BASE === */
.mjs-card {
  background: var(--mjs-color-surface);
  border: 1px solid var(--mjs-color-border);
  border-radius: var(--mjs-radius-lg);
  transition: all var(--mjs-transition-base);
}
.mjs-card:hover { border-color: var(--mjs-color-accent); box-shadow: var(--mjs-shadow-gold); }

/* === BADGE === */
.mjs-badge {
  display: inline-flex; align-items: center; padding: 4px 12px;
  font-size: var(--mjs-text-xs); font-weight: var(--mjs-weight-semibold);
  letter-spacing: 0.5px; border-radius: var(--mjs-radius-pill);
}
.mjs-badge-gold { background: var(--mjs-color-accent); color: var(--mjs-color-surface); }
.mjs-badge-dark { background: var(--mjs-color-primary); color: var(--mjs-color-accent); }
.mjs-badge-outline { background: transparent; border: 1px solid var(--mjs-color-accent); color: var(--mjs-color-accent); }

/* === DIVIDER === */
.mjs-divider { height: 1px; background: var(--mjs-color-border); margin: var(--mjs-space-6) 0; }

/* === FORM INPUTS === */
.mjs-input {
  width: 100%; padding: 12px 16px;
  border: 1px solid var(--mjs-color-border); border-radius: var(--mjs-radius-md);
  font-family: var(--mjs-font-body); font-size: var(--mjs-text-base);
  background: var(--mjs-color-surface); color: var(--mjs-color-text);
  transition: border-color var(--mjs-transition-fast);
}
.mjs-input:focus { outline: none; border-color: var(--mjs-color-accent); }
.mjs-input::placeholder { color: var(--mjs-color-text-muted); }

/* === LINK STYLES === */
.mjs-link { color: var(--mjs-color-accent); text-decoration: none; font-weight: var(--mjs-weight-semibold); transition: color var(--mjs-transition-fast); }
.mjs-link:hover { color: var(--mjs-color-accent-hover); text-decoration: underline; }

/* === ACCESSIBILITY === */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
.mjs-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; }

/* === RESPONSIVE UTILITIES === */
@media (max-width: 749px) {
  :root {
    --mjs-container-padding: 16px;
    --mjs-header-height: 60px;
  }
}

/* === Catherine's Champagne Gold CTA System === */
.mjs-btn-primary,
.mjs-cta-primary,
a.mjs-btn-primary,
button.mjs-btn-primary {
  background: linear-gradient(180deg, #D6B97B, #C9A86A) !important;
  color: #fff !important;
  border: none !important;
  padding: 14px 28px !important;
  font-family: var(--mjs-font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
}
.mjs-btn-primary:hover,
.mjs-cta-primary:hover,
a.mjs-btn-primary:hover,
button.mjs-btn-primary:hover {
  background: linear-gradient(180deg, #C9A86A, #B89557) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(201, 168, 106, 0.3);
}
.mjs-btn-secondary,
.mjs-cta-secondary,
a.mjs-btn-secondary {
  background: transparent !important;
  color: #C9A86A !important;
  border: 1.5px solid #C9A86A !important;
  padding: 14px 28px !important;
  font-family: var(--mjs-font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
}
.mjs-btn-secondary:hover,
.mjs-cta-secondary:hover,
a.mjs-btn-secondary:hover {
  background: linear-gradient(180deg, #D6B97B, #C9A86A) !important;
  color: #fff !important;
  border-color: transparent !important;
}
/* Blush background utility */
.mjs-bg-blush {
  background-color: #FFF8F8 !important;
}