/* VKAS PILOT V2: 22 Oct 2026 — replaces only the already enabled PILOT stylesheet.
 * Scope: /services/kabina-i-rama/gidravlika/ via body.vkas-eng-pilot.
 * Approved hero and page content remain unchanged.
 * Original approved sources: engineering background + technical drawing + LEFT-FACING KAMAZ K5.
 */
body.vkas-eng-pilot main#main {
  background-color: #eaf6ff;
  background-image:
    url('../vkas-engineering/engineering-pattern-approved.webp'),
    linear-gradient(120deg,#f9fcff 0%,#e3f2fd 46%,#f3faff 100%);
  background-position: center top,center top;
  background-size: 100% auto, cover;
  background-repeat: no-repeat, no-repeat;
}
/* Main section remains a transparent canvas so the approved page background shows through. */
body.vkas-eng-pilot main#main > .svc,
body.vkas-eng-pilot .svc__main {
  position:relative;
  isolation:isolate;
  background-color:transparent;
}
/* K5 on the RIGHT, LARGE, behind content, facing INWARD (left), only BELOW the hero. */
body.vkas-eng-detail main#main > .svc::before {
  content:"";
  position:absolute;
  pointer-events:none;
  right:-12vw;
  top:-28px;
  width:min(77vw,1120px);
  height:1140px;
  z-index:0;
  opacity:.55;
  background-image:url('../vkas-engineering/kamaz-k5-transparent.webp');
  background-repeat:no-repeat;
  background-position:right top;
  background-size:contain;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 97%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 97%);
}
body.vkas-eng-pilot main#main > .svc > * {position:relative;z-index:1;min-width:0}
/* Keep text readable in the sidebar on top of the truck. */
body.vkas-eng-pilot .svc__aside .sidecard,
body.vkas-eng-pilot .sidecard {
  background:rgba(255,255,255,.95);
  border-color:rgba(131,174,208,.52);
  box-shadow:0 12px 30px rgba(11,45,74,.07);
}
/* TECHNICAL UI PATTERN: preserve the detail; reduce overlay opacity. */
body.vkas-eng-pilot .svc__price,
body.vkas-eng-pilot .kamaz-cta,
body.vkas-eng-pilot .section--dark {
  background-color:#0a2a4a;
  background-image:
    linear-gradient(105deg,rgba(6,29,54,.81) 0%,rgba(8,45,80,.66) 100%);
  background-position: center;
  background-size: cover;
  background-repeat:no-repeat;
}
body.vkas-eng-pilot .leadblock--blue {
  background-color:#075caa;
  background-image:
    linear-gradient(112deg,rgba(0,83,155,.72),rgba(6,68,135,.67));
  background-position: center;
  background-size: cover;
  background-repeat:no-repeat;
}
/* Light cards keep good contrast; they still have a faint technical texture. */
body.vkas-eng-pilot .svc__main .svc__block li,
body.vkas-eng-pilot .svc__main .kamaz-expert {
  background-color:rgba(255,255,255,.86);
}
body.vkas-eng-pilot .section--tint,
body.vkas-eng-pilot .leadblock:not(.leadblock--blue) {
  background-color:rgba(231,245,254,.55);
  background-image:
    linear-gradient(110deg,rgba(255,255,255,.63),rgba(232,246,254,.45)),
    url('../vkas-engineering/engineering-pattern-approved.webp');
  background-repeat:no-repeat;
  background-size:cover,cover;
  background-position:center center;
}
/* NEVER target .phead, .console, header or footer. */
@media(max-width:900px){
  body.vkas-eng-pilot main#main {background-size:1400px auto,cover;background-position:55% top,center}
  body.vkas-eng-detail main#main > .svc::before {
    width:min(92vw,830px);right:-23vw;top:30px;height:870px;opacity:.30;
  }
}
@media(max-width:767px){
  body.vkas-eng-pilot main#main {background-size:1050px auto,cover;background-position:58% top,center}
  body.vkas-eng-detail main#main > .svc::before {
    width:110vw;right:-45vw;top:40px;height:590px;opacity:.14;
  }
  body.vkas-eng-pilot .svc__price,
  body.vkas-eng-pilot .kamaz-cta,
  body.vkas-eng-pilot .leadblock--blue {background-size:cover,auto 145%}
}

