/* ABC Canada 2027 — module Community Stay.
   Pages 14, 15 et 16 du cahier des charges (§32 à §35). Charge après
   site.css, page.css et form.css : tout ce qui est ici s'appuie sur les
   tokens de Modernist (--pad-x, --rule, --accent-text…), réutilise les
   primitives de site.css (.wrap, .section, .eyebrow, .btn, .flow,
   .stay-tabs), le chrome de page.css (.page-hero, .breadcrumb, .page-facts,
   .faq) et les formulaires de form.css sans les redéfinir. Ne reste ici que
   ce qui parle vraiment du module. */

/* ── Types d'espace (§34) ─────────────────────────────────────────────── */
.host-head {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 32px 48px;
  align-items: end; margin-bottom: 48px;
}
/* Le chapô seulement : l'eyebrow est imbriqué et garde sa couleur d'accent. */
.host-head > p { margin: 0; font-size: 17px; color: var(--ink-muted); }
.spaces { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); }
.space { padding: 28px 24px; border-left: var(--rule-soft); border-top: var(--rule-soft); }
.space:first-child { padding-left: 0; border-left: 0; }
.space-n { margin: 0 0 14px; font-size: 11px; letter-spacing: .14em; font-weight: 600; color: var(--accent-text); }
.space h3 { margin: 0 0 8px; font-size: 20px; }
.space p { margin: 0; font-size: 13px; color: var(--ink-60); }

/* ── Privacy UX (§35) ─────────────────────────────────────────────────── */
.privacy { background: var(--color-surface); }
.privacy-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: start; }
.chain { display: flex; flex-direction: column; gap: 0; margin-top: 8px; }
.chain-step {
  display: grid; grid-template-columns: 44px 1fr; gap: 18px;
  padding: 20px 0; border-bottom: var(--hair);
}
.chain-step:first-child { border-top: var(--rule); }
.chain-n {
  margin: 0; font-size: 13px; font-weight: var(--font-heading-weight);
  letter-spacing: .04em; color: var(--accent-text);
}
.chain-step h3 { margin: 0 0 4px; font-size: 18px; }
.chain-step p { margin: 0; font-size: 13px; color: var(--ink-60); }
.privacy-panel { padding: 32px 30px; background: var(--color-text); color: var(--color-bg); }
.privacy-panel h3 { margin: 0 0 6px; font-size: 22px; }
.privacy-panel > p { margin: 0 0 20px; font-size: 14px; color: var(--ground-70); }
.privacy-list { margin: 0; padding: 0; list-style: none; }
.privacy-list li {
  display: grid; grid-template-columns: 18px 1fr; gap: 12px;
  padding: 12px 0; font-size: 14px; border-top: var(--rule-inverse);
}
.privacy-list li::before { content: "✕"; color: var(--color-accent-500); font-size: 13px; line-height: 1.6; }
.privacy-note { margin: 20px 0 0; font-size: 12px; color: var(--ground-55); }

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
  .privacy-grid { grid-template-columns: 1fr; gap: 36px; }
  .host-head { grid-template-columns: 1fr; align-items: start; }
}

@media (max-width: 760px) {
  .space { padding: 22px 0; border-left: 0; }
}