/* ===== LuxReady Cleaning — White & Blue theme override ===== */
/* Loaded after styles.css on luxready.html only — redefines the shared
   color variables so all existing components (buttons, cards, forms, etc.)
   automatically pick up LuxReady's own brand colors instead of the
   noir/crimson/gold House of Gratia palette. */

:root {
  --noir: #ffffff;
  --noir-2: #f4f8fb;
  --noir-3: #eaf1f8;
  --crimson: #1e5fbf;
  --crimson-light: #3b82f6;
  --gold: #1e5fbf;
  --gold-light: #3b82f6;
  --ivory: #0f1c2e;
  --ivory-dim: rgba(15, 28, 46, 0.64);
  --line: rgba(15, 28, 46, 0.1);

  --noir-rgb: 255, 255, 255;
  --crimson-rgb: 30, 95, 191;
  --crimson-light-rgb: 59, 130, 246;
  --gold-rgb: 30, 95, 191;
  --ivory-rgb: 15, 28, 46;
}

body::before { display: none; } /* film grain looks wrong on a light theme */

.btn-crimson {
  color: #ffffff;
}

.btn-outline-light {
  color: var(--ivory);
  border-color: rgba(15, 28, 46, 0.3);
}
.btn-outline-light:hover {
  border-color: var(--ivory);
  background: rgba(15, 28, 46, 0.05);
}

.btn-gold {
  color: var(--crimson);
  border-color: var(--crimson);
}
.btn-gold:hover {
  color: #ffffff;
}

header.site-header {
  background: rgba(255, 255, 255, 0.85);
}

.hero {
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(59,130,246,0.12), transparent 70%),
    radial-gradient(ellipse 40% 40% at 85% 90%, rgba(30,95,191,0.08), transparent 70%),
    var(--noir);
}

.hero h1 em {
  background: linear-gradient(120deg, var(--crimson-light), var(--crimson));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.cta-banner {
  background:
    radial-gradient(ellipse 60% 100% at 50% 0%, rgba(59,130,246,0.12), transparent 70%),
    linear-gradient(180deg, var(--noir-2), var(--noir));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.cta-banner h2 em { color: var(--crimson); }

.split-media {
  background:
    radial-gradient(circle at 30% 20%, rgba(59,130,246,0.18), transparent 55%),
    radial-gradient(circle at 80% 80%, rgba(30,95,191,0.14), transparent 55%),
    linear-gradient(160deg, #eaf1f8, #dce8f5 60%, #ffffff);
}
.split-media .frame { border-color: rgba(30,95,191,0.3); }
.split-media .glyph path { stroke: var(--crimson) !important; }

footer.site-footer { background: var(--noir-2); border-top: 1px solid var(--line); }