/* VKAS UI PATTERN V5 WEBP: original drawing as optimized transparent texture. */
/* A single continuous texture overlays entire panel; only pilot page. */
body.vkas-eng-pilot .svc__price,
body.vkas-eng-pilot .kamaz-cta,
body.vkas-eng-pilot .section--dark {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(110deg, #09223e 0%, #0d3153 100%);
}
body.vkas-eng-pilot .leadblock--blue {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(110deg, #07569c 0%, #0b69b5 100%);
}
body.vkas-eng-pilot .svc__price::before,
body.vkas-eng-pilot .kamaz-cta::before,
body.vkas-eng-pilot .section--dark::before,
body.vkas-eng-pilot .leadblock--blue::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-image: url('../vkas-engineering/engineering-ui-dark-lines.webp');
  background-size: 460px auto;
  background-position: center top;
  background-repeat: repeat;
  opacity: .32;
  filter: none;
  mix-blend-mode: normal;
}
body.vkas-eng-pilot .leadblock--blue::before { opacity: .24; }
body.vkas-eng-pilot .svc__price > *,
body.vkas-eng-pilot .kamaz-cta > *,
body.vkas-eng-pilot .section--dark > *,
body.vkas-eng-pilot .leadblock--blue > * {
  position: relative;
  z-index: 1;
}

/* VKAS CHECKLIST ROUNDED V1 — PILOT ONLY */
/* The four pale checklist strips below 'На что обращаем внимание'. */
body.vkas-eng-pilot .svc__pair .svc__mini .checklist > li {
  border-radius: 10px;
  overflow: hidden;
  padding: 7px 10px;
}

/* VKAS UNIFIED ROUNDED ROWS V2 BEGIN */
/* Applied throughout the PILOT service page, not to the whole site. */
body.vkas-eng-pilot main#main .svc__main .svc__block li {
    border-radius: 10px;
    background-clip: padding-box;
}
/* The rows in 'Где обычно скрывается причина' and 'Что делаем'. */
body.vkas-eng-pilot main#main .svc__main .svc__block .worklist {
    row-gap: 8px;
}
body.vkas-eng-pilot main#main .svc__main .svc__block .worklist > li {
    padding: 12px 14px;
    border: 1px solid rgba(171, 200, 223, .54);
}
/* 'На что обращаем внимание' and equivalent checklist rows. */
body.vkas-eng-pilot main#main .svc__main .svc__block .checklist > li {
    padding: 7px 10px;
}
/* VKAS UNIFIED ROUNDED ROWS V2 END */
/* VKAS REMOVE DUPLICATE UI LAYERS V1 */

/* VKAS BG BALANCE V1 BEGIN */
/* Pilot only. Extra translucent layer calms the approved light pattern. */
body.vkas-eng-pilot main#main {
  background-image:
    linear-gradient(rgba(250, 253, 255, .36), rgba(250, 253, 255, .36)),
    url('../vkas-engineering/engineering-pattern-approved.webp'),
    linear-gradient(120deg, #f9fcff 0%, #e3f2fd 46%, #f3faff 100%);
  background-size: cover, 100% auto, cover;
  background-position: center, center top, center;
  background-repeat: no-repeat, no-repeat, no-repeat;
}
/* K5: smaller, lower and more atmospheric — not a dominant floating object. */
body.vkas-eng-detail main#main > .svc::before {
  top: 145px;
  right: -12vw;
  width: min(69vw, 1000px);
  height: 900px;
  opacity: .29;
  background-position: right top;
  background-size: contain;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 34%, rgba(0,0,0,.72) 53%, transparent 80%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 34%, rgba(0,0,0,.72) 53%, transparent 80%);
}
@media (min-width: 768px) and (max-width: 900px) {
  body.vkas-eng-pilot main#main {
    background-size: cover, 1400px auto, cover;
    background-position: center, 55% top, center;
  }
  body.vkas-eng-detail main#main > .svc::before {
    top: 135px;
    right: -24vw;
    width: 91vw;
    height: 730px;
    opacity: .22;
  }
}
@media (max-width: 767px) {
  body.vkas-eng-pilot main#main {
    background-image:
      linear-gradient(rgba(250, 253, 255, .43), rgba(250, 253, 255, .43)),
      url('../vkas-engineering/engineering-pattern-approved.webp'),
      linear-gradient(120deg, #f9fcff 0%, #e3f2fd 46%, #f3faff 100%);
    background-size: cover, 1050px auto, cover;
    background-position: center, 58% top, center;
  }
  body.vkas-eng-detail main#main > .svc::before {
    top: 100px;
    right: -48vw;
    width: 142vw;
    height: 690px;
    opacity: .21;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 37%, rgba(0,0,0,.60) 53%, transparent 75%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 37%, rgba(0,0,0,.60) 53%, transparent 75%);
  }
}
/* VKAS BG BALANCE V1 END */
/* VKAS ENGINEERING GLOBAL V1 */

