/* Stage 9 visual and animation polish overrides
 *
 * This stylesheet introduces a variety of design refinements and subtle
 * animations inspired by the референса reference.  It lightens heavy
 * overlays, polishes cards and chips, adds a gentle motion layer
 * triggered on scroll, and refines forms and FAQs for a more premium
 * feel.  All overrides are additive so existing class names and
 * structure remain intact.  No heavy libraries are used.
 */

/* Root variables for colours and reusable values */
:root {
  /* Deep navy accent used for numbers, icons and call‑to‑action buttons */
  --accent-color: #1f3e7a;
  /* Base card background with slight transparency */
  --card-bg: rgba(255, 255, 255, 0.05);
  /* Hover state for cards */
  --card-bg-hover: rgba(255, 255, 255, 0.1);
  /* Default box shadow for cards */
  --card-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  /* Base chip (tag) background */
  --chip-bg: rgba(255, 255, 255, 0.15);
  /* Hover state for chips */
  --chip-bg-hover: rgba(255, 255, 255, 0.25);
}

/* --------------------------------------------------
 * Hero overlays and panels
 *
 * Reduce the opaqueness of hero backgrounds and text panels to
 * allow underlying photography to show through while keeping text
 * legible. Increase blur radius for a softer separation.
 */
.hero-slide__overlay {
  background: linear-gradient(
      90deg,
      rgba(15, 23, 42, 0.6) 0%,
      rgba(15, 23, 42, 0.35) 40%,
      rgba(15, 23, 42, 0.1) 100%
    ),
    linear-gradient(
      180deg,
      rgba(15, 23, 42, 0.45) 0%,
      rgba(15, 23, 42, 0.3) 60%,
      rgba(15, 23, 42, 0.2) 100%
    );
}

.hero-slide__content {
  background: rgba(15, 23, 42, 0.35);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
}

/*
 * Lighten service and secondary hero overlays
 *
 * Service, call‑to‑action and contact pages reuse the base hero styles from
 * stage1.css, which apply a fairly dark gradient overlay on top of the
 * background images.  To bring these pages in line with the lighter look of
 * the home page hero, we override the gradient and add a subtle blur.  A
 * slightly stronger overlay is used on narrow viewports for legibility.
 */
.hero--service::before {
  background: linear-gradient(
    180deg,
    rgba(8, 15, 29, 0.35) 0%,
    rgba(8, 15, 29, 0.25) 50%,
    rgba(8, 15, 29, 0.15) 100%
  );
  backdrop-filter: blur(10px);
}

@media (max-width: 767px) {
  .hero--service::before {
    background: linear-gradient(
      180deg,
      rgba(8, 15, 29, 0.45) 0%,
      rgba(8, 15, 29, 0.35) 50%,
      rgba(8, 15, 29, 0.25) 100%
    );
  }
}

/* Lighten call and contacts hero backgrounds (use same hero image but reduce gradient density) */
.hero--call,
.hero--contacts {
  background-image: linear-gradient(rgba(15, 23, 42, 0.35), rgba(15, 23, 42, 0.35)),
    url("../img/slider/hero-1.jpg");
}

@media (max-width: 767px) {
  .hero--call,
  .hero--contacts {
    background-image: linear-gradient(rgba(15, 23, 42, 0.45), rgba(15, 23, 42, 0.45)),
      url("../img/slider/hero-1.jpg");
  }
}

/* --------------------------------------------------
 * Rotator flip animation
 *
 * The rotating tagline under the hero heading now uses a 3D flip
 * animation reminiscent of референса.  Each message sits on its
 * own layer and rotates into view from 90 degrees while the
 * outgoing message flips away.  Fallback to fade transitions for
 * users who prefer reduced motion.
 */
.hero-rotator {
  position: relative;
  display: inline-block;
  perspective: 1000px;
}
.hero-rotator .rotator-item {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
  transform: rotateX(90deg);
}
.hero-rotator .rotator-item.active {
  opacity: 1;
  transform: rotateX(0deg);
  position: relative;
}
.hero-rotator .rotator-item.enter {
  animation: rotatorFlipIn 0.55s forwards;
}
.hero-rotator .rotator-item.exit {
  animation: rotatorFlipOut 0.55s forwards;
}

@keyframes rotatorFlipIn {
  from {
    transform: rotateX(90deg);
    opacity: 0;
  }
  to {
    transform: rotateX(0deg);
    opacity: 1;
  }
}
@keyframes rotatorFlipOut {
  from {
    transform: rotateX(0deg);
    opacity: 1;
  }
  to {
    transform: rotateX(-90deg);
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-rotator .rotator-item {
    transition: opacity 0.4s ease;
    transform: none !important;
    position: absolute;
  }
  .hero-rotator .rotator-item.active {
    position: relative;
  }
}

/* --------------------------------------------------
 * Global card styling
 *
 * Apply a unified look to various cards across the site: directions,
 * services, reasons, process steps, urgent items, contact cards,
 * reasons lists and process/situations lists.  Cards have
 * translucent backgrounds, soft blur, rounded corners and
 * responsive drop shadows.  They subtly lift on hover.
 */
.direction-card,
.service-card,
.reason,
.process-step,
.urgent-item,
.contact-card,
.reasons-list li,
.process-grid li,
.situations-list li {
  background: var(--card-bg);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: var(--card-shadow);
  transition: transform 0.3s ease, box-shadow 0.3s ease,
    background 0.3s ease;
}

.direction-card:hover,
.service-card:hover,
.reason:hover,
.process-step:hover,
.urgent-item:hover,
.contact-card:hover,
.reasons-list li:hover,
.process-grid li:hover,
.situations-list li:hover {
  background: var(--card-bg-hover);
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

/* --------------------------------------------------
 * Chips and hero benefits
 *
 * Tags and hero benefit items become glassy pills with a small
 * accent dot. They lift slightly on hover for subtle feedback.
 */
.chip,
.tag,
.hero-benefits li {
  background: var(--chip-bg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 999px;
  padding: 0.35rem 0.8rem;
  display: inline-flex;
  align-items: center;
  color: #fff;
  font-weight: 500;
  line-height: 1.2;
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
  transition: background 0.3s ease, transform 0.3s ease;
}

.chip:hover,
.tag:hover,
.hero-benefits li:hover {
  background: var(--chip-bg-hover);
  transform: translateY(-2px);
}

.hero-benefits li::before {
  content: '';
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  margin-right: 0.5rem;
  background: var(--accent-color);
  border-radius: 50%;
}

/* Category‑specific chip colours with a translucent wash */
.chip--plumbing,
.tag--plumbing {
  background: rgba(59, 130, 246, 0.2);
}
.chip--electric,
.tag--electric {
  background: rgba(16, 185, 129, 0.2);
}
.chip--appliance,
.tag--appliance {
  background: rgba(234, 179, 8, 0.2);
}
.chip--split,
.tag--split {
  background: rgba(244, 63, 94, 0.2);
}
.chip--plumbing:hover,
.tag--plumbing:hover {
  background: rgba(59, 130, 246, 0.35);
}
.chip--electric:hover,
.tag--electric:hover {
  background: rgba(16, 185, 129, 0.35);
}
.chip--appliance:hover,
.tag--appliance:hover {
  background: rgba(234, 179, 8, 0.35);
}
.chip--split:hover,
.tag--split:hover {
  background: rgba(244, 63, 94, 0.35);
}

/* --------------------------------------------------
 * Grid refinements
 *
 * Use CSS Grid for responsive, evenly spaced layouts for reasons,
 * process steps, urgent cases, popular services, and contact
 * cards.
 */
.reasons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.5rem;
}

.urgent-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
}

.popular-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
}

.contacts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.5rem;
}

/* Process steps: number styling */
.process-step {
  position: relative;
  padding-top: 2.5rem;
}
.process-step .process-number {
  position: absolute;
  top: -1rem;
  left: 1rem;
  background: var(--accent-color);
  color: #fff;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

/* Typography inside cards */
.service-card h3,
.direction-card h3,
.contact-card h3,
.reason h3,
.process-step h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-size: 1.25rem;
  color: #fff;
}
.reason p,
.service-card p,
.direction-card p,
.contact-card p,
.process-step p,
.reasons-list li,
.process-grid li,
.situations-list li {
  color: #e2e8f0;
  margin: 0;
  line-height: 1.5;
}

/* Pricing text emphasised */
.service-card .price {
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 1rem;
}

/* Buttons refinement */
.btn-secondary {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: none;
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.btn-secondary:hover {
  background: rgba(255, 255, 255, 0.25);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  transform: translateY(-2px);
}

/* Contact links styling */
.contact-card a {
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease;
  color: #e2e8f0;
}
.contact-card a:hover {
  border-color: currentColor;
}

/* Footer: hide diagnostic note */
.footer-bottom .diag-note {
  display: none;
}

/* --------------------------------------------------
 * Reveal‑on‑scroll animation
 *
 * Elements with the .reveal-on-scroll class will fade in and
 * translate up when they enter the viewport.  A custom delay can
 * be supplied via the data-delay attribute which populates the
 * CSS variable --delay.  Reduced motion preferences are respected.
 */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  transition-delay: var(--delay, 0ms);
}
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* --------------------------------------------------
 * FAQ enhancements
 *
 * Modernise the FAQ accordion with card styling, subtle toggles and
 * improved readability.  Icons rotate to indicate open state.
 */
.faq-list details {
  background: var(--card-bg);
  border-radius: 12px;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  box-shadow: var(--card-shadow);
  overflow: hidden;
}
.faq-list summary {
  font-weight: 600;
  cursor: pointer;
  outline: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary::after {
  content: '▼';
  font-size: 0.8rem;
  margin-left: 0.5rem;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}
.faq-list details[open] summary::after {
  transform: rotate(180deg);
}
.faq-list p {
  margin: 0.5rem 0 0;
  color: #e2e8f0;
}

/* --------------------------------------------------
 * Forms refinement
 *
 * The call‑to‑action forms become light, airy cards with
 * high‑contrast fields and soft focus states.  Buttons mirror the
 * accent colour palette.
 */
.form-wrapper {
  background: var(--card-bg);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 16px;
  box-shadow: var(--card-shadow);
  padding: 2rem;
}
.question-form label {
  display: block;
  margin-bottom: 0.25rem;
  font-weight: 600;
  color: #e2e8f0;
}
.question-form input,
.question-form select,
.question-form textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 8px;
  color: #fff;
  font-size: 1rem;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.question-form input:focus,
.question-form select:focus,
.question-form textarea:focus {
  outline: none;
  border-color: var(--accent-color);
  background: rgba(255, 255, 255, 0.15);
}
.question-form ::placeholder {
  color: #94a3b8;
}
.question-form .btn {
  background: var(--accent-color);
  color: #fff;
  padding: 0.75rem 1.5rem;
  border-radius: 999px;
  font-weight: 600;
  box-shadow: 0 4px 20px rgba(31, 62, 122, 0.4);
  transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.question-form .btn:hover {
  background: #254f9f;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(31, 62, 122, 0.5);
}

/* CTA buttons unify spacing on smaller screens */
@media (max-width: 600px) {
  .hero-buttons {
    flex-direction: column;
  }
  .hero-buttons .btn {
    width: 100%;
  }
}

/* Section spacing to separate content blocks more clearly */
.section {
  margin-bottom: 4rem;
}
/* ==================================================
   Surgical Step 2: референса-style home hero
   Scope: index.html only via .hero-slider--doctorfix
   ================================================== */
.hero-slider--doctorfix {
  background: #08111f;
  isolation: isolate;
}

.hero-slider--doctorfix .hero-slider__slides {
  height: min(860px, calc(100svh - 76px));
  min-height: 690px;
}

.hero-slider--doctorfix .hero-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  background-position: center center;
}

.hero-slider--doctorfix .hero-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 42%, rgba(34, 211, 238, 0.10), transparent 36%),
    linear-gradient(180deg, rgba(4, 10, 22, 0.48) 0%, rgba(4, 10, 22, 0.54) 45%, rgba(4, 10, 22, 0.68) 100%);
}

.hero-slider--doctorfix .hero-slide__overlay {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(3, 7, 18, 0.25) 0%, rgba(3, 7, 18, 0.50) 45%, rgba(3, 7, 18, 0.78) 100%),
    linear-gradient(90deg, rgba(3, 7, 18, 0.20) 0%, rgba(3, 7, 18, 0.10) 50%, rgba(3, 7, 18, 0.22) 100%);
}

.hero-slider--doctorfix .hero-slide__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: min(980px, calc(100% - 32px));
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 18px 32px;
  text-align: center;
  color: #fff;
  background: transparent !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.hero-slider--doctorfix .hero-slide__content h1,
.hero-slider--doctorfix .hero-slide__content .hero-title,
.hero-slider--doctorfix .hero-rotator--main {
  width: 100%;
  max-width: 940px;
  margin: 0 auto 22px;
  color: #fff;
  font-size: clamp(2.25rem, 6.4vw, 4.75rem);
  line-height: 1.04;
  font-weight: 900;
  letter-spacing: -0.055em;
  text-align: center;
  text-wrap: balance;
  text-shadow: 0 5px 28px rgba(0,0,0,0.58), 0 1px 0 rgba(255,255,255,0.05);
}

.hero-slider--doctorfix .hero-rotator--main {
  display: block;
  min-height: 2.16em;
  perspective: 1200px;
}

.hero-slider--doctorfix .hero-rotator--main .rotator-item {
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  transform-origin: 50% 65%;
}

.hero-slider--doctorfix .hero-rotator--main .rotator-item.enter {
  animation: profidomHeroRollIn 0.64s cubic-bezier(.2,.85,.2,1) forwards;
}

.hero-slider--doctorfix .hero-rotator--main .rotator-item.exit {
  animation: profidomHeroRollOut 0.52s cubic-bezier(.55,0,.35,1) forwards;
}

@keyframes profidomHeroRollIn {
  0% {
    opacity: 0;
    transform: translateY(26px) rotateX(84deg) scale(0.98);
    filter: blur(8px);
  }
  58% {
    opacity: 1;
    transform: translateY(-3px) rotateX(-8deg) scale(1.01);
    filter: blur(0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotateX(0deg) scale(1);
    filter: blur(0);
  }
}

@keyframes profidomHeroRollOut {
  0% {
    opacity: 1;
    transform: translateY(0) rotateX(0deg) scale(1);
    filter: blur(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-24px) rotateX(-84deg) scale(0.98);
    filter: blur(7px);
  }
}

.hero-slider--doctorfix .hero-slide__subtitle {
  max-width: 850px;
  margin: 0 auto 26px;
  color: rgba(255,255,255,0.92);
  font-size: clamp(1.18rem, 2.8vw, 1.85rem);
  line-height: 1.55;
  font-weight: 500;
  text-align: center;
  text-shadow: 0 3px 16px rgba(0,0,0,0.52);
  text-wrap: balance;
}

.hero-slider--doctorfix .hero-service-points {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: min(740px, 100%);
  margin: 0 auto 28px;
}

.hero-slider--doctorfix .hero-service-point {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  min-height: 60px;
  padding: 14px 30px 14px 42px;
  border-radius: 999px;
  color: #fff;
  background: rgba(17, 24, 39, 0.62);
  border: 1px solid rgba(255,255,255,0.22);
  box-shadow: 0 20px 42px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.12);
  backdrop-filter: blur(12px) saturate(130%);
  -webkit-backdrop-filter: blur(12px) saturate(130%);
  font-size: clamp(1.0rem, 2.25vw, 1.35rem);
  font-weight: 800;
  letter-spacing: 0.01em;
  text-align: center;
  text-shadow: 0 3px 12px rgba(0,0,0,0.35);
}

.hero-slider--doctorfix .hero-service-point::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: #22d3ee;
  box-shadow: 0 0 18px rgba(34,211,238,0.72);
}

.hero-slider--doctorfix .hero-buttons--doctorfix {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: min(760px, 100%);
  margin: 4px auto 0;
}

.hero-slider--doctorfix .hero-main-btn,
.hero-slider--doctorfix .hero-secondary-btn {
  width: min(680px, 100%);
  min-height: 76px;
  border-radius: 28px;
  font-size: clamp(1.15rem, 4.2vw, 2.05rem);
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  text-align: center;
}

.hero-slider--doctorfix .hero-main-btn {
  background: linear-gradient(135deg, #14ace5 0%, #22d3ee 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 24px 52px rgba(14,165,233,0.36), inset 0 1px 0 rgba(255,255,255,0.18) !important;
}

.hero-slider--doctorfix .hero-main-btn:hover {
  transform: translateY(-3px) scale(1.01);
  box-shadow: 0 30px 64px rgba(14,165,233,0.44), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}

.hero-slider--doctorfix .hero-secondary-btn {
  background: rgba(15, 23, 42, 0.30) !important;
  color: #fff !important;
  border: 1.5px solid rgba(255,255,255,0.42) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), 0 18px 42px rgba(0,0,0,0.18) !important;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}

.hero-slider--doctorfix .hero-secondary-btn:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.70) !important;
  transform: translateY(-2px);
}

.hero-slider--doctorfix .hero-slider__indicators {
  bottom: 34px;
  gap: 14px;
}

.hero-slider--doctorfix .indicator {
  width: 19px;
  height: 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.68);
  box-shadow: 0 5px 14px rgba(0,0,0,0.22);
}

.hero-slider--doctorfix .indicator.active {
  width: 28px;
  background: #fff;
}

.hero-slider--doctorfix .hero-slide__content > * {
  opacity: 0;
  transform: translateY(22px);
}

.hero-slider--doctorfix .hero-slide.active .hero-slide__content > * {
  animation: profidomHeroIntro 0.76s cubic-bezier(.2,.75,.2,1) forwards;
}

.hero-slider--doctorfix .hero-slide.active .hero-slide__content > *:nth-child(1) { animation-delay: 0.06s; }
.hero-slider--doctorfix .hero-slide.active .hero-slide__content > *:nth-child(2) { animation-delay: 0.15s; }
.hero-slider--doctorfix .hero-slide.active .hero-slide__content > *:nth-child(3) { animation-delay: 0.24s; }
.hero-slider--doctorfix .hero-slide.active .hero-slide__content > *:nth-child(4) { animation-delay: 0.33s; }

