/* Fonts (Google Fonts, SIL Open Font License), hosted here: Latin and Latin Extended only. */
@font-face {
  font-family: 'Barlow';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/barlow-300i-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/barlow-300i-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/barlow-300-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/barlow-300-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/barlow-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/barlow-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/barlow-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/barlow-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/barlow-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/barlow-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/barlow-condensed-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/barlow-condensed-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/barlow-condensed-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/barlow-condensed-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/barlow-condensed-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/barlow-condensed-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/fonts/barlow-condensed-800-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/fonts/barlow-condensed-800-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/bebas-neue-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/bebas-neue-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* AMCLEAN AUTO86: the original site's styles (2025), then the additions for the reworked pages. */

    *,
    *::before,
    *::after {
      margin: 0;
      padding: 0;
      box-sizing: border-box
    }

    html {
      scroll-behavior: smooth
    }

    :root {
      --r: #D90020;
      --r2: #A8001A;
      --r3: #FF1A35;
      --g: #C9A227;
      --gl: #F5D070;
      --k: #050505;
      --k2: #0C0C0C;
      --k3: #131313;
      --k4: #1A1A1A;
      --k5: #222;
      --w: #FFFFFF;
      --w2: #F0EDE8;
      --gr: #555;
      --gr2: #888;
      --gr3: #BBB;
      --border: rgba(255, 255, 255, 0.06);
      --border-r: rgba(217, 0, 32, 0.3);
    }

    body {
      font-family: 'Barlow', sans-serif;
      background: var(--k);
      color: var(--w);
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased
    }

    ::-webkit-scrollbar {
      width: 3px
    }

    ::-webkit-scrollbar-track {
      background: var(--k)
    }

    ::-webkit-scrollbar-thumb {
      background: var(--r)
    }

    img {
      display: block
    }

    a {
      text-decoration: none
    }

    /* ── UTILITIES ── */
    .tag {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--r);
      display: inline-flex;
      align-items: center;
      gap: 10px
    }

    .tag::before,
    .tag::after {
      content: '';
      width: 24px;
      height: 1px;
      background: var(--r)
    }

    .h1 {
      font-family: 'Bebas Neue', sans-serif;
      font-size: clamp(60px, 7vw, 110px);
      line-height: .92;
      letter-spacing: 2px;
      color: var(--w)
    }

    .h1 b {
      color: var(--r);
      font-weight: 400
    }

    .h2 {
      font-family: 'Bebas Neue', sans-serif;
      font-size: clamp(44px, 5vw, 78px);
      line-height: .92;
      letter-spacing: 1px;
      color: var(--w)
    }

    .h2 b {
      color: var(--r);
      font-weight: 400
    }

    .body-text {
      font-size: 15px;
      font-weight: 300;
      color: var(--gr2);
      line-height: 1.75
    }

    .body-text strong {
      color: var(--w);
      font-weight: 500
    }

    /* ── NAV ── */
/* ── NAV ── */
    nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 999;
      height: 68px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 52px;
      background: rgba(5, 5, 5, 0.95);
      backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--border);
    }

    .nav-logo {
      height: 70px;
      width: auto;
      filter: drop-shadow(0 0 14px rgba(217, 0, 32, .55));
    }

    .nav-mid {
      display: flex;
      gap: 32px;
      list-style: none;
    }

    .nav-mid a {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gr3);
      transition: color .25s;
      position: relative;
    }

    .nav-mid a::after {
      content: '';
      position: absolute;
      bottom: -4px;
      left: 0;
      right: 100%;
      height: 1px;
      background: var(--r);
      transition: right .3s;
    }

    .nav-mid a:hover {
      color: var(--w);
    }

    .nav-mid a:hover::after {
      right: 0;
    }

    /* ── NAV RIGHT ── */
.nav-right {
  display: flex;
  align-items: center;
  gap: 8px;           /* Reduced gap */
}

.nav-social,
.nav-phone {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: #ccc;
  transition: all .25s;
  font-size: 22px;    /* All icons same size */
}

.nav-social:hover,
.nav-phone:hover {
  color: var(--w);
  transform: scale(1.1);
}

/* Phone specific */
.nav-phone {
  color: var(--gl);
}

.nav-phone i {
  font-size: 22px;
}

/* Hide phone number text on small screens */
@media (max-width: 768px) {
  .nav-phone .phone-text {
    display: none;
  }
}

