/* Dark mode for the homepage and the industry pages. /assets/theme.js sets data-theme="dark" on <html>
   at night (or when the test button asks for it); everything here only applies then.
   The pages keep their colours in custom properties, so most of the work is swapping those. */

html[data-theme="dark"]{
  --bg:#0B0F0D;
  --fg:#ECF1EE;
  --fg-dim:#A9B4AE;
  --fg-faint:#84908A;
  --hair:rgba(255,255,255,.08);
  --hair-strong:rgba(255,255,255,.16);
  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.20);
  --tint:rgba(255,255,255,.05);
  --tint-2:rgba(255,255,255,.09);
  --brand-wash:#0F1C17;
  --brand-wash-2:#14251E;
  --surface:#121916;
  --surface-2:#18211D;
  --mint:#7FD1B0;
}
html[data-theme="dark"] body{background:var(--bg);color:var(--fg)}

/* header */
html[data-theme="dark"] .hdr-sign{background:rgba(255,255,255,.08)}
html[data-theme="dark"] .hdr-sign:hover{background:rgba(255,255,255,.14)}

/* the Services menu */
html[data-theme="dark"] .ddm-in{background:radial-gradient(120% 80% at 0% 0%, rgba(255,255,255,.10), rgba(255,255,255,0) 60%),linear-gradient(180deg, rgba(20,28,24,.66), rgba(14,20,17,.58));
  box-shadow:inset 0 1px 1px rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.06),0 0 0 1px rgba(255,255,255,.10),0 32px 64px -28px rgba(0,0,0,.85)}
