/* ComDirect 2026 brand theme override for the static site mirror.
   Light pages, navy bands (nav, hero, footer), ComDirect Blue actions, Montserrat. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');
:root{--cd-blue:#00a4eb;--cd-blue-600:#008ecb;--cd-blue-700:#0079a8;--cd-blue-800:#005f85;--cd-blue-200:#8ad4f5;--cd-blue-100:#c2e9fb;--cd-blue-50:#e7f6fe;--navy-1:#06314c;--navy-2:#021f33;--navy-3:#01151f;--ink:#2c2a29;--body:#3f3d3c;--muted:#7c8795;--subtle:#9aa3ae;--line:#dee2e7;--surface:#f6f8fa;--ok:#1f9d6b;--warn:#e8a23d;--bad:#db4a4a}
html,body,.__className_f367f3,[class*="__className_"]{font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif!important}
html{color-scheme:light}
body,.bg-black,.bg-background{background:#fff!important;color:var(--body)!important}
/* ---------- dark zones: nav, hero, footer, explicit dark panels ---------- */
.cd-dark,.cd-dark[class][class]{background-color:var(--navy-2)!important;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),radial-gradient(1200px 600px at 20% -10%,rgba(0,164,235,.22),transparent 60%),linear-gradient(160deg,var(--navy-1),var(--navy-2) 55%,var(--navy-3))!important;background-size:56px 56px,56px 56px,auto,auto!important;background-position:0 0,0 0,0 0,0 0!important;color:#fff!important}
footer.cd-dark[class][class]{background-image:linear-gradient(160deg,var(--navy-1),var(--navy-2) 55%,var(--navy-3))!important;background-size:auto!important}
nav.fixed{background:linear-gradient(160deg,rgba(6,49,76,.96),rgba(2,31,51,.96))!important;border-bottom:1px solid rgba(138,212,245,.18)!important;backdrop-filter:blur(8px)}
footer,footer[class]{background:linear-gradient(160deg,var(--navy-1),var(--navy-2) 55%,var(--navy-3))!important;background-image:linear-gradient(160deg,var(--navy-1),var(--navy-2) 55%,var(--navy-3))!important;border-top:1px solid rgba(138,212,245,.18)!important;color:#fff}
/* white-text utilities: dark on light pages, white again inside dark zones */
.text-white{color:var(--ink)!important}
.text-white\/90,.text-white\/80{color:var(--body)!important}
.text-white\/70,.text-white\/60{color:#565452!important}
.text-white\/50,.text-white\/40{color:var(--muted)!important}
.text-white\/30,.text-white\/20{color:var(--subtle)!important}
.placeholder\:text-white\/50::placeholder{color:var(--subtle)!important}
.cd-dark .text-white,nav.fixed .text-white,footer .text-white,.cd-dark h1,.cd-dark h2,.cd-dark h3,.cd-dark h4,footer h3,footer h4{color:#fff!important}
.cd-dark .text-white\/90,.cd-dark .text-white\/80,nav.fixed .text-white\/80,footer .text-white\/80,footer .text-white\/70,.cd-dark .text-white\/70,nav.fixed .text-white\/70,.cd-dark .text-white\/60,footer .text-white\/60,nav.fixed .text-white\/60{color:rgba(255,255,255,.85)!important}
.cd-dark .text-white\/50,.cd-dark .text-white\/40,footer .text-white\/50,footer .text-white\/40,footer .text-white\/30{color:rgba(255,255,255,.62)!important}
.cd-dark .text-white\/30,.cd-dark .text-white\/20{color:rgba(255,255,255,.45)!important}
.hover\:text-white:hover{color:var(--cd-blue-800)!important}
nav.fixed .hover\:text-white:hover,footer .hover\:text-white:hover,.cd-dark .hover\:text-white:hover{color:#fff!important}
/* surfaces, borders */
.bg-white\/5,.bg-white\/10,.bg-white\/\[0\.02\],.bg-white\/\[0\.03\],.from-white\/5,.to-white\/\[0\.02\],.via-white\/\[0\.02\],.bg-gradient-to-br.from-white\/5{background:#fff!important;background-image:none!important}
.border-white\/10,.border-white\/20,.border-white\/5{border-color:var(--line)!important}
.hover\:bg-white\/10:hover{background:var(--surface)!important}
.hover\:border-white\/40:hover{border-color:#c1c7cf!important}
.cd-dark .bg-white\/5,.cd-dark .bg-white\/10,.cd-dark .from-white\/5,.cd-dark .bg-white\/\[0\.02\],footer .bg-white\/5{background:rgba(255,255,255,.06)!important}
.cd-dark .border-white\/10,.cd-dark .border-white\/20,footer .border-white\/10,footer .border-white\/20,nav.fixed .border-white\/10{border-color:rgba(138,212,245,.28)!important}
.rounded-xl.border,.rounded-2xl.border,.rounded-lg.border{box-shadow:0 1px 2px rgba(2,31,51,.04),0 10px 28px -20px rgba(2,31,51,.25)}
.cd-dark .rounded-xl.border,.cd-dark .rounded-2xl.border{box-shadow:none}
/* dark gradients used as section/card backgrounds -> flat light */
.from-black,.via-black,.to-gray-900,.from-gray-900,.to-black,.bg-gray-900,.bg-black\/50,.bg-black\/90,.bg-black\/80,.bg-black\/60,.from-blue-900\/20,.bg-gradient-to-b.from-black,.bg-gradient-to-t.from-black{--tw-gradient-from:#fff!important;--tw-gradient-to:#fff!important;--tw-gradient-stops:#fff,#fff!important;background-color:#fff!important}
.cd-dark .from-black,.cd-dark .to-gray-900,.cd-dark .bg-black\/50,.cd-dark .bg-black\/90,footer .from-black,footer .to-gray-900{--tw-gradient-from:transparent!important;--tw-gradient-to:transparent!important;--tw-gradient-stops:transparent,transparent!important;background-color:transparent!important;background-image:none!important}
.bg-gradient-to-b.from-gray-900,.bg-gradient-to-b.from-black{background:var(--surface)!important}
/* brand accents: violet/purple/cyan/emerald/amber -> ComDirect palette */
.text-purple-400,.text-violet-400,.text-purple-300,.text-cyan-400,.text-blue-400,.text-comdirect-light-blue{color:var(--cd-blue-700)!important}
.cd-dark .text-purple-400,.cd-dark .text-blue-400,.cd-dark .text-cyan-400,.cd-dark .text-comdirect-light-blue,.cd-dark .text-comdirect-blue{color:var(--cd-blue-200)!important}
.text-comdirect-blue{color:var(--cd-blue-600)!important}
.hover\:text-comdirect-blue:hover,.hover\:text-blue-400:hover{color:var(--cd-blue-800)!important}
nav.fixed .hover\:text-comdirect-blue:hover{color:var(--cd-blue-200)!important}
.bg-purple-500\/10,.bg-purple-500\/5,.bg-violet-500\/10,.bg-comdirect-blue\/10,.bg-comdirect-blue\/5,.bg-comdirect-blue\/20,.bg-comdirect-light-blue\/20,.bg-blue-500\/10,.bg-cyan-500\/10{background:var(--cd-blue-50)!important}
.cd-dark .bg-comdirect-blue\/10,.cd-dark .bg-comdirect-blue\/20,.cd-dark .bg-purple-500\/10,.cd-dark .bg-comdirect-light-blue\/20{background:rgba(0,164,235,.18)!important}
.border-comdirect-blue\/20,.border-purple-500\/20,.border-violet-500\/20,.border-comdirect-blue\/30{border-color:var(--cd-blue-100)!important}
.hover\:border-comdirect-blue\/30:hover,.hover\:border-comdirect-blue\/20:hover{border-color:var(--cd-blue-200)!important}
.text-emerald-400{color:var(--ok)!important}.bg-emerald-500\/10{background:#eafaf3!important}
.text-amber-400{color:#b8781a!important}.bg-amber-500\/10,.bg-amber-500\/5{background:#fdf3e2!important}
.text-red-400,.text-rose-400{color:var(--bad)!important}
.from-comdirect-blue,.to-blue-400,.to-cyan-400,.from-comdirect-blue\/5,.from-purple-500,.to-purple-500{--tw-gradient-from:var(--cd-blue)!important;--tw-gradient-to:var(--cd-blue-800)!important}
.bg-clip-text.text-transparent{background-image:linear-gradient(135deg,var(--cd-blue-600),var(--cd-blue-800))!important}
.cd-dark .bg-clip-text.text-transparent{background-image:linear-gradient(135deg,var(--cd-blue-200),#fff)!important}
.comdirect-text-gradient{background:linear-gradient(135deg,var(--cd-blue-600),var(--cd-blue-800))!important;-webkit-background-clip:text!important;background-clip:text!important}
.cd-dark .comdirect-text-gradient{background:linear-gradient(135deg,var(--cd-blue-200),#fff)!important;-webkit-background-clip:text!important;background-clip:text!important}
/* actions */
.comdirect-gradient,.bg-primary{background:var(--cd-blue)!important;color:#fff!important;border-radius:10px!important;box-shadow:none!important;font-weight:600!important}
.comdirect-gradient:hover,.bg-primary:hover,.hover\:bg-primary\/90:hover{background:var(--cd-blue-600)!important}
.hover\:shadow-comdirect-blue\/25:hover,.hover\:shadow-2xl:hover{box-shadow:0 10px 24px -12px rgba(0,164,235,.5)!important}
.rounded-full.comdirect-gradient{border-radius:10px!important}
input,textarea,select{background:#fff!important;color:var(--ink)!important;border-color:#c1c7cf!important}
.cd-dark input,.cd-dark textarea,.cd-dark select,footer input{background:rgba(255,255,255,.1)!important;color:#fff!important;border-color:rgba(255,255,255,.3)!important}
.focus\:border-comdirect-blue:focus{border-color:var(--cd-blue)!important;box-shadow:0 0 0 3px rgba(0,164,235,.2)!important}
/* headings */
h1,h2,h3,h4{color:var(--ink);font-weight:800}
.font-light{font-weight:400!important}
hr,.divide-white\/10>*{border-color:var(--line)!important}
/* logo swaps */
img[src$="comdirect-logo-new.png"]{content:url("/comdirectusa/images/comdirect-white.png");height:34px!important;width:auto!important}
footer img[src$="comdirect-logo-new.png"]{content:url("/comdirectusa/images/comdirect-white.png");height:36px!important}
/* misc dark leftovers */
.text-white\/70.font-light,.text-gray-400{color:#565452!important}
.cd-dark .text-gray-400{color:rgba(255,255,255,.7)!important}
.bg-gray-800,.bg-gray-950,.bg-zinc-900,.bg-neutral-900{background:var(--surface)!important}
.cd-dark .bg-gray-800,.cd-dark .bg-gray-950{background:rgba(255,255,255,.06)!important}
.shadow-2xl,.shadow-xl{box-shadow:0 1px 2px rgba(2,31,51,.04),0 12px 32px -20px rgba(2,31,51,.3)!important}
::selection{background:var(--cd-blue);color:#fff}

/* overlays inside dark zones */
.cd-dark .from-blue-900\/20,.cd-dark .via-black,.cd-dark .to-purple-900\/10,.cd-dark .from-black,.cd-dark .to-gray-900,.cd-dark .from-gray-900,.cd-dark .to-black,.cd-dark .bg-black\/50,.cd-dark .bg-black\/90,.cd-dark .bg-black\/80,.cd-dark .bg-black\/60,.cd-dark .bg-black\/40,.cd-dark .via-transparent,.cd-dark .bg-gradient-to-b.from-transparent,.cd-dark .bg-gradient-to-t.from-black,footer .from-black,footer .to-gray-900{background:transparent!important;background-image:none!important;--tw-gradient-from:transparent!important;--tw-gradient-to:transparent!important;--tw-gradient-stops:transparent,transparent!important}
.cd-dark .bg-comdirect-blue\/5.blur-3xl,.cd-dark .bg-comdirect-blue\/10.blur-3xl,.cd-dark .bg-purple-500\/5.blur-3xl,.cd-dark .bg-purple-500\/10.blur-3xl,.cd-dark .bg-blue-400\/10.blur-3xl,.cd-dark .bg-blue-400\/5.blur-3xl{background:rgba(0,164,235,.14)!important}
.cd-dark .text-white,.cd-dark h1,.cd-dark h2,.cd-dark h3,.cd-dark h4,.cd-dark .text-white\/90,.cd-dark .text-white\/80{color:#fff!important}
.cd-dark .text-white\/70,.cd-dark .text-white\/60,.cd-dark p,.cd-dark li{color:rgba(255,255,255,.85)!important}
.cd-dark .text-white\/50,.cd-dark .text-white\/40,.cd-dark .text-white\/30{color:rgba(255,255,255,.62)!important}
.cd-dark .bg-white\/5,.cd-dark .bg-white\/10,.cd-dark .from-white\/5,.cd-dark .to-white\/\[0\.02\],.cd-dark .via-white\/\[0\.02\],.cd-dark .bg-white\/\[0\.02\]{background:rgba(255,255,255,.07)!important;background-image:none!important}
.cd-dark .border-white\/10,.cd-dark .border-white\/20,.cd-dark .border-white\/5{border-color:rgba(138,212,245,.3)!important}
.cd-dark .rounded-xl.border,.cd-dark .rounded-2xl.border,.cd-dark .rounded-lg.border{box-shadow:none!important}
/* secondary (outlined) buttons in dark zones */
.cd-dark a.rounded-full:not(.comdirect-gradient):not(.bg-primary),.cd-dark button.rounded-full:not(.comdirect-gradient):not(.bg-primary){background:#fff!important;color:var(--navy-2)!important;border-color:#fff!important;border-radius:10px!important;font-weight:600!important}
.cd-dark a.rounded-full.inline-flex.items-center.px-4,.cd-dark div.rounded-full.inline-flex{background:rgba(255,255,255,.08)!important;color:#fff!important;border-color:rgba(138,212,245,.3)!important;border-radius:9999px!important}
a.rounded-full:not(.comdirect-gradient):not(.bg-primary),button.rounded-full:not(.comdirect-gradient):not(.bg-primary){border-radius:10px!important}

/* decorative pattern layers inside dark zones stay faint */
.cd-dark>div.absolute.inset-0[class*="opacity-"],.cd-dark>div.absolute.inset-0[style*="url("]{opacity:.05!important}
.cd-dark>div.absolute.inset-0:not([class*="blur"]):not([class*="opacity-"]){background-image:none!important}