/* Even tighter on very small screens */
@media (max-width: 480px) {
  .nav-right {
    gap: 1px;           /* Very tight spacing */
  }
  
  .nav-social,
  .nav-phone {
    width: 32px;
    height: 32px;
    font-size: 20.5px;
  }
  
  .btn-r {
    padding: 8px 8px;
    font-size: 10.5px;
  }
}

    .btn-r {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--w);
      background: var(--r);
      padding: 10px 22px;
      clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
      transition: background .25s, box-shadow .25s;
    }

    .btn-r:hover {
      background: var(--r2);
      box-shadow: 0 0 24px rgba(217, 0, 32, .45);
    }

    /* Social icons in navbar */
    .nav-social a {
      font-size: 20px;
      color: #ccc;
      transition: color .3s;
    }
    .nav-social a:hover { color: var(--w); }

    /* ── RESPONSIVE ── */
    @media (max-width: 1100px) {
      nav {
        padding: 0 24px;
        height: 66px;
      }

      .nav-mid { display: none; }
      .nav-hamburger { display: flex; }

      .hero { 
        grid-template-columns: 1fr; 
        padding-top: 66px;
      }
      .hero-left { padding: 60px 24px; }
      .hero-right { display: none; }

      .sec { padding: 72px 24px; }
      .svc-grid, .prc-grid, .proc-grid, .test-grid { grid-template-columns: 1fr; }
      .why-grid, .cnt-grid { grid-template-columns: 1fr; gap: 50px; }
      .why-imgs { height: 340px; }
      .offer { padding: 32px 24px; }
    }

    /* Small Mobile - iPhone 8 / 375px and below */
   
    /* ── HERO ── */
    .hero {
      position: relative;
      min-height: 100vh;
      display: grid;
      grid-template-columns: 1fr 1fr;
      overflow: hidden;
      padding-top: 68px
    }

    /* Left panel */
    .hero-left {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 80px 60px 80px 80px;
      background: var(--k)
    }

    .hero-noise {
      position: absolute;
      inset: 0;
      opacity: .025;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      background-size: 200px 200px;
      pointer-events: none
    }

    .hero-line-v {
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      width: 1px;
      background: linear-gradient(180deg, transparent, var(--r) 30%, var(--r) 70%, transparent)
    }

    .hero-logo-wrap {
      margin-bottom: 32px;
      animation: fadeUp .8s .1s both
    }

    .hero-logo {
      width: 320px;
      max-width: 85%;
      height: auto;
      filter: drop-shadow(0 6px 32px rgba(217, 0, 32, .5))
    }

    .hero-tag {
      animation: fadeUp .7s .25s both;
      margin-bottom: 18px
    }

    .hero-h1 {
      animation: fadeUp .8s .38s both;
      margin-bottom: 22px
    }

    .hero-sub {
      max-width: 460px;
      animation: fadeUp .8s .52s both;
      margin-bottom: 44px
    }

    .hero-btns {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      animation: fadeUp .8s .65s both;
      margin-bottom: 60px
    }

    .btn-lg {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 3px;
      text-transform: uppercase;
      padding: 17px 38px;
      clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
      display: inline-flex;
      align-items: center;
      gap: 10px;
      transition: all .3s;
      position: relative;
      overflow: hidden
    }

    .btn-lg::after {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .1), transparent);
      transition: left .5s
    }

    .btn-lg:hover::after {
      left: 100%
    }

    .btn-solid {
      color: var(--w);
      background: var(--r)
    }

    .btn-solid:hover {
      background: var(--r2);
      box-shadow: 0 10px 40px rgba(217, 0, 32, .5)
    }

    .btn-ghost {
      color: var(--w);
      background: transparent;
      border: 1px solid rgba(255, 255, 255, .2)
    }

    .btn-ghost:hover {
      border-color: var(--r);
      color: var(--r)
    }

    .hero-stats {
      display: flex;
      gap: 0;
      animation: fadeUp .8s .78s both
    }

    .hero-st {
      padding: 0 28px 0 0;
      margin-right: 28px;
      border-right: 1px solid var(--border)
    }

    .hero-st:last-child {
      border-right: none
    }

    .hero-st-n {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 42px;
      color: var(--r);
      line-height: 1
    }

    .hero-st-l {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gr);
      margin-top: 2px
    }

    /* Right panel — image mosaic */
    .hero-right {
      position: relative;
      display: grid;
      grid-template-rows: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
      gap: 2px;
      overflow: hidden
    }

    .hero-img-cell {
      position: relative;
      overflow: hidden
    }

    .hero-img-cell img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(.5) saturate(.7);
      transition: filter .5s, transform .6s ease
    }

    .hero-img-cell:hover img {
      filter: brightness(.7) saturate(.9);
      transform: scale(1.04)
    }

    .hero-img-cell.large {
      grid-row: 1/3;
      grid-column: 1/2
    }

    .hero-img-lbl {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 12px 14px;
      background: linear-gradient(transparent, rgba(5, 5, 5, .9));
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gr2);
      display: flex;
      align-items: center;
      gap: 7px
    }

    .hero-img-lbl i {
      color: var(--r);
      font-size: 9px
    }

    .hero-vline {
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 1px;
      background: linear-gradient(180deg, transparent, var(--r) 30%, var(--r) 70%, transparent)
    }

    /* ── MARQUEE ── */
    .mq {
      background: var(--r);
      overflow: hidden;
      display: flex;
      border-top: 1px solid rgba(255, 255, 255, .08)
    }

    .mq-track {
      display: flex;
      white-space: nowrap;
      animation: mq 25s linear infinite;
      padding: 13px 0
    }

    @keyframes mq {
      from {
        transform: translateX(0)
      }

      to {
        transform: translateX(-50%)
      }
    }

    .mq-item {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      padding: 0 36px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 3.5px;
      text-transform: uppercase;
      color: rgba(255, 255, 255, .92);
      border-right: 1px solid rgba(255, 255, 255, .18)
    }

    .mq-item i {
      font-size: 9px;
      opacity: .65
    }

    /* ── SECTION WRAPPER ── */
    .sec {
      padding: 96px 80px
    }

    .sec-center {
      max-width: 1200px;
      margin: 0 auto
    }

    .sec-hdr {
      text-align: center;
      margin-bottom: 64px
    }

    .sec-hdr .tag {
      margin-bottom: 16px
    }

    .sec-hdr .h2 {
      margin-bottom: 16px
    }

    .sec-hdr .body-text {
      max-width: 520px;
      margin: 0 auto
    }

    /* ── SERVICES ── */
    .svc-bg {
      background: var(--k2)
    }

    .svc-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px
    }

    .svc-card {
      background: var(--k3);
      border: 1px solid var(--border);
      overflow: hidden;
      transition: transform .35s, border-color .35s, box-shadow .35s;
      position: relative
    }

    .svc-card::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 2px;
      background: var(--r);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .4s
    }

    .svc-card:hover {
      transform: translateY(-6px);
      border-color: var(--border-r);
      box-shadow: 0 24px 60px rgba(0, 0, 0, .5)
    }

    .svc-card:hover::after {
      transform: scaleX(1)
    }

    .svc-img {
      width: 100%;
      height: 200px;
      object-fit: cover;
      filter: brightness(.55) saturate(.75);
      transition: filter .45s, transform .55s
    }

    .svc-card:hover .svc-img {
      filter: brightness(.75) saturate(.95);
      transform: scale(1.04)
    }

    .svc-body {
      padding: 28px
    }

    .svc-icon {
      width: 48px;
      height: 48px;
      background: rgba(217, 0, 32, .1);
      border: 1px solid rgba(217, 0, 32, .25);
      display: flex;
      align-items: center;
      justify-content: center;
      clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
      margin-bottom: 18px;
      transition: background .3s
    }

    .svc-card:hover .svc-icon {
      background: rgba(217, 0, 32, .2)
    }

    .svc-icon i {
      font-size: 18px;
      color: var(--r)
    }

    .svc-name {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 26px;
      letter-spacing: 1px;
      color: var(--w);
      margin-bottom: 10px
    }

    .svc-desc {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr2);
      line-height: 1.7;
      margin-bottom: 18px
    }

    .svc-price {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 32px;
      color: var(--r);
      display: flex;
      align-items: baseline;
      gap: 4px
    }

    .svc-price small {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 1px;
      color: var(--gr);
      font-family: 'Barlow Condensed', sans-serif
    }

    /* ── PRICING ── */
    .price-bg {
      background: var(--k)
    }

    .price-cat {
      max-width: 1200px;
      margin: 0 auto 56px
    }

    .price-cat:last-child {
      margin-bottom: 0
    }

    .cat-hdr {
      display: flex;
      align-items: center;
      gap: 18px;
      margin-bottom: 24px;
      padding-bottom: 18px;
      border-bottom: 1px solid var(--border)
    }

    .cat-ico {
      width: 44px;
      height: 44px;
      background: var(--r);
      display: flex;
      align-items: center;
      justify-content: center;
      clip-path: polygon(7px 0%, 100% 0%, calc(100% - 7px) 100%, 0% 100%);
      flex-shrink: 0
    }

    .cat-ico i {
      font-size: 16px;
      color: var(--w)
    }

    .cat-lbl {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--r);
      display: block
    }

    .cat-name {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 32px;
      color: var(--w);
      letter-spacing: 1px
    }

    .prc-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px
    }

    /* PRICING CARD */
    .pc {
      background: var(--k3);
      border: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      position: relative;
      transition: transform .35s, border-color .35s, box-shadow .35s
    }

    .pc:hover {
      transform: translateY(-4px);
      border-color: var(--border-r);
      box-shadow: 0 20px 50px rgba(0, 0, 0, .45)
    }

    .pc.hot {
      background: linear-gradient(155deg, #180208, #130206 55%, #180308);
      border: 1px solid rgba(217, 0, 32, .4)
    }

    .pc-bar {
      height: 2px;
      background: var(--k5);
      transition: background .3s
    }

    .pc:hover .pc-bar,
    .pc.hot .pc-bar {
      background: linear-gradient(90deg, var(--r2), var(--r))
    }

    .pc-badge {
      position: absolute;
      top: 14px;
      right: 0;
      background: var(--g);
      color: var(--k);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      padding: 5px 12px 5px 8px;
      clip-path: polygon(7px 0%, 100% 0%, 100% 100%, 0% 100%)
    }

    .pc-img {
      width: 100%;
      height: 130px;
      object-fit: cover;
      filter: brightness(.45) saturate(.65);
      transition: filter .4s, transform .5s
    }

    .pc:hover .pc-img {
      filter: brightness(.6) saturate(.85);
      transform: scale(1.03)
    }

    .pc-body {
      padding: 24px 24px 0;
      flex: 1
    }

    .pc-cat {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--r);
      margin-bottom: 5px;
      display: flex;
      align-items: center;
      gap: 8px
    }

    .pc-cat::after {
      content: '';
      flex: 1;
      height: 1px;
      background: rgba(217, 0, 32, .2)
    }

    .pc-name {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 30px;
      letter-spacing: 1px;
      color: var(--w);
      margin-bottom: 14px
    }

    .pc-price-row {
      display: flex;
      align-items: flex-end;
      gap: 10px;
      margin-bottom: 3px
    }

    .pc-eur {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 64px;
      color: var(--r);
      line-height: 1
    }

    .pc-eur sup {
      font-size: 24px;
      vertical-align: top;
      margin-top: 10px
    }

    .pc-from-col {
      display: flex;
      flex-direction: column;
      gap: 2px;
      padding-bottom: 8px
    }

    .pc-from {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--gr);
      line-height: 1.2
    }

    .pc-note {
      font-size: 13px;
      font-weight: 700;
      color: var(--gl);
      letter-spacing: .5px;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 6px
    }

    .pc-note i {
      color: var(--gl);
      font-size: 11px
    }

    .pc-div {
      height: 1px;
      background: var(--border);
      margin: 0 -24px 18px
    }

    .pc-feats {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 9px;
      margin-bottom: 24px
    }

    .pc-feats li {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 13px;
      font-weight: 300;
      color: var(--gr3);
      line-height: 1.45
    }

    .pc-feats li i {
      font-size: 8px;
      color: var(--r);
      margin-top: 4px;
      flex-shrink: 0;
      width: 12px
    }

    .pc-feats li.prev {
      color: var(--gl);
      font-size: 13px;
      font-weight: 700;
      font-style: normal;
      background: rgba(201,162,39,0.08);
      border: 1px solid rgba(201,162,39,0.25);
      padding: 6px 10px;
      border-radius: 2px;
      letter-spacing: .3px
    }

    .pc-feats li.prev i {
      color: var(--gl);
      font-size: 11px
    }

    .pc-foot {
      padding: 16px 24px;
      border-top: 1px solid var(--border);
      background: rgba(0, 0, 0, .18)
    }

    .pc-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--gr2);
      transition: color .25s
    }

    .pc-cta i {
      color: var(--r);
      font-size: 10px;
      transition: transform .3s
    }

    .pc-cta:hover {
      color: var(--w)
    }

    .pc-cta:hover i {
      transform: translateX(4px)
    }

    /* ── OFFER ── */
    .offer {
      background: linear-gradient(100deg, #1c0005, var(--r2) 45%, var(--r));
      padding: 36px 80px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
      flex-wrap: wrap;
      position: relative;
      overflow: hidden
    }

    .offer::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, .02) 0px, rgba(255, 255, 255, .02) 1px, transparent 1px, transparent 12px);
      pointer-events: none
    }

    .offer-ico {
      width: 60px;
      height: 60px;
      background: rgba(255, 255, 255, .12);
      border: 1px solid rgba(255, 255, 255, .2);
      display: flex;
      align-items: center;
      justify-content: center;
      clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
      flex-shrink: 0
    }

    .offer-ico i {
      font-size: 22px;
      color: var(--w)
    }

    .offer-left {
      display: flex;
      align-items: center;
      gap: 20px;
      position: relative
    }

    .offer-ttl {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 32px;
      color: var(--w);
      letter-spacing: 1px;
      line-height: 1.1
    }

    .offer-ttl span {
      color: var(--gl)
    }

    .offer-note {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: rgba(255, 255, 255, .65);
      margin-top: 5px;
      display: flex;
      align-items: center;
      gap: 7px
    }

    .offer-note i {
      font-size: 9px
    }

    .btn-gold {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--k);
      background: var(--gl);
      padding: 16px 36px;
      clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
      display: inline-flex;
      align-items: center;
      gap: 10px;
      transition: all .3s;
      position: relative;
      white-space: nowrap
    }

    .btn-gold:hover {
      background: var(--w);
      box-shadow: 0 10px 32px rgba(0, 0, 0, .3)
    }

    /* ── PROCESS ── */
    .proc-bg {
      background: var(--k2)
    }

    .proc-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 2px;
      max-width: 1200px;
      margin: 0 auto
    }

    .proc-step {
      background: var(--k3);
      border: 1px solid var(--border);
      padding: 36px 26px;
      position: relative;
      transition: border-color .3s, transform .35s, background .3s
    }

    .proc-step:hover {
      border-color: var(--border-r);
      background: var(--k4);
      transform: translateY(-4px)
    }

    .ps-num {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--r);
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 18px
    }

    .ps-num::after {
      content: '';
      flex: 1;
      height: 1px;
      background: rgba(217, 0, 32, .2)
    }

    .ps-ico {
      width: 52px;
      height: 52px;
      background: rgba(217, 0, 32, .08);
      border: 1px solid rgba(217, 0, 32, .2);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
      transition: background .3s, border-color .3s
    }

    .proc-step:hover .ps-ico {
      background: rgba(217, 0, 32, .16);
      border-color: rgba(217, 0, 32, .4)
    }

    .ps-ico i {
      font-size: 20px;
      color: var(--r)
    }

    .ps-title {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 22px;
      letter-spacing: .5px;
      color: var(--w);
      margin-bottom: 10px
    }

    .ps-desc {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr2);
      line-height: 1.65
    }

    /* ── WHY US ── */
    .why-bg {
      background: var(--k)
    }

    .why-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      max-width: 1200px;
      margin: 0 auto;
      align-items: center
    }

    .why-imgs {
      position: relative;
      height: 560px
    }

    .wi-main {
      position: absolute;
      top: 0;
      left: 0;
      width: 72%;
      height: 72%;
      object-fit: cover;
      filter: brightness(.7) saturate(.8)
    }

    .wi-sec {
      position: absolute;
      bottom: 0;
      right: 0;
      width: 58%;
      height: 52%;
      object-fit: cover;
      filter: brightness(.65) saturate(.75)
    }

    .wi-badge {
      position: absolute;
      bottom: 30%;
      left: 22%;
      background: var(--r);
      padding: 16px 18px;
      clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
      z-index: 1;
      text-align: center;
      min-width: 100px
    }

    .wi-badge .n {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 36px;
      color: var(--w);
      line-height: 1
    }

    .wi-badge .l {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(255, 255, 255, .8);
      margin-top: 2px
    }

    .why-content {}

    .why-pts {
      display: flex;
      flex-direction: column;
      gap: 18px;
      margin-top: 36px
    }

    .wp {
      display: flex;
      gap: 18px;
      padding: 20px;
      background: var(--k3);
      border: 1px solid var(--border);
      border-left: 2px solid var(--r);
      transition: all .3s
    }

    .wp:hover {
      background: var(--k4);
      transform: translateX(5px)
    }

    .wp-ico {
      width: 40px;
      height: 40px;
      background: rgba(217, 0, 32, .09);
      border: 1px solid rgba(217, 0, 32, .22);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0
    }

    .wp-ico i {
      font-size: 14px;
      color: var(--r)
    }

    .wp-title {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 15px;
      font-weight: 800;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--w);
      margin-bottom: 4px
    }

    .wp-desc {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr2);
      line-height: 1.6
    }

    /* ── TESTIMONIALS ── */
    .test-bg {
      background: var(--k2)
    }

    .test-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px;
      max-width: 1200px;
      margin: 0 auto
    }

    .tc {
      background: var(--k3);
      border: 1px solid var(--border);
      padding: 32px;
      position: relative;
      overflow: hidden;
      transition: border-color .3s, transform .35s
    }

    .tc::before {
      content: '\201C';
      font-family: 'Bebas Neue', sans-serif;
      font-size: 150px;
      color: rgba(217, 0, 32, .05);
      position: absolute;
      top: -28px;
      left: 12px;
      line-height: 1;
      pointer-events: none
    }

    .tc:hover {
      border-color: var(--border-r);
      transform: translateY(-4px)
    }

    .tc-stars {
      display: flex;
      gap: 3px;
      margin-bottom: 18px
    }

    .tc-stars i {
      font-size: 11px;
      color: var(--g)
    }

    .tc-text {
      font-size: 14px;
      font-weight: 300;
      color: var(--gr3);
      line-height: 1.75;
      margin-bottom: 24px;
      position: relative
    }

    .tc-sep {
      height: 1px;
      background: var(--border);
      margin-bottom: 20px
    }

    .tc-auth {
      display: flex;
      align-items: center;
      gap: 12px
    }

    .tc-av {
      width: 42px;
      height: 42px;
      background: linear-gradient(135deg, var(--r2), var(--r));
      clip-path: polygon(5px 0%, 100% 0%, calc(100% - 5px) 100%, 0% 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Bebas Neue', sans-serif;
      font-size: 16px;
      color: var(--w);
      flex-shrink: 0
    }

    .tc-name {
      font-family: 'Barlow Condensed', sans-serif;
      font-weight: 800;
      font-size: 15px;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--w)
    }

    .tc-veh {
      font-size: 11px;
      color: var(--gr);
      margin-top: 2px;
      letter-spacing: .3px
    }

    /* ── CONTACT ── */
    .cnt-bg {
      background: var(--k)
    }

    .cnt-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      max-width: 1200px;
      margin: 0 auto;
      align-items: start
    }

    .cnt-phone {
      font-family: 'Bebas Neue', sans-serif;
      font-size: clamp(48px, 5vw, 80px);
      color: var(--w);
      letter-spacing: 3px;
      display: block;
      margin: 24px 0;
      transition: color .25s;
      line-height: 1
    }

    .cnt-phone:hover {
      color: var(--r)
    }

    .cnt-items {
      display: flex;
      flex-direction: column;
      gap: 14px;
      margin-top: 36px
    }

    .ci {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 16px 18px;
      background: var(--k3);
      border: 1px solid var(--border);
      border-left: 2px solid var(--r);
      transition: all .3s
    }

    .ci:hover {
      background: var(--k4);
      transform: translateX(4px)
    }

    .ci-ico {
      width: 38px;
      height: 38px;
      background: rgba(217, 0, 32, .09);
      border: 1px solid rgba(217, 0, 32, .2);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0
    }

    .ci-ico i {
      font-size: 13px;
      color: var(--r)
    }

    .ci-lbl {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 3.5px;
      text-transform: uppercase;
      color: var(--r);
      display: block
    }

    .ci-val {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr3);
      margin-top: 2px
    }

    .cnt-img-wrap {
      position: relative;
      height: 520px;
      overflow: hidden
    }

    .cnt-img-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(.5) saturate(.7);
      transition: filter .4s
    }

    .cnt-img-wrap:hover img {
      filter: brightness(.65) saturate(.85)
    }

    .cnt-img-border {
      position: absolute;
      inset: 0;
      border: 1px solid var(--border-r);
      pointer-events: none
    }

    .cnt-img-tag {
      position: absolute;
      bottom: 20px;
      left: 20px;
      background: rgba(5, 5, 5, .92);
      border: 1px solid var(--border-r);
      padding: 14px 18px;
      backdrop-filter: blur(8px)
    }

    .cnt-img-tag-t {
      font-family: 'Bebas Neue', sans-serif;
      font-size: 20px;
      color: var(--w);
      letter-spacing: 1px
    }

    .cnt-img-tag-s {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--r);
      margin-top: 3px
    }

    /* ── FOOTER ── */
    footer {
      background: var(--k2);
      border-top: 1px solid var(--border)
    }

    .ft-top {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr 1fr;
      gap: 40px;
      padding: 56px 80px 40px;
      max-width: 1400px;
      margin: 0 auto
    }

    .ft-logo {
      height: 40px;
      width: auto;
      margin-bottom: 16px;
      filter: drop-shadow(0 0 10px rgba(217, 0, 32, .35))
    }

    .ft-tagline {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr);
      line-height: 1.7;
      max-width: 230px
    }

    .ft-col-ttl {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: var(--w);
      margin-bottom: 18px;
      padding-bottom: 10px;
      border-bottom: 1px solid var(--border)
    }

    .ft-links {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 9px
    }

    .ft-links a {
      font-size: 13px;
      font-weight: 300;
      color: var(--gr2);
      display: flex;
      align-items: center;
      gap: 8px;
      transition: color .25s
    }

    .ft-links a i {
      font-size: 9px;
      color: var(--r)
    }

    .ft-links a:hover {
      color: var(--r)
    }

    .ft-social {
      display: flex;
      gap: 8px;
      margin-top: 20px
    }

    .ft-sl {
      width: 36px;
      height: 36px;
      background: var(--k4);
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
      transition: all .3s
    }

    .ft-sl i {
      font-size: 13px;
      color: var(--gr2)
    }

    .ft-sl:hover {
      background: var(--r);
      border-color: var(--r)
    }

    .ft-sl:hover i {
      color: var(--w)
    }

    .ft-bot {
      border-top: 1px solid var(--border);
      padding: 18px 80px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 10px
    }

    .ft-bot p {
      font-size: 11px;
      color: var(--gr);
      letter-spacing: .5px
    }

    .ft-bot .red {
      color: var(--r)
    }

    /* ── MOBILE MENU ── */
    .nav-hamburger {
      display: none;
      flex-direction: column;
      justify-content: center;
      gap: 5px;
      cursor: pointer;
      padding: 6px;
      z-index: 1001
    }

    .nav-hamburger span {
      display: block;
      width: 26px;
      height: 2px;
      background: var(--w);
      border-radius: 2px;
      transition: all .3s ease
    }

    .nav-hamburger.open span:nth-child(1) {
      transform: translateY(7px) rotate(45deg)
    }

    .nav-hamburger.open span:nth-child(2) {
      opacity: 0
    }

    .nav-hamburger.open span:nth-child(3) {
      transform: translateY(-7px) rotate(-45deg)
    }

    .mob-menu {
      display: none;
      position: fixed;
      top: 68px;
      left: 0;
      right: 0;
      background: rgba(5, 5, 5, 0.98);
      backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--border-r);
      z-index: 998;
      padding: 0;
      max-height: 0;
      overflow: hidden;
      transition: max-height .4s ease, padding .4s ease
    }

    .mob-menu.open {
      max-height: 500px;
      padding: 16px 0 24px
    }

    .mob-menu ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0
    }

    .mob-menu ul li a {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--gr3);
      display: block;
      padding: 14px 32px;
      border-bottom: 1px solid var(--border);
      transition: color .25s, background .25s
    }

    .mob-menu ul li a:hover {
      color: var(--w);
      background: rgba(217,0,32,.08)
    }

    .mob-menu .mob-tel {
      display: flex;
      align-items: center;
      gap: 8px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 2px;
      color: var(--gl);
      padding: 14px 32px;
      border-bottom: 1px solid var(--border)
    }

    .mob-menu .mob-tel i {
      color: var(--r);
      font-size: 12px
    }

    .mob-menu .mob-btn {
      margin: 18px 32px 0;
      display: inline-flex;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--w);
      background: var(--r);
      padding: 13px 28px;
      clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
      transition: background .25s
    }

    .mob-menu .mob-btn:hover {
      background: var(--r2)
    }

    /* ── ANIMATIONS ── */
    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(24px)
      }

      to {
        opacity: 1;
        transform: translateY(0)
      }
    }

    .rv {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .65s ease, transform .65s ease
    }

    .rv.on {
      opacity: 1;
      transform: translateY(0)
    }

    /* ── RESPONSIVE ── */
