/**
 * Red Orchid — Aggressive per-surface Soft UI skin (issue #28)
 * ============================================================
 * The AGGRESSIVE half of the two-file split (durable half lives in
 * elementor-overrides.css). Every block below is scoped to ONE surface
 * and pushes that surface onto the Soft UI Evolution system harder than
 * the generic widget base layer can safely do site-wide.
 *
 * These blocks are DELIBERATELY DISPOSABLE. Each header names the section-
 * library issue that will rebuild the surface properly; when that issue
 * ships, delete the whole block — that is the entire retirement process.
 *
 * Rules of the road (same as elementor-overrides.css):
 *   - CSS-only. Zero markup/content/URL change. Never CSS-hide content.
 *   - Prints after elementor-post-15 (see functions.php dependency chain),
 *     so equal-specificity wins need no !important.
 *   - No transform-on-hover motion (shadow/border/brightness only);
 *     :active press-scale is fine. prefers-reduced-motion respected by
 *     the base layer's global media query.
 *   - Surface scoping hooks are WordPress body classes (verified live
 *     2026-07-12): .single-services, .page-id-5709 (Services listing),
 *     .page-id-8053 (/deals/), .page-id-8098 (/our-works/), .home,
 *     and the Elementor header/footer location wrappers.
 * ============================================================ */

/* ============================================================
 * HEADER  —  RETIRED BY #35 (header + footer rebuild)
 * Token-ize the site header: system link colors + a smooth,
 * transform-free hover. Structural layout is left untouched.
 * ============================================================ */
.elementor-location-header .elementor-nav-menu .elementor-item {
  color: var(--ro-foreground);
  background: transparent;
  transition: color var(--ro-dur) var(--ro-ease);
}
.elementor-location-header .elementor-nav-menu .elementor-item:focus,
.elementor-location-header .elementor-nav-menu .elementor-item:active {
  background: transparent;
}
.elementor-location-header .elementor-nav-menu .elementor-item:hover,
.elementor-location-header .elementor-nav-menu .elementor-item:focus:hover,
.elementor-location-header .elementor-nav-menu .elementor-item:active:hover,
.elementor-location-header .elementor-nav-menu .elementor-item:focus-visible,
.elementor-location-header .elementor-nav-menu .elementor-item.elementor-item-active {
  color: var(--ro-primary-strong);
  background: transparent;
}

/* ============================================================
 * FOOTER  —  RETIRED BY #35 (header + footer rebuild)
 * System link colors + hover; nothing structural.
 * ============================================================ */
.elementor-location-footer a:not(.elementor-button) {
  transition: color var(--ro-dur) var(--ro-ease),
              opacity var(--ro-dur) var(--ro-ease);
}
.elementor-location-footer a:not(.elementor-button):hover,
.elementor-location-footer a:not(.elementor-button):focus-visible {
  color: var(--ro-primary);
  opacity: 1;
}

/* ============================================================
 * SERVICE SINGLES  —  RETIRED BY #36 (Services single template)
 * One skin covers every /services/**/ URL via the .single-services
 * body class. Warm page canvas + softened dynamic-field cards.
 * Verify on /services/manicure/classic-dry-manicure/.
 * ============================================================ */
.single-services {
  background-color: var(--ro-background);
}
.single-services .elementor-widget-icon-box .elementor-icon-box-wrapper,
.single-services .jet-listing-grid__item {
  background-color: var(--ro-surface);
  box-shadow: var(--ro-shadow-card);
}
.single-services .elementor-widget-heading .elementor-heading-title {
  color: var(--ro-foreground);
}

/* ============================================================
 * SERVICES LISTING (/services/, page-id-5709)  —  RETIRED BY #33
 * Warm canvas so the white listing cards read as raised tiles.
 * ============================================================ */
.page-id-5709 {
  background-color: var(--ro-background);
}
.page-id-5709 .jet-listing-grid__item {
  background-color: var(--ro-surface);
}

/* ============================================================
 * OUR BEST DEALS (/deals/, page-id-8053)  —  RETIRED BY #36
 * Warm canvas + deal cards onto the system surface/shadow.
 * ============================================================ */
.page-id-8053 {
  background-color: var(--ro-background);
}
.page-id-8053 .jet-listing-grid__item {
  background-color: var(--ro-surface);
  box-shadow: var(--ro-shadow-card);
}

/* ============================================================
 * OUR WORKS (/our-works/, page-id-8098)  —  RETIRED BY #33
 * Warm canvas behind the gallery grid.
 * ============================================================ */
.page-id-8098 {
  background-color: var(--ro-background);
}

/* ============================================================
 * HOME (/, .home)  —  RETIRED BY #31 (section inventory + specs)
 * Warm canvas as the base of the home composition. Section-level
 * backgrounds stay as authored; this only fills the gaps on-system.
 * ============================================================ */
.home {
  background-color: var(--ro-background);
}

/* ============================================================
 * ABOUT — STUDIO VALUES (page 8304, widget ab01112)
 * The Values renderer is shared and this page has a second Values
 * block. Keep the full-width intro/checklist layout on this instance.
 * ============================================================ */
.page-id-8304 .elementor-element-ab01112 .ro-values .values-intro {
  max-width: none;
}

.page-id-8304 .elementor-element-ab01112 .ro-values .check-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ro-stack-sm);
  width: 100%;
}

.page-id-8304 .elementor-element-ab01112 .ro-values .check-list li {
  position: relative;
  display: block;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: var(--ro-stack-sm) var(--ro-stack-sm) var(--ro-stack-sm)
    calc(26px + var(--ro-stack-sm) + var(--ro-stack-sm));
  border: 1px solid var(--ro-border);
  border-radius: var(--ro-radius-control);
  background: var(--ro-surface-2);
  color: var(--ro-muted-fg);
}

.page-id-8304 .elementor-element-ab01112 .ro-values .check-list .check-coin {
  position: absolute;
  top: var(--ro-stack-sm);
  left: var(--ro-stack-sm);
  margin: 0;
}

.page-id-8304 .elementor-element-ab01112 .ro-values .check-list li strong {
  color: var(--ro-foreground);
  font-weight: var(--ro-fw-semibold);
}

@container ro-values (min-width: 900px) {
  .page-id-8304 .elementor-element-ab01112 .ro-values .check-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}