:root {
    --bg: #ffffff;
    --bg-alt: #f8fafc;
    --text: #0f172a;
    --muted: #475569;
    --line: #e2e8f0;
    --primary: #ec7b30;
    --primary-dark: #be371e;
    --dark: #0f172a;
    --radius: 18px;
    --shadow: 0 12px 40px rgba(15, 23, 42, .08);
    --container: 1280px;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.6 Arial, Helvetica, sans-serif;
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a{
  color:inherit;
  text-decoration:none;
}

.container{
  width:min(var(--container), calc(100% - 32px));
  margin:0 auto;
}

.narrow {
    width: min(80%);
    display: flex;
    flex-direction: column;
}

.telephon_mob.kalk333 svg {
    width: 38px;
    height: 32px;
}

.telephon_mob.kalk333 svg path {
    position: relative;
    width: 50px;
    height: 50px;
    display: grid;
    color: rgb(29 161 15);
    overflow: visible;
}

.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
}
.skip-link:focus{
  left:16px;
  top:16px;
  z-index:1000;
  background:#fff;
  padding:10px 14px;
  border:1px solid var(--line);
}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}

.header-grid{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
  min-height:78px;
}

.logo img{
  display:block;
}

.main-nav{
  justify-self:center;
}

.nav-toggle{
  display:none;
}

.nav-list{
  list-style:none;
  display:flex;
  align-items:center;
  gap:24px;
  margin:0;
  padding:0;
}

.nav-list a{
  color:var(--muted);
  font-weight:600;
}

.nav-list a:hover{
  color:var(--primary);
}

.header-contacts{
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:600;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid var(--primary);
  background:var(--primary);
  color:#fff;
  font-weight:700;
  transition:.2s ease;
  cursor:pointer;
}

.btn{
  transition:
    background .4s ease,
    border-color .4s ease,
    box-shadow .2s ease,
    transform .4s ease;
}

.btn:hover{
  background:#f08b45;
  border-color:#f08b45;
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(236,123,48,.28);
}

.btn--ghost{
  background:transparent;
  color:var(--primary);
}

.btn--ghost:hover{
  background:#eff6ff;
}

.btn--dark{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid var(--primary);
  color:#fff;
  font-weight:700;
  cursor:pointer;
  transition:border-color .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease;
  text-decoration:none;
  overflow:hidden;
  z-index:0;
}

.btn--dark::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  z-index:-1;
  transition:opacity .25s ease;
}

.btn--dark{
  border-color:transparent;
  background:transparent;
  color:#fff;
}

.btn--dark::before{
  background:linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
  opacity:1;
}

.btn--dark::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg, #be371e 0%, #d97706 100%);
  opacity:0;
  z-index:-1;
  transition:opacity .25s ease;
}

.btn--dark:hover{
  border-color:transparent;
  color:#fff;
}

.btn--dark:hover::after{
  opacity:1;
}

.hero{
  padding:64px 0 32px;
}

.hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:40px;
  align-items:center;
}

.eyebrow{
  margin:0 0 14px;
  color:var(--primary);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:13px;
}

h1,h2,h3{
  line-height:1.2;
  margin:0 0 16px;
}

h1{
  font-size:48px;
  max-width:900px;
}

h2{
  font-size:30px;
}

h3{
  font-size:22px;
}

.hero__text,
.section-head p,
.card p,
.product-card p,
.app-box p,
.mini-card p,
.lead p,
.seo-text p,
.faq p{
  color:var(--muted);
}

.hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:28px 0;
}

.hero__badges{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  padding:0;
  margin:0;
}

.hero__badges li{
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  font-weight:600;
}

.hero__media img{
  border-radius:28px;
  box-shadow:var(--shadow);
}

.trust{
  padding:0 0 24px;
}

.trust-grid{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin:0;
  padding:0;
}

.trust-grid li{
  padding:22px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}

.trust-grid strong{
  display:block;
  margin-bottom:6px;
  font-size:18px;
}

.trust-grid span{
  color:var(--muted);
}

.section{
  padding:50px 0;
}

.section--alt{
  background:var(--bg-alt);
}

.section-head{
  margin-bottom:28px;
}

.cards{
  display:grid;
  gap:20px;
}

.cards--3{
  grid-template-columns:repeat(3,1fr);
}

.cards--4{
  grid-template-columns:repeat(4,1fr);
}

.card,
.product-card,
.mini-card,
.app-box{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:24px;
  box-shadow:var(--shadow);
}

.product-card{
  padding:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.product-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(15,23,42,.12);
  border-color:#cbd5e1;
}

.product-card__link{
  display:flex;
  flex-direction:column;
  height:100%;
  color:inherit;
  text-decoration:none;
}

.blog-card__media {
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    overflow: hidden;
}

.blog-card__media img{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  transition:transform .3s ease;
}


.product-card__media {
    height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    overflow: hidden;
}

.product-card__media img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    transition: transform .3s ease;
    padding: 20px;
}

.product-card:hover .product-card__media img{
  transform:scale(1.03);
}

.product-card__body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  padding:24px;
}

.product-card__body h3{
  margin:0 0 10px;
  color:var(--text);
  transition:color .2s ease;
}

.product-card:hover .product-card__body h3{
  color:var(--primary);
}

.product-card__body p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.6;
}

.product-card .card-link{
  margin-top:auto;
  display:inline-block;
  font-weight:700;
  color:var(--primary);
}

.product-card__link:focus-visible{
  outline:none;
}

.product-card__link:focus-visible .product-card__body,
.product-card__link:focus-visible .product-card__media{
  box-shadow:inset 0 0 0 2px var(--primary);
}
.card h3 a,
.product-card h3 a{
  color:var(--text);
}

.card h3 a:hover,
.product-card h3 a:hover,
.app-box:hover h3{
  color:var(--primary);
}

.app-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.app-box{
  display:flex;
  flex-direction:column;
  height:100%;

  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow);

  color:inherit;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.app-box:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(15,23,42,.12);
  border-color:#cbd5e1;
}

.app-box__media{
  height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0px;
  background:#fff;
  border-bottom:1px solid var(--line);
  overflow:hidden;
}

.app-box__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.app-box:hover .app-box__media img{
  transform:scale(1.04);
}

.app-box__body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  padding:22px;
}

.app-box__body h3{
  margin:0 0 10px;
  color:var(--text);
  transition:color .2s ease;
}

.app-box:hover .app-box__body h3{
  color:var(--primary);
}

.app-box__body p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}

.app-box:focus-visible{
  outline:none;
  box-shadow:
    0 18px 44px rgba(15,23,42,.12),
    0 0 0 2px var(--primary);
}

.steps{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:24px;
  align-items:stretch;
}

.step-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;

  min-height:132px;
  padding:20px 22px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow);
}

.step-num {
    flex: 0 0 49px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    font-size: 70px;
    line-height: 1;
    font-weight: 800;
    color: var(--primary);
}

.step-body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}

.step-body strong {
    display: block;
    margin-bottom: 6px;
    font-size: 17px;
    line-height: 1;
}

.step-body span {
    color: var(--muted);
    line-height: 1.2;
    font-size: 12px;
}

/* градиентная галочка между карточками */
.step-item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -32px;
    transform: translateY(-50%);
    z-index: 4;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
    box-shadow: 0 10px 24px rgba(11, 95, 255, .22);
}

/* сама галочка */

.step-item:not(:last-child)::before {
    content: "";
    position: absolute;
    top: 49%;
    right: -12px;
    transform: translateY(-50%);
    z-index: 5;
    width: 15px;
    height: 15px;
    border-top: 4px solid #fff;
    border-right: 4px solid #fff;
    transform-origin: center;
    rotate: 45deg;
}

.steps strong{
  display:block;
  margin-bottom:8px;
}

.faq-list{
  display:grid;
  gap:14px;
}

.faq-list details{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:18px 20px;
}

.faq-list summary{
  position:relative;
  cursor:pointer;
  font-weight:700;
  list-style:none;
  padding-right:34px;
}

/* стрелка справа */
.faq-list summary::after{
  content:"";
  position:absolute;
  top:50%;
  right:4px;
  width:10px;
  height:10px;
  border-right:2px solid var(--primary);
  border-bottom:2px solid var(--primary);
  transform:translateY(-50%) rotate(45deg); /* вниз */
  transition:transform .25s ease, border-color .2s ease;
}

