/* ============================================================================
   wcoaching.css — the coaching page (workshops/coaching.html)
   ----------------------------------------------------------------------------
   Decisions FC1 and FC2 (feedback round of 5 November) in docs/brainstorms/
   2026-11-04-workshop-geopende-paginas.md. Loaded after wsoort.css, which holds the parts the three workshop
   pages share (heading, glass card, row washes, the form row).
   Only what coaching adds lives here: the explanation and the route on the
   hero's ground, why one to one and who coaches beside one photo, and the
   hourly rate beside the form.
   No mono type below the heading (round 2): small labels are Inter.
   ========================================================================== */

/* ---- what coaching is with the route beside it (FC2, 2026-11-05) ------------ */
.wc-hero { padding-bottom: clamp(3rem, 6vw, 5rem); }
.wc-uitleg { position: relative; z-index: 1; margin-top: clamp(2rem, 4vw, 3rem); align-items: center; }
.wc-route.wsoort-kaart { padding: clamp(1.5rem, 3vw, 2rem); }
.wc-route h3 { font-size: 1rem; letter-spacing: -0.015em; }
.wc-uitleg .w-kop, .wc-traject .w-kop { font-size: var(--kop-blok); }
.wc-uitleg__tekst { display: grid; gap: 0.9rem; max-width: 52ch; margin-top: 1rem; color: #46464b; font-size: 1.0625rem; line-height: 1.6; text-wrap: pretty; }

/* ---- why one to one and who coaches beside one photo (FC3, 2026-11-05) -------
   The photo is as tall as the text beside it: it fills its cell without adding
   height of its own. Stacked on a narrow screen, it keeps a 5:4 shape. */
.wc-traject { padding-block: clamp(2rem, 4vw, 3rem); }
.wc-traject .w-twee { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: stretch; }
@media (max-width: 60rem) { .wc-traject .w-twee { grid-template-columns: minmax(0, 1fr); } }
.wc-foto { position: relative; min-height: 12rem; margin: 0; }
.wc-foto img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 1.25rem; }
@media (max-width: 60rem) {
  .wc-foto { min-height: 0; }
  .wc-foto img { position: static; height: auto; aspect-ratio: 5 / 4; }
}
.wc-traject .wc-coach__kop { margin-top: clamp(1.75rem, 3vw, 2.25rem); }
.wc-coach__wie { display: flex; align-items: center; gap: 0.75rem; margin-top: 1.25rem; font-weight: 500; }
.wc-coach__wie img { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; }
.wc-coach__wie small { display: block; font-size: 0.875rem; font-weight: 400; color: var(--muted); }

/* ---- the hourly rate under the heading beside the form (FC3) ----------------
   The homepage's soft row wash (wsoort.css .wc-vlek) behind it, the content over it. */
.wc-aanvraag > .w-in { position: relative; z-index: 1; }
.wc-uur__prijs { margin-top: 1.5rem; }
.wc-uur__prijs strong { display: block; font-size: clamp(2rem, 3vw, 2.4rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; color: var(--ink); }
.wc-uur__prijs span { display: block; margin-top: 0.3rem; font-size: 0.875rem; color: var(--muted); }