@keyframes profidomHeroIntro {
  from {
    opacity: 0;
    transform: translateY(24px);
    filter: blur(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@media (min-width: 981px) {
  .hero-slider--doctorfix .hero-slider__slides {
    height: min(860px, calc(100svh - 78px));
    min-height: 720px;
  }
  .hero-slider--doctorfix .hero-buttons--doctorfix {
    margin-top: 10px;
  }
}

@media (max-width: 980px) {
  .hero-slider--doctorfix .hero-slider__slides {
    height: calc(100svh - 104px);
    min-height: 760px;
  }
  .hero-slider--doctorfix .hero-slide {
    align-items: center;
  }
  .hero-slider--doctorfix .hero-slide__content {
    width: 100%;
    max-width: 100%;
    padding: 24px 26px 76px;
  }
  .hero-slider--doctorfix .hero-slide__content h1,
  .hero-slider--doctorfix .hero-slide__content .hero-title,
  .hero-slider--doctorfix .hero-rotator--main {
    font-size: clamp(2.15rem, 9.7vw, 3.08rem);
    line-height: 1.08;
    margin-bottom: 24px;
    min-height: 2.34em;
  }
  .hero-slider--doctorfix .hero-slide__subtitle {
    font-size: clamp(1.08rem, 4.7vw, 1.42rem);
    line-height: 1.58;
    margin-bottom: 24px;
  }
  .hero-slider--doctorfix .hero-service-points {
    gap: 14px;
    margin-bottom: 24px;
  }
  .hero-slider--doctorfix .hero-service-point {
    min-height: 54px;
    padding: 12px 20px 12px 38px;
    font-size: clamp(0.98rem, 4vw, 1.18rem);
  }
  .hero-slider--doctorfix .hero-service-point::before {
    left: 20px;
    width: 7px;
    height: 7px;
  }
  .hero-slider--doctorfix .hero-main-btn,
  .hero-slider--doctorfix .hero-secondary-btn {
    min-height: 74px;
    border-radius: 25px;
    font-size: clamp(1.22rem, 6.6vw, 1.72rem);
    letter-spacing: 0.07em;
  }
  .hero-slider--doctorfix .hero-slider__indicators {
    bottom: 26px;
  }
}

@media (max-width: 390px) {
  .hero-slider--doctorfix .hero-slider__slides {
    min-height: 735px;
  }
  .hero-slider--doctorfix .hero-slide__content {
    padding-left: 18px;
    padding-right: 18px;
    padding-bottom: 70px;
  }
  .hero-slider--doctorfix .hero-slide__content h1,
  .hero-slider--doctorfix .hero-slide__content .hero-title,
  .hero-slider--doctorfix .hero-rotator--main {
    font-size: clamp(1.98rem, 9.2vw, 2.72rem);
  }
  .hero-slider--doctorfix .hero-main-btn,
  .hero-slider--doctorfix .hero-secondary-btn {
    min-height: 68px;
    border-radius: 22px;
    font-size: clamp(1.04rem, 6vw, 1.42rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slider--doctorfix .hero-slide__content > *,
  .hero-slider--doctorfix .hero-slide.active .hero-slide__content > *,
  .hero-slider--doctorfix .hero-rotator--main .rotator-item,
  .hero-slider--doctorfix .hero-rotator--main .rotator-item.enter,
  .hero-slider--doctorfix .hero-rotator--main .rotator-item.exit {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
}


/* ================================================================
   Surgical step: premium directions + popular services
   --------------------------------------------------------------- */
.section-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin: 0 auto .75rem;
  padding: .45rem .9rem;
  border-radius: 999px;
  background: rgba(11, 168, 224, .12);
  color: #0B5E9E;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.section-kicker::before {
  content: '';
  width: .48rem;
  height: .48rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #18bff2, #0B5E9E);
  box-shadow: 0 0 0 5px rgba(24, 191, 242, .14);
}
.directions--surgical .container,
.popular-services--surgical .container {
  text-align: center;
}
.directions--surgical {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 15% 10%, rgba(28, 190, 244, .16), transparent 34%),
    linear-gradient(180deg, #eef9ff 0%, #ffffff 72%);
  padding-top: 4.2rem;
  padding-bottom: 4.2rem;
}
.directions--surgical h2,
.popular-services--surgical h2 {
  color: #07172f;
  font-weight: 900;
  letter-spacing: -.035em;
}
.directions-grid--premium,
.popular-services-grid--premium {
  text-align: left;
}
.directions-grid--premium {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.15rem;
}
.direction-card {
  position: relative;
  isolation: isolate;
  min-height: 100%;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255,255,255,.82) !important;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .10) !important;
  border-radius: 24px !important;
  padding: 1.35rem !important;
  color: #0f172a;
}
.direction-card::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .82;
  background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,255,255,.46));
}
.direction-card::after {
  content: '';
  position: absolute;
  inset: auto -20% -34% -20%;
  height: 42%;
  z-index: -1;
  border-radius: 50%;
  filter: blur(24px);
  opacity: .38;
  background: var(--direction-glow, rgba(24, 191, 242, .45));
  transition: transform .35s ease, opacity .35s ease;
}
.direction-card:hover {
  transform: translateY(-7px) !important;
  box-shadow: 0 28px 70px rgba(15, 23, 42, .18) !important;
}
.direction-card:hover::after {
  opacity: .64;
  transform: translateY(-10px);
}
.direction-card--plumbing { --direction-glow: rgba(37, 99, 235, .35); }
.direction-card--electric { --direction-glow: rgba(245, 158, 11, .38); }
.direction-card--appliance { --direction-glow: rgba(16, 185, 129, .35); }
.direction-card--split { --direction-glow: rgba(6, 182, 212, .38); }
.direction-icon {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  margin-bottom: 1rem;
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,255,255,.55));
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: 0 14px 34px rgba(15,23,42,.12);
  transition: transform .35s ease, box-shadow .35s ease;
}
.direction-card:hover .direction-icon {
  transform: translateY(-3px) scale(1.045) rotate(-2deg);
  box-shadow: 0 18px 45px rgba(15,23,42,.18);
}
.direction-icon svg {
  width: 36px;
  height: 36px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.direction-icon--plumbing { color: #2563eb; }
.direction-icon--electric { color: #f59e0b; }
.direction-icon--appliance { color: #059669; }
.direction-icon--split { color: #0891b2; }
.direction-card h3,
.direction-card p {
  color: #0f172a !important;
}
.direction-card h3 {
  font-size: 1.18rem !important;
  font-weight: 900;
  letter-spacing: -.02em;
}
.direction-description {
  min-height: 4.1em;
  color: #475569 !important;
}
.direction-tags {
  gap: .45rem;
}
.direction-tags .tag,
.service-mini-links a,
.service-card .chip {
  text-decoration: none;
}
.direction-tags .tag,
.service-card .chip {
  color: #0f172a !important;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
}
.tag--plumbing,.chip--plumbing { background: rgba(37, 99, 235, .13) !important; }
.tag--electric,.chip--electric { background: rgba(245, 158, 11, .18) !important; }
.tag--appliance,.chip--appliance { background: rgba(16, 185, 129, .15) !important; }
.tag--split,.chip--split { background: rgba(6, 182, 212, .16) !important; }
.direction-btn,
.service-card .service-btn {
  width: 100%;
  text-align: center;
  border-radius: 16px !important;
  padding: .85rem 1rem !important;
  font-weight: 900 !important;
  letter-spacing: .01em;
  box-shadow: 0 14px 30px rgba(11, 168, 224, .20);
}
.direction-btn--plumbing { background: linear-gradient(135deg, #1d9bf0, #2563eb) !important; }
.direction-btn--electric { background: linear-gradient(135deg, #fbbf24, #f59e0b) !important; color: #111827 !important; }
.direction-btn--appliance { background: linear-gradient(135deg, #34d399, #059669) !important; }
.direction-btn--split { background: linear-gradient(135deg, #22d3ee, #0891b2) !important; }

.popular-services--surgical {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  padding-top: 4rem;
  padding-bottom: 4.4rem;
}
.popular-services-grid--premium {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.15rem;
}
.service-card {
  position: relative;
  min-height: 100%;
  border: 1px solid rgba(15, 23, 42, .08);
  background: #ffffff !important;
  color: #0f172a;
  border-radius: 22px !important;
  padding: 1.25rem !important;
  box-shadow: 0 16px 45px rgba(15, 23, 42, .08) !important;
}
.service-card:hover {
  transform: translateY(-7px) !important;
  box-shadow: 0 28px 70px rgba(15, 23, 42, .15) !important;
}
.service-card h3,
.service-card p {
  color: #0f172a !important;
}
.service-card h3 {
  font-size: 1.08rem !important;
  font-weight: 900;
  letter-spacing: -.02em;
}
.service-card p {
  color: #526174 !important;
  min-height: 4.4em;
}
.service-card .price {
  color: #0B5E9E !important;
  font-size: 1.16rem !important;
  margin: 0 !important;
}
.service-card__bottom {
  display: grid;
  gap: .75rem;
  margin-top: auto;
  width: 100%;
}
.service-card .service-btn {
  background: linear-gradient(135deg, #1aaeea, #22d3ee) !important;
  color: #ffffff !important;
}
.service-card--featured {
  border-color: rgba(6,182,212,.26);
  background:
    radial-gradient(circle at 90% 0%, rgba(34,211,238,.18), transparent 34%),
    #ffffff !important;
}
.service-mini-links {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: .15rem 0 1rem;
}
.service-mini-links a {
  display: inline-flex;
  align-items: center;
  padding: .38rem .62rem;
  border-radius: 999px;
  background: rgba(6,182,212,.12);
  color: #075985;
  font-size: .74rem;
  font-weight: 800;
  border: 1px solid rgba(6,182,212,.18);
}
.service-mini-links a:hover {
  background: rgba(6,182,212,.22);
  transform: translateY(-1px);
}
.popular-actions .btn {
  border-radius: 18px !important;
  background: linear-gradient(135deg, #16afe4, #22d3ee) !important;
  color: #fff !important;
  box-shadow: 0 20px 42px rgba(34, 211, 238, .22);
}

@media (max-width: 1180px) {
  .directions-grid--premium,
  .popular-services-grid--premium {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .directions--surgical,
  .popular-services--surgical {
    padding-top: 3.2rem;
    padding-bottom: 3.2rem;
  }
  .directions-grid--premium,
  .popular-services-grid--premium {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .direction-card,
  .service-card {
    border-radius: 20px !important;
    padding: 1.15rem !important;
  }
  .direction-icon {
    width: 56px;
    height: 56px;
    border-radius: 18px;
  }
  .direction-icon svg {
    width: 32px;
    height: 32px;
  }
  .direction-description,
  .service-card p {
    min-height: 0;
  }
}

/* ================================================================
   Surgical step 4: premium "Почему выбирают" section
   Scope: home page reasons block only
   ================================================================ */
.reasons--surgical {
  position: relative;
  overflow: hidden;
  padding: 4.8rem 0 4.4rem;
  margin-bottom: 0;
  background:
    radial-gradient(circle at 18% 0%, rgba(24, 191, 242, .18), transparent 32%),
    radial-gradient(circle at 92% 24%, rgba(11, 94, 158, .12), transparent 34%),
    linear-gradient(180deg, #f6fbff 0%, #ffffff 100%);
}
.reasons--surgical::before {
  content: '';
  position: absolute;
  inset: 18px 18px auto auto;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(34,211,238,.18), rgba(37,99,235,.08));
  filter: blur(5px);
  pointer-events: none;
}
.reasons--surgical .container {
  position: relative;
  z-index: 1;
  text-align: center;
}
.reasons--surgical h2 {
  margin: 0 auto .85rem;
  color: #07172f;
  font-size: clamp(2rem, 5vw, 3.25rem);
  line-height: 1.06;
  font-weight: 950;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.reasons-subtitle {
  max-width: 790px;
  margin: 0 auto 2.2rem;
  color: #526174;
  font-size: clamp(1.02rem, 2.4vw, 1.22rem);
  line-height: 1.6;
  text-wrap: balance;
}
.reasons-showcase {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
  text-align: left;
}
.reason-card {
  --reason-accent: #18bff2;
  --reason-accent-2: #0B5E9E;
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  min-height: 100%;
  padding: 1.25rem;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(15, 23, 42, .08);
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.70));
  box-shadow: 0 18px 50px rgba(15, 23, 42, .09);
  transform: translateZ(0);
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.reason-card::before {
  content: '';
  position: absolute;
  inset: -35% -25% auto auto;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--reason-accent) 35%, transparent), transparent 68%);
  opacity: .85;
  pointer-events: none;
  transition: transform .45s ease, opacity .35s ease;
}
.reason-card::after {
  content: '';
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--reason-accent), var(--reason-accent-2));
  opacity: .8;
}
.reason-card:hover {
  transform: translateY(-7px);
  border-color: color-mix(in srgb, var(--reason-accent) 28%, rgba(15,23,42,.08));
  box-shadow: 0 30px 78px rgba(15, 23, 42, .16);
}
.reason-card:hover::before {
  opacity: 1;
  transform: translate(-10px, 10px) scale(1.1);
}
.reason-card__icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 22px;
  color: var(--reason-accent-2);
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.58)),
    linear-gradient(135deg, color-mix(in srgb, var(--reason-accent) 20%, transparent), transparent);
  border: 1px solid rgba(255,255,255,.75);
  box-shadow: 0 16px 38px rgba(15, 23, 42, .11), inset 0 1px 0 rgba(255,255,255,.72);
  transition: transform .35s ease, box-shadow .35s ease;
}
.reason-card:hover .reason-card__icon {
  transform: translateY(-3px) rotate(-3deg) scale(1.05);
  box-shadow: 0 22px 48px rgba(15, 23, 42, .18), inset 0 1px 0 rgba(255,255,255,.85);
}
.reason-card__icon svg {
  width: 36px;
  height: 36px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.reason-card__text {
  position: relative;
  z-index: 1;
}
.reason-card h3 {
  margin: .12rem 0 .45rem;
  color: #07172f;
  font-size: 1.16rem;
  line-height: 1.15;
  font-weight: 950;
  letter-spacing: -.025em;
}
.reason-card p {
  margin: 0;
  color: #526174;
  line-height: 1.55;
  font-size: .96rem;
}
.reason-card--blue { --reason-accent: #2bb8ff; --reason-accent-2: #0B5E9E; }
.reason-card--cyan { --reason-accent: #22d3ee; --reason-accent-2: #0891b2; }
.reason-card--green { --reason-accent: #34d399; --reason-accent-2: #059669; }
.reason-card--orange { --reason-accent: #fbbf24; --reason-accent-2: #d97706; }
.reason-card--purple { --reason-accent: #a78bfa; --reason-accent-2: #6d28d9; }
.reason-card--teal { --reason-accent: #2dd4bf; --reason-accent-2: #0f766e; }
.reasons-trust-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem;
  max-width: 880px;
  margin: 1.65rem auto 0;
  padding: .85rem;
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 16px 45px rgba(15,23,42,.08);
  backdrop-filter: blur(12px) saturate(130%);
  -webkit-backdrop-filter: blur(12px) saturate(130%);
}
.reasons-trust-strip span {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .62rem .9rem;
  border-radius: 999px;
  background: rgba(11, 168, 224, .10);
  color: #0B5E9E;
  font-weight: 900;
  font-size: .9rem;
}
.reasons-trust-strip span::before {
  content: '';
  width: .46rem;
  height: .46rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #18bff2, #0B5E9E);
  box-shadow: 0 0 0 5px rgba(24,191,242,.12);
}

@media (max-width: 1080px) {
  .reasons-showcase {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .reasons--surgical {
    padding: 3.3rem 0 3.1rem;
  }
  .reasons-showcase {
    grid-template-columns: 1fr;
    gap: .95rem;
  }
  .reason-card {
    grid-template-columns: auto 1fr;
    gap: .9rem;
    padding: 1.05rem;
    border-radius: 22px;
  }
  .reason-card__icon {
    width: 56px;
    height: 56px;
    border-radius: 19px;
  }
  .reason-card__icon svg {
    width: 31px;
    height: 31px;
  }
  .reason-card h3 {
    font-size: 1.06rem;
  }
  .reason-card p {
    font-size: .93rem;
  }
  .reasons-trust-strip {
    justify-content: flex-start;
    border-radius: 20px;
  }
  .reasons-trust-strip span {
    width: 100%;
    justify-content: center;
  }
}
@media (max-width: 380px) {
  .reason-card {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------------
 * Surgical step: homepage work process
 * A more premium timeline for the main page only.
 */
.home-process {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 14% 18%, rgba(34, 211, 238, 0.13), transparent 32%),
    radial-gradient(circle at 86% 12%, rgba(37, 99, 235, 0.12), transparent 30%),
    linear-gradient(180deg, #f8fbff 0%, #eef7ff 100%);
}

.home-process::before {
  content: '';
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 32px;
  pointer-events: none;
}

.process-head {
  max-width: 780px;
  margin: 0 auto 2.4rem;
  text-align: center;
}

.section-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  padding: 0.42rem 0.85rem;
  border-radius: 999px;
  background: rgba(9, 164, 228, 0.12);
  color: #0b5e9e;
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.section-kicker::before {
  content: '';
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #18bff2, #0b5e9e);
  box-shadow: 0 0 0 6px rgba(24, 191, 242, 0.14);
}

.process-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

.process-line {
  position: absolute;
  left: 6%;
  right: 6%;
  top: 54px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(24, 191, 242, 0.1), rgba(24, 191, 242, 0.85), rgba(11, 94, 158, 0.15));
  box-shadow: 0 10px 30px rgba(24, 191, 242, 0.22);
  z-index: 0;
}

.process-card {
  position: relative;
  z-index: 1;
  min-height: 250px;
  padding: 1.3rem 1.05rem 1.25rem;
  border: 1px solid rgba(11, 94, 158, 0.12);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(239, 249, 255, 0.86));
  box-shadow: 0 20px 55px rgba(15, 23, 42, 0.10);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.process-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(24, 191, 242, 0.16), transparent 42%);
  opacity: 0;
  transition: opacity .28s ease;
  pointer-events: none;
}

.process-card:hover {
  transform: translateY(-7px);
  border-color: rgba(24, 191, 242, 0.35);
  box-shadow: 0 28px 70px rgba(11, 94, 158, 0.18);
}

.process-card:hover::after {
  opacity: 1;
}

.process-badge {
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1ec8f5, #0b78c9);
  color: #fff;
  font-weight: 900;
  font-size: 0.92rem;
  box-shadow: 0 12px 30px rgba(24, 191, 242, 0.36);
}

.process-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 1.2rem auto 1rem;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(24, 191, 242, 0.17), rgba(11, 94, 158, 0.10));
  color: #0b5e9e;
  box-shadow: inset 0 0 0 1px rgba(11, 94, 158, 0.10);
}

.process-icon svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.process-card h3 {
  margin: 0 0 0.62rem;
  text-align: center;
  color: #071a33;
  font-size: clamp(1.02rem, 1.8vw, 1.22rem);
  line-height: 1.2;
}

.process-card p {
  margin: 0;
  text-align: center;
  color: #42526b;
  font-size: 0.96rem;
  line-height: 1.5;
}

@media (max-width: 1040px) {
  .process-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .process-line {
    display: none;
  }
}

@media (max-width: 640px) {
  .home-process::before {
    inset: 10px;
    border-radius: 24px;
  }

  .process-head {
    margin-bottom: 1.6rem;
  }

  .process-timeline {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .process-card {
    min-height: auto;
    padding: 1.2rem 1rem 1.15rem;
    border-radius: 22px;
  }

  .process-badge {
    left: 1.1rem;
    transform: none;
    top: 1rem;
  }

  .process-icon {
    margin: 0 0 0.8rem 2.7rem;
    width: 52px;
    height: 52px;
    border-radius: 18px;
  }

  .process-card h3,
  .process-card p {
    text-align: left;
  }
}


/* ==================================================
   Stage 9 surgical: urgent cases premium cards
   ================================================== */
.urgent--surgical {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 14% 10%, rgba(14, 165, 233, 0.14), transparent 34%),
    radial-gradient(circle at 84% 22%, rgba(249, 115, 22, 0.12), transparent 32%),
    linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
}

.urgent--surgical::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(11, 94, 158, 0.08);
  border-radius: 32px;
  pointer-events: none;
}

.urgent-head {
  max-width: 780px;
  margin: 0 auto 2.2rem;
  text-align: center;
}

.urgent-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.urgent-case {
  position: relative;
  display: grid;
  grid-template-columns: 58px 1fr auto;
  align-items: center;
  gap: 0.9rem;
  min-height: 118px;
  padding: 1rem 0.95rem;
  border-radius: 24px;
  color: #0f172a;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.08);
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease, background 0.28s ease;
}

.urgent-case::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.28s ease;
}

.urgent-case--plumbing::before { background: linear-gradient(135deg, rgba(14, 165, 233, 0.18), transparent 58%); }
.urgent-case--electric::before { background: linear-gradient(135deg, rgba(245, 158, 11, 0.2), transparent 58%); }
.urgent-case--appliance::before { background: linear-gradient(135deg, rgba(16, 185, 129, 0.16), transparent 58%); }
.urgent-case--split::before { background: linear-gradient(135deg, rgba(6, 182, 212, 0.18), transparent 58%); }
.urgent-case--danger::before { background: linear-gradient(135deg, rgba(239, 68, 68, 0.17), transparent 58%); }

.urgent-case:hover,
.urgent-case:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 24px 62px rgba(15, 23, 42, 0.16);
  border-color: rgba(11, 94, 158, 0.18);
  background: rgba(255, 255, 255, 0.92);
  outline: none;
}

.urgent-case:hover::before,
.urgent-case:focus-visible::before {
  opacity: 1;
}

.urgent-case__icon,
.urgent-case__body,
.urgent-case__arrow {
  position: relative;
  z-index: 1;
}

.urgent-case__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 20px;
  background: rgba(11, 94, 158, 0.09);
  color: #0b5e9e;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.65);
  transition: transform 0.28s ease, background 0.28s ease;
}

.urgent-case--electric .urgent-case__icon { background: rgba(245, 158, 11, 0.13); color: #b45309; }
.urgent-case--appliance .urgent-case__icon { background: rgba(16, 185, 129, 0.12); color: #047857; }
.urgent-case--split .urgent-case__icon { background: rgba(6, 182, 212, 0.14); color: #0e7490; }
.urgent-case--danger .urgent-case__icon { background: rgba(239, 68, 68, 0.12); color: #b91c1c; }

.urgent-case:hover .urgent-case__icon,
.urgent-case:focus-visible .urgent-case__icon {
  transform: scale(1.06) rotate(-3deg);
}

.urgent-case__icon svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.urgent-case__body strong {
  display: block;
  margin-bottom: 0.28rem;
  font-size: 1.02rem;
  line-height: 1.18;
  color: #0f172a;
}

.urgent-case__body small {
  display: block;
  color: #5f6f86;
  font-size: 0.88rem;
  line-height: 1.42;
}

.urgent-case__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  color: #0b5e9e;
  background: rgba(11, 94, 158, 0.08);
  font-weight: 800;
  transition: transform 0.28s ease, background 0.28s ease;
}

.urgent-case:hover .urgent-case__arrow,
.urgent-case:focus-visible .urgent-case__arrow {
  transform: translateX(3px);
  background: rgba(11, 94, 158, 0.14);
}

.urgent-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  margin-top: 1.5rem;
  padding: 1.15rem 1.25rem;
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(11, 94, 158, 0.96), rgba(30, 144, 220, 0.92));
  color: #fff;
  box-shadow: 0 20px 55px rgba(11, 94, 158, 0.24);
}

.urgent-cta strong,
.urgent-cta span {
  display: block;
}

.urgent-cta strong {
  font-size: 1.08rem;
  margin-bottom: 0.2rem;
}

.urgent-cta span {
  color: rgba(255, 255, 255, 0.84);
  line-height: 1.45;
}

.urgent-cta__btn {
  flex: 0 0 auto;
  background: #fff !important;
  color: #0b5e9e !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

@media (max-width: 1120px) {
  .urgent-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .urgent--surgical::before {
    inset: 10px;
    border-radius: 24px;
  }

  .urgent-head {
    margin-bottom: 1.4rem;
  }

  .urgent-cards {
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }

  .urgent-case {
    min-height: auto;
    grid-template-columns: 50px 1fr 28px;
    padding: 0.9rem;
    border-radius: 20px;
  }

  .urgent-case__icon {
    width: 48px;
    height: 48px;
    border-radius: 17px;
  }

  .urgent-case__icon svg {
    width: 26px;
    height: 26px;
  }

  .urgent-cta {
    align-items: stretch;
    flex-direction: column;
    padding: 1rem;
    border-radius: 22px;
  }

  .urgent-cta__btn {
    width: 100%;
  }
}

/* ==================================================
 * Surgical premium FAQ + footer polish
 * ================================================== */
.faq-premium-section,
.section.faq {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 8%, rgba(14, 165, 233, 0.16), transparent 32%),
    radial-gradient(circle at 90% 12%, rgba(34, 211, 238, 0.12), transparent 30%),
    linear-gradient(180deg, #f8fcff 0%, #eef7ff 100%);
}
.faq-premium-section::before,
.section.faq::before {
  content: '';
  position: absolute;
  inset: 28px auto auto 50%;
  width: min(820px, 92vw);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(14, 165, 233, 0.35), transparent);
}
.faq-premium__grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.35fr);
  gap: clamp(24px, 5vw, 64px);
  align-items: start;
}
.faq-premium__intro {
  position: sticky;
  top: 108px;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid rgba(14, 165, 233, 0.16);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.10);
  backdrop-filter: blur(16px) saturate(130%);
  -webkit-backdrop-filter: blur(16px) saturate(130%);
}
.section-kicker,
.faq-premium__intro .section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  color: #0284c7;
  font-size: 0.82rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.section-kicker::before {
  content: '';
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(135deg, #0ea5e9, #22d3ee);
  box-shadow: 0 0 0 7px rgba(14, 165, 233, 0.12);
}
.faq-premium__intro h2 {
  text-align: left;
  margin-bottom: 14px;
}
.faq-premium__intro p {
  color: #475569;
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 22px;
}
.faq-premium__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #0369a1;
  font-weight: 800;
}
.faq-premium__link::after {
  content: '→';
  transition: transform 0.25s ease;
}
.faq-premium__link:hover::after {
  transform: translateX(4px);
}
.faq-list,
.faq-list--premium {
  display: grid;
  gap: 14px;
  max-width: 920px;
  margin: 0 auto;
}
.faq-premium__grid .faq-list {
  max-width: none;
}
.faq-list details {
  position: relative;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(14, 165, 233, 0.14);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease;
}
.faq-list details::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, #0ea5e9, #22d3ee);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.faq-list details:hover,
.faq-list details[open] {
  transform: translateY(-2px);
  border-color: rgba(14, 165, 233, 0.28);
  box-shadow: 0 26px 70px rgba(14, 165, 233, 0.14);
  background: rgba(255, 255, 255, 0.94);
}
.faq-list details[open]::before {
  opacity: 1;
}
.faq-list summary {
  min-height: 70px;
  padding: 22px 72px 22px 24px;
  color: #0f172a;
  font-size: clamp(1rem, 2.5vw, 1.12rem);
  font-weight: 800;
  line-height: 1.35;
  cursor: pointer;
  list-style: none;
  display: block;
  position: relative;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::before {
  content: '?';
  position: absolute;
  right: 24px;
  top: 50%;
  width: 34px;
  height: 34px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #fff;
  font-weight: 900;
  background: linear-gradient(135deg, #0ea5e9, #22d3ee);
  box-shadow: 0 12px 24px rgba(14, 165, 233, 0.22);
  transition: transform 0.25s ease, border-radius 0.25s ease;
}
.faq-list summary::after {
  content: '';
  position: absolute;
  right: 36px;
  top: calc(50% + 1px);
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(255,255,255,.95);
  border-bottom: 2px solid rgba(255,255,255,.95);
  transform: translateY(-60%) rotate(45deg);
  opacity: 0;
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.faq-list details[open] summary::before {
  transform: translateY(-50%) rotate(180deg);
  border-radius: 50%;
}
.faq-list details[open] summary::after {
  opacity: 1;
  transform: translateY(-35%) rotate(225deg);
}
.faq-list p {
  margin: 0;
  padding: 0 24px 24px;
  color: #475569;
  line-height: 1.75;
  font-size: 1rem;
}

.footer-premium {
  position: relative;
  overflow: hidden;
  margin-top: 0;
  color: #e5f3ff;
  background:
    radial-gradient(circle at 18% 0%, rgba(14, 165, 233, 0.30), transparent 34%),
    radial-gradient(circle at 90% 12%, rgba(34, 211, 238, 0.20), transparent 32%),
    linear-gradient(135deg, #07111f 0%, #0f2137 48%, #08111f 100%);
  border-top: 1px solid rgba(125, 211, 252, 0.16);
}
.footer-premium::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), transparent 78%);
  pointer-events: none;
}
.footer-premium__container {
  position: relative;
  z-index: 1;
  padding-top: clamp(42px, 6vw, 78px);
  padding-bottom: 24px;
}
.footer-premium__top {
  display: grid;
  grid-template-columns: minmax(260px, 1.25fr) minmax(230px, 0.9fr) minmax(150px, 0.55fr) minmax(150px, 0.55fr);
  gap: clamp(22px, 4vw, 46px);
  align-items: stretch;
}
.footer-premium__brand,
.footer-premium__contacts,
.footer-premium__nav {
  border: 1px solid rgba(148, 210, 255, 0.13);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.055);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}
.footer-premium__brand {
  padding: clamp(22px, 3vw, 30px);
}
.footer-premium__logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.footer-premium__logo-icon {
  width: 44px;
  height: 44px;
  object-fit: contain;
  filter: drop-shadow(0 10px 24px rgba(14,165,233,.24));
}
.footer-premium__logo-text {
  color: #fff;
  font-size: 1.3rem;
  font-weight: 900;
  letter-spacing: -0.03em;
}
.footer-premium__brand p {
  margin: 0;
  color: rgba(226, 242, 255, 0.82);
  line-height: 1.7;
}
.footer-premium__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}
.footer-premium__badges span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 999px;
  color: #dff7ff;
  font-size: 0.82rem;
  font-weight: 800;
  background: rgba(14, 165, 233, 0.16);
  border: 1px solid rgba(125, 211, 252, 0.18);
}
.footer-premium__contacts {
  padding: clamp(22px, 3vw, 30px);
}
.footer-premium__eyebrow,
.footer-premium__nav span {
  display: block;
  margin-bottom: 12px;
  color: #7dd3fc;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.footer-premium__phone {
  display: inline-flex;
  margin-bottom: 10px;
  color: #fff;
  font-size: clamp(1.35rem, 2.4vw, 1.8rem);
  line-height: 1.1;
  font-weight: 950;
  letter-spacing: -0.04em;
}
.footer-premium__mail {
  display: inline-flex;
  color: #bae6fd;
  font-weight: 800;
  margin-bottom: 18px;
}
.footer-premium__meta {
  display: grid;
  gap: 8px;
  color: rgba(226, 242, 255, 0.82);
}
.footer-premium__meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.footer-premium__meta span::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22d3ee;
  box-shadow: 0 0 0 6px rgba(34, 211, 238, 0.10);
}
.footer-premium__nav {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: clamp(20px, 3vw, 26px);
}
.footer-premium__nav a {
  color: rgba(226, 242, 255, 0.82);
  font-weight: 700;
  transition: color 0.2s ease, transform 0.2s ease;
}
.footer-premium__nav a:hover {
  color: #fff;
  transform: translateX(4px);
}
.footer-premium__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: clamp(24px, 4vw, 36px);
  padding: clamp(18px, 3vw, 24px);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.24), rgba(34, 211, 238, 0.12));
  border: 1px solid rgba(125, 211, 252, 0.16);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.18);
}
.footer-premium__cta strong {
  display: block;
  color: #fff;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  margin-bottom: 4px;
}
.footer-premium__cta span {
  color: rgba(226, 242, 255, 0.82);
}
.footer-premium__cta-btn {
  flex-shrink: 0;
  border-radius: 999px;
  box-shadow: 0 16px 40px rgba(14, 165, 233, 0.28);
}
.footer-premium__bottom {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(148, 210, 255, 0.14);
}
.footer-premium__bottom p {
  margin: 0;
  color: rgba(226, 242, 255, 0.62);
  font-size: 0.86rem;
  line-height: 1.6;
}
.footer-premium .diag-note,
.footer .diag-note,
.footer-note {
  display: none !important;
}

