/* ОБЪЕКТ — страница «Видео» (objvp-*): шапка страницы и вкладки-якоря. Сами секции — блоки objv / objsh / objd
   со своими стилями; здесь только их отступы на этой странице. Ширина контента — как у всех блоков сайта.
   main.css гасит рамку фокуса у всего — поэтому у :focus-visible здесь !important. */

/* main.css на телефоне ставит body{overflow-x:hidden} — тогда «прилипание» вкладок не работает; clip режет так же,
   но контейнером прокрутки body не делает (горизонтальную прокрутку по-прежнему гасит html{overflow-x:hidden}) */
body.objvp-page{overflow-x:visible;overflow-x:clip;}

.objvp{
  --objvp-w:calc(100% - 32px);
  --objvp-tabs-h:52px;
  display:block;background:var(--objekt-color-bg);color:var(--objekt-color-cream);font-family:var(--objekt-font-body);
}
.objvp,
.objvp *{box-sizing:border-box;}
.objvp .objvp-wrap{width:var(--objvp-w);margin:0 auto;}
@media (min-width:390px){ .objvp{--objvp-w:calc(100% - 40px);} }
@media (min-width:600px){ .objvp{--objvp-w:calc(100% - 64px);--objvp-tabs-h:58px;} }
@media (min-width:1200px){ .objvp{--objvp-w:min(81.77083vw, 1600px);} }

/* ---------- шапка страницы: фото на всю ширину (сюжет справа), слева тёмный градиент под текстом ---------- */
.objvp .objvp-head{position:relative;padding:clamp(40px, 6vw, 112px) 0 clamp(8px, 1vw, 16px);}
.objvp .objvp-head > .objvp-wrap{position:relative;z-index:1;}
.objvp .objvp-media{position:relative;height:clamp(200px, 56vw, 320px);margin:calc(-1 * clamp(40px, 6vw, 112px)) 0 20px;overflow:hidden;}
.objvp .objvp-media picture{display:block;width:100%;height:100%;}
.objvp .objvp-media__img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:78% 50%;}
/* телефон: фото сверху, книзу растворяется в фоне страницы */
.objvp .objvp-media__shade{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(28,26,26,0.15) 0%, rgba(28,26,26,0) 45%, var(--objekt-color-bg) 100%);}
@media (min-width:768px){
  .objvp .objvp-head--media{display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(480px, 64svh, 760px);}
  .objvp .objvp-media{position:absolute;inset:0;height:auto;margin:0;}
  .objvp .objvp-media__img{object-position:70% 50%;}
  .objvp .objvp-media__shade{background:
    linear-gradient(90deg, var(--objekt-color-bg) 0%, rgba(28,26,26,0.92) 30%, rgba(28,26,26,0.55) 52%, rgba(28,26,26,0.1) 75%, rgba(28,26,26,0.15) 100%),
    linear-gradient(to bottom, rgba(28,26,26,0.35) 0%, rgba(28,26,26,0) 30%, rgba(28,26,26,0) 60%, var(--objekt-color-bg) 100%);}
  .objvp .objvp-head--media .objvp-title,
  .objvp .objvp-head--media .objvp-sub{max-width:min(46em, 58%);text-shadow:0 1px 24px rgba(0,0,0,0.35);}
}
.objvp .objvp-eyebrow{display:flex;align-items:center;gap:16px;margin:0 0 clamp(14px, 1.4vw, 22px);font-size:var(--objekt-fs-caption);letter-spacing:.24em;text-transform:uppercase;color:var(--objekt-color-accent);}
.objvp .objvp-eyebrow span{flex-shrink:0;}
.objvp .objvp-eyebrow i{display:block;flex:1 1 auto;max-width:560px;height:1px;background:var(--objekt-color-line-strong);}
.objvp .objvp-title{margin:0;font-family:var(--objekt-font-heading);font-weight:500;font-size:clamp(36px, 3.4vw, 64px);line-height:1.06;letter-spacing:var(--objekt-tracking-heading);color:var(--objekt-color-cream);}
.objvp .objvp-sub{margin:clamp(10px, 1vw, 16px) 0 0;max-width:40em;font-size:clamp(17px, 1.2vw, 21px);line-height:1.45;color:rgba(245,242,237,0.85);}
.objvp .objvp-channel{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:clamp(18px, 1.6vw, 26px);font-size:15px;line-height:1.4;}
.objvp .objvp-channel__icon{display:flex;width:32px;height:22px;color:var(--objekt-color-accent);}
.objvp .objvp-channel__icon svg{width:100%;height:100%;}
.objvp .objvp-channel__subs{color:var(--objekt-color-cream);}
.objvp .objvp-channel__link{display:inline-flex;align-items:center;gap:6px;margin-left:clamp(0px, 1.4vw, 18px);padding-bottom:2px;border-bottom:1px solid rgba(169,150,125,0.5);color:var(--objekt-color-accent);text-decoration:none;transition:color .2s ease, border-color .2s ease;}
.objvp .objvp-channel__link svg{width:14px;height:14px;transition:transform .2s ease;}
.objvp .objvp-channel__link:hover{color:var(--objekt-color-accent-hover);border-color:var(--objekt-color-accent-hover);}
.objvp .objvp-channel__link:hover svg{transform:translate(2px, -2px);}
.objvp .objvp-channel__link:focus-visible{outline:2px solid var(--objekt-color-accent) !important;outline-offset:3px;}
.objvp .objvp-source{margin-top:clamp(28px, 3vw, 48px);padding:0 0 clamp(20px, 2vw, 32px);}

