/* Risen Ukraine: доповнення до стилів Risen (static/css/risen.css збирається з assets/risen.css).
   Тут лише те, що в Risen робили скрипти і бібліотеки, які ми не підключаємо:
   розмір rem (у Risen його ставив page.js), каркас слайдерів (swiper.min.css), вікно відео,
   службові сторінки. */

/* rem як у page.js Risen: 100px до 1600, ширина/16 до 1200, ширина/7.5 (не більше 65px) нижче */
html{font-size:100px}
@media(max-width:1600px){html{font-size:6.25vw}}
@media(max-width:1200px){html{font-size:min(13.333vw,65px)}}
body{font-family:'Inter-var-2',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
img{max-width:100%}
mark.todo{background:#fff3b0;color:#5a4500;padding:0 .2em;border-radius:3px}

/* Каркас слайдерів замість swiper.min.css; поведінку дає site.js за атрибутом data-slider */
.swiper-container{position:relative;overflow:hidden;z-index:1}
.swiper-wrapper{position:relative;display:flex;width:100%;height:100%;box-sizing:content-box;transition-property:transform;will-change:transform}
.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative}
[data-slider][data-vertical] .swiper-wrapper{flex-direction:column}
.swiper-pagination{position:absolute;left:0;width:100%;z-index:10;text-align:center}
.swiper-pagination-bullet{cursor:pointer}
.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center}
.swiper-button-disabled{opacity:.35;cursor:default;pointer-events:none}
[data-slider-single] .swiper-button-next,[data-slider-single] .swiper-button-prev,[data-slider-single] .swiper-pagination{display:none}
@media(prefers-reduced-motion:reduce){.swiper-wrapper{transition-duration:0s!important}}

/* Екрани повноекранної прокрутки Risen (головна, BIPV): у нас звичайна прокрутка, але кожен екран
   лишається висотою у вікно і з відносним позиціюванням, як слайд у Risen */
.fp{position:relative;overflow:hidden;display:flow-root}
@media(min-width:769px){.fp{min-height:100vh}}
/* На телефоні повноекранна прокрутка у Risen лишається лише на сторінках модулів HJT і TOPCon (на головній
   і BIPV її вмикає document.write тільки для ПК): там екран - висота вікна без шапки (60px), інакше фонові
   блоки стискаються до тексту */
@media(max-width:768px){
  .page-products_modules_hjt .fp,.page-products_modules_topcon .fp{min-height:calc(100vh - 60px);min-height:calc(100svh - 60px)}
}

/* Іконки намальовані маскою (static/css/icons.css), а маска має власний шар відрисовки:
   без z-index стрілки пунктів нижчого рівня проступали б крізь відкрите підменю */
.m_menu ul ul{z-index:2}