@media (max-width: 980px) {
  .faq-premium__grid,
  .footer-premium__top {
    grid-template-columns: 1fr;
  }
  .faq-premium__intro {
    position: relative;
    top: auto;
  }
  .faq-premium__intro h2 {
    text-align: left !important;
  }
  .footer-premium__cta {
    align-items: flex-start;
    flex-direction: column;
  }
  .footer-premium__cta-btn {
    width: 100%;
  }
}

@media (max-width: 520px) {
  .faq-list summary {
    min-height: 64px;
    padding: 18px 62px 18px 18px;
  }
  .faq-list summary::before {
    right: 18px;
    width: 32px;
    height: 32px;
  }
  .faq-list summary::after {
    right: 29px;
  }
  .faq-list p {
    padding: 0 18px 20px;
  }
  .footer-premium__container {
    padding-bottom: 88px;
  }
  .footer-premium__brand,
  .footer-premium__contacts,
  .footer-premium__nav {
    border-radius: 22px;
  }
  .footer-premium__phone {
    font-size: 1.45rem;
  }
}

/* --------------------------------------------------
 * Surgical call-master premium polish
 * Scope: call-master.html only. Keeps form action/method/name intact.
 */
.call-page {
  --call-blue: #0b5e9e;
  --call-sky: #0ea5e9;
  --call-navy: #0f2545;
  --call-soft: #eef7ff;
  background: #f6fbff;
}
.call-page .call-hero-premium {
  min-height: clamp(560px, 72vh, 760px);
  display: flex;
  align-items: center;
  overflow: hidden;
  background-image:
    linear-gradient(120deg, rgba(6, 22, 46, 0.72) 0%, rgba(7, 32, 63, 0.46) 46%, rgba(8, 15, 29, 0.22) 100%),
    url("../img/slider/hero-5.jpg");
  background-size: cover;
  background-position: center center;
  position: relative;
}
.call-page .call-hero-premium::after {
  content: "";
  position: absolute;
  inset: auto -10% -18% -10%;
  height: 38%;
  background: radial-gradient(circle at 50% 100%, rgba(14, 165, 233, 0.32), transparent 60%);
  pointer-events: none;
}
.call-hero-premium__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  gap: clamp(24px, 5vw, 64px);
  align-items: center;
}
.call-hero-premium__content {
  max-width: 760px;
  padding: clamp(22px, 4vw, 42px);
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.38), rgba(15, 37, 69, 0.18));
  border-radius: 32px;
  box-shadow: 0 28px 80px rgba(2, 12, 27, 0.34);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.call-hero-premium__eyebrow,