@media (max-width: 1100px) {
  nav {
    padding: 0 20px;
    height: 64px;
  }

  .hero {
    grid-template-columns: 1fr;
    min-height: 100vh;
  }

  .hero-left {
    padding: 70px 24px 60px;
  }

  .hero-right {
    display: none;
  }

  .sec {
    padding: 70px 24px;
  }

  .svc-grid,
  .prc-grid,
  .proc-grid,
  .test-grid {
    grid-template-columns: 1fr;
  }

  .why-grid,
  .cnt-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .why-imgs {
    height: 320px;
  }

  .offer {
    padding: 32px 24px;
    flex-direction: column;
    text-align: center;
    gap: 20px;
  }

  .ft-top {
    grid-template-columns: 1fr 1fr;
    padding: 40px 24px 30px;
    gap: 32px;
  }

  .ft-bot {
    padding: 16px 24px;
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }
}
.nav-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px;
  color: var(--r);
  letter-spacing: 1px;
  text-decoration: none;
}

/* Hamburger */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  padding: 6px;
  z-index: 1001;
}

.nav-hamburger span {
  display: block;
  width: 26px;
  height: 2px;
  background: var(--w);
  border-radius: 2px;
  transition: all .3s ease;
}

/* Mobile Menu Trigger */
@media (max-width: 1100px) {
  .nav-mid {
    display: none !important;
  }
  .nav-hamburger {
    display: flex !important;
  }
}
/* Phone styling */
.nav-phone {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--gl);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-decoration: none;
}

