/* Maquettes Planete Bordeaux - feuille commune.
   Chaque page fait 1440 de large. Portrait = 2036 de haut (A4), paysage = 1018 (A4 couche).
   L'ecran d'Emmanuel fait 1440 : sans le zoom ci-dessous la page deborde et se coupe a droite.
   Le seuil est a 1439 pour que le rendu headless (fenetre de 1440) ne soit jamais zoome. */

:root{
  --bordeaux:#6E1A2E; --bordeaux-clair:#8E2C43; --terre:#C25B45;
  --pierre:#F3EDE4; --papier:#FBF9F6; --vigne:#5C6E4A; --or:#C9A227;
  --encre:#2A2320; --encre-doux:#6B615B; --ligne:#E4DACB;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Manrope',-apple-system,'Segoe UI',system-ui,sans-serif;
  color:var(--encre);background:var(--papier);
  width:1440px;margin:0 auto;-webkit-font-smoothing:antialiased;
}
@media screen and (max-width:1439px){ body{zoom:.92} }

.bandeau-maquette{
  background:var(--encre);color:#fff;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;text-align:center;padding:7px;font-weight:600;
}

/* ---------- entete commune ---------- */
header{background:#fff;border-bottom:1px solid var(--ligne)}
.haut{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 56px;background:var(--pierre);font-size:13px;color:var(--encre-doux);
}
.haut strong{color:var(--bordeaux);font-weight:700}
.nav{display:flex;align-items:center;gap:30px;padding:18px 56px}
.logo{display:flex;flex-direction:column;line-height:1;margin-right:8px;flex:none}
.logo b{font-size:23px;font-weight:800;color:var(--bordeaux);letter-spacing:-.02em}
.logo span{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-doux);margin-top:5px;white-space:nowrap}
.nav a{color:var(--encre);text-decoration:none;font-size:15px;font-weight:600;white-space:nowrap}
.nav a.on{color:var(--bordeaux)}
.recherche{
  margin-left:auto;display:flex;align-items:center;gap:9px;
  border:1.5px solid var(--ligne);border-radius:999px;padding:9px 18px;
  width:228px;flex:none;color:var(--encre-doux);font-size:14px;background:var(--papier);white-space:nowrap;
}

