@charset "UTF-8";
/* ==========================================================================
   ГЕОПИР — «Контакты» (contacts.html).
   Как и «Объекты», опирается на about.css: .ab-sec, .ab-head, .ab-rule,
   .ab-hero, .ab-rail. Десктоп 1920/1680 через calc(Npx * var(--s)),
   ниже 1660 размеры переводятся на токены --sect / --gap / --fs-*.
   ========================================================================== */

.page-contacts{
  --sec-pad:calc(120px * var(--s));
  --card-r:calc(20px * var(--s));
  --card-sh:0 4px 24px rgba(0,0,0,.07);
}

/* --------------------------------------------------------------------------
   1. Телефон, почта, режим работы
   -------------------------------------------------------------------------- */
.ct-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(32px * var(--s));margin-top:calc(48px * var(--s))}
.ct-card{
  display:flex;flex-direction:column;
  padding:calc(38px * var(--s)) calc(36px * var(--s)) calc(40px * var(--s));
  background:#fff;border-radius:var(--card-r);box-shadow:var(--card-sh);
}
.ct-card__ico{width:calc(61px * var(--s));height:calc(61px * var(--s));object-fit:contain}
.ct-card__label{margin-top:calc(24px * var(--s));font-size:calc(18px * var(--s));line-height:1.4;color:var(--ink-2)}
.ct-card__main{
  margin-top:calc(10px * var(--s));
  font-weight:600;font-size:calc(30px * var(--s));line-height:1.25;color:#2F3142;
  word-break:break-word;
}
a.ct-card__main:hover{color:var(--blue)}
.ct-card .ab-rule{margin:calc(18px * var(--s)) 0}
.ct-card__note{font-size:calc(17px * var(--s));line-height:1.55;color:var(--ink-2)}
.ct-card__extra{margin-top:calc(14px * var(--s));font-size:calc(18px * var(--s));line-height:1.5}
.ct-card__extra a{color:var(--blue);text-decoration:underline;text-underline-position:from-font}