.faq-list details[open] summary::after{
  transform:translateY(-50%) rotate(-135deg); /* вверх */
  border-color:var(--primary);
}

.faq-list summary:hover::after{
  border-color:var(--primary-dark);
}
.faq-list summary::-webkit-details-marker{
  display:none;
}

.faq-list details div{
  padding-top:12px;
  animation:faqFade .25s ease;
}

@keyframes faqFade{
  from{
    opacity:0;
    transform:translateY(-4px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.lead-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  align-items:start;
}

.contact-list{
  list-style:none;
  padding:0;
  margin:22px 0 0;
}

.contact-list li{
  margin-bottom:10px;
}

.lead-form{
  display:grid;
  gap:16px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
}

.lead-form label{
  display:grid;
  gap:8px;
  font-weight:700;
}

.lead-form input,
.lead-form textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:14px;
  padding:14px 16px;
  font:inherit;
  color:var(--text);
  background:#fff;
}

.lead-form input:focus,
.lead-form textarea:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(11,95,255,.12);
}

.form-note{
  margin:0;
  font-size:14px;
  color:var(--muted);
}

.form-note a{
  color:var(--primary);
}

.site-footer{
  padding:52px 0;
  background:var(--dark);
  color:#fff;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:24px;
}

.footer-title{
  font-size:18px;
  margin-bottom:12px;
}

.site-footer ul{
  list-style:none;
  padding:0;
  margin:0;
}

.site-footer li{
  margin-bottom:8px;
}

.site-footer a{
  color:rgba(255,255,255,.9);
}

.site-footer a:hover{
  color:#fff;
}

@media (max-width: 1100px){
  .hero-grid,
  .lead-grid,
  .cards--3,
  .cards--4,
  .app-grid,
  .steps,
  .trust-grid,
  .footer-grid{
    grid-template-columns:repeat(2,1fr);
  }

  h1{
    font-size:40px;
  }
}
@media (max-width: 990px){
    h1 {
        font-size: 32px;
    }
    .hero {
    padding: 40px 0 32px;
}
}

@media (max-width: 760px){
  .header-grid{
    grid-template-columns:auto auto;
    gap:16px;
  }



  .nav-list.is-open{
    display:flex;
  }

  .header-contacts{
    justify-self:end;
  }



  .hero-grid,
  .lead-grid,
  .cards--3,
  .cards--4,
  .app-grid,
  .steps,
  .trust-grid,
  .footer-grid{
    grid-template-columns:1fr;
  }

  h1{
    font-size:32px;
  }

     .hero {
        padding-top: 24px;
    }

  .section{
    padding:56px 0;
  }

  .hero{
    padding-top:40px;
  }
}
@media (max-width: 600px){
    .hero {
        padding-top: 24px;
    }
}

.trust-item{
  display:flex;
  align-items:center;   /* ← ВАЖНО: не flex-start */
  gap:16px;

  padding:22px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;

  transition:.2s ease;
}

.trust-icon {
    flex-shrink: 0;
    width: 70px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #eff6ff;
}

.trust-text{
  display:flex;
  flex-direction:column;
}

.trust-text strong{
  font-size:18px;
  margin-bottom:4px;
}

.trust-text span{
  color:var(--muted);
}
.trust-icon img {
    width: 50px;
    height: 50px;
    object-fit: contain;
    display: block;
}

.card__image {
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card__image img {
    width: auto;
    height: 250px;
}

article.card.card--category:hover {
    background: #ef8833;
    color: white;
}

a.app-box {
    padding: 0px;
}



@media (max-width: 1100px){
  .steps{
    grid-template-columns:repeat(2, 1fr);
  }
  
  .step-item:nth-child(2)::after,
.step-item:nth-child(2)::before,
.step-item:nth-child(4)::after,
.step-item:nth-child(4)::before{
  display:none;
}
}

@media (max-width: 760px){
    
    .step-item:nth-child(2)::after,
.step-item:nth-child(2)::before,
.step-item:nth-child(4)::after,
.step-item:nth-child(4)::before{
  display:block;
}

  .steps{
    grid-template-columns:1fr;
    gap:26px;
  }

  .step-item{
    min-height:auto;
  }

  /* круг со стрелкой */
    .step-item:not(:last-child)::after {
        content: "";
        position: absolute;
        top: auto;
        right: auto;
        left: 50.5%;
        bottom: -33px;
        transform: translateX(-50%);
        z-index: 4;
        width: 40px;
        height: 40px;
        border-radius: 999px;
        background: linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
        box-shadow: 0 10px 24px rgba(11, 95, 255, .22);
    }

  /* сама галочка вниз */
      .step-item:not(:last-child)::before {
        content: "";
        position: absolute;
        top: auto;
        right: auto;
        left: 50%;
        bottom: -22px;
        z-index: 5;
        width: 15px;
        height: 15px;
        border-top: 4px solid #fff;
        border-right: 4px solid #fff;
        transform: translateX(-50%) rotate(90deg);
        transform-origin: center;
    }
}

.container.narrow h2 {
    text-align: center;
}


/* ===== City selector ===== */

.header-brand{
  display:flex;
  align-items:center;
  gap:14px;
}

.city-trigger {
    min-height: 44px;
    padding: 0 16px;
    gap: 10px;
    white-space: nowrap;
    background: rgba(236, 123, 48, .12);
}

.city-trigger__label{
  font-weight:700;
}

.city-trigger__value {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    color: var(--primary);
    font-size: 14px;
    font-weight: 700;
}

.hero-city-badge{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 14px;
  margin:0 0 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--primary);
  font-weight:700;
  box-shadow:var(--shadow);
}

.city-modal{
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
}

.city-modal.is-open{
  display:block;
}

.city-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .48);
    height: 100vh;
}

.city-modal__dialog {
    position: relative;
    width: min(920px, calc(100% - 24px));
    max-height: min(84vh, 860px);
    margin: 6vh auto 0;

    display: flex;
    flex-direction: column;

    background: #fff;
    border: 1px solid var(--line);
    border-radius: 28px;
    box-shadow: 0 24px 80px rgba(15, 23, 42, .24);

    /* Само окно больше не скроллим */
    overflow: hidden;
}


.city-modal__head {
    flex: 0 0 auto;

    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    padding: 24px 24px 18px;
    border-bottom: 1px solid var(--line);
}


.city-modal__body {
    flex: 1 1 auto;
    min-height: 0;

    padding: 20px 16px 24px 24px;

    /* Скролл теперь внутри */
    overflow-y: auto;
    overflow-x: hidden;

    /* Сдвигаем сам scrollbar влево от края окна */
    margin-right: 8px;

    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}


/* Chrome / Edge / Safari */
.city-modal__body::-webkit-scrollbar {
    width: 8px;
}

.city-modal__body::-webkit-scrollbar-track {
    background: transparent;
}

.city-modal__body::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 20px;
}

.city-modal__body::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}
.city-modal__eyebrow{
  margin:0 0 6px;
  color:var(--primary);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  font-weight:700;
}

.city-modal__title{
  margin:0;
  font-size:30px;
}

.city-modal__actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.city-reset-btn{
  min-height:44px;
}

.city-modal__close{
  width:44px;
  height:44px;
  border:none;
  border-radius:12px;
  background:#f8fafc;
  color:var(--text);
  font-size:28px;
  line-height:1;
  cursor:pointer;
}

.city-modal__close:hover{
  background:#eef2f7;
}




.city-modal__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;

    max-height: none;
    overflow: visible;

    padding-right: 4px;
}

.city-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 50px;
    padding: 8px 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: .2s ease;
}

.city-option:hover{
  border-color:#fdba74;
  background:#fff7ed;
  transform:translateY(-2px);
}

.city-option.is-active{
  border-color:#22c55e;
  background:#f0fdf4;
  box-shadow:0 0 0 1px rgba(34,197,94,.18) inset;
}

.city-option__name{
  font-size:17px;
  font-weight:700;
  color:var(--text);
}

.city-option__check{
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  border-radius:999px;
  background:#22c55e;
  color:#fff;
  font-size:15px;
  font-weight:700;
  line-height:1;
  opacity:0;
  transform:scale(.8);
  transition:.2s ease;
}

.city-option.is-active .city-option__check{
  opacity:1;
  transform:scale(1);
}

