/* Ultron Civic page layer
   Shared visual language for service, article and client-proof body templates. */
:root {
  --ud-page-ink: #0d172a;
  --ud-page-muted: #61708a;
  --ud-page-line: #dfe6ef;
  --ud-page-soft: #f4f7fb;
  --ud-page-blue: #2f66e9;
  --ud-page-cyan: #65d9e8;
  --ud-page-navy: #0d172a;
}

body[class*="ud-page-"],
body[class*="ud-page-"] *,
body[class*="ud-page-"] *::before,
body[class*="ud-page-"] *::after {
  box-sizing: border-box;
}

body[class*="ud-page-"] {
  background: #fff;
  color: var(--ud-page-ink);
  font-family: Inter, system-ui, sans-serif;
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

body[class*="ud-page-"] :is(h1,h2,h3) {
  font-family: Inter, system-ui, sans-serif;
  letter-spacing: -.02em;
  font-variant-ligatures: none;
  font-feature-settings: "liga" 0;
}

body[class*="ud-page-"] :is(button,input,select,textarea) { font-family: Inter, system-ui, sans-serif; }

/* Service and location pages */
.ud-page-service :is(.hero-gradient,.powerbi-hero) {
  background-color: var(--ud-page-navy) !important;
  background-image:
    radial-gradient(circle at 83% 18%, rgba(72,122,255,.42), transparent 27%),
    linear-gradient(135deg, #0d172a 0%, #152d62 62%, #2f66e9 100%) !important;
  color: #fff;
  overflow: hidden;
  position: relative;
}

.ud-page-service :is(.hero-gradient,.powerbi-hero)::before {
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.05));
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.ud-page-service :is(.hero-gradient,.powerbi-hero) > :is(.container,[class*="max-w-"]) { position: relative; z-index: 1; }
.ud-page-service :is(.hero-gradient,.powerbi-hero) h1 { color: #fff !important; font-weight: 800 !important; }
.ud-page-service :is(.hero-gradient,.powerbi-hero) > div > h2,
.ud-page-service :is(.hero-gradient,.powerbi-hero) > .container > h2,
.ud-page-service :is(.hero-gradient,.powerbi-hero) > [class*="max-w-"] > h2 {
  color: #fff !important;
  font-weight: 800 !important;
}
.ud-page-service :is(.hero-gradient,.powerbi-hero) p:not(:is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)):not(:where(
  :is(.hero-gradient,.powerbi-hero) :is(
    .trust-badge,
    .seo-card,
    [class~="bg-white"],
    [class~="bg-white/80"],
    [class~="bg-slate-50"],
    [class~="bg-blue-50"],
    [class~="bg-cyan-50"],
    [class~="bg-emerald-50"],
    [class~="bg-green-50"],
    [class~="bg-purple-50"],
    [class~="bg-violet-50"],
    [class~="bg-yellow-50"],
    [class~="bg-amber-50"]
  ) *
)) { color: rgba(255,255,255,.72) !important; }

.ud-page-service :is(.hero-gradient,.powerbi-hero) li:not(:is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)):not(:where(
  :is(.hero-gradient,.powerbi-hero) :is(
    .trust-badge,
    .seo-card,
    [class~="bg-white"],
    [class~="bg-white/80"],
    [class~="bg-slate-50"],
    [class~="bg-blue-50"],
    [class~="bg-cyan-50"],
    [class~="bg-emerald-50"],
    [class~="bg-green-50"],
    [class~="bg-purple-50"],
    [class~="bg-violet-50"],
    [class~="bg-yellow-50"],
    [class~="bg-amber-50"]
  ) *
)) { color: rgba(255,255,255,.78) !important; }

:where(.ud-page-service :is(.hero-gradient,.powerbi-hero) :is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)) { color: var(--ud-page-ink); }

:where(.ud-page-service :is(.hero-gradient,.powerbi-hero) :is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)) :is(h2,h3,h4,strong,label) { color: var(--ud-page-ink); }

:where(.ud-page-service :is(.hero-gradient,.powerbi-hero) :is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)) :is(p,li) { color: #526078; }

/* Override gradient-text inside dark heroes so contrast is ≥ 3:1 for large text (WCAG 1.4.3) */
.ud-page-service :is(.hero-gradient,.powerbi-hero) .gradient-text {
  -webkit-text-fill-color: #93c5fd !important;
  background: none !important;
  color: #93c5fd !important;
}

.ud-page-service main > section,
.ud-page-service body > section { scroll-margin-top: 105px; }

.ud-page-service :is(.section-kicker,[class*="tracking-"][class*="uppercase"]) { color: var(--ud-page-blue); }

:where(.ud-page-service main) :is(h2,h3) { color: var(--ud-page-ink); }
:where(.ud-page-service main) h2 { font-weight: 800; }
:where(.ud-page-service main) p { color: var(--ud-page-muted); }

.ud-page-service main :is(article,.card,[class*="rounded-2xl"][class*="border"]) {
  border-color: var(--ud-page-line) !important;
}

.ud-page-service main :is(article,.card,[class*="rounded-2xl"][class*="border"]):not([class*="bg-slate-9"]):not([class*="text-white"]) {
  box-shadow: 0 8px 26px rgba(13,23,42,.055);
}

.ud-page-service main a[class*="font-semibold"],
.ud-page-service main a[class*="font-bold"] { text-underline-offset: 3px; }

.ud-page-service main :is(input,select,textarea) {
  border: 1px solid #cbd5e1;
  border-radius: 10px;
}

.ud-page-service main :is(input,select,textarea):focus {
  border-color: var(--ud-page-blue);
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ud-page-blue);
  outline: 0;
}

