/* ===== Thomas Walquemane — feuille de style commune ===== */
:root{
  --cuir:#743f54; --brun:#8f5670; --sepia:#b07489; --or:#d9a7b8;
  --creme:#faf2f5; --creme-2:#f4e6ec; --creme-3:#ecd6df;
  --cta:#b76a86; --cta-h:#9c536e; --texte:#3e2b34; --texte-doux:#7a5c67; --blanc:#fffbfc;
  --ombre:0 12px 34px rgba(74,49,32,.18);
  --serif:"EB Garamond","Garamond","Book Antiqua","Palatino Linotype",Georgia,serif;
  --sans:"EB Garamond","Garamond","Book Antiqua",Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--serif);color:var(--texte);background:var(--creme);
  line-height:1.75;font-size:18.5px;-webkit-font-smoothing:antialiased}
a{color:var(--cta)}
.wrap{max-width:1010px;margin:0 auto;padding:0 24px}
sup{font-size:.62em}

/* ---- menu haut ---- */
header.topbar{position:sticky;top:0;z-index:60;background:var(--creme);
  border-bottom:1px solid var(--creme-3);box-shadow:0 2px 10px rgba(74,49,32,.06)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand .psi{font-size:26px;color:var(--sepia);line-height:1}
.brand b{font-size:16px;font-weight:600;letter-spacing:.3px;color:var(--cuir)}
.brand small{display:block;font-size:11.5px;color:var(--texte-doux);font-family:var(--sans);letter-spacing:.4px}
nav.menu{display:flex;flex-wrap:wrap;gap:4px}
nav.menu a{color:var(--cuir);text-decoration:none;font-size:14px;letter-spacing:1.3px;
  text-transform:uppercase;padding:8px 12px;border-radius:4px;transition:color .2s,background .2s}
nav.menu a:hover{color:var(--cta);background:var(--creme-2)}
nav.menu a.active{color:var(--cta);border-bottom:2px solid var(--or)}
.burger{display:none;background:none;border:1px solid var(--or);color:var(--cuir);
  border-radius:6px;padding:8px 12px;font-size:15px;cursor:pointer;font-family:var(--sans)}

/* ---- hero accueil (grand) ---- */
.hero{position:relative;min-height:600px;display:flex;align-items:center;background:#2a1c11;overflow:hidden}
.hero-img{position:absolute;inset:0;
  background-image:url('https://images.pexels.com/photos/258405/pexels-photo-258405.jpeg?auto=compress&cs=tinysrgb&w=1800');
  background-size:cover;background-position:center 60%;
  filter:grayscale(.55) contrast(.92) brightness(.98)}
.hero-veil{position:absolute;inset:0;background:
  linear-gradient(180deg,var(--creme) 0%,rgba(244,236,224,.75) 12%,rgba(58,38,22,.15) 34%,rgba(40,26,14,.55) 78%,rgba(30,18,8,.72) 100%)}
.hero-inner{position:relative;z-index:2;width:100%;text-align:center;padding:66px 24px 84px}
.kicker{font-family:var(--sans);letter-spacing:4px;text-transform:uppercase;font-size:12px;color:var(--creme);opacity:.85;margin-bottom:18px}
.hero h1{font-size:52px;line-height:1.1;color:var(--blanc);font-weight:600;text-shadow:0 2px 18px rgba(20,12,4,.55);margin-bottom:16px}
.hero .lede{max-width:620px;margin:0 auto;font-size:21px;color:#f3e7d5;font-style:italic;text-shadow:0 1px 10px rgba(20,12,4,.5)}
.hero .cta{margin-top:32px}
.hero-coord{margin-top:28px;font-family:var(--sans);font-size:17px;color:#f3e7d5;letter-spacing:.4px;line-height:1.6;text-shadow:0 1px 10px rgba(20,12,4,.5)}
.hero-coord a{color:#fbeede;text-decoration:none;border-bottom:1px solid rgba(251,238,222,.5)}

/* ---- bannière pages internes (fine) ---- */
.banner{position:relative;min-height:270px;display:flex;align-items:flex-end;background:#2a1c11;overflow:hidden}
.banner-img{position:absolute;inset:0;
  background-image:url('https://images.pexels.com/photos/258405/pexels-photo-258405.jpeg?auto=compress&cs=tinysrgb&w=1800');
  background-size:cover;background-position:center 55%;filter:grayscale(.55) contrast(.92) brightness(.92)}
.banner-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,26,14,.35),rgba(30,18,8,.78))}
.banner-inner{position:relative;z-index:2;width:100%;max-width:1010px;margin:0 auto;padding:0 24px 30px}
.banner .kicker{color:#e6d3b3;margin-bottom:8px}
.banner h1{font-size:40px;color:var(--blanc);font-weight:600;text-shadow:0 2px 14px rgba(20,12,4,.5)}
.banner .sub{color:#f0e3d0;font-style:italic;font-size:18px;margin-top:6px}

/* ---- boutons ---- */
.btn{display:inline-block;font-family:var(--sans);font-size:15px;letter-spacing:.6px;text-decoration:none;
  padding:15px 30px;border-radius:6px;transition:transform .15s,box-shadow .2s,background .2s}
.btn-primary{background:var(--cta);color:#fbeede;box-shadow:0 8px 22px rgba(40,24,10,.4)}
.btn-primary:hover{background:var(--cta-h);transform:translateY(-2px)}
.btn-ghost{border:1px solid var(--or);color:var(--cuir)}
.btn-ghost:hover{background:var(--creme-2)}

/* ---- sections ---- */
.section{padding:60px 0;position:relative;overflow:hidden}
.section.alt{background:var(--creme-2)}
.block-head{margin-bottom:24px}
.block-head .sub{font-family:var(--sans);font-size:11.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--sepia);display:block;margin-bottom:4px}
.block-head h2{font-size:30px;font-weight:600;color:var(--cuir);line-height:1.18}
.block-head::after{content:"";display:block;width:52px;height:3px;background:var(--or);margin-top:14px;border-radius:2px}

/* ---- prose ---- */
/* texte justifié + césure automatique (français) */
.prose p, .prose li, .terme .def, .recit p, .tl-item p{
  text-align:justify;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}
.prose p{margin-bottom:16px}
.prose p.intro{font-size:20.5px;color:var(--texte-doux);font-style:italic}
.prose h3{font-family:var(--sans);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--cta);margin:30px 0 10px}
.prose h3:first-of-type{margin-top:6px}
.prose .anchor{scroll-margin-top:90px}

/* ---- métaphore train (accent) ---- */
.accent-train{font-style:italic;color:var(--sepia);border-left:3px solid var(--or);padding-left:16px;font-size:19px}

/* ---- récit / anecdote ---- */
.recit{background:var(--blanc);border-radius:12px;padding:26px 30px;margin:30px 0;box-shadow:var(--ombre);border-left:5px solid var(--sepia)}
.recit-label{font-family:var(--sans);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--cta)}
.recit h4{font-size:23px;color:var(--cuir);margin:4px 0 16px;font-weight:600}
.recit p{margin-bottom:13px}
.recit .dial{color:var(--texte-doux)}
.recit .chute{font-style:italic;font-size:20px;color:var(--cuir);border-top:1px solid var(--creme-3);padding-top:16px;margin-top:8px}

/* ---- sommaire ---- */
.toc{background:var(--blanc);border-left:5px solid var(--or);border-radius:10px;padding:18px 22px;margin-bottom:30px;box-shadow:var(--ombre)}
.toc b{font-family:var(--sans);font-size:11.5px;letter-spacing:2px;text-transform:uppercase;color:var(--sepia);display:block;margin-bottom:8px}
.toc a{display:inline-block;margin:3px 16px 3px 0;color:var(--cta);text-decoration:none;border-bottom:1px dashed var(--cta)}

/* ---- teasers accueil ---- */
.teasers{display:grid;grid-template-columns:1fr;gap:18px;margin-top:8px}
@media(min-width:720px){.teasers{grid-template-columns:repeat(3,1fr)}}
.teaser{display:block;background:var(--blanc);border-radius:12px;padding:24px;text-decoration:none;
  color:var(--texte);box-shadow:var(--ombre);border-top:4px solid var(--or);transition:transform .2s,box-shadow .2s}
.teaser:hover{transform:translateY(-4px);box-shadow:0 20px 34px rgba(74,49,32,.24)}
.teaser h3{color:var(--cuir);font-size:22px;margin-bottom:8px}
.teaser p{font-size:15px;color:var(--texte-doux)}
.teaser .go{font-family:var(--sans);font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--cta);margin-top:12px;display:inline-block}

/* ---- fiches profil ---- */
.profil-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-top:6px}
@media(min-width:680px){.profil-grid{grid-template-columns:repeat(2,1fr)}}
.fiche{background:var(--blanc);border-radius:12px;padding:22px 24px;box-shadow:var(--ombre);border-left:5px solid var(--or)}
.fiche h3{font-family:var(--sans);font-size:11.5px;letter-spacing:2px;text-transform:uppercase;color:var(--cta);margin-bottom:12px}
.fiche dl{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:15.5px}
.fiche dt{color:var(--texte-doux);font-family:var(--sans);font-size:13px}

/* ---- frise parcours ---- */
.timeline{margin-top:26px;border-left:2px solid var(--creme-3);padding-left:26px}
.tl-item{position:relative;margin-bottom:24px}
.tl-item::before{content:"";position:absolute;left:-33px;top:8px;width:12px;height:12px;border-radius:50%;background:var(--or);border:2px solid var(--creme)}
.tl-item .an{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--cta);letter-spacing:.5px}
.tl-item .lieu{font-weight:600;color:var(--cuir)}
.tl-item p{font-size:15.5px;color:var(--texte-doux);margin-top:4px}