.city-modal__empty{
  padding:24px;
  border:1px dashed var(--line);
  border-radius:18px;
  text-align:center;
  color:var(--muted);
}

body.city-modal-open{
  overflow:hidden;
}

@media (max-width: 1100px){
  .header-brand{
    flex-wrap:wrap;
  }
}

@media (max-width: 760px){
  .header-brand{
    align-items:flex-start;
    gap:10px;
  }

  .city-trigger{
    width:100%;
    justify-content:space-between;
  }

  .city-trigger__label{
    font-size:14px;
  }

  .city-trigger__value{
    font-size:13px;
  }

  .city-modal__dialog{
    width:min(100% - 16px);
    margin:3vh auto 0;
    max-height:90vh;
    border-radius:22px;
  }

  .city-modal__head{
    flex-direction:column;
    align-items:stretch;
  }

  .city-modal__actions{
    justify-content:space-between;
  }

  .city-modal__title{
    font-size:24px;
  }

.city-modal__list {
    grid-template-columns: 1fr;
    max-height: none;
}
}

.seo-text__content {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
}

.seo-text__content p{
  margin:0 0 18px;
  font-size:17px;
  line-height:1.85;
}

.seo-text__hidden{
  display:block;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transition:max-height .45s ease, opacity .3s ease;
}

.seo-text__hidden.is-open{
  max-height:2200px;
  opacity:1;
}

.seo-text__content:not(.is-open)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0px;
    height: 120px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .82) 48%, rgba(255, 255, 255, 1) 100%);
}

.seo-text__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    margin: 8px auto 0;
    padding: 0 22px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 14px 32px rgba(236, 123, 48, .26);
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
    z-index: 1;
}

.seo-text__toggle:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(236,123,48,.32);
}

.seo-text__toggle::after{
  content:"";
  width:10px;
  height:10px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(45deg) translateY(-1px);
  transition:transform .25s ease;
}

.seo-text__toggle.is-open::after{
  transform:rotate(-135deg) translateY(-1px);
}

@media (max-width: 760px){
  .seo-text__content p{
    font-size:16px;
    line-height:1.8;
  }

  .seo-text__content:not(.is-open)::after{
    bottom:54px;
    height:100px;
  }

  .seo-text__toggle{
    width:100%;
  }
}

/* =========================================
   SHINE / LIGHT GLARE EFFECT
   ========================================= */

.logo,
.hero__media,
.trust-item,
.card--category,
.product-card,
.app-box,
.mini-card,
.service-card, .apps-group__image{
  position: relative;
  overflow: hidden;
  isolation: isolate;
}



.hero__media{
  border-radius:28px;
}

.card--category,
.product-card,
.app-box,
.mini-card,
.trust-item{
  will-change: transform;
}


.hero__media::after,
.trust-item::after,
.card--category::after,
.product-card::after,
.app-box::after,
.mini-card::after,
.service-card::after, .apps-group__image::after{
  content:"";
  position:absolute;
  top:-35%;
  left:-65%;
  width:42%;
  height:170%;
  pointer-events:none;
  z-index:3;
  opacity:0;
  transform:translate3d(-220%, 0, 0) rotate(22deg);
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 18%,
    rgba(255,255,255,.42) 48%,
    rgba(255,255,255,.10) 78%,
    rgba(255,255,255,0) 100%
  );
  mix-blend-mode:screen;
}

@keyframes shine-auto-logo{
  0%{
    opacity:0;
    transform:translate3d(-240%, 0, 0) rotate(20deg);
  }
  94%{
    opacity:.2;
    transform:translate3d(-240%, 0, 0) rotate(20deg);
  }
  96%{
    opacity:.6;
    transform:translate3d(-120%, 0, 0) rotate(20deg);
  }
  100%{
    opacity:0;
    transform:translate3d(420%, 0, 0) rotate(20deg);
  }
}



.logo:hover::after{
  opacity:1;
  animation:shine-logo-hover 3s ease;
}

@keyframes shine-logo-hover{
  0%{
    opacity:0;
    transform:translate3d(-240%, 0, 0) rotate(20deg);
  }
  20%{
    opacity:.8;
  }
  100%{
    opacity:0;
    transform:translate3d(420%, 0, 0) rotate(20deg);
  }
}

.logo::after {
    content: "";
    position: absolute;
    top: -40%;
    left: -70%;
    width: 66%;
    height: 180%;
    pointer-events: none;
    z-index: 3;
    opacity: 0;
    transform: translate3d(-240%, 0, 0) rotate(20deg);
    mix-blend-mode: normal;
    animation: shine-auto-logo 40s linear infinite;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .15) 20%, rgba(255, 255, 255, .85) 50%, /* ← ВОТ ЭТО КЛЮЧ */ rgba(255, 255, 255, .15) 80%, rgba(255, 255, 255, 0) 100%);

    
}


/* автопроход каждые 30 секунд — только лого и hero */

.hero__media::after{
  animation:shine-auto 30s linear infinite;
}

/* ручной запуск по hover */

.hero__media:hover::after,
.trust-item:hover::after,
.card--category:hover::after,
.product-card:hover::after,
.app-box:hover::after,
.mini-card:hover::after,
.service-card:hover::after, .apps-group__image:hover::after{
  opacity:1;
  animation:shine-sweep .95s ease;
}

/* чтобы hover-карточки были чуть живее */
.trust-item,
.card--category,
.product-card,
.app-box,
.mini-card,
.service-card, .apps-group__image{
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease,
    background-color .25s ease,
    color .25s ease;
}

.trust-item:hover,
.mini-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(15,23,42,.12);
  border-color:#cbd5e1;
}

/* твои category-карточки: сохраняем оранжевый hover и добавляем блик */
article.card.card--category{
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background-color .25s ease,
    color .25s ease,
    border-color .25s ease;
}

article.card.card--category:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(15,23,42,.14);
  border-color:#ef8833;
  background:#ef8833;
  color:#fff;
}
.logo{
  display:inline-block;

}
article.card.card--category:hover h3,
article.card.card--category:hover p,
article.card.card--category:hover a{
  color:#fff;
}

/* чуть мягче блик на оранжевом фоне */
.card--category::after{
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 20%,
    rgba(255,255,255,.48) 50%,
    rgba(255,255,255,.12) 80%,
    rgba(255,255,255,0) 100%
  );
}

/* чтобы блик не срезался странно у картинки hero */
.hero__media img{
  position:relative;
  z-index:1;
}

/* keyframes */
@keyframes shine-sweep{
  0%{
    opacity:0;
    transform:translate3d(-220%, 0, 0) rotate(22deg);
  }
  8%{
    opacity:1;
  }
  100%{
    opacity:0;
    transform:translate3d(430%, 0, 0) rotate(22deg);
  }
}

/* один короткий проход внутри 30-секундного цикла */
@keyframes shine-auto{
  0%, 93%, 100%{
    opacity:0;
    transform:translate3d(-220%, 0, 0) rotate(22deg);
  }
  94%{
    opacity:.15;
  }
  100%{
    opacity:0;
    transform:translate3d(430%, 0, 0) rotate(22deg);
  }
}

/* на touch-устройствах hover оставляем, но без слишком частых автосрабатываний */


@media (hover:none){
  .logo::after{
    animation:shine-logo-hover 20s linear infinite;
  }

  .hero__media::after{
    animation:shine-auto 30s linear infinite;
  }
}

.steps .step-item{
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.steps .step-item:hover {
    transform: translateY(-6px) scale(1.03);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .18);
    z-index: 99;
}


/* ===== Unified lead form section ===== */

.lead-unified__box{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  align-items:start;
  padding:32px;
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(135deg, #fff7ed 0%, #ffffff 72%);
  box-shadow:var(--shadow);
}

.lead-unified__content{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.lead-unified__text{
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.8;
}

.lead-unified__list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}

.lead-unified__list li{
  position:relative;
  padding-left:18px;
  color:var(--muted);
}
.lead-unified__title{
  margin:0 0 6px;
  font-size:36px;
  line-height:1.2;
}

@media (max-width: 760px){
  .lead-unified__title{
    font-size:28px;
  }
}
.lead-unified__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:10px;
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--primary);
}

.lead-unified .lead-form{
  height:100%;
  margin:0;
}

@media (max-width: 1100px){
  .lead-unified__box{
    grid-template-columns:1fr;
  }
}

