@font-face{font-family:"PPNeueMachina";src:url("https://oil-66.ru/wp-content/uploads/2026/08/PPNeueMachina-Regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"VelaSans";src:url("https://oil-66.ru/wp-content/uploads/2026/08/VelaSans-GX.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}

body.slo-delivery-page-body{
  --slo-ink:#0a253e;
  --slo-orange:#FFD700;
  --slo-line:rgba(255,255,255,.14);
  --slo-muted:rgba(255,255,255,.55);
  margin:0;
  background:#010101;
  color:#fff;
  font-family:"VelaSans",Arial,sans-serif;
}
.slo-delivery-page{width:100%;min-height:100vh;padding-top:78px;background:#010101;overflow:hidden}
.slo-delivery-page *{box-sizing:border-box}

/* exact hero CTA */
.slo-delivery-page .slo7-cta{width:402px;height:50px;display:grid;grid-template-columns:348px 50px;gap:4px;color:#fff!important;text-decoration:none!important}
.slo-delivery-page .slo7-cta>span,.slo-delivery-page .slo7-cta>b{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;isolation:isolate;border-radius:4px;background:var(--slo-orange);color:#fff!important}
.slo-delivery-page .slo7-cta>span::before,.slo-delivery-page .slo7-cta>b::before{content:"";position:absolute;z-index:0;left:50%;top:100%;width:185%;aspect-ratio:1;border-radius:50%;background:var(--slo-ink);transform:translate3d(-50%,0,0);transition:transform .735s cubic-bezier(.65,.05,0,1)}
.slo-delivery-page .slo7-cta:hover>span::before,.slo-delivery-page .slo7-cta:hover>b::before{transform:translate3d(-50%,-64%,0) scale(1.22)}
.slo-delivery-page .slo7-cta__label{position:relative;z-index:1;font-style:normal;font-size:13px;font-weight:500}
.slo-delivery-page .slo7-cta__arrow{position:relative;z-index:1;display:block;width:25px;height:25px;background:url("../icons/arrow-up-right.svg") center/contain no-repeat;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.slo-delivery-page .slo7-cta:hover .slo7-cta__arrow{transform:translate(2px,-2px) rotate(4deg)}

/* hero */
.slo-delivery-hero{padding-top:42px!important;padding-bottom:42px!important;border-bottom:0}
.slo-delivery-crumbs{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.42);font-size:10px}
.slo-delivery-crumbs a{color:rgba(255,255,255,.62);text-decoration:none}
.slo-delivery-crumbs a:hover{color:var(--slo-orange)}
.slo-delivery-hero__layout{
  margin-top:42px;
  display:block;
}


.slo-delivery-hero__main{
  width:100%;
  min-width:0;
}
.slo-delivery-hero h1{
  margin:0!important;
  max-width:none!important;
  white-space:nowrap!important;
  color:#fff!important;
  font:400 clamp(62px,6.2vw,108px)/.86 "PPNeueMachina",Arial,sans-serif!important;
  letter-spacing:-.07em!important;
  text-transform:none!important;
}
/* intro */
.slo-delivery-rules{padding-top:34px!important;padding-bottom:58px!important}
/* editorial rows */
.slo-delivery-rules__list{border-top:1px solid var(--slo-line)}
.slo-delivery-rule{
  position:relative;
  display:grid;
  grid-template-columns:8% 30% minmax(0,1fr) 30px;
  gap:24px;
  align-items:center;
  min-height:145px;
  padding:24px 8px 24px 0;
  border-bottom:1px solid var(--slo-line);
  overflow:hidden;
  isolation:isolate;
  transition:border-color .32s ease;
}
.slo-delivery-rule::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:var(--slo-orange);
  transform:scaleY(0);
  transform-origin:50% 100%;
  transition:transform .58s cubic-bezier(.22,1,.36,1);
  will-change:transform;
}
.slo-delivery-rule:hover{
  border-color:transparent;
}
.slo-delivery-rule:hover::before{
  transform:scaleY(1);
}
.slo-delivery-rule__index{align-self:start;padding-top:7px;color:var(--slo-orange);font-size:10px;letter-spacing:.12em;transition:color .3s ease}
.slo-delivery-rule__title h3{margin:0;color:#fff;font:400 clamp(30px,2.7vw,48px)/.95 "PPNeueMachina",Arial,sans-serif;letter-spacing:-.05em;transition:color .3s ease}
.slo-delivery-rule__copy p{max-width:690px;margin:0;color:var(--slo-muted);font-size:15px;line-height:1.55;transition:color .3s ease}
.slo-delivery-rule__mark{position:relative;width:18px;height:18px;justify-self:end}
.slo-delivery-rule__mark::before,.slo-delivery-rule__mark::after{content:"";position:absolute;background:var(--slo-orange);transition:background .34s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.slo-delivery-rule__mark::before{width:18px;height:1px;left:0;top:8px}
.slo-delivery-rule__mark::after{width:1px;height:18px;left:8px;top:0}
.slo-delivery-rule:hover .slo-delivery-rule__index,.slo-delivery-rule:hover .slo-delivery-rule__title h3,.slo-delivery-rule:hover .slo-delivery-rule__copy p{color:#fff}
.slo-delivery-rule:hover .slo-delivery-rule__mark::before,.slo-delivery-rule:hover .slo-delivery-rule__mark::after{background:#010101}
.slo-delivery-rule--accent .slo-delivery-rule__title h3{color:var(--slo-orange)}
.slo-delivery-rule--accent:hover .slo-delivery-rule__title h3{color:#fff}

/* quiet end */
/* reveal */
[data-slo-delivery-reveal]{
  opacity:0;
  transform:translate3d(0,18px,0);
  transition:
    opacity .64s cubic-bezier(.16,1,.3,1),
    transform .82s cubic-bezier(.16,1,.3,1);
  will-change:opacity,transform;
}
[data-slo-delivery-reveal].is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}
.slo-delivery-rule[data-slo-delivery-reveal]{
  opacity:0;
  transform:translate3d(0,20px,0);
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

@media(max-width:1180px){
  .slo-delivery-page .slo7-cta{width:340px;grid-template-columns:minmax(0,1fr) 50px}
  .slo-delivery-hero__layout,.slo-delivery-rule{grid-template-columns:8% 31% minmax(0,1fr) 26px;gap:18px}
}
@media(max-width:900px){
  .slo-delivery-hero__layout{display:block}
  
  .slo-delivery-hero h1{white-space:normal!important;font-size:clamp(56px,11vw,88px)!important}
  .slo-delivery-rule{grid-template-columns:42px minmax(180px,34%) 1fr 22px;min-height:130px;gap:14px}
}
@media(max-width:650px){
  .slo-delivery-page{padding-top:68px}
  .slo-delivery-hero{padding-top:30px!important;padding-bottom:32px!important}
  .slo-delivery-hero__layout{margin-top:34px}
  .slo-delivery-hero h1{font-size:15vw!important}
  .slo-delivery-page .slo7-cta{width:100%;grid-template-columns:minmax(0,1fr) 50px}
  .slo-delivery-rules{padding-top:44px!important;padding-bottom:50px!important}
  .slo-delivery-rule{grid-template-columns:34px 1fr 22px;min-height:0;padding:22px 0}
  .slo-delivery-rule__index{grid-column:1;grid-row:1/3}
  .slo-delivery-rule__title{grid-column:2}
  .slo-delivery-rule__copy{grid-column:2}
  .slo-delivery-rule__mark{grid-column:3;grid-row:1}
  .slo-delivery-rule__title h3{font-size:32px}
  .slo-delivery-rule__copy p{margin-top:12px;font-size:13px}
  
  }
@media(prefers-reduced-motion:reduce){
  [data-slo-delivery-reveal]{opacity:1;transform:none;transition:none!important}
  .slo-delivery-rule,.slo-delivery-rule::before,.slo-delivery-rule__mark::before,.slo-delivery-rule__mark::after,.slo-delivery-page .slo7-cta *{transition:none!important}
}


/* =========================================================
   V102 — CLEAN DELIVERY FLOW + SMOOTH ROW HOVER
========================================================= */
.slo-delivery-hero{
  padding-bottom:34px!important;
}

.slo-delivery-rules__list{
  margin-top:0;
}

.slo-delivery-rule__index,
.slo-delivery-rule__title,
.slo-delivery-rule__copy,
.slo-delivery-rule__mark{
  position:relative;
  z-index:1;
}

.slo-delivery-rule__mark{
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}

.slo-delivery-rule:hover .slo-delivery-rule__mark{
  transform:rotate(45deg);
}

.slo-delivery-rule:hover .slo-delivery-rule__title{
  transform:translateX(4px);
}

.slo-delivery-rule__title{
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}

@media(max-width:900px){
  .slo-delivery-rules{
    padding-top:28px!important;
  }
}

@media(max-width:650px){
  .slo-delivery-rules{
    padding-top:22px!important;
    padding-bottom:42px!important;
  }
}




/* =========================================================
   V102 — DELIVERY PAGE ENTRY
========================================================= */
.slo-delivery-page{
  opacity:1;
}

.slo-delivery-crumbs,
.slo-delivery-hero h1{
  will-change:opacity,transform;
}

body.slo-delivery-enter .slo-delivery-crumbs{
  opacity:0;
  transform:translate3d(0,12px,0);
}

body.slo-delivery-enter .slo-delivery-hero h1{
  opacity:0;
  transform:translate3d(0,28px,0);
}

body.slo-delivery-ready .slo-delivery-crumbs{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:
    opacity .55s cubic-bezier(.16,1,.3,1) .05s,
    transform .72s cubic-bezier(.16,1,.3,1) .05s;
}

body.slo-delivery-ready .slo-delivery-hero h1{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:
    opacity .72s cubic-bezier(.16,1,.3,1) .14s,
    transform .9s cubic-bezier(.16,1,.3,1) .14s;
}

/* rows keep their layout fixed, only opacity/Y animates */
.slo-delivery-rule{
  backface-visibility:hidden;
}

@media(max-width:900px){
  .slo-delivery-hero__layout{
    display:block;
  }
}

@media(prefers-reduced-motion:reduce){
  body.slo-delivery-enter .slo-delivery-crumbs,
  body.slo-delivery-enter .slo-delivery-hero h1,
  body.slo-delivery-ready .slo-delivery-crumbs,
  body.slo-delivery-ready .slo-delivery-hero h1{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}


/* =========================================================
   V102 — DELIVERY: REVEAL EVERYTHING ONLY WHEN REACHED
========================================================= */

/* top line of the conditions block draws in on scroll */
.slo-delivery-rules__list{
  position:relative;
  border-top:0!important;
}
.slo-delivery-rules__list::before{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:var(--slo-line);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .72s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.slo-delivery-rules__list.is-visible::before{
  transform:scaleX(1);
}

/* each rule enters only after IntersectionObserver reaches it */
.slo-delivery-rule[data-slo-delivery-reveal]{
  opacity:0;
  transform:translate3d(0,42px,0);
  transition:
    opacity .58s cubic-bezier(.16,1,.3,1),
    transform .82s cubic-bezier(.16,1,.3,1),
    border-color .32s ease;
  will-change:opacity,transform;
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

/* inner parts rise with a subtle cascade */
.slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__index,
.slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__title,
.slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__copy,
.slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__mark{
  opacity:0;
  transform:translate3d(0,18px,0);
}

.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__index,
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__title,
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__copy,
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__mark{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:
    opacity .46s ease,
    transform .68s cubic-bezier(.16,1,.3,1);
}

.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__index{
  transition-delay:.04s;
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__title{
  transition-delay:.09s;
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__copy{
  transition-delay:.14s;
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible .slo-delivery-rule__mark{
  transition-delay:.19s;
}

/* restore hover title movement after the entrance */
.slo-delivery-rule[data-slo-delivery-reveal].is-visible:hover .slo-delivery-rule__title{
  transform:translateX(4px);
}
.slo-delivery-rule[data-slo-delivery-reveal].is-visible:hover .slo-delivery-rule__mark{
  transform:rotate(45deg);
}

@media(prefers-reduced-motion:reduce){
  .slo-delivery-rules__list::before{
    transform:none!important;
    transition:none!important;
  }
  .slo-delivery-rule[data-slo-delivery-reveal],
  .slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__index,
  .slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__title,
  .slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__copy,
  .slo-delivery-rule[data-slo-delivery-reveal] .slo-delivery-rule__mark{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}