/**
 * ATV-Sever Custom Theme CSS
 * Современный дизайн для сервиса квадроциклов и снегоходов
 * Version: 1.0.0
 */

/* ============================================
   CSS CUSTOM PROPERTIES (Variables)
   ============================================ */
:root {
  /* Основные цвета - сохраняем фирменный стиль */
  --primary: #12bbad;
  --secondary: #4f70ce;
  --accent: #ff6b35;
  --danger: #dc3545;

  /* Нейтральные цвета - обновленные */
  --dark: #1a1a2e;
  --light: #f8f9fa;
  --gray: #6c757d;
  --gray-light: #e8e8e8;
  --white: #ffffff;

  /* Градиенты */
  --gradient-primary: linear-gradient(135deg, #12bbad 0%, #0e9688 100%);
  --gradient-hero: linear-gradient(135deg, rgba(18,187,173,0.9) 0%, rgba(79,112,206,0.8) 100%);

  /* Шрифты */
  --font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Размеры текста */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;

  /* Скругления */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Тени */
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 20px rgba(0,0,0,0.08);
  --shadow-lg: 0 12px 40px rgba(18,187,173,0.15);
  --shadow-xl: 0 20px 60px rgba(0,0,0,0.15);

  /* Переходы */
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================
   ГЛОБАЛЬНЫЕ СТИЛИ
   ============================================ */
* {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--dark);
  background-color: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 1rem;
  color: var(--dark);
}

h1 { font-size: var(--text-5xl); }
h2 { font-size: var(--text-4xl); }
h3 { font-size: var(--text-3xl); }
h4 { font-size: var(--text-2xl); }
h5 { font-size: var(--text-xl); }
h6 { font-size: var(--text-lg); }

a {
  color: var(--primary);
  text-decoration: none;
  transition: var(--transition);
}

a:hover {
  color: var(--secondary);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ============================================
   HEADER (Шапка сайта)
   ============================================ */
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--white);
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.header.scrolled {
  box-shadow: var(--shadow-md);
}

.header__container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.header__logo {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--primary);
  text-decoration: none;
}

.header__logo:hover {
  color: var(--secondary);
}

.header__phone {
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--danger);
  text-decoration: none;
  white-space: nowrap;
}

.header__phone:hover {
  color: var(--primary);
}

/* Navigation */
.nav {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.nav__list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 1.5rem;
}

.nav__item {
  position: relative;
}

.nav__link {
  font-size: var(--text-base);
  font-weight: 500;
  color: var(--dark);
  padding: 0.5rem 0;
  transition: var(--transition);
}

.nav__link:hover,
.nav__link.active {
  color: var(--primary);
}

/* Mobile Menu Toggle */
.menu-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--dark);
}

@media (max-width: 768px) {
  .menu-toggle {
    display: block;
  }

  .nav {
    position: fixed;
    top: 0;
    right: -100%;
    width: 280px;
    height: 100vh;
    background: var(--white);
    box-shadow: var(--shadow-xl);
    padding: 2rem;
    transition: var(--transition);
    flex-direction: column;
    align-items: flex-start;
  }

  .nav.active {
    right: 0;
  }

  .nav__list {
    flex-direction: column;
    gap: 1rem;
    width: 100%;
  }
}

/* ============================================
   HERO SECTION (Главный экран)
   ============================================ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--white);
  background-image: linear-gradient(var(--gradient-hero)), url('../images/generated/home-hero.webp');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.hero__content {
  max-width: 800px;
  padding: 2rem;
  z-index: 1;
}

.hero__title {
  font-size: var(--text-5xl);
  margin-bottom: 1rem;
  text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.hero__subtitle {
  font-size: var(--text-xl);
  margin-bottom: 2rem;
  opacity: 0.95;
}

.hero__cta {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 768px) {
  .hero__title {
    font-size: var(--text-3xl);
  }

  .hero__subtitle {
    font-size: var(--text-lg);
  }
}

/* ============================================
   BUTTONS (Кнопки)
   ============================================ */
