/* Дополнения: сетка видео, туристические эффекты, редактор баннера, заявки. Чтобы отключить - уберите <link> на этот файл. */

/* ===== Видео / карты: 1-3 в ряд ===== */
.vgrid{display:grid;gap:20px;grid-template-columns:repeat(var(--n,1),minmax(0,1fr))}
.vgrid.c2{--n:2}.vgrid.c3{--n:3}
.vcell{display:grid;gap:8px;align-content:start;min-width:0}
.vcap{font-size:14px;color:var(--mut)}
@media(max-width:980px){.vgrid.c3{--n:2}}
@media(max-width:620px){.vgrid.c2,.vgrid.c3{--n:1}}

/* ===== Эффекты прокрутки ===== */
#fxRoute{position:absolute;left:0;top:0;pointer-events:none;z-index:1;overflow:hidden}
#fxRoute svg{display:block}
#fxRoute .dots{stroke:var(--c1);opacity:.7}
#fxRoute .mk{fill:var(--c2);stroke:rgba(var(--bkr),.9);stroke-width:1.5}
body.fx-on main .wrap,body.fx-on .foot .wrap{position:relative;z-index:2}   /* маршрут идёт под карточками и текстом */
@media(max-width:700px){#fxRoute .dots{opacity:.45}}

.fx-pin{display:inline-block;width:.72em;height:.72em;margin-right:.35em;color:var(--c2);opacity:0}
.fx-pin svg{display:block;width:100%;height:100%;fill:currentColor}
.reveal.in .fx-pin,h2.in .fx-pin{animation:fxdrop .9s var(--e) both .2s}
@keyframes fxdrop{0%{opacity:0;transform:translateY(-1.1em) scale(.6)}60%{opacity:1;transform:translateY(.12em)}100%{opacity:1;transform:none}}

#fxCompass{position:fixed;left:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:12;display:flex;align-items:center;gap:8px;pointer-events:none}
#fxCompass svg{background:rgba(var(--bkr),.55);backdrop-filter:blur(6px);border-radius:50%;border:1px solid rgba(var(--c1r),.35)}
#fxCompass .ring{fill:none;stroke:rgba(var(--c1r),.5);stroke-width:1.2}
#fxCompass .n{fill:var(--c1);font:700 6px sans-serif;text-anchor:middle}
#fxCompass .nd{fill:var(--c2)}#fxCompass .sd{fill:var(--tx);opacity:.8}#fxCompass .hub{fill:var(--bk)}
#fxCompass span{font-size:12px;color:var(--mut);letter-spacing:.06em}
@media(max-width:700px){#fxCompass span{display:none}#fxCompass svg{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.fx-pin{opacity:1;animation:none!important}}

/* ===== Редактор баннера ===== */
.bn-modal{position:fixed;inset:0;z-index:60;display:none;place-items:center;background:rgba(0,0,0,.62);font:15px "PT Sans",Arial,sans-serif;color:#111}
.bn-modal.open{display:grid}
.bn-modal *{box-sizing:border-box;margin:0}
.bn-card{background:#fff;width:min(1080px,calc(100% - 20px));max-height:calc(100% - 20px);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.bn-head{display:flex;align-items:center;padding:8px 14px;border-bottom:1px solid #e3e8e8}
.bn-head h3{flex:1;font:700 19px "PT Serif",Georgia,serif}
.bn-modal .ib{flex:none;width:34px;height:36px;border:0;background:none;color:#222;cursor:pointer;font-size:20px}
.bn-modal .ib:hover{background:#27F5D6}
.bn-main{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;padding:14px;overflow:auto}
@media(max-width:820px){.bn-main{grid-template-columns:minmax(0,1fr)}}
.bn-left,.bn-right{display:grid;gap:10px;align-content:start;min-width:0}
.bn-right h4{font:700 14px "PT Sans";color:#777}
.bn-stage{min-height:260px;display:grid;place-items:center;background:#1c1f1f;border:2px dashed #7a8686;padding:10px;overflow:hidden;transition:.2s}
.bn-stage.has{border-style:solid;border-color:#3a4242}
.bn-stage.over{border-color:#27F5D6;background:#0f2a27}
.bn-empty{display:grid;gap:10px;justify-items:center;color:#cfd8d8;text-align:center}
.bn-empty small{color:#8fa0a0}
.bn-wrap{position:relative;line-height:0;touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair}
.bn-img{display:block;-webkit-user-drag:none}
.bn-box{position:absolute;border:2px solid #27F5D6;box-shadow:0 0 0 9999px rgba(0,0,0,.58);cursor:move;touch-action:none;
  background:linear-gradient(rgba(255,255,255,.35),rgba(255,255,255,.35)) 33.3% 0/1px 100% no-repeat,linear-gradient(rgba(255,255,255,.35),rgba(255,255,255,.35)) 66.6% 0/1px 100% no-repeat,
  linear-gradient(rgba(255,255,255,.35),rgba(255,255,255,.35)) 0 33.3%/100% 1px no-repeat,linear-gradient(rgba(255,255,255,.35),rgba(255,255,255,.35)) 0 66.6%/100% 1px no-repeat}
.bn-box i{position:absolute;width:16px;height:16px;background:#27F5D6;border:2px solid #000}
.bn-box i[data-h=nw]{left:-9px;top:-9px;cursor:nwse-resize}.bn-box i[data-h=se]{right:-9px;bottom:-9px;cursor:nwse-resize}
.bn-box i[data-h=ne]{right:-9px;top:-9px;cursor:nesw-resize}.bn-box i[data-h=sw]{left:-9px;bottom:-9px;cursor:nesw-resize}
@media(pointer:coarse){.bn-box i{width:26px;height:26px}.bn-box i[data-h=nw]{left:-14px;top:-14px}.bn-box i[data-h=se]{right:-14px;bottom:-14px}.bn-box i[data-h=ne]{right:-14px;top:-14px}.bn-box i[data-h=sw]{left:-14px;bottom:-14px}}
.bn-tools{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:end}
@media(max-width:560px){.bn-tools{grid-template-columns:1fr}}
.bn-modal .fl{display:grid;gap:4px}.bn-modal .fl span{font-size:13px;color:#666}
.bn-modal .fl2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bn-modal select{width:100%;font:inherit;font-size:16px;color:#111;background:#fff;border:1px solid #b9c2c2;padding:9px 10px}
.bn-modal .cms-btn{border:0;padding:10px 14px;min-height:44px;font:700 15px "PT Sans",Arial,sans-serif;background:#27F5D6;color:#000;cursor:pointer}
.bn-modal .cms-btn:hover{background:#E89900}.bn-modal .cms-btn.alt{background:#eceff0}.bn-modal .cms-btn.alt:hover{background:#dfe3e3}
.bn-modal .cms-btn:disabled{opacity:.45;cursor:default}
.bn-modal .filebtn{display:grid;place-items:center;cursor:pointer}
.bn-modal .hint{font-size:12px;color:#888}
.bn-foot{display:flex;gap:8px;align-items:center;padding:10px 14px;border-top:1px solid #e3e8e8}
.bn-foot .hint{flex:1;color:#b3261e}

.bn-prev{--sh:.55;position:relative;container-type:inline-size;aspect-ratio:var(--ar,16/9);background:#0a0a0a;overflow:hidden;border:1px solid #c9d0d0}
.bn-prev.s1{--sh:.35}.bn-prev.s3{--sh:.75}
.bn-prev canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bn-prev.p-top canvas{object-position:center top}.bn-prev.p-bot canvas{object-position:center bottom}
.bn-prev::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--bkr),calc(var(--sh) * .75)) 0,rgba(var(--bkr),var(--sh)) 65%,rgba(var(--bkr),.9) 100%)}
.bn-txt{position:absolute;z-index:1;left:6%;right:6%;top:50%;transform:translateY(-50%);color:var(--tx);line-height:1.2}
.bn-txt .e{color:var(--c2);letter-spacing:.3em;text-transform:uppercase;font-size:2cqw;margin-bottom:2cqw}
.bn-txt h1{font-size:8cqw;line-height:1.05;margin:0 0 3cqw;font-weight:800}.bn-txt h1 span{color:var(--c1)}
.bn-txt .l{font-size:1.8cqw;color:var(--tx2);max-width:60%;margin-bottom:3cqw}
.bn-txt .b{display:inline-block;font-size:2cqw;font-weight:700;padding:1.2cqw 3cqw;background:var(--c1);color:var(--on1)}

body.bn-drag #hero{outline:3px dashed var(--c1);outline-offset:-10px}

/* ===== Заявки в редакторе ===== */
.cms .leads{display:grid;gap:6px}
.cms .lead{border:1px solid #dfe3e3;background:#fafbfb;padding:6px 10px 8px;display:grid;gap:2px;font-size:14px}
.cms .lead-top{display:flex;align-items:center;margin-right:-6px}
.cms .lead-top b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cms .lead a{color:#0a58ca;text-decoration:underline;word-break:break-all}
.cms .lead small{color:#888}
.cms .bn-open{margin-top:2px}

/* >> video-fix */
.vgrid .embed{width:100%}
.vcell .embed.empty.bad{padding:16px;text-align:center;border-style:dashed;color:var(--mut);font-size:14px}
.vcell .embed.empty.bad small{display:block;margin-top:8px;font-size:12px;line-height:1.45}
/* << video-fix */