@media (max-width: 760px){
  .lead-unified__box{
    padding:22px;
    border-radius:22px;
  }

  .lead-unified__text{
    font-size:16px;
    line-height:1.75;
  }
}


.dc-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.dc-metric img {
    width: 80px;
    height: 80px;
    object-fit: contain;
}

.dc-metric strong{
  font-size:22px;
  line-height:1.2;
}

.dc-metric span{
  font-size:14px;
  color:var(--muted);
}
.dc-metric:hover img{
  transform:translateY(-2px) scale(1.05);
}

.dc-metric img{
  transition:all .25s ease;
}


.solution-card__media{
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background: #f5f7fa;
  margin-bottom: 14px;
  aspect-ratio: 4 / 3;
}

.solution-card__media img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 16px;
  transition: transform .4s ease;
}

/* лёгкий зум при hover */
.solution-card:hover .solution-card__media img{
  transform: scale(1.06);
}

.solution-card__media::after{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:60%;
  height:100%;
  background:linear-gradient(
    110deg,
    transparent 0%,
    rgba(255,255,255,0.4) 50%,
    transparent 100%
  );
  transition:0.6s;
}

.solution-card:hover .solution-card__media::after{
  left:140%;
}



.dc-case {
  position: relative;
  overflow: hidden;
  display: block;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  padding: 0;
  box-shadow: var(--shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* hover lift */
.dc-case:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(15,23,42,.14);
  border-color: #cbd5e1;
}

/* картинка */
.dc-case img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
}

/* контент */
.dc-case h3,
.dc-case p {
  padding: 0 20px;
}

.dc-case h3 {
  margin: 16px 0 8px;
}

.dc-case p {
  margin: 0 0 20px;
  color: var(--muted);
}

/* ===== БЛИК ===== */
.dc-case::after {
  content:"";
  position:absolute;
  top:-35%;
  left:-65%;
  width:42%;
  height:170%;
  pointer-events:none;
  z-index:3;
  opacity:0;
  transform:translate3d(-220%, 0, 0) rotate(22deg);
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 18%,
    rgba(255,255,255,.42) 48%,
    rgba(255,255,255,.10) 78%,
    rgba(255,255,255,0) 100%
  );
}

/* запуск блика */
.dc-case:hover::after {
  opacity:1;
  animation:shine-sweep .95s ease;
}



.breadcrumbs {
    padding: 12px 0 0;
    position: absolute;
    z-index: 9;
    display: flex;
    width: 100%;
}
    .breadcrumbs__list{
      list-style:none;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin:0;
      padding:0;
      color:var(--muted);
      font-size:14px;
    }
    .breadcrumbs__list li{
      display:inline-flex;
      align-items:center;
      gap:10px;
    }
    .breadcrumbs__list li:not(:last-child)::after{
      content:"/";
      color:#94a3b8;
    }
    .breadcrumbs__list a:hover{
      color:var(--primary);
    }

 .app-hero {
    position: relative;
    overflow: hidden;
    padding: 52px 0 38px;
    isolation: isolate;
}
    .app-hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, #ffffff 0%, #ffffff 42%, rgba(255,255,255,.94) 58%, rgba(255,255,255,.72) 68%, rgba(255,255,255,.18) 82%, rgba(255,255,255,0) 100%),
        url('/assets/img/cod.webp') right center / cover no-repeat;
      z-index:0;
      pointer-events:none;
    }
    .app-hero::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, rgba(248,250,252,.28) 0%, rgba(248,250,252,0) 35%, rgba(248,250,252,.10) 100%);
      z-index:0;
      pointer-events:none;
    }
    .app-hero .container{
      position:relative;
      z-index:1;
    }
    .app-hero__grid{
      display:grid;
      grid-template-columns:minmax(0, 720px) 1fr;
      gap:40px;
      align-items:center;
      min-height:480px;
    }
    .app-hero__content{
      max-width:720px;
    }
    .app-hero__eyebrow{
      margin:0 0 14px;
      color:var(--primary);
      font-weight:700;
      text-transform:uppercase;
      letter-spacing:.08em;
      font-size:13px;
    }
    .app-hero__content h1{
      margin:0 0 18px;
      max-width:760px;
    }
    .app-hero__text{
      max-width:680px;
      font-size:18px;
      line-height:1.75;
      color:var(--muted);
      margin:0 0 26px;
    }
    .app-hero__actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin:0 0 24px;
    }
    .app-hero__badges{
      list-style:none;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      padding:0;
      margin:0;
    }
    .app-hero__badges li{
      display:inline-flex;
      align-items:center;
      min-height:42px;
      padding:8px 14px;
      border:1px solid var(--line);
      border-radius:999px;
      background:rgba(255,255,255,.88);
      backdrop-filter:blur(4px);
      font-weight:700;
      color:var(--text);
    }

    .dc-overview{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:24px;
      align-items:stretch;
    }
    .dc-overview__card{
      border:1px solid var(--line);
      border-radius:24px;
      background:#fff;
      padding:28px;
      box-shadow:var(--shadow);
    }
    .dc-overview__card ul{
      margin:18px 0 0;
      padding-left:18px;
      color:var(--muted);
    }
    .dc-overview__metrics{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:18px;
    }
    .dc-metric{
      border:1px solid var(--line);
      border-radius:20px;
      background:#fff;
      padding:24px;
      box-shadow:var(--shadow);
    }
    .dc-metric strong{
      display:block;
      margin-bottom:8px;
      font-size:28px;
      line-height:1;
      color:var(--primary);
    }
    .dc-metric span{
      color:var(--muted);
    }

   .solution-card {
    border: 1px solid var(--line);
    border-radius: 24px;
    background: #fff;
    padding: 24px;
    box-shadow: var(--shadow);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
    .solution-card:hover{
      transform:translateY(-4px);
      box-shadow:0 18px 44px rgba(15,23,42,.12);
      border-color:#cbd5e1;
    }
    .solution-card h3{
      margin:0 0 12px;
    }
    .solution-card p{
      margin:0 0 14px;
      color:var(--muted);
    }
   .solution-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 5px;
}
    .solution-card__meta li{
      display:inline-flex;
      align-items:center;
      min-height:34px;
      padding:6px 12px;
      border-radius:999px;
      background:#fff7ed;
      color:var(--primary-dark);
      font-size:14px;
      font-weight:700;
    }

    .dc-scheme{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:20px;
    }
    .dc-scheme__item{
      border:1px solid var(--line);
      border-radius:22px;
      background:#fff;
      padding:22px;
      box-shadow:var(--shadow);
      transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .dc-scheme__item:hover{
      transform:translateY(-4px);
      box-shadow:0 18px 44px rgba(15,23,42,.12);
      border-color:#cbd5e1;
    }
    .dc-scheme__num{
      width:48px;
      height:48px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      margin-bottom:14px;
      border-radius:999px;
      background:linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
      color:#fff;
      font-weight:800;
      font-size:20px;
    }
    .dc-scheme__item p{
      margin:0;
      color:var(--muted);
    }

    .dc-cases{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:20px;
    }
    .dc-case{
      border:1px solid var(--line);
      border-radius:24px;
      background:#fff;
      padding:24px;
      box-shadow:var(--shadow);
    }
    .dc-case p{
      margin:0;
      color:var(--muted);
    }

    .app-leadbox{
      border:1px solid var(--line);
      border-radius:28px;
      background:linear-gradient(135deg, #fff7ed 0%, #ffffff 72%);
      padding:34px;
      box-shadow:var(--shadow);
      display:grid;
      grid-template-columns:1.15fr .85fr;
      gap:28px;
      align-items:center;
    }
    .app-leadbox__list{
      list-style:none;
      padding:0;
      margin:18px 0 0;
      display:grid;
      gap:10px;
    }
    .app-leadbox__list li{
      position:relative;
      padding-left:18px;
      color:var(--muted);
    }
    .app-leadbox__list li::before{
      content:"";
      position:absolute;
      left:0;
      top:10px;
      width:8px;
      height:8px;
      border-radius:999px;
      background:var(--primary);
    }
    .app-leadbox__cta{
      display:flex;
      flex-direction:column;
      gap:12px;
      align-items:flex-start;
      justify-content:center;
      padding:24px;
      border:1px solid #fed7aa;
      border-radius:24px;
      background:rgba(255,255,255,.9);
    }

    @media (max-width: 1100px){
      .app-hero__grid,
      .dc-overview,
      .app-leadbox{
        grid-template-columns:1fr;
      }
      .dc-scheme{
        grid-template-columns:repeat(2,1fr);
      }
      .dc-cases{
        grid-template-columns:1fr 1fr;
      }
    }

    @media (max-width: 760px){
        .app-hero {
        padding: 40px 0 28px;
    }
      .app-hero::before{
        background:
          linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,.96) 44%, rgba(255,255,255,.84) 70%, rgba(255,255,255,.72) 100%),
          url('/assets/img/cod.webp') center top / cover no-repeat;
      }
      .app-hero__grid{
        min-height:auto;
      }
      .app-hero__text{
        font-size:16px;
      }
      .dc-overview__metrics,
      .dc-scheme,
      .dc-cases{
        grid-template-columns:1fr;
      }
    }
    
    li.trust-item:hover {
    background: #dd8143;
    color: white;
}