/* ---------- вкладки-якоря: прилипают под шапкой сайта (top ставит скрипт), активная подчёркнута taupe ---------- */
.objvp .objvp-tabs{
  position:sticky;top:calc(var(--objn-top, 0px) + var(--objn-hs, 68px));z-index:900;
  background:var(--objekt-color-bg);border-bottom:1px solid var(--objekt-color-line);
  transition:box-shadow .2s ease;
}
.objvp .objvp-tabs.is-stuck{box-shadow:0 6px 24px rgba(0,0,0,0.25);}
html.objvp-stuck .objn .objn-bar{box-shadow:none !important;}
.objvp .objvp-tabs .objvp-wrap{position:relative;}
/* две вкладки делят ширину пополам, подписи по центру — видно, что это два равных раздела */
.objvp .objvp-tabs__list{display:flex;margin:0;padding:0;list-style:none;}
.objvp .objvp-tabs__list li{flex:1 1 0;min-width:0;margin:0;padding:0;list-style:none;}
.objvp .objvp-tabs__list li::before{content:none;}
.objvp .objvp-tab{display:flex;align-items:center;justify-content:center;width:100%;height:var(--objvp-tabs-h);white-space:nowrap;font-size:clamp(15px, 1.05vw, 19px);color:rgba(245,242,237,0.65);text-decoration:none;transition:color .2s ease;}
.objvp .objvp-tab:hover,
.objvp .objvp-tab.is-active{color:var(--objekt-color-cream);}
.objvp .objvp-tab:focus-visible{outline:2px solid var(--objekt-color-accent) !important;outline-offset:-4px;}
.objvp .objvp-tab__full{display:none;}
.objvp .objvp-tabs__bar{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--objekt-color-accent);transform:translateX(var(--x, 0px));transition:transform .25s cubic-bezier(.2,.7,.2,1), width .25s cubic-bezier(.2,.7,.2,1);pointer-events:none;}
@media (min-width:600px){
  .objvp .objvp-tab__full{display:inline;}
  .objvp .objvp-tab__short{display:none;}
}

/* ---------- секции: меньше воздуха сверху, чем у блоков на главной ---------- */
.objvp .objvp-sec{scroll-margin-top:calc(var(--objn-top, 0px) + var(--objn-hs, 72px) + var(--objvp-tabs-h) + 8px);}
.objvp .objvp-sec--videos > .objv{padding-top:clamp(24px, 2.6vw, 44px);}
.objvp .objvp-sec--shorts > .objsh{padding-top:clamp(40px, 4vw, 72px);}

@media (prefers-reduced-motion: reduce){
  .objvp .objvp-tabs,
  .objvp .objvp-tabs__bar,
  .objvp .objvp-channel__link svg{transition:none;}
}