/* ===== Fiche Séjour — styles propres / modernes ===== */

/* 🔧 FIX: Compensation de la hauteur du header fixe (légèrement augmentée) */
main.main-wrap--sejour {
  padding-top: calc(var(--header-height, 82px) + 12px);
}

/* Supprimer les marges en haut mais garder le padding interne */
main > article.sej.wrap {
  margin-top: 0;
}

.sej.wrap{
  --w:1280px;
  --radius:22px;
  --shadow:0 10px 34px rgba(2,6,23,.10);
  --bg:#fff;
  --ink:#0b1220;
  --muted:#616b7a;
  --line:#e9eef5;
  --accent:#0b1220;
}

.sej.wrap{
  max-width:var(--w);
  margin:0 auto;
  padding:0 4vw;
  padding-top: 0; /* Espace en haut entre le header et le contenu */
  padding-bottom: 3rem; /* Espace en bas après le dernier élément */
  border-radius: 16px; /* Coins arrondis */
  color:var(--ink);
  font-family:var(--codex-body-font)
}

/* HERO */
.sej-hero{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:clamp(16px,3vw,28px);
  align-items:start;
  margin-top: 0;
  padding-top: 0;
}
@media (max-width:980px){ .sej-hero{grid-template-columns:1fr} }
.sej-hero-media{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid var(--line);
  background:#f6f8fb;
  display: flex;
  flex-direction: column;
}
.sej-hero-imglink{display:block;border-radius:22px;overflow:hidden}
.sej-hero-imglink:focus-visible{outline:3px solid rgba(96,165,250,.6);outline-offset:6px}
.sej-hero-img{display:block;width:100%;height:auto;max-height:420px;object-fit:cover;filter:brightness(.95);transition:transform .5s ease;will-change:transform}
@media (max-width:600px){.sej-hero-img{height:320px}}
@media (hover:hover){.sej-hero-imglink:hover .sej-hero-img{transform:scale(1.05)}}
.sej-hero-badge{
  position:absolute;top:14px;left:14px;background:rgba(255,255,255,.82);
  backdrop-filter:saturate(140%) blur(8px);padding:7px 12px;border-radius:999px;
  font-weight:700;font-size:14px
}
.sej-hero-body{display:flex;flex-direction:column;gap:12px;justify-content:center}
.sej-kicker{margin:0;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:800}
.sej-title{margin:0;font-size:clamp(28px,3.6vw,46px);line-height:1.06}

