/* Site header and footer from the redesign (option D board). Values are copied from the design file. */
.dcd-hdr,.dcd-home,.dcd-foot,.dcd-player{--blue:#2f74d6; --blue-deep:#2563eb}
@media (prefers-color-scheme:dark){.dcd-hdr,.dcd-home,.dcd-foot,.dcd-player{--blue:#5b9bff; --blue-deep:#7fb1ff}}

.dcd-hdr,.dcd-home,.dcd-foot,.dcd-player{font-feature-settings:normal}
.dcd-heat{height:4px; background:linear-gradient(90deg,#3d83e4 0%,#1AB394 55%,#F59C1A 100%)}
.dcd-hdr{border-bottom:1px solid var(--line)}
.dcd-hdr-in{max-width:1200px; margin:0 auto; padding:14px 24px; display:flex; flex-wrap:wrap; align-items:center; gap:12px 28px}
.dcd-logo{color:var(--ink)}
.dcd-nav{display:flex; flex-wrap:wrap; gap:4px 22px; flex:1 1 auto; align-items:center}
.dcd-nav a{color:var(--ink); font-weight:500; font-size:15px; padding:10px 4px; line-height:1.6}
.dcd-nav > a,.dcd-dd,.dcd-dd > a{flex:none; white-space:nowrap}
.dcd-nav a:hover,.dcd-nav a[aria-current="page"]{color:var(--blue)}
.dcd-btn{display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 18px; border-radius:8px;
  background:var(--blue); color:#fff; font-weight:600; font-size:15px; border:0; cursor:pointer; white-space:nowrap; gap:10px}
.dcd-btn[hidden]{display:none}
.dcd-btn:hover{background:var(--blue-deep); color:#fff}
/* Filled buttons keep the deeper blue in both modes: the lighter dark-mode blue fails contrast under white text.
   Covers the theme's older button classes too (.btn-primary, the CTA band's .dcn-btn). */
.dcd-btn,.edx-btn{background:#2f74d6}
.dcd-btn:hover,.edx-btn:hover{background:#2563eb}
.btn-primary,.dcn-btn{background:#2f74d6 !important; color:#fff !important}
.btn-primary:hover,.dcn-btn:hover{background:#2563eb !important}
.dcd-kick{font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--ink2)}

.dcd-dd{position:relative}
.dcd-ddmenu{position:absolute; left:-12px; top:100%; min-width:240px; display:none; flex-direction:column; padding:8px;
  background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 12px 32px rgba(15,17,21,.12)}
.dcd-dd:hover .dcd-ddmenu,.dcd-dd:focus-within .dcd-ddmenu{display:flex}
.dcd-ddmenu a{padding:8px 12px; border-radius:8px}
.dcd-ddmenu a:hover{background:var(--surface2)}

.dcd-foot{margin-top:72px; border-top:1px solid var(--line); background:var(--surface)}
.dcd-foot-in{max-width:1200px; margin:0 auto; padding:40px 24px; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:28px}
.dcd-foot-col{display:grid; gap:8px; align-content:start; line-height:1.6}
.dcd-foot-name{font-weight:700; margin-bottom:2px}
.dcd-foot-blurb{color:var(--ink2); font-size:14px; line-height:1.5}
.dcd-foot a{color:var(--ink2); font-size:14px}
.dcd-foot a:hover{color:var(--ink)}
.dcd-foot-legal{max-width:1200px; margin:0 auto; padding:16px 24px 28px; border-top:1px solid var(--line); color:var(--ink2); font-size:13px}

@media (max-width:640px){
  .dcd-hdr-in{padding:10px 16px 0; gap:0 10px; flex-wrap:wrap}
  .dcd-logo{flex:1 1 0; min-width:0}
  .dcd-btn.header-cta{margin-left:auto; min-height:38px; padding:0 12px; font-size:13px}
  .dcd-nav{order:3; flex-basis:100%; gap:0 18px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-right:24px;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
  .dcd-nav::-webkit-scrollbar{display:none}
  .dcd-ddmenu{display:none!important}
  .dcd-foot-in{padding:32px 16px}
  .dcd-foot-legal{padding:16px 16px 24px}
}


/* The theme's green and amber kickers are too pale on white; darker shades in light mode only. */
@media (prefers-color-scheme:light){
  .kicker.k-good{color:#1a8a72} .kicker.k-good::before{background:#1a8a72}
  .kicker.k-warn{color:#b86e00} .kicker.k-warn::before{background:#b86e00}
}

/* Sitewide offer rotation (rotate.js): soft fade on change and a small pause control in each slot. */
@keyframes dcdSwap{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
.dcd-swap > *:not(.dcd-rot-mini){animation:dcdSwap .45s cubic-bezier(.2,.7,.2,1) both}
@media (prefers-reduced-motion:reduce){.dcd-swap > *{animation:none}}
.dcd-rot-host{position:relative}
.dcd-rot-host :is(h2,h3),.edx-cta.dcd-rot-host strong{padding-right:30px}
.dcd-rot-mini{all:unset; cursor:pointer; position:absolute; top:10px; right:10px; width:26px; height:26px; display:grid; place-items:center;
  border-radius:50%; color:var(--ink2); background:color-mix(in srgb, var(--surface) 70%, transparent); border:1px solid var(--line); opacity:.7}
.dcd-rot-mini:hover,.dcd-rot-mini:focus-visible{opacity:1; color:var(--ink)}
.dcd-rot-mini:focus-visible{outline:2px solid var(--blue); outline-offset:2px}

/* The comparison tables carry inline light-only colors in the post body, after this file and with their own --ink,
   so these use body-scoped selectors and literal dark-theme colors. */
@media (prefers-color-scheme:dark){
  body .cmp-wrap{--line:#2a2f39; background:#16181d; box-shadow:none}
  body .cmp,body .cmp tr{background:#16181d; color:#e7e9ee}
  body .cmp thead th{background:#0f1115; color:#e7e9ee}
  body .cmp tbody th{background:#1e2127; color:#e7e9ee}
  body .cmp tbody tr:nth-child(even) td{background:#1e2127}
  body .cmp tr.cmp-ours th,body .cmp tr.cmp-ours td{background:#1c2a44 !important}
  body .cmp .yes{color:#4cc38a} body .cmp .partial{color:#e0a43a} body .cmp .no,body .cmp-note{color:#9aa3b2}
}
@media (prefers-color-scheme:dark) and (max-width:720px){
  body .cmp-wrap{background:transparent}
  body .cmp tbody th{background:#0f1115}
  body .cmp tr.cmp-ours td{background:#16181d !important}
}
