/* contact-locations.css — scoped to .locations */

/* Fonts (match other sections) */
@font-face {
  font-family: "Arizona Flare";
  src: url("../fonts/arizona_flare_300_normal_headings_h1-h6.woff2") format("woff2");
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Helveesti";
  src: url("../fonts/helveesti_400_normal_body_ui.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}

.locations {
  --loc-bg: #F8F2E9;   /* page bg */
  --loc-ink: #170B01;  /* page ink */
  --loc-card: #BDCFFB; /* matches popup/cta feel */
  --loc-border: rgba(23,11,1,0.12);

  background: var(--loc-bg);
  color: var(--loc-ink);
  /* use global section spacing from base.css */
  margin: 40px;
}

.locations__header { margin-bottom: 24px; }
.locations__title {
  font-family: "Arizona Flare", serif;
  font-weight: 300;
  font-size: clamp(24px, 2.6vw, 36px);
  line-height: 1.3;
  margin: 0 0 8px 0;
}
.locations__desc {
  font-family: "Helveesti", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.35;
  margin: 0;
}

.locations__grid {
  list-style: none;
  padding: 0; margin: 24px 0 0 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 3vw, 28px);
}

.locations__card {
  background: #bebdfb;
  border: 1px solid var(--loc-card);
  border-radius: 3px;
  padding: clamp(16px, 2.6vw, 20px);
}

.locations__card-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  margin-bottom: 8px;
}
.locations__city {
  font-family: "Arizona Flare", serif;
  font-weight: 300;
  font-size: clamp(18px, 2.2vw, 22px);
  line-height: 1.25;
  margin: 0;
}
.locations__tag {
  font-family: "Helveesti", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 12px; opacity: 0.85;
}

.locations__address { margin: 0; display: grid; gap: 8px; }
.locations__link {
  display: inline-flex; align-items: top; gap: 8px;
  text-decoration: none; color: var(--loc-ink);
  border-bottom: 1px dotted var(--loc-ink);
  padding-bottom: 2px;
}
.locations__link:focus-visible {
  outline: 2px solid #AE1B74; /* project accent */
  outline-offset: 2px;
  border-radius: 6px;
}

.locations__cta {
  margin-top: clamp(20px, 3vw, 28px);
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.locations__btn {
  appearance: none;
  border: 2px solid white;
  background: #170B01;
  color: #F8F2E9;
  font-family: "Helveesti", system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  font-size: 14px;
  padding: 12px 18px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none;
}
.locations__btn:hover { transform: translateY(-1px); transition: transform 160ms ease; }
.locations__note {
  margin: 0; font-size: 16px; opacity: 0.9;
}

/* Responsive */
@media (max-width: 900px) {
  .locations__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .locations__grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px){
    .locations{
        margin: 40px 0px;
    }
}