li.trust-item:hover span {
    color: white;
}





.catalog-hero::before{
  background:
    linear-gradient(90deg, #ffffff 0%, #ffffff 42%, rgba(255,255,255,.94) 58%, rgba(255,255,255,.72) 68%, rgba(255,255,255,.18) 82%, rgba(255,255,255,0) 100%),
    url('/assets/img/1.webp') right center / cover no-repeat;
}

.catalog-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:28px;
  align-items:start;
}



.catalog-filter__box{
  padding:22px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
}

.catalog-filter__box h2{
  font-size:24px;
}

.catalog-filter__group{
  display:grid;
  gap:10px;
  margin-top:22px;
}

.catalog-filter__group strong{
  display:block;
  margin-bottom:4px;
}

.catalog-filter__group a{
  display:flex;
  align-items:center;
  min-height:42px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  color:var(--muted);
  font-weight:700;
  transition:.2s ease;
}

.catalog-filter__group a:hover,
.catalog-filter__group a.is-active{
  border-color:#fdba74;
  background:#fff7ed;
  color:var(--primary-dark);
}

.catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.catalog-card{
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.catalog-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(15,23,42,.12);
  border-color:#cbd5e1;
}

.catalog-card__media{
  height:260px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  border-bottom:1px solid var(--line);
  background:#fff;
}

.catalog-card__media img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}

.catalog-card__body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  padding:22px;
}

.catalog-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
    align-items: center;
    justify-content: space-between;
}

.catalog-card__tags span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 10px;
  border-radius:999px;
  background:#fff7ed;
  color:var(--primary-dark);
  font-size:13px;
  font-weight:700;
}

.catalog-card__body h3{
  margin-bottom:10px;
}

.catalog-card__body p {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: 14px;
}

.catalog-card__specs{
  list-style:none;
  padding:0;
  margin:0 0 18px;
  display:grid;
  gap:6px;
  color:var(--muted);
  font-size:14px;
}

.catalog-card__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:auto;
}

.catalog-card__actions .btn{
  min-height:42px;
  padding:0 16px;
  font-size:14px;
}

.catalog-empty{
  grid-column:1 / -1;
  padding:28px;
  border:1px dashed var(--line);
  border-radius:24px;
  background:#fff;
  text-align:center;
}

.product-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:40px;
  align-items:start;
}

.product-gallery {
    padding: 32px;
    border: 1px solid var(--line);
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--shadow);
    width: 600px;
}

.product-gallery img{
  width:100%;
  height:auto;
  object-fit:contain;
}

.product-info{
  padding:32px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow);
}

.product-info__lead {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.4;
}

.product-short-specs{
  list-style:none;
  padding:0;
  margin:24px 0;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}

.product-short-specs li {
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #f8fafc;
    font-size: 12px;
}

.product-short-specs strong,
.product-short-specs span{
  display:block;
}

.product-short-specs span{
  color:var(--muted);
}

.product-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.product-tabs{
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.product-tabs__nav{
  display:flex;
  flex-wrap:wrap;
  gap:0;
  border-bottom:1px solid var(--line);
  background:#f8fafc;
}

.product-tabs__nav button{
  min-height:56px;
  padding:0 22px;
  border:0;
  border-right:1px solid var(--line);
  background:transparent;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}

.product-tabs__nav button.is-active{
  background:#fff;
  color:var(--primary);
}

.product-tabs__panel{
  display:none;
  padding:28px;
}

.product-tabs__panel.is-active{
  display:block;
}

.product-spec-table{
  width:100%;
  border-collapse:collapse;
}

.product-spec-table th,
.product-spec-table td{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
}

.product-spec-table th{
  width:32%;
  color:var(--text);
}

.product-spec-table td{
  color:var(--muted);
}

.download-list{
  display:grid;
  gap:12px;
}

.download-list a{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:14px;
  color:var(--primary);
  font-weight:700;
}

.download-list a:hover{
  background:#fff7ed;
  border-color:#fdba74;
}

@media (max-width:1100px){
  .catalog-layout,
  .product-layout{
    grid-template-columns:1fr;
  }

  .catalog-filter{
    position:static;
  }

  .catalog-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:760px){
  .catalog-grid,
  .product-short-specs{
    grid-template-columns:1fr;
  }

  .catalog-card__actions .btn,
  .product-actions .btn{
    width:100%;
  }

  .product-tabs__nav{
    flex-direction:column;
  }

  .product-tabs__nav button{
    border-right:0;
    border-bottom:1px solid var(--line);
    text-align:left;
  }
}


/* ===============================
   CATALOG HEADER (НОРМАЛЬНЫЙ)
   =============================== */

.catalog-header{
  position: relative;
  overflow: hidden;
  padding: 40px 0 30px;
  background: #fff;
  isolation: isolate;
}

/* фон как у app-hero, но мягче */
.catalog-header::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      #ffffff 0%,
      #ffffff 45%,
      rgba(255,255,255,.92) 60%,
      rgba(255,255,255,.7) 72%,
      rgba(255,255,255,.2) 88%,
      rgba(255,255,255,0) 100%
    ),
    url('/assets/img/1.webp') right center / cover no-repeat;
  z-index:0;
}

.catalog-header::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(248,250,252,.2) 0%,
    rgba(248,250,252,0) 40%,
    rgba(248,250,252,.1) 100%
  );
  z-index:0;
}

.catalog-header .container{
  position: relative;
  z-index: 1;
}

/* breadcrumbs нормальные */
.catalog-header .breadcrumbs{
  position: static;
  margin-bottom: 14px;
}

/* контент */
.catalog-header__content{
  max-width: 720px;
}

.catalog-header h1{
  font-size: 36px;
  margin-bottom: 12px;
}

.catalog-header__text{
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
}

/* выравнивание по странице */
.catalog-header + .catalog-section{
  padding-top: 30px;
}

/* адаптив */
@media (max-width: 760px){

  .catalog-header{
    padding: 26px 0 20px;
  }

  .catalog-header::before{
    background:
      linear-gradient(
        180deg,
        #ffffff 0%,
        rgba(255,255,255,.95) 50%,
        rgba(255,255,255,.85) 100%
      ),
      url('/assets/img/1.webp') center top / cover no-repeat;
  }

  .catalog-header h1{
    font-size: 28px;
  }

  .catalog-header__text{
    font-size: 15px;
  }
}


.product-gallery__main {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 420px;
    max-height: 430px;
    position: relative;
    overflow: hidden;
}

.product-gallery__main img {
    max-width: 100%;
    max-height: 440px;
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.product-gallery__thumbs{
  display:flex;
  gap:10px;
  margin-top:18px;
  overflow-x:auto;
  padding-bottom:6px;
}

.product-gallery__thumb{
  width:84px;
  height:72px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  cursor:pointer;
}

.product-gallery__thumb.is-active{
  border-color:var(--primary);
  box-shadow:0 0 0 2px rgba(236,123,48,.18);
}

.product-gallery__thumb img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}

.product-spec-scroll{
  width:100%;
  overflow-x:auto;
}

.product-spec-scroll table{
  min-width:900px;
  width:100%;
  border-collapse:collapse;
}

.product-spec-scroll th,
.product-spec-scroll td,
.product-spec-scroll table td{
  padding:12px 14px;
  border:1px solid var(--line);
  text-align:left;
  vertical-align:middle;
}

.product-spec-scroll .spec_item_sec,
.product-spec-scroll tr.spec_item_head td{
  background:#0f172a;
  color:#fff;
  font-weight:700;
}