.nav-phone i {
  color: var(--r);
  font-size: 18px;
}


@media (max-width: 480px) {
  nav {
    padding: 0 16px;
    height: 60px;
  }

  .hero-left {
    padding: 60px 20px 50px;
  }

  .h1 {
    font-size: clamp(42px, 9vw, 58px);
  }

  .h2 {
    font-size: clamp(34px, 7.5vw, 48px);
  }

  .hero-btns {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-bottom: 40px;
  }

  .btn-lg {
    padding: 16px 24px;
    font-size: 13px;
    justify-content: center;
  }

  .hero-stats {
    flex-wrap: wrap;
    gap: 16px 0;
  }

  .hero-st {
    padding: 0;
    margin: 0;
    border-right: none;
    flex: 1 1 48%;
    text-align: center;
  }

  .hero-st-n {
    font-size: 32px;
  }

  /* Pricing */
  .pc-eur {
    font-size: 48px;
  }

  .pc-price-row {
    margin-bottom: 8px;
  }

  .pc-body {
    padding: 20px 20px 0;
  }

  /* Process */
  .proc-grid {
    gap: 1px;
  }

  .proc-step {
    padding: 28px 20px;
  }

  /* Offer */
  .offer-ttl {
    font-size: 26px;
    line-height: 1.1;
  }

  /* Contact */
  .cnt-phone {
    font-size: clamp(38px, 8vw, 52px);
  }

  .cnt-grid {
    gap: 40px;
  }

  .cnt-img-wrap {
    height: 380px;
  }

  /* Footer */
  .ft-top {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* Extra small phones */
@media (max-width: 360px) {
  .sec {
    padding: 60px 16px;
  }

  .hero-left {
    padding: 55px 16px 45px;
  }

  .svc-body,
  .pc-body {
    padding: 20px 18px;
  }
}
  
/* ── original nav/header fixes ── */

    /* ====== NAV / HEADER FIXES ====== */
    nav {
      height: 64px !important;
      padding: 0 28px !important;
      gap: 14px;
    }
    .nav-logo {
      height: 44px !important;
      width: auto !important;
    }
    .nav-mid { gap: 26px; margin: 0 auto; }

    .nav-right {
      display: flex !important;
      align-items: center;
      gap: 12px;
      flex-wrap: nowrap;
      white-space: nowrap;
    }
    /* Social icon links: keep them as inline icons, do NOT force a fixed box */
    .nav-social {
      width: auto !important;
      height: auto !important;
      display: inline-flex !important;
      align-items: center;
      justify-content: center;
      margin: 0 !important;
      padding: 4px;
    }
    /* Phone link: let it size to its content so the number stays on ONE line */
    .nav-phone {
      width: auto !important;
      height: auto !important;
      display: inline-flex !important;
      align-items: center;
      gap: 6px;
      white-space: nowrap;
      flex-direction: row !important;
    }
    .nav-phone .phone-text {
      font-size: 13px;
      letter-spacing: 1.5px;
      white-space: nowrap;
    }
    .mob-menu { top: 64px !important; }

    /* Tablet & small desktop: hide center menu, show hamburger */
    @media (max-width: 1100px) {
      nav { padding: 0 18px !important; height: 60px !important; }
      .nav-logo { height: 38px !important; }
      .nav-mid { display: none !important; }
      .nav-hamburger { display: flex !important; }
      .mob-menu { top: 60px !important; }
      .nav-phone .phone-text { display: none; }
    }

    /* Phones */
    @media (max-width: 640px) {
      nav { padding: 0 12px !important; height: 56px !important; gap: 8px; }
      .nav-logo { height: 32px !important; filter: drop-shadow(0 0 8px rgba(217,0,32,.55)); }
      .nav-right { gap: 6px; }
      .nav-social i { font-size: 18px !important; }
      .btn-r { padding: 8px 14px; font-size: 11px; letter-spacing: 2px; }
      .mob-menu { top: 56px !important; }
      .nav-hamburger span { width: 22px; }
    }

    @media (max-width: 380px) {
      nav { padding: 0 10px !important; gap: 6px; }
      .nav-logo { height: 28px !important; }
      .btn-r { padding: 7px 10px; font-size: 10px; letter-spacing: 1.5px; }
      .nav-social { padding: 2px; }
      .nav-social i { font-size: 16px !important; }
    }

    .mob-menu { box-shadow: 0 16px 40px rgba(0,0,0,.5); }
    .mob-menu ul li a { padding: 16px 24px; }
  
/* ══════════════════════════════════════════════════════════════════
   Additions for the reworked site (2026-11): service pages, FAQ, zones.
   ══════════════════════════════════════════════════════════════════ */
img { max-width: 100%; height: auto }
.hero-tag.tag { font-size: 12px }
.svc-card .svc-more, .svc-more {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 18px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 13px; font-weight: 800;
  letter-spacing: 3px; text-transform: uppercase; color: var(--r)
}
.svc-more:hover { color: var(--r3) }
.ft-logo { height: 56px; width: auto; margin-bottom: 18px }

/* Service page hero */
.page-hero { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 540px; padding-top: 68px; background: var(--k) }
.page-hero-txt { padding: 72px 64px; display: flex; flex-direction: column; justify-content: center; position: relative }
.page-hero-txt .h2 { margin: 6px 0 22px }
.page-hero-txt .body-text { max-width: 560px; margin-bottom: 30px }
.page-hero-img { position: relative; overflow: hidden; min-height: 320px }
.page-hero-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.72) saturate(.85) }
.page-hero-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--k) 0%, transparent 35%) }
.page-hero .hero-btns { display: flex; gap: 14px; flex-wrap: wrap }
.crumbs { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--gr2); margin-bottom: 26px }
.crumbs a { color: var(--gr3) }
.crumbs a:hover { color: var(--r) }
.crumbs span { margin: 0 8px; color: var(--r) }