/* режим работы строками «день — часы» */
.ct-hours{margin-top:calc(6px * var(--s))}
.ct-hours div{
  display:flex;justify-content:space-between;gap:calc(16px * var(--s));
  padding:calc(9px * var(--s)) 0;border-bottom:1px solid var(--line);
  font-size:calc(18px * var(--s));line-height:1.4;
}
.ct-hours div:last-child{border-bottom:0}
.ct-hours b{font-weight:600;color:#2F3142;white-space:nowrap}

/* --------------------------------------------------------------------------
   2. Адреса — офис и производство
   -------------------------------------------------------------------------- */
.ct-addr{display:grid;grid-template-columns:repeat(2,1fr);gap:calc(32px * var(--s));margin-top:calc(48px * var(--s))}
.ct-addr__item{
  padding:calc(38px * var(--s)) calc(36px * var(--s)) calc(40px * var(--s));
  background:#fff;border:1px solid var(--line);border-radius:var(--card-r);
}
.ct-addr__kind{
  display:inline-flex;align-items:center;gap:calc(10px * var(--s));
  font-size:calc(17px * var(--s));line-height:1.3;color:var(--ink-2);
}
.ct-addr__kind::before{content:"";width:calc(8px * var(--s));height:calc(8px * var(--s));border-radius:50%;background:var(--orange)}
.ct-addr__t{margin-top:calc(14px * var(--s));font-weight:600;font-size:calc(26px * var(--s));line-height:1.3;color:#2F3142}
.ct-addr__item .ab-rule{margin:calc(18px * var(--s)) 0}
.ct-addr__list{display:grid;gap:calc(12px * var(--s))}
.ct-addr__list div{display:grid;grid-template-columns:calc(190px * var(--s)) 1fr;gap:calc(16px * var(--s));font-size:calc(18px * var(--s));line-height:1.5}
.ct-addr__list dt{color:var(--ink-2)}
.ct-addr__list dd{margin:0;color:var(--ink)}
.ct-addr__btn{margin-top:calc(26px * var(--s))}

/* --------------------------------------------------------------------------
   3. Карта: превью + вкладки, iframe подгружается по клику
   -------------------------------------------------------------------------- */
.ct-tabs{display:flex;flex-wrap:wrap;gap:calc(12px * var(--s));margin-top:calc(40px * var(--s))}
.ct-tab{
  height:calc(52px * var(--s));padding:0 calc(26px * var(--s));
  border:1px solid var(--line);border-radius:calc(10px * var(--s));background:#fff;
  font-size:calc(18px * var(--s));line-height:1.3;color:var(--ink);white-space:nowrap;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}
.ct-tab:hover{border-color:var(--blue);color:var(--blue)}
.ct-tab[aria-selected="true"]{background:var(--blue);border-color:var(--blue);color:#fff}

.ct-map{
  position:relative;margin-top:calc(24px * var(--s));
  border-radius:var(--card-r);overflow:hidden;background:var(--grey);
}
.ct-map__pane{display:none}
.ct-map__pane[data-active="true"]{display:block}
.ct-map__pane img{width:100%;height:calc(560px * var(--s));object-fit:cover;display:block}
/* кнопка поверх превью: карту грузим только по клику — не тянем сторонние
   скрипты на каждый заход и не ломаем страницу, если карта недоступна */
/* кнопка в правом верхнем углу, а не по центру: по центру она
   перекрывала бы подпись объекта на превью */
.ct-map__load{
  position:absolute;right:calc(24px * var(--s));top:calc(24px * var(--s));
  display:inline-flex;align-items:center;gap:calc(12px * var(--s));
  height:calc(60px * var(--s));padding:0 calc(32px * var(--s));
  border-radius:calc(10px * var(--s));background:var(--blue);color:#fff;
  font-weight:600;font-size:calc(20px * var(--s));
  box-shadow:0 10px 30px rgba(0,0,0,.22);
  transition:background .18s ease;
}
.ct-map__load:hover{background:var(--blue-dark)}
.ct-map__frame{display:none;width:100%;height:calc(560px * var(--s));border:0}
.ct-map__pane[data-loaded="true"] img,
.ct-map__pane[data-loaded="true"] .ct-map__load{display:none}
.ct-map__pane[data-loaded="true"] .ct-map__frame{display:block}
.ct-map__hint{margin-top:calc(16px * var(--s));font-size:calc(16px * var(--s));line-height:1.5;color:var(--ink-2)}

/* --------------------------------------------------------------------------
   4. Реквизиты
   -------------------------------------------------------------------------- */
.ct-req{
  margin-top:calc(48px * var(--s));
  background:#fff;border-radius:var(--card-r);box-shadow:var(--card-sh);overflow:hidden;
}
.ct-req__row{
  display:grid;grid-template-columns:calc(360px * var(--s)) 1fr calc(150px * var(--s));
  align-items:center;gap:calc(24px * var(--s));
  padding:calc(20px * var(--s)) calc(34px * var(--s));
  border-top:1px solid var(--line);
}
.ct-req__row:first-child{border-top:0}
.ct-req__row dt{font-size:calc(18px * var(--s));line-height:1.4;color:var(--ink-2)}
.ct-req__row dd{margin:0;font-size:calc(19px * var(--s));line-height:1.4;color:#2F3142;word-break:break-word}
.ct-copy{
  justify-self:end;
  height:calc(40px * var(--s));padding:0 calc(18px * var(--s));
  border:1px solid var(--line);border-radius:calc(8px * var(--s));background:#fff;
  font-size:calc(15px * var(--s));color:var(--ink-2);white-space:nowrap;
  transition:border-color .16s ease,color .16s ease;
}
.ct-copy:hover{border-color:var(--blue);color:var(--blue)}
.ct-copy[data-done="true"]{border-color:var(--blue);color:var(--blue)}
.ct-req__note{margin-top:calc(18px * var(--s));font-size:calc(16px * var(--s));line-height:1.5;color:var(--ink-2)}

/* --------------------------------------------------------------------------
   5. Вопросы и ответы
   -------------------------------------------------------------------------- */
.ct-faq{margin-top:calc(48px * var(--s));border-top:1px solid var(--line)}
.ct-q{border-bottom:1px solid var(--line)}
.ct-q__head{
  position:relative;display:flex;align-items:center;width:100%;
  padding:calc(30px * var(--s)) calc(70px * var(--s)) calc(30px * var(--s)) 0;
  text-align:left;
}
.ct-q__t{flex:1 1 auto;font-weight:600;font-size:calc(24px * var(--s));line-height:1.35;color:#2F3142}
.ct-q__head:hover .ct-q__t{color:var(--blue)}
.ct-q__sign{
  position:absolute;right:calc(10px * var(--s));top:50%;transform:translateY(-50%);
  width:calc(36px * var(--s));height:calc(36px * var(--s));border-radius:50%;background:var(--grey);
}
.ct-q__sign::before,.ct-q__sign::after{
  content:"";position:absolute;left:50%;top:50%;background:#2F3142;
  transform:translate(-50%,-50%);transition:opacity .18s ease;
}
.ct-q__sign::before{width:calc(14px * var(--s));height:2px}
.ct-q__sign::after{width:2px;height:calc(14px * var(--s))}
.ct-q__head[aria-expanded="true"] .ct-q__sign{background:var(--blue)}
.ct-q__head[aria-expanded="true"] .ct-q__sign::before,
.ct-q__head[aria-expanded="true"] .ct-q__sign::after{background:#fff}
.ct-q__head[aria-expanded="true"] .ct-q__sign::after{opacity:0}
.ct-q__panel{display:none;padding:0 calc(120px * var(--s)) calc(34px * var(--s)) 0}
.ct-q__panel[data-open="true"]{display:block}
.ct-q__panel p{font-size:calc(19px * var(--s));line-height:1.65}
.ct-q__panel p + p{margin-top:calc(14px * var(--s))}

.ct-ask{
  display:flex;align-items:center;gap:calc(30px * var(--s));
  margin-top:calc(46px * var(--s));padding:calc(36px * var(--s)) calc(40px * var(--s));
  background:#F3F6F8;border-radius:var(--card-r);
}
.ct-ask p{flex:1 1 auto;font-size:calc(20px * var(--s));line-height:1.5}
.ct-ask b{display:block;font-weight:600;font-size:calc(24px * var(--s));color:#2F3142;margin-bottom:calc(8px * var(--s))}

/* --------------------------------------------------------------------------
   6. Мелочи
   -------------------------------------------------------------------------- */
.page-contacts .sec-form{padding-top:var(--sec-pad);scroll-margin-top:calc(96px * var(--s))}


/* ==========================================================================
   АДАПТИВ. Полосы совпадают с общими: 1659 / 1279 / 959 / 567.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1280–1659
   -------------------------------------------------------------------------- */
@media (max-width:1659px){

  .page-contacts{--sec-pad:var(--sect);--card-r:var(--r)}

  .ct-cards{gap:var(--gap);margin-top:36px}
  .ct-card{padding:28px 26px 30px}
  .ct-card__ico{width:50px;height:50px}
  .ct-card__label{margin-top:18px;font-size:var(--fs-cap)}
  .ct-card__main{margin-top:8px;font-size:var(--fs-h3)}
  .ct-card .ab-rule{margin:14px 0}
  .ct-card__note{font-size:var(--fs-cap)}
  .ct-card__extra{margin-top:10px;font-size:var(--fs-cap)}
  .ct-hours div{padding:7px 0;font-size:var(--fs-cap)}

  .ct-addr{gap:var(--gap);margin-top:36px}
  .ct-addr__item{padding:28px 26px 30px}
  .ct-addr__kind{font-size:var(--fs-cap)}
  .ct-addr__t{margin-top:10px;font-size:var(--fs-h3)}
  .ct-addr__item .ab-rule{margin:14px 0}
  .ct-addr__list{gap:10px}
  .ct-addr__list div{grid-template-columns:150px 1fr;gap:12px;font-size:var(--fs-cap)}
  .ct-addr__btn{margin-top:20px}

  .ct-tabs{gap:10px;margin-top:28px}
  .ct-tab{height:46px;padding:0 20px;font-size:var(--fs-cap);border-radius:10px}
  .ct-map{margin-top:18px}
  .ct-map__pane img,.ct-map__frame{height:440px}
  .ct-map__load{height:52px;padding:0 24px;font-size:var(--fs-cap);gap:10px;right:18px;top:18px}
  .ct-map__hint{margin-top:12px;font-size:13px}

  .ct-req{margin-top:36px}
  .ct-req__row{grid-template-columns:280px 1fr 120px;gap:18px;padding:16px 26px}
  .ct-req__row dt{font-size:var(--fs-cap)}
  .ct-req__row dd{font-size:var(--fs-cap)}
  .ct-copy{height:36px;padding:0 14px;font-size:13px}
  .ct-req__note{margin-top:14px;font-size:13px}

  .ct-faq{margin-top:36px}
  .ct-q__head{padding:24px 56px 24px 0}
  .ct-q__t{font-size:var(--fs-h3)}
  .ct-q__sign{width:32px;height:32px;right:6px}
  .ct-q__sign::before{width:12px;height:2px}
  .ct-q__sign::after{width:2px;height:12px}
  .ct-q__panel{padding:0 80px 26px 0}
  .ct-q__panel p{font-size:var(--fs-cap)}
  .ct-ask{gap:24px;margin-top:32px;padding:28px}
  .ct-ask p{font-size:var(--fs-cap)}
  .ct-ask b{font-size:var(--fs-h3);margin-bottom:6px}
}

/* --------------------------------------------------------------------------
   960–1279
   -------------------------------------------------------------------------- */
@media (max-width:1279px){

  .ab-sec{scroll-margin-top:96px}
  .page-contacts .sec-form{scroll-margin-top:96px}

  .ct-cards{grid-template-columns:repeat(2,1fr)}
  /* третья карточка (режим работы) занимает всю строку — в ней таблица */
  .ct-card:nth-child(3){grid-column:1 / -1}
  .ct-map__pane img,.ct-map__frame{height:400px}
  .ct-req__row{grid-template-columns:240px 1fr 110px}
  .ct-q__panel{padding:0 40px 24px 0}
}

/* --------------------------------------------------------------------------
   568–959
   -------------------------------------------------------------------------- */
@media (max-width:959px){

  .ab-sec{scroll-margin-top:72px}
  .page-contacts .sec-form{scroll-margin-top:72px}

  .ct-cards{grid-template-columns:1fr;margin-top:26px}
  .ct-card:nth-child(3){grid-column:auto}
  .ct-addr{grid-template-columns:1fr;margin-top:26px}
  .ct-map__pane img,.ct-map__frame{height:320px}

  /* реквизиты: подпись над значением, кнопка копирования — в строку со значением */
  .ct-req{margin-top:26px}
  .ct-req__row{grid-template-columns:1fr auto;gap:6px 16px;padding:16px 20px}
  .ct-req__row dt{grid-column:1 / -1}
  .ct-copy{grid-row:2}

  .ct-faq{margin-top:26px}
  .ct-q__head{padding:20px 44px 20px 0}
  .ct-q__panel{padding:0 0 22px}
  .ct-ask{flex-direction:column;align-items:stretch;gap:18px;padding:22px;margin-top:28px}
}

/* --------------------------------------------------------------------------
   320–567
   -------------------------------------------------------------------------- */
@media (max-width:567px){

  .ct-card{padding:20px 18px 24px}
  .ct-addr__item{padding:20px 18px 24px}
  .ct-addr__list div{grid-template-columns:1fr;gap:2px}
  .ct-addr__list dt{font-size:13px}

  /* вкладки карты в один ряд с прокруткой — как чипы фильтра на «Объектах» */
  .ct-tabs{
    flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);
    padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .ct-tabs::-webkit-scrollbar{display:none}
  .ct-tab{flex:none;height:42px;padding:0 14px}
  .ct-map__pane img,.ct-map__frame{height:260px}
  .ct-map__load{height:46px;padding:0 18px;font-size:14px;right:12px;top:12px}

  .ct-req__row{padding:14px 16px}
  .ct-q__t{font-size:var(--fs-body)}
}