/* «Так ми це робимо» */
.ec-vid { padding: 8px 0 8px; }
.ec-vid__sub { margin: -4px 0 14px; font-size: 15px; line-height: 1.45; color: #4A5642; max-width: 640px; }
.ec-vid__row { display: flex; gap: 12px; overflow-x: auto; padding: 4px 2px 12px; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ec-vid__row::-webkit-scrollbar { display: none; }
.ec-vid__c { position: relative; flex: 0 0 150px; aspect-ratio: 9 / 16; padding: 0; border: 0; border-radius: 18px !important; overflow: hidden; background: #E8EDE0; cursor: pointer; scroll-snap-align: start; -webkit-tap-highlight-color: transparent; box-shadow: 0 10px 24px -14px rgba(31,42,26,.5); }
.ec-vid__c img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.ec-vid__c:hover img { transform: scale(1.04); }
.ec-vid__c::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55%; background: linear-gradient(transparent, rgba(0,0,0,.72)); }
.ec-vid__play { position: absolute; left: 50%; top: 42%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; background: rgba(255,255,255,.92); color: #2F6B1C; display: flex; align-items: center; justify-content: center; z-index: 2; box-shadow: 0 6px 16px rgba(0,0,0,.25); }
.ec-vid__play svg { width: 22px; height: 22px; margin-left: 2px; }
.ec-vid__cap { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 2; color: #fff; font: 700 13px/1.25 Manrope, system-ui, sans-serif; text-align: left; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
@media (min-width: 960px) { .ec-vid__c { flex-basis: 190px; } .ec-vid__cap { font-size: 14px; } }

/* превʼю-кліп у картці */
.ec-vid__pv { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity .3s; }
.ec-vid__c.is-live .ec-vid__pv { opacity: 1; }
.ec-vid__c.is-live .ec-vid__play { opacity: 0; transform: scale(.7); }
.ec-vid__play { transition: opacity .25s, transform .25s; }

/* повноекранні «сторіс» */
html.ecv-lock { overflow: hidden; }
.ecv { position: fixed; inset: 0; z-index: 2147483000; background: #0b0d09; display: flex; align-items: center; justify-content: center; gap: 18px; }
.ecv[hidden] { display: none; }
.ecv__frame { position: relative; height: min(94vh, 920px); aspect-ratio: 9 / 16; max-width: 100vw; background: #000; border-radius: 16px; overflow: hidden; }
.ecv video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; }
.ecv__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(0,0,0,.5), transparent 18%, transparent 70%, rgba(0,0,0,.62)); }
.ecv__bars { position: absolute; left: 10px; right: 10px; top: 10px; display: flex; gap: 4px; z-index: 3; }
.ecv__bars i { flex: 1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.35); overflow: hidden; }
.ecv__bars u { display: block; height: 100%; background: #fff; }
.ecv__head { position: absolute; left: 12px; right: 8px; top: 22px; z-index: 3; display: flex; align-items: center; gap: 10px; }
.ecv__av { width: 36px; height: 36px; border-radius: 50%; background: #2F6B1C; color: #fff; display: flex; align-items: center; justify-content: center; font: 800 16px Manrope, sans-serif; border: 2px solid #fff; flex: none; }
.ecv__who { display: flex; flex-direction: column; min-width: 0; margin-right: auto; color: #fff; font-family: Manrope, system-ui, sans-serif; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.ecv__who b { font-size: 14px; line-height: 1.2; } .ecv__who i { font-style: normal; font-size: 12px; opacity: .85; }
.ecv__head button { width: 40px; height: 40px; padding: 0; border: 0; background: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%; }
.ecv__cap { position: absolute; left: 16px; right: 16px; bottom: 22px; z-index: 3; color: #fff; font: 700 16px/1.3 Manrope, system-ui, sans-serif; text-shadow: 0 1px 4px rgba(0,0,0,.6); pointer-events: none; }
.ecv__tap { position: absolute; top: 74px; bottom: 70px; z-index: 2; }
.ecv__tap--p { left: 0; width: 35%; } .ecv__tap--n { right: 0; width: 65%; }
.ecv.is-hold .ecv__shade, .ecv.is-hold .ecv__cap, .ecv.is-hold .ecv__head, .ecv.is-hold .ecv__bars { opacity: .0; transition: opacity .15s; }
.ecv__side { display: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.16); cursor: pointer; align-items: center; justify-content: center; flex: none; }
.ecv__side:hover { background: rgba(255,255,255,.28); }
.ecv.is-single .ecv__side { visibility: hidden; }
@media (min-width: 701px) { .ecv__side { display: flex; } }
@media (max-width: 700px) { .ecv { gap: 0; } .ecv__frame { height: 100svh; width: 100vw; aspect-ratio: auto; border-radius: 0; } }
/* перебиваємо тему на кнопках */
body .ecv .ecv__side, body .ecv .ecv__head button { border-radius: 50% !important; }

.ehm-vid { padding-top: 36px; padding-bottom: 20px; }
.ehm-vid .ec-section__head { margin-bottom: 8px; }
.ehm-vid h2 { margin: 0 0 6px; font-size: clamp(22px, 2.4vw, 28px) !important; font-weight: 800; color: #1F2A1A; }
.ehm-vid h2::before { content: ""; display: block; width: 36px; height: 4px; border-radius: 4px; background: #3F7A22; margin-bottom: 10px; }
/* перебиваємо тему: кнопки не круглі/квадратні, а як задумано */
body .ec-vid .ec-vid__c, #ec-card .ec-vid .ec-vid__c { border-radius: 18px !important; }
body .ec-vid__play { border-radius: 50% !important; }
#ec-card#ec-card .ec-vid .ec-vid__c { border-radius: 18px !important; }
@media (max-width: 700px) { .ecv video { object-fit: contain; } }