html[data-theme="dark"] .ddm-in::before{opacity:.3}
html[data-theme="dark"] .nav .ddm a{color:var(--fg)}
html[data-theme="dark"] .nav .ddm .ddm-i:hover,html[data-theme="dark"] .nav .ddm .ddm-i[aria-current]{background:rgba(255,255,255,.05)}
html[data-theme="dark"] .ddm-h,html[data-theme="dark"] .ddm-t span,html[data-theme="dark"] .ddm-g span{color:#9AA59F}
html[data-theme="dark"] .ddm-side{background:rgba(255,255,255,.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
html[data-theme="dark"] .nav .ddm .ddm-g:hover{background:rgba(255,255,255,.05)}
html[data-theme="dark"] .nav .ddm .ddm-all{color:var(--fg);border-top-color:rgba(255,255,255,.08)}

/* homepage hero: a night sky in the same greens */
html[data-theme="dark"] .sky-in{background-color:#0B0F0D;background-image:var(--hero-night)}
html[data-theme="dark"] .sky-in::after{background:radial-gradient(56% 46% at 50% 46%, rgba(11,15,13,.55), rgba(11,15,13,0) 72%),linear-gradient(180deg,rgba(11,15,13,.45),rgba(11,15,13,0) 30%)}

/* the glass: smoked rather than frosted */
html[data-theme="dark"] .hp{
  background:radial-gradient(90% 60% at 50% 120%, rgba(255,255,255,.06), rgba(255,255,255,0) 70%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03) 55%, rgba(255,255,255,.06));
  box-shadow:inset 0 1px 1px rgba(255,255,255,.22),inset 0 -1px 1px rgba(255,255,255,.08),inset 0 -14px 24px -16px rgba(255,255,255,.12),
    inset 0 0 0 1px rgba(255,255,255,.06),0 0 0 1px rgba(255,255,255,.10),0 28px 60px -26px rgba(0,0,0,.8)}
html[data-theme="dark"] .hp:focus-within{box-shadow:inset 0 1px 1px rgba(255,255,255,.22),inset 0 -14px 24px -16px rgba(255,255,255,.14),
    0 0 0 1px rgba(255,255,255,.28),0 0 0 4px rgba(255,255,255,.05),0 28px 60px -26px rgba(0,0,0,.8)}
html[data-theme="dark"] .hp::before{opacity:.35}
html[data-theme="dark"] .hp::after{background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0))}
html[data-theme="dark"] .hp-field textarea::placeholder{color:#7D8983}
html[data-theme="dark"] .hp-go{color:var(--fg-dim);background:rgba(255,255,255,.08);box-shadow:inset 0 1px 1px rgba(255,255,255,.15),0 0 0 1px rgba(255,255,255,.10)}
html[data-theme="dark"] .hp-go:hover{color:#fff}
html[data-theme="dark"] .hp.busy .hp-field{background:linear-gradient(100deg,rgba(255,255,255,0) 30%,rgba(127,209,176,.14) 50%,rgba(255,255,255,0) 70%);background-size:220% 100%}
html[data-theme="dark"] .hp-svcs li{color:#5E6A64;background:rgba(255,255,255,.03);box-shadow:0 0 0 1px rgba(255,255,255,.06)}
html[data-theme="dark"] .hp-svcs li.on{color:#fff;background:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.22)}
html[data-theme="dark"] .hp-steps li{background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
html[data-theme="dark"] .hp-steps li::before{color:#fff;background:rgba(255,255,255,.10);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
html[data-theme="dark"] .hp-again:hover{color:#fff;border-color:#fff}
html[data-theme="dark"] .hp-load-t{color:var(--mint)}

/* homepage sections */
html[data-theme="dark"] .hm-svc-card,html[data-theme="dark"] .hw-list li{background:var(--surface);box-shadow:0 0 0 1px var(--line),0 26px 50px -38px rgba(0,0,0,.8)}
html[data-theme="dark"] .hm-svc-link:hover,html[data-theme="dark"] .hm-svc-body li a:hover{color:var(--mint)}
html[data-theme="dark"] .cmp .us{background:rgba(35,122,102,.14)}
html[data-theme="dark"] .cmp-logo{color:var(--fg)}
html[data-theme="dark"] .hm-ad{box-shadow:0 0 0 1px var(--line),0 24px 44px -30px rgba(0,0,0,.8)}
html[data-theme="dark"] .ftr a:hover{color:var(--fg)}

/* industry pages (services.css + industries.css) */
html[data-theme="dark"] .steps3 li{background:var(--surface);border-color:var(--line);box-shadow:0 30px 60px -44px rgba(0,0,0,.8)}
html[data-theme="dark"] .checks svg{stroke:var(--mint)}
html[data-theme="dark"] .btn-ghost{background:var(--surface-2);color:var(--fg);box-shadow:0 0 0 1px var(--line)}
html[data-theme="dark"] .ind-chip{background:var(--surface);box-shadow:0 0 0 1px var(--line)}
html[data-theme="dark"] .ind-chip:hover{color:var(--mint);box-shadow:0 0 0 1px rgba(127,209,176,.4)}
html[data-theme="dark"] .svc figure{box-shadow:0 34px 70px -44px rgba(0,0,0,.9)}
html[data-theme="dark"] .pg-hero:not(.has-media)::before{opacity:.25}


/* industry page sections */
html[data-theme="dark"] .tl-when{color:var(--fg-faint)}
html[data-theme="dark"] .points li::before{color:var(--fg);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
html[data-theme="dark"] .feat figure,html[data-theme="dark"] .card3{box-shadow:0 40px 80px -50px rgba(0,0,0,.9)}
html[data-theme="dark"] .card3{background:var(--surface);border-color:var(--line)}
html[data-theme="dark"] .cmpx-col{background:var(--surface-2);box-shadow:0 0 0 1px var(--line)}
html[data-theme="dark"] .cmpx-col.now{background:var(--surface)}
html[data-theme="dark"] .cmpx-col.now li::before{background:#5E6A64}
html[data-theme="dark"] .cmpx-col:not(.now) li::before{background:var(--fg)}
html[data-theme="dark"] .tl li::after{background:var(--bg);box-shadow:inset 0 0 0 4px var(--fg)}
html[data-theme="dark"] .tools{background:var(--surface)}
html[data-theme="dark"] .tool-chips span{background:var(--surface-2)}

/* the booking and sign-in panels: smoked glass, like the planner at night */
html[data-theme="dark"] .bk-scrim{background:rgba(0,0,0,.5)}
html[data-theme="dark"] .bk-panel{border-color:rgba(255,255,255,.12);
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(255,255,255,.08), rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(24,30,27,.78), rgba(14,18,16,.72) 55%, rgba(18,23,20,.76));
  box-shadow:inset 0 1px 1px rgba(255,255,255,.18),inset 0 -1px 1px rgba(255,255,255,.05),
    0 0 0 1px rgba(0,0,0,.4),0 40px 90px -40px rgba(0,0,0,.9)}
html[data-theme="dark"] .fld input,html[data-theme="dark"] .fld textarea{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.10);box-shadow:none}
html[data-theme="dark"] .fld input:hover,html[data-theme="dark"] .fld textarea:hover{border-color:rgba(255,255,255,.18)}
html[data-theme="dark"] .fld input:focus,html[data-theme="dark"] .fld textarea:focus{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.34);box-shadow:0 0 0 4px rgba(255,255,255,.05)}
html[data-theme="dark"] .bk-day{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
html[data-theme="dark"] .bk-day:hover:not([disabled]){background:rgba(255,255,255,.12)}
html[data-theme="dark"] .bk-day[disabled]{background:transparent;box-shadow:none;color:rgba(255,255,255,.2)}
html[data-theme="dark"] .bk-day.pick,html[data-theme="dark"] .bk-slot.pick{background:#fff;color:#0B0F0D;border-color:#fff}
html[data-theme="dark"] .bk-slot{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .bk-slot:hover{background:rgba(255,255,255,.12)}
html[data-theme="dark"] .bk-send[disabled]{background:rgba(255,255,255,.08);color:#6E7A74}
html[data-theme="dark"] .bk-who{background:rgba(255,255,255,.05)}
html[data-theme="dark"] .bk-edit{color:var(--mint)}
html[data-theme="dark"] .bk-msg a,html[data-theme="dark"] .bk-done a{text-decoration-color:rgba(255,255,255,.35)}
html[data-theme="dark"] body.ind .sec.wash{background:#101312}
html[data-theme="dark"] body.ind .sec:has(> .shell > .band){
  background:radial-gradient(48% 90% at 0% 100%,rgba(127,209,176,.07),rgba(127,209,176,0) 70%),radial-gradient(40% 70% at 100% 0%,rgba(214,196,160,.05),rgba(214,196,160,0) 70%),#0F1311}
html[data-theme="dark"] .step-n{color:var(--fg);background:rgba(255,255,255,.06)}
html[data-theme="dark"] .how-card{background:var(--surface);box-shadow:0 0 0 1px var(--line)}
html[data-theme="dark"] .how-card:hover .how-go{color:var(--mint)}

/* service pages (/services and its groups) */
html[data-theme="dark"] .group{background:var(--surface);border-color:var(--line);box-shadow:0 30px 60px -40px rgba(0,0,0,.8)}
html[data-theme="dark"] .group h2 a:hover,html[data-theme="dark"] .rows a:hover{color:var(--mint)}
html[data-theme="dark"] .rows a:hover svg{stroke:var(--mint)}
html[data-theme="dark"] .xcard-go{background:var(--surface-2);color:var(--fg)}
html[data-theme="dark"] .pimg{background:var(--surface-2)}
html[data-theme="dark"] .nav .ddm .ddm-h-link{color:#9AA59F}
html[data-theme="dark"] .nav .ddm .ddm-h-link:hover{color:var(--fg)}
html[data-theme="dark"] .gs-scrim{background:rgba(0,0,0,.5)}
html[data-theme="dark"] .gs-panel{color:var(--fg);border-color:rgba(255,255,255,.12);
  background:radial-gradient(120% 60% at 50% -10%,rgba(255,255,255,.08),rgba(255,255,255,0) 60%),linear-gradient(180deg,rgba(24,30,27,.86),rgba(14,18,16,.82));
  box-shadow:inset 0 1px 1px rgba(255,255,255,.18),0 0 0 1px rgba(0,0,0,.4),0 40px 90px -40px rgba(0,0,0,.9)}
html[data-theme="dark"] .gs-x{color:#9AA59F;background:rgba(255,255,255,.08)}
html[data-theme="dark"] .gs-x:hover{color:#fff;background:rgba(255,255,255,.14)}
html[data-theme="dark"] .gs-prog i{background:#fff}
html[data-theme="dark"] .gs-in{color:var(--fg);border-bottom-color:rgba(255,255,255,.18)}
html[data-theme="dark"] .gs-in:focus{border-bottom-color:#fff}
html[data-theme="dark"] .gs-in::placeholder{color:rgba(255,255,255,.3)}
html[data-theme="dark"] .gs-hint,html[data-theme="dark"] .gs-back,html[data-theme="dark"] .gs-gift-t span{color:#9AA59F}
html[data-theme="dark"] .gs-back:hover{color:#fff}
html[data-theme="dark"] .gs-chip,html[data-theme="dark"] .gs-pill,html[data-theme="dark"] .gs-gift{color:var(--fg);background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(255,255,255,.1)}
html[data-theme="dark"] .gs-chip.on{background:#fff;color:#0B0F0D}
html[data-theme="dark"] .gs-gift:has(input:checked){background:rgba(255,255,255,.08);box-shadow:0 0 0 1.5px #fff}
html[data-theme="dark"] .gs-gift:has(input:checked) .gs-check{background:#fff}
html[data-theme="dark"] .gs-check{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.25)}
html[data-theme="dark"] .gs-check svg{stroke:#0B0F0D}
html[data-theme="dark"] .si-l,html[data-theme="dark"] .si-help,html[data-theme="dark"] .si-show{color:#9AA59F}
html[data-theme="dark"] .si-link,html[data-theme="dark"] .si-help a,html[data-theme="dark"] .si-note.ok{color:var(--fg)}
html[data-theme="dark"] .si-link{text-decoration-color:rgba(255,255,255,.3)}
html[data-theme="dark"] .pg-hero.split{background:#0C0F0E}
html[data-theme="dark"] .pg-hero.split::before{opacity:1;background:radial-gradient(circle,rgba(255,255,255,.08) 1px,rgba(255,255,255,0) 1.5px) 0 0/22px 22px}
html[data-theme="dark"] .pg-split-card{box-shadow:0 60px 110px -50px rgba(127,209,176,.18),0 0 0 1px rgba(255,255,255,.06)}