@layer contact {
  /* CONTACT — a static map image + a semantic directions list (no iframe, no JS).
     All rem. Markup built by inject.renderContact:
       <app-contact><h2></h2><p></p><img><ol><li>…</li></ol></app-contact> */
  app-contact {
    display: grid;
    gap: 1rem;
    margin-inline: 1rem;
    align-content: start;
  }
  app-contact > * { margin: 0; }
  app-contact > img {
    inline-size: 100%;
    max-block-size: 24rem;
    object-fit: cover;
    border-radius: 0.75rem;
  }
  app-contact > ol {
    display: grid;
    gap: 0.5rem;
    padding-inline-start: 1.25rem;
    text-wrap: pretty;
  }
}