/* Головна: фото-карусель справа замість повноекранного фону */
html:not(#_):not(#__):not(#___) #hero-section{background:#0d120f !important}
html:not(#_):not(#__):not(#___) #heroCarousel{position:absolute !important;right:48px;top:50%;transform:translateY(-50%);width:min(56vw,1120px);height:min(66%,640px);overflow:hidden;z-index:2;background:#111}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-slide{position:absolute;inset:0;opacity:0;transition:opacity .7s ease;pointer-events:none}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-slide.on{opacity:1;pointer-events:auto}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-slide img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-day,html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important}
html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-day{background-image:url('images/hero_day.jpg') !important}
html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night{background-image:url('images/hero_night.jpg') !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:40px;height:40px;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:18px;cursor:pointer;opacity:0;transition:opacity .2s,background .2s}
html:not(#_):not(#__):not(#___) #heroCarousel:hover .hc-nav{opacity:1}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:hover{background:rgba(0,0,0,.75)}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-prev{left:0}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-next{right:0}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots{position:absolute;left:16px;bottom:14px;z-index:5;display:flex;gap:8px}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots button{width:22px;height:2px;border:0;padding:0;background:rgba(255,255,255,.4);cursor:pointer}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots button.on{background:#fff}
@media (max-width:1023px){
  html:not(#_):not(#__):not(#___) #hero-section{height:auto !important;min-height:0 !important;flex-direction:column !important;padding:32px 0 !important}
  html:not(#_):not(#__):not(#___) #heroCarousel{position:relative !important;right:auto;top:auto;transform:none;width:calc(100% - 32px);height:56vw;order:2;margin-top:24px}
  html:not(#_):not(#__):not(#___) #hero-section .hero-container{order:1}
}
@media (max-width:1023px){
  html:not(#_):not(#__):not(#___) #hero-section .hero-container{padding:8px 0 0 !important}
  html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{padding-left:16px !important;padding-right:16px !important}
}
html:not(#_):not(#__):not(#___) #hero-section{--hero-fg:#111;background:#fff !important}
html.dark:not(#_):not(#__):not(#___) #hero-section,html.theme-dark:not(#_):not(#__):not(#___) #hero-section,html.dark-theme:not(#_):not(#__):not(#___) #hero-section,html[data-theme="dark"]:not(#_):not(#__):not(#___) #hero-section{--hero-fg:#fff;background:#000 !important}
html:not(#_):not(#__):not(#___) #hero-section h1,html:not(#_):not(#__):not(#___) #hero-section h1 *,html:not(#_):not(#__):not(#___) #hero-section .hero-subtitle,html:not(#_):not(#__):not(#___) #hero-section .hero-subtitle *{color:var(--hero-fg) !important;text-shadow:none !important;filter:none !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn{background:transparent !important;color:var(--hero-fg) !important;border:1px solid var(--hero-fg) !important;box-shadow:none !important;backdrop-filter:none !important;border-radius:0 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn *{color:inherit !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover{background:var(--hero-fg) !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover,html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover *{color:#fff !important}
html.dark:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover,html.dark:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover *,html.theme-dark:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover,html.theme-dark:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover *,html[data-theme="dark"]:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover,html[data-theme="dark"]:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover *{color:#000 !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"]{border-radius:0 !important;box-shadow:none !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"],html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"] *{color:#fff !important}
html:not(#_):not(#__):not(#___) #heroCarousel{border-radius:14px !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots{left:50% !important;transform:translateX(-50%)}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots{bottom:30px !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-dots button{box-shadow:0 0 4px rgba(0,0,0,.45)}
@media (min-width:1024px){
  html:not(#_):not(#__):not(#___) #heroCarousel{transform:translateY(calc(-50% - 9vh)) !important}
  html:not(#_):not(#__):not(#___) #hero-section .hero-container{position:relative !important;top:-9vh}
}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav{opacity:1 !important;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.85) !important;color:#111 !important;font-size:18px;line-height:44px;padding:0;box-shadow:0 2px 8px rgba(0,0,0,.25)}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:hover{background:#fff !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-prev{left:14px !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-next{right:14px !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav{background:transparent !important;box-shadow:none !important;border-radius:0 !important;width:56px;height:80px;padding:0;color:#fff !important;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 1px 4px rgba(0,0,0,.6));cursor:pointer;pointer-events:auto}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:hover{background:transparent !important;opacity:.8 !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-prev{left:4px !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-next{right:4px !important}
html:not(#_):not(#__):not(#___) #heroCarousel{z-index:20 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-container{pointer-events:none}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{pointer-events:auto}
/* Макет як на референсі: текст і кнопки по центру, нижче широке фото */
html:not(#_):not(#__):not(#___) #hero-section{flex-direction:column !important;align-items:center !important;height:auto !important;min-height:0 !important;padding:56px 0 64px !important;gap:0}
html:not(#_):not(#__):not(#___) #hero-section .hero-container{order:1;width:100% !important;top:0 !important;position:relative !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-container>.grid{display:block !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{max-width:860px !important;margin:0 auto !important;padding-left:16px !important;padding-right:16px !important;text-align:center !important}
html:not(#_):not(#__):not(#___) #hero-section h1{text-align:center !important;font-size:clamp(2.4rem,6vw,5rem) !important}
html:not(#_):not(#___) #hero-section .hero-subtitle{margin-left:auto !important;margin-right:auto !important;text-align:center !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content .flex{justify-content:center !important}
html:not(#_):not(#__):not(#___) #heroCarousel{position:relative !important;right:auto !important;top:auto !important;transform:none !important;order:2;width:min(88vw,1320px) !important;height:clamp(300px,40vw,560px) !important;margin:40px auto 0 !important}
@media (max-width:1023px){html:not(#_):not(#__):not(#___) #heroCarousel{width:calc(100% - 32px) !important;height:60vw !important;margin-top:28px !important}}
/* Повноекранне фото при вході: від верхньої смужки з відступом, текст по центру поверх фото */
html:not(#_):not(#__):not(#___) #hero-section{height:calc(100vh - 132px) !important;height:calc(100svh - 132px) !important;min-height:520px !important;padding:20px 0 0 !important;justify-content:center !important;background:#fff !important}
html.dark:not(#_):not(#__):not(#___) #hero-section,html.theme-dark:not(#_):not(#__):not(#___) #hero-section,html.dark-theme:not(#_):not(#__):not(#___) #hero-section,html[data-theme="dark"]:not(#_):not(#__):not(#___) #hero-section{background:#000 !important}
html:not(#_):not(#__):not(#___) #hero-section{--hero-fg:#fff}
html:not(#_):not(#__):not(#___) #heroCarousel{position:absolute !important;left:0 !important;right:0 !important;top:20px !important;bottom:0 !important;width:auto !important;height:auto !important;margin:0 !important;border-radius:0 !important;transform:none !important;z-index:2 !important}
html:not(#_):not(#__):not(#___) #heroCarousel::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.42);pointer-events:none;z-index:3}
html:not(#_):not(#__):not(#___) #hero-section .hero-container{position:relative !important;z-index:25 !important;order:0}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"]{background:#fff !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"],html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"] *{color:#111 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover,html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover *{color:#111 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover{background:#fff !important}
@media (max-width:1023px){
  html:not(#_):not(#__):not(#___) #hero-section{height:calc(100svh - 132px) !important;padding:20px 0 0 !important;flex-direction:column !important}
  html:not(#_):not(#__):not(#___) #heroCarousel{width:auto !important;height:auto !important;margin:0 !important}
}
/* Хіро: акценти, кнопки */
html:not(#_):not(#__):not(#___) #hero-section .hero-eyebrow{font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;color:rgba(255,255,255,.85);margin-bottom:22px}
html:not(#_):not(#__):not(#___) #hero-section h1{font-size:clamp(2.6rem,6.6vw,5.6rem) !important;line-height:1.08 !important;letter-spacing:-.025em !important;text-shadow:0 2px 24px rgba(0,0,0,.35) !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content .flex{gap:14px !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"]{background:#1D5D3B !important;border:1px solid #1D5D3B !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"]:hover{background:#237248 !important}
html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"],html:not(#_):not(#__):not(#___) #hero-section a[href="#catalog"] *{color:#fff !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn{background:#fff !important;border:1px solid #fff !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn,html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn *{color:#111 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn:hover{background:#f0f0f0 !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content a{padding:18px 36px !important;font-size:17px !important;font-weight:500 !important}
html:not(#_):not(#__):not(#___) #hero-section h1{font-size:clamp(3rem,8.4vw,8rem) !important;line-height:1 !important;letter-spacing:-.035em !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{max-width:1400px !important}
@media (max-width:640px){html:not(#_):not(#__):not(#___) #hero-section h1{font-size:clamp(2.4rem,12vw,3.6rem) !important}}
/* Заголовок ~75% ширини екрана; кнопка магазину суцільно біла */
html:not(#_):not(#__):not(#___) #hero-section h1{font-size:min(7.4vw,14vh) !important;line-height:1 !important;max-width:none !important;width:100% !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{max-width:94vw !important;width:94vw !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn{background:#fff !important;background-color:#fff !important;opacity:1 !important;border:1px solid #fff !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn,html:not(#_):not(#__):not(#___) #hero-section .hero-calc-btn *{color:#111 !important;opacity:1 !important}
@media (max-width:640px){html:not(#_):not(#__):not(#___) #hero-section h1{font-size:min(11.5vw,12vh) !important}}
html:not(#_):not(#__):not(#___):not(#____):not(#_____) #hero-section a.hero-calc-btn{background:#fff !important;background-color:#fff !important;color:#111 !important;border:1px solid #fff !important;box-shadow:none !important;backdrop-filter:none !important;opacity:1 !important}
html:not(#_):not(#__):not(#___):not(#____):not(#_____) #hero-section a.hero-calc-btn *{color:#111 !important}
html:not(#_):not(#__):not(#___):not(#____):not(#_____) #hero-section a.hero-calc-btn:hover{background:#eee !important}
/* Фото нижче: знизу видно початок наступного розділу */
html:not(#_):not(#__):not(#___) #hero-section{height:calc(100vh - 250px) !important;height:calc(100svh - 250px) !important;min-height:440px !important}
html:not(#_):not(#__):not(#___) #hero-section h1{font-weight:400 !important;letter-spacing:-.03em !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-eyebrow{margin-bottom:16px}
@media (max-width:640px){html:not(#_):not(#__):not(#___) #hero-section h1{font-size:min(10vw,10vh) !important}}
html:not(#_):not(#__):not(#___) #hero-section{height:calc(100vh - 185px) !important;height:calc(100svh - 185px) !important;min-height:480px !important}
html:not(#_):not(#__):not(#___) #hero-section h1,html:not(#_):not(#__):not(#___) #hero-section h1 *{font-weight:300 !important}
/* Фото на повну висоту (відступ зверху лишається), текст зліва, не заходить на техніку */
html:not(#_):not(#__):not(#___) #hero-section{height:calc(100vh - 132px) !important;height:calc(100svh - 132px) !important;min-height:520px !important}
@media (min-width:1024px){
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{width:46vw !important;max-width:46vw !important;margin:0 0 0 5vw !important;text-align:left !important}
html:not(#_):not(#__):not(#___) #hero-section h1{text-align:left !important;width:auto !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content .flex{justify-content:flex-start !important}
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content a{padding:16px 28px !important;font-size:16px !important}
}
@media (max-width:1023px){html:not(#_):not(#__):not(#___) #hero-section h1{font-size:min(9vw,9vh) !important}}
/* Як було спочатку: висота екрана, фото зсунуте вправо, текст зліва не заходить на фару */
html:not(#_):not(#__):not(#___) #hero-section{height:calc(100vh - 46px) !important;min-height:calc(100vh - 46px) !important}
html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-day,html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night{background-position:right -150px center !important}
@media (min-width:1024px){
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{width:40vw !important;max-width:40vw !important}
}
/* Слайд 2: акція */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{position:absolute;z-index:6;left:5vw;top:50%;transform:translateY(-50%);max-width:46vw;color:#fff}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text h2{font-family:'Inter','Helvetica Neue',Arial,sans-serif;font-weight:300;font-size:min(3.6vw,9.5vh);line-height:1.05;letter-spacing:-.03em;color:#fff !important;margin:0 0 36px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text a{display:inline-flex;background:#fff;color:#111 !important;padding:16px 28px;font-size:16px;font-weight:500;text-decoration:none;border-radius:0}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text a:hover{background:#eee}
html:not(#_):not(#__):not(#___) #hero-section.hero-slide-promo .hero-container{opacity:0;visibility:hidden;transition:opacity .4s}
html:not(#_):not(#__):not(#___) #hero-section .hero-container{transition:opacity .4s}
@media (max-width:1023px){html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{left:20px;right:20px;max-width:none;text-align:center}html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text h2{font-size:9vw}}
/* Слайд 2: текст по центру */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{left:50% !important;right:auto !important;transform:translate(-50%,-50%) !important;max-width:90vw !important;width:max-content;text-align:center !important}
/* Стрілки: без transform/смикання, завжди клікабельні */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav{top:0 !important;bottom:0 !important;height:auto !important;transform:none !important;transition:none !important;outline:none !important;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;touch-action:manipulation;filter:none !important;z-index:30 !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav svg{filter:drop-shadow(0 1px 4px rgba(0,0,0,.6));pointer-events:none}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:hover,html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:active,html:not(#_):not(#__):not(#___) #heroCarousel .hc-nav:focus{transform:none !important;top:0 !important;opacity:.8 !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-slide{will-change:opacity}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text .hero-eyebrow{font-family:'Inter','Helvetica Neue',Arial,sans-serif;font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;color:rgba(255,255,255,.85) !important;margin-bottom:16px}
html:not(#_):not(#__):not(#___):not(#____) #heroCarousel .hc-promo-text h2,html:not(#_):not(#__):not(#___):not(#____) #heroCarousel .hc-promo-text h2 *{font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;font-weight:300 !important;font-size:max(32px,min(3.6vw,9.5vh)) !important;line-height:1 !important;letter-spacing:-.02em !important;text-shadow:none !important;text-transform:none !important;color:#fff !important}
@media (min-width:1024px){
html:not(#_):not(#__):not(#___) #hero-section .hero-text-content{margin-left:2.5vw !important;width:38vw !important;max-width:38vw !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{max-width:90vw}
}
/* Слайд 2: світла тема - вулиця без світла, темна - плавно вмикаються ліхтарі */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1.4s ease}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights{opacity:0}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-dark{opacity:1}
@keyframes lightsOn{0%{filter:brightness(.1)}12%{filter:brightness(1.7)}22%{filter:brightness(.25)}36%{filter:brightness(1.5)}48%{filter:brightness(.5)}68%{filter:brightness(1.25)}100%{filter:brightness(1)}}
html.dark:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights,html.theme-dark:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights,html.dark-theme:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights,html[data-theme="dark"]:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights{opacity:1 !important;animation:lightsOn 1.4s ease-out 1}
html.dark:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-dark,html.theme-dark:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-dark,html.dark-theme:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-dark,html[data-theme="dark"]:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-dark{opacity:0}
html.dark:not(#_):not(#__):not(#___) #hero-section.hero-slide-promo #heroCarousel::after,html.theme-dark:not(#_):not(#__):not(#___) #hero-section.hero-slide-promo #heroCarousel::after,html.dark-theme:not(#_):not(#__):not(#___) #hero-section.hero-slide-promo #heroCarousel::after,html[data-theme="dark"]:not(#_):not(#__):not(#___) #hero-section.hero-slide-promo #heroCarousel::after{background:rgba(0,0,0,.18) !important}
html:not(#_):not(#__) #hero-section.hero-slide-promo #heroCarousel::after{background:rgba(0,0,0,.12)}
/* Слайд 2: напис нижче, на темну бруківку */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{top:70% !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0));pointer-events:none;z-index:4}
/* Причина «не видно»: затемнювальний шар лежав поверх тексту. Піднімаємо слайд 2 над ним */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide{z-index:4 !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide::after{height:70%;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,.35) 55%,rgba(0,0,0,0))}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text h2,html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text .hero-eyebrow{text-shadow:0 2px 14px rgba(0,0,0,.7) !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text .hero-eyebrow{color:#fff !important}
html:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-text{top:50% !important}
/* Світла тема: ліхтарі «моргають» і гаснуть */
@keyframes lightsOff{0%{opacity:1}10%{opacity:.15}22%{opacity:.9}34%{opacity:.1}50%{opacity:.6}66%{opacity:.05}80%{opacity:.3}100%{opacity:0}}
html.lights-off-anim:not(#_):not(#__):not(#___) #heroCarousel .hc-promo-slide .hc-img-lights{animation:lightsOff 1.4s ease-out forwards}
/* Фара скутера (слайд 1): мерехтіння при ввімкненні та вимкненні */
html:not(#_):not(#__):not(#___) #heroCarousel .hc-lamp{position:absolute;inset:0;background:url('images/hero_night.jpg') right -150px center/cover no-repeat;opacity:0;pointer-events:none}
html.lights-off-anim:not(#_):not(#__):not(#___) #heroCarousel .hc-lamp{animation:lightsOff 1.4s ease-out forwards}
html.dark:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night,html.theme-dark:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night,html.dark-theme:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night,html[data-theme="dark"]:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night{animation:lightsOn 1.4s ease-out 1}
/* Фара: помітніше мерехтіння при вимкненні (яскравіші спалахи) */
@keyframes lampOff{0%{opacity:1;filter:brightness(1)}8%{opacity:.15;filter:brightness(1.9)}18%{opacity:1;filter:brightness(2.4)}30%{opacity:.1;filter:brightness(1.6)}44%{opacity:.95;filter:brightness(2.2)}58%{opacity:.05;filter:brightness(1.5)}72%{opacity:.7;filter:brightness(1.9)}86%{opacity:.12;filter:brightness(1.3)}100%{opacity:0;filter:brightness(1)}}
html.lights-off-anim:not(#_):not(#__):not(#___) #heroCarousel .hc-lamp{animation:lampOff 1.7s ease-out forwards}
/* Телефон: фото головного екрана по центру */
@media (max-width:767px){html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-day,html:not(#_):not(#__):not(#___) #heroCarousel #hero-bg-night{background-position:center center !important}}
@media (max-width:767px){html:not(#_):not(#__):not(#___) #heroCarousel{top:0 !important}}
@media (min-width:1024px){html:not(#_):not(#__):not(#___):not(#____) #heroCarousel #hero-bg-day,html:not(#_):not(#__):not(#___):not(#____) #heroCarousel #hero-bg-night{transform:translateX(5%) scale(1.1) !important;transform-origin:center top !important}}
@media (min-width:1024px){html:not(#_):not(#__):not(#___):not(#____) #hero-section .hero-text-content{position:relative !important;left:24px !important}}