/* MUNGO Fret & Transit — contact (complète styles.css ; ordre des couches déclaré dans styles.css) */
@layer pages {
  /* ---------- contact ---------- */
  .chans { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
  .chan { padding: 1.2rem; border-radius: var(--r-3); background: var(--c-white); display: grid; gap: 0.3rem; align-content: start; }
  .chan > .i { width: 2.25rem; height: 2.25rem; padding: 0.45rem; border-radius: 50%; background: var(--c-marine); color: var(--c-white); margin-bottom: 0.3rem; }
  .chan h2 { font-size: 1.0625rem; }
  .chan a { font-weight: 700; overflow-wrap: anywhere; display: inline-flex; min-height: 2.5rem; align-items: center; }
  .chan p.muted { font-size: 0.875rem; }
  .chan__st:empty { display: none; }
  .cform-wrap { display: grid; }
  .cform { display: grid; gap: var(--sp-5); padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--r-3); background: var(--c-white); }
  .cform__grid { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
  .cform__full { grid-column: 1 / -1; }
  .cform__ok { padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: var(--r-3); background: var(--c-white); border: 2px solid var(--c-ok); display: grid; gap: 0.75rem; }
  .cform__ok h3 { display: flex; gap: 0.5rem; align-items: center; color: var(--c-ok); }
  .addr { display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
  .addr li { padding: 1.1rem 1.2rem; border-radius: var(--r-3); background: var(--c-white); display: grid; gap: 0.25rem; }
  .addr h3 { font-size: 1rem; }
  .addr p { font-size: 0.9375rem; }
  .addr .mono { font-size: 0.875rem; color: var(--c-marine); }

}
@layer pages {
  /* L'en-tête de contact : le texte, puis les quatre canaux côte à côte */
  .page-hero--plain .page-hero__grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
  /* Photo à droite du titre sur grand écran ; masquée sur mobile pour garder les canaux sous le pouce */
  .contact__media { display: none; }
  @media (min-width: 64em) {
    .page-hero--plain .page-hero__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); align-items: center; }
    .contact__media { display: block; aspect-ratio: 5 / 4; }
    .contact__media .ph { object-position: 60% 62%; }
    .page-hero--plain .chans { grid-column: 1 / -1; }
  }
  .page-hero--plain .page-hero__txt h1 { max-width: 22ch; }
  @media (min-width: 40em) { .chans { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 64em) { .chans { grid-template-columns: repeat(4, 1fr); } }
}