/* Long-form text */
.prose { max-width: 780px; margin: 0 auto }
.prose h2 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(34px, 4vw, 48px); line-height: 1; letter-spacing: 1px; color: var(--w); margin: 48px 0 16px }
.prose h2:first-child { margin-top: 0 }
.prose h2 b { color: var(--r); font-weight: 400 }
.prose h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 21px; font-weight: 700; letter-spacing: .5px; color: var(--w); margin: 28px 0 10px }
.prose p, .prose li { font-size: 16px; font-weight: 300; color: var(--gr3); line-height: 1.8 }
.prose p { margin-bottom: 16px }
.prose strong { color: var(--w); font-weight: 500 }
.prose ul { margin: 0 0 18px 0; padding-left: 0; list-style: none }
.prose li { padding-left: 26px; position: relative; margin-bottom: 8px }
.prose li::before { content: ''; position: absolute; left: 4px; top: 12px; width: 8px; height: 8px; background: var(--r); transform: rotate(45deg) }
.prose a { color: var(--r); border-bottom: 1px solid var(--border-r) }

/* FAQ */
.faq { max-width: 860px; margin: 0 auto }
.faq details { border-bottom: 1px solid var(--border); padding: 22px 4px }
.faq details:first-child { border-top: 1px solid var(--border) }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 20px; align-items: center;
  font-family: 'Barlow Condensed', sans-serif; font-size: 21px; font-weight: 700; letter-spacing: .5px; color: var(--w) }