/* ---- lexique ---- */
.lexique{display:grid;grid-template-columns:1fr;gap:18px;margin-top:6px}
@media(min-width:720px){.lexique{grid-template-columns:repeat(2,1fr)}}
.terme{background:var(--blanc);border-radius:12px;padding:24px;box-shadow:var(--ombre)}
.terme .lbl{font-family:var(--sans);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--sepia)}
.terme h3{color:var(--cuir);font-size:23px;margin:2px 0 10px}
.terme .def{font-size:15.5px;margin-bottom:14px}
.terme blockquote{border-left:3px solid var(--or);padding-left:15px;font-style:italic;font-size:14.5px;color:var(--texte-doux)}
.terme blockquote+blockquote{margin-top:12px}

/* ---- post-it ---- */
.tarifs{display:flex;flex-wrap:wrap;gap:34px;margin-top:26px;padding-top:8px}
.postit{position:relative;flex:0 1 240px;padding:28px 22px 32px;text-align:center;
  background:#f6e7b6;color:#5a4326;box-shadow:0 14px 26px rgba(74,49,32,.22);transition:transform .25s,box-shadow .25s}
.postit:nth-child(1){transform:rotate(-2.4deg)}
.postit:nth-child(2){transform:rotate(1.9deg);background:#f1dcac}
.postit:hover{transform:rotate(0) translateY(-5px);box-shadow:0 22px 36px rgba(74,49,32,.30)}
.postit::before{content:"";position:absolute;top:-13px;left:50%;transform:translateX(-50%) rotate(-2.5deg);
  width:98px;height:28px;background:rgba(181,138,82,.42);box-shadow:0 2px 6px rgba(0,0,0,.10)}
.postit .t-type{font-family:var(--sans);letter-spacing:1.2px;text-transform:uppercase;font-size:11px;color:#8a5a3b}
.postit .t-prix{font-family:"Caveat",cursive;font-size:56px;font-weight:700;line-height:.95;margin:6px 0 2px;color:#43301d}
.postit .t-note{font-family:"Caveat",cursive;font-size:21px;line-height:1.15;color:#6a5744}

/* ---- cachets ---- */
.stamp{width:114px;height:114px;border-radius:50%;border:3px double #8a4a2f;color:#8a4a2f;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  font-family:var(--sans);text-transform:uppercase;letter-spacing:1.4px;font-weight:700;font-size:10px;line-height:1.4;
  opacity:.5;transform:rotate(-13deg);pointer-events:none;user-select:none}
.stamp .big{font-size:25px;margin:1px 0;line-height:1}
.stamp.light{border-color:#e6d3b3;color:#e6d3b3;opacity:.62}
.stamp-float{position:absolute;z-index:4;top:34px;right:26px}
@media(max-width:900px){.stamp-float{display:none}}

/* ---- contact ---- */
.contact-dark{background:var(--cuir);color:var(--creme)}
.contact-dark .block-head h2{color:var(--creme)}
.contact-dark .block-head .sub{color:var(--or)}
.contact-grid{display:grid;grid-template-columns:1fr;gap:30px;margin-top:6px}
@media(min-width:760px){.contact-grid{grid-template-columns:1.05fr 1fr}}
.infoblock p{color:#eaded0;margin-bottom:11px}
.infoblock .big{font-size:25px;font-weight:600;color:var(--or)}
.infoblock a{color:var(--or);text-decoration:none;border-bottom:1px solid rgba(181,138,82,.5)}
.transports{font-family:var(--sans);font-size:14px;color:#cdb89e;margin-top:6px}
.map-embed{border:0;border-radius:12px;width:100%;height:280px;box-shadow:var(--ombre);filter:sepia(.15)}

/* ---- figures / illustrations ---- */
.fig{margin:26px 0;text-align:center}
.fig img{max-width:100%;height:auto;border-radius:10px;box-shadow:var(--ombre);filter:sepia(.12);display:block;margin:0 auto}
.fig figcaption{font-family:var(--sans);font-size:12.5px;color:var(--texte-doux);margin-top:9px;font-style:italic;line-height:1.4}
.fig.wide{max-width:460px;margin-left:auto;margin-right:auto}
.fig.portrait{max-width:250px}
@media(min-width:720px){ .fig.right{float:right;width:240px;margin:4px 0 18px 30px} }
.cite-portrait{background:var(--blanc);border-left:5px solid var(--sepia);border-radius:12px;padding:24px 28px;margin:26px 0;box-shadow:var(--ombre)}
.cite-portrait .q{font-size:22px;font-style:italic;color:var(--cuir);line-height:1.4;display:block}
.cite-portrait .who{font-family:var(--sans);font-size:12.5px;letter-spacing:1px;text-transform:uppercase;color:var(--cta);margin-top:12px;display:block}

/* ---- pied ---- */
footer.pied{background:#33210f;color:#b39d80;font-family:var(--sans);font-size:13px;text-align:center;padding:24px 20px}
footer.pied .rail{height:8px;margin-bottom:18px;background:repeating-linear-gradient(90deg,var(--or) 0 20px,transparent 20px 30px);opacity:.4}
footer.pied a{color:#cdb89e}

/* ---- fondu ---- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ---- responsive ---- */
@media(max-width:860px){
  nav.menu{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--creme);
    padding:8px 24px 16px;gap:2px;border-bottom:1px solid var(--creme-3);box-shadow:0 10px 20px rgba(74,49,32,.12)}
  nav.menu.open{display:flex}
  nav.menu a{padding:12px 8px}
  nav.menu a.active{border-bottom:none;color:var(--cta)}
  .burger{display:block}
  .topbar .wrap{position:relative}
  .hero h1{font-size:36px}.hero .lede{font-size:18px}.hero{min-height:500px}
  .banner h1{font-size:30px}
}
/* ===== VARIANTE : barre sang de boeuf + corps coquille d'oeuf + cadres contrastes + menu 1 ligne ===== */
:root{ --creme:#f2ecda; --creme-2:#e9e0c6; --creme-3:#dbcfad; }
body{ background:#f2ecda; }

/* Bandeau du haut - rouge "sang de boeuf" pastelise */
header.topbar{ background:#9c5654; border-bottom:3px solid var(--or); box-shadow:0 2px 12px rgba(70,30,30,.20); }
.topbar .brand b{ color:#fdf4f0; }
.topbar .brand small{ color:#eccfca; }
.topbar .brand .psi{ color:#f6ddd7; }
nav.menu a{ color:#fbeee9; }
nav.menu a:hover{ background:rgba(255,255,255,.16); color:#fff; }
nav.menu a.active{ color:#fff; border-bottom:2px solid #f6ddd7; }
.burger{ color:#fbeee9; border-color:#f0cfc9; }

/* Cadres plus contrastes sur le fond coquille d'oeuf */
.fiche,.terme,.toc,.teaser,.cite-portrait,.recit{
  background:#fffdf6; border:1px solid var(--creme-3);
  box-shadow:0 10px 26px rgba(70,45,25,.16); }
.map-embed{ border:1px solid var(--creme-3); }

/* Menu sur une seule ligne (desktop) */
@media(min-width:861px){
  .topbar .wrap{ flex-wrap:nowrap; }
  nav.menu{ flex-wrap:nowrap; }
  nav.menu a{ white-space:nowrap; font-size:12.5px; letter-spacing:.4px; padding:7px 8px; }
}
/* Menu deroulant mobile lisible sur la barre coloree */
@media(max-width:860px){ nav.menu{ background:#9c5654; } nav.menu a{ color:#fbeee9; } }

/* Accroche du hero : pastille pour ressortir sur la photo */
.hero .kicker{ display:inline-block; opacity:1; color:#fdeee9;
  background:rgba(55,22,22,.5); padding:9px 20px; border-radius:30px;
  box-shadow:0 4px 16px rgba(0,0,0,.28); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }

/* Symbole psy : rendu "ancienne version" (police d'avant Garamond) */
.brand .psi, .stamp .big{ font-family:"Palatino Linotype",Palatino,"Book Antiqua","Times New Roman",Georgia,serif; }

/* Bandeau du bas : même couleur que le haut (sang de boeuf) */
footer.pied{ background:#9c5654; color:#f1d9d4; }
footer.pied a{ color:#fbeee9; }

/* Tampon du hero : encre rouge vintage, plus visible sur la photo */
.hero .stamp{ border-color:#b23a2c; color:#b23a2c; opacity:.85;
  text-shadow:0 1px 2px rgba(255,255,255,.30); }

/* ---- tampons de voyage décoratifs (destinations) ---- */
.vstamp{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  font-family:"Helvetica Neue",Arial,sans-serif;text-transform:uppercase;font-weight:700;letter-spacing:1.5px;
  line-height:1.25;opacity:.85;user-select:none;pointer-events:none}
.vstamp .sm{font-size:9px;letter-spacing:1.6px}
.vstamp .exo{font-size:20px;font-weight:600;letter-spacing:.5px;text-transform:none;margin:2px 0;
  font-family:"EB Garamond",Georgia,serif}
.vstamp .yr{font-size:9px;letter-spacing:2px;opacity:.9}
.vs-circle{width:116px;height:116px;border-radius:50%;border:3px double currentColor}
.vs-oval{width:138px;height:100px;border-radius:50%;border:3px double currentColor}
.vs-rect{width:138px;height:88px;border:3px solid currentColor;border-radius:4px}
.vs-pass{width:146px;height:92px;border:2px dashed currentColor;border-radius:14px}
.vs-ring{width:116px;height:116px;border-radius:50%;border:5px solid currentColor;box-shadow:0 0 0 2px currentColor inset}
.vink-red{color:#b23a2c}.vink-blue{color:#3f5f7d}.vink-green{color:#4a6b52}.vink-violet{color:#6f4a86}
.vstamp-float{position:absolute;z-index:3;top:24px;right:28px;text-shadow:0 1px 3px rgba(255,255,255,.30)}
@media(max-width:900px){.vstamp-float{display:none}}

/* Tampon ψ : texte un peu réduit pour ne pas mordre le cercle */
.stamp{ font-size:9px; letter-spacing:1px; }
.stamp .big{ font-size:23px; }

/* tampons qui débordent volontairement sur une carte/encart */
.fiche{position:relative}
.vs-corner{position:absolute;z-index:5}
@media(max-width:900px){.vs-corner{display:none}}

/* Essai : vieille carte (Hondius, 1630) en filigrane sur la page Trajet */
.oldmap{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  filter:sepia(.25) contrast(.95);
  background:url('https://commons.wikimedia.org/wiki/Special:FilePath/Nova_totius_Terrarum_Orbis_geographica_ac_hydrographica_tabula_%28Hendrik_Hondius%29_balanced.jpg?width=1600') center/cover no-repeat}
.page-trajet .section{background:rgba(242,236,218,.82)}
.page-trajet .section.alt{background:rgba(233,224,198,.82)}

/* Sous-titres de section un peu plus foncés (meilleure lisibilité, notamment sur la carte) */
.prose h3{ color:var(--cuir); }

.terme{position:relative}

/* Petites étiquettes de section (ex. « POURQUOI PARTIR ? ») plus foncées */
.block-head .sub{ color:var(--cuir); }

/* Post-it : centrés, plus petits, teinte lavande, prix en Zapfino */
.tarifs{ justify-content:center; gap:28px; }
.postit{ flex:0 1 198px; padding:22px 18px 26px }
.postit:nth-child(1){ background:#e7e0f2 }
.postit:nth-child(2){ background:#ded2ee }
.postit::before{ background:rgba(111,74,134,.30) }
.postit .t-type{ color:#6f4a86 }
.postit .t-prix{ font-family:"Zapfino","Snell Roundhand",cursive; font-size:30px; line-height:1.4; margin:12px 0 10px; color:#3e2b34 }
.postit .t-note{ font-family:var(--serif); font-style:italic; font-size:15.5px; line-height:1.35; color:#6a5566 }

/* Post-it : police définitive = Pinyon Script (universelle) */
.postit .t-prix{ font-family:"Pinyon Script",cursive; font-size:44px; line-height:1.15; margin:8px 0 10px }