/* Styles for /contact-directions/: map, contact-directions-page.
   Search for "── <name> ──" to find a part.
   Forum Homini website, editable IIS version v016 20261109 081746. Generated with Claude Opus 5.5. */

/* ── map ── */
/* Map.
   Used on: /contact-directions/.
   Forum Homini website, */
.map[data-c-map] {
  margin: 0;
  scroll-margin-block-start: calc(var(--header-h) + var(--s-4));
}
/* (6 Nov 2026) box-shadow was inset 0 0 0 1px var(--hairline); always overridden by css/site.css, so its value is here now */
.map__frame[data-c-map] {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--paper-deep);
  box-shadow: none;
}
@media (min-width: 641px) {
  .map__frame[data-c-map] {
    aspect-ratio: 4 / 3;
  }
}
@media (min-width: 1025px) {
  .map__frame[data-c-map] {
    aspect-ratio: 5 / 4;
  }
}
.map__poster[data-c-map] {
  position: absolute;
  inset: 0;
  color: var(--ink-muted);
}
/* A faint survey grid behind the drawing (decoration) */
.map__poster[data-c-map]::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(
      to right,
      var(--hairline) 1px,
      transparent 1px),
    linear-gradient(
      to bottom,
      var(--hairline) 1px,
      transparent 1px);
  background-size: 48px 48px;
  opacity: 0.6;
}
.map__poster[data-c-map] svg {
  position: relative;
  display: block;
  inline-size: 100%;
  block-size: 100%;
}
.map__load[data-c-map] {
  position: absolute;
  inset-block-end: var(--s-5);
  inset-inline-start: 50%;
  translate: -50% 0;
  background: var(--paper);
  color: var(--ink);
  box-shadow: var(--shadow-card);
}
.map__load[data-c-map]:hover {
  background: var(--paper);
  border-color: var(--rust);
  color: var(--rust);
}
html:not(.js) .map__load[data-c-map] {
  display: none;
}
.map__frame[data-c-map] iframe {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  border: 0;
}
.map__caption[data-c-map] {
  margin-block-start: var(--s-3);
  font-size: var(--fs-small);
}
.map__caption[data-c-map] a {
  display: inline-flex;
  align-items: center;
  min-block-size: 44px;
  font-weight: var(--wt-label);
}

/* ── contact-directions-page ── */
/* Contact & directions page.
   Used on: /contact-directions/.
   Forum Homini website, */