/* Badges (hero) */
.le-card__badges{
  position:absolute; top:14px; left:14px; z-index:3;
  display:flex; gap:8px; flex-wrap:wrap;
}
.le-badge{
  --bg: rgba(255,255,255,.78);
  --bd: rgba(15,23,42,.10);
  --txt:#0b1220;
  display:inline-flex; align-items:center;
  padding:7px 10px; border-radius:999px;
  font-weight:800; font-size:12.5px; letter-spacing:.02em;
  color:var(--txt); background:var(--bg); border:1px solid var(--bd);
  box-shadow: 0 6px 18px rgba(2,6,23,.10), inset 0 0 0 1px rgba(255,255,255,.35);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  text-transform:uppercase; white-space:nowrap;
}
.le-badge--new{
  color:#0b1220;
  background: linear-gradient(135deg, rgba(59,130,246,.18), rgba(168,85,247,.20));
  border-color: rgba(59,130,246,.35);
}
.le-badge--soldout{
  color:#fff;
  background: linear-gradient(135deg, #ef4444, #b91c1c);
  border-color: rgba(255,255,255,.35);
  box-shadow: 0 8px 22px rgba(239,68,68,.35);
}

/* Meta principale (lieu • durée • âges) */
.sej-meta{
  display:flex;flex-wrap:wrap;gap:10px 12px;list-style:none;margin:6px 0 0;padding:0
}
.sej-meta > span{
  display:inline-flex;gap:8px;align-items:center;color:#2b3342;font-weight:600;
  background:rgba(11,18,32,.04);border:1px solid var(--line);padding:.35em .7em;border-radius:10px;
}

/* Dates sous la meta */
.sej-dates{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}

/* Pastille unique sessions (wrap auto si long) */
.sej-dates .pill{
  background:#f5f7fb;border:1px solid var(--line);padding:6px 10px;border-radius:999px;font-weight:700
}
.sej-dates .pill--sessions{
  display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;max-width:100%;
  padding:8px 12px;
}
.sej-dates .pill--sessions .ico{line-height:1}
.sej-dates .pill--sessions .txt{
  white-space:normal; word-break:keep-all;
}

/* Coup de cœur (ligne simple, un seul emoji) */
.sej-heart-line{
  display:flex;align-items:center;gap:8px;margin-top:10px;color:#4a5568;font-weight:700;
}
.sej-heart-line::before{content:"💖";display:inline-block}

/* CTA + prix */
.sej-cta{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin-top:8px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);text-decoration:none;font-weight:800;transition:transform .2s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 10px 24px rgba(37,99,235,.18)}
.btn.primary:hover{box-shadow:0 14px 32px rgba(37,99,235,.22);color:#fff}
.btn.ghost{background:#fff;color:var(--accent);box-shadow:0 8px 18px rgba(0,0,0,.08)}
.btn.ghost:hover{box-shadow:0 12px 26px rgba(0,0,0,.12);color:var(--accent)}
.sej-price{display:flex;align-items:baseline;gap:10px;margin-left:auto}
.sej-price-amt{font-weight:900;font-size:22px}
.sej-price-note{color:var(--muted);font-size:14px}

/* Sections (ajout .sej-transport + .sej-phone) */
.sej-highlights,.sej-program,.sej-encadrement,.sej-restauration,.sej-transport,.sej-phone,.sej-gallery,.sej-faq,.sej-contact,.sej-formalites{margin-top:20px}
.sej-highlights h2,.sej-program h2,.sej-gallery h2,.sej-faq h2,.sej-encadrement h2,.sej-restauration h2,.sej-transport h2,.sej-phone h2,.sej-formalites h2{font-size:22px;margin:0 0 12px}

/* Encadrement / Restauration / Transport / Formalités : cartes texte */
.sej-encadrement .mini-card,
.sej-restauration .mini-card,
.sej-transport .mini-card,
.sej-formalites .mini-card,
.sej-phone .mini-card{
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;white-space:pre-line
}

/* Listes à puces dans les cartes */
.sej-formalites .sej-list,
.sej-phone .sej-list {
  list-style: disc;
  padding-left: 24px;
  margin: 0;
}

.sej-formalites .sej-list li,
.sej-phone .sej-list li {
  margin-bottom: 8px;
}

/* Pills */
.sej-pills{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.sej-pills span,.sej-pills .pill{background:#f5f7fb;border:1px solid var(--line);padding:8px 12px;border-radius:999px;font-weight:700}

/* Programme détaillé */
.sej-days{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:0;padding:0;list-style:none}
@media (max-width:840px){.sej-days{grid-template-columns:1fr}}
.mini-card{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fff;list-style:none;white-space:pre-line}
.mini-card h3{margin:0 0 6px;font-size:16px}

/* Galerie */
.sejour-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.sejour-gallery a{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:12px;border:1px solid var(--line);background:#f7f9fc;transition:translate .25s ease,box-shadow .25s ease}
.sejour-gallery a::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 0 rgba(34,80,244,.15);transition:box-shadow .25s ease}
.sejour-gallery a:hover{translate:0 -2px;box-shadow:0 12px 24px -18px rgba(12,19,34,.6)}
.sejour-gallery a:hover::after{box-shadow:inset 0 0 0 2px rgba(34,80,244,.25)}
.sejour-gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;will-change:transform}
.sejour-gallery a:hover img{transform:scale(1.08)}

.gpost-gallery__trigger{cursor:zoom-in}
.gpost-gallery[hidden]{display:none}
.gpost-gallery{position:fixed;inset:0;z-index:1800;display:flex;align-items:center;justify-content:center;padding:32px}
.gpost-gallery.is-open{animation:gpost-gallery-in .25s ease forwards}
body.gpost-gallery-open{overflow:hidden}
.gpost-gallery__backdrop{position:absolute;inset:0;background:rgba(3,7,18,.82);backdrop-filter:blur(4px)}
.gpost-gallery__frame{position:relative;max-width:min(960px,90vw);width:100%;background:#0f172a;border-radius:18px;box-shadow:0 40px 80px -32px rgba(15,23,42,.55);padding:24px;display:grid;grid-template-columns:min-content 1fr min-content;grid-template-rows:auto}
.gpost-gallery__figure{margin:0;grid-column:2;display:flex;flex-direction:column;gap:12px;align-items:center}
.gpost-gallery__img{max-width:100%;max-height:70vh;border-radius:12px;box-shadow:0 24px 60px -32px rgba(15,23,42,.7);background:#0b1220}
.gpost-gallery__caption{margin:0;color:#e2e8f0;font-size:.95rem;text-align:center}
.gpost-gallery__close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:none;border-radius:50%;background:rgba(15,23,42,.6);color:#e2e8f0;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease}
.gpost-gallery__close:hover{background:rgba(30,41,59,.9)}
.gpost-gallery__nav{border:none;border-radius:50%;width:44px;height:44px;background:rgba(15,23,42,.65);color:#e2e8f0;font-size:1.6rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease,transform .2s ease}
.gpost-gallery__nav:disabled{opacity:.3;cursor:default}
.gpost-gallery__nav:not(:disabled):hover{background:rgba(30,41,59,.95);transform:translateY(-2px)}
.gpost-gallery__nav--prev{grid-column:1;grid-row:1;align-self:center;margin-right:12px}
.gpost-gallery__nav--next{grid-column:3;grid-row:1;align-self:center;margin-left:12px}
.gpost-gallery--single .gpost-gallery__nav{display:none}

@keyframes gpost-gallery-in{from{opacity:0}to{opacity:1}}

@media (max-width:900px){
  .gpost-gallery__frame{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;gap:16px;padding:20px}
  .gpost-gallery__nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px}
  .gpost-gallery__nav--prev{left:12px}
  .gpost-gallery__nav--next{right:12px}
  .gpost-gallery__close{top:8px;right:8px}
  .gpost-gallery__img{max-height:60vh}
}

/* FAQ */
.sej-accordion details{border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px;margin:10px 0}
.sej-accordion summary{cursor:pointer;font-weight:900}
.sej-accordion .a{color:#616b7a;margin-top:6px}

/* Contact */
.sej-contact .card{display:flex;gap:18px;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:16px;padding:16px;background:#fff}

/* Si header sticky : */
[id]{ scroll-margin-top: 120px; }

/* Prix injecté */
[data-price] small{margin-left:6px;font-weight:600;color:#616b7a;font-size:14px}
