.page-contacts { background: #f1ece4; }
.contacts-page { overflow: clip; background: #f1ece4; color: var(--text); }
.contacts-container { width: min(1200px, calc(100% - 80px)); margin: 0 auto; }
.contacts-kicker { margin: 0 0 23px; color: #365e4b; font-size: 10px; font-weight: 700; letter-spacing: .18em; line-height: 1.4; text-transform: uppercase; }

.contacts-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 440px;
  padding: 94px 0 84px;
  border-bottom: 1px solid rgba(77, 58, 42, .2);
  background: #e7ded1;
}

.contacts-hero::before,
.contacts-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  border: 1px solid rgba(54, 94, 75, .15);
  border-radius: 50%;
  pointer-events: none;
}

.contacts-hero::before { top: -360px; right: -70px; width: 690px; height: 690px; }
.contacts-hero::after { top: -305px; right: -15px; width: 580px; height: 580px; border-color: rgba(103, 79, 55, .1); }
.contacts-hero h1 { margin: 0; color: #2c211a; font-family: var(--font-display); font-size: clamp(76px, 9vw, 132px); font-weight: 500; letter-spacing: -.045em; line-height: .78; text-transform: uppercase; }
.contacts-hero__lead { max-width: 600px; margin: 43px 0 0; color: #615549; font-size: 16px; line-height: 1.65; }

.contacts-main { padding: 104px 0 112px; }
.contacts-main__layout { display: grid; grid-template-columns: 1.05fr .95fr; border-top: 1px solid rgba(77, 58, 42, .24); border-bottom: 1px solid rgba(77, 58, 42, .24); }
.contacts-main__communication,
.contacts-main__address { min-width: 0; padding: 38px 56px 46px 0; }
.contacts-main__address { position: relative; isolation: isolate; overflow: hidden; padding-right: 0; padding-left: 62px; border-left: 1px solid rgba(77, 58, 42, .24); }
.contacts-main__communication h2 { margin: 0 0 17px; font-family: var(--font-display); font-size: clamp(48px, 5vw, 70px); font-weight: 500; line-height: .95; }
.contacts-main__communication h2 a { color: #2c211a; text-decoration: none; }
.contacts-main__communication h2 a:hover { color: #365e4b; }
.contacts-main__communication h2 a:focus-visible,
.contacts-email:focus-visible,
.contacts-cta__action a:focus-visible { outline: 2px solid #77917c; outline-offset: 5px; }
.contacts-email { display: inline-flex; min-height: 44px; align-items: center; color: #365e4b; font-size: 14px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.contacts-region { display: grid; gap: 6px; margin: 48px 0 0; padding-top: 22px; border-top: 1px solid rgba(77, 58, 42, .18); }
.contacts-region strong { font-family: var(--font-display); font-size: 28px; font-weight: 600; text-transform: uppercase; }
.contacts-region span { color: #76695c; font-size: 12px; }
.contacts-main__number { display: block; margin-bottom: 43px; color: #8c7964; font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.contacts-main__address h2 { margin: 0 0 20px; color: #365e4b; font-family: var(--font-display); font-size: clamp(50px, 5vw, 72px); font-weight: 500; line-height: .9; text-transform: uppercase; }
.contacts-main__address address { margin: 0; color: #5f5449; font-size: 14px; font-style: normal; line-height: 1.7; }
.contacts-address-axis { display: flex; align-items: center; gap: 10px; width: min(310px, 80%); margin-top: 39px; color: #365e4b; }
.contacts-address-axis i { flex: 1; height: 1px; background: rgba(54, 94, 75, .42); }
.contacts-address-axis span { width: 19px; height: 19px; border: 1px solid currentColor; border-radius: 50%; }
.contacts-main__address::after { content: ''; position: absolute; z-index: -1; right: -165px; bottom: -210px; width: 390px; height: 390px; border: 1px solid rgba(54, 94, 75, .11); border-radius: 50%; }

.contacts-map-section { padding: 0 0 110px; }
.contacts-map { position: relative; height: clamp(500px, 45vw, 630px); border-top: 1px solid rgba(77, 58, 42, .22); border-bottom: 1px solid rgba(77, 58, 42, .22); background: #ded6ca; }
.contacts-map::before { content: 'Пятигорск · 44.072178 / 43.082316'; position: absolute; z-index: 1; top: 18px; left: 18px; padding: 9px 11px; background: rgba(241, 236, 228, .92); color: #594d42; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; }
.contacts-map iframe { display: block; width: 100%; height: 100%; border: 0; }

.contacts-details { padding: 98px 0 108px; border-top: 1px solid rgba(77, 58, 42, .18); background: #e9e1d6; }
.contacts-details__layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }
.contacts-details h2 { margin: 0; font-family: var(--font-display); font-size: clamp(54px, 5.6vw, 78px); font-weight: 500; line-height: .9; text-transform: uppercase; }
.contacts-details__list { margin: 0; border-top: 1px solid rgba(77, 58, 42, .25); }
.contacts-details__list > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 30px; padding: 22px 0; border-bottom: 1px solid rgba(77, 58, 42, .2); }
.contacts-details__list dt { color: #806f5e; font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.contacts-details__list dd { min-width: 0; margin: 0; color: #40362e; font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; }

.contacts-cta { position: relative; isolation: isolate; overflow: hidden; padding: 86px 0 91px; background: #273a2f; color: #f5efe5; }
.contacts-cta::after { content: ''; position: absolute; z-index: -1; right: -190px; bottom: -360px; width: 580px; height: 580px; border: 1px solid rgba(238, 231, 217, .13); border-radius: 50%; box-shadow: 0 0 0 48px rgba(238, 231, 217, .025); }
.contacts-cta__layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 90px; align-items: end; }
.contacts-cta .contacts-kicker { color: #b8c6b8; }
.contacts-cta h2 { max-width: 700px; margin: 0; color: #f5efe5; font-family: var(--font-display); font-size: clamp(50px, 5.6vw, 80px); font-weight: 500; line-height: .86; text-transform: uppercase; }
.contacts-cta__action p { margin: 0 0 27px; color: rgba(245, 239, 229, .72); font-size: 13px; line-height: 1.65; }
.contacts-cta__action a { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-width: 275px; min-height: 53px; padding: 14px 17px; border: 1px solid rgba(245, 239, 229, .55); color: #f5efe5; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; transition: background .2s, color .2s; }
.contacts-cta__action a span { font-size: 20px; line-height: 1; }
.contacts-cta__action a:hover { background: #f5efe5; color: #273a2f; }
.page-contacts > .site-footer { margin-top: 0; }

@media (max-width: 900px) {
  .contacts-main__communication,
  .contacts-main__address { padding-right: 34px; }
  .contacts-main__address { padding-right: 0; padding-left: 34px; }
  .contacts-details__layout,
  .contacts-cta__layout { gap: 48px; }
}

@media (max-width: 700px) {
  .contacts-container { width: calc(100% - 32px); }
  .contacts-kicker { margin-bottom: 16px; font-size: 9px; }
  .contacts-hero { min-height: 0; padding: 53px 0 55px; }
  .contacts-hero::before { top: -210px; right: -190px; width: 420px; height: 420px; }
  .contacts-hero::after { top: -170px; right: -150px; width: 340px; height: 340px; }
  .contacts-hero h1 { font-size: clamp(56px, 19vw, 78px); line-height: .82; }
  .contacts-hero__lead { margin-top: 28px; font-size: 14px; line-height: 1.55; }
  .contacts-hero__lead br { display: none; }
  .contacts-main { padding: 58px 0 64px; }
  .contacts-main__layout { grid-template-columns: 1fr; }
  .contacts-main__communication,
  .contacts-main__address { padding: 25px 0 31px; }
  .contacts-main__address { border-top: 1px solid rgba(77, 58, 42, .24); border-left: 0; }
  .contacts-main__communication h2 { font-size: clamp(38px, 12vw, 51px); }
  .contacts-main__communication h2 a { display: inline-flex; min-height: 48px; align-items: center; }
  .contacts-region { margin-top: 30px; }
  .contacts-main__number { margin-bottom: 24px; }
  .contacts-main__address h2 { font-size: 46px; }
  .contacts-main__address address { font-size: 13px; }
  .contacts-map-section { padding-bottom: 64px; }
  .contacts-map { height: clamp(380px, 112vw, 450px); margin-right: -16px; margin-left: -16px; }
  .contacts-map::before { top: 10px; left: 10px; max-width: calc(100% - 20px); font-size: 8px; }
  .contacts-details { padding: 59px 0 64px; }
  .contacts-details__layout { grid-template-columns: 1fr; gap: 35px; }
  .contacts-details h2 { font-size: 49px; }
  .contacts-details__list > div { grid-template-columns: 92px minmax(0, 1fr); gap: 17px; padding: 18px 0; }
  .contacts-details__list dd { font-size: 13px; }
  .contacts-cta { padding: 57px 0 61px; }
  .contacts-cta__layout { grid-template-columns: 1fr; gap: 31px; }
  .contacts-cta h2 { font-size: clamp(43px, 13vw, 57px); line-height: .89; }
  .contacts-cta__action p { margin-bottom: 20px; }
  .contacts-cta__action a { width: 100%; min-width: 0; }
}

@media (max-width: 360px) {
  .contacts-container { width: calc(100% - 28px); }
  .contacts-hero h1 { font-size: 54px; }
  .contacts-main__communication h2 { font-size: 37px; }
  .contacts-map { margin-right: -14px; margin-left: -14px; }
  .contacts-details__list > div { grid-template-columns: 1fr; gap: 8px; }
  .contacts-cta h2 { font-size: 42px; }
}