/* /contact/ prototype styles. Own file, does not touch home2.css / malta2.css / about2.css / faq2.css / hiw2.css / selfref2.css / partner2.css */



/* Найдено на живой боевой странице: .page-header__body получает белый фон и padding-top

   только на min-width:1250px (правило из styles.min.css). Ниже этого порога карточка

   остаётся без фона поверх фото заката, и первые строки контента нечитаемы. Не трогаю

   styles.min.css (чужой файл темы), закрываю через собственный override, ограниченный

   этой страницей и той же точкой останова, что использует тема. */

@media (max-width:1249px){

  .page-contact .page-header__body{background-color:#fcfcfc;padding-top:40px}

}



.contact-intro{font:300 17px/1.55 "GT-America",sans-serif;color:#4d4c63;margin:0 0 36px;

  max-width:40em;text-wrap:pretty}



.contact-routes{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#e4e1d8;

  border:1px solid #e4e1d8;margin:0 0 48px}

.contact-route{background:#fcfcfc;padding:28px 26px}

.contact-route__label{font:400 11px/1 "GT-America",sans-serif;letter-spacing:.11em;

  text-transform:uppercase;color:#908e97;margin:0 0 10px}

.contact-route__text{font:300 15px/1.5 "GT-America",sans-serif;color:#2a293d;margin:0 0 16px;

  text-wrap:pretty}

.contact-route__btn{display:inline-flex;align-items:center;background:#2a293d;color:#fcfcfc;

  border:1px solid #2a293d;cursor:pointer;padding:12px 20px;text-decoration:none;

  font:400 11px/1 "GT-America",sans-serif;letter-spacing:.11em;text-transform:uppercase;

  transition:background .18s,border-color .18s,color .18s}

.contact-route__btn:hover{background:#fcfcfc;color:#2a293d;border-color:#2a293d}

.contact-route__btn--ghost{background:transparent;color:#2a293d}

.contact-route__btn--ghost:hover{background:#2a293d;color:#fcfcfc}



@media (max-width:900px){

  .contact-routes{grid-template-columns:1fr}

}



.contact-cta{padding:78px 0;background:#dcd5c3;text-align:center}

.contact-cta__title{font-family:"PF Regal Display Pro",Georgia,serif;font-weight:400;color:#2a293d;

  font-size:clamp(26px,3vw,38px);line-height:1.15;margin:0 0 16px;text-wrap:balance}

.contact-cta__sub{font:300 16px/1.6 "GT-America",sans-serif;color:#4d4c63;margin:0 auto 28px;

  max-width:34em;text-wrap:pretty}

.contact-cta__btn{display:inline-flex;align-items:center;background:#2a293d;color:#fcfcfc;

  border:1px solid #2a293d;cursor:pointer;padding:16px 32px;

  font:400 12px/1 "GT-America",sans-serif;letter-spacing:.13em;text-transform:uppercase;

  transition:background .18s,border-color .18s,color .18s}

.contact-cta__btn:hover{background:#fcfcfc;color:#2a293d;border-color:#2a293d}



@media (max-width:900px){

  .contact-cta{padding:52px 0}

}

/* Блок контактов приходит из темы сырым: заголовок, абзац, две линейки,
   список соцсетей столбиком и два адреса подряд одним курсивом.
   Собираем в читаемую сетку, не трогая саму разметку. */
.page-contact__email{margin:0 0 18px}
.page-contact__email h2{margin:0 0 8px}
.page-contact__email p{margin:0;font:300 18px/1.5 "GT-America",sans-serif}
.page-contact__email a{color:#2a293d;text-decoration:underline;text-underline-offset:3px}
.page-contact hr,.page-contact__address+hr{display:none}
.page-contact ul{list-style:none;display:flex;flex-wrap:wrap;gap:22px;margin:0 0 26px;padding:0}
.page-contact ul a{font:400 12px/1 "GT-America",sans-serif;letter-spacing:.12em;
  text-transform:uppercase;color:#4d4c63;text-decoration:none;border-bottom:1px solid #cfccc6;padding-bottom:4px}
.page-contact ul a:hover{color:#2a293d;border-color:#2a293d}
.page-contact__address{font-style:normal;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 48px;max-width:56em}
.page-contact__address p{margin:0;font:300 15px/1.6 "GT-America",sans-serif;color:#4d4c63}
/* Clinic и Registered office это подписи колонок, а не строки адреса */
.page-contact__address p:nth-child(1),.page-contact__address p:nth-child(4){
  font:400 11px/1 "GT-America",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#908e97;margin:0 0 6px}
.page-contact__address p:nth-child(1){grid-column:1;grid-row:1}
.page-contact__address p:nth-child(2){grid-column:1;grid-row:2}
.page-contact__address p:nth-child(3){grid-column:1;grid-row:3}
.page-contact__address p:nth-child(4){grid-column:2;grid-row:1}
.page-contact__address p:nth-child(5){grid-column:2;grid-row:2}
.page-contact__address p:nth-child(6){grid-column:2;grid-row:3}
@media (max-width:760px){.page-contact__address{grid-template-columns:1fr}
  .page-contact__address p:nth-child(n){grid-column:1;grid-row:auto}
  .page-contact__address p:nth-child(4){margin-top:22px}}

/* Карточка темы задумана под короткий вводный текст: на /about/ в ней только он.
   Контакты и адреса вынесены из неё вниз, чтобы фон-фото не растягивался
   на всю их высоту и карточка не обрывалась по краю. */

.contact-details .page-contact__email{margin:0 0 18px}

/* Карточка темы держит padding 72/48 под длинный текст. У нас внутри сетка
   каналов со своими полями, и эти отступы читались пустой полосой сверху и снизу. */
.page-header__body{padding-top:0;padding-bottom:0}
.contact-routes{border-top:0}

/* Прежние правила были привязаны к .page-contact, а блок переехал в .contact-details:
   соцсети снова встали столбиком и слиплись с адресами, зазор между ними был 1px. */
.contact-details hr{display:none}
.contact-details ul{list-style:none;display:flex;flex-wrap:wrap;gap:26px;margin:0 0 46px;padding:0}
.contact-details ul a{font:400 12px/1 "GT-America",sans-serif;letter-spacing:.12em;text-transform:uppercase;
  color:#4d4c63;text-decoration:none;border-bottom:1px solid #cfccc6;padding-bottom:4px}
.contact-details ul a:hover{color:#2a293d;border-color:#2a293d}
.contact-details address{font-style:normal;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 64px;max-width:56em}
.contact-details address p{margin:0;font:300 15px/1.75 "GT-America",sans-serif;color:#4d4c63}
/* Clinic и Registered office это подписи колонок, им нужен воздух под собой */
.contact-details address p:nth-child(1),.contact-details address p:nth-child(4){
  font:400 11px/1 "GT-America",sans-serif;letter-spacing:.13em;text-transform:uppercase;
  color:#908e97;margin:0 0 4px}
.contact-details address p:nth-child(1){grid-column:1;grid-row:1}
.contact-details address p:nth-child(2){grid-column:1;grid-row:2}
.contact-details address p:nth-child(3){grid-column:1;grid-row:3}
.contact-details address p:nth-child(4){grid-column:2;grid-row:1}
.contact-details address p:nth-child(5){grid-column:2;grid-row:2}
.contact-details address p:nth-child(6){grid-column:2;grid-row:3}
@media (max-width:760px){.contact-details address{grid-template-columns:1fr;gap:10px 0}
  .contact-details address p:nth-child(n){grid-column:1;grid-row:auto}
  .contact-details address p:nth-child(4){margin-top:32px}}

/* Блок контактов: фото шапки уходит ниже своей секции, поэтому без собственного
   фона текст ложится прямо на обрез снимка. Даём секции фон и воздух. */
.contact-details{background:#f6f4f1;padding:72px 0 76px;position:relative;z-index:1}
.contact-details .page-contact__email h2{margin:0 0 10px}
.contact-details .page-contact__email{margin:0 0 6px}
/* Развилка каналов прижималась к верхнему краю белой карточки */
.page-header__body{padding-top:0}
.contact-routes{margin:0}
@media (max-width:760px){.contact-details{padding:56px 0 60px}}