.locations-section { padding-block: 4rem; }
.locations-section > .wrap > h2 { font-size: clamp(1.9rem, 3.5vw, 2.75rem); margin-bottom: 2rem; }
.locations-layout { display: grid; grid-template-columns: 200px 1fr; gap: 3rem; align-items: start; }

.loc-side-nav { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 0.15rem; }
.loc-side-nav a {
  font-family: var(--display); font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em;
  font-size: 0.95rem; color: var(--asphalt); text-decoration: none;
  padding: 0.6rem 0.9rem; border-left: 2px solid var(--border); transition: color 0.15s ease-out, border-color 0.15s ease-out, background 0.15s ease-out;
}
.loc-side-nav a:hover { color: var(--ink); background: color-mix(in oklch, var(--sky) 30%, var(--bg)); }
.loc-side-nav a.active { color: var(--accent); border-left-color: var(--accent); background: color-mix(in oklch, var(--sky) 35%, var(--bg)); }

.loc-panels { display: flex; flex-direction: column; gap: 2.5rem; }
.loc-block {
  scroll-margin-top: 90px; padding: 2.25rem; border-radius: 14px;
  background: color-mix(in oklch, var(--sky) 22%, var(--bg));
}
.loc-block-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 2.5rem; align-items: start; }
.loc-photo { border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 3; }
.loc-photo img { width: 100%; height: 100%; object-fit: cover; }
.loc-block h3 { font-size: 1.6rem; margin-bottom: 0.85rem; }
.loc-line { display: flex; gap: 0.8rem; align-items: baseline; padding-block: 0.4rem; font-family: var(--mono); font-size: 0.88rem; }
.loc-line .k { flex: 0 0 auto; font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); min-width: 5.5rem; }
.loc-week { display: grid; grid-template-columns: 3.2rem 1fr; gap: 0.15rem 1rem; font-size: 0.8rem; }
.loc-week .closed-day { color: color-mix(in oklch, var(--ink) 40%, var(--bg)); }
.loc-week .today { color: var(--accent); }
.open-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--amber); margin-right: 0.4rem; }
.open-dot.closed { background: color-mix(in oklch, var(--ink) 30%, var(--bg)); }
.loc-actions { display: flex; gap: 0.9rem; flex-wrap: wrap; margin-top: 1.5rem; margin-bottom: 1.75rem; }
.loc-map { border-radius: 10px; overflow: hidden; border: 1px solid var(--border); grid-column: 1 / -1; }
.loc-map iframe { display: block; width: 100%; height: 340px; border: 0; }

/* Contact form (rendered by Gravity Forms, currently on its "Orbital" theme
   — a different markup/class set than older GF versions: the wrapper is
   `.gform_wrapper.gform-theme--orbital` (not `.gravity-theme`), and a field
   only gets a modifier class when it's HALF width (`.gfield--width-half`) —
   full-width fields get no class at all, so the default span below has to
   be full width with `.gfield--width-half` narrowing it, not the reverse.
   Orbital also ships 4 of its own stylesheets that load after this file
   with their own CSS-custom-property design system and win most specificity
   ties, so the visual properties here (not just the grid mechanics) need
   !important to consistently win instead of being silently overridden. */
.contact-form-section { background: color-mix(in oklch, var(--sky) 35%, var(--bg)); padding-block: 5rem; }
.contact-form-inner { max-width: 760px; margin: 0 auto; }
.contact-form-inner h2 { font-size: clamp(1.9rem, 3.5vw, 2.75rem); margin: 0.75rem 0 1rem; }
.contact-form-inner .lede { font-size: 1.05rem; max-width: 55ch; margin-bottom: 30px;; }
.contact-form-inner .lede strong { color: var(--ink); }

/* Gravity Forms structural overrides to match the source's 2-col field grid */
.contact-form-inner .gform_wrapper { margin-top: 2.5rem; }
.contact-form-inner .gform_fields { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 1.25rem 1.5rem !important; }
.contact-form-inner .gfield { display: flex !important; flex-direction: column !important; gap: 0.4rem !important; grid-column: 1 / -1 !important; min-width: 0 !important; }
.contact-form-inner .gfield--width-half { grid-column: span 1 !important; }
.contact-form-inner .gfield_label,
.contact-form-inner .gform_fields .gfield legend {
  font-family: var(--mono) !important; font-size: 0.7rem !important; letter-spacing: 0.06em !important;
  text-transform: uppercase !important; color: var(--asphalt) !important; font-weight: normal !important; margin: 0 !important;
}
.contact-form-inner .gfield_required { color: var(--accent) !important; font-weight: normal !important; }
.contact-form-inner input[type="text"],
.contact-form-inner input[type="email"],
.contact-form-inner input[type="tel"],
.contact-form-inner select,
.contact-form-inner textarea {
  font-family: var(--body) !important; font-size: 1rem !important; line-height: 1.4 !important; color: var(--ink) !important;
  background: var(--bg) !important; border: 1px solid var(--border) !important; border-radius: 8px !important;
  padding: 0.7rem 0.85rem !important; box-shadow: none !important;
  width: 100% !important; height: auto !important;
}
.contact-form-inner input:focus,
.contact-form-inner select:focus,
.contact-form-inner textarea:focus {
  outline: 2px solid var(--accent) !important; outline-offset: 1px !important; border-color: var(--accent) !important; box-shadow: none !important;
}
.contact-form-inner textarea { resize: vertical !important; min-height: 8rem !important; }
.contact-form-inner .gform_footer { grid-column: 1 / -1; margin-top: 0.5rem; }
.contact-form-inner .gform_footer .gform_button,
.contact-form-inner .gform_footer input[type="submit"] {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0.5rem !important;
  width: 100% !important; text-align: center !important;
  background: var(--accent) !important; color: var(--bg) !important;
  font-family: var(--display) !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important;
  font-size: 1rem !important; padding: 0.6rem 1.4rem !important; border-radius: 8px !important; border: none !important; cursor: pointer !important;
  box-shadow: none !important;
  transition: background 0.15s ease-out !important;
}
.contact-form-inner .gform_footer .gform_button:hover,
.contact-form-inner .gform_footer input[type="submit"]:hover { background: var(--accent-hover) !important; }
.contact-form-inner .gform_confirmation_message { font-size: 1.05rem; }

@media (max-width: 900px) {
  .locations-layout { grid-template-columns: 1fr; }
  .loc-side-nav { position: static; flex-direction: row; flex-wrap: wrap; gap: 0.5rem; }
  .loc-side-nav a { border-left: none; border: 1px solid var(--border); border-radius: 999px; padding: 0.45rem 0.9rem; font-size: 0.82rem; }
  .loc-side-nav a.active { border-color: var(--accent); }
  .loc-block-grid { grid-template-columns: 1fr; }
  .contact-form-inner .gform_fields { grid-template-columns: 1fr !important; }
}
