/* Final palette layer. Keep original logo colors in style.css untouched.
   Blue derives from the Pardemann wordmark; red is reserved for the classic CTA.
   Decorative dividers use --line; controls use the stronger --control-border. */
body, .v1, .v2, .v3, .v4, .overview {
  --bg: #ffffff;
  --ink: #172f40;
  --muted: #485d6e;
  --panel: #f1f6fa;
  --surface: #ffffff;
  --hover-surface: #e7f0f7;
  --accent: #155680;
  --link: #155680;
  --on-accent: #ffffff;
  --accent-hover: #103f60;
  --line: #cedbe5;
  --control-border: #6c8090;
  --focus: #155680;
  --brand-red: #b51f2b;
  background: var(--bg);
  color: var(--ink);
}
.v1 { --accent: #b51f2b; --accent-hover: #921824; }
.v2 {
  --bg: #09131d;
  --ink: #f3f8fc;
  --muted: #b6c8d6;
  --panel: #102332;
  --surface: #102332;
  --hover-surface: #18364c;
  --accent: #9aceef;
  --link: #9aceef;
  --on-accent: #09131d;
  --accent-hover: #c3e6fc;
  --line: #345269;
  --control-border: #7795aa;
  --focus: #d9efff;
}
.v3 {
  --bg: #faf9f6;
  --ink: #203747;
  --muted: #4b6070;
  --panel: #edf2f5;
  --surface: #faf9f6;
  --hover-surface: #e5edf3;
  --accent: #205b83;
  --link: #205b83;
}
.v4 { --bg: #f3f7fb; --panel: #ffffff; }
html { color-scheme: light; scroll-padding-bottom: 100px; }
html:has(.v2) { color-scheme: dark; }

/* Reliable text contrast, including metadata and hover states. */
.card-number, .v2 .card-number { color: var(--muted); opacity: 1; }
.topline, .v2 .topline, .v4 .topline { background: var(--panel); color: var(--ink); }
.v3 .topline { background: #173a53; color: #f3f8fc; }
.header nav a.is-active, .header nav a:hover { color: var(--link); }
.header nav a::after { background: var(--link); }
.button, .v2 .button, .mobile-contact a:first-child, .v2 .mobile-contact a:first-child {
  background: var(--accent); color: var(--on-accent); border-color: var(--accent);
}
.button:hover, .mobile-contact a:first-child:hover { background: var(--accent-hover); filter: none; }
.text-link { color: var(--link); text-decoration: underline; text-underline-offset: 5px; border-bottom: 0; }
.text-link:hover, .resource-links a:hover, .contact-info > a:hover, .email:hover .email-copy {
  color: var(--link); text-decoration: underline; text-underline-offset: 5px;
}
.service-card > span.card-more, .resource-links a span { color: var(--link); }
.service-card, .v1 .service-card, .v2 .service-card, .v4 .service-card {
  background: var(--surface); border-color: var(--line);
}
.service-card:hover, .v1 .service-card:hover, .v2 .service-card:hover,
.v3 .service-card:hover, .v4 .service-card:hover, .service-card:focus-visible {
  background: var(--hover-surface); border-color: var(--link);
}
.service-icon, .v1 .service-icon, .v4 .service-icon, .trust .icon {
  color: var(--link); background: var(--hover-surface);
}
.v3 .service-icon, .v2 .service-icon { background: transparent; }
.v1 .contact-info, .v1 .electric, .v2 .electric, .v3 .electric { background: var(--panel); }
.v3 .contact-info { background: var(--panel); }
.v2 .visit li > span { background: var(--panel); }
.v1 .image-label { background: #ffffff; color: #172f40; }
.v1 .image-label span { color: #485d6e; font-size: 11px; }
.v2 .sport-stamp { background: #09131d; border-color: var(--control-border); }
.v2 .vertical-label { background: #09131d; color: #f3f8fc; padding: 12px 8px; border-radius: 4px; font-size: 11px; }
.v2 .sport-image > img { filter: brightness(.82) saturate(.8); }
.v2 .about img { filter: none; }

/* Blue service hub: remove unrelated green and violet hues. */
.v4 .bento-main { background: #e7f0f7; border-color: var(--line); }
.v4 .electric-card { background: #e7f0f7; color: #173a53; border-color: var(--line); }
.v4 .electric-card:hover { background: #dbe9f3; }
.v4 .quick-contact { background: #155680; color: #ffffff; --focus: #ffffff; }
.v4 .quick-contact:hover { background: #103f60; }
.v4 .quick-contact small { color: #e7f0f7; }
.v4 .quick-service { background: var(--surface); }
.v4 .quick-service button { background: #f1f6fa; border: 1px solid var(--control-border); color: #173a53; }
.v4 .quick-service button:hover { background: #dbe9f3; border-color: var(--link); }
.v4 .electric {
  --ink: #ffffff; --muted: #c9dce9; --link: #d6ecfb; --focus: #ffffff;
  background: #173a53; color: var(--ink);
}
.v4 .electric .eyebrow, .v4 .electric p:not(.eyebrow) { color: var(--muted); }
.v4 .electric .text-link, .v4 .electric .text-link:hover { color: var(--link); }

/* Controls and focus must remain visible on light and dark surfaces. */
.menu, .mobile-contact a { border-color: var(--control-border); }
.menu:hover, .close-dialog:hover, .mobile-contact a:last-child:hover { background: var(--hover-surface); }
:is(a, button):focus-visible, .button:focus-visible, .mobile-contact a:first-child:focus-visible {
  outline: 3px solid var(--focus); outline-offset: 5px;
}
.v4 .quick-contact:focus-visible { outline-color: #155680; }
.design-switch { background: #132d40; color: #ffffff; --focus: #ffffff; backdrop-filter: none; }
.design-switch a:first-child { color: #e2edf5; }
.design-switch a:hover { background: #31566f; }
.design-switch a[aria-current], .design-switch a[aria-current]:hover { background: #ffffff; color: #132d40; }
.skip { --focus: #155680; }
dialog { overscroll-behavior: contain; }

.overview { background: #f3f7fb; color: #172f40; }
.overview h1 span, .overview main > p, .overview .info small, .overview .info p, .overview footer { color: #485d6e; }
.overview article { background: #ffffff; border-color: #cedbe5; }
.overview .arrow { color: #155680; border-color: #6c8090; }
.overview a:hover .arrow { background: #155680; color: #ffffff; }
.overview a:focus-visible { outline: 3px solid #155680; outline-offset: 5px; border-radius: 14px; }
@media (forced-colors: active) {
  :is(a, button):focus-visible, .button:focus-visible, .mobile-contact a:first-child:focus-visible,
  .overview a:focus-visible, .v4 .quick-contact:focus-visible { outline-color: Highlight; }
  .service-card, .button, .menu, .mobile-contact a, .v4 .quick-service button { border: 1px solid ButtonText; }
  .header nav a.is-active, .design-switch a[aria-current] { text-decoration: underline; }
}