.faq summary::-webkit-details-marker { display: none }
.faq summary::after { content: '+'; color: var(--r); font-size: 28px; font-weight: 400; line-height: 1; flex-shrink: 0 }
.faq details[open] summary::after { content: '–' }
.faq details p { margin-top: 14px; font-size: 16px; font-weight: 300; color: var(--gr3); line-height: 1.8 }
.faq details p a { color: var(--r) }

/* Zones */
.zones { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; list-style: none; padding: 0; max-width: 960px; margin: 0 auto }
.zones li { border: 1px solid var(--border-r); background: rgba(217, 0, 32, .05); padding: 10px 18px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 600; letter-spacing: 1px; color: var(--w2) }
.zones-note { text-align: center; margin-top: 26px }

/* Links to the other services */
.more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; max-width: 1200px; margin: 0 auto }
.more-card { position: relative; display: block; min-height: 220px; overflow: hidden; background: var(--k3) }
.more-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.45) saturate(.8); transition: transform .5s, filter .4s }
.more-card:hover img { transform: scale(1.05); filter: brightness(.6) }
.more-card div { position: absolute; left: 28px; right: 28px; bottom: 24px }
.more-card b { display: block; font-family: 'Bebas Neue', sans-serif; font-size: 32px; font-weight: 400; color: var(--w); letter-spacing: 1px }
.more-card span { font-family: 'Barlow Condensed', sans-serif; font-size: 13px; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; color: var(--r) }