.btn {
  display: inline-block;
  padding: 14px 32px;
  font-size: var(--text-base);
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: var(--transition);
  box-shadow: var(--shadow-sm);
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.btn-primary {
  background: var(--gradient-primary);
  color: var(--white);
}

.btn-secondary {
  background: var(--white);
  color: var(--primary);
}

.btn-outline {
  background: transparent;
  color: var(--white);
  border: 2px solid var(--white);
}

.btn-lg {
  padding: 18px 40px;
  font-size: var(--text-lg);
}

/* ============================================
   CARDS (Карточки)
   ============================================ */
.card {
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  overflow: hidden;
  transition: var(--transition);
}

.card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
}

.card__image {
  width: 100%;
  height: 240px;
  object-fit: cover;
}

.card__content {
  padding: 1.5rem;
}

.card__title {
  font-size: var(--text-xl);
  margin-bottom: 0.75rem;
  color: var(--dark);
}

.card__text {
  color: var(--gray);
  margin-bottom: 1rem;
}

.card__icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gradient-primary);
  border-radius: 50%;
  color: var(--white);
  font-size: 2rem;
}

/* ============================================
   GRID & LAYOUT
   ============================================ */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.section {
  padding: 4rem 0;
}

.section-title {
  text-align: center;
  margin-bottom: 3rem;
}

.grid {
  display: grid;
  gap: 2rem;
}

.grid-2 {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.grid-3 {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.grid-4 {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

/* ============================================
   FORMS (Формы)
   ============================================ */
.form-group {
  margin-bottom: 1.5rem;
}

.form-label {
  display: block;
  margin-bottom: 0.5rem;
  font-weight: 500;
  color: var(--dark);
}

.form-control {
  width: 100%;
  padding: 14px 20px;
  font-size: var(--text-base);
  border: 2px solid var(--gray-light);
  border-radius: var(--radius-md);
  transition: var(--transition);
  background: var(--white);
  font-family: var(--font-body);
}

.form-control:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(18,187,173,0.1);
}

textarea.form-control {
  resize: vertical;
  min-height: 120px;
}

/* ============================================
   FOOTER (Подвал)
   ============================================ */
.footer {
  background: var(--dark);
  color: var(--light);
  padding: 3rem 0 1.5rem;
}

.footer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  margin-bottom: 2rem;
}

.footer__title {
  color: var(--white);
  margin-bottom: 1rem;
}

.footer__link {
  color: var(--light);
  display: block;
  margin-bottom: 0.5rem;
}

.footer__link:hover {
  color: var(--primary);
}

.footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 1.5rem;
  text-align: center;
  color: var(--gray);
}

/* ============================================
   UTILITY CLASSES
   ============================================ */
.text-center { text-align: center; }
.text-primary { color: var(--primary); }
.text-danger { color: var(--danger); }
.text-muted { color: var(--gray); }

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }

.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

.d-none { display: none; }
.d-block { display: block; }
.d-flex { display: flex; }
.d-grid { display: grid; }

/* ============================================
   SERVICE PAGE STYLES
   ============================================ */

/* Service Hero */
.service-hero {
  background: var(--gradient-primary);
  padding: 80px 0 60px;
  margin-bottom: 40px;
  position: relative;
  background-size: cover;
  background-position: center;
}

.service-hero--default {
  background: var(--gradient-primary);
}

.service-hero h1 {
  color: var(--white);
  font-size: var(--text-4xl);
  font-weight: 700;
  margin-bottom: 15px;
}

.service-hero__subtitle {
  color: rgba(255, 255, 255, 0.95);
  font-size: var(--text-lg);
  max-width: 700px;
}

.hero__overlay {
  position: relative;
  z-index: 1;
}

/* Breadcrumbs */
.breadcrumbs {
  padding: 15px 0;
  font-size: var(--text-sm);
  color: var(--gray);
}

.breadcrumbs a {
  color: var(--primary);
  text-decoration: none;
}

.breadcrumbs a:hover {
  text-decoration: underline;
}

.breadcrumbs span {
  margin: 0 8px;
}

