/*
 * Súbor: css/palettes/pripojky.css
 * Obsah: Farebná téma prípojok: základná modrá, akcenty jednotlivých sietí, tematické tlačidlá a pravidlá hero.
 * Použitie: sluzba-pripojky.html.
 * Zapojenie: <link rel="stylesheet" href="css/palettes/pripojky.css">; zachovaj pozíciu v hlavičke podľa css/README.md.
 * Závislosti: voliteľný farebný token z components/cross-page-cta.css (s vlastnou záložnou farbou); iba html[data-palette="pripojky"]; vlastné --palette-* a nadväzujúce tematické premenné.
 * Nezávislosť: bez importu inej palety. Každá stránka načítava iba svoju paletu.
 */
html[data-palette="pripojky"] {
  --palette-light: #F2F1ED;
  --palette-light-alt: #DCD5CB;
  --palette-sand: #DCD5CB;
  --palette-dark: #243142;
  --palette-blue: var(--cross-page-cta-blue, #13BFEA);
  --palette-orange: #E08A2E;
  --palette-yellow: #F3C43A;
  --palette-red: #E4604E;
  --palette-taupe: var(--palette-blue);
  --palette-light-rgb: 242 241 237;
  --palette-dark-rgb: 36 49 66;
  --palette-sand-rgb: 220 213 203;
  --connection-accent: var(--palette-blue);
  --connection-accent-rgb: 19 191 234;
  --bg: var(--palette-light);
  --bg-alt: var(--palette-light-alt);
  --surface: var(--palette-light);
  --text: var(--palette-dark);
  --muted: var(--palette-dark);
  --border: var(--palette-sand);
  --border-strong: var(--palette-dark);
  --accent: var(--connection-accent);
  --accent-hover: color-mix(in srgb, var(--connection-accent) 85%, var(--palette-dark));
  --accent-soft: color-mix(in srgb, var(--connection-accent) 12%, var(--palette-light));
  --footer: var(--palette-dark);
  --footer-text: var(--palette-light);
  --footer-muted: var(--palette-sand);
  --success: var(--palette-dark);
  --error: var(--palette-dark);
}

html[data-palette="pripojky"] [data-connection] {
  --accent: var(--connection-accent);
  --accent-hover: color-mix(in srgb, var(--connection-accent) 85%, var(--palette-dark));
  --accent-soft: color-mix(in srgb, var(--connection-accent) 12%, var(--palette-light));
}
html[data-palette="pripojky"] [data-connection="kanalizacia"] {
  --connection-accent: var(--palette-orange);
  --connection-accent-rgb: 224 138 46;
}
html[data-palette="pripojky"] [data-connection="plyn"] {
  --connection-accent: var(--palette-yellow);
  --connection-accent-rgb: 243 196 58;
}
html[data-palette="pripojky"] [data-connection="elektrika"] {
  --connection-accent: var(--palette-red);
  --connection-accent-rgb: 228 96 78;
}

/* Dark text on bright accents keeps buttons and small labels readable. */
html[data-palette="pripojky"] .btn--primary,
html[data-palette="pripojky"] .scope-choice[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .btn--primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}
html[data-palette="pripojky"] .btn--secondary {
  background: var(--palette-light);
  color: var(--palette-dark);
  border-color: var(--accent);
}
html[data-palette="pripojky"] .btn--secondary:hover {
  background: var(--accent-soft);
}
html[data-palette="pripojky"] :is(a, button, input, select, textarea):focus-visible {
  outline-color: var(--accent);
}
html[data-palette="pripojky"] .eyebrow,
html[data-palette="pripojky"] .text-link {
  color: var(--palette-dark);
  text-decoration-color: var(--accent);
}
html[data-palette="pripojky"] .section-head .eyebrow {
  border-left: 3px solid var(--accent);
  padding-left: 10px;
}
html[data-palette="pripojky"] .connection-services .section-head .eyebrow {
  border-left: 0;
  padding-left: 0;
}
html[data-palette="pripojky"] .text-link {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-underline-offset: 5px;
}
html[data-palette="pripojky"] .card {
  border-top: 3px solid var(--accent);
  box-shadow: 0 5px 18px rgb(var(--palette-dark-rgb) / 4%);
}
html[data-palette="pripojky"] .header-logo-wordmark {
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .nav-link--page::before,
html[data-palette="pripojky"] .hero-accent-line {
  background: var(--accent);
}
html[data-palette="pripojky"] .breadcrumb {
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .hero-intro .breadcrumb {
  background: rgb(var(--palette-dark-rgb) / 88%);
  color: var(--palette-light);
}
html[data-palette="pripojky"] .hero::before {
  background: linear-gradient(90deg, rgb(var(--palette-dark-rgb) / 62%), rgb(var(--palette-dark-rgb) / 34%) 48%, rgb(var(--palette-dark-rgb) / 12%));
}
html[data-palette="pripojky"] .hero-copy::before {
  background: rgb(var(--palette-dark-rgb) / 14%);
  box-shadow: 0 0 24px 12px rgb(var(--palette-dark-rgb) / 6%);
}
html[data-palette="pripojky"] .hero .eyebrow {
  color: var(--palette-blue);
}
html[data-palette="pripojky"] .hero-division-brand {
  background: rgb(var(--palette-dark-rgb) / 76%);
}
html[data-palette="pripojky"] .hero-service-label {
  background: var(--palette-blue);
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .trust-counter-number {
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .trust-counter {
  border-bottom: 3px solid var(--accent);
}
html[data-palette="pripojky"] .service-offering-copy {
  border-left: 3px solid var(--accent);
  padding-left: 12px;
}
html[data-palette="pripojky"] .warranty-band h2 {
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .warranty-band {
  background: var(--palette-light);
}
html[data-palette="pripojky"] .warranty-point {
  background: var(--palette-dark);
}
html[data-palette="pripojky"] .warranty-icon,
html[data-palette="pripojky"] .turnkey-services__icon {
  background: var(--accent);
  color: var(--palette-dark);
  border-color: var(--accent);
}
html[data-palette="pripojky"] .warranty-point p {
  color: var(--palette-light);
}
html[data-palette="pripojky"] .benefits-strip {
  background: var(--palette-blue);
}
html[data-palette="pripojky"] .step-number {
  color: var(--palette-dark);
}
html[data-palette="pripojky"] .location-map-dot {
  background: var(--palette-blue);
  border-color: var(--palette-light);
  box-shadow: 0 1px 5px rgb(var(--palette-dark-rgb) / 25%);
}
html[data-palette="pripojky"] .location-list p {
  color: var(--palette-dark);
  text-shadow: 0 1px 2px rgb(var(--palette-light-rgb) / 80%);
}
html[data-palette="pripojky"] .location-map-connectors {
  stroke: var(--palette-blue);
}

/* Match the green/red offer comparison on the retaining-wall service page. */
html[data-palette="pripojky"] .pricing-compare,
html[data-palette="pripojky"] .quality-compare {
  --success: #2F6B4F;
  --error: #B42318;
}

html[data-palette="pripojky"] .work-process {
  --process-sand: var(--palette-blue);
}
html[data-palette="pripojky"] .work-process__heading,
html[data-palette="pripojky"] .work-process__number,
html[data-palette="pripojky"] .work-process__card {
  background: rgb(var(--palette-dark-rgb) / 85%);
}
html[data-palette="pripojky"] .footer-title,
html[data-palette="pripojky"] .footer-links a:hover {
  color: var(--palette-blue);
}

@media (max-width: 767px) {
  html[data-palette="pripojky"] .hero-intro .hero::before {
    /* Use the connections hero photo on mobile as well. */
    background: url('../../VSETKY_IMG/SLUZBA_PRIPOJKY/hero/pripojky_hero.png') center / cover no-repeat;
  }
  html[data-palette="pripojky"] .hero-copy {
    background: var(--palette-dark);
  }
}