.product-spec-scroll .spec_item_menu{
  background:#f8fafc;
  font-weight:700;
}




.product-rating-summary__link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:7px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff7ed;
  color:var(--primary-dark);
  font-weight:700;
}

.product-rating-summary__link:hover{
  border-color:#fdba74;
  background:#ffedd5;
}

.product-rating-summary__stars {
    color: var(--primary) !important;
    letter-spacing: 2px;
    line-height: 1;
}

.product-reviews-wrap{
  display:grid;
  gap:24px;
}

.product-reviews-head h3{
  margin:0 0 6px;
}

.product-reviews-head p{
  margin:0;
  color:var(--muted);
}

.product-reviews{
  display:grid;
  gap:18px;
}

.product-review{
  padding:22px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow);
}

.product-review__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}

.product-review__head strong{
  display:block;
  font-size:18px;
  color:var(--text);
}

.product-review__head span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:14px;
}

.product-review__rating{
  flex:0 0 auto;
  color:var(--primary);
  font-size:18px;
  letter-spacing:2px;
  line-height:1;
}

.product-review p,
.product-reviews-empty{
  margin:0;
  color:var(--muted);
  line-height:1.75;
}

.product-review-form{
  display:grid;
  gap:16px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(135deg, #fff7ed 0%, #ffffff 72%);
  box-shadow:var(--shadow);
}

.product-review-form h3{
  margin:0;
}

.product-review-form__grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
}

.product-review-form label{
  display:grid;
  gap:8px;
  font-weight:700;
}

.product-review-form input,
.product-review-form select,
.product-review-form textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:14px;
  padding:14px 16px;
  font:inherit;
  color:var(--text);
  background:#fff;
}

.product-review-form input:focus,
.product-review-form select:focus,
.product-review-form textarea:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(236,123,48,.14);
}

@media (max-width:760px){
  .product-review__head,
  .product-review-form__grid{
    grid-template-columns:1fr;
  }

  .product-review__head{
    flex-direction:column;
  }

  .product-rating-summary__link{
    width:100%;
    justify-content:center;
  }
}

.product-review-form__captcha{
  display:inline-flex;
  width:max-content;
  padding:6px 12px;
  border-radius:999px;
  background:#fff7ed;
  color:var(--primary-dark);
  font-weight:700;
}

.product-rating-summary__box span {
    color: black;
    background: none;
}

.catalog-pagination{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:32px;
}

.catalog-pagination__link{
  min-width:42px;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--muted);
  font-weight:700;
  box-shadow:var(--shadow);
}

.catalog-pagination__link:hover,
.catalog-pagination__link.is-active{
  border-color:#fdba74;
  background:#fff7ed;
  color:var(--primary-dark);
}


.catalog-filter{
  position:relative;
  align-self:start;
}

.catalog-filter__box{
  position:relative;
}




.pagination {
  margin-top: 42px;
}

.pagination__list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.pagination__link {
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: #0f172a;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
  border: 1px solid rgba(15, 23, 42, .08);
}

.pagination__link:hover,
.pagination__link--current {
  background: #0f172a;
  color: #fff;
}

.article-content {
  font-size: 17px;
  line-height: 1.8;
}

.article-content h2,
.article-content h3,
.article-content h4 {
  margin-top: 32px;
  margin-bottom: 14px;
}

.article-content p {
  margin: 0 0 18px;
}

.article-content ul,
.article-content ol {
  margin: 0 0 22px;
  padding-left: 22px;
}

.article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 22px;
  margin: 24px 0;
}


.article-rating__stars button:disabled {
  cursor: default;
  opacity: .75;
}

.article-rating__stars button.is-active {
  color: #f59e0b;
  transform: scale(1.08);
}

.article-rating__message {
  font-weight: 700;
  color: #475569;
}

.article-rating__message.is-success {
  color: #16a34a;
}

.article-rating__message.is-error {
  color: #dc2626;
}



/* ===============================
   HEADER / MEGA MENU
   =============================== */

.site-header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}

.header-grid{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:22px;
  min-height:78px;
}

.header-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}

.logo{
  flex:0 0 auto;
}

.main-nav{
  justify-self:center;
  min-width:0;
}

.nav-list{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  margin:0;
  padding:0;
}

.nav-list > li{
  position:relative;
}

.nav-list > li > a,
.nav-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:78px;
  color:var(--muted);
  font-weight:700;
  font-size:15px;
  white-space:nowrap;
  transition:color .2s ease;
}

.nav-list > li > a:hover,
.nav-item:hover > .nav-link{
  color:var(--primary);
}

.nav-link--has-menu::after{
  content:"";
  width:7px;
  height:7px;
  margin-top:-3px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  transition:transform .2s ease;
}

.nav-item:hover .nav-link--has-menu::after{
  transform:rotate(-135deg);
  margin-top:4px;
}

.mega-menu {
    position: fixed;
    left: 50%;
    top: 78px;
    width: min(1100px, calc(100vw - 32px));
    transform: translateX(-50%) translateY(10px);
    padding-top: 12px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index: 90;
}

.nav-item:hover > .mega-menu,
.nav-item.is-open > .mega-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

.mega-menu__grid {
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 24px 80px rgba(15, 23, 42, .16);
}

.mega-menu__grid--3{
  grid-template-columns:repeat(3, 1fr);
}

.mega-menu__grid--1{
  grid-template-columns:1fr;
}

.mega-menu--service,
.mega-menu--company{
  width:min(360px, calc(100vw - 32px));
}


.mega-menu--catalog{
  width:min(360px, calc(100vw - 32px));
  left: 30%;
}

.mega-menu--service .mega-menu__grid,
.mega-menu--company .mega-menu__grid{
  padding:14px;
}

.mega-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 18px;
    background: #fff;
    transition: .2s ease;
}

.mega-col:hover{
  border-color:#fed7aa;
  background:#fff7ed;
}

.mega-col a {
    display: flex;
    align-items: center;
    min-height: 20px;
    padding: 3px 8px;
    border-radius: 12px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    transition: .2s ease;
}

.mega-col a:hover{
  background:#fff;
  color:var(--primary-dark);
  transform:translateX(3px);
}

.mega-col .mega-title {
    min-height: 30px;
    margin-bottom: 6px;
    padding: 6px 10px;
    background: linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.mega-col .mega-title:hover {
    color: #df8846;
    transform: none;
}

.header-contacts{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  font-weight:700;
  white-space:nowrap;
}

.header-phone{
  color:var(--text);
  transition:color .2s ease;
}

.header-phone:hover{
  color:var(--primary);
}

.header-kp__icon{
  display:none;
  font-size:19px;
  line-height:1;
}

.nav-toggle{
  display:none;
}

/* ===============================
   ADAPTIVE HEADER
   =============================== */

@media (max-width: 1200px){
  .header-grid{
    gap:14px;
  }

  .nav-list{
    gap:14px;
  }

  .nav-list > li > a,
  .nav-link{
    font-size:14px;
  }

  .header-phone{
    font-size:14px;
  }

  .header-kp{
    padding:0 16px;
  }
}

@media (max-width: 1080px){
  .city-trigger__value{
    font-size:12px;
    padding:3px 7px;
  }
  }
@media (max-width: 980px){
  .header-kp{
    width:48px;
    min-width:48px;
    height:48px;
    padding:0;
  }

  .header-kp__text{
    display:none;
  }

  .header-kp__icon{
    display:inline-flex;
  }

  .city-trigger{
    min-height:40px;
    padding:0 12px;
    gap:6px;
  }

  .city-trigger__label{
    font-size:13px;
  }


}

/* Бургер строго от 750px */
@media (max-width: 750px){
  .site-header{
    position:sticky;
  }



  .header-brand{
    grid-column:auto;
    gap:8px;
  }

  .logo img{
    width:96px;
    height:auto;
  }

  .main-nav{
    order:4;
    
  }

 
  .nav-toggle span{
    width:20px;
    height:2px;
    border-radius:99px;
    background:var(--text);
    transition:.2s ease;
  }

  .nav-toggle.is-active span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }

  .nav-toggle.is-active span:nth-child(2){
    opacity:0;
  }

  .nav-toggle.is-active span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }

  .nav-list{
    display:none;
    position:fixed;
    left:0;
    right:0;
    top:66px;
    bottom:0;
    width:100%;
    height:calc(100vh - 66px);
    overflow:auto;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:14px 16px 28px;
    margin:0;
    border-top:1px solid var(--line);
    background:#fff;
    box-shadow:0 18px 44px rgba(15,23,42,.12);
    z-index:90;
  }

  .nav-list.is-open{
    display:flex;
  }

  .nav-list > li{
    width:100%;
    border-bottom:1px solid var(--line);
  }

  .nav-list > li > a,
  .nav-link{
    width:100%;
    min-height:50px;
    justify-content:space-between;
    font-size:16px;
    color:var(--text);
  }

  .nav-link--has-menu::after{
    width:8px;
    height:8px;
  }

  .nav-item.is-open .nav-link--has-menu::after{
    transform:rotate(-135deg);
    margin-top:4px;
  }

  .mega-menu{
    position:static;
    width:100%;
    padding:0 0 14px;
    transform:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    display:none;
  }

  .nav-item.is-open > .mega-menu{
    display:block;
    transform:none;
  }

  .nav-item:hover > .mega-menu{
    transform:none;
  }

  .mega-menu__grid,
  .mega-menu__grid--3,
  .mega-menu__grid--1{
    grid-template-columns:1fr;
    gap:10px;
    padding:10px;
    border-radius:18px;
    box-shadow:none;
    background:#f8fafc;
  }

  .mega-col{
    padding:10px;
    border-color:var(--line);
    background:#fff;
  }

  .mega-col:hover{
    background:#fff;
  }

  .mega-col a{
    min-height:38px;
    font-size:14px;
  }

  .mega-col a:hover{
    transform:none;
  }

  .mega-col .mega-title{
    min-height:40px;
    font-size:14px;
  }




  .header-kp{
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
  }

  .city-trigger{
    max-width:142px;
    min-height:38px;
    padding:0 8px;
    border-radius:999px;
  }

  .city-trigger__label{
    display:none;
  }

  .city-trigger__value{
    max-width:105px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
    padding:2px 6px;
  }
}

