/* VIDEO SHAIKA: carry the team section's graphite palette through the dark homepage.
   Wine red and muted gold are accents, not section backgrounds. */
html[data-theme="dusk"] {
  --bg: #0c0c0c;
  --bg2: #151515;
  --ink: #f5f4f2;
  --muted: #b0aaa6;
  --line: rgba(255, 255, 255, .15);
  --card: rgba(25, 25, 25, .9);
  --cta: #d4b988;
  --accent: #a94f59;
  --c1: #a94f59;
  --c2: #d4b988;
  --c3: #aaa8a5;
  --hero-filter: brightness(.65) saturate(.68);
  --overlay: linear-gradient(180deg, rgba(8, 8, 8, .33), rgba(9, 9, 9, .92));
}

html[data-theme="dusk"] body { background: #0c0c0c; }
html[data-theme="dusk"] .music-control.on {
  background: rgba(17, 17, 17, .96);
  border-color: rgba(212, 185, 136, .22);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .42);
}
html[data-theme="dusk"] .music-control.on .music-play {
  background: #a94f59;
  border-color: #d4b988;
  color: #fff;
}
html[data-theme="dusk"] .music-control.on .music-play:hover {
  background: #b85a64;
  border-color: #d4b988;
}
@media (max-width: 760px) {
  html[data-theme="dusk"] .music-control.on {
    width: min(340px, calc(100vw - 26px));
  }
  html[data-theme="dusk"] .music-control.on .music-name {
    display: block;
    font-size: 10px;
  }
}
html[data-theme="dusk"] .hero-video { filter: grayscale(.45) saturate(.68) brightness(.82); }
html[data-theme="dusk"] .hero:before {
  opacity: .23;
  background: radial-gradient(circle at 84% 72%, rgba(169, 79, 89, .35), transparent 28%);
}
html[data-theme="dusk"] .trust-strip {
  background: linear-gradient(180deg, rgba(12, 12, 12, .4), #0c0c0c 86%) !important;
}
html[data-theme="dusk"] .msheet { background: rgba(14, 14, 14, .98); }
html[data-theme="dusk"] .footer {
  color: #aaa8a5;
  background: linear-gradient(0deg, rgba(12, 12, 12, .96), rgba(12, 12, 12, 0));
}

html[data-theme="dusk"] #work,
html[data-theme="dusk"] .showreel,
html[data-theme="dusk"] .offer,
html[data-theme="dusk"] .experience,
html[data-theme="dusk"] .faq,
html[data-theme="dusk"] #contact {
  background-color: #111 !important;
  box-shadow: inset 0 58px 72px -68px #050505, inset 0 -58px 72px -68px #050505 !important;
}

html[data-theme="dusk"] #work {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .97), rgba(14, 14, 14, .86) 50%, rgba(9, 9, 9, .84)), url('./backgrounds/gallery-social.webp') !important;
}
html[data-theme="dusk"] .showreel {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .97), rgba(14, 14, 14, .84) 50%, rgba(9, 9, 9, .91)), url('./backgrounds/showreel-social.webp') !important;
}
html[data-theme="dusk"] .offer {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .96), rgba(14, 14, 14, .82) 50%, rgba(9, 9, 9, .89)), url('./backgrounds/services-camera.webp') !important;
}
html[data-theme="dusk"] .experience {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .97), rgba(14, 14, 14, .84) 50%, rgba(9, 9, 9, .88)), url('./backgrounds/experience-social.webp') !important;
}
html[data-theme="dusk"] .faq {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .97), rgba(14, 14, 14, .85) 50%, rgba(9, 9, 9, .9)), url('./backgrounds/faq-hands.webp') !important;
}
html[data-theme="dusk"] #contact {
  background-image: linear-gradient(90deg, rgba(9, 9, 9, .95), rgba(14, 14, 14, .82) 50%, rgba(9, 9, 9, .9)), url('./backgrounds/contact-social.webp') !important;
}
html[data-theme="dusk"] body #process {
  background-color: #111 !important;
  background-image: radial-gradient(800px 500px at 10% 8%, rgba(169, 79, 89, .085), transparent 68%), linear-gradient(135deg, #151515, #0c0c0c) !important;
  box-shadow: inset 0 58px 72px -68px #050505, inset 0 -58px 72px -68px #050505 !important;
}