/* Service Grid Layout */
.service-grid {
  display: grid;
  grid-template-columns: 1fr 350px;
  gap: 40px;
  margin-top: 40px;
}

@media (max-width: 992px) {
  .service-grid {
    grid-template-columns: 1fr;
  }
  
  .service-sidebar {
    order: -1;
  }
}

.service-main {
  min-width: 0; /* Fix for grid overflow */
}

.service-content h2 {
  font-size: var(--text-3xl);
  color: var(--dark);
  margin: 40px 0 24px;
  font-weight: 700;
}

.service-content h3 {
  font-size: var(--text-2xl);
  color: var(--dark);
  margin: 32px 0 16px;
  font-weight: 600;
}

.service-content h4 {
  font-size: var(--text-xl);
  color: var(--dark);
  margin: 24px 0 12px;
  font-weight: 600;
}

.service-content p {
  line-height: 1.7;
  margin-bottom: 16px;
  color: #333;
}

.service-content ul, .service-content ol {
  margin: 16px 0 16px 24px;
  line-height: 1.7;
}

.service-content li {
  margin-bottom: 8px;
  color: #333;
}

/* Service Cards */
.services-cards {
  margin: 50px 0;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 30px;
}

.service-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 30px 24px;
  box-shadow: var(--shadow-sm);
  transition: all 0.3s ease;
  border: 1px solid #e8e8e8;
  text-align: center;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
  border-color: var(--primary);
}

.service-card__icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  background: var(--gradient-primary);
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: var(--white);
}

.service-card h3 {
  font-size: var(--text-xl);
  margin: 0 0 12px;
  color: var(--dark);
}

.service-card p {
  font-size: var(--text-sm);
  color: var(--gray);
  margin-bottom: 16px;
  line-height: 1.6;
}

.service-card__price {
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--primary);
  margin-top: 16px;
}

/* Price Table */
.price-section {
  margin: 50px 0;
  background: #f8f9fa;
  padding: 40px;
  border-radius: var(--radius-lg);
}

.price-table table {
  width: 100%;
  border-collapse: collapse;
  background: var(--white);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.price-table thead {
  background: var(--gradient-primary);
  color: var(--white);
}

.price-table th {
  padding: 16px 20px;
  text-align: left;
  font-weight: 600;
  font-size: var(--text-base);
}

.price-table tbody tr {
  border-bottom: 1px solid #e8e8e8;
  transition: background 0.2s;
}

.price-table tbody tr:hover {
  background: #f8f9fa;
}

.price-table tbody tr:last-child {
  border-bottom: none;
}

.price-table td {
  padding: 16px 20px;
  font-size: var(--text-base);
}

.price-table td:last-child {
  text-align: right;
  color: var(--primary);
  font-weight: 600;
  font-size: var(--text-lg);
}

.price-note {
  margin-top: 16px;
  font-size: var(--text-sm);
  color: var(--gray);
  font-style: italic;
}

/* FAQ Section */
.faq-section {
  margin: 50px 0;
}

.faq-list {
  margin-top: 30px;
}

.faq-item {
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 24px;
  margin-bottom: 16px;
  border: 1px solid #e8e8e8;
  transition: all 0.3s ease;
}

.faq-item:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--primary);
}

.faq-question {
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--dark);
  margin: 0 0 12px;
  display: flex;
  align-items: center;
}

.faq-question:before {
  content: "Q:";
  display: inline-block;
  width: 35px;
  height: 35px;
  background: var(--primary);
  color: var(--white);
  border-radius: var(--radius-full);
  text-align: center;
  line-height: 35px;
  font-size: var(--text-sm);
  font-weight: 700;
  margin-right: 12px;
  flex-shrink: 0;
}

.faq-answer {
  font-size: var(--text-base);
  line-height: 1.7;
  color: #333;
  padding-left: 47px;
}

/* CTA Section */
.cta-section {
  margin: 60px 0;
}

.cta-box {
  background: var(--gradient-primary);
  border-radius: var(--radius-xl);
  padding: 50px 40px;
  text-align: center;
  color: var(--white);
}

