/* ===== CHRISTMAS THEME (core, shared by all four sites) =====
   Pure CSS, no images, no scripts: a string of lights across the top, hanging baubles in the corners, candy-cane edges and a holly garland along the
   bottom. Everything is drawn on <html>/<body> pseudo-elements and ignores the mouse. Remove with restore-original.mjs. */
:root {
  --xm-red: #c8102e; --xm-red-2: #e11d3f; --xm-red-dark: #8f0b20;
  --xm-green: #14683a; --xm-green-2: #1f8f52; --xm-green-dark: #0b3d27;
  --xm-gold: #f2c14e; --xm-gold-dark: #b8860b; --xm-cream: #fff8ec;
}

/* 1. lights across the top (bulbs every 40px: red, gold, green, blue) + baubles hanging in the corners on wide screens */
html {
  --xm-lights:
    radial-gradient(circle at 20px 12px, #fff 0 1.2px, #ff3355 1.4px 4px, rgba(255, 51, 85, .38) 4.2px 5.2px, transparent 9px) 0 0 / 160px 24px repeat-x,
    radial-gradient(circle at 60px 12px, #fff 0 1.2px, #ffd24a 1.4px 4px, rgba(255, 210, 74, .38) 4.2px 5.2px, transparent 9px) 0 0 / 160px 24px repeat-x,
    radial-gradient(circle at 100px 12px, #fff 0 1.2px, #2fd16f 1.4px 4px, rgba(47, 209, 111, .38) 4.2px 5.2px, transparent 9px) 0 0 / 160px 24px repeat-x,
    radial-gradient(circle at 140px 12px, #fff 0 1.2px, #3fa0ff 1.4px 4px, rgba(63, 160, 255, .38) 4.2px 5.2px, transparent 9px) 0 0 / 160px 24px repeat-x,
    linear-gradient(90deg, transparent 18px, #20382c 18px 22px, transparent 22px 58px, #20382c 58px 62px, transparent 62px 98px, #20382c 98px 102px, transparent 102px 138px, #20382c 138px 142px, transparent 142px) 0 2px / 160px 6px repeat-x,
    linear-gradient(#20382c, #20382c) 0 1px / 100% 2px no-repeat;
  --xm-baubles:
    linear-gradient(#c9ad5f, #c9ad5f) 28px 0 / 1px 49px no-repeat,
    linear-gradient(#f2c14e, #f2c14e) 24.5px 49px / 8px 5px no-repeat,
    radial-gradient(circle at 23px 64px, rgba(255, 255, 255, .9) 0 2.4px, transparent 3px),
    radial-gradient(circle at 28px 68px, #e11d3f 0 12px, #7d0a1c 12.8px, transparent 13.6px),
    linear-gradient(#c9ad5f, #c9ad5f) 62px 0 / 1px 33px no-repeat,
    linear-gradient(#f2c14e, #f2c14e) 58.5px 33px / 8px 5px no-repeat,
    radial-gradient(circle at 58px 46px, rgba(255, 255, 255, .9) 0 2px, transparent 2.6px),
    radial-gradient(circle at 62px 49px, #1f8f52 0 9px, #0b3d27 9.8px, transparent 10.6px),
    linear-gradient(#c9ad5f, #c9ad5f) calc(100% - 28px) 0 / 1px 49px no-repeat,
    linear-gradient(#f2c14e, #f2c14e) calc(100% - 32px) 49px / 8px 5px no-repeat,
    radial-gradient(circle at calc(100% - 33px) 64px, rgba(255, 255, 255, .9) 0 2.4px, transparent 3px),
    radial-gradient(circle at calc(100% - 28px) 68px, #f2c14e 0 12px, #a8790a 12.8px, transparent 13.6px),
    linear-gradient(#c9ad5f, #c9ad5f) calc(100% - 62px) 0 / 1px 33px no-repeat,
    linear-gradient(#f2c14e, #f2c14e) calc(100% - 66px) 33px / 8px 5px no-repeat,
    radial-gradient(circle at calc(100% - 67px) 46px, rgba(255, 255, 255, .9) 0 2px, transparent 2.6px),
    radial-gradient(circle at calc(100% - 62px) 49px, #e11d3f 0 9px, #7d0a1c 9.8px, transparent 10.6px);
}
html::before {
  content: ''; position: fixed; top: 0; left: 0; right: 0; height: 24px; z-index: 2147483000; pointer-events: none;
  background: var(--xm-lights); animation: xm-twinkle 2.6s ease-in-out infinite alternate;
}
@media (min-width: 1400px) { html::before { height: 96px; background: var(--xm-lights), var(--xm-baubles); } }
@keyframes xm-twinkle { from { filter: brightness(.88) saturate(.95); } to { filter: brightness(1.3) saturate(1.2); } }

/* 2. candy-cane edges down both sides and a holly garland (green scallops, red berries, gold beads) along the bottom */
body::after {
  content: ''; position: fixed; inset: 0; z-index: 2147482998; pointer-events: none;
  background:
    radial-gradient(circle at 9px 8px, #e11d3f 0 2.6px, transparent 3.2px) 0 100% / 72px 16px repeat-x,
    radial-gradient(circle at 45px 7px, #f2c14e 0 2.3px, transparent 2.9px) 0 100% / 72px 16px repeat-x,
    radial-gradient(circle at 18px 20px, #1f8f52 0 17px, #0b3d27 17px 18.4px, transparent 18.8px) 0 100% / 36px 16px repeat-x,
    repeating-linear-gradient(45deg, #c8102e 0 7px, #fff 7px 14px) 0 0 / 5px 100% no-repeat,
    repeating-linear-gradient(-45deg, #14683a 0 7px, #fff 7px 14px) 100% 0 / 5px 100% no-repeat;
}

@media (prefers-reduced-motion: reduce) { html::before { animation: none; } }
@media print { html::before, body::after { display: none !important; } }

/* shared pieces the site files reuse */
.xm-candy { background: repeating-linear-gradient(135deg, #c8102e 0 12px, #fff 12px 24px, #14683a 24px 36px, #fff 36px 48px); }

/* ===== MICROBROWSE.COM: the navy ramp turns pine green, the teal accent turns gold, primary buttons turn holly red ===== */
:root {
  --navy-950: #05160e; --navy-900: #082016; --navy-800: #0c2d1e; --navy-700: #12452d; --navy-600: #195c3c; --navy-500: #238055;
  --ink-300: #a8c4b3; --ink-200: #cfe0d5; --ink-100: #eef6f0; --teal-400: #ffd166; --teal-300: #ffe29a;
}
.site-header { background: rgba(5, 22, 14, .82); border-bottom: 4px solid transparent; border-image: repeating-linear-gradient(135deg, #c8102e 0 12px, #fff 12px 24px, #14683a 24px 36px, #fff 36px 48px) 4; }
.hero::before { background: linear-gradient(180deg, rgba(5, 22, 14, .5) 0%, rgba(5, 22, 14, .88) 55%, var(--navy-950) 100%), url("../images/hero-office.jpg") center 30% / cover no-repeat; }
.hero::after { background: radial-gradient(circle, rgba(225, 29, 63, .22), transparent 70%); }
.cta-band::after { background: radial-gradient(circle, rgba(255, 209, 102, .25), transparent 70%); }
.eyebrow::before { content: none; }

.btn-primary { position: relative; background: linear-gradient(180deg, #e11d3f, #a50d26); color: #fff; border-color: var(--teal-400); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22), 0 4px 14px rgba(200, 16, 46, .35); }
.btn-primary:hover { background: linear-gradient(180deg, #22a15f, #0f6b3a); box-shadow: 0 14px 30px -12px rgba(47, 209, 111, .55); }
.btn-primary::after { content: ''; position: absolute; top: -5px; right: -5px; width: 11px; height: 11px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0 1.4px, #2fd16f 2px, #0f6b36 7px); box-shadow: 0 0 0 1px rgba(11, 61, 39, .55); pointer-events: none; }

.card, .service-card, .stat-card { border-top: 3px solid var(--xm-red); }
.card:nth-child(even), .service-card:nth-child(even), .stat-card:nth-child(even) { border-top-color: var(--xm-green-2); }
.site-footer { border-top: 5px solid transparent; border-image: repeating-linear-gradient(135deg, #c8102e 0 12px, #fff 12px 24px, #14683a 24px 36px, #fff 36px 48px) 5; }