@charset "utf-8";
/* =====================================================
   other-main3.css v1.3
   Прочие страницы — классы контента
   Переменные: из other-base.css (:root + [data-theme])
   ===================================================== */


/* ═══════════════════════════════════════════
   MAIN-BLOCK
   ═══════════════════════════════════════════ */

.main-block {
   grid-column: 2;
   margin-top: 10px;
   border-radius: 10px;
   border: 1px solid var(--border);
   background: var(--bg-alt);
   padding: 10px;
}

.main-block__heat {
   text-align: center;
   margin: 0;
   padding-top: 20px;
   padding-bottom: 10px;
   font-size: 24px;
   border-radius: 10px;
   line-height: 1.5;
   color: var(--accent-deep);
}


/* ═══════════════════════════════════════════
   ЭЛЕМЕНТЫ КОНТЕНТА
   ═══════════════════════════════════════════ */

.nachrichtenelement0 {
    max-width: 1200px;
    margin-bottom: 20px;
    margin-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.main-block__komm_t {
    padding: 0;
    margin: 0;
    text-align: center;
    color: var(--green);
    font-size: 14px;
    font-weight: bold;
    line-height: 1.3;
    margin-top: 40px;
    margin-bottom: 40px;
}

.main-block__komm {
    margin-bottom: 30px;
}

.main-block__komm_button {
    display: grid;
    text-align: center;
    padding-bottom: 10px;
    padding-top: 5px;
    border: 1px solid var(--green);
    border-radius: 50px;
    margin-bottom: 20px;
    background: var(--green-light);
    cursor: pointer;
    position: relative;
    color: var(--text);
}

.main-block__komm_button::before,
.main-block__komm_button::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--green);
  border-right: 2px solid var(--green);
  transform: rotate(135deg);
  position: absolute;
  top: 50%;
  transform-origin: center;
  margin-top: -7px;
  margin-left: 7px;
  margin-right: 7px;
}

.main-block__komm_button::before { left: 10px; }
.main-block__komm_button::after  { right: 10px; }


.main-block__komm_t1_spisok {
    font-size: 16px;
    list-style-type: decimal;
    padding: 30px;
    padding-top: 0;
    display: grid;
    gap: 25px;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    overflow: hidden;
    height: 15px;
    position: relative;
    transition: height 0.5s ease;
    color: var(--text);
}

.main-block__komm_t1_spisok::before {
  content: "";
  display: block;
  width: 100%;
  height: 30px;
  background: linear-gradient(to top, var(--bg-alt) 0%, transparent 100%);
  position: absolute;
  bottom: 0;
  left: 0;
}

#wrapTrigger { display: none; }
input:checked + .main-block__komm_t1_spisok { height: 400px; }
input:checked ~ .main-block__komm_button::before,
input:checked ~ .main-block__komm_button::after {
  transform: rotate(-45deg);
}

.main-block__komm_t1_b {
    font-weight: bold;
    padding: 0 0 6px;
    display: block;
    color: var(--text);
}


/* ═══════════════════════════════════════════
   ВАЖНАЯ ИНФОРМАЦИЯ
   ═══════════════════════════════════════════ */

.vajnaya_info {
    background: var(--bg-card);
    padding: 20px;
    margin: 20px;
    border: 1px solid var(--border);
}

.vajnaya_info_h {
    color: var(--red);
    font-weight: bold;
    letter-spacing: 2px;
    width: 50%;
}

.vajnaya_info_t {
    color: var(--text-sec);
}


/* ═══════════════════════════════════════════
   ОБЪЯВЛЕНИЯ
   ═══════════════════════════════════════════ */

.obyavlenie {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   background: var(--bg-card);
   font-size: 18px;
   color: var(--text);
}

.obyavlenie_1 {
    display: flex;
    background: var(--bg-alt);
    border: solid 1px var(--border);
    padding: 10px;
    margin: 20px;
}

.obyavlenie_1_kart {
    object-fit: contain;
    display: flex;
    justify-self: center;
}

.obyavlenie_1_1 {
    padding: 20px;
    max-width: 600px;
}

.obyavlenie__head { text-align: left; color: var(--text); }
.obyavlenie_1_txt { text-align: left; color: var(--text); }
.obyavlenie_1_spisok { font-weight: bold; color: var(--text); }

.obyavlenie__work-schedule-date_output { color: var(--red); }
.obyavlenie__work-schedule-link { color: var(--red); }