/* Кнопка входу в нашу EMS у шапці (ПК - праворуч від меню, телефон - поруч із кнопкою меню) */
.ems_btn{display:inline-flex;align-items:center;gap:7px;margin-left:24px;padding:8px 16px;border:1px solid #194395;
  border-radius:40px;color:#194395;font-size:14px;font-weight:600;line-height:1;white-space:nowrap;transition:.3s all}
.ems_btn:hover{background:#194395;color:#fff}
.ems_btn .bi{font-size:15px}
.header_right{align-items:center}
.ems_btn .t_short{display:none}
/* до 1440: меню Risen займає майже весь рядок, повний напис переніс би його під логотип */
@media(max-width:1440px){.header_right .ems_btn{margin-left:14px;padding:7px 12px}.ems_btn .t_full{display:none}.ems_btn .t_short{display:inline}}
@media(max-width:768px){
  .m_header_right{display:flex;align-items:center;gap:12px}
  .m_header_right .ems_btn{margin-left:0;padding:6px 11px;font-size:13px}
  .m_header_right .ems_btn .t_short{display:inline}
}
@media(max-width:370px){.m_header_right .ems_btn{padding:6px 8px}.m_header_right .ems_btn .t_short{display:none}}

/* Планшет 769-1100: вісім пунктів меню Risen з логотипом в один рядок не вміщаються, і в Risen меню
   з'їжджає під логотип на банер (так у них і на сайті). Тут шапка як на телефоні: логотип, «EMS» і
   кнопка меню; правила мобільного меню - копія їхніх з блоку max-width:768px. */
@media(min-width:769px) and (max-width:1100px){
  .header .top_nav,.header .header_right{display:none}
  .header .m_header_right{display:flex;align-items:center;gap:12px;margin-right:15px}
  .header,.header .logo,.header_hover .logo{height:60px}
  .m_header_right .ems_btn{margin-left:0;padding:6px 11px;font-size:13px}
  .m_header_right .ems_btn .t_short{display:inline}
  .header:has(.m_nav_btn_active){background:#fff}  /* шапка над відкритим меню не прозора */
  .m_tc_box{position:fixed;top:60px;left:0;bottom:0;right:0;background:#fff;z-index:98}
  .m_tc_box .wrapper{position:absolute;left:0;right:0;height:100%;padding:15px 20px;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;z-index:110}
  .m_menu{overflow-x:hidden;overflow-y:auto}
  .m_menu .nav1{position:relative}
  .m_menu .nav1 ul{background-color:#fff;position:absolute;right:-100%;top:0;width:100%;height:100%;transition:0.3s all}
  .m_menu .nav1 ul.active{right:0}
  .m_menu .nav1 .back{color:var(--second_color);margin-top:30px;border-bottom:1px solid #efefef;padding:16px 0;font-size:15px}
  .m_menu .item{border-bottom:1px solid #efefef;padding:16px 0;font-size:15px}
  .m_menu .item i{float:right;color:var(--second_color);transition:0.3s all}
  .m_menu .item a:hover{color:var(--main_color)}
  .m_top_nav{text-align:right;padding:25px 15px 15px 0}
  .m_top_nav a{margin-left:15px}
}

/* Картки модулів ведуть на сторінку виробу */
li[data-href]{cursor:pointer}

/* Відео: вікно поверх сторінки */
.video-pop{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;padding:20px}
.video-pop video{max-width:min(1100px,100%);max-height:85vh;width:100%;background:#000}
.video-pop button{position:absolute;top:16px;right:20px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:22px;cursor:pointer}

/* Службові сторінки (політика конфіденційності, 404) у стилі Risen */
.page-text{padding-top:1.4rem;padding-bottom:1rem}
.article-box{max-width:900px;margin:0 auto .8rem;font-size:16px;line-height:1.75;color:#333}
.article-box h2{font-size:22px;margin:28px 0 10px;color:#111}
.article-box p{margin:0 0 14px}
.article-box a{color:#194395}
.article-box .btn{display:inline-block;padding:12px 26px;border-radius:40px;background:#194395;color:#fff;text-decoration:none}

/* Довгі назви файлів без пробілів («Risen_Обмежена гарантія_односкляні_A_1[2020]») переносяться,
   а не розширюють сторінку на телефоні */
body{overflow-wrap:break-word}
.xiazai_list h3{overflow-wrap:anywhere}

/* Телефон: текст, який у Risen 7-10 пікселів (нечитабельно), і вкладки, що з українськими назвами
   не влазять в один рядок */
@media(max-width:768px){
  .cn_box3 .list1 li p{font-size:12px;line-height:1.4}
  .pro_list .swiper-slide li .txt{font-size:12px;line-height:1.3}
  .case_box .guojia{font-size:12px}
  .about_bg .about_ico li .txt p{font-size:12px;line-height:1.4}
  .zujian2_02 .txt p{font-size:12px}
  .copyright p{font-size:11px}
  .index_about .title .tabs1{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px}
  .index_about .title .tabs1::-webkit-scrollbar{display:none}
  .index_about .title .tabs1 a{font-size:13px;white-space:nowrap}
  /* новина: ярлик розділу фіксованої ширини, «Новини компанії» не влазить; вирівнювання по ширині
     на вузькому екрані з довгими українськими словами дає великі пробіли */
  /* підвал: у Risen останній стовпчик - «Members of the Group» з власною версткою (:last-child);
     ми його прибрали, і та верстка дісталася «Контактам» - повертаємо їм вигляд решти пунктів */
  .footer_nav dl.db_dh:last-child{border-bottom:solid 1px rgba(255,255,255,0.1);margin-top:0}
  .footer_nav dl.db_dh:last-child dt{display:flex}
  .footer_nav dl.db_dh:last-child dd{display:none;padding-bottom:5px}
  .show_news .riqi span{width:auto;padding:0 10px;white-space:nowrap}
  .show_news .article,#art_box{text-align:left}
  .show_news .article [style*="justify"]{text-align:left!important}
}

/* Контакти: у блоці офісу посилання виглядають як текст */
.zb_box .txt a{color:inherit}
.zb_box .txt{width:100%}

/* Логотип risen-ua з емблемою: круг вищий за слово, тому картинка вища, ніж знак Risen (у них 46 і 38 пікселів),
   а на телефоні й планшеті - така, щоб не впиралась у кнопку «EMS». */
.header .logo img,.header_hover .logo img{height:58px}
@media(max-width:1360px){   /* вузький екран: логотип не ширший за знак Risen, інакше меню з'їжджає під нього */
  .header .logo img,.header_hover .logo img{height:46px}
}
@media(max-width:1100px){
  .header .logo img,.m_header_scroll .logo img,.header_hover .logo img{height:42px}
}