:root {
  /* Site Colors: #000957 #344CB7 #577BC1 #FFEB00 */
  --primary-color: #000957; /* Deep Navy */
  --secondary-color: #344CB7; /* Bright Blue */
  --accent-color: #577BC1; /* Sky Blue */
  --highlight-color: #FFEB00; /* Vivid Yellow */
  --btn-color: #E01171; /* Deep Pink for CTA */
  
  --bg-color: #F2F2F2;
  --card-bg: #FFFFFF;
  --text-main: #1F2937;
  
  --font-heading: 'Montserrat', sans-serif;
  --font-text: 'Roboto', sans-serif;
  
  --container-width: 1300px;
  --product-img-width: 400px;
}

body {
    font-family: var(--font-text);
    background-color: var(--bg-color);
    color: var(--text-main);
}

h1, h2, h3 {
    font-family: var(--font-heading);
}

/* Polka Dot SVG Pattern */
.bg-dots {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.03;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2' cy='2' r='2' fill='%23000957'/%3E%3C/svg%3E");
    pointer-events: none;
}

.site-content { position: relative; z-index: 10; }
header, footer { position: relative; z-index: 20; }

/* Custom Utilities */
.box-shadow { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); }
.border-primary { border: 2px solid var(--primary-color); }
.text-navy { color: var(--primary-color); }
.bg-navy { background-color: var(--primary-color); }
.cta-btn {
    background-color: var(--btn-color);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(224, 17, 113, 0.39);
}
.cta-btn:hover { background-color: #b00d58; }

.highlight-box {
    background: linear-gradient(135deg, #ffffff 0%, #f0f4ff 100%);
    border-left: 5px solid var(--highlight-color);
}