.obyavlenie-big {
   grid-template-areas:
      "h f2 f"
      "t t f"
      "k k f"
      "l l l";
   display: grid;
   align-items: center;
   justify-items: center;
   grid-template-columns: 1fr 1fr;
   background: var(--bg-card);
   padding: 20px;
   font-size: 22px;
   text-align: center;
   gap: 10px;
   border: 1px solid var(--border);
   color: var(--text);
}

.obyavlenie-big__head {
   grid-area: h;
   margin: 0;
   font-size: 20px;
   text-align: center;
   color: var(--red);
}

.obyavlenie-big__text {
   grid-area: t;
   margin: 0;
   color: var(--accent-deep);
}

.obyavlenie-big__komm {
   grid-area: k;
   margin: 0;
   color: var(--accent);
}

.obyavlenie-big__link {
   grid-area: l;
   margin: 0;
   font-size: 18px;
   background: var(--green);
   color: #fff;
   height: 100%;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 15px;
}

.obyavlenie-big-foto {
   grid-area: f;
   border-radius: 15px;
   border: 1px solid var(--border);
}


/* ═══════════════════════════════════════════
   КАТАЛОГ ТОВАРОВ (разделы главной)
   ═══════════════════════════════════════════ */

.cash-register__list {
   display: flex;
   margin: 0;
   padding: 0;
   list-style-type: none;
   justify-content: space-around;
   padding-top: 10px;
   padding-bottom: 10px;
   flex-wrap: wrap;
}

.cash-register {
   background: transparent;
}

.cash-register__head {
   margin: 0;
   text-align: center;
   background: var(--bg-card);
   padding: 10px;
   color: var(--text);
}

.cash-register__link_h {
    color: var(--accent);
}

.cash-register__products {
   text-align: center;
   width: auto;
}

.cash-register__foto {
   margin: 0;
   width: 150px;
   grid-area: f;
   height: 150px;
   border-radius: 25px;
   border: 5px solid var(--bg-alt);
   width: 100%;
   object-fit: contain;
   background: var(--bg-card);
   transition: border .3s;
}

.cash-register__foto:hover {
   border-color: var(--green);
}

[data-theme="dark"] .cash-register__foto {
   filter: brightness(0.92);
}

.cash-register__foto_rectangle {
    border-radius: 10px;
    width: auto;
}

.cash-register__figure {
    display: grid;
    grid: "k" "f";
    align-items: center;
    justify-items: center;
    margin: 0;
    width: 100%;
}

.cash-register__figure_rectangle {
    max-width: none;
}

.cash-register__link {
  text-decoration: none;
}

.cash-register__komm {
  padding: 3px;
  color: var(--accent);
  display: flex;
  align-items: center;
  margin-top: 10px;
}

.cash-registers_head {
  text-align: center;
  margin: 0;
  padding: 15px;
  font-size: 14px;
  color: var(--text);
}


/* ═══════════════════════════════════════════
   СЕРТИФИКАТЫ (старый стиль)
   ═══════════════════════════════════════════ */

.certificates {
  padding-bottom: 40px;
  grid-column: 1/4;
  grid-template-columns: 250px 1fr minmax(100px, 250px);
  display: grid;
  background: var(--bg-alt);
  border-radius: 10px;
  margin-top: 20px;
}

.certificates__title {
  margin: 0;
  padding: 30px;
  text-align: center;
  background: var(--accent);
  color: #fff;
  font-size: 18px;
  grid-column: 1/4;
  border-radius: 10px;
}

.certificates__list {
  padding: 0;
  margin: 0;
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  grid-column: inherit;
  padding-top: 25px;
}

.certificates__view {
  width: auto;
  border: solid 1px var(--border);
  box-shadow: var(--shadow-s);
  transition: transform .3s;
  border-radius: 10px;
}

.certificates__view:hover {
  transform: scale(1.1);
}

.certificates__certificate {
  cursor: pointer;
  display: flex;
  object-fit: contain;
  align-items: center;
  justify-content: center;
  margin: 10px;
  border-radius: 10px;
}

.modal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.7);
  z-index: 15000000000;
}

.modal__content-foto {
    max-width: 1000px;
    width: 100%;
    border-radius: 10px;
}


/* ═══════════════════════════════════════════
   СЕРТИФИКАТЫ ПАРТНЁРОВ (новый стиль)
   ═══════════════════════════════════════════ */

.kompaniya__sertifikaty {
    margin-bottom: 2rem;
}

.kompaniya__sertifikaty-zagolovok {
    text-align: center;
    font-size: 1.8rem;
    color: var(--accent-deep);
    margin-bottom: 1.5rem;
}

