*{margin:0;padding:0;box-sizing:border-box;}html{overflow-x:clip;scroll-behavior:smooth;}body{
    font-family:"Inter",sans-serif;
    background:#050A14;
    color:#fff;
    overflow-x:clip;
    padding-top:0;
}.container{
    max-width:1400px;
    width:100%;
    margin:0 auto;
    padding:0 40px;
}.section-subtitle{
    display:inline-block;
    margin-bottom:16px;
    color:#167BFF;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:4px;
    opacity:.95;
}/* ==========================
   SCROLL ANIMATION
========================== */
.reveal{opacity:1;transform:none;}.reveal.active{opacity:1;transform:translateY(0);}/* ==========================
   SECTIONS
   The homepage is one continuous document. Section height is
   determined by its content, not by the browser viewport height.
========================== */
section{scroll-margin-top:90px;}body.home section{
    height:auto;
    min-height:0;
    overflow:visible;
    scroll-snap-align:none;
    scroll-snap-stop:normal;
}/* ==========================
   HERO
========================== */
.hero{display:flex;flex-direction:column;}.hero-container{
    padding-top:100px;
}.hero-buttons{margin-bottom:36px;}.hero > .container:last-child{
    margin-top:auto;
    padding-bottom:28px;
}/* ==========================
   ABOUT / DIRECTIONS / PROJECTS / CONTACTS
========================== */
.about > .container,
.directions > .container,
.projects > .container,
.contacts > .container{
    height:auto;
    padding-top:108px;
    padding-bottom:64px;
}.about-container{
    height:auto;
    padding:0;
    transform:none;
}/* DIRECTIONS */
.directions .container{
    padding-top:108px;
    padding-bottom:64px;
    transform:none;
}/* ==========================
   PROJECTS
========================== */
.projects{display:flex;padding:0;}.projects .container{
    display:flex;
    flex-direction:column;
    min-height:0;
    transform:none;
}.projects-header{margin-bottom:32px;}.projects-slider{
    flex:0 1 auto;
    min-height:0;
    padding-bottom:28px;
}.projects-slider .swiper-wrapper,
.projects-slider .swiper-slide,
.projects-bento{height:auto;}.projects .project-card{opacity:1;transform:none;}.project-image{height:min(280px,30dvh);}/* ==========================
   CONTACTS
========================== */
.contacts{
    height:auto;
    min-height:0;
    padding:0;
}.contacts .container{
    padding-top:108px;
    padding-bottom:64px;
    transform:none;
}.contacts-top{margin-bottom:24px;}.contacts-grid{margin-bottom:0;}.contacts-map iframe{height:auto;}/* ==========================
   FOOTER
========================== */
.footer{flex:0 0 auto;margin-top:auto;}

/* ==========================
   MOBILE
========================== */
@media (max-width:992px) and (hover: none) and (pointer: coarse) {
    html{scroll-snap-type:none;}
    section,
    .hero,
    .contacts{
        height:auto;
        min-height:0;
        overflow:visible;
        scroll-snap-align:none;
    }
    .hero-container,
    .about > .container,
    .directions > .container,
    .projects > .container,
    .contacts > .container{height:auto;}
}/* Desktop page scrollbar */
html{
    scrollbar-width:thin;
    scrollbar-color:#167BFF rgba(5,14,28,.72);
    overflow-x:clip;
}html::-webkit-scrollbar{width:8px;height:8px;}html::-webkit-scrollbar-track{background:rgba(5,14,28,.72);}html::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#167BFF 0%,#168FFF 55%,#43B7FF 100%);
    border-radius:999px;
    border:2px solid rgba(5,10,20,.82);
    box-shadow:0 0 8px rgba(22,123,255,.55),0 0 16px rgba(22,123,255,.22);
}html::-webkit-scrollbar-thumb:hover{
    background:linear-gradient(180deg,#168FFF 0%,#2AA7FF 55%,#63C7FF 100%);
}body.home{scrollbar-width:thin;}body.home::-webkit-scrollbar{display:block;width:8px;}/* =========================================================
   KEY FACTS STRIP — service (direction) pages, under the hero.
   Facts are the ones already stated in "О компании".
========================================================= */
.svc-facts{
    position:relative;
    z-index:2;
    padding:56px 0 0;
}.svc-facts-bar{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    border:1px solid rgba(120,185,255,.25);
    border-radius:18px;
    background:linear-gradient(180deg, rgba(14,26,46,.78) 0%, rgba(8,15,28,.78) 100%);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.04),
        0 0 30px rgba(22,123,255,.12),
        0 30px 70px rgba(0,0,0,.40);
    transition:box-shadow .45s ease, border-color .45s ease;
}.svc-facts-bar:hover{
    border-color:rgba(120,185,255,.38);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.04),
        0 0 45px rgba(22,123,255,.28),
        0 30px 70px rgba(0,0,0,.40);
}.svc-fact{
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:28px 32px 30px;
}.svc-fact + .svc-fact{
    border-left:1px solid rgba(120,185,255,.14);
}.svc-fact-value{
    position:relative;
    padding-top:16px;
    color:#FFFFFF;
    font-size:28px;
    font-weight:800;
    line-height:1.1;
    white-space:nowrap;
}.svc-fact-value::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:28px;
    height:2px;
    border-radius:2px;
    background:#167BFF;
}.svc-fact-label{
    color:#9FB0C6;
    font-size:14px;
    line-height:1.45;
}/* the strip fills the old empty gap, so the next block moves up */
.svc-facts + .pump-equipment{
    padding-top:72px !important;
}

@media (max-width:1100px){
    .svc-fact{ padding:24px 22px 26px; }
    .svc-fact-value{ font-size:24px; }
}

@media (max-width:900px){
    .svc-facts-bar{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
    .svc-fact:nth-child(3){ border-left:none; }
    .svc-fact:nth-child(n+3){ border-top:1px solid rgba(120,185,255,.14); }
}

@media (max-width:767px){
    .svc-facts{ padding-top:36px; }
    .svc-fact{ padding:18px 16px 20px; gap:6px; }
    .svc-fact-value{ font-size:20px; padding-top:12px; white-space:normal; }
    .svc-fact-label{ font-size:12.5px; }
    .svc-facts + .pump-equipment{ padding-top:48px !important; }
}
