/* Шапка и переходы между страницами (№1367, правки Антона 01.11).
   Шапка закреплена сверху: корзина, звонок и разделы всегда под рукой. Подложка полупрозрачная
   с размытием; на главной, пока не листали, шапка прозрачная поверх фото. Отдельной чёрной
   строки сверху больше нет - телефон и «Доставка по всей России» стоят в самом меню. */
.rv .rv-head,.rv-home .rv-head{position:fixed;top:0;left:0;right:0;z-index:45;color:#fff;
  background:rgba(var(--nrgb),.72);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);
  border-bottom:1px solid rgba(255,255,255,.08);transition:background-color .35s ease,border-color .35s ease,box-shadow .35s ease}
.rv-home .rv-head{background:rgba(var(--nrgb),0);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent}
.rv-home.rv-scrolled .rv-head{background:rgba(var(--nrgb),.72);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);border-bottom-color:rgba(255,255,255,.08)}
.rv-scrolled .rv-head{box-shadow:0 10px 30px -12px rgba(0,0,0,.45)}
.rv-hdr .rv-wrap{transition:height .3s ease}
.rv-scrolled .rv-hdr .rv-wrap{height:68px}
.rv-logo img{transition:width .3s ease,height .3s ease}
.rv-scrolled .rv-hdr .rv-logo img{width:40px;height:40px}
.rv-nav__drop ul{background:rgba(var(--nrgb),.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
/* место под шапку: на главной её нет - шапка лежит на фото первого экрана */
body.rv:not(.rv-home){padding-top:84px}
html{scroll-padding-top:96px}

/* телефон и доставка - в меню, справа перед кнопками */
.rv-hdr-tel{display:flex;flex-direction:column;align-items:flex-end;gap:3px;margin-right:6px;color:#fff;text-decoration:none;white-space:nowrap}
.rv-hdr-tel b{font:600 16px/1 var(--f-text);letter-spacing:.01em}
.rv-hdr-tel span{font-size:12px;line-height:1;color:var(--leafl)}
.rv-hdr-tel:hover b{color:var(--leafl)}
.rv-hdr-tel+.rv-ph{display:none}

/* закреплённые колонки корзины и заказа - ниже шапки */
.rv .rp-cart__side,.rv .rp-checkout__side,.rv .slp-cart__side,.rv .slp-co__side{top:100px}

@media (max-width:1240px){
  .rv-hdr-tel{display:none}
  .rv-hdr-tel+.rv-ph{display:grid}
}
@media (max-width:960px){
  .rv .rv-hdr-tel+.rv-ph{display:grid}  /* на телефоне звонок - кнопкой рядом с корзиной */
}
@media (max-width:420px){
  .rv-hdr .rv-wrap{gap:8px}
  .rv-hdr-r{gap:8px}
  .rv-logo{gap:8px}
  .rv-logo b{font-size:14px}
  .rv-ic{width:40px;height:40px}
}
@media (max-width:760px){
  body.rv:not(.rv-home){padding-top:68px}
  html{scroll-padding-top:80px}
  .rv-scrolled .rv-hdr .rv-wrap{height:60px}
  .rv-scrolled .rv-hdr .rv-logo img{width:34px;height:34px}
  .rv .slp-cohead{top:60px}
}

/* ---------- переход между страницами (№1368, как на сайте Никиты, №656 «Заметнее») ----------
   Правило @view-transition стоит ещё и строкой <style> в base.html: без неё Chrome отменяет
   переход через раз (грабли №656). Шапка стоит на месте. Старая страница уходит вверх и гаснет,
   новая только проявляется, когда старой уже почти нет: два заголовка друг на друге не стоят
   (в №1367 новая проступала поверх неподвижной старой - выходила каша, №1368). Поднимать новую
   страницу целиком нельзя: её первый экран поднимается сам, вышло бы два появления подряд.
   Подложка под ними - цвета новой страницы (скрипт в base.html), иначе в паузе мигал светлый фон.
   Перелёт заголовка, как у Никиты, не берём: на переходе по меню он и даёт два заголовка разом.
   №1395 (Антон: «переход с задержкой»): было 0,2 с ухода + 0,17 с паузы + 0,3 с проявления,
   до спокойной страницы ~1,8 с после клика; стало 0,14 + 0,08 + 0,2 с - рисунок тот же, быстрее. */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  .rv-head{view-transition-name:rv-head}
  ::view-transition-group(rv-head){animation-duration:.2s}
  ::view-transition{background:linear-gradient(var(--rv-vt-top,transparent) var(--rv-vt-cut,0px),var(--rv-vt-bot,transparent) 0)}
  ::view-transition-old(root){animation:rv-page-out .14s cubic-bezier(.2,0,.4,1) both;mix-blend-mode:normal}
  ::view-transition-new(root){animation:rv-fade .2s ease .08s both;mix-blend-mode:normal}
  @keyframes rv-page-out{to{opacity:0;transform:translateY(-10px)}}
  @keyframes rv-fade{from{opacity:0}}

  /* Первый экран новой страницы: метка, заголовок, подзаголовок, текст и кнопки встают по очереди
     (набор «Заметнее» Никиты, ускорен в №1395: 18 px, 0,45 с, шаг 50 мс). Блоки ниже экрана поднимает rv.js
     (data-rv), их здесь нет: один блок - одна анимация. */
  :is(.rv-phead>.rv-wrap,.rv-hero-in,.rp-cover__in,main>.rp-sec:first-child>.rp-wrap)>:is(nav,span,h1,p,div):not([data-rv]):nth-child(-n+6){
    animation:rv-rise .45s cubic-bezier(.22,.61,.36,1) calc(var(--rv-n,0)*50ms) backwards}
  :is(.rv-phead>.rv-wrap,.rv-hero-in,.rp-cover__in,main>.rp-sec:first-child>.rp-wrap)>:nth-child(2){--rv-n:1}
  :is(.rv-phead>.rv-wrap,.rv-hero-in,.rp-cover__in,main>.rp-sec:first-child>.rp-wrap)>:nth-child(3){--rv-n:2}
  :is(.rv-phead>.rv-wrap,.rv-hero-in,.rp-cover__in,main>.rp-sec:first-child>.rp-wrap)>:nth-child(4){--rv-n:3}
  :is(.rv-phead>.rv-wrap,.rv-hero-in,.rp-cover__in,main>.rp-sec:first-child>.rp-wrap)>:nth-child(n+5){--rv-n:4}
  @keyframes rv-rise{from{opacity:0;transform:translateY(18px)}}
}

/* №1395: на телефонах и планшетах без размытия под шапкой и меню - на слабой видеокарте размытие
   пересчитывается в каждом кадре прокрутки и даёт рывки. Подложка плотнее, на глаз почти то же. */
@media (hover:none),(max-width:1024px){
  .rv .rv-head,.rv-home.rv-scrolled .rv-head{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(var(--nrgb),.95)}
  .rv-home .rv-head{background:rgba(var(--nrgb),0)}
  .rv-home.rv-scrolled .rv-head{background:rgba(var(--nrgb),.95)}
  .rv-nav__drop ul{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(var(--nrgb),.98)}
}