/* Keep copy readable on dark CTA/panel surfaces, including gradient panels. */
:where(.ud-page-service main :is(
  .text-white,
  [class~="bg-purple-900"],
  [class~="bg-purple-950"],
  [class~="bg-blue-900"],
  [class~="bg-slate-900"],
  [class~="bg-slate-950"],
  [class~="from-slate-900"],
  [class~="from-blue-600"]
)) :is(h2,h3,h4,p,li,strong) {
  color: #fff;
}
:where(.ud-page-service main :is(
  .text-white,
  [class~="bg-purple-900"],
  [class~="bg-purple-950"],
  [class~="bg-blue-900"],
  [class~="bg-slate-900"],
  [class~="bg-slate-950"],
  [class~="from-slate-900"],
  [class~="from-blue-600"]
)) :is(p,li) {
  color: rgba(255,255,255,.86);
}
:where(.ud-page-service main) :is(h2,h3,h4,p,li,strong)[class~="text-white"] {
  color: #fff;
}

/* Re-establish dark copy where a light card is nested inside one of those panels. */
:where(.ud-page-service main :is(
  .text-white,
  [class~="bg-purple-900"],
  [class~="bg-purple-950"],
  [class~="bg-blue-900"],
  [class~="bg-slate-900"],
  [class~="bg-slate-950"],
  [class~="from-slate-900"],
  [class~="from-blue-600"]
) :is(.trust-badge,.seo-card,[class~="bg-white"],[class~="bg-white/80"])) {
  color: var(--ud-page-ink);
}

:where(.ud-page-service main :is(
  .text-white,
  [class~="bg-purple-900"],
  [class~="bg-purple-950"],
  [class~="bg-blue-900"],
  [class~="bg-slate-900"],
  [class~="bg-slate-950"],
  [class~="from-slate-900"],
  [class~="from-blue-600"]
) :is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)) :is(h2,h3,h4,strong,label) {
  color: var(--ud-page-ink);
}

:where(.ud-page-service main :is(
  .text-white,
  [class~="bg-purple-900"],
  [class~="bg-purple-950"],
  [class~="bg-blue-900"],
  [class~="bg-slate-900"],
  [class~="bg-slate-950"],
  [class~="from-slate-900"],
  [class~="from-blue-600"]
) :is(
  .trust-badge,
  .seo-card,
  [class~="bg-white"],
  [class~="bg-white/80"],
  [class~="bg-slate-50"],
  [class~="bg-blue-50"],
  [class~="bg-cyan-50"],
  [class~="bg-emerald-50"],
  [class~="bg-green-50"],
  [class~="bg-purple-50"],
  [class~="bg-violet-50"],
  [class~="bg-yellow-50"],
  [class~="bg-amber-50"]
)) :is(p,li) {
  color: #526078;
}

/* A visible, high-contrast keyboard indicator for all interactive controls. */
.ud-page-service :is(a,button,input,select,textarea,summary):focus-visible,
.ud-page-proof :is(a,button,input,select,textarea,summary):focus-visible,
.ud-page-case :is(a,button,input,select,textarea,summary):focus-visible {
  outline: 3px solid #facc15 !important;
  outline-offset: 3px;
}

/* Client proof pages retain their richer layouts but use the approved palette. */
.ud-page-proof,
.ud-page-case {
  --purple: #2f66e9;
  --purple2: #2455c6;
  --purple-dark: #17356f;
  --deep: #0d172a;
  --cyan: #65d9e8;
  --soft: #f4f7fb;
  --surface: #f4f7fb;
  --line: #dfe6ef;
  --muted: #61708a;
}

.ud-page-proof .hero,
.ud-page-case .case-hero {
  background: radial-gradient(circle at 84% 18%, rgba(101,217,232,.22), transparent 25%), linear-gradient(135deg,#0d172a 0%,#183976 58%,#2f66e9 100%);
}

.ud-page-proof :is(.story-card,.case-card,.proof-panel),
.ud-page-case :is(.panel,.story-card,.process-card,.contact-card) { border-radius: 18px; }

/* Editorial pages */
.ud-page-article > header:not(.ud-header) {
  background: var(--ud-page-soft) !important;
  border-bottom: 1px solid var(--ud-page-line);
  padding-bottom: 52px !important;
  padding-top: 52px !important;
}

.ud-page-article > header:not(.ud-header) h1 {
  color: var(--ud-page-ink) !important;
  font-size: clamp(2.35rem,5vw,4.25rem) !important;
  line-height: 1.02 !important;
}

.ud-page-article article > div.prose {
  border-color: var(--ud-page-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 48px rgba(13,23,42,.065) !important;
}

.ud-page-article .prose :is(h2,h3) { color: var(--ud-page-ink); }
.ud-page-article .prose h2 { margin-top: 2.2em; }
.ud-page-article .prose :is(p,li) { color: #48566d; line-height: 1.8; }
.ud-page-article article > div:last-child { background: linear-gradient(135deg,#0d172a,#2f66e9) !important; }

@media (max-width: 700px) {
  .ud-page-service :is(.hero-gradient,.powerbi-hero) { padding-bottom: 64px !important; padding-top: 64px !important; }
  .ud-page-service :is(.hero-gradient,.powerbi-hero) h1 { font-size: 2.55rem !important; line-height: 1.02 !important; }
  .ud-page-article > header:not(.ud-header) h1 { font-size: 2.45rem !important; }
  .ud-page-article article > div.prose { padding: 24px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body[class*="ud-page-"] * { scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .card-hover:hover { transform: none !important; }
}