html[data-theme="dusk"] .service-offer .offer-box,
html[data-theme="dusk"] .contact-inner,
html[data-theme="dusk"] .booking-terms {
  background: linear-gradient(145deg, rgba(29, 29, 29, .96), rgba(15, 15, 15, .98)) !important;
  border-color: rgba(212, 185, 136, .24);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}
html[data-theme="dusk"] .service-feature,
html[data-theme="dusk"] .process-visual { background: #191919; }
html[data-theme="dusk"] .experience-item,
html[data-theme="dusk"] .faq details {
  background-color: rgba(24, 24, 24, .9);
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .045), transparent) !important;
  border-color: rgba(255, 255, 255, .14);
}
html[data-theme="dusk"] .service-choice.is-selected {
  border-left-color: #a94f59;
  background: linear-gradient(90deg, rgba(169, 79, 89, .19), rgba(169, 79, 89, .025));
}
html[data-theme="dusk"] .service-choice-number,
html[data-theme="dusk"] .service-feature-type,
html[data-theme="dusk"] .process-step-number,
html[data-theme="dusk"] .service-choice-arrow,
html[data-theme="dusk"] .eyebrow,
html[data-theme="dusk"] .offer-title em,
html[data-theme="dusk"] .experience h2 em { color: #d4b988; stroke: #d4b988; }
html[data-theme="dusk"] .service-offer .offer-lead,
html[data-theme="dusk"] .service-note p,
html[data-theme="dusk"] .process-head > p,
html[data-theme="dusk"] .process-step-copy p,
html[data-theme="dusk"] .service-feature-detail { color: #bcb7b2; }
html[data-theme="dusk"] .process-story .steps::before {
  background: linear-gradient(#a94f59, rgba(212, 185, 136, .24));
}
html[data-theme="dusk"] .process-story .step::before {
  border-color: #a94f59;
  background: #181818;
  box-shadow: 0 0 0 5px rgba(169, 79, 89, .1);
}
html[data-theme="dusk"] .service-feature-image figcaption,
html[data-theme="dusk"] .process-visual figcaption {
  background: rgba(15, 15, 15, .78);
  color: #f5f4f2;
}
html[data-theme="dusk"] .button,
html[data-theme="dusk"] .service-note .button {
  border-color: #d4b988;
  background: #d4b988;
  color: #101010;
}
html[data-theme="dusk"] .button.light {
  background: rgba(26, 26, 26, .85);
  border-color: rgba(255, 255, 255, .22);
  color: #f5f4f2;
}
html[data-theme="dusk"] a:focus-visible,
html[data-theme="dusk"] button:focus-visible { outline-color: #d4b988; }

@media (max-width: 760px) {
  html[data-theme="dusk"] #work {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .7) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/gallery-social-mobile.webp') !important;
  }
  html[data-theme="dusk"] .showreel {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .69) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/showreel-social-mobile.webp') !important;
  }
  html[data-theme="dusk"] .offer {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .7) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/services-camera-mobile.webp') !important;
  }
  html[data-theme="dusk"] .experience {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .7) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/experience-festival-mobile.webp') !important;
  }
  html[data-theme="dusk"] .faq {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .7) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/faq-brief-mobile.webp') !important;
  }
  html[data-theme="dusk"] #contact {
    background-image: linear-gradient(180deg, rgba(9, 9, 9, .96), rgba(12, 12, 12, .7) 55%, rgba(9, 9, 9, .92)), url('./backgrounds/contact-booking-mobile.webp') !important;
  }
}