@charset "UTF-8";
.contact-section {
  color: var(--fg);
  padding: clamp(3.5rem, 8vw, 6rem) 1.25rem;
  position: relative;
  isolation: isolate;
  background: #ffffff;
  border-top: 1px solid var(--border, rgba(15, 23, 42, 0.08));
  border-bottom: 1px solid var(--border-soft, rgba(148, 163, 184, 0.16));
}

  #contact .contact-container { max-width: 1200px; margin-inline: auto; padding: clamp(24px, 4vw, 56px); }

  #contact #contact-heading { font-size: clamp(26px, 3.6vw, 44px); line-height: 1.1; margin: .4rem 0 1rem; font-weight: 800; }

  #contact .grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: clamp(20px, 3.6vw, 36px);
    align-items: start;
  }

  @media (max-width: 980px) {
    #contact .grid { grid-template-columns: 1fr; }
  }

  #contact .card {
    background: var(--card-soft);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: clamp(14px, 1.6vw, 18px);
  }

  #contact .split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .8rem;
  }

  @media (max-width: 720px) {
    #contact .split { grid-template-columns: 1fr; }
  }

  #contact address { font-style: normal; line-height: 1.6; }

  #contact .row {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    padding: .5rem 0;
    border-bottom: 1px dashed var(--border-softer);
  }

  #contact .row:last-child { border-bottom: none; }

  #contact .i { width: 20px; height: 20px; flex: 0 0 auto; opacity: .9; }

  #contact .label { color: var(--fg-softer); font-size: .95rem; }

  #contact .value a {
    color: var(--brand-2);
    text-decoration: underline dotted;
    text-underline-offset: 3px;
  }

  #contact .hours {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .35rem 1.2rem;
    font-size: .95rem;
  }

  #contact .hours dd { margin: 0; color: var(--fg-soft); }
  #contact .hours dt { color: var(--fg-softer); }

  #contact .map-wrap {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--border);
    background: var(--card);
  }

  #contact .map-iframe {
    width: 100%;
    aspect-ratio: 16/10;
    border: 0;
    filter: grayscale(.1) saturate(1.1);
  }

  #contact .map-note {
    position: absolute;
    left: 12px;
    bottom: 12px;
    background: color-mix(in srgb, var(--card) 85%, var(--gf-primary-10a) 15%);
    border: 1px solid var(--border);
    color: var(--fg-softer);
    font-size: .85rem;
    padding: .35rem .55rem;
    border-radius: 10px;
  }

  #contact .smallprint { margin-top: .8rem; color: var(--muted); font-size: .9rem; }