.kompaniya__sertifikaty-spisok {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.kompaniya__sertifikaty-element {
    text-align: center;
    list-style-type: none;
}

.kompaniya__sertifikaty-izobrazhenie {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: var(--shadow-s);
}

[data-theme="dark"] .kompaniya__sertifikaty-izobrazhenie {
    filter: brightness(0.85);
}

.kompaniya__modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.8);
}

.kompaniya__modal-soderzhimoe {
    background-color: var(--bg-card);
    margin: 15% auto;
    padding: 20px;
    border-radius: 12px;
    max-width: 800px;
    position: relative;
    height: fit-content;
}

.kompaniya__modal-zakryt {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 2rem;
    cursor: pointer;
    color: var(--text);
}

.kompaniya__modal-izobrazhenie {
    max-width: 100%;
    height: auto;
}


/* ═══════════════════════════════════════════
   BENEFITS SECTION
   ═══════════════════════════════════════════ */

.benefits-section {
    max-width: 900px;
    margin: 30px auto;
    padding: 20px;
    background: var(--bg-card);
    border-radius: 12px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}

.benefits-title {
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    margin: 20px 0;
    background: linear-gradient(90deg, #00762b, #27a85e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

[data-theme="dark"] .benefits-title {
    background: linear-gradient(90deg, #4ade80, #86efac);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.benefits-intro,
.benefits-final {
    font-size: 16px;
    line-height: 1.5;
    color: var(--text-sec);
    margin-bottom: 20px;
    text-align: center;
}

.benefits-toggle { display: none; }

.benefits-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
    max-height: 0;
    overflow: hidden;
    padding: 0;
    margin: 0 0 20px;
    transition: max-height .45s ease;
    list-style: none;
}

.benefits-list li {
    background: var(--bg-alt);
    backdrop-filter: blur(6px);
    padding: 18px 20px;
    border-radius: 14px;
    border: 1px solid var(--border-light);
    font-size: 16px;
    line-height: 1.45;
    transition: 0.25s ease;
    color: var(--text);
    position: relative;
    list-style-type: none;
}

.benefits-list li span {
    font-weight: 700;
    color: var(--text-sec);
    padding-left: 28px;
}

.benefits-list li::before {
    content: "✔";
    color: var(--green);
    position: absolute;
    left: 8px;
    top: 10px;
    font-size: 25px;
    line-height: 1;
}

.benefits-toggle:checked + .benefits-list { max-height: 1200px; }

.benefits-button {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kn-preimush);
    color: white;
    padding: 13px 32px;
    border-radius: 40px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    width: fit-content;
    margin: 0 auto 20px;
    gap: 10px;
    transition: .25s;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border: 0;
}

.benefits-button:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}

.benefits-button::after {
    content: "";
    width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    display: inline-block;
    margin-left: 6px;
    transition: transform .3s ease;
}

.benefits-toggle:checked ~ .benefits-button::after {
    transform: rotate(-135deg);
}


/* ═══════════════════════════════════════════
   SITE LAYOUT (главная)
   ═══════════════════════════════════════════ */

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

.site {
    max-width: 1200px;
    margin: 24px auto;
    padding: 16px;
    color: var(--text);
}

header.page-header { margin-bottom: 18px; }

.page-header h1 {
    font-size: 1.6rem;
    margin: 0 0 8px;
    color: var(--accent-deep);
    text-align: center;
}

.hero-subtitle {
    margin: 0;
    color: var(--text-sec);
}


/* ═══════════════════════════════════════════
   PRIORITY CATALOG (карточки-приоритеты)
   ═══════════════════════════════════════════ */

.priority {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    margin-bottom: 28px;
}

.card {
    background: var(--bg-card);
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    transition: transform .25s, box-shadow .25s;
}

.card a { display: block; color: inherit; }

.card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(0,0,0,0.15);
}

.card__img {
    width: 100%;
    height: 220px;
    object-fit: contain;
    background: var(--bg-alt);
    padding: 18px;
    display: block;
}

[data-theme="dark"] .card__img {
    filter: brightness(0.9);
}

.card__body { padding: 14px; }

.card__title {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--accent-deep);
}

.card__descr {
    margin: 0;
    color: var(--text-sec);
    font-size: .98rem;
}


/* ═══════════════════════════════════════════
   DETAILED CATALOG (разделы каталога)
   ═══════════════════════════════════════════ */

.cash-registers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    margin-bottom: 30px;
}

