/* ==========================================================================
   Artistic Dimension — Contact
   ========================================================================== */

/* --------------------------------------------------------------------------
   Hero highlights
   -------------------------------------------------------------------------- */

.cnt-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 2.4vw, 2.4rem);
  margin-top: clamp(1.6rem, 2.8vw, 2.6rem);
}

.cnt-highlight {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  max-width: 15rem;
}

.cnt-highlight__title {
  font-family: var(--ad-font-sans);
  font-size: var(--ad-fs-small);
  font-weight: 500;
  color: var(--ad-ink);
  margin-bottom: .12rem;
}

.cnt-highlight__text { font-size: var(--ad-fs-label); line-height: 1.65; color: var(--ad-body); }

/* --------------------------------------------------------------------------
   Message + contact details
   -------------------------------------------------------------------------- */

.cnt-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
}

.cnt-panel__col {
  padding: clamp(1.4rem, 1rem + 2vw, 2.8rem) clamp(1.2rem, .8rem + 1.8vw, 2.6rem);
}

.cnt-panel__col + .cnt-panel__col { border-left: 1px solid var(--ad-line-soft); }

.cnt-heading {
  font-family: var(--ad-font-display);
  font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2.15rem);
  font-weight: 500;
  color: var(--ad-ink);
  position: relative;
  padding-bottom: .55rem;
  margin-bottom: 1.1rem;
}

.cnt-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 54px;
  height: 1px;
  background: var(--ad-gold);
}

.cnt-form { display: flex; flex-direction: column; gap: .85rem; }

.cnt-form__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.cnt-form .ad-btn { align-self: flex-start; }

.cnt-details { display: flex; flex-direction: column; gap: clamp(1rem, 1.8vw, 1.6rem); }

.cnt-detail { display: flex; align-items: flex-start; gap: clamp(.8rem, 1.4vw, 1.2rem); }

.cnt-detail__label {
  font-family: var(--ad-font-sans);
  font-size: var(--ad-fs-small);
  font-weight: 500;
  color: var(--ad-ink);
  margin-bottom: .25rem;
}

.cnt-detail__value {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  font-size: var(--ad-fs-small);
  color: var(--ad-body);
}

.cnt-detail__value a:hover { color: var(--ad-gold); }

/* --------------------------------------------------------------------------
   Consultation band
   -------------------------------------------------------------------------- */

.cnt-consult {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 0;
  background: var(--ad-surface);
  border: 1px solid var(--ad-line-soft);
  border-radius: var(--ad-r-lg);
  overflow: hidden;
}

.cnt-consult__media { overflow: hidden; min-height: clamp(240px, 24vw, 340px); background: var(--ad-surface-2); }
.cnt-consult__media img { width: 100%; height: 100%; object-fit: cover; }

.cnt-consult__body {
  padding: clamp(1.3rem, 1rem + 1.8vw, 2.4rem);
  display: flex;
  flex-direction: column;
  gap: .85rem;
  justify-content: center;
}

.cnt-consult__types {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .5rem;
  margin-block: .5rem;
}

.cnt-type {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  text-align: center;
  padding-inline: .35rem;
  border-left: 1px solid var(--ad-line-soft);
}

.cnt-type:first-child { border-left: 0; }

.cnt-type svg {
  width: clamp(24px, 2.2vw, 30px);
  height: clamp(24px, 2.2vw, 30px);
  stroke: var(--ad-brown);
  fill: none;
  stroke-width: 1.3;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke var(--ad-t-fast) var(--ad-ease), transform var(--ad-t) var(--ad-ease-out);
}

.cnt-type:hover svg { stroke: var(--ad-gold); transform: translateY(-3px); }

.cnt-type__name {
  font-family: var(--ad-font-sans);
  font-size: var(--ad-fs-label);
  font-weight: 400;
  color: var(--ad-ink-soft);
  line-height: 1.5;
}

.cnt-consult__body .ad-btn { align-self: flex-start; }

/* --------------------------------------------------------------------------
   Service area
   -------------------------------------------------------------------------- */

.cnt-area {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr);
  gap: clamp(1.2rem, 2.4vw, 2.6rem);
  align-items: center;
}

.cnt-area__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}

.cnt-city {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
  padding: clamp(.9rem, 1.6vw, 1.5rem) .5rem;
  border-left: 1px solid var(--ad-line-soft);
  border-radius: var(--ad-r-sm);
  text-align: center;
  transition: background-color var(--ad-t) var(--ad-ease), transform var(--ad-t) var(--ad-ease-out);
}

.cnt-city:first-child { border-left: 0; }
.cnt-city:hover { background: var(--ad-surface-2); transform: translateY(-3px); }

.cnt-city.is-primary { background: var(--ad-gold-tint); border-left-color: transparent; }
.cnt-city.is-primary .cnt-city__name { color: var(--ad-gold); }

.cnt-city svg {
  width: clamp(34px, 3.2vw, 46px);
  height: clamp(34px, 3.2vw, 46px);
  stroke: var(--ad-ink-soft);
  fill: none;
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cnt-city.is-primary svg { stroke: var(--ad-gold); }

.cnt-city__name {
  font-family: var(--ad-font-sans);
  font-size: var(--ad-fs-small);
  font-weight: 400;
  color: var(--ad-ink-soft);
  line-height: 1.4;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
  .cnt-panel { grid-template-columns: 1fr; }
  .cnt-panel__col + .cnt-panel__col { border-left: 0; border-top: 1px solid var(--ad-line-soft); }
  .cnt-consult { grid-template-columns: 1fr; }
  .cnt-consult__media { min-height: clamp(210px, 38vw, 300px); }
  .cnt-area { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .cnt-form__row { grid-template-columns: 1fr; }
  .cnt-consult__types { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1rem; }
  .cnt-type:nth-child(odd) { border-left: 0; }
  .cnt-area__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cnt-city:nth-child(odd) { border-left: 0; }
}