@media (max-width: 420px){
  .header-grid{
    gap:7px;
  }

  .logo img{
    width:86px;
  }

  .city-trigger{
    max-width:118px;
  }

  .city-trigger__value{
    max-width:86px;
  }


}


/* ===============================
   PHONE BUTTON
   =============================== */

.header-phone{
  display:inline-flex;
  align-items:center;
  gap:10px;

  height:48px;
  padding:0 18px;

  border:1px solid var(--line);
  border-radius:999px;

  background:#fff;
  color:var(--text);

  font-weight:700;

  transition:.2s ease;
}

.header-phone:hover{
  border-color:#fdba74;
  background:#fff7ed;
  color:var(--primary);
  transform:translateY(-2px);
}

.header-phone svg{
  width:18px;
  height:18px;
  flex:0 0 auto;
}

/* мобилка */
@media (max-width: 750px){

  .header-phone{
    width:44px;
    min-width:44px;
    height:44px;

    padding:0;
    justify-content:center;
  }

  .header-phone span{
    display:none;
  }

  .header-phone svg{
    width:18px;
    height:18px;
  }
}

.header-phone{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:48px;
  color:var(--text);
  font-weight:700;
  white-space:nowrap;
}

.header-phone__icon{
  display:none;
}


@media (max-width: 1080px){
 .header-phone{
    width:44px;
    min-width:44px;
    height:44px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
  }

  .header-phone__text{
    display:none;
  }

  .header-phone__icon{
    display:block;
    width:18px;
    height:18px;
  }

}


/* бургер появляется с 900px */
@media (max-width: 900px){

  .header-grid{
   
    gap:10px;
    min-height:66px;
  }

  .header-brand{
    flex-wrap:nowrap;
    min-width:0;
  }

  .city-trigger{
    max-width:150px;
    min-height:40px;
    padding:0 10px;
    white-space:nowrap;
  }

  .city-trigger__label{
    display:none;
  }

  .city-trigger__value{
    max-width:105px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
  }

  .main-nav{
    order:5;
  
  }

  .nav-toggle{
    display:inline-flex;
    position:static;
    width:44px;
    height:44px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    padding:0;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    cursor:pointer;
  }

  .nav-toggle span{
    width:20px;
    height:2px;
    border-radius:99px;
    background:var(--text);
    transition:.2s ease;
  }

  .nav-toggle.is-active span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }

  .nav-toggle.is-active span:nth-child(2){
    opacity:0;
  }

  .nav-toggle.is-active span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }

  .nav-list{
    display:none;
    position:fixed;
    left:0;
    right:0;
    top:66px;
    bottom:0;
    width:100%;
    height:calc(100vh - 66px);
    overflow:auto;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:14px 16px 28px;
    margin:0;
    border-top:1px solid var(--line);
    background:#fff;
    box-shadow:0 18px 44px rgba(15,23,42,.12);
    z-index:90;
  }

  .nav-list.is-open{
    display:flex;
  }

  .nav-list > li{
    width:100%;
    border-bottom:1px solid var(--line);
  }

  .nav-list > li > a,
  .nav-link{
    width:100%;
    min-height:50px;
    justify-content:space-between;
    font-size:16px;
    color:var(--text);
  }

  .mega-menu{
    position:static;
    width:100%;
    padding:0 0 14px;
    transform:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    display:none;
  }

  .nav-item.is-open > .mega-menu{
    display:block;
  }

  .mega-menu__grid,
  .mega-menu__grid--3,
  .mega-menu__grid--1{
    grid-template-columns:1fr;
    gap:10px;
    padding:10px;
    border-radius:18px;
    box-shadow:none;
    background:#f8fafc;
  }

  .header-contacts{
    justify-self:end;
    display:flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
  }

 
  .header-kp{
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
    padding:0;
  }

  .header-kp__text{
    display:none;
  }

  .header-kp__icon{
    display:inline-flex;
  }
}

/* на 750 и ниже всё остается в одну линию */
@media (max-width: 750px){

 

  .logo img{
    width:92px;
    height:auto;
  }

  .city-trigger{
    max-width:125px;
  }

  .city-trigger__value{
    max-width:88px;
  }

  .header-phone,
  .header-kp,
  .nav-toggle{
    width:42px;
    min-width:42px;
    height:42px;
    min-height:42px;
  }
}
@media (max-width: 600px){

nav.breadcrumbs {
    position: relative;
}
    .app-hero {
        padding: 12px 0 28px;
    }
}

@media (max-width: 420px){

  .logo img{
    width:82px;
  }

  .city-trigger{
    max-width:108px;
    padding:0 7px;
  }

  .city-trigger__value{
    max-width:76px;
  }

  .header-grid{
    gap:6px;
  }
}


/* ===============================
   FOOTER
   =============================== */

.site-footer{
  padding:54px 0 26px;
  background:
    radial-gradient(circle at 15% 0%, rgba(236,123,48,.18), transparent 32%),
    linear-gradient(180deg, #111827 0%, #0f172a 100%);
  color:#fff;
}

.footer-wrap{
  display:grid;
  gap:34px;
}

.footer-main{
  display:grid;
  grid-template-columns:260px minmax(0, 1fr) auto;
  align-items:center;
  gap:28px;
  padding-bottom:30px;
  border-bottom:1px solid rgba(255,255,255,.12);
}

.footer-logo{
  display:inline-flex;
  align-items:center;
  width:max-content;
}

.footer-logo img{
  width:120px;
  height:auto;
 
}

.footer-main p{
  max-width:620px;
  margin:0;
  color:rgba(255,255,255,.72);
  line-height:1.75;
}

.footer-contacts{
  display:flex;
  flex-direction:column;
  gap:7px;
  font-weight:700;
  text-align:right;
}

.footer-contacts a,
.footer-contacts span{
  color:rgba(255,255,255,.86);
}

.footer-contacts a:hover{
  color:#fff;
}

.footer-nav{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:26px 22px;
}

.footer-col{
  min-width:0;
}

.footer-title{
  position:relative;
  margin:0 0 14px;
  padding-bottom:10px;
  color:#fff;
  font-size:17px;
  line-height:1.25;
}

.footer-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:34px;
  height:3px;
  border-radius:99px;
  background:linear-gradient(135deg, #ea5a29 0%, #f1a53c 100%);
}

.site-footer ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:8px;
}

.site-footer li{
  margin:0;
}