/* Call-to-action band */
.cta-band { text-align: center; padding: 80px 24px; background: radial-gradient(ellipse at center, rgba(217, 0, 32, .18), transparent 70%), var(--k2) }
.cta-band .h2 { margin-bottom: 18px }
.cta-band .body-text { max-width: 560px; margin: 0 auto 30px }
.cta-band .hero-btns { justify-content: center; display: flex; gap: 14px; flex-wrap: wrap }

/* 404 */
.nf { min-height: 80vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 120px 24px 60px }
.nf .h1 { margin-bottom: 20px }

@media (max-width: 900px) {
  .page-hero { grid-template-columns: 1fr; min-height: 0; padding-top: 60px }
  .page-hero-txt { padding: 44px 22px 36px }
  .page-hero-img { min-height: 240px; order: -1 }
  .page-hero-img::after { background: linear-gradient(0deg, var(--k) 0%, transparent 50%) }
  .more-grid { grid-template-columns: 1fr }
  .more-card { min-height: 170px }
  .prose h2 { margin-top: 36px }
}

/* Hero photos fill their cells without sizing them: the images carry their
   real width/height (for layout stability), which would otherwise let a
   portrait photo stretch its grid row. */
.hero-right { grid-template-rows: minmax(0, 1fr) minmax(0, 1fr) }
.hero-img-cell { min-height: 0 }
.hero-img-cell img { position: absolute; inset: 0 }