.cta-box h2 {
  color: var(--white);
  margin: 0 0 15px;
  font-size: var(--text-3xl);
}

.cta-box p {
  font-size: var(--text-lg);
  margin-bottom: 30px;
  opacity: 0.95;
}

.cta-buttons {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

.cta-buttons .btn {
  min-width: 180px;
}

.btn-secondary {
  background: var(--white);
  color: var(--primary);
}

.btn-secondary:hover {
  background: #f0f0f0;
  color: var(--primary);
}

/* Sidebar Widgets */
.service-sidebar {
  position: sticky;
  top: 100px;
  align-self: start;
}

.sidebar-widget {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 30px 24px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-sm);
  border: 1px solid #e8e8e8;
}

.sidebar-widget h3 {
  font-size: var(--text-xl);
  font-weight: 600;
  margin: 0 0 20px;
  color: var(--dark);
  padding-bottom: 15px;
  border-bottom: 2px solid var(--primary);
}

/* Contact Widget */
.contact-widget .contact-item {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  font-size: var(--text-base);
}

.contact-widget .contact-item i {
  width: 35px;
  height: 35px;
  background: var(--gradient-primary);
  color: var(--white);
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.contact-widget .contact-item a {
  color: var(--dark);
  text-decoration: none;
  font-weight: 500;
}

.contact-widget .contact-item a:hover {
  color: var(--primary);
}

.contact-hours {
  margin-top: 20px;
  padding: 16px;
  background: #f8f9fa;
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  line-height: 1.7;
}

.contact-hours strong {
  color: var(--dark);
  display: block;
  margin-bottom: 8px;
}

/* Features Widget */
.features-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.features-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  font-size: var(--text-base);
  color: #333;
}

.features-list i {
  color: var(--primary);
  font-size: 18px;
  flex-shrink: 0;
}

/* Brands Widget */
.brands-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.brand-tag {
  display: inline-block;
  padding: 6px 14px;
  background: #f8f9fa;
  border-radius: var(--radius-full);
  font-size: var(--text-sm);
  color: var(--dark);
  font-weight: 500;
  border: 1px solid #e8e8e8;
  transition: all 0.2s;
}

.brand-tag:hover {
  background: var(--primary);
  color: var(--white);
  border-color: var(--primary);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .service-hero {
    padding: 60px 0 40px;
  }
  
  .service-hero h1 {
    font-size: var(--text-3xl);
  }
  
  .cards-grid {
    grid-template-columns: 1fr;
  }
  
  .price-section {
    padding: 24px 16px;
  }
  
  .price-table {
    overflow-x: auto;
  }
  
  .cta-box {
    padding: 35px 24px;
  }
  
  .cta-buttons {
    flex-direction: column;
  }
  
  .cta-buttons .btn {
    width: 100%;
  }
}