.site-footer a{
  color:rgba(255,255,255,.72);
  font-size:14px;
  line-height:1.35;
  transition:.2s ease;
}

.site-footer a:hover{
  color:#fff;
}

.footer-col a{
  display:inline-flex;
  max-width:100%;
}

.footer-col a:hover{
  transform:translateX(3px);
}

.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.62);
  font-size:14px;
}

.footer-bottom a{
  color:rgba(255,255,255,.72);
}

.footer-bottom a:hover{
  color:#fff;
}

/* ===============================
   FOOTER ADAPTIVE
   =============================== */

@media (max-width: 1200px){
  .footer-nav{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }

  .footer-main{
    grid-template-columns:220px minmax(0, 1fr) auto;
  }
}

@media (max-width: 980px){
  .footer-main{
    grid-template-columns:1fr;
    align-items:start;
    gap:18px;
  }

  .footer-contacts{
    text-align:left;
  }

  .footer-nav{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px){
  .site-footer{
    padding:42px 0 22px;
  }

  .footer-nav{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px 18px;
  }

  .footer-main{
    padding-bottom:24px;
  }

  .footer-main p{
    font-size:15px;
  }

  .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 460px){
  .footer-nav{
    grid-template-columns:1fr;
  }

  .footer-col{
    padding-bottom:18px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  .footer-col:last-child{
    padding-bottom:0;
    border-bottom:0;
  }

  .footer-title{
    margin-bottom:10px;
  }
}

/* ===============================
   CATALOG FILTER ADAPTIVE DROPDOWN
   =============================== */

.catalog-filter-dd__btn{
  display:none;
}

.catalog-filter-dd__menu{
  display:grid;
  gap:10px;
}

/* от 1100px фильтр становится строкой */
@media (max-width: 1100px){
    
    .product-gallery {
    width: 100%;
}

  .catalog-layout{
    grid-template-columns:1fr;
  }

  .catalog-filter{
    position:relative;
    z-index:20;
  }

  .catalog-filter__box{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    padding:14px;
    border-radius:22px;
  }

  .catalog-filter__box h2{
    display:none;
  }

  .catalog-filter__group{
    position:relative;
    margin:0;
    display:block;
  }

  .catalog-filter__group strong{
    display:none;
  }

  .catalog-filter-dd__btn{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 14px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    color:var(--text);
    font:inherit;
    font-weight:700;
    text-align:left;
    cursor:pointer;
  }

  .catalog-filter-dd__btn span{
    min-width:0;
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .catalog-filter-dd__btn b{
    color:var(--primary);
    font-weight:800;
  }

  .catalog-filter-dd__btn::after{
    content:"";
    width:9px;
    height:9px;
    flex:0 0 auto;
    border-right:2px solid var(--primary);
    border-bottom:2px solid var(--primary);
    transform:rotate(45deg) translateY(-2px);
    transition:.2s ease;
  }

  .catalog-filter-dd.is-open .catalog-filter-dd__btn::after{
    transform:rotate(-135deg) translateY(-1px);
  }

  .catalog-filter-dd__menu{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    right:0;
    z-index:30;
    display:none;
    max-height:320px;
    overflow:auto;
    padding:10px;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
    box-shadow:0 18px 50px rgba(15,23,42,.16);
  }

  .catalog-filter-dd.is-open .catalog-filter-dd__menu{
    display:grid;
  }

  .catalog-filter__group a{
    min-height:40px;
    padding:8px 12px;
    border-radius:13px;
    font-size:14px;
  }
}

@media (max-width: 560px){

  .catalog-filter__box{
    grid-template-columns:1fr;
  }

  .catalog-filter-dd__menu{
    max-height:280px;
  }
}

.pdf-card__title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}

.pdf-card__title img {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  margin-top: 2px;
}

.pdf-card__title h3 {
  margin: 0;
}


/* ===== Product page mobile fixes ===== */

.product-layout,
.product-gallery,
.product-info,
.product-tabs,
.product-tabs__panel,
.product-spec-scroll,
.lead-unified__box {
  min-width: 0;
}

.product-gallery {
  width: 100%;
  max-width: 100%;
}

.product-gallery__main {
  min-height: 0;
  height: auto;
  max-height: none;
}

.product-gallery__main img {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: contain;
}

.product-gallery__thumbs {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

.product-info h1 {
  overflow-wrap: anywhere;
}

.catalog-card__tags {
  min-width: 0;
}

.catalog-card__tags > div {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.product-tabs__nav {
  max-width: 100%;
}

.product-tabs__nav button {
  min-width: 0;
  white-space: normal;
}

.product-spec-scroll {
  max-width: 100%;
  overflow-x: auto;
}

@media (max-width: 760px) {
  .product-page {
    padding-top: 28px;
  }

  .product-layout {
    gap: 20px;
  }

  .product-gallery,
  .product-info,
  .product-tabs__panel {
    padding: 18px;
    border-radius: 22px;
  }

  .product-gallery__main img {
    max-height: 420px;
  }

  .product-gallery__thumb {
    width: 72px;
    height: 62px;
  }

  .product-info h1 {
    font-size: 28px;
  }

  .product-short-specs {
    grid-template-columns: 1fr;
  }

  .product-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .product-actions .btn {
    width: 100%;
  }
}

@media (max-width: 420px) {
  .product-gallery,
  .product-info,
  .product-tabs__panel {
    padding: 14px;
  }

  .product-gallery__main img {
    max-height: 360px;
  }
}

picture {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
a.dc-case picture {
    height: 210px;
}


.telephon_mob {
    position: fixed;
    bottom: 120px;
    right: 10px;
    width: 50px;
    height: 50px;
    z-index: 99999;
    border-radius: 50%;
    border: 4px #1e4b93 solid;
    display: block;
    transition: .3s 
ease-in-out;
    background: #fff;
}
.telephon_mob {
    padding: 3px;
}
.hs-text-floating-bar2 {
    opacity: 0;
    visibility: hidden;
    transition: visibility .1s, opacity .3s;
    color: #212121;
    -webkit-text-fill-color: #212121;
    background: #fff;
    max-width: 380px;
    margin-left: 15px;
    border-radius: 5px;
    padding: 10px 15px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
    will-change: transform;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    color: var(--hs-color-text);
    -webkit-text-fill-color: var(--hs-color-text);
    font-size: 14px;
    text-align: left;
    font-weight: 700;
    position: fixed;
    transition: all .3s;
    bottom: 120px;
    z-index: 99;
    right: 73px;
}
.telephon_mob.kalk222 {
    bottom: 230px;
}
.telephon_mob a {
    margin-left: 0 !important;
}
.hs-text-floating-bar3 {
    opacity: 0;
    visibility: hidden;
    transition: visibility .1s, opacity .3s;
    color: #212121;
    -webkit-text-fill-color: #212121;
    background: #fff;
    max-width: 380px;
    margin-left: 15px;
    border-radius: 5px;
    padding: 10px 15px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
    will-change: transform;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    color: var(--hs-color-text);
    -webkit-text-fill-color: var(--hs-color-text);
    font-size: 14px;
    text-align: left;
    font-weight: 700;
    position: fixed;
    transition: all .3s;
    bottom: 230px;
    z-index: 99;
    right: 73px;
}
.telephon_mob.kalk333 {
    bottom: 175px;
    border: 4px #1e9353 solid;
}
.hs-text-floating-bar {
    opacity: 0;
    visibility: hidden;
    transition: visibility .1s, opacity .3s;
    color: #212121;
    -webkit-text-fill-color: #212121;
    background: #fff;
    max-width: 380px;
    margin-left: 15px;
    border-radius: 5px;
    padding: 10px 15px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
    will-change: transform;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    color: var(--hs-color-text);
    -webkit-text-fill-color: var(--hs-color-text);
    font-size: 14px;
    text-align: left;
    font-weight: 700;
    position: fixed;
    transition: all .3s;
    bottom: 175px;
    z-index: 99;
    right: 73px;
}

.telephon_mob:hover~.hs-text-floating-bar2 {
    opacity: 1;
    visibility: visible;
}

.telephon_mob.kalk222:hover~.hs-text-floating-bar3 {
    opacity: 1;
    visibility: visible;
}

.telephon_mob.kalk333:hover~.hs-text-floating-bar {
    opacity: 1;
    visibility: visible;
}
.telephon_mob img {
    height: auto;
    max-width: 100%;
}