/* ==========================================================================
   STRENGTH DEN — light / dark mode. Loaded last. Light is the default; dark is
   chosen by the visitor (toggle in the header) and remembered in localStorage.
   Dark = tuned palette (not an inversion). Always-dark blocks keep their own look.
   ========================================================================== */
html[data-sd="dark"][data-theme]{
  color-scheme:dark;
  --c-ivory:#10151b; --c-stone:#151b23; --c-paper:#1a212b; --c-paper2:#1f2732; --c-ink:#efe9dc; --c-green:#112720;
  --c-brass:#d2ad62; --c-brass-lt:#e0bf7c; --c-rule:rgba(239,233,220,.16); --c-line2:rgba(239,233,220,.3);
  --c-muted:#bcb5a5; --c-soft:#908a7d; --c-text2:#d2cbbb; --c-hdr:rgba(16,21,27,.94); --c-logo:none; --c-input:#10151b; --c-shadow:rgba(0,0,0,.6);
}
/* blocks that are dark in BOTH modes: restore their original palette locally */
html[data-sd="dark"].sd-home :is(#about,.sdm-strip,#contact,.sec:has(.tl),footer,.sdm-proc,.sd-ticker,.solution-card),
html[data-sd="dark"].sd-inner :is(.cp-hero,.hero,.about-editorial.reverse,.process,.portfolio-downloads,.booth-case,.contact-band:not(.alt),.about-timeline.cp-section,.booth-cta,#sd-homepage-footer,.sdm-proc,.sd-ticker){
  --c-ivory:#f6f1e7; --c-stone:#ece5d6; --c-paper:#fbf8f1; --c-paper2:#f2ecdf; --c-ink:#06080b;
  --c-brass:#a67c2e; --c-brass-lt:#d2ad62; --c-rule:rgba(17,21,28,.16); --c-line2:rgba(17,21,28,.3);
  --c-muted:#4a4f58; --c-soft:#6b6f77; --c-text2:#3f444d; --c-input:#fff; --c-shadow:rgba(17,21,28,.4);
}
html[data-sd="dark"] img{filter:none}
html[data-sd="dark"] .sd-consent,html[data-sd="dark"] .sd-privacy{box-shadow:0 16px 40px rgba(0,0,0,.5)!important}

/* ---- toggle button ---- */
.sd-mode-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-inline-start:10px;padding:0;background:transparent;border:1px solid var(--c-rule);color:var(--c-ink);cursor:pointer;border-radius:0;position:relative;overflow:hidden;transition:border-color .3s,color .3s,background .3s}
.sd-mode-btn:hover{border-color:var(--c-brass);color:var(--c-brass)}
.sd-mode-btn:focus-visible{outline:2px solid var(--c-brass);outline-offset:2px}
.sd-mode-btn svg{width:18px;height:18px;position:absolute;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .4s}
.sd-mode-btn .sun{opacity:0;transform:rotate(-90deg) scale(.4)}
.sd-mode-btn .moon{opacity:1;transform:none}
html[data-sd="dark"] .sd-mode-btn .sun{opacity:1;transform:none}
html[data-sd="dark"] .sd-mode-btn .moon{opacity:0;transform:rotate(90deg) scale(.4)}
html:not([data-sd="dark"]) .sd-mode-btn .moon{opacity:1}
@media(max-width:640px){.sd-mode-btn{width:36px;height:36px;margin-inline-start:6px}}
/* smooth cross-fade only while switching */
html.sd-switching,html.sd-switching *,html.sd-switching *::before,html.sd-switching *::after{transition:background-color .4s ease,color .4s ease,border-color .4s ease,fill .4s ease!important}
@media(prefers-reduced-motion:reduce){html.sd-switching *{transition:none!important}.sd-mode-btn svg{transition:none}}
/* client logos sit on light tiles in both modes (logos are drawn for light backgrounds) */
html[data-sd="dark"] .logo-card{background:#f6f1e7!important;border-color:rgba(246,241,231,.25)!important}
html[data-sd="dark"] .logo-card *{color:#11151c!important}
/* phone header: logo + mode button + burger only (CTA lives in hero and menu) */
@media(max-width:700px){
  html[data-theme] #hdr .nav-cta{display:none!important}
  html[data-theme] #hdr .nav,html[data-theme] #hdr .nav-actions{gap:10px!important}
  html[data-theme] #hdr .brand img.logo{height:34px!important;max-width:100%}
}
/* phone: privacy button as a small unobtrusive tab */
@media(max-width:700px){
  html[data-theme] .sd-privacy{font-size:.66rem!important;padding:5px 8px!important;min-height:0!important;left:auto!important;right:10px!important;bottom:10px!important;opacity:.82;letter-spacing:.02em!important}
}