/* ==========================================================
   Страница «Контакты» (/contacts/)
   Классы с префиксом contacts-, всё внутри .contacts-page.
   Шрифт, цвета, контейнер и крошки — как на /o-kompanii/.
   Брейкпоинты: до 767 / 768–1279 / от 1280.
   ========================================================== */

.contacts-page{
  --c-primary:#003888;
  --c-tory-blue:#0050bb;
  --c-text:#111111;
  --c-slate-600:#475467;
  --c-border:#e9ebed;
  --c-tint-blue:#edf6fc;
  --c-font:'Geologica', Arial, sans-serif;
  --c-gap:60px;

  font-family:var(--c-font);
  color:var(--c-text);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-bottom:140px;
}
@media (min-width:768px){ .contacts-page{ --c-gap:80px; } }

.contacts-page *, .contacts-page *::before, .contacts-page *::after{ box-sizing:border-box; }
.contacts-page :where(h1,h2,p,ul,ol,li){ margin:0; padding:0; }
.contacts-page :where(ul,ol){ list-style:none; }
.contacts-page :where(a), .contacts-page :where(a):hover, .contacts-page :where(a):focus{ text-decoration:none; }

/* контейнер — те же размеры, что на /o-kompanii/ */
.contacts-page .contacts-container{ width:100%; margin:0 auto; padding:0 16px; }
@media (min-width:768px){ .contacts-page .contacts-container{ max-width:768px; padding:0 24px; } }
@media (min-width:1280px){ .contacts-page .contacts-container{ max-width:1434px; padding:0 24px; } }

/* хлебные крошки */
.contacts-page .contacts-breadcrumbs .breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; padding:0; margin:0; background:none; list-style:none; }
.contacts-page .contacts-breadcrumbs .breadcrumb-item,
.contacts-page .contacts-breadcrumbs .breadcrumb-item a,
.contacts-page .contacts-breadcrumbs .breadcrumb-item span{ font:300 14px/18px var(--c-font); color:var(--c-text); }
.contacts-page .contacts-breadcrumbs .breadcrumb-item a span{ transition:color .2s ease; }
.contacts-page .contacts-breadcrumbs .breadcrumb-item a:hover,
.contacts-page .contacts-breadcrumbs .breadcrumb-item a:hover span,
.contacts-page .contacts-breadcrumbs .breadcrumb-item a:focus-visible span{ color:var(--c-tory-blue); }
.contacts-page .contacts-breadcrumbs .breadcrumb-item + .breadcrumb-item{ padding-left:8px; }
.contacts-page .contacts-breadcrumbs .breadcrumb-item + .breadcrumb-item::before{
  content:''; display:inline-block; float:none; width:6px; height:6px; border-radius:3px;
  background:var(--c-text); padding:0; margin-right:8px; vertical-align:middle; color:transparent;
}
.contacts-page .contacts-breadcrumbs{ padding-top:32px; margin-bottom:24px; }
@media (min-width:1280px){ .contacts-page .contacts-breadcrumbs{ padding-top:40px; margin-bottom:40px; } }

/* ритм секций */
.contacts-page .contacts-section{ margin-top:var(--c-gap); }
.contacts-page .contacts-section:first-child{ margin-top:0; }

/* заголовки */
.contacts-page .contacts-h1{ font:700 32px/36px var(--c-font); margin-bottom:32px; }
.contacts-page .contacts-title{ font:700 28px/32px var(--c-font); margin-bottom:32px; }
@media (min-width:768px){
  .contacts-page .contacts-h1{ font-size:36px; line-height:40px; }
  .contacts-page .contacts-title{ font-size:32px; line-height:36px; }
}
@media (min-width:1280px){
  .contacts-page .contacts-h1{ font-size:42px; line-height:46px; margin-bottom:40px; }
  .contacts-page .contacts-title{ font-size:36px; line-height:40px; margin-bottom:40px; }
}

/* карточка */
.contacts-page .contacts-card{ border:1px solid var(--c-border); border-radius:24px; background:#fff; padding:24px; }

/* ссылки */
.contacts-page .contacts-link, .contacts-page .contacts-link:hover, .contacts-page .contacts-link:focus{ color:inherit; transition:color .2s ease; }
.contacts-page .contacts-link:hover, .contacts-page .contacts-link:focus-visible{ color:var(--c-tory-blue); }

/* основной блок: инфо + карта */
.contacts-page .contacts-main__grid{ display:grid; gap:24px; grid-template-columns:1fr; }
@media (min-width:1280px){ .contacts-page .contacts-main__grid{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:32px; } }
.contacts-page .contacts-info{ background:var(--c-tint-blue); border-color:transparent; display:flex; flex-direction:column; gap:20px; }
@media (min-width:1280px){ .contacts-page .contacts-info{ padding:40px; gap:24px; } }
.contacts-page .contacts-info__row{ display:flex; flex-direction:column; gap:4px; }
.contacts-page .contacts-info__label{ font:300 14px/18px var(--c-font); color:var(--c-slate-600); }
.contacts-page .contacts-info__value{ font:500 18px/24px var(--c-font); }
.contacts-page .contacts-info__note{ font:500 16px/22px var(--c-font); color:var(--c-primary); padding-top:20px; border-top:1px solid rgba(0,56,136,.15); }
.contacts-page .contacts-map{ border-radius:24px; overflow:hidden; min-height:320px; background:var(--c-tint-blue); }
.contacts-page .contacts-map iframe{ display:block; width:100%; height:100%; min-height:320px; border:0; }
@media (min-width:1280px){ .contacts-page .contacts-map, .contacts-page .contacts-map iframe{ min-height:440px; } }

/* сетки карточек */
.contacts-page .contacts-grid{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:768px){ .contacts-page .contacts-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; } }
@media (min-width:1280px){
  .contacts-page .contacts-grid--pharmacies{ grid-template-columns:repeat(4,minmax(0,1fr)); }
  .contacts-page .contacts-grid--branches{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* аптека */
.contacts-page .contacts-shop{ display:flex; flex-direction:column; gap:10px; }
.contacts-page .contacts-shop__address{ font:500 18px/24px var(--c-font); }
.contacts-page .contacts-shop__line{ font:400 16px/22px var(--c-font); }
.contacts-page .contacts-shop__hours{ font:300 14px/20px var(--c-font); color:var(--c-slate-600); }

/* представительство */
.contacts-page .contacts-branch{ display:flex; flex-direction:column; gap:8px; }
.contacts-page .contacts-branch__tag{ font:500 12px/16px var(--c-font); letter-spacing:.08em; text-transform:uppercase; color:var(--c-tory-blue); }
.contacts-page .contacts-branch__city{ font:700 22px/28px var(--c-font); }
.contacts-page .contacts-branch__address{ font:300 16px/22px var(--c-font); color:var(--c-slate-600); padding-bottom:8px; }
.contacts-page .contacts-branch__line{ font:400 16px/22px var(--c-font); overflow-wrap:anywhere; }