/* Migration corrections: responsive navigation, readable hero, usable forms and prices. */
:root{--primary:#0c756a;--primary-color:#0c756a;--gradient-primary:linear-gradient(135deg,#0c756a,#095b52);--font-heading:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--dark:#14252d}
html{scroll-padding-top:100px}body{overflow-wrap:break-word}.container{width:100%;max-width:1200px}.header{position:sticky;top:0;z-index:30;background:#fff}.header__container{gap:1.2rem}.header__logo{flex-shrink:0;color:#14252d;line-height:1.1;font-size:1.3rem}.logo-accent{display:block;color:var(--primary);letter-spacing:.16em;font-size:.8rem}.header__phone{font-size:1rem;color:var(--primary)}.nav__list{gap:1rem}.nav__link[aria-current=page]{color:var(--primary);text-decoration:underline;text-underline-offset:6px}.menu-toggle{min-width:44px;min-height:44px;z-index:32;border-radius:8px}.skip-link{position:fixed;left:1rem;top:-100px;background:#fff;padding:1rem;z-index:100}.skip-link:focus{top:1rem}:focus-visible{outline:3px solid #d98820;outline-offset:4px}
.hero{min-height:650px;background-image:linear-gradient(90deg,rgba(8,23,28,.90),rgba(8,23,28,.48)),url('../images/generated/home-hero.webp');background-attachment:scroll;text-align:left;justify-content:flex-start}.hero__content{max-width:1200px;width:100%;margin:auto;padding:5rem 1.5rem}.hero__title{color:#fff;font-size:clamp(2.3rem,5vw,4.4rem);max-width:850px;text-shadow:none;letter-spacing:-.04em}.hero__subtitle{max-width:700px;color:#e4eeed;font-size:1.25rem}.hero__cta{justify-content:flex-start}.hero .btn-outline{color:#fff;border-color:#fff}.hero .btn-outline:hover{background:#fff;color:#14252d}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700;margin-bottom:1rem}.hero .eyebrow{color:#bde4d9}.hero-facts{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:3rem 0 0;gap:2.5rem}.hero-facts li{display:flex;flex-direction:column}.hero-facts strong{font-size:1.8rem;color:#fff}.hero-facts span{color:#d7e5df}
.section{padding:4.5rem 0}.section-tinted{background:#f2f5f3}.section-title{text-align:left;font-size:clamp(1.8rem,3vw,2.5rem);margin-bottom:2rem;letter-spacing:-.025em}.grid{gap:1.5rem}.equipment-card{display:block;border:1px solid #dce3df;border-radius:12px;overflow:hidden;color:var(--dark);background:white;text-decoration:none;transition:box-shadow .2s,transform .2s}.equipment-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}.equipment-card img{display:block;width:100%;height:210px;object-fit:cover}.equipment-card>div{padding:1.3rem}.equipment-card h3,.service-link-card h3{font-size:1.35rem}.equipment-card p{margin:0;color:var(--primary);font-weight:600}.service-link-card{display:block;padding:1.7rem;border:1px solid #dce3df;background:#fff;border-radius:12px;color:var(--dark);text-decoration:none}.service-link-card h3{display:flex;justify-content:space-between;gap:1rem}.service-link-card p{margin-bottom:0}.service-link-card:hover{border-color:var(--primary)}.feature-photo{width:100%;height:320px;object-fit:cover;border-radius:12px}.lead{font-size:1.2rem;line-height:1.75}.work-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem;padding-left:1.4rem}.work-steps li::marker{font-weight:700;color:var(--primary)}
.service-hero{min-height:330px;padding:4rem 0;background-position:center;background-size:cover}.service-hero--default{background:#142c31;color:#fff}.service-hero h1{color:#fff;font-size:clamp(2rem,4vw,3rem);max-width:900px;line-height:1.12}.service-hero__subtitle{color:#e5efec;margin-bottom:1.5rem}.service-grid{grid-template-columns:minmax(0,1fr) 285px;gap:2.5rem}.service-main,.service-sidebar{min-width:0}.service-main h2{font-size:1.7rem;margin-top:2.2rem}.sidebar-widget h2{font-size:1.2rem}.breadcrumbs{display:flex;flex-wrap:wrap;gap:.5rem;padding:1.3rem 0;font-size:.9rem}.sidebar-links{padding-left:1.1rem}.sidebar-links li{margin-bottom:.7rem}.related-services li{margin-bottom:.7rem}.table-scroll{overflow:auto;max-width:100%;margin:1.3rem 0;border:1px solid #dce3df;border-radius:8px}.table-scroll table{border-collapse:collapse;width:100%;font-size:.95rem}.table-scroll td,.table-scroll th{padding:.75rem;border-bottom:1px solid #dce3df;vertical-align:top}.table-scroll tr:nth-child(even){background:#f3f6f4}.table-scroll tr:first-child{font-weight:700;background:#e6efeb}.table-scroll table table{border:0}.price-note,.form-note{font-size:.85rem;color:#495851}.cta-box{background:#edf5f1;padding:2rem;margin-top:3rem;border-radius:12px}.cta-box h2{margin-top:0}.cta-buttons{display:flex;flex-wrap:wrap;gap:1rem}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}.contact-grid>div{min-width:0}.contact-grid h2{font-size:2rem}.contact-phone{font-size:1.5rem;font-weight:700}.contact-form-wrapper{background:#f3f6f4;border-radius:12px;padding:2rem}.contact-form-wrapper .form-field{margin-bottom:1.3rem}.contact-form-wrapper label{display:block;font-weight:600;margin-bottom:.4rem}.contact-form-wrapper input:not([type=checkbox]):not([type=hidden]),.contact-form-wrapper textarea{width:100%;min-width:0;font:inherit;font-size:16px;padding:.8rem;border:1px solid #abbeb5;border-radius:6px;background:white;box-sizing:border-box}.contact-form-wrapper input[type=checkbox]{width:20px;height:20px;vertical-align:middle;margin-right:.5rem}.contact-form-wrapper .honeypot,.contact-form-wrapper [data-grav-field=honeypot]{display:none}.contact-form-wrapper .form-actions{margin-top:1rem}.form-messages{padding:1rem;border:1px solid #b6d5c8;background:#e2f3ea;margin-bottom:1rem}.form-messages.error{border-color:#d78e8e;background:#fcecec}.footer__title{font-size:1.15rem;color:white}.footer h2{color:white}.footer{background:#14252d}.footer__link{padding:.2rem 0;color:#e2eeea}.footer a{color:#e2eeea}.footer__grid{grid-template-columns:1.1fr 1fr 1fr 1.3fr;gap:2rem}.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.35rem;border-radius:7px;line-height:1.4}.btn-outline{border:2px solid var(--primary);background:transparent;color:var(--primary)}
@media(max-width:1100px){.menu-toggle{display:block}.nav{display:none;position:absolute;top:100%;left:0;right:0;width:100%;height:auto;padding:1rem 1.5rem;background:#fff;box-shadow:0 12px 16px rgba(0,0,0,.08);align-items:stretch;z-index:31}.nav.active{display:block}.nav__list{flex-direction:column;gap:0}.nav__link{display:block;padding:.8rem 0}.header__phone{margin-left:auto}.header__container{gap:.8rem}.footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.work-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){.container{padding-left:1.25rem;padding-right:1.25rem}.hero{min-height:560px}.hero__content{padding:3.5rem 1.25rem}.hero__title{font-size:2.5rem}.hero__subtitle{font-size:1.1rem}.hero-facts{gap:1.5rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:2.3rem}.hero-facts strong{font-size:1.5rem}.section{padding:3rem 0}.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.service-grid,.contact-grid,.grid-2{grid-template-columns:1fr;gap:2rem}.service-hero{padding:3rem 0;min-height:270px}.service-content{padding-top:1rem}.contact-form-wrapper{padding:1.25rem}.work-steps{gap:1rem}.header__container{padding:.8rem 1rem}.header__phone{font-size:.88rem}.footer__grid{gap:1.5rem}.feature-photo{height:250px}.equipment-card img{height:170px}}
@media(max-width:480px){.grid-3,.grid-4{grid-template-columns:1fr}.equipment-card img{height:220px}.hero__title{font-size:2.1rem}.header__logo{font-size:1.1rem}.header__phone{font-size:.83rem}.menu-toggle{min-width:40px}.hero__cta .btn{width:100%}.footer__grid{grid-template-columns:1fr}.contact-phone{font-size:1.2rem}.work-steps{grid-template-columns:1fr}.cta-box{padding:1.25rem}.table-scroll td{padding:.55rem}.contact-grid h2{font-size:1.8rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Generated service illustrations retain their full composition. */
.service-illustration{margin:0 0 1.8rem}.service-illustration img{display:block;width:100%;height:auto;border-radius:12px}.service-illustration figcaption{font-size:.78rem;color:#596965;margin-top:.55rem}

.cta-box h2{color:#14252d}

/* A sticky sidebar overlaps the article when the grid becomes one column. */
@media (max-width: 992px) {
  .service-grid { grid-template-columns: minmax(0, 1fr); }
  .service-sidebar { position: static; top: auto; order: 0; }
}

/* Preserve horizontal gutters when a section is also its own container. */
@media (max-width: 768px) {
  .container {
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
  }
}
