/* V2.061: paired surface/foreground roles. Brand fonts and media remain intact.
   Light: paper canvas, white cards, ink headings, slate body, rust links.
   Lime/coral remain accent fills; they are never small text on paper. */
html[data-color-mode="light"] body.p360-site {
  --p360-mode-canvas: #f4f1ea;
  --p360-mode-card: #ffffff;
  --p360-mode-subtle: #ebe8e1;
  --p360-mode-heading: #08111a;
  --p360-mode-copy: #39444e;
  --p360-mode-link: #a93620;
  --p360-mode-border: #c0c3c0;
  --p360-mode-focus: #a93620;
  --p360-text-dark-muted: var(--p360-mode-copy);
  --p360-text-light-muted: var(--p360-mode-copy);
  --p360-muted: var(--p360-mode-copy);
  --p360-accent-strong: var(--p360-mode-link);
  color: var(--p360-mode-heading);
  background: var(--p360-mode-canvas);
}

/* Dark sections must change their surface and foreground as one unit. */
html[data-color-mode="light"] body.p360-site :is(
  .p360-section--dark,.p360-service-directory,.p360-service-process,
  .p360-service-use-cases,.p360-service-collaboration,.p360-service-testimonials,
  .p360-inner-services,.p360-services,.p360-next-step,.p360-reviews,.p360-footer
) {
  background: var(--p360-mode-canvas) !important;
  color: var(--p360-mode-heading) !important;
  border-color: var(--p360-mode-border) !important;
}
html[data-color-mode="light"] body.p360-site :is(
  .p360-service-directory__header,.p360-service-process__header,
  .p360-service-use-cases__header,.p360-service-collaboration,
  .p360-service-testimonials__top,.p360-inner-services__header,
  .p360-reviews__top,.p360-next-step__copy
) :is(h2,h3) { color: var(--p360-mode-heading) !important; }
html[data-color-mode="light"] body.p360-site .p360-reviews__heading { color: var(--p360-mode-heading) !important; }
html[data-color-mode="light"] body.p360-site :is(
  .p360-service-directory__body,.p360-service-process__steps,
  .p360-service-use-cases__grid,.p360-service-collaboration__steps,
  .p360-next-step__copy
) :is(p,li) { color: var(--p360-mode-copy) !important; }
html[data-color-mode="light"] body.p360-site :is(
  .p360-inner-service-card a,.p360-service-directory__card a,
  .p360-review-card,.p360-review-modal__shell,.p360-review-score
) {
  background: var(--p360-mode-card) !important;
  color: var(--p360-mode-heading) !important;
  border-color: var(--p360-mode-border) !important;
  box-shadow: 0 10px 28px rgba(8,17,26,.07);
}
html[data-color-mode="light"] body.p360-site .p360-review-carousel__item { background: transparent !important; }
html[data-color-mode="light"] body.p360-site :is(.p360-inner-service-card,.p360-service-directory__card) a:is(:hover,:focus-visible) { background: var(--p360-accent-2) !important; }
html[data-color-mode="light"] body.p360-site :is(.p360-inner-service-card,.p360-service-directory__body) :is(h3,p,li) { color: var(--p360-mode-heading) !important; }
html[data-color-mode="light"] body.p360-site :is(.p360-inner-service-card,.p360-service-directory__body) p { color: var(--p360-mode-copy) !important; }
html[data-color-mode="light"] body.p360-site :is(.p360-service-directory__number,.p360-service-collaboration__steps li > span,.p360-service-process__steps span,.p360-service-use-cases__grid article > span) { color: #365700 !important; }
html[data-color-mode="light"] body.p360-site :is(.p360-service-use-cases__grid,.p360-service-use-cases__grid article,.p360-service-process__steps li,.p360-service-collaboration__steps li,.p360-service-directory__body li) { border-color: var(--p360-mode-border); }

/* Review controls, badges and full-review state use the same light card palette. */
html[data-color-mode="light"] body.p360-site :is(.p360-review-card__source,.p360-review-modal__source,.p360-review-modal__reply,.p360-review-carousel__autoplay) {
  color: var(--p360-mode-copy) !important;
  background: var(--p360-mode-subtle) !important;
  border-color: var(--p360-mode-border) !important;
}
html[data-color-mode="light"] body.p360-site :is(.p360-review-card__stars,.p360-review-modal__stars,.p360-review-score__stars) { color: #765100 !important; }
html[data-color-mode="light"] body.p360-site .p360-review-carousel__controls::before { background: linear-gradient(90deg, #365700 calc(var(--p360-review-progress,.1) * 100%), #c0c3c0 0); }
html[data-color-mode="light"] body.p360-site .p360-reviews__embed .wp-google-wr a,
html[data-color-mode="light"] body.p360-site .p360-reviews__embed .wp-google-wr a :is(span,b,strong) {
  background: #1555b6 !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}

/* Readable accent labels on light surfaces in BOTH modes. */
body.p360-site :is(.p360-story-step__trigger > span,.p360-service-value__card > span,.p360-service-scope__panel > p,.p360-service-scope__panel li > span,.p360-service-fit__list span,.p360-service-related__card > span) { color: #a93620 !important; }
/* Directory hover was also inheriting white copy in dark mode. */
body.p360-site .p360-service-directory__card a:is(:hover,:focus-visible) :is(p,li,h3,.p360-service-directory__number) { color: var(--p360-ink) !important; }

/* Keep image/video text on a reliably dark image stage in both appearances. */
body.p360-site .p360-service-card { background-color: #08111a; }
html[data-color-mode="light"] body.p360-site :is(.p360-hero,.p360-inner-hero,.p360-service-card,.p360-phone,.p360-service-sales-hero__visual) {
  --p360-text-light: #f7f8fa;
  --p360-text-light-muted: #d9e2e8;
}

/* Light navigation has its own surfaces, including the open mobile drawer. */
html[data-color-mode="light"] body.p360-site .p360-menu-panel__drawer { background: var(--p360-mode-canvas) !important; color: var(--p360-mode-heading); }
html[data-color-mode="light"] body.p360-site .p360-nav__list .sub-menu { backdrop-filter: none; box-shadow: 0 12px 30px rgba(8,17,26,.12); }
html[data-color-mode="light"] body.p360-site .p360-header.is-scrolled { background: transparent; }
html[data-color-mode="light"] body.p360-site :is(.p360-motion-toggle,.p360-menu-toggle) { color: var(--p360-mode-heading) !important; }
html[data-color-mode="light"] body.p360-site .p360-motion-toggle { background: var(--p360-mode-subtle); border-color: var(--p360-mode-border); }
html[data-color-mode="light"] body.p360-site :is(a,button,input,textarea,select,summary):focus-visible { outline: 3px solid var(--p360-mode-focus); outline-offset: 4px; }
html[data-color-mode="light"] body.p360-site :is(.p360-hero,.p360-inner-hero,.p360-service-card) :is(a,button):focus-visible { outline-color: var(--p360-accent-2); }

/* Same self-hosted brand families; a stable, readable light-mode hierarchy. */
html[data-color-mode="light"] body.p360-site :is(h1,h2,h3,h4,h5,h6) { font-family: var(--p360-font-display); font-weight: 700; }
html[data-color-mode="light"] body.p360-site :is(.p360-entry-content,.p360-service-directory__body,.p360-service-use-cases__grid,.p360-service-process__steps,.p360-next-step__copy) p { font-family: var(--p360-font-body); font-weight: 400; line-height: 1.7; }
html[data-color-mode="light"] body.p360-site :is(.p360-review-card__date,.p360-review-modal__date,.p360-review-card__position,.p360-review-modal__position) { font-size: .875rem !important; line-height: 1.45 !important; }
html[data-color-mode="light"] body.p360-site .p360-review-card__excerpt { font-weight: 400; line-height: 1.65 !important; }

/* Opaque fallbacks beneath the existing dark gradients also preserve contrast
   if a browser cannot draw a gradient. Their gradients remain unchanged. */
html:not([data-color-mode="light"]) body.p360-site :is(.p360-header,.p360-inner-services,.p360-reviews,.p360-next-step,.p360-service-testimonials) { background-color: #08111a; }
html:not([data-color-mode="light"]) body.p360-site .p360-service-directory .p360-kicker { color: var(--p360-accent-2) !important; }
html:not([data-color-mode="light"]) body.p360-site .p360-reviews__embed :is(.grw-header,.grw-header-inner,.wp-google-place,.rplg-business) .wp-google-name a { color: #f7f8fa !important; -webkit-text-fill-color: #f7f8fa !important; }
body.p360-site .p360-service-related__grid article > a > span { color: #a93620 !important; }
html[data-color-mode="light"] body.p360-site .p360-review-modal__google { color: var(--p360-mode-copy); border-color: var(--p360-mode-border); }
/* Pausing decorative motion must not freeze a newly opened dialog at opacity 0. */
html.user-paused-motion .p360-review-modal__shell { animation: none !important; opacity: 1; transform: none; }
/* Inputs remain light in both modes; their boundaries must be visible too. */
body.p360-site :is(.p360-quote-form,.p360-contact) :is(input:not([type="hidden"]):not([type="radio"]):not([type="checkbox"]):not([type="submit"]),textarea,select) { border-color: #77828b !important; }
body.p360-site .p360-quote-methods input + span { border-color: #77828b; }
body.p360-site .p360-quote-methods input:checked + span { border-color: #365700; }
body.p360-site .p360-quote-form :is(input,textarea,select):focus-visible { outline: 3px solid #a93620; outline-offset: 3px; }