/* VKAS INNER SECTION ENGINEERING V2 BEGIN */
/* Target actual section structures. Do not touch services console, company hero,
   the homepage, or the approved standalone HERO and K5 rules. */
body.vkas-eng-pilot .section.vkc,
body.vkas-eng-pilot .vab05 .section.vab05-intro,
body.vkas-eng-pilot .vab05 .section.vab05-history,
body.vkas-eng-pilot .vab05 .section.vab05-workflow,
body.vkas-eng-pilot .vab05 .section.vab05-gallery {
  background-color: #eef7fe;
  background-image:
    linear-gradient(rgba(255,255,255,.70),rgba(255,255,255,.70)),
    url('../vkas-engineering/engineering-pattern-approved.webp');
  background-position: center top, center top;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;
}
@media (max-width: 767px) {
  body.vkas-eng-pilot .section.vkc,
  body.vkas-eng-pilot .vab05 .section.vab05-intro,
  body.vkas-eng-pilot .vab05 .section.vab05-history,
  body.vkas-eng-pilot .vab05 .section.vab05-workflow,
  body.vkas-eng-pilot .vab05 .section.vab05-gallery {
    background-image:
      linear-gradient(rgba(255,255,255,.77),rgba(255,255,255,.77)),
      url('../vkas-engineering/engineering-pattern-approved.webp');
    background-position: center top, 55% top;
  }
}
/* VKAS INNER SECTION ENGINEERING V2 END */

/* VKAS K5 MOBILE OVERFLOW CLIP V1 */
/* Clip only the oversized decorative truck; do not modify HERO or layouts. */
@media (max-width: 767px) {
  body.vkas-eng-detail,
  body.vkas-eng-pilot {
    overflow-x: clip;
  }
  body.vkas-eng-detail main#main > .svc,
  body.vkas-eng-pilot main#main > .svc {
    overflow-x: clip;
    max-width: 100%;
  }
}
@supports not (overflow: clip) {
  @media (max-width: 767px) {
    body.vkas-eng-detail,
    body.vkas-eng-pilot {
      overflow-x: hidden;
    }
    body.vkas-eng-detail main#main > .svc,
    body.vkas-eng-pilot main#main > .svc {
      overflow-x: hidden;
    }
  }
}
/* VKAS K5 MOBILE OVERFLOW CLIP V1 END */

/* VKAS K5 GLOBAL MOBILE SAFETY V1 START */
/* Hide ONLY decorative truck below HERO on service-detail mobile/tablet. */
@media screen and (max-width: 900px) {
  body.vkas-eng-detail main#main > .svc::before,
  body.vkas-eng-pilot main#main > .svc::before {
    content: none !important;
    display: none !important;
    background-image: none !important;
  }
}
/* VKAS K5 GLOBAL MOBILE SAFETY V1 END */

/* VKAS_K5_MOBILE_HARD_FIX_V2_BEGIN */
/* Only below 901px, only service-detail. Defeat earlier K5 pseudo overrides. */
@media screen and (max-width: 900px) {
  body.vkas-eng-detail main#main > .svc::before,
  body.vkas-eng-pilot main#main > .svc::before {
    content: none !important;
    display: none !important;
    background-image: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  /* Clip decoration, without changing layout widths or the approved hero. */
  body.vkas-eng-detail main#main,
  body.vkas-eng-detail main#main > .svc,
  body.vkas-eng-pilot main#main,
  body.vkas-eng-pilot main#main > .svc {
    max-width: 100%;
    overflow-x: clip;
  }
}
/* VKAS_K5_MOBILE_HARD_FIX_V2_END */
