.uiblock { margin: 16px 0; }
.uiblock__banners { display:grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.ui-banner { border-radius:0px; overflow:hidden;}
/*.ui-banner__media img { width:180px; height:150px; object-fit:cover; display:block; }*/
.ui-banner__body { padding:12px; }
.ui-banner__title { font-weight:200; }
.ui-banner__subtitle { margin:0; color:#6b7280; }

.uiblock__buttons {display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;flex-direction: column;}
.ui-btn { display:inline-flex; align-items:center; padding:10px 14px; border-radius:0px; border:1px solid #d1d5db; text-decoration:none; }
.ui-btn--primary { background:#2b65f8; color:#fff; border-color:#2b65f8; }
.ui-btn--secondary { background:#f3f4f6; }
.ui-btn--outline { background:transparent; }
.ui-btn--outline:hover {color: #000;}
.ui-btn--link { border:0; padding:0; color:#2b65f8; }

.uiblock__texts { display:grid; gap:14px; }
.ui-text__title { margin:0 0 30px; font-size:50px; }
.ui-text__body { font-size: 20px; color:#e6e7ea; }


.ui-btn--outline-y {background: transparent; color: ##ffed00;}
.ui-btn--outline-y:hover{background: #ffed00; color: #17181a;}


/* Базовая сетка */
:root {
  --c-ink:#111; --c-bg:#fff; --c-brand:#2b65f8; --c-muted:#6b7280;
  --c-dark:#0c0f14; --c-tile:#f5f7fb; --radius:16px;
}
.new-ui { color: var(--c-ink); background: var(--c-bg); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* Шапка-врезка */
.topbar { border-bottom: 1px solid #e5e7eb; font-size: 14px; }
.topbar__nav { display: flex; gap: 0px; flex-direction: row; justify-content: flex-start;}
.topbar__contacts { display: flex; gap: 0px; align-items: flex-end; flex-direction: column; justify-content: flex-start;}
.topbar .container { display: flex; justify-content: space-between; padding: 10px 20px; }
.topbar__link { width:130px; text-decoration: none; font-size: 18px; font-weight: 200;}
.topbar__link:hover { color: #FFED00; }

/* Кнопки */
.btn { display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:10px; border:1px solid #d1d5db; text-decoration:none; color:var(--c-ink); background:#fff; transition:.2s;}
.btn:hover { border-color:#9ca3af; }
.btn--primary { background:var(--c-brand); color:#fff; border-color:var(--c-brand); }
.btn--primary:hover { filter: brightness(0.95); }
.btn--outline { background:transparent; }
.btn--link { border:0; padding:0; color:var(--c-brand); background:none; }

/* Hero */
.hero { position: relative; overflow: hidden; }
.hero__bg { position:absolute; inset:0; }
.hero__bg-slide { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity .6s ease; }
.hero__bg-slide.is-active { opacity:1; }
.hero__inner { position:relative; z-index:1; padding:80px 0 100px; }
.hero__title { font-family: 'Fira Sans'; color: #fdfdfd; font-size:40px; line-height:1.15; margin:0 0 30px; font-weight: 400;letter-spacing: 1px;}
.hero__title-black { font-family: 'Fira Sans'; color: #17181a; font-size:40px; line-height:1.15; margin:0 0 30px; font-weight: 200;letter-spacing: 1px;}
.hero__text { font-family: 'Fira Sans'; color: #fdfdfd; max-width:760px; margin:30px 0 2px; font-weight: 200; letter-spacing: 1px;}
.hero__actions { display:flex; flex-wrap:wrap; gap:12px; }

/* Баннер */
.banner { margin: 24px 0 8px; }
.banner__wrap { position:relative; display:block; border-radius:var(--radius); overflow:hidden; color:#fff; text-decoration:none; }
.banner__bg { position:absolute; inset:0; background-size:cover; background-position:center; filter: brightness(0.6); }
.banner__content { position:relative; padding:32px 20px; }
.banner__title { font-size:20px; font-weight:700; }
.banner__subtitle { opacity:.95; margin-top:6px; }
.banner__cta { display:inline-block; margin-top:8px; padding:8px 12px; background:#ffffff22; border:1px solid #ffffff55; border-radius:8px; }

/* Категории (2 карточки) */
.categories { padding: 24px 0; }
.categories__grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.cat-card { border:1px solid #e5e7eb; border-radius:var(--radius); overflow:hidden; background:#fff; display:grid; grid-template-columns: 1fr 1fr; }
.cat-card__media { min-height:220px; background-size:cover; background-position:center; }
.cat-card__body { padding:20px; display:flex; flex-direction:column; justify-content:center; gap:12px; }
.cat-card__title { margin:0; font-size:22px; }

/* Плашки (Акции, Расчет) */
.tiles { padding: 8px 0 24px; }
.tiles__grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.tile { position:relative; border-radius:var(--radius); background:var(--c-tile); padding:24px; text-decoration:none; color:var(--c-ink); overflow:hidden; }
.tile__bg { position:absolute; right:-40px; top:-40px; width:180px; height:180px; background: radial-gradient(60% 60% at 50% 50%, #d9e3ff 0, transparent 70%); opacity:.6; pointer-events:none; }
.tile--dark { background: #141922; color:#fff; }
.tile__head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.tile__title { margin:0; font-size:20px; }
.tile__cta { font-weight:600; }

/* CTA блок со слайдером */
.cta { padding: 24px 0 32px; }
.cta__wrap { display:grid; grid-template-columns: 1fr 1fr; gap:20px; align-items:stretch; }
.cta__slider { position:relative; border-radius:var(--radius); overflow:hidden; min-height:320px; background:#f3f4f6; }
.cta__slide { position:absolute; inset:0; opacity:0; transition:opacity .5s ease; display:flex; }
.cta__slide.is-active { opacity:1; }
.cta__slide img { width:100%; height:100%; object-fit:cover; }
.cta__content { border:1px solid #e5e7eb; border-radius:var(--radius); padding:24px; background:#fff; display:flex; flex-direction:column; justify-content:center; }
.cta__title { margin:0 0 10px; font-size:28px; }
.cta__text { margin:0 0 16px; color:var(--c-muted); }

/* Новости */
.news { padding: 8px 0 40px; }
.news__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.news__grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; }
.news-card { border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; background:#fff; transition: transform .2s ease, box-shadow .2s ease; }
.news-card__media { aspect-ratio: 16/9; background:#eef2ff; overflow:hidden; }
.news-card__img { width:100%; height:100%; object-fit:cover; display:block; }
.news-card__img--ph { width:100%; height:100%; background: repeating-linear-gradient(45deg, #f3f4f6, #f3f4f6 10px, #e5e7eb 10px, #e5e7eb 20px); }
.news-card__body { padding:14px; }
.news-card__date { display:inline-block; font-weight:700; color:var(--c-muted); transition:color .2s; }
.news-card__title { margin:6px 0 6px; font-size:18px; }
.news-card__excerpt { color:#374151; font-size:14px; }
.news-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.news-card:hover .news-card__date { color: var(--c-brand); }

/* Ховеры и адаптив */
.banner__wrap:hover .banner__bg { filter: brightness(0.55); }
@media (max-width: 1024px) {
  .categories__grid, .tiles__grid, .news__grid { grid-template-columns:1fr 1fr; }
  .cta__wrap { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .categories__grid, .tiles__grid { grid-template-columns:1fr; }
  .news__grid { grid-template-columns:1fr; }
  .hero__title { font-size:30px; }
}



.top_promo {
  border: 2px solid #ffed00;
  /*background-color: #17181a;*/
  position: relative;
  z-index: 1;
  padding: 5px;
}

.top_promo::after,
.top_promo::before {
  content: "";
  display: block;
  border: 7px solid #17181a;
  z-index: 20;
  position: absolute;
}

.top_promo::after {
  left: -4px;
  top: 30px;
  right: -4px;
  bottom: 30px;
  border-top: none;
  border-bottom: none;
}

.top_promo::before {
  left: 30px;
  top: -4px;
  right: 30px;
  bottom: -4px;
  border-left: none;
  border-right: none;
}
}


 :root{
    --bg:#111;          /* фон карточки */
    --accent:#ffde00;   /* жёлтые акценты */
    --text:#fff;        /* базовый текст */
  }
  body{margin:0;background:#222;min-height:100vh;display:flex;align-items:center;justify-content:center;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
  .card{
    position:relative;
    width:600px;
    height:240px;
    background:var(--bg);
    color:var(--text);
    overflow:hidden;
  }

  /* жёлтые угловые скобки */
  .card .corner{position:absolute;width:32px;height:32px}
  .corner.tl{top:14px;left:14px;border-top:2px solid var(--accent);border-left:2px solid var(--accent)}
  .corner.tr{top:14px;right:14px;border-top:2px solid var(--accent);border-right:2px solid var(--accent)}
  .corner.bl{bottom:14px;left:14px;border-bottom:2px solid var(--accent);border-left:2px solid var(--accent)}
  .corner.br{bottom:14px;right:14px;border-bottom:2px solid var(--accent);border-right:2px solid var(--accent)}

  /* контентная зона */
  .card__inner{
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:space-between;
    padding: 28px 32px;
    gap: 24px;
  }

  /* картинка светильника */
  .lamp{
    width:260px; height:auto;
    transform: rotate(-10deg);
    filter: drop-shadow(0 6px 10px rgba(0,0,0,.5));
    user-select:none;
    pointer-events:none;
  }

  /* кнопка */
  .btn{
    display:inline-flex; align-items:center; gap:10px;
    background:transparent; border:2px solid var(--accent);
    color:var(--accent); text-decoration:none; font-weight:700;
    padding:12px 18px; transition: all .2s ease;
  }
  .btn .arrow{
    display:inline-block; background:currentColor;
    -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M13.172 12 7.757 6.586l1.414-1.414L16 12l-6.829 6.828-1.414-1.414z"/></svg>') center/contain no-repeat;
            mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M13.172 12 7.757 6.586l1.414-1.414L16 12l-6.829 6.828-1.414-1.414z"/></svg>') center/contain no-repeat;
  }
  .btn:hover{background:var(--accent); color:#111; transform:translateY(-1px)}
  .btn:active{transform:translateY(0)}
  
  /* группа справа (кнопка) прижата к правому краю */
  .right{
    margin-left:auto;
    display:flex; align-items:center; gap:16px;
  }

  /* Для демонстрации: если нет своей картинки — рисуем простую SVG-заглушку */
  .lamp--placeholder{
    background:
      linear-gradient(#dfe3e6,#cfd5d9) padding-box;
    border-radius:6px;
    width:240px; height:100px;
    box-shadow: inset 0 -18px 0 0 #ffffff,
                inset -12px 0 0 0 #b9c0c5;
    transform: rotate(-10deg);
  }



/* Мы можем менять только этот контейнер */
div[aria-hidden="true"] {
  width: 600px !important;       /* фиксированная ширина */
  height: 240px !important;      /* фиксированная высота */
  overflow: hidden !important;   /* всё, что выходит — обрежем */
  margin: 20px auto;             /* центрируем */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* управляем самим section внутри */
div[aria-hidden="true"] > section {
  width: 80% !important;
  height: 80% !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
}

/* стилизуем содержимое */
div[aria-hidden="true"] img {
  max-width: 70%;
  max-height: 70%;
  object-fit: contain;
}








/* Новости — как на реф-картинке */
:root{--line:#d7d7d7;--txt:#111;--muted:#666;--accent:#ffed00;--dark:#111}
.news-new{width: 1250px; padding:40px 24px}
.news-new .container{max-width:1120px;margin:0 auto;padding:0 16px}

/* шапка */
.news-head{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;margin-bottom:40px}
.news-title{margin:0;font-weight:400;font-size:clamp(24px,3.2vw,40px);line-height:1.1}
.news-all{display:flex;align-items:center;gap:8px;color:var(--txt);text-decoration:none;white-space:nowrap}
.news-all:hover{background:#ffed00;padding: 0px 20px; border-radius: 0px; transition:background .2s,color .2s;}

.news-all__arrow{width:18px;height:18px;background:currentColor;-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M13.172 12 7.757 6.586l1.414-1.414L16 12l-6.829 6.828-1.414-1.414z"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M13.172 12 7.757 6.586l1.414-1.414L16 12l-6.829 6.828-1.414-1.414z"/></svg>') center/contain no-repeat}
.news-rule{height:2px;background:var(--line);margin:12px 0 6px}

/* вертикальный список */
.news-vertical{/*border-top:2px solid var(--line)*/}
.news-row{
	border-radius: 0px;
  display:grid;
  grid-template-columns: 2fr .6fr; /* дата / текст / превью */
  gap:18px;
  align-items:center;
  /*padding:14px 12px;*/
  /*border-bottom:2px solid var(--line);*/
  text-decoration:none;
  color:var(--txt);
  position:relative;
  overflow:hidden;
  background:#fff;
  transition:background .2s,color .2s;
}

.news-row2{
	border-radius: 0px;
  display:grid;
  grid-template-columns: 0.8fr 1fr; /* дата / текст / превью */
  gap:18px;
  align-items:center;
  /*padding:14px 12px;*/
  border-top:2px solid var(--line);
  text-decoration:none;
  color:var(--txt);
  position:relative;
  overflow:hidden;
  background:#fff;
  transition:background .2s,color .2s;
	height: 100%;
}

.news-row__date{color:var(--txt);     margin-left: 20px; height: 70%;}
.news-row__date .d{/*font-weight:800*/}
.news-row__text{display:flex;flex-direction:column;gap:6px}
.news-row__title{font-weight:700}
.news-row__excerpt{color:var(--muted)}

/* превью справа — скрыто, проявляем при наведении строки */
.news-row__thumb{
  width:270px;height:160px; /* пропорция как на рефе */
  justify-self:end;
  opacity:0; transform:translateX(8px);
  transition:opacity .2s, transform .2s;
}
.news-row__thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* ховер/актив */
.news-row2:hover{
  background:var(--dark);
  color:#fff;
}
.news-row2:hover .news-row__excerpt{color:#e6e6e6}
.news-row2:hover .news-row__date{color:var(--accent)}
.news-row2:hover+.news-row__thumb{opacity:1;transform:translateX(0)}

@media (max-width:900px){
  .news-row{grid-template-columns:74px 1fr}
  .news-row__thumb{
    grid-column:1 / -1;
    width:100%; height:220px; margin-top:10px;
  }
}
@media (max-width:640px){
  .news-row{grid-template-columns:64px 1fr}
.news-row2{grid-template-columns:64px 1fr}
}



/* блок под банер */

/* ===== Мобильная адаптация блока "Под карусель" (<=760px) ===== */
@media (max-width: 760px){

  /* Внешний контейнер: из строки в колонку, авто-высота, адекватные отступы.
     Да, выбираем по inline-стилю с фоном — ты не дал класс, зато дал #17181a :) */
  div[style*="background: #17181a"]{
    height: auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    padding: 16px !important;
  }

  /* Левый текстовый блок: ширина 100% */
  div[style*="background: #17181a"] > div:first-child{
    width: 100% !important;
  }

  /* Карточка справа: ширина 100%, убираем фикс-геометрию, делаем нормальную вёрстку */
  .card{
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
  }
  .card__inner{
    padding: 16px !important;
    gap: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  /* Картинка внутри карточки: по центру, без наклонов, не вылезает */
  .card .ui-banner__media img,
  .card img,
  .lamp,
  .lamp--placeholder{
    max-width: 70% !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    transform: none !important;
    object-fit: contain !important;
  }

  /* Правый столбец внутри карточки: кнопка на всю ширину */
  .right{
    margin-left: 0 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }
  .right a,
  .right .btn{
    width: 100% !important;
    display: inline-flex !important;
    justify-content: center !important;
    padding: 12px 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* Жёлтые «скобки» в углах — делаем компактнее, чтобы не жрали место */
  .card .corner{ width: 20px !important; height: 20px !important; }
  .card .corner.tl{ top:10px !important; left:10px !important; }
  .card .corner.tr{ top:10px !important; right:10px !important; }
  .card .corner.bl{ bottom:10px !important; left:10px !important; }
  .card .corner.br{ bottom:10px !important; right:10px !important; }
}







.site-footer{width:100%; background:#191919;color:#dfe0e2}
.site-footer a{color:#dfe0e2;text-decoration:none}
.site-footer a:hover{opacity:.9}

/* контейнер */
.container{max-width:1140px;margin:0 auto;padding:0 20px}

/* верх */
.footer-top{max-width: 1250px; padding: 28px 24px; margin-left: auto; margin-right: auto;}
.footer-top__grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1.2fr;
  gap:40px 28px;
  align-items:start;
}

/* логотип + теглайн */
.f-brand{display:flex;flex-direction:column;gap:10px}
.f-brand__logo{height:44px;width:auto}
.f-brand__tag{
  display:inline-block;
  border-top:2px solid #dfe0e2;
  border-bottom:2px solid #dfe0e2;
  padding:6px 10px 4px;
  font-weight:700;
  font-size:12px;
  letter-spacing:.08em;
  width:max-content;
}

/* соцсети */
.f-social{display:flex;gap:14px;justify-content:center}
.f-social__item{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;background:#222}
.f-social__item img{width:22px;height:22px}

/* контакты справа */
.f-contacts{display:flex;flex-direction:column;gap:8px;justify-self:end}
.f-contacts__line{display:flex;align-items:center;gap:10px;font-weight:600}
.f-ic{display:inline-block;width:16px;height:16px;background:#dfe0e2}
.f-ic--phone{-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M6.62 10.79a15.05 15.05 0 006.59 6.59l2.2-2.2a1 1 0 011.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 011 1v3.5a1 1 0 01-1 1C11.3 22.81 1.19 12.7 1.99 3a1 1 0 011-1h3.5a1 1 0 011 1c0 1.25.2 2.46.57 3.58a1 1 0 01-.24 1.01l-2.2 2.2z"/></svg>') center/contain no-repeat;mask:inherit}
.f-ic--mail{-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M20 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V6a2 2 0 00-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>') center/contain no-repeat;mask:inherit}
.f-ic--pin{-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a7 7 0 00-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 00-7-7zm0 9.5a2.5 2.5 0 110-5 2.5 2.5 0 010 5z"/></svg>') center/contain no-repeat;mask:inherit}

/* три колонки меню */
.f-col{margin-top:10px}
.f-col__title{font-weight:700;margin:0 0 10px}
.f-col__list,
.f-col__list ul{list-style:none;margin:0;padding:0}
.f-col__list li{margin:6px 0}
.f-col__list a{color:#bfc3c8}
.f-col__list a:hover{color:#fff}

/* низ */
.footer-bottom{margin-top:22px}
.footer-bottom__grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1.2fr;
  gap:20px;
  align-items:center;
  padding:16px 0 22px;
}
.f-policy{color:#bfc3c8}
.f-address{justify-self:center;display:flex;align-items:center;gap:10px;color:#bfc3c8}
.f-company{justify-self:end;color:#bfc3c8;text-align:right}

/* адаптив */
@media (max-width:1024px){
  .footer-top__grid{grid-template-columns:1fr 1fr}
  .footer-bottom__grid{grid-template-columns:1fr}
  .f-contacts{justify-self:start}
  .f-address,.f-company{justify-self:start;text-align:left}
}
@media (max-width:640px){
  .f-brand__logo{height:36px}
  .f-social__item{width:36px;height:36px}
}






