/* =========================================================
   Les sites des rôtisseurs et l'annuaire.
   Une seule feuille, statique et mise en cache, pour tous
   les sites : la couleur d'accent vient d'une classe posée
   sur <body> (r--rouge, r--or, r--olive, r--ardoise), jamais
   d'un style écrit dans la page (la CSP le refuse). Les
   valeurs reprennent COULEURS de public/pro/site-rendu.js.
   Même famille que Mon Poulet Adoré : crème, Fraunces pour les
   titres, DM Sans pour le texte, des filets plutôt que des
   boîtes. Les photos gardent leur format : la couverture change
   de mise en page selon qu'elle est en portrait, carrée ou 16/9.
   ========================================================= */
.r{
  --paper:#FCFAF5; --paper-2:#F6F1E7; --white:#fff;
  --ink:#2B2118; --ink-soft:#5A4A3A; --ink-mute:#8A7A68;
  --line:#E5DCCB; --line-strong:#D3C6AE;
  --font-display:"Fraunces", Georgia, "Times New Roman", serif;
  --font-sans:"DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --accent:#B0201E; --accent-fonce:#8E1917; --accent-doux:#FBEDEC;
  margin:0; font-family:var(--font-sans); color:var(--ink); background:var(--paper);
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
/* Les quatre couleurs d'accent (après .r, qu'elles remplacent) */
.r--rouge{ --accent:#B0201E; --accent-fonce:#8E1917; --accent-doux:#FBEDEC; }
.r--or{ --accent:#96601A; --accent-fonce:#7A4F13; --accent-doux:#FBF3E4; }
.r--olive{ --accent:#4F6B2E; --accent-fonce:#3C5222; --accent-doux:#EEF3E6; }
.r--ardoise{ --accent:#2F4A6B; --accent-fonce:#233A55; --accent-doux:#E9EEF5; }
.r *{ box-sizing:border-box; }
/* width et height de <img> donnent le format ; height:auto le garde quand la largeur change. */
.r img{ max-width:100%; height:auto; display:block; }
.r h1, .r h2{ font-family:var(--font-display); font-weight:600; line-height:1.1; letter-spacing:-.015em; margin:0; }
.r h2{ font-size:clamp(1.7rem, 3.4vw, 2.3rem); margin-bottom:22px; }
.r p{ margin:0; }
.r a{ color:inherit; }
.r-wrap{ width:min(1040px, 100% - 2.5rem); margin-inline:auto; }
.r-wrap--etroit{ width:min(720px, 100% - 2.5rem); }

.r-eyebrow{
  font-size:.76rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent);
  display:flex; align-items:center; gap:12px; margin-bottom:14px;
}
.r-eyebrow::before{ content:""; width:28px; height:2px; background:var(--accent); flex:none; }
.r-sec--encre .r-eyebrow{ color:#E7C98A; }
.r-sec--encre .r-eyebrow::before{ background:#E7C98A; }

.r-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:600; font-size:1rem; line-height:1.2; text-decoration:none; cursor:pointer;
  padding:15px 26px; min-height:52px; border:1px solid transparent; border-radius:999px;
  background:var(--accent); color:#fff; transition:background-color .2s ease, transform .2s ease;
}
.r-btn:hover{ background:var(--accent-fonce); transform:translateY(-1px); }
.r a.r-btn{ color:#fff; }
.r-btn--ghost, .r a.r-btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.r-btn--ghost:hover{ background:var(--white); border-color:var(--ink); }
.r-btn--wa, .r a.r-btn--wa{ background:#128C7E; color:#fff; }
.r-btn--wa:hover{ background:#0E6F64; }
.r-carte-lien{ font-size:.82rem; font-weight:600; color:var(--accent); text-decoration:underline; text-underline-offset:3px; }

/* ---- En-tête d'un site : la couverture dans son format ---- */
.r-tete{ background:linear-gradient(180deg, var(--accent-doux) 0%, var(--paper) 100%); }
.r-tete__in{ display:grid; grid-template-columns:1fr; gap:clamp(24px, 4vw, 56px); align-items:center; padding-block:clamp(48px, 7vw, 88px) clamp(40px, 6vw, 72px); }
.r-tete--portrait .r-tete__in, .r-tete--carre .r-tete__in, .r-tete--inconnu .r-tete__in{ grid-template-columns:1.05fr .95fr; }
.r-tete--paysage .r-tete__in{ gap:clamp(20px, 3vw, 36px); padding-top:clamp(28px, 4vw, 44px); }
.r-sur{ font-size:.8rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:14px; }
.r-nom{ font-size:clamp(2.3rem, 6vw, 4rem); }
.r-nom em{ font-style:italic; color:var(--accent); }
.r-accroche{ margin-top:16px; font-size:clamp(1.06rem, 1.8vw, 1.25rem); color:var(--ink-soft); max-width:52ch; }
.r-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.r-cover{ margin:0; }
.r-cover img{ width:100%; height:auto; object-fit:cover; border-radius:22px; box-shadow:0 18px 40px rgba(43,33,24,.14); background:var(--paper-2); }
.r-cover--portrait img{ max-height:min(72vh, 660px); }
.r-cover--carre img{ max-height:min(60vh, 540px); }
.r-cover--paysage img{ max-height:min(58vh, 520px); }
.r-cover--inconnu img{ aspect-ratio:4 / 3; }
.r-cover--vide{ aspect-ratio:4 / 3; border:2px dashed var(--line-strong); border-radius:22px; display:grid; place-items:center; color:var(--ink-mute); font-size:.95rem; text-align:center; padding:20px; }

/* ---- Sections ---- */
.r-sec{ padding-block:clamp(44px, 6vw, 76px); border-top:1px solid var(--line); }
.r-sec--doux{ background:var(--paper-2); }
.r-sec--encre{ background:var(--ink); color:var(--paper); border-top:0; }
.r-sec--encre h2{ color:var(--paper); }
.r-sec--photos{ padding-block:clamp(24px, 4vw, 48px); }

/* Le message du moment */
.r-actu{ background:var(--accent-doux); border-top:0; padding-block:clamp(26px, 4vw, 40px); }
.r-actu .r-eyebrow{ margin-bottom:8px; }
.r-actu__texte{ font-size:1.12rem; color:var(--ink); max-width:62ch; }
.r-actu__date{ margin-top:10px; font-size:.86rem; color:var(--ink-mute); }

/* Marchés ou tournée */
.r-marches{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line-strong); }
.r-marches li{ display:grid; grid-template-columns:120px minmax(0, 1fr) auto; gap:4px 22px; align-items:baseline; padding:16px 0; border-bottom:1px solid var(--line); }
.r-marches b{ font-family:var(--font-display); font-weight:600; font-size:1.25rem; color:var(--accent); }
.r-marches span{ font-size:1.08rem; font-weight:600; }
.r-marches em{ display:block; font-style:normal; font-weight:400; color:var(--ink-soft); font-size:.95rem; }
.r-marches .r-carte-lien{ display:inline-block; margin-top:4px; font-weight:600; }
.r-marches small{ font-size:.95rem; color:var(--ink-soft); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* La boutique : adresse et horaires */
.r-adresse{ color:var(--ink-soft); font-size:1.05rem; }
.r-adresse .r-carte-lien{ margin-left:8px; }
.r-horaires{ list-style:none; margin:18px 0 0; padding:0; max-width:520px; border-top:1px solid var(--line-strong); }
.r-horaires li{ display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--line); }
.r-horaires b{ font-family:var(--font-display); font-weight:600; color:var(--accent); }
.r-horaires span{ text-align:right; font-variant-numeric:tabular-nums; }
.r-horaires--ferme span{ color:var(--ink-mute); }

/* La carte */
.r-carte{ list-style:none; margin:0; padding:0; max-width:640px; }
.r-carte li{ display:flex; align-items:baseline; gap:10px; padding:10px 0; font-size:1.05rem; }
.r-carte i{ flex:1; border-bottom:1px dotted var(--line-strong); min-width:24px; transform:translateY(-4px); }
.r-carte b{ font-family:var(--font-display); font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.r-carte__titre{ display:block !important; font-family:var(--font-display); font-weight:600; font-size:1.15rem; color:var(--accent); padding:22px 0 6px !important; border-bottom:1px solid var(--line-strong); margin-bottom:4px; }
.r-carte__titre:first-child{ padding-top:0 !important; }
/* Sous le nom d'un produit (page publiée par la plateforme) : sa description,
   puis ses allergènes, comme dans plateforme/public/rotisseurs.css. */
.r-carte__desc{ display:block; margin-top:2px; font-size:.9rem; line-height:1.45; color:var(--ink-soft); }
.r-carte__allergenes{ display:block; margin-top:2px; font-size:.8rem; line-height:1.4; color:var(--ink-soft); }

.r-texte p + p{ margin-top:14px; }
.r-texte{ color:var(--ink-soft); font-size:1.05rem; }

/* La galerie : chaque photo dans son format, en colonnes */
.r-galerie{ columns:3 240px; column-gap:12px; }
.r-galerie img{ width:100%; height:auto; display:block; break-inside:avoid; margin:0 0 12px; border-radius:16px; background:var(--paper-2); object-fit:cover; }
.r-galerie img:not([width]){ aspect-ratio:4 / 3; }

/* Contact */
.r-tel{ margin:4px 0 18px; }
.r-tel a{ font-family:var(--font-display); font-size:clamp(1.8rem, 5vw, 3rem); font-weight:600; text-decoration:none; letter-spacing:.02em; font-variant-numeric:tabular-nums; }
.r-tel a:hover{ text-decoration:underline; text-decoration-color:#E7C98A; }
.r-tel--vide{ color:rgba(252,250,245,.45); font-family:var(--font-display); font-size:1.6rem; }
.r-sec--encre .r-actions{ margin:0 0 18px; }
.r-services{ list-style:none; margin:0 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.r-services li{ font-size:.86rem; font-weight:600; padding:7px 13px; border-radius:999px; border:1px solid rgba(252,250,245,.25); color:rgba(252,250,245,.9); }
.r-contact__adresse{ margin:0 0 16px; color:rgba(252,250,245,.85); }
.r-contact__adresse a{ color:#E7C98A; font-weight:600; }
.r-liens{ display:flex; flex-wrap:wrap; gap:8px 22px; }
.r-liens a{ color:#E7C98A; font-weight:600; }
.r-liens:empty{ display:none; }

.r-pied{ padding:26px 0 34px; font-size:.9rem; color:var(--ink-mute); border-top:1px solid var(--line); }
.r-pied p + p{ margin-top:4px; }
.r-pied a{ color:var(--ink-soft); font-weight:600; }

/* ---- L'annuaire ---- */
.r-tete--annuaire{ padding-block:clamp(40px, 6vw, 72px) clamp(28px, 4vw, 44px); }
.r-marque{ font-size:.82rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:16px; }
.r-marque a{ color:var(--accent); text-decoration:none; }
.r-tete--annuaire .r-nom{ font-size:clamp(2rem, 5vw, 3.4rem); max-width:18ch; }
.r-cherche{ margin-top:26px; max-width:520px; }
.r-cherche input{
  width:100%; font:inherit; font-size:1.05rem; color:var(--ink); padding:0 18px; height:54px;
  border:1.5px solid var(--line-strong); border-radius:14px; background:var(--white);
}
.r-cherche input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(176,32,30,.13); }
.r-compte{ margin:22px 0 6px; font-size:.86rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); }
.r-dep{ padding-block:22px 6px; }
.r-dep h2{ font-size:1.35rem; margin-bottom:8px; color:var(--ink-soft); }
.r-liste{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line-strong); }
.r-liste li{ border-bottom:1px solid var(--line); }
.r-liste a{ display:grid; grid-template-columns:72px minmax(0, 1fr) auto; gap:4px 18px; align-items:center; padding:14px 0; text-decoration:none; }
.r-liste a:hover .r-liste__nom{ color:var(--accent); }
.r-liste img, .r-mono{ width:72px; height:72px; border-radius:16px; object-fit:cover; background:var(--paper-2); }
.r-mono{ display:grid; place-items:center; font-family:var(--font-display); font-size:1.8rem; font-weight:600; color:var(--accent); background:var(--accent-doux); }
.r-liste__corps{ min-width:0; }
.r-liste__nom{ display:block; font-family:var(--font-display); font-size:1.3rem; font-weight:600; line-height:1.15; }
.r-liste__ville{ display:block; margin-top:3px; color:var(--ink-soft); font-size:.95rem; }
.r-liste__accroche{ display:block; margin-top:4px; color:var(--ink-mute); font-size:.9rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.r-jours{ display:flex; gap:4px; flex-wrap:wrap; justify-content:flex-end; max-width:150px; }
.r-jours b{ font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:4px 7px; border-radius:999px; background:var(--accent-doux); color:var(--accent-fonce); }
.r-vide{ padding:30px 0; color:var(--ink-mute); }
.r-appel{ margin:44px 0 40px; padding:clamp(26px, 4vw, 44px); border:1px solid var(--line-strong); border-radius:22px; background:var(--white); }
.r-appel h2{ margin-bottom:12px; }
.r-appel p{ color:var(--ink-soft); max-width:60ch; }
.r-appel p + p{ margin-top:22px; display:flex; flex-wrap:wrap; gap:10px; }

@media (max-width: 760px){
  .r-tete__in{ grid-template-columns:1fr !important; }
  .r-cover{ order:-1; }
  .r-cover img{ border-radius:16px; }
  .r-cover--portrait img{ max-height:72vh; }
  .r-cover--carre img, .r-cover--paysage img{ max-height:none; }
  .r-marches li{ grid-template-columns:1fr; gap:2px; }
  .r-marches small{ white-space:normal; }
  .r-galerie{ columns:2 140px; }
  .r-liste a{ grid-template-columns:60px minmax(0, 1fr); }
  .r-liste img, .r-mono{ width:60px; height:60px; }
  .r-jours{ grid-column:2; justify-content:flex-start; max-width:none; }
  .r-actions .r-btn{ width:100%; }
}