/* Zones page: stats, map and town list */
.zstats { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--k) }
.zstats div { padding: 34px 20px; text-align: center; border-right: 1px solid var(--border) }
.zstats div:last-child { border-right: 0 }
.zstats b { display: block; font-family: 'Bebas Neue', sans-serif; font-size: 52px; font-weight: 400; line-height: 1; color: var(--r) }
.zstats span { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--gr2) }
.zmap-wrap { display: grid; grid-template-columns: 1.35fr 1fr; gap: 2px; max-width: 1300px; margin: 0 auto; background: var(--border-r); border: 1px solid var(--border-r) }
#zmap { height: 640px; background: #0e0e0e; z-index: 0 }
.ztowns { background: var(--k3); padding: 30px 28px; max-height: 640px; overflow-y: auto }
.zring + .zring { margin-top: 26px }
.zring h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 800; letter-spacing: 4px; text-transform: uppercase; color: var(--r); margin-bottom: 12px; display: flex; align-items: center; gap: 10px }
.zring h3::after { content: ''; flex: 1; height: 1px; background: var(--border-r) }
.zring ul { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px }
.ztown { width: 100%; text-align: left; cursor: pointer; background: var(--k4); border: 1px solid var(--border); padding: 12px 14px; color: var(--w); transition: border-color .25s, background .25s }
.ztown:hover, .ztown.on { border-color: var(--r); background: rgba(217, 0, 32, .1) }
.ztown-n { display: block; font-family: 'Barlow Condensed', sans-serif; font-size: 17px; font-weight: 700; letter-spacing: .3px; line-height: 1.15 }
.ztown-m { display: block; margin-top: 3px; font-size: 12px; color: var(--gr2) }
.ztowns-cta { display: flex !important; justify-content: center; margin-top: 26px; font-size: 12px !important; letter-spacing: 2px !important; padding: 15px 20px !important }
#zmap .leaflet-popup-content-wrapper, #zmap .leaflet-popup-tip { background: var(--k3); color: var(--w); border: 1px solid var(--border-r); border-radius: 0 }
#zmap .leaflet-popup-content { font-family: 'Barlow', sans-serif; font-size: 13px; margin: 12px 16px }
#zmap .leaflet-popup-content b { font-family: 'Barlow Condensed', sans-serif; font-size: 17px; letter-spacing: .5px }
#zmap .leaflet-container a.leaflet-popup-close-button { color: var(--gr2) }
#zmap .leaflet-control-attribution { background: rgba(5, 5, 5, .75); color: var(--gr2) }
#zmap .leaflet-control-attribution a { color: var(--gr3) }
#zmap .leaflet-bar a { background: var(--k3); color: var(--w); border-color: var(--border) }
.ztip { background: rgba(5, 5, 5, .85); color: var(--w); border: 1px solid var(--border-r); border-radius: 0; box-shadow: none;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-size: 11px }
.ztip::before { display: none }
@media (max-width: 900px) {
  .zstats { grid-template-columns: 1fr 1fr }
  .zstats div:nth-child(2) { border-right: 0 }
  .zstats div:nth-child(-n+2) { border-bottom: 1px solid var(--border) }
  .zstats b { font-size: 40px }
  .zmap-wrap { grid-template-columns: 1fr }
  #zmap { height: 380px }
  .ztowns { max-height: none; padding: 24px 18px }
  .proc-grid[style] { grid-template-columns: 1fr !important }
}
#zmap .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) grayscale(.75) brightness(.8) contrast(1.1) }

/* Icons: Font Awesome's markup, drawn from /img/icons.svg */
.fa-solid, .fa-brands { display: inline-block; width: 1em; height: 1em; line-height: 1; vertical-align: -.125em; font-style: normal }
.fa-solid svg, .fa-brands svg { display: block; width: 100%; height: 100%; fill: currentColor }

/* Contrast (WCAG AA): small red text in a lighter red, small grey text lighter */
:root { --r-text: #ff3348 }
.tag, .cat-lbl, .pc-cat, .ft-bot .red, .svc-more, .crumbs span, .zring h3, .more-card span { color: var(--r-text) }
.tag::before, .tag::after { background: var(--r-text) }
.pc-from, .ft-tagline, .ft-bot p { color: #8c8c8c }

/* The large hero photo: keep the hand and the water jet (left of the photo) in the narrow crop */
.hero-img-cell.large img { object-position: 12% center }