/* ---------- bandeau de page ---------- */
.hero{position:relative;overflow:hidden;background:var(--bordeaux)}
.hero-fond{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 22% 32%, rgba(201,162,39,.34), transparent 46%),
    radial-gradient(circle at 76% 68%, rgba(194,91,69,.42), transparent 52%),
    linear-gradient(118deg,#6E1A2E 0%,#8E2C43 52%,#A8452F 100%);
}
.hero-fond.vigne{
  background:
    radial-gradient(circle at 26% 30%, rgba(201,162,39,.26), transparent 48%),
    linear-gradient(120deg,#3F4E33 0%,#5C6E4A 55%,#7C8B5E 100%);
}
.hero-fond.terre{
  background:
    radial-gradient(circle at 70% 34%, rgba(201,162,39,.3), transparent 50%),
    linear-gradient(122deg,#A8452F 0%,#C25B45 58%,#D4785C 100%);
}
.hero-grain{
  position:absolute;inset:0;opacity:.16;
  background-image:repeating-linear-gradient(46deg,rgba(255,255,255,.5) 0 1px,transparent 1px 5px);
}
.hero-texte{position:relative;padding:42px 56px;max-width:840px;color:#fff}
.hero-texte .surtitre{font-size:12px;letter-spacing:.2em;text-transform:uppercase;opacity:.9;font-weight:700;margin-bottom:13px}
.hero-texte h1{font-size:40px;line-height:1.14;font-weight:800;letter-spacing:-.02em}
.hero-texte p{font-size:17px;line-height:1.6;margin-top:15px;opacity:.94;max-width:620px}
.hero-boutons{display:flex;gap:13px;margin-top:24px}
.btn{display:inline-block;padding:13px 25px;border-radius:999px;font-size:15px;font-weight:700;text-decoration:none}
.btn-plein{background:#fff;color:var(--bordeaux)}
.btn-vide{border:1.5px solid rgba(255,255,255,.72);color:#fff}
.btn-bordeaux{background:var(--bordeaux);color:#fff}
.btn-terre{background:var(--terre);color:#fff}

/* ---------- bande d'horaires ---------- */
.bande-horaires{
  display:flex;align-items:center;gap:16px;padding:14px 56px;
  background:var(--pierre);border-bottom:1px solid var(--ligne);font-size:14.5px;
}
.point{width:8px;height:8px;border-radius:50%;background:#3F8B4F;flex:none}
.point.ferme{background:#B4453A}
.bande-horaires b{font-weight:800}
.bande-horaires .sep{color:var(--ligne)}
.bande-horaires .h{font-variant-numeric:tabular-nums}

/* ---------- sections ---------- */
.section{padding:38px 56px}
.section.pierre{background:var(--pierre)}
.titre-section{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:20px;gap:24px}
.titre-section h2{font-size:29px;font-weight:800;letter-spacing:-.015em}
.titre-section p{color:var(--encre-doux);font-size:15px;margin-top:8px;max-width:660px;line-height:1.55}
.lien-plus{color:var(--bordeaux);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}

/* ---------- cartes ---------- */
.grille{display:grid;gap:19px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.carte{background:#fff;border:1px solid var(--ligne);border-radius:17px;overflow:hidden;display:flex;flex-direction:column}
.carte-haut{height:6px}
.carte-corps{padding:20px 22px 18px;flex:1;display:flex;flex-direction:column}
.carte h3{font-size:18px;font-weight:800;letter-spacing:-.01em}
.carte .pour{font-size:12.5px;color:var(--encre-doux);margin-top:5px;font-weight:600}
.carte .desc{font-size:14px;color:var(--encre-doux);line-height:1.55;margin-top:11px;flex:1}
.carte-lien{display:block;padding:11px 22px;border-top:1px solid var(--ligne);font-size:14px;font-weight:700;text-decoration:none}
.pastille{width:37px;height:37px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:12px}

/* fausse photo : un aplat texture, jamais une vraie image */
.photo{
  background:linear-gradient(140deg,#E8E0D3 0%,#DCD3C4 55%,#D2CBBC 100%);
  position:relative;overflow:hidden;
}
.photo::after{
  content:"";position:absolute;inset:0;opacity:.5;
  background:repeating-linear-gradient(58deg,rgba(255,255,255,.5) 0 2px,transparent 2px 9px);
}
.photo.chai{background:linear-gradient(140deg,#DCD8CB 0%,#C9CBB8 60%,#B8BCA6 100%)}
.photo.salle{background:linear-gradient(140deg,#EFEAE1 0%,#E3DDD2 60%,#D6D0C4 100%)}
.photo.vin{background:linear-gradient(140deg,#E2D2CE 0%,#D3B9B6 60%,#C0A29F 100%)}
.photo .lg{
  position:absolute;left:12px;bottom:10px;background:rgba(42,35,32,.62);color:#fff;
  font-size:10.5px;padding:3px 9px;border-radius:99px;font-weight:700;letter-spacing:.03em;
}

/* ---------- etiquettes ---------- */
.etiq{display:flex;gap:6px;flex-wrap:wrap}
.etiq i{font-style:normal;font-size:12px;padding:5px 11px;border-radius:99px;font-weight:700;background:var(--pierre);color:var(--encre)}
.etiq i.vigne{background:#EBEFE4;color:var(--vigne)}
.etiq i.on{background:var(--bordeaux);color:#fff}
.etiq i.contour{background:#fff;border:1px solid var(--ligne);color:var(--encre-doux)}

/* ---------- blocs ---------- */
.bloc{background:#fff;border:1px solid var(--ligne);border-radius:17px;overflow:hidden}
.bloc-entete{padding:22px 25px 0}
.bloc-entete h3{font-size:21px;font-weight:800;letter-spacing:-.01em}
.bloc-entete p{color:var(--encre-doux);font-size:14px;margin-top:6px;line-height:1.55}

/* ---------- carte geographique ---------- */
.carto{border-radius:12px;position:relative;overflow:hidden;
  background:linear-gradient(150deg,#EFEADF 0%,#E3E7D8 100%);border:1px solid var(--ligne)}
.riviere{position:absolute;background:#CFD9DE;border-radius:99px}
.pt{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--bordeaux);opacity:.72}
.pt.gros{width:18px;height:18px;background:var(--terre);opacity:1;border:2.5px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.24)}
.fiche-flottante{
  position:absolute;background:#fff;border-radius:11px;padding:13px 15px;
  box-shadow:0 5px 20px rgba(42,35,32,.17);
}
.fiche-flottante b{font-size:14px;display:block}
.fiche-flottante span{font-size:12.5px;color:var(--encre-doux);display:block;margin-top:3px}

/* ---------- evenements ---------- */
.evt{display:flex;gap:15px;padding:14px 25px;border-top:1px solid var(--ligne)}
.date{width:54px;flex:none;text-align:center;background:var(--pierre);border-radius:10px;padding:8px 0}
.date b{display:block;font-size:20px;font-weight:800;color:var(--bordeaux);line-height:1}
.date span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--encre-doux);margin-top:3px;font-weight:700}
.evt h4{font-size:15px;font-weight:700}
.evt p{font-size:13px;color:var(--encre-doux);margin-top:4px;line-height:1.5}
.evt .ou{font-size:12px;color:var(--vigne);font-weight:700;margin-top:5px}

/* ---------- tableaux ---------- */
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;
   color:var(--encre-doux);padding:0 14px 9px;border-bottom:1.5px solid var(--encre)}
td{padding:13px 14px;border-bottom:1px solid var(--ligne);font-size:14.5px;vertical-align:middle}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td b{font-weight:800}

/* ---------- formulaires ---------- */
.form{background:#fff;border:1px solid var(--ligne);border-radius:17px;padding:26px 28px}
.champ{margin-bottom:15px}
.champ label{display:block;font-size:13px;font-weight:800;margin-bottom:6px}
.champ .saisie{
  border:1.5px solid var(--ligne);border-radius:11px;padding:13px 15px;
  background:var(--papier);color:#A79C92;font-size:14.5px;
}
.champ .saisie.grand{min-height:82px}
.deux-champs{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.info{
  display:flex;gap:12px;align-items:flex-start;background:var(--pierre);
  border-left:4px solid var(--or);border-radius:10px;padding:14px 17px;margin-bottom:20px;
}
.info b{font-size:14.5px;font-weight:800}
.info p{font-size:13.5px;color:var(--encre-doux);margin-top:3px;line-height:1.5}

/* ---------- pied ---------- */
footer{background:var(--encre);color:#CFC6BE;padding:26px 56px;font-size:13px;margin-top:12px}
footer b{color:#fff}
footer .fin{opacity:.72;display:block;margin-top:4px}