.section-kicker,
.call-premium__badge,
.call-hero-premium__quick-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #7dd3fc;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
  font-weight: 800;
}
.call-hero-premium__eyebrow::before,
.section-kicker::before,
.call-hero-premium__quick-label::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #38bdf8;
  box-shadow: 0 0 0 6px rgba(56, 189, 248, 0.16);
}
.call-hero-premium h1 {
  max-width: 760px;
  margin: 16px 0 14px;
  font-size: clamp(2.25rem, 7vw, 5.35rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
  color: #ffffff;
  text-wrap: balance;
}
.call-hero-premium .hero-subtitle {
  max-width: 660px;
  margin: 0 0 22px;
  color: rgba(240, 249, 255, 0.92);
  font-size: clamp(1.03rem, 2vw, 1.32rem);
  line-height: 1.55;
}
.call-hero-premium__benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.call-hero-premium__benefits li {
  margin: 0;
  color: #f8fbff;
  background: rgba(255, 255, 255, 0.13);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18);
}
.call-hero-premium__buttons .btn,
.call-bottom-premium__buttons .btn {
  min-height: 54px;
  border-radius: 999px;
  padding: 0.95rem 1.55rem;
  font-weight: 800;
}
.call-page .btn-primary,
.call-page .call-premium__submit {
  border: 0;
  color: #ffffff;
  background: linear-gradient(135deg, #0ea5e9 0%, #0b5e9e 100%) !important;
  box-shadow: 0 18px 42px rgba(14, 165, 233, 0.28);
}
.call-page .btn-primary:hover,
.call-page .call-premium__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 54px rgba(14, 165, 233, 0.34);
}
.call-page .btn-secondary {
  color: #ffffff !important;
  background: rgba(255,255,255,0.14) !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15);
}
.call-page .btn-secondary:hover {
  background: rgba(255,255,255,0.22) !important;
  transform: translateY(-2px);
}
.call-hero-premium__quick-card {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(22px, 4vw, 34px);
  color: #ffffff;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: rgba(2, 12, 27, 0.36);
  box-shadow: 0 22px 70px rgba(2, 12, 27, 0.30);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.call-hero-premium__phone {
  display: inline-block;
  margin: 14px 0 12px;
  color: #ffffff;
  font-size: clamp(1.55rem, 3.4vw, 2.25rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  text-decoration: none;
}
.call-hero-premium__quick-card p {
  margin: 0 0 18px;
  color: rgba(226, 242, 255, 0.84);
  line-height: 1.55;
}
.call-hero-premium__mini {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.call-hero-premium__mini span {
  padding: 8px 11px;
  border-radius: 999px;
  color: #e0f2fe;
  background: rgba(14, 165, 233, 0.13);
  border: 1px solid rgba(125, 211, 252, 0.19);
  font-size: 0.86rem;
}
.call-premium {
  position: relative;
  padding: clamp(56px, 8vw, 96px) 0;
  background:
    radial-gradient(circle at 8% 0%, rgba(14,165,233,.15), transparent 36%),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%);
  overflow: hidden;
}
.call-premium::before {
  content: "";
  position: absolute;
  right: -120px;
  top: 80px;
  width: 300px;
  height: 300px;
  border-radius: 999px;
  background: rgba(14, 165, 233, 0.12);
  filter: blur(20px);
  pointer-events: none;
}
.section-heading {
  max-width: 780px;
  margin: 0 auto clamp(28px, 5vw, 48px);
  text-align: center;
}
.section-heading h2 {
  margin: 10px 0 10px;
  font-size: clamp(1.9rem, 4vw, 3.3rem);
  line-height: 1.05;
  color: var(--call-navy);
  letter-spacing: -0.04em;
}
.section-heading p {
  margin: 0 auto;
  color: #475569;
  line-height: 1.65;
  font-size: 1.04rem;
}
.call-premium__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(300px, 0.72fr);
  gap: clamp(22px, 4vw, 42px);
  align-items: start;
}
.call-premium__form-card,
.call-premium__side-card,
.call-premium__side-note,
.call-bottom-premium__inner {
  border: 1px solid rgba(11, 94, 158, 0.10);
  border-radius: 30px;
  background: rgba(255,255,255,0.88);
  box-shadow: 0 24px 70px rgba(15, 37, 69, 0.10);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.call-premium__form-card {
  padding: clamp(22px, 4vw, 38px);
}
.call-premium__form-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
  align-items: flex-start;
}
.call-premium__form-top h3,
.call-premium__side-card h3 {
  margin: 8px 0 0;
  color: var(--call-navy);
  font-size: clamp(1.45rem, 3vw, 2.05rem);
  line-height: 1.1;
}
.call-premium__time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  padding: 9px 12px;
  border-radius: 999px;
  color: #0b5e9e;
  background: #e0f2fe;
  font-weight: 800;
  font-size: 0.9rem;
}
.call-premium__form .form-row {
  margin-bottom: 16px;
}
.call-premium__form .form-row label {
  color: #0f2545;
  font-size: 0.94rem;
  font-weight: 800;
}
.call-premium__form .form-row input,
.call-premium__form .form-row select,
.call-premium__form .form-row textarea {
  min-height: 54px;
  color: #0f172a;
  border: 1px solid rgba(11, 94, 158, 0.16);
  border-radius: 16px;
  background: #f8fbff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.call-premium__form .form-row textarea {
  min-height: 118px;
  resize: vertical;
}
.call-premium__form .form-row input:focus,
.call-premium__form .form-row select:focus,
.call-premium__form .form-row textarea:focus {
  border-color: rgba(14, 165, 233, 0.9);
  box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.13);
  background: #ffffff;
}
.call-premium__form .question-form__note {
  margin: 8px 0 18px;
  color: #64748b;
  text-align: left;
  line-height: 1.55;
}
.call-premium__form .question-form__note a {
  color: #0b5e9e;
  font-weight: 700;
}
.call-premium__submit {
  width: 100%;
  min-height: 58px;
  border-radius: 18px !important;
  font-size: 1.05rem !important;
  font-weight: 900 !important;
}
.call-premium__side {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 18px;
}
.call-premium__side-card {
  padding: clamp(22px, 4vw, 32px);
}
.call-premium__steps {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
}
.call-premium__steps li {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items: start;
}
.call-premium__steps span {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: #ffffff;
  background: linear-gradient(135deg, #0ea5e9, #0b5e9e);
  box-shadow: 0 12px 28px rgba(14, 165, 233, 0.22);
  font-weight: 900;
}
.call-premium__steps p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}
.call-premium__side-note {
  padding: 22px;
  background: linear-gradient(135deg, #0f2545, #0b5e9e);
  color: #ffffff;
}
.call-premium__side-note strong {
  display: block;
  margin-bottom: 8px;
}
.call-premium__side-note a {
  color: #ffffff;
  font-size: 1.35rem;
  font-weight: 900;
  text-decoration: none;
}
.call-reasons-premium {
  padding: clamp(56px, 8vw, 92px) 0;
  background: #ffffff;
}
.call-reasons-premium__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.call-reason-card {
  position: relative;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 22px;
  border-radius: 28px;
  overflow: hidden;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(135deg, #0f2545, #0b5e9e);
  box-shadow: 0 22px 58px rgba(15, 37, 69, 0.14);
  transition: transform .25s ease, box-shadow .25s ease;
}
.call-reason-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,.28), transparent 32%),
    linear-gradient(180deg, transparent, rgba(0,0,0,.22));
  opacity: .9;
}
.call-reason-card > * {
  position: relative;
  z-index: 1;
}
.call-reason-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 28px 72px rgba(15, 37, 69, 0.22);
}
.call-reason-card__icon {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.22);
  font-size: 1.6rem;
}
.call-reason-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 1.18rem;
  line-height: 1.18;
}
.call-reason-card p {
  margin: 0;
  color: rgba(240, 249, 255, 0.88);
  line-height: 1.45;
  font-size: 0.95rem;
}
.call-reason-card--water { background: linear-gradient(135deg, #0284c7, #0f2545); }
.call-reason-card--electric { background: linear-gradient(135deg, #f59e0b, #7c2d12); }
.call-reason-card--tech { background: linear-gradient(135deg, #10b981, #064e3b); }
.call-reason-card--cold { background: linear-gradient(135deg, #38bdf8, #1d4ed8); }
.call-reason-card--split { background: linear-gradient(135deg, #06b6d4, #0f766e); }
.call-reason-card--urgent { background: linear-gradient(135deg, #ef4444, #7f1d1d); }
.call-bottom-premium {
  padding: clamp(54px, 8vw, 90px) 0;
  background:
    radial-gradient(circle at 80% 0%, rgba(14,165,233,.22), transparent 38%),
    linear-gradient(135deg, #0b172a 0%, #0f2545 54%, #0b5e9e 100%);
}
.call-bottom-premium__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(24px, 4vw, 38px);
  color: #ffffff;
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.14);
  box-shadow: 0 28px 80px rgba(2, 12, 27, 0.30);
}
.call-bottom-premium__inner h2 {
  margin: 8px 0 8px;
  color: #ffffff;
  font-size: clamp(1.75rem, 4vw, 3rem);
}
.call-bottom-premium__inner p {
  margin: 0;
  color: rgba(226, 242, 255, 0.84);
}
.call-bottom-premium__buttons {
  flex-shrink: 0;
  justify-content: flex-end;
}
@media (max-width: 980px) {
  .call-hero-premium__grid,
  .call-premium__layout {
    grid-template-columns: 1fr;
  }
  .call-premium__side {
    position: relative;
    top: auto;
  }
  .call-reasons-premium__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .call-bottom-premium__inner {
    flex-direction: column;
    align-items: flex-start;
  }
  .call-bottom-premium__buttons {
    width: 100%;
    justify-content: flex-start;
  }
}
@media (max-width: 640px) {
  .call-page .call-hero-premium {
    min-height: auto;
    padding: 104px 0 48px;
    background-position: 58% center;
  }
  .call-hero-premium__content,
  .call-hero-premium__quick-card,
  .call-premium__form-card,
  .call-premium__side-card,
  .call-premium__side-note,
  .call-bottom-premium__inner {
    border-radius: 24px;
  }
  .call-hero-premium__content {
    padding: 22px;
  }
  .call-hero-premium h1 {
    font-size: clamp(2.2rem, 13vw, 3.25rem);
  }
  .call-hero-premium__buttons,
  .call-bottom-premium__buttons {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }
  .call-hero-premium__buttons .btn,
  .call-bottom-premium__buttons .btn {
    width: 100%;
  }
  .call-premium__form-top {
    flex-direction: column;
  }
  .call-reasons-premium__grid {
    grid-template-columns: 1fr;
  }
  .call-reason-card {
    min-height: 190px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .call-reason-card,
  .call-page .btn-primary,
  .call-page .btn-secondary,
  .call-page .call-premium__submit {
    transition: none !important;
    transform: none !important;
  }
}

/*
 * Surgical contacts.html premium polish
 * Scope: contacts-page only. No form/PHP/SEO logic changes.
 */
.contacts-page {
  --contacts-blue: #0b5e9e;
  --contacts-sky: #0ea5e9;
  --contacts-navy: #0f2545;
  --contacts-soft: #eef7ff;
  background: #f6fbff;
}
.contacts-hero-premium {
  min-height: clamp(560px, 72vh, 760px);
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
  background-image:
    linear-gradient(120deg, rgba(6, 22, 46, 0.70) 0%, rgba(7, 32, 63, 0.44) 46%, rgba(8, 15, 29, 0.18) 100%),
    url("../img/slider/hero-1.jpg");
  background-size: cover;
  background-position: center center;
}
.contacts-hero-premium::after {
  content: "";
  position: absolute;
  inset: auto -10% -18% -10%;
  height: 38%;
  background: radial-gradient(circle at 50% 100%, rgba(14, 165, 233, 0.30), transparent 60%);
  pointer-events: none;
}
.contacts-hero-premium__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
  gap: clamp(24px, 5vw, 64px);
  align-items: center;
}
.contacts-hero-premium__content,
.contacts-hero-premium__quick-card {
  border: 1px solid rgba(255, 255, 255, 0.20);
  border-radius: 32px;
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.36), rgba(15, 37, 69, 0.18));
  box-shadow: 0 28px 80px rgba(2, 12, 27, 0.32);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.contacts-hero-premium__content {
  max-width: 780px;
  padding: clamp(22px, 4vw, 42px);
}
.contacts-hero-premium__eyebrow,
.contacts-hero-premium__quick-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #7dd3fc;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
  font-weight: 800;
}
.contacts-hero-premium__eyebrow::before,
.contacts-hero-premium__quick-label::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #38bdf8;
  box-shadow: 0 0 0 6px rgba(56, 189, 248, 0.16);
}
.contacts-hero-premium h1 {
  max-width: 760px;
  margin: 16px 0 14px;
  font-size: clamp(2.25rem, 7vw, 5.25rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
  color: #ffffff;
  text-wrap: balance;
}
.contacts-hero-premium .hero-subtitle {
  max-width: 660px;
  margin: 0 0 22px;
  color: rgba(240, 249, 255, 0.92);
  font-size: clamp(1.03rem, 2vw, 1.32rem);
  line-height: 1.55;
}
.contacts-hero-premium__benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.contacts-hero-premium__benefits li {
  margin: 0;
  padding: 9px 13px;
  color: #f8fbff;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.13);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18);
  font-weight: 800;
  font-size: 0.9rem;
}
.contacts-hero-premium__buttons .btn,
.contacts-bottom-premium__buttons .btn {
  min-height: 54px;
  border-radius: 999px;
  padding: 0.95rem 1.55rem;
  font-weight: 900;
}
.contacts-page .btn-primary {
  border: 0;
  color: #ffffff;
  background: linear-gradient(135deg, #0ea5e9 0%, #0b5e9e 100%) !important;
  box-shadow: 0 18px 42px rgba(14, 165, 233, 0.28);
}
.contacts-page .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 54px rgba(14, 165, 233, 0.34);
}
.contacts-page .btn-secondary {
  color: #ffffff !important;
  background: rgba(255,255,255,0.14) !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15);
}
.contacts-page .btn-secondary:hover {
  background: rgba(255,255,255,0.22) !important;
  transform: translateY(-2px);
}
.contacts-hero-premium__quick-card {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(22px, 4vw, 34px);
  color: #ffffff;
  background: rgba(2, 12, 27, 0.34);
}
.contacts-hero-premium__phone {
  display: inline-block;
  margin: 14px 0 8px;
  color: #ffffff;
  font-size: clamp(1.5rem, 3.2vw, 2.15rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  text-decoration: none;
}
.contacts-hero-premium__mail {
  color: #7dd3fc;
  font-weight: 800;
  text-decoration: none;
}
.contacts-hero-premium__quick-card p {
  margin: 16px 0 18px;
  color: rgba(226, 242, 255, 0.84);
  line-height: 1.55;
}
.contacts-hero-premium__mini,
.contacts-zone-premium__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.contacts-hero-premium__mini span,
.contacts-zone-premium__tags span {
  padding: 8px 11px;
  border-radius: 999px;
  color: #e0f2fe;
  background: rgba(14, 165, 233, 0.13);
  border: 1px solid rgba(125, 211, 252, 0.19);
  font-size: 0.86rem;
  font-weight: 800;
}
.contacts-premium,
.contacts-help-premium,
.contacts-zone-premium,
.contacts-bottom-premium {
  position: relative;
  padding: clamp(56px, 8vw, 96px) 0;
  overflow: hidden;
}
.contacts-premium {
  background:
    radial-gradient(circle at 8% 0%, rgba(14,165,233,.15), transparent 36%),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%);
}
.contacts-premium__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.contacts-premium-card {
  position: relative;
  min-height: 245px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
  border-radius: 28px;
  border: 1px solid rgba(11, 94, 158, 0.10);
  background: rgba(255,255,255,0.88);
  box-shadow: 0 24px 70px rgba(15, 37, 69, 0.10);
  text-decoration: none;
  color: #0f2545;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.contacts-premium-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 18% 5%, rgba(14,165,233,.17), transparent 34%);
  pointer-events: none;
}
.contacts-premium-card:hover {
  transform: translateY(-6px);
  border-color: rgba(14, 165, 233, 0.26);
  box-shadow: 0 30px 82px rgba(15, 37, 69, 0.16);
}
.contacts-premium-card__icon {
  position: relative;
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  color: #ffffff;
  background: linear-gradient(135deg, #0ea5e9, #0b5e9e);
  box-shadow: 0 14px 34px rgba(14, 165, 233, 0.24);
  font-size: 1.35rem;
  font-weight: 900;
}
.contacts-premium-card__label {
  position: relative;
  color: #0b5e9e;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.contacts-premium-card strong {
  position: relative;
  color: #0f2545;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.1;
}
.contacts-premium-card p {
  position: relative;
  margin: auto 0 0;
  color: #475569;
  line-height: 1.55;
}
.contacts-help-premium {
  background: #ffffff;
}
.contacts-help-premium__grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(24px, 5vw, 58px);
  align-items: center;
}
.contacts-help-premium__intro {
  padding: clamp(24px, 4vw, 38px);
  border-radius: 30px;
  color: #ffffff;
  background: linear-gradient(135deg, #0f2545, #0b5e9e);
  box-shadow: 0 26px 74px rgba(15, 37, 69, 0.20);
}
.contacts-help-premium__intro .section-kicker,
.contacts-help-premium__intro h2,
.contacts-help-premium__intro p {
  color: #ffffff;
}
.contacts-help-premium__intro .section-kicker::before {
  background: #7dd3fc;
  box-shadow: 0 0 0 6px rgba(125,211,252,.18);
}
.contacts-help-premium__intro h2 {
  margin: 12px 0 14px;
  font-size: clamp(1.9rem, 4vw, 3.3rem);
  line-height: 1.05;
  letter-spacing: -.04em;
}
.contacts-help-premium__intro p {
  margin: 0 0 22px;
  color: rgba(240,249,255,.85);
  line-height: 1.65;
}
.contacts-help-premium__btn {
  border-radius: 999px;
  color: #0b5e9e !important;
  background: #ffffff !important;
  font-weight: 900;
}
.contacts-help-premium__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.contacts-help-premium__steps li {
  display: grid;
  grid-template-columns: 52px 1fr;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid rgba(11,94,158,.10);
  background: #f8fbff;
  box-shadow: 0 16px 44px rgba(15,37,69,.08);
}
.contacts-help-premium__steps span {
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  border-radius: 18px;
  background: linear-gradient(135deg, #0ea5e9, #0b5e9e);
  font-weight: 900;
}
.contacts-help-premium__steps p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
  font-weight: 700;
}
.contacts-zone-premium {
  background:
    radial-gradient(circle at 90% 0%, rgba(14,165,233,.12), transparent 34%),
    #f7fbff;
}
.contacts-zone-premium__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  gap: clamp(24px, 5vw, 58px);
  align-items: center;
}
.contacts-zone-premium__map-card {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  border-radius: 34px;
  border: 1px solid rgba(11,94,158,.12);
  background: linear-gradient(135deg, #e0f2fe, #ffffff);
  box-shadow: 0 28px 80px rgba(15, 37, 69, 0.13);
}
.contacts-zone-premium__map-card img {
  width: 100%;
  height: 100%;
  min-height: 380px;
  display: block;
  object-fit: cover;
  filter: saturate(1.06) contrast(1.02);
}
.contacts-zone-premium__map-overlay {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 20px;
  padding: 18px 20px;
  border-radius: 22px;
  color: #ffffff;
  background: rgba(15, 37, 69, 0.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 16px 38px rgba(2,12,27,.22);
}
.contacts-zone-premium__map-overlay strong {
  display: block;
  font-size: 1.35rem;
}
.contacts-zone-premium__map-overlay span {
  color: rgba(240,249,255,.82);
}
.contacts-zone-premium__content h2 {
  margin: 12px 0 14px;
  font-size: clamp(1.9rem, 4vw, 3.35rem);
  line-height: 1.05;
  letter-spacing: -.04em;
  color: #0f2545;
}
.contacts-zone-premium__content p {
  margin: 0 0 20px;
  color: #475569;
  line-height: 1.65;
}
.contacts-zone-premium__tags span {
  color: #0b5e9e;
  background: #e0f2fe;
  border-color: rgba(14,165,233,.16);
}
.contacts-zone-premium__trust {
  display: grid;
  gap: 12px;
  margin-top: 22px;
}
.contacts-zone-premium__trust div {
  padding: 18px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid rgba(11,94,158,.10);
  box-shadow: 0 14px 34px rgba(15,37,69,.07);
}
.contacts-zone-premium__trust strong {
  display: block;
  color: #0f2545;
  margin-bottom: 5px;
}
.contacts-zone-premium__trust p {
  margin: 0;
  color: #64748b;
}
.contacts-bottom-premium {
  background: #ffffff;
}
.contacts-bottom-premium__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(24px, 4vw, 38px);
  border-radius: 30px;
  background: linear-gradient(135deg, #0f2545, #0b5e9e);
  color: #ffffff;
  box-shadow: 0 24px 72px rgba(15,37,69,.20);
}
.contacts-bottom-premium__inner .section-kicker,
.contacts-bottom-premium__inner h2,
.contacts-bottom-premium__inner p {
  color: #ffffff;
}
.contacts-bottom-premium__inner .section-kicker::before {
  background: #7dd3fc;
  box-shadow: 0 0 0 6px rgba(125,211,252,.18);
}
.contacts-bottom-premium__inner h2 {
  margin: 10px 0 8px;
  font-size: clamp(1.8rem, 3.6vw, 3rem);
  line-height: 1.05;
  letter-spacing: -.04em;
}
.contacts-bottom-premium__inner p {
  margin: 0;
  color: rgba(240,249,255,.86);
}
.contacts-bottom-premium__buttons .btn-secondary {
  color: #0b5e9e !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}
.contacts-bottom-premium__buttons .btn-primary {
  background: rgba(255,255,255,.15) !important;
  border: 1px solid rgba(255,255,255,.26) !important;
}
@media (max-width: 1024px) {
  .contacts-hero-premium__grid,
  .contacts-help-premium__grid,
  .contacts-zone-premium__grid {
    grid-template-columns: 1fr;
  }
  .contacts-premium__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  .contacts-hero-premium {
    min-height: auto;
    padding: 112px 0 56px;
  }
  .contacts-hero-premium__content,
  .contacts-hero-premium__quick-card {
    border-radius: 24px;
  }
  .contacts-hero-premium h1 {
    font-size: clamp(2.15rem, 13vw, 3.7rem);
  }
  .contacts-premium__grid {
    grid-template-columns: 1fr;
  }
  .contacts-premium-card {
    min-height: 0;
  }
  .contacts-help-premium__steps li {
    grid-template-columns: 46px 1fr;
  }
  .contacts-help-premium__steps span {
    width: 46px;
    height: 46px;
  }
  .contacts-zone-premium__map-card,
  .contacts-zone-premium__map-card img {
    min-height: 280px;
  }
  .contacts-bottom-premium__inner {
    align-items: stretch;
    flex-direction: column;
  }
  .contacts-bottom-premium__buttons .btn {
    width: 100%;
  }
}
@media (max-width: 420px) {
  .contacts-hero-premium__content,
  .contacts-hero-premium__quick-card,
  .contacts-help-premium__intro,
  .contacts-bottom-premium__inner {
    padding: 22px;
    border-radius: 22px;
  }
  .contacts-hero-premium__phone {
    font-size: 1.45rem;
  }
}


/* --------------------------------------------------
 * Stage 10: team, quick request, cases and pricing blocks
 * -------------------------------------------------- */
.today-status {
  background: linear-gradient(135deg, #eff9ff 0%, #e0f2fe 46%, #f8fbff 100%);
  border-bottom: 1px solid rgba(14, 116, 144, .12);
}
.today-status__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(140px, .65fr) minmax(140px, .65fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px 0;
}
.today-status__item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 60px;
  padding: 12px 16px;
  border: 1px solid rgba(14, 116, 144, .12);
  border-radius: 20px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 18px 40px rgba(15,23,42,.06);
  color: #0f172a;
}
.today-status__item p { margin: 0; color: #475569; font-size: .96rem; }
.today-status__item strong { display: block; font-size: 1.05rem; }
.today-status__dot {
  width: 13px; height: 13px; border-radius: 999px;
  background: #22c55e; box-shadow: 0 0 0 8px rgba(34,197,94,.14);
  flex: 0 0 auto;
}
.today-status__item > span:not(.today-status__dot) {
  display: inline-grid; place-items: center;
  width: 34px; height: 34px; border-radius: 12px;
  background: linear-gradient(135deg, #06b6d4, #0ea5e9);
  color: #fff; font-weight: 900;
}
.today-status__cta {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 60px; padding: 0 22px; border-radius: 20px;
  background: linear-gradient(135deg, #0ea5e9, #22d3ee);
  color: #fff; font-weight: 900; text-decoration: none;
  box-shadow: 0 18px 42px rgba(14,165,233,.25);
  transition: transform .25s ease, box-shadow .25s ease;
}
.today-status__cta:hover { transform: translateY(-2px); box-shadow: 0 22px 50px rgba(14,165,233,.32); }

.team-premium {
  background: radial-gradient(circle at 12% 18%, rgba(14,165,233,.13), transparent 30%), linear-gradient(180deg, #f8fbff 0%, #eef7ff 100%);
  overflow: hidden;
}
.team-premium__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(28px, 4vw, 58px);
  align-items: center;
}
.team-premium__media {
  position: relative;
  min-height: 420px;
  border-radius: 34px;
  overflow: hidden;
  background: #0f172a;
  box-shadow: 0 30px 80px rgba(15,23,42,.18);
  border: 1px solid rgba(14, 116, 144, .18);
}
.team-premium__media img {
  width: 100%; height: 100%; min-height: 420px; object-fit: cover; display: block;
}
.team-premium__media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(2,6,23,.62) 100%);
  pointer-events: none;
}
.team-premium__media-badge {
  position: absolute; left: 24px; right: 24px; bottom: 24px; z-index: 2;
  padding: 18px 20px; border-radius: 22px;
  background: rgba(15,23,42,.55);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(14px);
  color: #fff;
}
.team-premium__media-badge strong { display:block; font-size: 1.15rem; }
.team-premium__media-badge span { display:block; margin-top: 4px; color: rgba(240,249,255,.82); }
.team-premium__content h2 { margin-top: 8px; }
.team-profiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 26px;
}
.team-profile {
  padding: 20px;
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(14,116,144,.12);
  box-shadow: 0 18px 44px rgba(15,23,42,.07);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.team-profile:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(15,23,42,.11); border-color: rgba(14,165,233,.28); }
.team-profile__icon {
  display: inline-grid; place-items: center;
  width: 46px; height: 46px; border-radius: 16px;
  background: linear-gradient(135deg, #e0f2fe, #ffffff);
  box-shadow: inset 0 0 0 1px rgba(14,165,233,.16);
  font-size: 1.35rem;
}
.team-profile h3 { margin: 14px 0 8px; font-size: 1.08rem; }
.team-profile p { margin: 0; color: #64748b; line-height: 1.55; }

.lead-picker {
  background: #061424;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.lead-picker::before {
  content:''; position:absolute; inset:-20%;
  background: radial-gradient(circle at 18% 20%, rgba(34,211,238,.22), transparent 30%), radial-gradient(circle at 82% 70%, rgba(14,165,233,.22), transparent 34%);
  pointer-events:none;
}
.lead-picker__shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(24px, 4vw, 52px);
  align-items: center;
  padding: clamp(28px, 5vw, 54px);
  border-radius: 36px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px);
  box-shadow: 0 34px 100px rgba(0,0,0,.28);
}
.lead-picker .section-kicker { color: #7dd3fc; }
.lead-picker__intro h2 { margin: 10px 0 14px; color: #fff; }
.lead-picker__intro p { margin: 0; color: rgba(226,232,240,.84); line-height: 1.65; }
.lead-picker__panel {
  padding: 22px;
  border-radius: 30px;
  background: rgba(2,6,23,.38);
  border: 1px solid rgba(255,255,255,.12);
}
.lead-picker__group + .lead-picker__group { margin-top: 18px; }
.lead-picker__group strong { display:block; margin-bottom: 10px; color: #e0f2fe; }
.lead-picker__buttons { display:flex; flex-wrap: wrap; gap: 10px; }
.lead-choice, .lead-problem {
  appearance:none; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08); color: #e2e8f0;
  border-radius: 999px; padding: 11px 14px; cursor:pointer;
  font-weight: 800; transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.lead-choice:hover, .lead-problem:hover { transform: translateY(-1px); background: rgba(255,255,255,.13); }
.lead-choice.is-active, .lead-problem.is-active {
  background: linear-gradient(135deg, #0ea5e9, #22d3ee);
  border-color: transparent; color:#fff; box-shadow: 0 14px 30px rgba(14,165,233,.24);
}
.lead-picker__result {
  display:flex; gap: 16px; align-items:center; justify-content:space-between;
  margin-top: 22px; padding: 18px; border-radius: 24px;
  background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
}
.lead-picker__result span { display:block; color: rgba(226,232,240,.74); font-size:.92rem; }
.lead-picker__result strong { display:block; margin-top: 4px; color:#fff; font-size:1.1rem; }
.lead-picker__cta { white-space: nowrap; }

.work-cases {
  background: linear-gradient(180deg, #f8fbff 0%, #eef7ff 100%);
}
.work-cases__head { text-align:center; max-width: 760px; margin: 0 auto 34px; }
.work-cases__grid {
  display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px;
}
.case-card {
  position: relative; padding: 24px; border-radius: 28px;
  background: rgba(255,255,255,.86); border:1px solid rgba(14,116,144,.12);
  box-shadow: 0 22px 60px rgba(15,23,42,.08);
  overflow:hidden; min-height: 285px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.case-card::after {
  content:''; position:absolute; right:-42px; top:-42px; width:130px; height:130px; border-radius:50%;
  background: rgba(14,165,233,.08); pointer-events:none;
}
.case-card:hover { transform: translateY(-5px); box-shadow: 0 30px 80px rgba(15,23,42,.12); }
.case-card h3 { margin: 16px 0 14px; font-size: 1.18rem; }
.case-card p { margin: 0 0 11px; color:#475569; line-height:1.55; }
.case-card a { display:inline-flex; margin-top: 8px; color:#0284c7; font-weight:900; text-decoration:none; }
.case-card__tag {
  display:inline-flex; padding: 8px 11px; border-radius:999px; font-size:.78rem; font-weight:900;
}
.case-card__tag--water { background:#e0f2fe; color:#0369a1; }
.case-card__tag--electric { background:#fef3c7; color:#92400e; }
.case-card__tag--appliance { background:#dcfce7; color:#166534; }
.case-card__tag--split { background:#ccfbf1; color:#0f766e; }

.price-before {
  background: #071827;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.price-before::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 8% 25%, rgba(34,211,238,.18), transparent 30%), radial-gradient(circle at 86% 60%, rgba(59,130,246,.18), transparent 30%);
  pointer-events:none;
}
.price-before__shell {
  position:relative; display:grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 34px; align-items:center;
  padding: clamp(28px, 5vw, 54px); border-radius: 36px;
  background: rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); backdrop-filter: blur(18px);
}
.price-before__intro h2 { color:#fff; margin: 8px 0 14px; }
.price-before__intro p { color: rgba(226,232,240,.84); line-height:1.65; }
.price-before__btn { margin-top: 12px; }
.price-before__steps { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.price-step {
  padding: 20px; border-radius: 24px; background: rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.12);
}
.price-step span {
  display:inline-grid; place-items:center; width: 44px; height:44px; border-radius:16px;
  background: linear-gradient(135deg, #0ea5e9, #22d3ee); font-weight: 950;
}
.price-step strong { display:block; margin: 14px 0 6px; font-size:1.08rem; }
.price-step p { margin:0; color: rgba(226,232,240,.78); line-height:1.5; }

@media (max-width: 1100px) {
  .today-status__inner { grid-template-columns: 1fr 1fr; }
  .today-status__cta { grid-column: span 2; }
  .team-premium__grid,
  .lead-picker__shell,
  .price-before__shell { grid-template-columns: 1fr; }
  .work-cases__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .today-status__inner { grid-template-columns: 1fr; padding: 14px 0; }
  .today-status__cta { grid-column: auto; }
  .today-status__item { min-height: 0; }
  .team-premium__media { min-height: 300px; border-radius: 26px; }
  .team-premium__media img { min-height: 300px; }
  .team-premium__media-badge { left: 16px; right: 16px; bottom: 16px; }
  .team-profiles,
  .price-before__steps,
  .work-cases__grid { grid-template-columns: 1fr; }
  .lead-picker__shell,
  .price-before__shell { padding: 22px; border-radius: 28px; }
  .lead-picker__result { flex-direction: column; align-items: stretch; }
  .lead-picker__cta { width: 100%; justify-content:center; }
  .case-card { min-height: 0; }
}
@media (max-width: 420px) {
  .lead-choice, .lead-problem { width: 100%; justify-content:center; }
  .team-profile, .case-card, .price-step { border-radius: 22px; }
}


/* ==========================================================
   Stage 10: grouped hero photo galleries
   ----------------------------------------------------------
   Each internal hero can now rotate several background photos
   from its own folder: img/hero/plumbing, electric, appliance,
   split or common. The first background is set inline in HTML
   for an instant no-JS fallback; JS adds fading layers above it.
*/
.hero-gallery {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.hero-gallery__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: var(--hero-gallery-position, center center);
  background-repeat: no-repeat;
  opacity: 0;
  transform: scale(1.015);
  transition: opacity 1100ms ease;
  pointer-events: none;
  will-change: opacity;
}

.hero-gallery__bg.is-active {
  opacity: 1;
}

.hero-gallery.hero--service::before,
.call-page .call-hero-premium.hero-gallery::before,
.contacts-hero-premium.hero-gallery::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(120deg, rgba(6, 22, 46, 0.68) 0%, rgba(7, 32, 63, 0.44) 45%, rgba(8, 15, 29, 0.18) 100%);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  pointer-events: none;
}

.hero-gallery.hero--service::after,
.call-page .call-hero-premium.hero-gallery::after,
.contacts-hero-premium.hero-gallery::after {
  z-index: 1;
}

.hero-gallery.hero--service > .container,
.hero-gallery .call-hero-premium__grid,
.hero-gallery .contacts-hero-premium__grid,
.hero-gallery .hero-wrapper,
.hero-gallery .hero-inner,
.hero-gallery .hero-content--service {
  position: relative;
  z-index: 2;
}

/* Safe mobile crops. If faces are cut later, edit these lines only. */
.hero-gallery[data-hero-gallery="plumbing"] { --hero-gallery-position: center center; }
.hero-gallery[data-hero-gallery="electric"] { --hero-gallery-position: center center; }
.hero-gallery[data-hero-gallery="appliance"] { --hero-gallery-position: center center; }
.hero-gallery[data-hero-gallery="split"] { --hero-gallery-position: center center; }
.hero-gallery[data-hero-gallery="common"] { --hero-gallery-position: center center; }

@media (max-width: 768px) {
  .hero-gallery[data-hero-gallery="plumbing"] { --hero-gallery-position: center center; }
  .hero-gallery[data-hero-gallery="electric"] { --hero-gallery-position: center center; }
  .hero-gallery[data-hero-gallery="appliance"] { --hero-gallery-position: center center; }
  .hero-gallery[data-hero-gallery="split"] { --hero-gallery-position: center center; }
  .hero-gallery[data-hero-gallery="common"] { --hero-gallery-position: center center; }

  .hero-gallery.hero--service::before,
  .call-page .call-hero-premium.hero-gallery::before,
  .contacts-hero-premium.hero-gallery::before {
    background: linear-gradient(180deg, rgba(6, 22, 46, 0.62) 0%, rgba(7, 32, 63, 0.50) 52%, rgba(8, 15, 29, 0.34) 100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-gallery__bg {
    transition: none !important;
    transform: none !important;
  }
}

/* --------------------------------------------------------------------------
 * Stage 12: fixed communication buttons — call, Telegram, MAX, request
 * Tokens/chat IDs are intentionally NOT exposed in HTML/CSS/JS.
 * -------------------------------------------------------------------------- */
.social-widget {
  position: fixed !important;
  right: 18px !important;
  bottom: 28px !important;
  z-index: 9998 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  pointer-events: auto !important;
}

.social-widget__button {
  width: 54px !important;
  height: 54px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .22) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  transition: transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s cubic-bezier(.4,0,.2,1), filter .28s cubic-bezier(.4,0,.2,1) !important;
}

.social-widget__button::before {
  content: '' !important;
  position: absolute !important;
  inset: -30% !important;
  background: linear-gradient(120deg, transparent 28%, rgba(255,255,255,.34) 46%, transparent 64%) !important;
  transform: translateX(-120%) rotate(12deg) !important;
  transition: transform .55s cubic-bezier(.4,0,.2,1) !important;
  z-index: -1 !important;
}

.social-widget__button:hover,
.social-widget__button:focus-visible {
  transform: translateY(-3px) scale(1.06) !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, .30) !important;
  filter: saturate(1.08) !important;
}

.social-widget__button:hover::before,
.social-widget__button:focus-visible::before {
  transform: translateX(120%) rotate(12deg) !important;
}

.social-widget__button:active {
  transform: translateY(0) scale(.96) !important;
}

.social-widget__button svg {
  width: 25px !important;
  height: 25px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.95 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.social-widget__button--call {
  background: linear-gradient(135deg, #0ea5e9, #22d3ee) !important;
}

.social-widget__button--telegram {
  background: linear-gradient(135deg, #2AABEE, #168ACD) !important;
}

.social-widget__button--max {
  background: linear-gradient(135deg, #111827, #2563eb 52%, #22d3ee) !important;
}

.social-widget__button--request {
  background: linear-gradient(135deg, #16a34a, #34d399) !important;
}

.social-widget__max-icon rect {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.55 !important;
}

.social-widget__max-icon path {
  fill: currentColor !important;
  stroke: none !important;
}

@media (max-width: 768px) {
  .social-widget {
    right: 12px !important;
    bottom: 16px !important;
    grid-template-columns: repeat(2, 48px) !important;
    gap: 9px !important;
  }

  .social-widget__button {
    width: 48px !important;
    height: 48px !important;
  }

  .social-widget__button svg {
    width: 22px !important;
    height: 22px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .social-widget__button,
  .social-widget__button::before,
  .social-widget__button svg {
    transition: none !important;
    animation: none !important;
  }
}


/* --------------------------------------------------
 * Stage 13A - plumbing icon + blurred legal footer
 */
.direction-icon--image {
  padding: 0;
  overflow: hidden;
  background: transparent;
  border: none;
  box-shadow: none;
}
.direction-icon--image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  border-radius: 20px;
  filter: drop-shadow(0 16px 34px rgba(15, 23, 42, 0.10));
}
.direction-card:hover .direction-icon--image {
  transform: translateY(-3px) scale(1.045) rotate(-2deg);
}
.footer-premium__legal-blur {
  margin: 0;
  max-width: 1100px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: rgba(226, 242, 255, 0.22) !important;
  font-size: 0.74rem !important;
  line-height: 1.18 !important;
  filter: blur(1.15px);
  opacity: 0.72;
  user-select: none;
  pointer-events: none;
}
@media (max-width: 768px) {
  .direction-icon--image {
    width: 56px;
    height: 56px;
  }
  .footer-premium__legal-blur {
    font-size: 0.64rem !important;
    line-height: 1.08 !important;
    letter-spacing: 0.03em;
    filter: blur(0.9px);
  }
}

/* ==========================================================
   Stage 13C - hero alignment + softer glass on services/call/contacts
   ----------------------------------------------------------
   Fixes:
   1) desktop services hero photo sits lower and content becomes readable;
   2) mobile glass blocks become softer and less "solid blue";
   3) call-master and contacts hero backgrounds are re-aligned.
*/

/* --- services.html --- */
.service-page .hero--services {
  min-height: clamp(560px, 76vh, 780px);
}

.service-page .hero--services.hero-gallery {
  --hero-gallery-position: center 34%;
}

.service-page .hero--services::before {
  background: linear-gradient(
    120deg,
    rgba(6, 22, 46, 0.58) 0%,
    rgba(7, 32, 63, 0.34) 46%,
    rgba(8, 15, 29, 0.16) 100%
  ) !important;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.service-page .hero-content--service {
  max-width: 860px;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 42px);
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,0.18);
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.30), rgba(15, 37, 69, 0.16));
  box-shadow: 0 28px 80px rgba(2, 12, 27, 0.30);
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}

.service-page .hero-content--service h1 {
  margin: 0 0 14px;
  color: #ffffff !important;
  font-size: clamp(2.15rem, 5vw, 4.25rem);
  line-height: 1.02;
  letter-spacing: -0.045em;
  text-wrap: balance;
  text-shadow: 0 10px 28px rgba(0,0,0,0.26);
}

.service-page .hero-content--service > p {
  margin: 0 0 22px;
  color: rgba(240, 249, 255, 0.92) !important;
  font-size: clamp(1rem, 1.9vw, 1.24rem);
  line-height: 1.6;
  max-width: 720px;
}

.service-page .hero-content--service .hero-benefits {
  justify-content: center;
  margin-bottom: 22px;
}

.service-page .hero-content--service .hero-benefits li {
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16);
}

.service-page .hero-content--service .hero-buttons {
  justify-content: center;
}

.service-page .hero-content--service .btn-primary,
.service-page .hero-content--service .btn-secondary {
  min-width: 250px;
  min-height: 56px;
  border-radius: 999px;
  font-weight: 800;
}

.service-page .hero-content--service .btn-secondary {
  color: #ffffff !important;
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.26) !important;
}

.service-page .hero-content--service .btn-secondary:hover {
  background: rgba(255,255,255,0.20) !important;
}

/* --- call-master.html + contacts.html --- */
.call-page .call-hero-premium.hero-gallery,
.contacts-page .contacts-hero-premium.hero-gallery {
  --hero-gallery-position: center 34%;
}

.call-page .call-hero-premium__content,
.contacts-page .contacts-hero-premium__content {
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.28), rgba(15, 37, 69, 0.14));
  backdrop-filter: blur(20px) saturate(138%);
  -webkit-backdrop-filter: blur(20px) saturate(138%);
}

.call-page .call-hero-premium__quick-card,
.contacts-page .contacts-hero-premium__quick-card {
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.26), rgba(15, 37, 69, 0.15));
  backdrop-filter: blur(20px) saturate(138%);
  -webkit-backdrop-filter: blur(20px) saturate(138%);
}

@media (max-width: 1024px) {
  .service-page .hero--services.hero-gallery,
  .call-page .call-hero-premium.hero-gallery,
  .contacts-page .contacts-hero-premium.hero-gallery {
    --hero-gallery-position: center 30%;
  }
}

@media (max-width: 768px) {
  .service-page .hero--services {
    min-height: auto;
    padding: 118px 0 56px;
  }

  .service-page .hero--services.hero-gallery,
  .call-page .call-hero-premium.hero-gallery,
  .contacts-page .contacts-hero-premium.hero-gallery {
    --hero-gallery-position: center 28%;
  }

  .service-page .hero--services::before,
  .call-page .call-hero-premium.hero-gallery::before,
  .contacts-page .contacts-hero-premium.hero-gallery::before {
    background: linear-gradient(
      180deg,
      rgba(6, 22, 46, 0.42) 0%,
      rgba(7, 32, 63, 0.28) 56%,
      rgba(8, 15, 29, 0.18) 100%
    ) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }

  .service-page .hero-content--service,
  .call-page .call-hero-premium__content,
  .call-page .call-hero-premium__quick-card,
  .contacts-page .contacts-hero-premium__content,
  .contacts-page .contacts-hero-premium__quick-card {
    background: linear-gradient(145deg, rgba(15, 37, 69, 0.22), rgba(15, 37, 69, 0.10));
    border-color: rgba(255,255,255,0.16);
    box-shadow: 0 18px 54px rgba(2,12,27,0.24);
    backdrop-filter: blur(24px) saturate(145%);
    -webkit-backdrop-filter: blur(24px) saturate(145%);
  }

  .service-page .hero-content--service {
    padding: 24px 18px;
    border-radius: 28px;
  }

  .service-page .hero-content--service h1 {
    font-size: clamp(2rem, 11.2vw, 3.1rem);
  }

  .service-page .hero-content--service > p {
    font-size: 1.02rem;
  }

  .service-page .hero-content--service .hero-benefits {
    justify-content: center;
    gap: 10px;
  }

  .service-page .hero-content--service .hero-benefits li,
  .call-page .call-hero-premium__benefits li,
  .contacts-page .contacts-hero-premium__benefits li {
    background: rgba(255,255,255,0.10);
    border-color: rgba(255,255,255,0.16);
  }

  .service-page .hero-content--service .btn-primary,
  .service-page .hero-content--service .btn-secondary {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .service-page .hero--services.hero-gallery,
  .call-page .call-hero-premium.hero-gallery,
  .contacts-page .contacts-hero-premium.hero-gallery {
    --hero-gallery-position: center 26%;
  }

  .service-page .hero-content--service,
  .call-page .call-hero-premium__content,
  .call-page .call-hero-premium__quick-card,
  .contacts-page .contacts-hero-premium__content,
  .contacts-page .contacts-hero-premium__quick-card {
    border-radius: 24px;
    backdrop-filter: blur(26px) saturate(150%);
    -webkit-backdrop-filter: blur(26px) saturate(150%);
  }
}

/* ==========================================================
   Stage 13D - much more transparent hero glass on all pages
   ---------------------------------------------------------- */

/* Global service-like heroes */
.hero--service::before {
  background: linear-gradient(
    135deg,
    rgba(6, 22, 46, 0.26) 0%,
    rgba(7, 32, 63, 0.16) 50%,
    rgba(8, 15, 29, 0.10) 100%
  ) !important;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.hero--service .hero-content--service,
.call-page .call-hero-premium__content,
.call-page .call-hero-premium__quick-card,
.contacts-page .contacts-hero-premium__content,
.contacts-page .contacts-hero-premium__quick-card {
  background: linear-gradient(145deg, rgba(15, 37, 69, 0.10), rgba(15, 37, 69, 0.035)) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  box-shadow: 0 18px 48px rgba(2, 12, 27, 0.16) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
}

.hero--service .hero-content--service .hero-benefits li,
.call-page .call-hero-premium__benefits li,
.contacts-page .contacts-hero-premium__benefits li {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
}

.hero--service .hero-content--service .btn-secondary,
.call-page .call-hero-premium .btn-secondary,
.contacts-page .contacts-hero-premium .btn-secondary {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.18) !important;
}

@media (max-width: 768px) {
  .hero--service::before,
  .call-page .call-hero-premium.hero-gallery::before,
  .contacts-page .contacts-hero-premium.hero-gallery::before {
    background: linear-gradient(
      180deg,
      rgba(6, 22, 46, 0.22) 0%,
      rgba(7, 32, 63, 0.14) 55%,
      rgba(8, 15, 29, 0.08) 100%
    ) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
  }

  .hero--service .hero-content--service,
  .call-page .call-hero-premium__content,
  .call-page .call-hero-premium__quick-card,
  .contacts-page .contacts-hero-premium__content,
  .contacts-page .contacts-hero-premium__quick-card {
    background: linear-gradient(145deg, rgba(15, 37, 69, 0.075), rgba(15, 37, 69, 0.028)) !important;
    border-color: rgba(255,255,255,0.12) !important;
    box-shadow: 0 14px 38px rgba(2,12,27,0.12) !important;
    backdrop-filter: blur(14px) saturate(118%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(118%) !important;
  }

  .hero--service .hero-content--service .hero-benefits li,
  .call-page .call-hero-premium__benefits li,
  .contacts-page .contacts-hero-premium__benefits li {
    background: rgba(255,255,255,0.065) !important;
    border-color: rgba(255,255,255,0.12) !important;
  }
}

/* ==========================================================
   Stage 13E - ultra-light hero glass (almost transparent)
   ----------------------------------------------------------
   Maximum photo visibility: very light overlay, thin glass,
   low blue density. Applied to services, direction/service
   pages, call-master and contacts.
*/
.hero--service::before,
.call-page .call-hero-premium.hero-gallery::before,
.contacts-page .contacts-hero-premium.hero-gallery::before {
  background: linear-gradient(135deg, rgba(6,22,46,0.14) 0%, rgba(7,32,63,0.075) 52%, rgba(8,15,29,0.035) 100%) !important;
  backdrop-filter: blur(0.75px) !important;
  -webkit-backdrop-filter: blur(0.75px) !important;
}

.hero--service .hero-content--service,
.hero--service .hero-inner,
.call-page .call-hero-premium__content,
.call-page .call-hero-premium__quick-card,
.contacts-page .contacts-hero-premium__content,
.contacts-page .contacts-hero-premium__quick-card {
  background: linear-gradient(145deg, rgba(15,37,69,0.045), rgba(15,37,69,0.018)) !important;
  border: 1px solid rgba(255,255,255,0.105) !important;
  box-shadow: 0 10px 30px rgba(2,12,27,0.105) !important;
  backdrop-filter: blur(7px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(7px) saturate(108%) !important;
}

.hero--service h1,
.hero--service .hero-title,
.hero--service .hero-subtitle,
.hero--service .hero-content--service > p,
.call-page .call-hero-premium h1,
.call-page .call-hero-premium .hero-subtitle,
.contacts-page .contacts-hero-premium h1,
.contacts-page .contacts-hero-premium .hero-subtitle {
  text-shadow: 0 3px 14px rgba(2,12,27,0.44) !important;
}

.hero--service .hero-benefits li,
.hero--service .hero-content--service .hero-benefits li,
.call-page .call-hero-premium__benefits li,
.contacts-page .contacts-hero-premium__benefits li,
.hero--service .hero-content--service .btn-secondary,
.call-page .call-hero-premium .btn-secondary,
.contacts-page .contacts-hero-premium .btn-secondary {
  background: rgba(255,255,255,0.055) !important;
  border-color: rgba(255,255,255,0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

@media (max-width: 768px) {
  .hero--service::before,
  .call-page .call-hero-premium.hero-gallery::before,
  .contacts-page .contacts-hero-premium.hero-gallery::before {
    background: linear-gradient(180deg, rgba(6,22,46,0.13) 0%, rgba(7,32,63,0.07) 56%, rgba(8,15,29,0.035) 100%) !important;
    backdrop-filter: blur(0.5px) !important;
    -webkit-backdrop-filter: blur(0.5px) !important;
  }

  .hero--service .hero-content--service,
  .hero--service .hero-inner,
  .call-page .call-hero-premium__content,
  .call-page .call-hero-premium__quick-card,
  .contacts-page .contacts-hero-premium__content,
  .contacts-page .contacts-hero-premium__quick-card {
    background: linear-gradient(145deg, rgba(15,37,69,0.038), rgba(15,37,69,0.014)) !important;
    border-color: rgba(255,255,255,0.10) !important;
    box-shadow: 0 8px 24px rgba(2,12,27,0.09) !important;
    backdrop-filter: blur(6px) saturate(106%) !important;
    -webkit-backdrop-filter: blur(6px) saturate(106%) !important;
  }

  .hero--service .hero-benefits li,
  .hero--service .hero-content--service .hero-benefits li,
  .call-page .call-hero-premium__benefits li,
  .contacts-page .contacts-hero-premium__benefits li {
    background: rgba(255,255,255,0.047) !important;
    border-color: rgba(255,255,255,0.10) !important;
  }
}


/* ==========================================================
   Stage 13F - MAX icon refresh + readable legal footer
   ----------------------------------------------------------
   1) Replaces MAX glyph with provided branded icon.
   2) Makes legal text noticeably sharper and easier to read.
   3) Forces the first legal line to end on the word “ОФЕРТОЙ”.
*/
.social-widget__button--max {
  background: radial-gradient(circle at 30% 25%, rgba(255,255,255,0.16), rgba(255,255,255,0) 40%),
              linear-gradient(135deg, #2387ff 0%, #3556f5 48%, #1d3dde 100%) !important;
}
.social-widget__max-icon-img {
  width: 24px !important;
  height: 24px !important;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 5px 14px rgba(15, 23, 42, 0.18));
}
.footer-premium__bottom {
  display: flex;
  justify-content: center;
}
.footer-premium__legal-blur {
  max-width: 1280px;
  width: fit-content;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.028em;
  color: rgba(226, 242, 255, 0.40) !important;
  font-size: 0.76rem !important;
  line-height: 1.24 !important;
  filter: blur(0.35px);
  opacity: 0.92;
  text-shadow: 0 1px 0 rgba(0,0,0,0.14);
}
.footer-premium__legal-line {
  display: block;
}
@media (max-width: 1024px) {
  .footer-premium__legal-blur {
    max-width: 100%;
    width: 100%;
    font-size: 0.70rem !important;
    line-height: 1.22 !important;
    filter: blur(0.25px);
    letter-spacing: 0.02em;
  }
}
@media (max-width: 768px) {
  .social-widget__max-icon-img {
    width: 22px !important;
    height: 22px !important;
  }
  .footer-premium__legal-blur {
    font-size: 0.64rem !important;
    line-height: 1.18 !important;
    letter-spacing: 0.018em;
    filter: blur(0.18px);
    opacity: 0.9;
  }
}

/* ==========================================================
   Stage 13H - stable home hero copy + MAX icon hard fix
   ----------------------------------------------------------
   The hero content panel now appears only once on the first page load.
   Background photos still change, but the panel itself no longer jumps
   or replays its intro animation on every slide. Only the title/subtitle
   and mini chips rotate with controlled text animations.
*/
.hero-slider--doctorfix .hero-fixed-content {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: none;
  padding: 96px 16px 92px;
  pointer-events: none;
}

.hero-slider--doctorfix .hero-fixed-content__inner {
  width: min(980px, calc(100% - 32px));
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #fff;
  pointer-events: auto;
  animation: profidomHeroIntro 0.82s cubic-bezier(.2,.75,.2,1) both;
}

.hero-slider--doctorfix .hero-copy-title {
  width: 100%;
  max-width: 940px;
  min-height: 2.08em;
  margin: 0 auto 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: clamp(2.25rem, 6.4vw, 4.75rem);
  line-height: 1.04;
  font-weight: 900;
  letter-spacing: -0.055em;
  text-align: center;
  text-wrap: balance;
  text-shadow: 0 5px 28px rgba(0,0,0,0.58), 0 1px 0 rgba(255,255,255,0.05);
  transform-origin: 50% 65%;
  perspective: 1200px;
  will-change: transform, opacity, filter;
}

.hero-slider--doctorfix .hero-copy-subtitle {
  max-width: 850px;
  min-height: 3.1em;
  margin: 0 auto 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.92);
  font-size: clamp(1.18rem, 2.8vw, 1.85rem);
  line-height: 1.55;
  font-weight: 500;
  text-align: center;
  text-shadow: 0 3px 16px rgba(0,0,0,0.52);
  text-wrap: balance;
  will-change: transform, opacity, filter;
}

.hero-slider--doctorfix .hero-copy-points {
  min-height: 216px;
  will-change: transform, opacity, filter;
}

.hero-slider--doctorfix .hero-copy-title.is-copy-exit {
  animation: profidomHeroRollOut 0.30s cubic-bezier(.55,0,.35,1) both;
}

.hero-slider--doctorfix .hero-copy-title.is-copy-enter {
  animation: profidomHeroRollIn 0.66s cubic-bezier(.2,.85,.2,1) both;
}

.hero-slider--doctorfix .hero-copy-subtitle.is-copy-exit,
.hero-slider--doctorfix .hero-copy-points.is-copy-exit {
  animation: profidomSoftTextOut 0.28s cubic-bezier(.55,0,.35,1) both;
}

.hero-slider--doctorfix .hero-copy-subtitle.is-copy-enter {
  animation: profidomSoftTextIn 0.58s cubic-bezier(.2,.8,.2,1) both;
}

.hero-slider--doctorfix .hero-copy-points.is-copy-enter .hero-service-point {
  opacity: 0;
  animation: profidomChipTextIn 0.55s cubic-bezier(.2,.8,.2,1) both;
  animation-delay: var(--point-delay, 0ms);
}

@keyframes profidomSoftTextOut {
  from { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
  to { opacity: 0; transform: translateY(-10px) scale(.985); filter: blur(5px); }
}

@keyframes profidomSoftTextIn {
  from { opacity: 0; transform: translateY(12px) scale(.985); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@keyframes profidomChipTextIn {
  from { opacity: 0; transform: translateY(12px) scale(.98); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

/* Hard override for MAX: no external image dependency, visible white logo. */
.social-widget__button--max {
  color: #fff !important;
  background:
    radial-gradient(circle at 28% 22%, rgba(255,255,255,.22), rgba(255,255,255,0) 40%),
    linear-gradient(145deg, #19c6ff 0%, #225bff 55%, #7b35e8 100%) !important;
}
.social-widget__max-icon-inline {
  width: 27px !important;
  height: 27px !important;
  display: block !important;
  color: #fff !important;
  fill: currentColor !important;
  opacity: 1 !important;
  filter: drop-shadow(0 4px 12px rgba(15,23,42,.22));
}
.social-widget__button--max .social-widget__max-icon-inline path {
  fill: currentColor !important;
}

@media (max-width: 980px) {
  .hero-slider--doctorfix .hero-fixed-content {
    padding: 86px 0 82px;
  }

  .hero-slider--doctorfix .hero-fixed-content__inner {
    width: 100%;
    max-width: 100%;
    padding: 24px 26px 0;
  }

  .hero-slider--doctorfix .hero-copy-title {
    font-size: clamp(2.15rem, 9.7vw, 3.08rem);
    line-height: 1.08;
    min-height: 2.34em;
    margin-bottom: 24px;
  }

  .hero-slider--doctorfix .hero-copy-subtitle {
    min-height: 5em;
    font-size: clamp(1.08rem, 4.7vw, 1.42rem);
    line-height: 1.58;
    margin-bottom: 24px;
  }

  .hero-slider--doctorfix .hero-copy-points {
    min-height: 190px;
  }
}

@media (max-width: 390px) {
  .hero-slider--doctorfix .hero-fixed-content__inner {
    padding-left: 18px;
    padding-right: 18px;
  }

  .hero-slider--doctorfix .hero-copy-title {
    font-size: clamp(1.98rem, 9.2vw, 2.72rem);
  }

  .hero-slider--doctorfix .hero-copy-subtitle {
    min-height: 5.4em;
  }

  .hero-slider--doctorfix .hero-copy-points {
    min-height: 178px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slider--doctorfix .hero-fixed-content__inner,
  .hero-slider--doctorfix .hero-copy-title,
  .hero-slider--doctorfix .hero-copy-title.is-copy-enter,
  .hero-slider--doctorfix .hero-copy-title.is-copy-exit,
  .hero-slider--doctorfix .hero-copy-subtitle,
  .hero-slider--doctorfix .hero-copy-subtitle.is-copy-enter,
  .hero-slider--doctorfix .hero-copy-subtitle.is-copy-exit,
  .hero-slider--doctorfix .hero-copy-points,
  .hero-slider--doctorfix .hero-copy-points.is-copy-enter,
  .hero-slider--doctorfix .hero-copy-points.is-copy-exit,
  .hero-slider--doctorfix .hero-copy-points.is-copy-enter .hero-service-point {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
}


/* ==========================================================
   Stage 13J - service pages/footer/MAX/price cleanup
   ----------------------------------------------------------
   Goal: make internal service pages use the same polished visual language
   as the homepage, fix MAX icon, keep floating buttons higher, and make
   services.html price block readable.
*/

/* ---------- services.html premium price block ---------- */
.services-price--premium {
  position: relative;
  overflow: hidden;
  padding: clamp(56px, 7vw, 92px) 0 !important;
  background:
    radial-gradient(circle at 12% 14%, rgba(33, 198, 255, 0.14), transparent 32%),
    radial-gradient(circle at 88% 6%, rgba(31, 62, 122, 0.10), transparent 34%),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%) !important;
}

.services-price__heading {
  max-width: 820px;
  margin: 0 auto 34px;
  text-align: center;
}

.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(33, 198, 255, 0.12);
  color: #0b84c6;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.76rem;
}

.services-price__heading h2 {
  margin: 0 0 12px !important;
  color: #0f1b33 !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.services-price__heading p {
  margin: 0;
  color: #526174;
  font-size: 1.05rem;
  line-height: 1.6;
}

.price-grid--premium {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch;
}

.price-grid--premium .price-item {
  position: relative;
  min-width: 0;
  padding: 22px 20px 20px !important;
  border-radius: 26px !important;
  border: 1px solid rgba(14, 165, 233, 0.16) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.88)) !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08) !important;
  overflow: hidden;
}

.price-grid--premium .price-item::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: linear-gradient(90deg, #22c8f4, #1f5ac8);
  opacity: .95;
}

.price-item__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.price-item__icon {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(34,200,244,0.16), rgba(31,90,200,0.10));
  font-size: 1.15rem;
}

.price-grid--premium .price-item h3 {
  margin: 0 !important;
  color: #10224a !important;
  font-size: 1.1rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.015em;
}

.price-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.price-list li {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: start !important;
  padding: 11px 0 !important;
  border-bottom: 1px dashed rgba(15, 35, 70, 0.12);
  color: #415066 !important;
  font-size: 0.94rem !important;
  line-height: 1.35 !important;
}

.price-list li:last-child {
  border-bottom: 0;
}

.price-list li span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.price-list li strong {
  justify-self: end;
  min-width: 90px;
  text-align: right;
  color: #113f8c !important;
  font-weight: 900 !important;
  white-space: normal;
  line-height: 1.25;
}

.services-price__note {
  max-width: 980px;
  margin: 28px auto 0;
  padding: 18px 22px;
  border-radius: 22px;
  border: 1px solid rgba(14, 165, 233, 0.16);
  background: rgba(255,255,255,0.68);
  color: #536176;
  text-align: center;
  line-height: 1.55;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.05);
}

.services-price__note strong {
  color: #123b7c;
}

/* ---------- Make legacy service hero sections actually show photos ---------- */
.hero--service {
  background-size: cover !important;
  background-position: center 32% !important;
  background-repeat: no-repeat !important;
}

.hero--service.hero--santehnika {
  background-image: url("../img/hero/plumbing/hero-1.jpg") !important;
}

.hero--service.hero--elektrika {
  background-image: url("../img/hero/electric/hero-1.jpg") !important;
}

.hero--service.hero--tehnika {
  background-image: url("../img/hero/appliance/hero-1.jpg") !important;
}

.hero-gallery[data-hero-gallery="split"].hero--tehnika {
  background-image: url("../img/hero/split/hero-1.jpg") !important;
}

.hero-gallery.hero--service::before {
  background:
    linear-gradient(180deg, rgba(4, 13, 28, 0.30), rgba(4, 13, 28, 0.18)),
    linear-gradient(90deg, rgba(4, 13, 28, 0.30), rgba(4, 13, 28, 0.08)) !important;
  backdrop-filter: blur(1.2px) !important;
  -webkit-backdrop-filter: blur(1.2px) !important;
}

.hero--service .hero-inner {
  width: min(860px, 100%);
  margin: 0 auto !important;
  padding: clamp(26px, 4vw, 44px);
  text-align: center;
  align-items: center !important;
  border-radius: 34px;
  background: linear-gradient(145deg, rgba(9, 22, 43, 0.26), rgba(9, 22, 43, 0.12)) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  box-shadow: 0 24px 70px rgba(2, 12, 27, 0.28) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
}

.hero--service .hero-inner h1 {
  max-width: 780px;
  color: #fff !important;
  text-shadow: 0 4px 22px rgba(0,0,0,0.45) !important;
}

.hero--service .hero-inner .hero-subtitle {
  max-width: 760px;
  color: rgba(255,255,255,0.92) !important;
  text-shadow: 0 3px 16px rgba(0,0,0,0.40) !important;
}

.hero--service .hero-benefits {
  justify-content: center !important;
  margin-bottom: 16px !important;
}

.hero--service .hero-benefits li {
  background: rgba(255,255,255,0.13) !important;
  border-color: rgba(255,255,255,0.24) !important;
  color: #fff !important;
}

.hero--service .hero-buttons {
  width: 100%;
  display: flex !important;
  justify-content: center !important;
  gap: 14px !important;
  flex-wrap: wrap;
  margin-top: 8px !important;
}

.hero--service .hero-buttons .btn,
.cta-section .hero-buttons .btn,
.cta-section .btn-primary,
.cta-section .btn-secondary {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  min-width: 220px;
  min-height: 54px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px !important;
  font-weight: 900 !important;
}

.hero--service .hero-buttons .btn-primary,
.cta-section .btn-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #20c7f4, #0f7bd7) !important;
  box-shadow: 0 16px 36px rgba(14, 165, 233, 0.24) !important;
}

.hero--service .hero-buttons .btn-secondary,
.cta-section .btn-secondary {
  color: #fff !important;
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
}

/* CTA blocks on service pages: no more flying buttons */
.cta-section {
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: clamp(56px, 7vw, 86px) 0 !important;
}

.cta-section .container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cta-section h2,
.cta-section p {
  max-width: 760px;
}

/* ---------- Service-page footer: homepage look, compact and aligned ---------- */
.service-page .footer-premium {
  padding: 58px 0 34px !important;
  background: #071225 !important;
  color: rgba(255,255,255,0.78) !important;
  border-top: 4px solid #22c8f4;
}

.service-page .footer-premium__container {
  max-width: 1120px !important;
  margin: 0 auto !important;
}

.service-page .footer-premium__top {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, .75fr) minmax(160px, .55fr) minmax(180px, .65fr);
  gap: 28px !important;
  align-items: start;
}

.service-page .footer-premium__logo-icon,
.service-page .footer-premium__brand img {
  width: 54px !important;
  height: 54px !important;
  object-fit: contain;
}

.service-page .footer-premium__brand p {
  max-width: 560px;
}

.service-page .footer-premium__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.service-page .footer-premium__badges span {
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.78);
  font-size: .82rem;
}

.service-page .footer-premium__contacts,
.service-page .footer-premium__nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.service-page .footer-premium__nav a,
.service-page .footer-premium__contacts a {
  color: rgba(255,255,255,0.78) !important;
  text-decoration: none !important;
}

.service-page .footer-premium__nav span,
.service-page .footer-premium__eyebrow {
  color: #fff !important;
  font-weight: 900;
  margin-bottom: 4px;
}

.service-page .footer-premium__cta {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 28px 0 20px !important;
  padding: 18px 20px;
  border-radius: 24px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.10);
}

.service-page .footer-premium__cta-btn {
  position: static !important;
  transform: none !important;
  min-width: 180px;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #22c8f4, #0f7bd7) !important;
}

.service-page .footer-premium__bottom {
  margin-top: 14px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.10);
}

.service-page .footer-premium__legal-blur {
  color: rgba(226,242,255,0.62) !important;
  filter: blur(0.08px) !important;
  opacity: .96 !important;
  text-align: left !important;
  font-size: .76rem !important;
}

/* ---------- Floating buttons: correct MAX icon and higher position ---------- */
.social-widget {
  right: clamp(16px, 2.3vw, 28px) !important;
  bottom: clamp(92px, 8vw, 140px) !important;
  gap: 12px !important;
}

.social-widget__button {
  width: 58px !important;
  height: 58px !important;
}

.social-widget__button--max {
  background: #fff !important;
  color: transparent !important;
}

.social-widget__button--max .social-widget__max-icon-inline {
  display: none !important;
}

.social-widget__button--max::after {
  content: "" !important;
  position: absolute !important;
  inset: 13px !important;
  background: url("../img/max-icon.svg") center / contain no-repeat !important;
  z-index: 2 !important;
}

/* ---------- nice copy animation for hero/service headings ---------- */
.hero--service .hero-inner h1,
.service-page .cta-section h2,
.service-page .mini-price h2,
.service-page .faq h2 {
  animation: serviceTitleFlipIn .78s cubic-bezier(.2,.8,.2,1) both;
  transform-origin: 50% 65%;
}

.hero--service .hero-inner .hero-subtitle,
.hero--service .hero-benefits li,
.hero--service .hero-buttons .btn {
  animation: serviceSoftRise .65s cubic-bezier(.2,.8,.2,1) both;
}

.hero--service .hero-benefits li:nth-child(1) { animation-delay: .08s; }
.hero--service .hero-benefits li:nth-child(2) { animation-delay: .14s; }
.hero--service .hero-benefits li:nth-child(3) { animation-delay: .20s; }
.hero--service .hero-benefits li:nth-child(4) { animation-delay: .26s; }

@keyframes serviceTitleFlipIn {
  from { opacity: 0; transform: perspective(800px) rotateX(28deg) translateY(18px); filter: blur(6px); }
  to { opacity: 1; transform: perspective(800px) rotateX(0) translateY(0); filter: blur(0); }
}

@keyframes serviceSoftRise {
  from { opacity: 0; transform: translateY(14px); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

@media (max-width: 1180px) {
  .price-grid--premium {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .service-page .footer-premium__top {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 768px) {
  .price-grid--premium {
    grid-template-columns: 1fr !important;
  }

  .services-price__heading p {
    font-size: .98rem;
  }

  .price-list li {
    grid-template-columns: 1fr !important;
    gap: 5px !important;
  }

  .price-list li strong {
    justify-self: start;
    min-width: 0;
    text-align: left;
  }

  .hero--service {
    padding: 118px 0 54px !important;
    min-height: auto !important;
    background-position: center 28% !important;
  }

  .hero--service .hero-inner {
    padding: 24px 18px;
    border-radius: 28px;
  }

  .hero--service .hero-buttons .btn,
  .cta-section .hero-buttons .btn,
  .cta-section .btn-primary,
  .cta-section .btn-secondary {
    width: 100%;
    min-width: 0;
  }

  .service-page .footer-premium__top {
    grid-template-columns: 1fr;
  }

  .service-page .footer-premium__cta {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
  }

  .service-page .footer-premium__cta-btn {
    width: 100%;
  }

  .social-widget {
    right: 14px !important;
    bottom: 96px !important;
    gap: 10px !important;
  }

  .social-widget__button {
    width: 52px !important;
    height: 52px !important;
  }

  .social-widget__button--max::after {
    inset: 12px !important;
  }
}

@media (max-width: 420px) {
  .social-widget {
    bottom: 88px !important;
  }
}


/* ==========================================================
   Stage 13K - readable premium "why us" cards
   ----------------------------------------------------------
   Fixes pale/white text on the category pages:
   santehnika.html, elektrika.html, remont-tehniki.html.
   Cards become readable, more expensive-looking and consistent
   with the light commercial style of the site.
*/
.service-page .section.about {
  position: relative;
  padding: clamp(74px, 8vw, 116px) 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 12%, rgba(14, 165, 233, 0.12), transparent 34%),
    radial-gradient(circle at 88% 78%, rgba(31, 62, 122, 0.10), transparent 32%),
    linear-gradient(180deg, #eef8ff 0%, #f8fcff 56%, #ffffff 100%);
}

.service-page .section.about::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(31, 62, 122, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31, 62, 122, 0.045) 1px, transparent 1px);
  background-size: 44px 44px;
  opacity: 0.46;
  mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.service-page .section.about .container {
  position: relative;
  z-index: 1;
}

.service-page .section.about h2 {
  max-width: 920px;
  margin: 0 auto clamp(30px, 4vw, 48px);
  color: #071327 !important;
  font-size: clamp(2.15rem, 4.2vw, 4rem);
  line-height: 1.05;
  letter-spacing: -0.055em;
  text-align: center;
  text-wrap: balance;
}

.service-page .section.about .reasons-grid {
  max-width: 1160px;
  margin: 0 auto;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 24px);
}

.service-page .section.about .reason {
  position: relative;
  min-height: 230px;
  padding: 28px 24px 26px;
  border-radius: 26px;
  border: 1px solid rgba(31, 62, 122, 0.10);
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(145deg, rgba(14, 165, 233, 0.34), rgba(31, 62, 122, 0.12), rgba(14, 165, 233, 0.20)) border-box;
  box-shadow:
    0 22px 55px rgba(15, 23, 42, 0.10),
    0 1px 0 rgba(255, 255, 255, 0.88) inset;
  color: #0f172a !important;
  overflow: hidden;
  isolation: isolate;
  transform: translateZ(0);
}

.service-page .section.about .reason::before {
  content: "";
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin-bottom: 18px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.75), transparent 42%),
    linear-gradient(135deg, #23c5f4 0%, #0b86df 58%, #1f3e7a 100%);
  box-shadow: 0 14px 30px rgba(14, 165, 233, 0.25);
}

.service-page .section.about .reason::after {
  content: "";
  position: absolute;
  right: -48px;
  top: -48px;
  width: 132px;
  height: 132px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(14, 165, 233, 0.15), transparent 68%);
  z-index: -1;
}

.service-page .section.about .reason:nth-child(1)::before { content: "✓"; color: #fff; font-size: 26px; font-weight: 900; }
.service-page .section.about .reason:nth-child(2)::before { content: "⚙"; color: #fff; font-size: 26px; font-weight: 900; }
.service-page .section.about .reason:nth-child(3)::before { content: "★"; color: #fff; font-size: 25px; font-weight: 900; }
.service-page .section.about .reason:nth-child(4)::before { content: "✦"; color: #fff; font-size: 26px; font-weight: 900; }

.service-page .section.about .reason h3 {
  margin: 0 0 12px;
  color: #0b1730 !important;
  font-size: clamp(1.08rem, 1.35vw, 1.28rem);
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: -0.025em;
}

.service-page .section.about .reason p {
  margin: 0;
  color: #475569 !important;
  font-size: 0.98rem;
  line-height: 1.62;
  font-weight: 500;
}

.service-page .section.about .reason:hover {
  background:
    linear-gradient(180deg, #ffffff 0%, #f5fbff 100%) padding-box,
    linear-gradient(145deg, rgba(14, 165, 233, 0.50), rgba(31, 62, 122, 0.20), rgba(14, 165, 233, 0.32)) border-box;
  box-shadow:
    0 30px 70px rgba(15, 23, 42, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.95) inset;
  transform: translateY(-6px);
}

.service-page .section.about .reason:hover::before {
  transform: rotate(-4deg) scale(1.06);
}

@media (max-width: 1180px) {
  .service-page .section.about .reasons-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .service-page .section.about {
    padding: 58px 0 70px;
  }

  .service-page .section.about h2 {
    text-align: left;
    font-size: clamp(2rem, 10vw, 2.7rem);
    margin-bottom: 24px;
  }

  .service-page .section.about .reasons-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .service-page .section.about .reason {
    min-height: auto;
    padding: 22px 20px;
    border-radius: 22px;
  }

  .service-page .section.about .reason::before {
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border-radius: 16px;
  }

  .service-page .section.about .reason p {
    font-size: 0.96rem;
  }
}

/* Safety override: older global glass-card rules must never turn these
   cards white-on-white again. */
.service-page .about .reasons-grid .reason,
.service-page .about .reasons-grid .reason h3,
.service-page .about .reasons-grid .reason p {
  opacity: 1 !important;
  filter: none !important;
}

/* ==========================================================
   Stage 13L - CTA buttons alignment fix on service pages
   ----------------------------------------------------------
   Fixes bottom CTA blocks where buttons were drifting to the left.
*/
.service-page .cta-section,
.cta-section {
  position: relative;
  overflow: hidden;
  padding: clamp(56px, 7vw, 92px) 20px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(34, 211, 238, 0.18), transparent 32%),
    radial-gradient(circle at 88% 78%, rgba(14, 165, 233, 0.16), transparent 34%),
    linear-gradient(180deg, #eef8ff 0%, #eaf7ff 100%) !important;
}

.service-page .cta-section::before,
.cta-section::before {
  content: '';
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(14, 165, 233, 0.10);
  border-radius: 34px;
  pointer-events: none;
}

.service-page .cta-section h2,
.cta-section h2 {
  width: 100% !important;
  max-width: 860px !important;
  margin: 0 auto 14px !important;
  text-align: center !important;
  color: #183a75 !important;
  font-size: clamp(1.85rem, 3.1vw, 2.75rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.035em;
}

.service-page .cta-section p,
.cta-section p {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto 26px !important;
  text-align: center !important;
  color: #475569 !important;
  font-size: 1.03rem !important;
  line-height: 1.65 !important;
}

.service-page .cta-section .hero-buttons,
.cta-section .hero-buttons {
  width: 100% !important;
  max-width: 620px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  position: relative;
  z-index: 2;
}

.service-page .cta-section .hero-buttons a,
.cta-section .hero-buttons a,
.service-page .cta-section .btn-primary,
.service-page .cta-section .btn-secondary,
.cta-section .btn-primary,
.cta-section .btn-secondary {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 220px !important;
  min-height: 58px !important;
  padding: 16px 26px !important;
  border-radius: 999px !important;
  font-size: 1rem !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
}

.service-page .cta-section .btn-primary,
.cta-section .btn-primary {
  color: #ffffff !important;
  background: linear-gradient(135deg, #21c8f6 0%, #0478d9 100%) !important;
  box-shadow: 0 20px 42px rgba(14, 165, 233, 0.26) !important;
}

.service-page .cta-section .btn-secondary,
.cta-section .btn-secondary {
  color: #183a75 !important;
  background: rgba(255,255,255,0.72) !important;
  border: 1px solid rgba(31, 62, 122, 0.18) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.service-page .cta-section .btn-primary:hover,
.cta-section .btn-primary:hover,
.service-page .cta-section .btn-secondary:hover,
.cta-section .btn-secondary:hover {
  transform: translateY(-2px) !important;
}

@media (max-width: 768px) {
  .service-page .cta-section,
  .cta-section {
    padding: 48px 16px 64px !important;
  }

  .service-page .cta-section::before,
  .cta-section::before {
    inset: 12px;
    border-radius: 26px;
  }

  .service-page .cta-section .hero-buttons,
  .cta-section .hero-buttons {
    max-width: 360px !important;
    gap: 12px !important;
  }

  .service-page .cta-section .hero-buttons a,
  .cta-section .hero-buttons a,
  .service-page .cta-section .btn-primary,
  .service-page .cta-section .btn-secondary,
  .cta-section .btn-primary,
  .cta-section .btn-secondary {
    width: 100% !important;
    min-width: 0 !important;
  }
}


/* ==========================================================
   Stage 13M - hard fix for service final CTA buttons
   ----------------------------------------------------------
   Uses isolated class names so old .hero-buttons/.btn styles cannot pull
   buttons to the left side of the viewport.
*/
.service-final-cta {
  position: relative;
  overflow: hidden;
  padding: clamp(64px, 7vw, 104px) 20px !important;
  background:
    radial-gradient(circle at 14% 18%, rgba(34, 211, 238, 0.20), transparent 30%),
    radial-gradient(circle at 88% 74%, rgba(14, 165, 233, 0.18), transparent 32%),
    linear-gradient(180deg, #edf8ff 0%, #eaf7ff 100%) !important;
  text-align: center !important;
}
.service-final-cta::before {
  content: '';
  position: absolute;
  inset: 20px;
  border-radius: 36px;
  border: 1px solid rgba(14, 165, 233, 0.13);
  pointer-events: none;
}
.service-final-cta__inner {
  position: relative;
  z-index: 2;
  width: min(100%, 860px);
  margin-inline: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}
.service-final-cta__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 auto 14px;
  padding: 8px 14px;
  border-radius: 999px;
  color: #0f7bd7;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(14, 165, 233, 0.20);
  font-weight: 900;
  font-size: .82rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  box-shadow: 0 12px 28px rgba(14, 165, 233, 0.10);
}
.service-final-cta__eyebrow::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c8f4;
  box-shadow: 0 0 0 6px rgba(34, 200, 244, .14);
}
.service-final-cta h2 {
  width: 100% !important;
  max-width: 780px !important;
  margin: 0 auto 14px !important;
  color: #183a75 !important;
  font-size: clamp(2rem, 3.8vw, 3.3rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.045em !important;
  text-align: center !important;
}
.service-final-cta p {
  width: 100% !important;
  max-width: 720px !important;
  margin: 0 auto 28px !important;
  color: #475569 !important;
  font-size: clamp(1rem, 1.25vw, 1.12rem) !important;
  line-height: 1.65 !important;
  text-align: center !important;
}
.service-final-cta__actions {
  width: min(100%, 570px) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px !important;
  align-items: center !important;
  justify-content: center !important;
}
.service-final-cta__btn {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 16px 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  font-weight: 950 !important;
  font-size: 1rem !important;
  letter-spacing: .01em !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}
.service-final-cta__btn--primary {
  color: #ffffff !important;
  background: linear-gradient(135deg, #20c7f4 0%, #087bdc 100%) !important;
  box-shadow: 0 20px 42px rgba(14, 165, 233, 0.28) !important;
}
.service-final-cta__btn--secondary {
  color: #183a75 !important;
  background: rgba(255,255,255,0.78) !important;
  border: 1px solid rgba(31, 62, 122, 0.18) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.service-final-cta__btn:hover {
  transform: translateY(-2px) !important;
}
@media (max-width: 768px) {
  .service-final-cta {
    padding: 54px 16px 70px !important;
  }
  .service-final-cta::before {
    inset: 12px;
    border-radius: 28px;
  }
  .service-final-cta__actions {
    max-width: 360px !important;
    grid-template-columns: 1fr !important;
  }
  .service-final-cta__btn {
    min-height: 56px !important;
  }
}


/* ==========================================================
   Stage 13N - FINAL service CTA + footer + MAX hard override
   ----------------------------------------------------------
   Purpose: service pages must not inherit old .hero-buttons/.btn rules.
   Everything here is intentionally highly specific and placed last.
*/
html body.service-page section.service-final-cta {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: clamp(74px, 8vw, 112px) 20px !important;
  text-align: center !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(34, 211, 238, 0.16), transparent 28%),
    radial-gradient(circle at 86% 76%, rgba(14, 165, 233, 0.16), transparent 34%),
    linear-gradient(180deg, #eef9ff 0%, #eaf7ff 100%) !important;
}
html body.service-page section.service-final-cta::before {
  content: '' !important;
  position: absolute !important;
  inset: 22px !important;
  border-radius: 36px !important;
  border: 1px solid rgba(14, 165, 233, .16) !important;
  background: rgba(255,255,255,.16) !important;
  pointer-events: none !important;
}
html body.service-page section.service-final-cta .service-final-cta__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(100%, 880px) !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
html body.service-page section.service-final-cta .service-final-cta__eyebrow {
  margin-left: auto !important;
  margin-right: auto !important;
}
html body.service-page section.service-final-cta h2 {
  width: 100% !important;
  max-width: 780px !important;
  margin: 0 auto 14px !important;
  color: #183a75 !important;
  text-align: center !important;
}
html body.service-page section.service-final-cta p {
  width: 100% !important;
  max-width: 720px !important;
  margin: 0 auto 30px !important;
  color: #475569 !important;
  text-align: center !important;
}
html body.service-page section.service-final-cta .service-final-cta__actions {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  text-align: center !important;
}
html body.service-page section.service-final-cta .service-final-cta__btn,
html body.service-page section.service-final-cta a.service-final-cta__btn {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 230px !important;
  max-width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 16px 28px !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}
html body.service-page section.service-final-cta .service-final-cta__btn--primary {
  color: #fff !important;
  background: linear-gradient(135deg, #22c8f4 0%, #087bdc 100%) !important;
  box-shadow: 0 22px 44px rgba(14, 165, 233, .30) !important;
}
html body.service-page section.service-final-cta .service-final-cta__btn--secondary {
  color: #183a75 !important;
  background: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(31,62,122,.20) !important;
  box-shadow: 0 18px 36px rgba(15,23,42,.08) !important;
}

/* Keep floating buttons higher and consistent on service pages */
html body.service-page .social-widget {
  position: fixed !important;
  right: clamp(16px, 2.4vw, 32px) !important;
  bottom: clamp(118px, 10vh, 164px) !important;
  z-index: 55 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
html body.service-page .social-widget__button {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  border-radius: 50% !important;
}
html body.service-page .social-widget__button--max {
  background: #ffffff !important;
  color: #0f172a !important;
}
html body.service-page .social-widget__button--max::after {
  content: none !important;
  display: none !important;
}
html body.service-page .social-widget__button--max .social-widget__max-icon-inline {
  display: none !important;
}
html body.service-page .social-widget__button--max .social-widget__max-icon-img,
.social-widget__button--max .social-widget__max-icon-img {
  width: 30px !important;
  height: 30px !important;
  display: block !important;
  object-fit: contain !important;
}

/* Footer on service pages: exactly premium, not raw text */
html body.service-page .footer-premium {
  background: #071225 !important;
  border-top: 4px solid #22c8f4 !important;
  color: rgba(255,255,255,.78) !important;
}
html body.service-page .footer-premium__bottom {
  display: flex !important;
  justify-content: flex-start !important;
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
html body.service-page .footer-premium__legal-blur {
  display: block !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 1120px !important;
  color: rgba(226,242,255,.68) !important;
  opacity: .96 !important;
  filter: blur(.06px) !important;
  text-align: left !important;
  font-size: .76rem !important;
  line-height: 1.42 !important;
  letter-spacing: .02em !important;
}
html body.service-page .footer-premium__legal-line {
  display: block !important;
}

@media (max-width: 768px) {
  html body.service-page section.service-final-cta {
    padding: 58px 16px 84px !important;
  }
  html body.service-page section.service-final-cta::before {
    inset: 12px !important;
    border-radius: 28px !important;
  }
  html body.service-page section.service-final-cta .service-final-cta__actions {
    width: min(100%, 360px) !important;
    flex-direction: column !important;
  }
  html body.service-page section.service-final-cta .service-final-cta__btn,
  html body.service-page section.service-final-cta a.service-final-cta__btn {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body.service-page .social-widget {
    right: 14px !important;
    bottom: 106px !important;
    gap: 10px !important;
  }
  html body.service-page .social-widget__button {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
  }
  html body.service-page .social-widget__button--max .social-widget__max-icon-img,
  .social-widget__button--max .social-widget__max-icon-img {
    width: 27px !important;
    height: 27px !important;
  }
}

/* ==========================================================
   Stage 13P - Homepage plumbing direction icon size fix
   ----------------------------------------------------------
   Surgical fix: only the plumbing icon image in the homepage
   "Наши направления" card is visually enlarged to match the
   other direction icons. Card sizes and layout are unchanged.
*/
.directions--surgical .direction-card--plumbing .direction-icon--plumbing.direction-icon--image img {
  transform: scale(1.42);
  transform-origin: center center;
}

@media (max-width: 768px) {
  .directions--surgical .direction-card--plumbing .direction-icon--plumbing.direction-icon--image img {
    transform: scale(1.38);
  }
}


/* ==========================================================
   Stage 13Q - footer business requisites
   ---------------------------------------------------------- */
.footer-premium__bottom {
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
}
.footer-premium__requisites {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 auto 2px;
}
.footer-premium__requisites span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(72, 202, 255, 0.22);
  background: rgba(255, 255, 255, 0.055);
  color: rgba(226, 242, 255, 0.76);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 10px 24px rgba(0,0,0,0.10);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.footer-premium__requisites span::before {
  content: '';
  width: 6px;
  height: 6px;
  margin-right: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, #22d3ee, #0ea5e9);
  box-shadow: 0 0 0 4px rgba(34, 211, 238, 0.10);
}
@media (max-width: 768px) {
  .footer-premium__bottom {
    gap: 10px !important;
  }
  .footer-premium__requisites {
    width: 100%;
    justify-content: flex-start;
    gap: 7px;
  }
  .footer-premium__requisites span {
    min-height: 28px;
    padding: 6px 10px;
    font-size: 0.66rem;
    letter-spacing: 0.035em;
  }
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER V2 — революционный редизайн нижнего хвоста
   Структура: CTA сверху → 4 колонки → legal
═══════════════════════════════════════════════════════════════ */

/* Flex-контейнер для управления порядком блоков */
.footer-premium__container {
  display: flex;
  flex-direction: column;
}

/* CTA-панель поднимаем наверх */
.footer-premium__cta {
  order: -1;
  margin-top: 0;
  margin-bottom: clamp(28px, 4vw, 44px);
  padding: clamp(22px, 3.5vw, 32px) clamp(22px, 3.5vw, 36px);
  border-radius: 18px;
  background: linear-gradient(135deg,
    rgba(14, 165, 233, 0.22) 0%,
    rgba(34, 211, 238, 0.10) 60%,
    rgba(14, 165, 233, 0.06) 100%);
  border: 1px solid rgba(125, 211, 252, 0.22);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18),
              inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.footer-premium__cta strong {
  font-size: clamp(1.2rem, 2.5vw, 1.55rem);
  letter-spacing: -0.03em;
}

.footer-premium__cta-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.footer-premium__cta-call {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #7dd3fc;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: -0.02em;
  text-decoration: none;
  transition: color 0.18s ease;
}

.footer-premium__cta-call:hover {
  color: #bae6fd;
  text-decoration: underline;
}

/* Колонки — меньше скруглений (не овалы) */
.footer-premium__top {
  order: 0;
}

.footer-premium__brand,
.footer-premium__contacts,
.footer-premium__nav {
  border-radius: 16px;
}

/* Trust-чипы в бренде */
.footer-premium__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 16px;
}

.footer-premium__trust span {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(14, 165, 233, 0.12);
  border: 1px solid rgba(125, 211, 252, 0.16);
  color: #bae6fd;
  font-size: 0.78rem;
  font-weight: 800;
}

/* Социальные ссылки в контактах */
.footer-premium__socials {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 14px;
}

.footer-premium__social {
  display: inline-flex;
  align-items: center;
  padding: 5px 13px;
  border-radius: 8px;
  border: 1px solid rgba(125, 211, 252, 0.18);
  background: rgba(14, 165, 233, 0.09);
  color: #7dd3fc;
  font-size: 0.82rem;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease;
}

.footer-premium__social:hover {
  background: rgba(14, 165, 233, 0.2);
  color: #bae6fd;
}

/* Legal */
.footer-premium__bottom {
  order: 1;
}

/* CTA responsive */
@media (max-width: 700px) {
  .footer-premium__cta {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .footer-premium__cta-btn {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  .footer-premium__cta-call {
    font-size: 1.1rem;
  }
}

@media (max-width: 520px) {
  .footer-premium__brand,
  .footer-premium__contacts,
  .footer-premium__nav {
    border-radius: 14px;
  }

  .footer-premium__trust span {
    border-radius: 6px;
  }
}