.site .cash-register {
    background: var(--bg-card);
    border-radius: 12px;
    padding: 14px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-s);
}

.site .cash-register__head {
    font-size: 1rem;
    margin: 0 0 12px;
    color: var(--accent-deep);
    background: transparent;
    padding: 0;
}

.site .cash-register__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}

.site .cash-register__figure {
    background: var(--bg-alt);
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid var(--border-light);
    transition: transform .2s, box-shadow .2s;
}

.site .cash-register__figure:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow);
}

.site .cash-register__foto {
    width: 100%;
    height: 110px;
    object-fit: contain;
    display: block;
    margin: 0 auto 8px;
    background: var(--bg-card);
    padding: 6px;
    border-radius: 8px;
    border: none;
}

.site .cash-register__komm {
    font-weight: 600;
    color: var(--text);
    font-size: .80rem;
    padding: 0;
    margin: 0;
}


/* ═══════════════════════════════════════════
   FAQ
   ═══════════════════════════════════════════ */

.faq-section {
    margin-top: 60px;
    padding: 40px 30px;
    background: var(--bg-alt);
    border-radius: 18px;
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
    animation: fadeIn 0.6s ease forwards;
}

.faq-section .tile-title {
    display: inline-block;
    background: var(--accent-light);
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--border);
    margin-bottom: 25px;
    color: var(--text);
}

.faq-item {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 22px 26px;
    margin-bottom: 20px;
    background: var(--bg-card);
    transition: all 0.25s ease;
    cursor: pointer;
}

.faq-item:hover {
    box-shadow: var(--shadow);
}

.faq-item > h3 {
    font-size: 1.25rem;
    margin: 0;
    font-weight: 600;
    position: relative;
    padding-right: 30px;
    color: var(--accent-deep);
}

.faq-item > h3::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 12px;
    height: 12px;
    border-right: 2px solid var(--text-muted);
    border-bottom: 2px solid var(--text-muted);
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.3s ease;
}

.faq-item.open > h3::after {
    transform: translateY(-50%) rotate(225deg);
}

.faq-item > div {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, opacity 0.25s ease;
    opacity: 0;
}

.faq-item.open > div {
    max-height: 2000px;
    opacity: 1;
    margin-top: 16px;
}

.faq-item p {
    margin-bottom: 12px;
    line-height: 1.6;
    color: var(--text-sec);
}


/* ═══════════════════════════════════════════
   HELPERS
   ═══════════════════════════════════════════ */

.muted {
    color: var(--text-muted);
    font-size: .95rem;
}

.tile-title {
    display: inline-block;
    background: var(--accent-light);
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--border);
    margin-bottom: 12px;
    color: var(--text);
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(15px); }
    to   { opacity: 1; transform: translateY(0); }
}


/* ═══════════════════════════════════════════
   АДАПТИВ
   ═══════════════════════════════════════════ */

@media screen and (max-width: 830px) {
   .obyavlenie-big {
      grid-template-areas: "h" "t" "k" "f" "f2" "l";
      grid-template-columns: auto;
   }
   .main-block__komm_t1_spisok {
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
      padding: 5px;
      font-size: 0.8rem;
   }
}

@media screen and (max-width: 640px) {
    .card__img { height: 160px; }
    .priority { grid-template-columns: 1fr; }
    .site .cash-register__list {
        display: flex;
        gap: 12px;
        overflow-x: auto;
        padding-bottom: 8px;
    }
    .site .cash-register__list::-webkit-scrollbar { height: 8px; }
    .site .cash-register__list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 6px; }
    .site .cash-register__figure { min-width: 160px; flex: 0 0 160px; }
}

@media screen and (max-width: 500px) {
   .obyavlenie-big-foto { width: 100%; }
   .obyavlenie-big__link { font-size: 14px; }
   .obyavlenie-big__head { font-size: 14px; }
   .obyavlenie-big { font-size: 14px; }

   .cash-register__foto {
      border-radius: 50px;
      border: 2px solid var(--border);
   }

   .main-block__heat {
      font-size: 17px;
      line-height: 1;
   }

   .main-block__komm_t {
      font-size: 12px;
   }

   .cash-register__komm {
      max-width: 154px;
      font-size: 14px;
      padding-top: 10px;
   }

   .main-block {
      margin-top: 0;
      border-radius: 0;
      border: 0;
      background: var(--bg);
      padding: 0;
   }

   .obyavlenie_1 { display: block; }

   .certificates__view {
       max-width: 280px;
       max-height: 300px;
   }
}