/* An email address never breaks at its "@" (it moves to the next line whole) */
.cp[data-c-contact-directions-page] a[href^="mailto:"] {
  white-space: nowrap;
}
.cp[data-c-contact-directions-page] {
  padding-block: var(--s-8) var(--section-pad);
}
.cp__grid[data-c-contact-directions-page] {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--s-8);
}
/* ── The directions: the PDF row, "or use", the map line ─────────────────────────────────────────── */
/* (6 Nov 2026) box-shadow was inset 0 0 0 1px var(--hairline); always overridden by css/site.css, so its value is here now */
.cp__dir[data-c-contact-directions-page] {
  margin-block-start: var(--s-8);
  padding: var(--s-5);
  background: var(--paper-deep);
  box-shadow: none;
}
.cp__dir[data-c-contact-directions-page] .downloads {
  margin: 0;
}
/* Inside the card the PDF row needs no rules of its own: the card is the frame */
.cp[data-c-contact-directions-page] .cp__dir[data-c-contact-directions-page] .downloads--list,
.cp[data-c-contact-directions-page] .cp__dir[data-c-contact-directions-page] .downloads--list .downloads__item {
  border: 0;
}
.cp[data-c-contact-directions-page] .cp__dir[data-c-contact-directions-page] .downloads__label {
  font-size: var(--fs-body);
}
/* (6 Nov 2026) letter-spacing was var(--tr-label); always overridden by css/site.css, so its value is here now */
/* (6 Nov 2026) text-transform was uppercase; always overridden by css/site.css, so its value is here now */
/* (6 Nov 2026) color was var(--ink-muted); always overridden by css/site.css, so its value is here now */
.cp__or[data-c-contact-directions-page] {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  margin-block: var(--s-3);
  font-size: var(--fs-label);
  line-height: var(--lh-label);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #e6c27a;
}
.cp__or[data-c-contact-directions-page] strong[data-c-contact-directions-page] {
  font-weight: var(--wt-label);
}
.cp__or[data-c-contact-directions-page]::before,
.cp__or[data-c-contact-directions-page]::after {
  content: "";
  flex: 1;
  border-block-start: 1px solid var(--hairline);
}
.cp__or[data-c-contact-directions-page]::before {
  flex: 0 0 var(--s-6);
}
.cp__gm[data-c-contact-directions-page] {
  margin: 0;
}
/* (6 Nov 2026) color was var(--rust); always overridden by css/site.css, so its value is here now */
.cp__gm-link[data-c-contact-directions-page] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  min-block-size: 56px;
  padding-block: var(--s-2);
  font-family: var(--face-display);
  font-size: var(--fs-lede);
  line-height: var(--lh-lede);
  font-stretch: 100%;
  color: #f3d792;
  text-decoration: none;
}
.cp__gm-link[data-c-contact-directions-page]:visited {
  color: var(--rust);
}
.cp__gm-link[data-c-contact-directions-page] strong[data-c-contact-directions-page] {
  text-wrap: balance;
  font-weight: var(--wt-lede);
  text-decoration-line: underline;
  text-decoration-thickness: var(--link-thickness);
  text-underline-offset: var(--link-offset);
}
.cp__gm-link[data-c-contact-directions-page]:hover strong[data-c-contact-directions-page] {
  text-decoration-thickness: var(--link-thickness-hover);
}
.cp__gm-link[data-c-contact-directions-page] .cp__gm-icon {
  flex: none;
  display: grid;
  inline-size: 40px;
  block-size: 40px;
  padding: 9px;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--soil);
}
/* ── The map ─────────────────────────────────────────────────────────────────────────────────────── */
.cp__h2[data-c-contact-directions-page] {
  margin-block-end: var(--s-5);
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  font-stretch: 100%;
}
/* The V3 line: the page's closing card */
.cp__v3[data-c-contact-directions-page] {
  padding-block-start: var(--s-6);
  border-block-start: 2px solid var(--rust);
}
/* The old one-line version: its opening words set as a line of their own, the tel and email after them
     (the same text, in the same element) */
.cp[data-c-contact-directions-page] .cp__grid[data-c-contact-directions-page] .cp__v3[data-c-contact-directions-page] .contact__oneline > .contact__intro {
  display: block;
  margin-block-end: var(--s-3);
  font-family: var(--face-display);
  font-size: var(--fs-lede);
  font-weight: var(--wt-lede);
  font-stretch: 100%;
  line-height: var(--lh-lede);
  color: var(--heading);
}
@media (min-width: 1025px) {
  .cp[data-c-contact-directions-page] .cp__grid[data-c-contact-directions-page] .cp__v3[data-c-contact-directions-page] .contact__oneline > .contact__link {
    margin-inline-end: var(--s-5);
  }
}
@media (min-width: 641px) and (max-width: 1024px) {
  .cp__dir[data-c-contact-directions-page] {
    padding: var(--s-6);
  }
}
@media (min-width: 1025px) {
  .cp__grid[data-c-contact-directions-page] {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-rows: auto 1fr;
    column-gap: var(--gutter);
    row-gap: var(--s-8);
  }
  .cp__col[data-c-contact-directions-page] {
    grid-column: 1 / span 5;
    grid-row: 1;
  }
  .cp__mapcell[data-c-contact-directions-page] {
    grid-column: 6 / span 7;
    grid-row: 1 / span 2;
    padding-inline-start: var(--s-6);
  }
  .cp__sticky[data-c-contact-directions-page] {
    position: sticky;
    inset-block-start: calc(var(--header-h) + var(--s-6));
  }
  .cp__v3[data-c-contact-directions-page] {
    grid-column: 1 / span 5;
    grid-row: 2;
    align-self: start;
  }
}
@media (min-width: 1440px) {
  .cp__mapcell[data-c-contact-directions-page] {
    padding-inline-start: var(--s-8);
  }
}
