/* ============================================================
   KARAI — styles communs à tout le site (complétés par home.css)
   Organisation : un bloc par composant, puis un bloc par page.
   ============================================================ */
/* ════════════════════════════════════════════════════════════════════════
   VARIABLES, RESET ET BASE
   ════════════════════════════════════════════════════════════════════════ */
:root { --c-bg: #faf7f2; --c-bg-alt: #f5f0e8; --c-bg-dark: #1a1410; --c-bg-footer: #1a1410; --c-bg-nav: #faf7f2; --c-overlay: #000000; --c-line: #1a1410; --c-title: #1a1410; --c-text: #1a1410; --c-accent: #c49a3c; --c-surtitle: #c49a3c; --c-link: #299187; --c-number: #d7d3cc; --c-on-photo: #faf7f2; --c-accent-on-dark: #c49a3c; --c-on-dark: #f5f0e8; --c-nav: #faf7f2; --c-nav-scrolled: #1a1410; --c-nav-active: #c49a3c; --c-badge-open: #299187; --c-badge-soon: #9a927f; --c-badge-text: #faf7f2; --c-btn-bg: #1a1410; --c-btn-text: #f5f0e8; --c-footer-logo: #f5f0e8; --c-footer-head: #c49a3c; --c-footer-text: #f5f0e8; --ink: var(--c-title); --light: var(--c-bg); --sand: var(--c-bg-alt); --gold: var(--c-surtitle); --terracotta: var(--c-link); --warm-gray: var(--c-text); --chocolate: var(--c-title); --white: var(--c-on-photo); --border: color-mix(in srgb, var(--c-line) 12%, transparent); --font-serif: 'Noto Serif Display', serif; --font-sans: 'Inter', sans-serif; --w-serif: 200; --pad-section: 4rem; --pad-container: 5rem; --pad-mobile: 2rem; --gap-grid: 2rem; }
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-sans); background: var(--light); color: var(--ink); font-size: 15px; line-height: 1.7; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; object-fit: cover; }
a { text-decoration: none; color: inherit; transition: 0.3s ease; }
ul { list-style: none; }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes subtle-zoom {
  from { transform: scale(1); }
  to { transform: scale(1.08); }
}
@media (max-width: 1024px) {
  :root { --pad-container: 2rem; --pad-section: 4rem; }
}
.reveal.visible { opacity: 1; transform: translateY(0); }
/* Italiques : dorées sur fond clair, version « sur sombre » sur les photos et sections sombres */
em { font-style: italic; color: var(--c-accent); }
:where(p, li, .legal__body, .article-body, .exp-faq__a-inner, .article-infobox) a:not([class]):not(nav a):not(footer a) { color: var(--c-link) !important; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
/* ════════════════════════════════════════════════════════════════════════
   TYPOGRAPHIE, BOUTONS ET LIENS
   ════════════════════════════════════════════════════════════════════════ */
/* Surtitre : la petite ligne en capitales au-dessus des titres. Une seule classe pour tout le site. */
.surtitre { display: block; font-family: var(--font-sans); font-weight: 400; font-size: 0.65rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--c-surtitle); margin-bottom: 1.2rem; }
.title-xl { font-family: var(--font-serif); font-size: clamp(3rem, 6vw, 5.5rem); font-weight: var(--w-serif); line-height: 1.1; margin-bottom: 1.5rem; }
.btn { display: inline-block; padding: 1rem 2rem; font-size: 0.65rem; letter-spacing: 0.15em; border: 1px solid var(--border); transition: all 0.3s ease; cursor: pointer; background: transparent; color: var(--ink); }
.btn:hover { background: var(--c-bg-dark); color: var(--white); border-color: var(--ink); }
/* ── BOUTON STYLE LIEN ÉDITORIAL (Ligne + Flèche à droite) ── */
.btn-line { display: inline-flex; align-items: center; padding: 0.2rem 0; font-size: 0.7rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; position: relative; transition: all 0.4s ease; cursor: pointer; }
/* La flèche à droite */
.btn-line::after { content: '→'; margin-left: 8px; font-family: serif; font-size: 1.1rem; transition: transform 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }
/* ÉTAT AU SURVOL (Hover) */
.btn-line:hover::after { transform: translateX(4px); }
.btn { font-family: var(--font-sans); text-transform: uppercase; }
/* ── LIENS ───────────────────────────────────────────────────
   Liens isolés (View all, Read our story, Write to us…) : Inter majuscules, vert d'eau, soulignés.
   Liens au fil du texte : vert d'eau, soulignés, casse normale. */
.btn-line { color: var(--c-link); font-family: var(--font-sans); }
.btn-line::before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; transition: opacity 0.4s ease, height 0.4s ease; background-color: var(--c-link); opacity: 1; }
.btn-line:hover { font-weight: 500; color: var(--c-link); }
.btn-line:hover::before { opacity: 1; height: 2px; }
/* Lien simplement souligné (sans trait pleine largeur ni flèche) : Inter majuscules, vert d'eau */
.link-underline { font-family: var(--font-sans); font-size: 0.7rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.45em; }
.link-underline:hover { text-decoration-thickness: 2px; }
/* ════════════════════════════════════════════════════════════════════════
   ANIMATIONS ET RÉVÉLATION AU DÉFILEMENT
   ════════════════════════════════════════════════════════════════════════ */
.reveal { opacity: 0; transform: translateY(40px); transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), transform 1.2s cubic-bezier(0.215, 0.61, 0.355, 1); will-change: transform, opacity; }
.delay-1 { transition-delay: 0.1s; }
/* ════════════════════════════════════════════════════════════════════════
   NAVIGATION, SOUS-MENUS ET MENU MOBILE
   ════════════════════════════════════════════════════════════════════════ */
.nav-logo { font-size: 1.5rem; letter-spacing: 0.2em; }
.nav-links { display: flex; gap: 3rem; }
.nav-links a { font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; }
/* Bouton CTA dans la nav (pages expédition) */
.nav-cta:hover { background: var(--white); color: var(--ink); }
nav.scrolled .nav-cta { border-color: var(--ink); color: var(--ink); }
nav.scrolled .nav-cta:hover { background: var(--c-bg-dark); color: var(--white); }
@media (max-width: 600px) {
  .nav-links { display: none; }
}
/* Menu */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; justify-content: space-between; align-items: center; padding: 1.5rem var(--pad-container); color: var(--c-nav); }
nav.scrolled { backdrop-filter: blur(10px); padding: 1rem var(--pad-container); border-bottom: 1px solid var(--border); background: var(--c-bg-nav); color: var(--c-nav-scrolled); }
.nav-links a:hover, .nav-links a.is-active { color: var(--c-nav-active); }
.nav-cta { font-size: 0.65rem; letter-spacing: 0.15em; padding: 0.7rem 1.4rem; border: 1px solid color-mix(in srgb, var(--c-on-dark) 50%, transparent); color: var(--white); transition: all 0.3s ease; font-family: var(--font-sans); text-transform: uppercase; }
.series-end-btn, .waitlist__btn, .mau-notify__btn { font-family: var(--font-sans); text-transform: uppercase; }
.nav-links > li { display: flex; align-items: center; }
.nav-links > li.has-mega > a { padding: 0.4rem 0; border-bottom: 1px solid transparent; }
.nav-links > li.has-mega:hover > a { border-color: var(--c-nav-active); color: var(--c-nav-active); }
/* quand un sous-menu est ouvert, le menu passe en version claire */
nav:has(.nav-links > li.has-mega:hover) { background: var(--c-bg-nav); color: var(--c-nav-scrolled); border-bottom: 1px solid var(--border); }
nav:has(.nav-links > li.has-mega:hover) .nav-cta { border-color: var(--ink); color: var(--ink); }
.nav-mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--c-bg-nav); color: var(--c-text); border-bottom: 1px solid var(--border); padding: 2.5rem var(--pad-container) 3rem; display: grid; grid-template-columns: 1fr 3fr; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: 0.25s; text-transform: none; letter-spacing: normal; }
.nav-links > li:hover .nav-mega, .nav-links > li:focus-within .nav-mega { opacity: 1; visibility: visible; transform: none; }
.nav-mega__intro p { font-size: 0.9rem; line-height: 1.6; max-width: 30ch; }
.nav-mega__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nav-mega .nav-mega__item { display: block; font-size: inherit; letter-spacing: normal; text-transform: none; color: var(--c-text); }
.nav-mega .nav-mega__item:hover { color: var(--c-text); }
.nav-mega__ph { display: block; overflow: hidden; border-radius: 14px; }
.nav-mega__ph img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s; }
.nav-mega__item:hover .nav-mega__ph img { transform: scale(1.05); }
.nav-mega__txt b { display: block; font-family: var(--font-serif); font-weight: var(--w-serif); line-height: 1.2; }
.nav-mega__txt small { font-size: 0.72rem; color: color-mix(in srgb, var(--c-text) 65%, transparent); }
.nav-mega__txt p { font-size: 0.85rem; line-height: 1.6; margin-top: 0.6rem; }
.nav-mega__soon { flex-direction: column; justify-content: center; padding: 1.5rem; background: var(--c-bg-alt); border-radius: 14px; }
.nav-mega__soon .surtitre { margin-bottom: 0.6rem; }
.nav-mega__soon b { font-family: var(--font-serif); font-weight: var(--w-serif); }
.nav-mega__soon small { font-size: 0.72rem; }
.nav-mega__item--wide { grid-column: span 3; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
.nav-mega__item--wide .nav-mega__txt b { font-size: 1.8rem; margin-bottom: 0.4rem; }
@media (max-width: 1024px) {
  .nav-mega { display: none; }
}
.nav-links > li > a { padding: 0.4rem 0; border-bottom: 1px solid transparent; }
.nav-mega .nav-mega__item--wide { display: grid; }
.nav-mega .link-underline { color: var(--c-link) !important; }
.nav-burger { display: none; background: none; border: 0; color: inherit; cursor: pointer; font-family: var(--font-sans); font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; padding: 0.4rem 0; }
@media (max-width: 600px) {
  .nav-burger { display: block; position: relative; z-index: 2; }
  nav .nav-cta { display: none; }
  /* menu ouvert : sans le flou du menu « scrolled », sinon la liste plein écran reste coincée dans la barre */
  nav.nav-open, nav.nav-open.scrolled { background: var(--c-bg-nav); color: var(--c-nav-scrolled); backdrop-filter: none; -webkit-backdrop-filter: none; }
  nav.nav-open .nav-logo, nav.nav-open .nav-burger { position: relative; z-index: 2; color: var(--c-title); }
  nav.nav-open .nav-links { display: flex; flex-direction: column; justify-content: center; gap: 1.6rem; position: fixed; inset: 0; z-index: 1; padding: 6rem var(--pad-mobile, 1.5rem) 3rem; background: var(--c-bg-nav); overflow-y: auto; }
  nav.nav-open .nav-links > li > a { font-family: var(--font-serif); font-weight: var(--w-serif); font-size: 2rem; letter-spacing: 0; text-transform: none; border: 0; color: var(--c-title); }
  nav.nav-open .nav-links > li > a.is-active { color: var(--c-nav-active); }
  .nav-mega { display: none !important; }
}
/* Bouton du menu (Join an expedition, Sign up) : arrondi comme les autres boutons */
.nav-cta { border-radius: 999px; }
/* Menu : liens toujours centrés, avec ou sans bouton à droite */
nav .nav-logo { justify-self: start; }
nav .nav-cta, nav .nav-burger { grid-column: 3; justify-self: end; }
/* Menu : pas de bande sombre au passage transparent → plein.
   Le fond transparent de départ est un beige à 0 % (et non du noir transparent),
   et seules la couleur, le fond et la hauteur sont animés. */
nav { display: grid; grid-template-columns: 1fr auto 1fr; background-color: rgb(250 247 242 / 0); transition: background-color 0.35s ease, color 0.35s ease, padding 0.35s ease, border-color 0.35s ease; border-bottom: 1px solid rgb(26 20 16 / 0); }
nav.scrolled { background-color: var(--c-bg-nav); border-bottom-color: var(--border); }
/* Menu déroulant : 20 % moins haut */
.nav-mega__ph { aspect-ratio: 16 / 10; margin-bottom: 0.5rem; }
.nav-mega__txt b, .nav-mega__soon b { font-size: 1.1rem; }
/* titres des vignettes sur une seule ligne : le menu déroulant garde la même hauteur pour chaque rubrique */
.nav-mega__grid .nav-mega__txt b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-bottom: .2em; margin-bottom: -.2em; }
/* titres des vignettes du menu : tout en noir, sans italique doré (ex. articles du Journal) */
.nav-mega__txt b em { font-style: normal; color: inherit; }
.nav-mega__intro p { margin-bottom: 1.1rem; }
.nav-mega__item--wide .nav-mega__ph { margin-bottom: 0; aspect-ratio: 2 / 1; }
/* Menu déroulant : marges encore réduites */
.nav-mega { padding-top: 1.1rem; padding-bottom: 1.3rem; gap: 2.2rem; }
.nav-mega__grid { gap: 0.9rem; }
/* (menu du haut et pied de page) */
.nav-logo, .footer-logo { font-family: 'Titillium Web', var(--font-sans); font-weight: 600; text-transform: uppercase; }
/* ════════════════════════════════════════════════════════════════════════
   PIED DE PAGE ET RETOUR EN HAUT
   ════════════════════════════════════════════════════════════════════════ */
.footer-top { display: grid; }
.back-to-top { opacity: 0; pointer-events: none; }
.back-to-top.visible { transform: translateY(0); opacity: 1; pointer-events: auto; }
.exp-page-footer .footer-top { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 4rem; padding: 5rem var(--pad-container) 4rem; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.exp-page-footer .footer-col ul li a:hover { color: var(--white); }
@media (max-width: 1024px) {
  .exp-page-footer .footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .exp-page-footer .footer-top { grid-template-columns: 1fr; gap: 2rem; }
}
.exp-page-footer .footer-logo { font-family: 'Titillium Web', var(--font-sans); font-weight: 600; text-transform: uppercase; display: block; font-size: 2rem; letter-spacing: 0.2em; margin-bottom: 1rem; color: var(--c-footer-logo); }
.exp-page-footer .footer-col h4 { color: var(--c-footer-head); }
.exp-page-footer .footer-brand p { font-size: 0.85rem; line-height: 1.7; color: var(--c-footer-text); }
.exp-page-footer .footer-col ul li a { font-size: 0.88rem; color: var(--c-footer-text); }
.footer-bottom { padding: 2rem var(--pad-container); font-size: 0.75rem; color: var(--c-footer-text); }
/* Pied de page : newsletter en #faf7f2 ; copyright seul, à droite */
.exp-page-footer .footer-bottom { color: var(--c-footer-text); justify-content: flex-end; }
/* Bouton « retour en haut » : petit rond, discret, avec ombre légère */
.back-to-top { position: fixed; bottom: 2rem; right: 2rem; z-index: 99; justify-content: center; cursor: pointer; transform: translateY(8px); transition: opacity 0.3s ease, transform 0.3s ease; width: 2.6rem; height: 2.6rem; border-radius: 50%; padding: 0; display: grid; place-items: center; background: var(--c-bg-nav); color: var(--c-title); border: 1px solid color-mix(in srgb, var(--c-line) 18%, transparent); box-shadow: 0 6px 18px -8px rgba(26, 20, 16, .35); }
.back-to-top:hover { background: var(--c-link); color: var(--c-on-photo); border-color: var(--c-link); }
body.has-cookie-box .back-to-top { opacity: 0 !important; pointer-events: none !important; }
/* Pied de page : en bas de page, le copyright est sur la même ligne que la flèche « retour en haut »
   (flèche : 2rem du bas et du bord droit, 2,6rem de diamètre → son centre est à 3,3rem du bas) */
.footer-bottom { display: flex; align-items: center; height: 6.6rem; padding-top: 0; padding-bottom: 0; padding-right: calc(2rem + 2.6rem + 1.2rem); }
@media (max-width: 768px) {
  .footer-bottom { gap: 1rem; flex-direction: row; text-align: right; }
}
/* Pied de page moins haut */
.exp-page-footer .footer-top { padding-top: 2.4rem; padding-bottom: 1.8rem; }
.footer-col h4 { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-footer-head); margin-bottom: 0.9rem; }
.footer-col ul li { font-size: 0.9rem; color: var(--c-footer-text); margin-bottom: 0.4rem; }
/* ════════════════════════════════════════════════════════════════════════
   BANDEAU NEWSLETTER
   ════════════════════════════════════════════════════════════════════════ */
/* ── NEWSLETTER ── */
.newsletter { background: var(--light); border-bottom: 1px solid var(--border); padding: 3rem var(--pad-container); display: flex; align-items: center; justify-content: flex-start; gap: 4rem; }
.newsletter-left h2 { font-family: var(--font-serif); font-size: clamp(1.6rem, 2.5vw, 2.2rem); font-weight: var(--w-serif); line-height: 1.2; color: var(--ink); margin-bottom: 0.5rem; }
.newsletter-left h2 em { color: var(--c-accent); }
.newsletter-left p { font-size: 0.88rem; color: var(--warm-gray); line-height: 1.8; max-width: 400px; }
.newsletter-form { display: flex; gap: 0; flex-shrink: 0; }
.newsletter-form input[type="email"] { width: 280px; padding: 1rem 1.2rem; font-family: var(--font-sans); font-size: 0.88rem; border: 1px solid var(--border); border-right: none; background: var(--white); color: var(--ink); outline: none; }
.newsletter-form input[type="email"]:focus { border-color: var(--terracotta); }
.newsletter-form input::placeholder { color: var(--warm-gray); }
.newsletter-form button { padding: 1rem 1.8rem; background: var(--c-bg-dark); color: var(--white); font-family: var(--font-sans); font-size: 0.65rem; letter-spacing: 0.15em; text-transform: uppercase; border: none; cursor: pointer; transition: background 0.3s ease; white-space: nowrap; }
.newsletter-form button:hover { background: var(--terracotta); }
@media (max-width: 1024px) {
  .newsletter { flex-direction: column; align-items: flex-start; gap: 2rem; }
  .newsletter-form input[type="email"], .newsletter-form { width: 100%; }
}
.nl { --nl-size: 0.9rem; --nl-height: 3.25rem; background: var(--c-bg-alt); border-top: 1px solid var(--border); padding: clamp(4rem, 8vw, 6.5rem) var(--pad-container); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; align-items: center; }
.nl__title { font-family: var(--font-serif); font-weight: var(--w-serif); font-size: clamp(2rem, 3.2vw, 2.8rem); line-height: 1.15; margin: 0 0 1rem; color: var(--c-title); }
.nl__text { font-family: var(--font-sans); font-size: var(--nl-size); line-height: 1.6; font-weight: 400; color: var(--c-text); max-width: 42ch; margin: 0; }
@media (max-width: 900px) {
  .nl { grid-template-columns: 1fr; gap: 2rem; }
}
/* Newsletter : titre d'une seule couleur, sans italique ; bouton comme les autres boutons */
.nl__title em { font-style: normal; color: inherit; }
/* ════════════════════════════════════════════════════════════════════════
   FENÊTRE NEWSLETTER (Substack)
   ════════════════════════════════════════════════════════════════════════ */
/* ── Fenêtre newsletter (Substack) ── */
.nl-modal { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 1rem; background: rgb(20 16 12 / .6); backdrop-filter: blur(4px); opacity: 0; visibility: hidden; pointer-events: none; cursor: pointer; transition: opacity .35s, visibility .35s; }
.nl-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.nl-modal__box { position: relative; width: min(34rem, 100%); max-height: calc(100vh - 2rem); overflow-y: auto; background: var(--c-bg); border-radius: 14px; padding: clamp(1.8rem, 4vw, 2.8rem); text-align: center; cursor: auto; transform: translateY(16px); transition: transform .4s ease; }
.nl-modal.is-open .nl-modal__box { transform: none; }
.nl-modal__close { position: absolute; top: .8rem; right: .8rem; width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--c-line) 20%, transparent); background: transparent; color: var(--c-title); font-size: 1.4rem; line-height: 1; cursor: pointer; }
.nl-modal__close:hover { background: var(--c-bg-dark); color: var(--c-on-photo); }
.nl-modal__title { font-family: var(--font-serif); font-weight: var(--w-serif); font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.15; color: var(--c-title); margin: .4rem 0 .8rem; }
.nl-modal__title em { color: var(--c-accent); }
.nl-modal__hint { font-size: .92rem; line-height: 1.7; color: var(--c-text); margin-bottom: 1.2rem; }
.nl-modal__frame { border-radius: 10px; overflow: hidden; background: #fff; }
.nl-modal__frame iframe { display: block; width: 100%; height: 320px; border: 0; }
.nl-modal__alt { display: inline-block; margin-top: 1.2rem; font-size: .62rem; }
/* Boutons « Subscribe » (ouvrent la fenêtre newsletter) */
.nl-open { cursor: pointer; font-family: var(--font-sans); }
.nl-open--footer { display: inline-flex; align-items: center; gap: .9rem; padding: .55rem .55rem .55rem 1.3rem; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--c-on-dark) 35%, transparent); background: transparent; color: var(--c-on-dark); font-size: .8rem; transition: border-color .3s; }
.nl-open--footer:hover { border-color: var(--c-on-dark); }
.nl-open__arrow { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; border: 1px solid currentColor; }
.exp-page-footer .nl-open--footer { margin-top: 1rem; }
/* Pied de page : logos Instagram, YouTube, Substack sous le bouton newsletter */
.footer-social { display: flex; gap: .7rem; margin-top: 1.3rem; }
.footer-social a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; color: var(--c-footer-head); border: 1px solid color-mix(in srgb, var(--c-footer-head) 45%, transparent); transition: color .3s, border-color .3s, background .3s; }
.footer-social a:hover { color: var(--c-bg-dark); background: var(--c-footer-head); border-color: var(--c-footer-head); }
@media (max-width: 600px) { .footer-social { justify-content: center; gap: 1rem; } }
/* ════════════════════════════════════════════════════════════════════════
   ENCART COOKIES
   ════════════════════════════════════════════════════════════════════════ */
/* ── Encart cookies (bas à droite) ── */
.cookie-box { position: fixed; right: clamp(1rem, 2vw, 1.5rem); bottom: clamp(1rem, 2vw, 1.5rem); z-index: 900; width: min(22rem, calc(100vw - 2rem)); padding: 1.3rem 1.4rem 1.2rem; border-radius: 14px; background: var(--c-bg); color: var(--c-text); border: 1px solid color-mix(in srgb, var(--c-line) 10%, transparent); box-shadow: 0 12px 40px rgb(26 20 16 / 0.12); opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease; pointer-events: none; }
.cookie-box.is-in { opacity: 1; transform: none; pointer-events: auto; }
.cookie-box p { font-family: var(--font-sans); font-size: 0.8rem; line-height: 1.6; margin: 0 0 1rem; }
.cookie-box__btns { display: flex; gap: 0.5rem; justify-content: flex-end; }
.cookie-box__btn { font-family: var(--font-sans); font-size: 0.6rem; letter-spacing: 0.18em; text-transform: uppercase; padding: 0.7rem 1.2rem; border-radius: 999px; cursor: pointer; background: transparent; color: var(--c-text); border: 1px solid color-mix(in srgb, var(--c-line) 25%, transparent); transition: background .3s, color .3s, border-color .3s; }
.cookie-box__btn:hover { border-color: var(--c-title); }
.cookie-box__btn--ok { background: var(--c-bg-dark); border-color: var(--c-bg-dark); color: var(--c-on-photo); }
.cookie-box__btn--ok:hover { background: transparent; color: var(--c-title); }
/* ════════════════════════════════════════════════════════════════════════
   ACCUEIL : manifeste
   ════════════════════════════════════════════════════════════════════════ */
.mf { background: var(--c-bg); padding: clamp(5rem, 9vw, 8rem) var(--pad-container); grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; border-bottom: 1px solid var(--border); }
.mf__aside { grid-column: 7 / span 5; }
@media (max-width: 900px) {
  .mf { grid-template-columns: 1fr; }
  .mf__aside { grid-column: 1; }
}
/* Accueil — Manifesto inversé : le texte en haut à gauche, la grande phrase plus bas à droite */
.mf__aside .surtitre { margin-bottom: 1.5rem; }
/* Accueil — Manifesto centré : surtitre, texte en Noto à la taille des titres (title-lg), lien */
.mf--centre { display: block; text-align: center; padding-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.mf--centre .mf__aside { max-width: 76rem; margin: 0 auto; padding: 0; border: none; }
.mf--centre .mf__body { font-family: var(--font-serif); font-weight: var(--w-serif); font-size: clamp(2rem, 4vw, 3rem); line-height: 1.3; color: var(--c-title); max-width: none; margin: 0 0 2.5rem; text-wrap: balance; }
/* ════════════════════════════════════════════════════════════════════════
   PAGE EXPEDITIONS : liste, approche, bandeau défilant
   ════════════════════════════════════════════════════════════════════════ */
.exp-meta-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; padding-bottom: 1.5rem; margin-bottom: 3rem; border-bottom: 1px solid color-mix(in srgb, var(--c-bg-dark) 10%, transparent); }
.meta-item span { display: block; font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 0.8rem; opacity: 0.5; }
.meta-item strong { font-family: var(--font-sans); font-size: 1.1rem; font-weight: 500; }
/* ── APPROACH ── */
.approach { background: var(--sand); border-bottom: 1px solid var(--border); }
/* ── EXPERIENCES TICKER ── */
.experiences { padding: 4rem 0; border-bottom: 1px solid var(--border); overflow: hidden; }
.exp-ticker { display: flex; gap: 0; white-space: nowrap; }
.exp-ticker-inner { display: flex; gap: 0; animation: ticker 28s linear infinite; }
.exp-ticker-inner:hover { animation-play-state: paused; }
@keyframes ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-20%); }
}
.ticker-item { display: inline-flex; align-items: center; font-family: var(--font-serif); font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: var(--w-serif); font-style: italic; color: var(--warm-gray); white-space: nowrap; }
.ticker-sep { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--terracotta); flex-shrink: 0; }
/* Bandeau défilant : la puce est exactement au milieu entre deux phrases (même espace de chaque côté) */
.ticker-item { gap: 2.5rem; padding: 0 0 0 2.5rem; }
/* ════════════════════════════════════════════════════════════════════════
   PAGES EXPÉDITION
   ════════════════════════════════════════════════════════════════════════ */
/* Hero expédition */
.exp-hero { height: 100vh; min-height: 700px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; color: var(--white); overflow: hidden; }
.exp-hero__image-wrap { position: absolute; inset: 0; z-index: 1; }
.exp-hero__image-wrap img { width: 100%; height: 100%; object-fit: cover; object-position: center; animation: subtle-zoom 20s ease-in-out infinite alternate; }
.exp-hero__overlay { position: absolute; inset: 0; z-index: 2; background: linear-gradient(to bottom, color-mix(in srgb, var(--c-overlay) 15%, transparent) 10%, color-mix(in srgb, var(--c-overlay) 50%, transparent) 80%, color-mix(in srgb, var(--c-overlay) 85%, transparent) 100%); }
.exp-hero__content { position: relative; z-index: 3; padding: 0 var(--pad-container) 4rem; }
.exp-hero__eyebrow { display: block; margin-bottom: 1rem; }
.exp-hero__title { font-family: var(--font-serif); font-size: clamp(3.5rem, 7vw, 6.5rem); font-weight: var(--w-serif); line-height: 1.05; color: var(--white); margin-bottom: 0.5rem; }
.exp-hero__title em { color: var(--white); opacity: 0.85; }
.exp-hero__subtitle { font-family: var(--font-sans); font-size: 0.85rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-on-dark); margin-bottom: 0; }
/* Scroll hint */
.scroll-hint { position: absolute; bottom: 2rem; right: var(--pad-container); z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--c-on-dark); font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; }
.scroll-line { width: 1px; height: 40px; background: color-mix(in srgb, var(--c-on-dark) 30%, transparent); animation: scroll-pulse 2s ease-in-out infinite; }
@keyframes scroll-pulse {
  0%, 100% { opacity: 0.3; transform: scaleY(1); }
  50% { opacity: 0.8; transform: scaleY(0.6); }
}
/* Bandeau specs — juste sous le hero */
.exp-specs { grid-template-columns: repeat(6, 1fr); color: var(--white); border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.exp-spec-item { display: flex; flex-direction: column; gap: 0.5rem; }
.exp-spec-item:last-child { border-right: none; }
.exp-spec-value { font-family: var(--font-sans); font-size: 0.95rem; line-height: 1.4; }
.exp-spec-accent { color: var(--gold); }
/* Intro — texte d'introduction 2 colonnes */
.exp-intro { display: grid; grid-template-columns: 1fr 1.6fr; border-bottom: 1px solid var(--border); background: var(--light); }
.exp-intro__left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid var(--border); }
.exp-intro__left p { font-family: var(--font-serif); font-size: clamp(1.6rem, 2.5vw, 2.2rem); font-weight: var(--w-serif); line-height: 1.3; color: var(--ink); }
.exp-intro__left em { color: var(--c-accent); }
.exp-intro__right { padding: var(--pad-section) var(--pad-container); }
.exp-intro__right p { color: var(--warm-gray); line-height: 1.9; margin-bottom: 1.2rem; font-size: 0.95rem; }
/* The experience — image + texte */
.exp-experience { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); background: var(--sand); }
.exp-experience__image { overflow: hidden; }
.exp-experience__image img { width: 100%; height: 100%; object-fit: cover; }
.exp-experience__content { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; justify-content: center; }
.exp-experience__content h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: var(--w-serif); line-height: 1.2; margin-bottom: 1.5rem; }
.exp-experience__content h2 em { color: var(--c-accent); }
.exp-experience__content p { color: var(--warm-gray); line-height: 1.85; margin-bottom: 1.2rem; font-size: 0.93rem; }
.exp-point { padding: 0.9rem 1.2rem; font-size: 0.85rem; line-height: 1.5; }
/* ── Header universel pour les sections de page expédition ── */
.exp-section-header { padding: var(--pad-section) var(--pad-container) 3rem; border-bottom: 1px solid var(--border); }
.exp-section-header h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; }
/* Highlights — grille 4 cartes même ratio */
.exp-highlights { background: var(--light); border-bottom: 1px solid var(--border); }
.exp-highlights__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.exp-highlight-card { position: relative; aspect-ratio: 3/4; overflow: hidden; border-right: 1px solid var(--border); }
.exp-highlight-card:last-child { border-right: none; }
.exp-highlight-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1); }
.exp-highlight-card:hover img { transform: scale(1.05); }
.exp-highlight-card__text { position: absolute; bottom: 0; left: 0; right: 0; z-index: 2; }
.exp-highlight-card__text h3 { font-family: var(--font-sans); font-weight: 400; color: var(--white); line-height: 1.4; }
/* Itinéraire — ligne verticale continue */
.exp-itinerary { background: var(--light); border-bottom: 1px solid var(--border); padding-bottom: var(--pad-section); }
.exp-itinerary__grid { display: grid; grid-template-columns: 60px 1fr; padding: 0 var(--pad-container); max-width: 900px; }
.day-line { display: flex; flex-direction: column; align-items: center; }
.day-dot { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--terracotta); background: var(--light); flex-shrink: 0; z-index: 1; }
.day-connector { width: 1px; flex: 1; }
.day-entry { padding: 3rem 0 3rem 2rem; }
.day-entry:last-of-type { border-bottom: none; }
.day-num { display: block; margin-bottom: 0.6rem; }
.day-entry h4 { font-family: var(--font-serif); font-size: 1.3rem; font-weight: var(--w-serif); margin-bottom: 0.8rem; color: var(--ink); }
.day-entry p { font-size: 0.88rem; color: var(--warm-gray); line-height: 1.85; margin-bottom: 1rem; }
/* Photo break dans l'itinéraire — la ligne continue */
.exp-itinerary__photo-break { grid-column: 1 / -1; display: grid; grid-template-columns: 60px 2rem 1fr; }
.exp-itinerary__photo-break::before { content: ''; display: block; width: 1px; margin: 0 auto; }
.exp-itinerary__photo-break img { height: 420px; object-fit: cover; display: block; }
/* Prix */
.exp-price { grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); background: var(--sand); }
.exp-price__tag { font-family: var(--font-serif); font-size: 3.82rem; font-weight: var(--w-serif); line-height: 1; color: var(--ink); }
.exp-price__note { font-size: 0.8rem; color: var(--warm-gray); }
.exp-include-list { display: flex; flex-direction: column; }
.exp-include-list li { color: var(--warm-gray); position: relative; line-height: 1.5; }
.exp-include-list li::before { position: absolute; color: var(--terracotta); font-size: 0.75rem; }
/* Bloc CTA */
.exp-cta-btn { display: inline-block; padding: 1.1rem 2.2rem; font-size: 0.65rem; letter-spacing: 0.15em; transition: 0.3s ease; }
/* Indicateur de places */
.exp-spot { width: 28px; height: 28px; border-radius: 50%; background: var(--terracotta); }
.exp-spot.empty { background: transparent; border: 1.5px solid var(--border); }
/* Guide */
.exp-leader { display: grid; grid-template-columns: 1fr 1.4fr; background: var(--light); }
.exp-leader__image { overflow: hidden; }
.exp-leader__image img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.exp-leader__content { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; justify-content: center; }
.exp-leader__content h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); }
.exp-leader__role { display: block; font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 2rem; }
.exp-leader__content p { color: var(--warm-gray); line-height: 1.85; margin-bottom: 1.2rem; font-size: 0.93rem; }
/* Engagement */
.exp-commitment { display: grid; grid-template-columns: 1fr 1fr; background: var(--c-bg-dark); color: var(--white); border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.exp-commitment__content { padding: var(--pad-section) var(--pad-container); border-right: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.exp-commitment__content h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; margin-bottom: 2rem; color: var(--white); }
.exp-commitment__content p { color: var(--c-on-dark); line-height: 1.85; margin-bottom: 1.2rem; font-size: 0.93rem; }
.exp-commitment__stats { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; justify-content: center; gap: 3rem; }
.exp-commitment__stat { border-left: 2px solid var(--terracotta); padding-left: 2rem; }
.exp-commitment__stat .big { display: block; font-family: var(--font-serif); font-size: 2.55rem; font-weight: var(--w-serif); color: var(--white); line-height: 1; margin-bottom: 0.5rem; }
.exp-commitment__stat p { color: var(--c-on-dark); font-size: 0.85rem; line-height: 1.6; }
/* FAQ */
.exp-faq { background: var(--sand); border-bottom: 1px solid var(--border); }
.exp-faq__wrap { display: grid; grid-template-columns: 1fr 1.8fr; }
.exp-faq__intro { padding: var(--pad-section) var(--pad-container); border-right: 1px solid var(--border); }
.exp-faq__intro h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 2.5vw, 2.4rem); font-weight: var(--w-serif); margin-bottom: 1rem; }
.exp-faq__intro p { font-size: 0.88rem; color: var(--warm-gray); line-height: 1.8; }
.exp-faq__list { padding: var(--pad-section) var(--pad-container); }
.exp-faq__item { border-bottom: 1px solid var(--border); }
.exp-faq__q { padding: 1.4rem 0; font-size: 0.93rem; font-weight: 500; cursor: pointer; display: flex; justify-content: space-between; align-items: center; color: var(--ink); }
.exp-faq__q::after { content: '+'; font-size: 1.2rem; font-weight: 300; color: var(--terracotta); transition: transform 0.3s ease; }
.exp-faq__item.open .exp-faq__q::after { transform: rotate(45deg); }
.exp-faq__a { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.exp-faq__item.open .exp-faq__a { max-height: 400px; }
.exp-faq__a-inner { padding: 0 0 1.5rem; font-size: 0.88rem; color: var(--warm-gray); line-height: 1.85; }
/* Footer CTA terracotta */
.exp-footer-cta { grid-template-columns: 1fr 1fr; background: var(--terracotta); color: var(--white); }
.exp-footer-cta__left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 3rem); font-weight: var(--w-serif); line-height: 1.2; color: var(--white); }
.exp-footer-cta__left h2 em { color: var(--c-on-dark); }
.exp-footer-cta__right { display: flex; flex-direction: column; justify-content: center; }
.exp-footer-cta__sub { font-size: 0.75rem; color: var(--c-on-dark); letter-spacing: 0.05em; }
/* Footer page expédition */
.exp-page-footer { color: var(--white); }
@media (max-width: 1024px) {
  /* ── RESPONSIVE PAGE EXPÉDITION ── */
  .exp-specs { grid-template-columns: repeat(3, 1fr); }
  .exp-highlights__grid { grid-template-columns: repeat(2, 1fr); }
  .exp-highlight-card { border-bottom: 1px solid var(--border); }
  .exp-highlight-card:nth-child(2n) { border-right: none; }
  .exp-price, .exp-leader, .exp-commitment, .exp-faq__wrap, .exp-footer-cta { grid-template-columns: 1fr; }
  .exp-commitment__content, .exp-faq__intro { border-right: none; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
  .exp-leader__image { height: 400px; }
}
@media (max-width: 768px) {
  .exp-intro, .exp-experience { grid-template-columns: 1fr; }
  .exp-intro__left { border-right: none; border-bottom: 1px solid var(--border); }
  .exp-specs { grid-template-columns: repeat(2, 1fr); }
  .exp-highlights__grid { grid-template-columns: 1fr; }
  .exp-highlight-card { border-right: none; }
  .exp-itinerary__grid { grid-template-columns: 40px 1fr; padding: 0 var(--pad-mobile); }
  .exp-itinerary__photo-break { grid-template-columns: 40px 2rem 1fr; }
  .exp-itinerary__photo-break img { height: 280px; }
  .exp-footer-cta { grid-template-columns: 1fr; }
}
/* FAQ : plusieurs paragraphes dans une réponse */
.exp-faq__a-inner p + p { margin-top: 0.8rem; }
.exp-hero em, .exp-commitment em, .journal-hero em, .page-hero em, .photo-hero em, .doc-hero em, .article-hero em { color: var(--c-accent-on-dark); }
/* Pastilles et boutons */
.exp-cta-btn:hover { background: var(--c-btn-bg); color: var(--c-btn-text); }
.exp-cta-btn { background: var(--c-badge-open); color: var(--c-badge-text); font-family: var(--font-sans); text-transform: uppercase; }
/* Pied de page */
.exp-page-footer { background: var(--c-bg-footer); }
/* Titre du haut : entièrement clair, sans italique */
.exp-hero h1, .exp-hero h1 em { color: var(--c-on-photo); font-style: normal; opacity: 1; }
/* Bandeau d'infos : intitulés = surtitres ; chaque info sur une ligne, en clair */
.exp-specs { display: flex; flex-wrap: wrap; gap: 1px; background: color-mix(in srgb, var(--c-on-dark) 10%, var(--c-bg-dark)); }
.exp-spec-item { flex: 1 1 auto; border-right: none; background: var(--c-bg-dark); padding: 2.2rem 1.6rem; white-space: nowrap; }
.exp-spec-value, .exp-spec-value b { color: var(--c-on-photo); font-weight: 400; }
.exp-spec-note { display: inline; font-size: inherit; font-weight: inherit; color: var(--c-on-photo); }
.exp-spec-note--small { font-size: 0.7rem; letter-spacing: 0.02em; margin-left: 0.25em; }
/* About the expedition : le texte de droite démarre à la hauteur du texte de gauche */
.exp-intro .surtitre { line-height: 1rem; margin-bottom: 1.5rem; }
.exp-intro__right { padding-top: calc(var(--pad-section) + 2.5rem); }
/* The experience : points forts — même style qu'avant (trait à gauche, fond très léger), en doré */
.exp-point { background: color-mix(in srgb, var(--c-surtitle) 5%, transparent); border-left: 2px solid var(--c-surtitle); color: var(--ink); }
/* Highlights : texte des photos sur une ligne, un peu plus grand */
.exp-highlight-card__text { padding: 1.5rem 1.25rem; }
.exp-highlight-card__text h3 { font-size: clamp(0.9rem, 1.1vw, 1.15rem); letter-spacing: 0.02em; text-wrap: balance; }
/* Itinéraire : pas de traits entre les jours, ligne dorée, étiquettes vert d'eau */
.day-entry { border-bottom: none; }
/* ligne continue d'un jour à l'autre (le trait passe aussi au-dessus de chaque point) */
.day-line { padding-top: 0; }
.day-line::before { content: ''; width: 1px; height: 3rem; flex: none; background: var(--c-surtitle); }
.exp-itinerary__grid > .day-line:first-child::before { background: transparent; }
.day-connector, .exp-itinerary__photo-break::before { background: var(--c-surtitle); }
.day-dot { border-color: var(--c-surtitle); transition: background 0.35s ease, transform 0.35s ease; }
.day-dot.filled { background: var(--c-surtitle); transform: scale(1.35); }
/* Prix : montant centré, deux listes centrées, un bouton */
.exp-price { display: block; text-align: center; }
.exp-price__head .exp-price__note { margin-bottom: 0; }
.exp-price__lists { display: grid; justify-content: center; text-align: left; }
.exp-price__cta { text-align: center; }
/* « Ready to… » : titre sur une ligne si la place le permet, plus de trait central */
.exp-footer-cta { display: block; text-align: center; padding: 5rem var(--pad-container); }
.exp-footer-cta__left { padding: 0; border: none !important; }
.exp-footer-cta__right { padding: 0; border: none !important; align-items: center; }
.exp-footer-cta__right .exp-cta-btn { align-self: center; background: var(--c-link); color: var(--c-on-photo); border: 1px solid var(--c-on-photo); }
.exp-footer-cta__right .exp-cta-btn:hover { background: var(--c-on-photo); color: var(--c-link); }
@media (max-width: 768px) {
  .exp-intro__right { padding-top: var(--pad-section); }
}
@media (max-width: 600px) {
  .exp-spec-item { flex-basis: 40%; white-space: normal; }
}
/* Prix : plus compact, pour tenir dans un écran */
.exp-price { padding: clamp(3.5rem, 6vw, 5rem) var(--pad-container); }
.exp-price .surtitre { margin-bottom: 1rem; }
.exp-price__tag { margin-bottom: 0.4rem; }
.exp-price__lists { grid-template-columns: repeat(2, minmax(0, 34rem)); gap: 0; margin: 2.25rem auto; }
.exp-price__col { padding: 0 3rem; }
.exp-price__col + .exp-price__col { border-left: 1px solid var(--border); }
.exp-price__col h4 { font-family: var(--font-sans); font-size: 0.65rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-surtitle); margin-bottom: 1rem; }
.exp-price .exp-include-list { gap: 0.4rem; }
.exp-price .exp-include-list li { font-size: 0.85rem; padding-left: 1.1rem; }
.exp-price .exp-include-list li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--c-surtitle); top: 0.6em; left: 0; }
/* Guide : sous-titre foncé, collé au nom */
.exp-leader__content h2 { margin-bottom: 0.3rem; line-height: 1.15; }
.exp-leader__role { color: var(--c-title); margin-top: 0; }
/* Responsibility : barres verticales dorées */
.exp-commitment__stat { border-left-color: var(--c-surtitle); }
/* Sign up : même écart entre titre, bouton et ligne d'infos */
.exp-footer-cta { --cta-gap: 2rem; }
.exp-footer-cta__left h2 { text-wrap: balance; margin: 0; }
.exp-footer-cta__right { margin-top: var(--cta-gap); gap: var(--cta-gap); }
/* FAQ : « Write to us » sur sa propre ligne */
.exp-faq__intro .link-underline { display: block; width: fit-content; margin-top: 1rem; }
@media (max-width: 768px) {
  .exp-price__lists { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .exp-price__col { padding: 0; }
  .exp-price__col + .exp-price__col { border-left: none; }
}
/* Itinéraire : les photos commencent au même endroit que le texte des jours (3e colonne, après la ligne et l'écart de 2rem) */
.exp-itinerary__photo-break img { grid-column: 3; width: 100%; }
/* Prix : le bouton s'inverse au survol */
.exp-price .exp-cta-btn { border: 1px solid var(--c-link); }
.exp-price .exp-cta-btn:hover { background: transparent; color: var(--c-link); }
/* Guide : plus de trait clair entre la photo et le bandeau sombre */
.exp-leader { border-bottom: none; }
.exp-leader__image img { display: block; }
/* ════════════════════════════════════════════════════════════════════════
   PAGE ABOUT
   ════════════════════════════════════════════════════════════════════════ */
/* ── ABOUT PAGE SPECIFIC ── */
/* Mission statement band */
.mission { background: var(--c-bg-dark); color: var(--sand); padding: var(--pad-section) var(--pad-container); display: grid; grid-template-columns: 1fr 2fr; gap: 6rem; align-items: center; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.mission-label { display: block; margin-bottom: 1.5rem; }
/* Founders section */
.founders { border-bottom: 1px solid var(--border); }
/* Story section */
.story { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border); }
/* Impact section */
.impact { background: var(--sand); border-top: 1px solid var(--border); }
@media (max-width: 900px) {
  /* CTA section */
  .mission { grid-template-columns: 1fr; padding: 4rem var(--pad-mobile); gap: 2.5rem; }
  .story { grid-template-columns: 1fr; }
}
/* ════════════════════════════════════════════════════════════════════════
   PAGE DOCUMENTARY
   ════════════════════════════════════════════════════════════════════════ */
/* ── DOC HERO ── */
.doc-hero { height: 100vh; min-height: 700px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; background: var(--c-bg-dark); }
.doc-hero-reel { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 3px; opacity: 0.45; }
.doc-hero-reel-frame { overflow: hidden; position: relative; }
.doc-hero-reel-frame img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(30%); }
/* Offset each column vertically for a film-strip feel */
.doc-hero-reel-frame:nth-child(3n + 1) { animation: drift-up 40s linear infinite; }
.doc-hero-reel-frame:nth-child(3n + 2) { animation: drift-down 35s linear infinite; }
.doc-hero-reel-frame:nth-child(3n) { animation: drift-up 45s linear infinite; }
@keyframes drift-up { from { transform: translateY(0); } to { transform: translateY(-8%); } }
@keyframes drift-down { from { transform: translateY(-4%); } to { transform: translateY(4%); } }
.doc-hero-overlay { position: absolute; inset: 0; background: linear-gradient( 135deg, color-mix(in srgb, var(--c-bg-dark) 85%, transparent) 0%, color-mix(in srgb, var(--c-bg-dark) 50%, transparent) 50%, color-mix(in srgb, var(--c-bg-dark) 88%, transparent) 100% ); }
.doc-hero-content { position: relative; padding: 0 5rem 5rem; max-width: 820px; }
.doc-hero-eyebrow { margin-bottom: 1.5rem; display: block; animation: fadeUp 0.8s 0.3s forwards; }
.doc-hero-title { font-family: var(--font-serif); font-size: clamp(4rem, 8vw, 7rem); font-weight: var(--w-serif); line-height: 0.92; color: white; margin-bottom: 2.5rem; opacity: 0; animation: fadeUp 0.9s 0.5s forwards; }
.doc-hero-title em { font-style: italic; color: var(--c-accent); }
.doc-hero-desc { font-size: 1rem; color: var(--c-on-dark); max-width: 500px; line-height: 1.85; opacity: 0; animation: fadeUp 0.8s 0.75s forwards; }
/* Film-grain texture overlay */
.doc-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); background-repeat: repeat; background-size: 180px; opacity: 0.35; mix-blend-mode: overlay; }
/* ── INTRO STATEMENT ── */
.doc-intro { display: grid; grid-template-columns: 1fr 2fr; border-bottom: 1px solid var(--border); }
.doc-intro-left { padding: 7rem 4rem; border-right: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
.doc-intro-left blockquote { font-family: var(--font-serif); font-size: clamp(1.4rem, 2vw, 1.9rem); font-weight: var(--w-serif); line-height: 1.5; color: var(--ink); }
.doc-intro-left blockquote em { font-style: italic; color: var(--c-accent); }
.doc-intro-right { padding: 7rem 5rem; display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-content: center; }
.doc-intro-right p { font-size: 1rem; color: var(--c-text); line-height: 1.9; }
/* ── FILMS SECTION HEADER ── */
.films-header { padding: 5rem 5rem 3rem; display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 1px solid var(--border); }
.films-header h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: var(--w-serif); line-height: 1.1; }
.films-header h2 em { font-style: italic; color: var(--c-accent); }
.films-filter { display: flex; gap: 0; border: 1px solid var(--border); }
.filter-btn { font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase; padding: 0.55rem 1.2rem; background: none; border: none; border-right: 1px solid var(--border); color: var(--warm-gray); cursor: pointer; transition: background 0.2s, color 0.2s; font-family: var(--font-sans); }
.filter-btn:last-child { border-right: none; }
.filter-btn.active, .filter-btn:hover { background: var(--c-bg-dark); color: var(--sand); }
/* ── FEATURED FILM ── */
.film-featured { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); min-height: 560px; text-decoration: none; color: inherit; }
.film-featured-visual { position: relative; overflow: hidden; background: var(--c-bg-dark); }
.film-featured-thumb { width: 100%; height: 100%; object-fit: cover; opacity: 0.75; transition: opacity 0.5s, transform 0.9s cubic-bezier(0.25,0.46,0.45,0.94); }
.film-featured:hover .film-featured-thumb { opacity: 0.9; transform: scale(1.04); }
.film-play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 72px; height: 72px; border-radius: 50%; border: 1.5px solid color-mix(in srgb, var(--c-on-dark) 60%, transparent); background: color-mix(in srgb, var(--c-on-dark) 8%, transparent); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); transition: border-color 0.3s, background 0.3s, transform 0.3s; }
.film-featured:hover .film-play-btn { border-color: white; background: color-mix(in srgb, var(--c-on-dark) 15%, transparent); transform: translate(-50%, -50%) scale(1.08); }
.film-play-btn svg { margin-left: 4px; }
.film-duration { position: absolute; bottom: 1.5rem; right: 1.5rem; font-size: 0.62rem; letter-spacing: 0.12em; color: var(--c-on-dark); background: color-mix(in srgb, var(--c-bg-dark) 60%, transparent); padding: 0.3rem 0.7rem; backdrop-filter: blur(4px); }
.film-featured-badge { position: absolute; top: 1.5rem; left: 1.5rem; font-size: 0.55rem; letter-spacing: 0.16em; text-transform: uppercase; background: var(--terracotta); color: white; padding: 0.3rem 0.8rem; }
.film-featured-content { padding: 5rem 5rem; background: var(--sand); display: flex; flex-direction: column; justify-content: center; }
.film-featured-content .surtitre { margin-bottom: 1.5rem; }
.film-featured-content h3 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.1; margin-bottom: 0.5rem; }
.film-featured-content h3 em { font-style: italic; color: var(--c-accent); }
.film-subtitle { font-family: var(--font-serif); font-style: italic; font-size: 1.1rem; color: var(--warm-gray); margin-bottom: 2.5rem; display: block; font-weight: var(--w-serif); }
.film-featured-content p { font-size: 0.95rem; color: var(--c-text); line-height: 1.9; max-width: 440px; margin-bottom: 2.5rem; }
.film-tags { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 3rem; }
.film-tag { font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; border: 1px solid var(--border); padding: 0.3rem 0.8rem; color: var(--warm-gray); }
.film-watch-link { font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink); display: inline-flex; align-items: center; gap: 0.8rem; text-decoration: none; transition: gap 0.2s; }
.film-featured:hover .film-watch-link { gap: 1.3rem; }
.film-watch-link::after { content: '→'; font-size: 1rem; }
/* ── FILMS GRID ── */
.films-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--border); }
.film-card { border-right: 1px solid var(--border); text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: background 0.3s; }
.film-card:last-child { border-right: none; }
.film-card:hover { background: var(--sand); }
.film-card-visual { position: relative; overflow: hidden; height: 280px; background: var(--c-bg-dark); }
.film-card-visual img { width: 100%; height: 100%; object-fit: cover; opacity: 0.72; transition: opacity 0.4s, transform 0.8s cubic-bezier(0.25,0.46,0.45,0.94); }
.film-card:hover .film-card-visual img { opacity: 0.88; transform: scale(1.05); }
.film-card-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 48px; height: 48px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--c-on-dark) 50%, transparent); background: color-mix(in srgb, var(--c-on-dark) 6%, transparent); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); transition: border-color 0.3s, background 0.3s; }
.film-card:hover .film-card-play { border-color: white; background: color-mix(in srgb, var(--c-on-dark) 14%, transparent); }
.film-card-duration { position: absolute; bottom: 1rem; right: 1rem; font-size: 0.58rem; letter-spacing: 0.1em; color: var(--c-on-dark); background: color-mix(in srgb, var(--c-bg-dark) 55%, transparent); padding: 0.25rem 0.6rem; backdrop-filter: blur(4px); }
.film-card-content { padding: 2.5rem 3rem; flex: 1; display: flex; flex-direction: column; }
.film-card-region { font-size: 0.58rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-surtitle); margin-bottom: 0.5rem; display: block; }
.film-card-title { font-family: var(--font-serif); font-size: 1.5rem; font-weight: var(--w-serif); line-height: 1.15; margin-bottom: 0.4rem; }
.film-card-subtitle { font-family: var(--font-serif); font-style: italic; font-size: 0.95rem; color: var(--warm-gray); margin-bottom: 1.2rem; display: block; font-weight: var(--w-serif); }
.film-card-desc { font-size: 0.85rem; color: var(--c-text); line-height: 1.8; flex: 1; margin-bottom: 1.8rem; }
.film-card-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 1.5rem; border-top: 1px solid var(--border); margin-top: auto; }
.film-card-year { font-size: 0.7rem; color: var(--warm-gray); }
.film-card-cta { font-size: 0.6rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--warm-gray); display: flex; align-items: center; gap: 0.5rem; transition: color 0.2s, gap 0.2s; }
.film-card:hover .film-card-cta { color: var(--ink); gap: 0.9rem; }
.film-card-cta::after { content: '→'; }
/* ── COMING SOON CARD (inline with grid) ── */
.film-card--soon { background: var(--sand); border-right: 1px solid var(--border); display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: 3rem; min-height: 420px; position: relative; overflow: hidden; }
.film-card--soon::before { content: 'KARAI'; font-family: var(--font-serif); font-size: 9rem; font-weight: var(--w-serif); line-height: 1; color: color-mix(in srgb, var(--c-bg-dark) 4%, transparent); position: absolute; bottom: -1rem; right: -1rem; letter-spacing: 0.1em; }
.film-card--soon .surtitre { margin-bottom: 1rem; }
.film-card--soon h3 { font-family: var(--font-serif); font-size: 1.6rem; font-weight: var(--w-serif); line-height: 1.2; margin-bottom: 0.8rem; }
.film-card--soon h3 em { font-style: italic; color: var(--c-accent); }
.film-card--soon p { font-size: 0.88rem; color: var(--c-text); line-height: 1.8; max-width: 280px; margin-bottom: 2rem; }
.film-card--soon .coming-badge { font-size: 0.6rem; letter-spacing: 0.18em; text-transform: uppercase; border: 1px solid var(--terracotta); color: var(--terracotta); padding: 0.45rem 1rem; display: inline-block; }
/* ── PROCESS / HOW WE MAKE FILMS ── */
.doc-process { background: var(--c-bg-dark); color: var(--sand); border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.doc-process-top { padding: 7rem 5rem 5rem; display: grid; grid-template-columns: 1fr 2fr; gap: 8rem; align-items: start; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.doc-process-top h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: var(--w-serif); line-height: 1.15; color: var(--sand); }
.doc-process-top h2 em { font-style: italic; color: var(--c-accent); }
.doc-process-top p { font-size: 1rem; color: var(--c-on-dark); line-height: 1.9; margin-bottom: 1.4rem; max-width: 580px; }
.doc-process-steps { display: grid; grid-template-columns: repeat(4, 1fr); }
.process-step { padding: 4rem 3.5rem; border-right: 1px solid color-mix(in srgb, var(--c-on-dark) 7%, transparent); position: relative; }
.process-step:last-child { border-right: none; }
.process-step-num { font-family: var(--font-serif); font-size: 3.4rem; font-weight: var(--w-serif); line-height: 1; color: color-mix(in srgb, var(--c-accent) 15%, transparent); display: block; margin-bottom: 1.5rem; }
.process-step h4 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: var(--w-serif); color: var(--sand); margin-bottom: 0.8rem; }
.process-step p { font-size: 0.85rem; color: var(--c-on-dark); line-height: 1.8; }
/* ── QUOTE / PULL ── */
.doc-quote { padding: 9rem 5rem; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--border); background: var(--sand); text-align: center; }
.doc-quote blockquote { font-family: var(--font-serif); font-size: clamp(1.8rem, 3.5vw, 3rem); font-weight: var(--w-serif); line-height: 1.4; color: var(--ink); max-width: 900px; }
.doc-quote blockquote em { font-style: italic; color: var(--c-accent); }
.doc-quote-attr { font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--warm-gray); margin-top: 2.5rem; display: block; }
/* ── SCREENINGS & AWARDS ── */
.doc-screenings { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); }
.doc-screenings-left { padding: 7rem 5rem; border-right: 1px solid var(--border); }
.doc-screenings-left h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: var(--w-serif); line-height: 1.1; margin-bottom: 3rem; }
.doc-screenings-left h2 em { font-style: italic; color: var(--c-accent); }
.screening-list { display: flex; flex-direction: column; }
.screening-item { padding: 1.6rem 0; display: grid; grid-template-columns: 80px 1fr auto; gap: 1.5rem; align-items: center; border-bottom: 1px solid var(--border); }
.screening-item:first-child { border-top: 1px solid var(--border); }
.screening-year { font-family: var(--font-serif); font-size: 1.4rem; font-weight: var(--w-serif); color: var(--warm-gray); line-height: 1; }
.screening-info h4 { font-size: 0.9rem; font-weight: 500; margin-bottom: 0.2rem; }
.screening-info span { font-size: 0.75rem; color: var(--warm-gray); }
.screening-film { font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--terracotta); background: color-mix(in srgb, var(--c-link) 8%, transparent); padding: 0.3rem 0.7rem; white-space: nowrap; }
.doc-screenings-right { padding: 7rem 5rem; background: var(--sand); display: flex; flex-direction: column; justify-content: center; }
.doc-screenings-right h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: var(--w-serif); line-height: 1.1; margin-bottom: 3rem; }
.doc-screenings-right h2 em { font-style: italic; color: var(--c-accent); }
.award-list { display: flex; flex-direction: column; gap: 2rem; }
.award-item { display: flex; align-items: flex-start; gap: 1.5rem; padding-bottom: 2rem; border-bottom: 1px solid var(--border); }
.award-item:last-child { border-bottom: none; padding-bottom: 0; }
.award-icon { font-family: var(--font-serif); font-size: 1.8rem; color: var(--gold); line-height: 1; flex-shrink: 0; font-weight: var(--w-serif); }
.award-item h4 { font-size: 0.9rem; font-weight: 500; margin-bottom: 0.2rem; }
.award-item p { font-size: 0.78rem; color: var(--warm-gray); line-height: 1.6; }
/* ── COLLAB BAND ── */
.doc-collab { background: var(--c-bg-dark); color: var(--sand); padding: 7rem 5rem; display: grid; grid-template-columns: 1fr 1fr; gap: 8rem; align-items: center; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.doc-collab-left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: var(--w-serif); line-height: 1.15; color: var(--sand); margin-bottom: 2rem; }
.doc-collab-left h2 em { font-style: italic; color: var(--c-accent); }
.doc-collab-left p { font-size: 0.95rem; color: var(--c-on-dark); line-height: 1.9; max-width: 460px; margin-bottom: 2.5rem; }
.doc-collab-right { display: flex; flex-direction: column; gap: 0; }
.collab-type { padding: 2.5rem 0; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); display: flex; align-items: center; gap: 2rem; }
.collab-type:first-child { border-top: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.collab-type-label { min-width: 140px; }
.collab-type p { font-size: 0.88rem; color: var(--c-on-dark); line-height: 1.7; }
@media (max-width: 900px) {
  /* ── RESPONSIVE ── */
  .doc-hero-reel { grid-template-columns: 1fr 1fr; }
  .doc-hero-content { padding: 0 2rem 3.5rem; }
  .doc-intro { grid-template-columns: 1fr; }
  .doc-intro-left { border-right: none; border-bottom: 1px solid var(--border); padding: 4rem 2rem; }
  .doc-intro-right { grid-template-columns: 1fr; padding: 4rem 2rem; gap: 2rem; }
  .films-header { flex-direction: column; align-items: flex-start; gap: 1.5rem; padding: 3rem 2rem 2rem; }
  .film-featured { grid-template-columns: 1fr; }
  .film-featured-visual { height: 320px; }
  .film-featured-content { padding: 3.5rem 2rem; }
  .films-grid { grid-template-columns: 1fr; }
  .film-card { border-right: none; border-bottom: 1px solid var(--border); }
  .film-card--soon { border-right: none; min-height: 320px; }
  .doc-process-top { grid-template-columns: 1fr; gap: 3rem; padding: 5rem 2rem 3rem; }
  .doc-process-steps { grid-template-columns: 1fr 1fr; }
  .process-step { border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 7%, transparent); }
  .process-step:nth-child(even) { border-right: none; }
  .doc-quote { padding: 6rem 2rem; }
  .doc-screenings { grid-template-columns: 1fr; }
  .doc-screenings-left { border-right: none; border-bottom: 1px solid var(--border); padding: 4rem 2rem; }
  .doc-screenings-right { padding: 4rem 2rem; }
  .screening-item { grid-template-columns: 60px 1fr; }
  .screening-film { display: none; }
  .doc-collab { grid-template-columns: 1fr; gap: 4rem; padding: 5rem 2rem; }
}
/* ════════════════════════════════════════════════════════════════════════
   VISIONNEUSE VIDÉO
   ════════════════════════════════════════════════════════════════════════ */
/* ── VIDEO LIGHTBOX ── */
.video-lightbox { display: none; position: fixed; inset: 0; z-index: 2000; background: color-mix(in srgb, var(--c-bg-dark) 96%, transparent); backdrop-filter: blur(8px); align-items: center; flex-direction: column; }
.video-lightbox.open { display: flex; }
.video-lightbox-inner { position: relative; }
.video-lightbox-inner iframe, .video-lightbox-inner video { width: 100%; aspect-ratio: 16/9; display: block; border: none; }
.video-lightbox-meta { margin-top: 1.5rem; display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; }
.video-lightbox-title { font-family: var(--font-serif); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: var(--w-serif); color: var(--c-on-dark); line-height: 1.2; }
.video-lightbox-title em { color: var(--c-accent); }
.video-lightbox-sub { font-size: 0.75rem; color: color-mix(in srgb, var(--c-on-dark) 40%, transparent); letter-spacing: 0.05em; margin-top: 0.3rem; display: block; }
.video-lightbox-close { position: fixed; top: 2rem; right: 2.5rem; background: none; border: none; cursor: pointer; color: color-mix(in srgb, var(--c-on-dark) 45%, transparent); transition: color 0.2s; padding: 0.5rem; line-height: 1; font-size: 0.6rem; letter-spacing: 0.15em; text-transform: uppercase; display: flex; align-items: center; gap: 0.6rem; }
.video-lightbox-close:hover { color: var(--white); }
.video-lightbox-close svg { display: block; }
@media (max-width: 768px) {
  .video-lightbox-meta { flex-direction: column; gap: 0.5rem; }
}
/* La fenêtre défile quand le contenu dépasse l'écran ; le lecteur reste toujours entièrement visible
   (il rapetisse sur un écran bas), la description se lit en descendant. Contenu court : toujours centré. */
.video-lightbox { overflow-y: auto; overscroll-behavior: contain; justify-content: flex-start; padding: 4.5rem 0 2.5rem; }
.video-lightbox-inner { margin-block: auto; width: min(85vw, 1100px, calc((100vh - 10rem) * 16 / 9)); max-width: none; }
.video-lightbox-desc { max-width: 70ch; }
.video-lightbox-hint { bottom: 2rem; font-size: 0.55rem; letter-spacing: 0.2em; text-transform: uppercase; color: color-mix(in srgb, var(--c-on-dark) 18%, transparent); left: auto; right: 2rem; position: static; transform: none; margin-top: 1.6rem; align-self: center; }
@media (max-width: 768px) {
  .video-lightbox-inner { width: 95vw; }
  .video-lightbox { padding-top: 4rem; }
}
/* ════════════════════════════════════════════════════════════════════════
   PAGE PHOTOGRAPHY
   ════════════════════════════════════════════════════════════════════════ */
/* ── HERO ── */
.photo-hero { height: 100vh; min-height: 700px; position: relative; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; color: var(--white); }
.photo-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center 30%; animation: subtle-zoom 22s ease-in-out infinite alternate; }
.photo-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, color-mix(in srgb, var(--c-bg-dark) 10%, transparent) 0%, color-mix(in srgb, var(--c-bg-dark) 0%, transparent) 30%, color-mix(in srgb, var(--c-bg-dark) 70%, transparent) 75%, color-mix(in srgb, var(--c-bg-dark) 92%, transparent) 100%); }
.photo-hero-content { position: relative; z-index: 2; padding: 0 var(--pad-container) 5rem; }
.photo-hero-content .surtitre { color: var(--gold); }
.photo-hero-title { font-family: var(--font-serif); font-size: clamp(4rem, 8vw, 7rem); font-weight: var(--w-serif); line-height: 0.95; color: var(--white); margin-bottom: 0; opacity: 0; animation: fadeUp 0.8s 0.5s forwards; }
.photo-hero-title em { color: var(--c-accent); }
/* ── PHILOSOPHY ── */
.photo-philosophy { display: grid; grid-template-columns: 1fr 1.4fr; border-bottom: 1px solid var(--border); background: var(--light); }
.photo-philosophy-left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
.photo-philosophy-left blockquote { font-family: var(--font-serif); font-size: clamp(1.4rem, 2vw, 1.9rem); font-weight: var(--w-serif); line-height: 1.45; color: var(--ink); }
.photo-philosophy-left blockquote em { color: var(--c-accent); }
.photo-philosophy-right { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; justify-content: center; }
.philosophy-text p { font-size: 0.93rem; color: var(--warm-gray); line-height: 1.9; margin-bottom: 1rem; }
.philosophy-text p:last-of-type { margin-bottom: 0; }
.philosophy-collapsed .philosophy-extra { max-height: 0; overflow: hidden; transition: max-height 0.5s ease; }
.philosophy-expanded .philosophy-extra { max-height: 400px; transition: max-height 0.5s ease; }
.philosophy-toggle { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.2rem; font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--terracotta); cursor: pointer; border: none; background: none; padding: 0; font-family: var(--font-sans); transition: gap 0.3s ease; }
.philosophy-toggle:hover { gap: 0.8rem; }
.philosophy-toggle::after { content: '↓'; font-size: 0.9rem; transition: transform 0.3s ease; }
.philosophy-expanded .philosophy-toggle::after { transform: rotate(180deg); }
/* ── FILTER ── */
.series-filter { padding: 2rem var(--pad-container); border-bottom: 1px solid var(--border); background: var(--light); display: flex; align-items: center; gap: 3rem; }
.series-filter-label { font-size: 0.58rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--warm-gray); flex-shrink: 0; }
.series-filter-btns { display: flex; gap: 0; }
.series-filter-btn { font-size: 0.62rem; letter-spacing: 0.15em; text-transform: uppercase; padding: 0.7rem 1.4rem; border: 1px solid var(--border); border-right: none; background: none; cursor: pointer; color: var(--warm-gray); font-family: var(--font-sans); transition: all 0.2s ease; }
.series-filter-btn:last-child { border-right: 1px solid var(--border); }
.series-filter-btn:hover { color: var(--ink); border-color: var(--ink); }
.series-filter-btn.active { background: var(--c-bg-dark); color: var(--white); border-color: var(--ink); }
/* ── SERIES GRID ── */
/*
  Layout is entirely driven by JS (layoutGrid).
  Do not add col/row span classes to cards — just add/remove/reorder <a class="series-card"> in the HTML.
  The JS reads the count of visible cards and applies the right layout automatically.
*/
.series-grid { display: grid; grid-template-columns: repeat(12, 1fr); border-bottom: 1px solid var(--border); }
.series-card { position: relative; overflow: hidden; text-decoration: none; display: block; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.series-card.hidden { display: none; }
.series-card-image { width: 100%; overflow: hidden; }
.series-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.series-card:hover .series-card-image img { transform: scale(1.05); }
.series-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, color-mix(in srgb, var(--c-bg-dark) 85%, transparent) 0%, color-mix(in srgb, var(--c-bg-dark) 10%, transparent) 55%); transition: background 0.5s; }
.series-card:hover .series-card-overlay { background: linear-gradient(to top, color-mix(in srgb, var(--c-bg-dark) 92%, transparent) 0%, color-mix(in srgb, var(--c-bg-dark) 25%, transparent) 65%); }
.series-card-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 2rem 2.5rem; }
.series-card-type { font-size: 0.58rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-surtitle); display: block; margin-bottom: 0.5rem; }
.series-card-title { font-family: var(--font-serif); font-weight: var(--w-serif); color: var(--white); line-height: 1.1; display: block; margin-bottom: 0.5rem; font-size: clamp(1.3rem, 2.5vw, 2.4rem); }
.series-card-subtitle { font-family: var(--font-serif); font-style: italic; font-size: 0.95rem; color: var(--c-on-dark); display: block; margin-bottom: 1rem; font-weight: var(--w-serif); }
.series-card-meta { display: flex; align-items: center; gap: 1.5rem; opacity: 0; transform: translateY(6px); transition: opacity 0.3s, transform 0.3s; }
.series-card:hover .series-card-meta { opacity: 1; transform: none; }
.series-card-cta { font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--white); display: flex; align-items: center; gap: 0.6rem; transition: gap 0.25s; }
.series-card:hover .series-card-cta { gap: 1rem; }
.series-card-cta::after { content: '→'; font-size: 0.9rem; }
/* ── APPROACH ── */
.photo-approach { background: var(--c-bg-dark); padding: var(--pad-section) var(--pad-container); display: grid; grid-template-columns: 1fr 1fr; gap: 8rem; align-items: center; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.photo-approach-left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: var(--w-serif); line-height: 1.15; color: var(--sand); margin-bottom: 2rem; }
.photo-approach-left h2 em { color: var(--c-accent); }
.photo-approach-left p { font-size: 0.93rem; color: var(--c-on-dark); line-height: 1.9; }
.photo-approach-right { display: flex; flex-direction: column; gap: 2.5rem; }
.photo-approach-item { display: flex; gap: 2rem; align-items: flex-start; padding-bottom: 2.5rem; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.photo-approach-item:last-child { border-bottom: none; padding-bottom: 0; }
.photo-approach-num { font-family: var(--font-serif); font-size: 2.12rem; font-weight: var(--w-serif); color: color-mix(in srgb, var(--c-accent) 30%, transparent); line-height: 1; flex-shrink: 0; min-width: 2.5rem; }
.photo-approach-item h3 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: var(--w-serif); color: var(--sand); margin-bottom: 0.5rem; }
.photo-approach-item p { font-size: 0.88rem; color: var(--c-on-dark); line-height: 1.8; }
/* ── PRESS ── */
.photo-press { background: var(--sand); padding: 3rem var(--pad-container); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 5rem; }
.photo-press-label { font-size: 0.58rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--warm-gray); white-space: nowrap; flex-shrink: 0; }
.press-divider { width: 1px; height: 40px; background: var(--border); flex-shrink: 0; }
.press-items { display: flex; gap: 4rem; align-items: center; }
.press-item { font-family: var(--font-serif); font-size: 1rem; font-weight: var(--w-serif); color: var(--warm-gray); white-space: nowrap; opacity: 0.6; transition: opacity 0.2s; }
.press-item:hover { opacity: 1; }
/* ── CONTACT ── */
.photo-contact { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); }
.photo-contact-left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
.photo-contact-left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; margin-bottom: 1.5rem; }
.photo-contact-left h2 em { color: var(--c-accent); }
.photo-contact-left p { font-size: 0.93rem; color: var(--warm-gray); line-height: 1.9; max-width: 440px; margin-bottom: 2.5rem; }
.photo-contact-right { padding: var(--pad-section) var(--pad-container); background: var(--sand); display: flex; flex-direction: column; justify-content: center; }
.contact-item { padding: 2rem 0; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.contact-item:first-child { border-top: 1px solid var(--border); }
.contact-item-label { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--warm-gray); }
.contact-item-val { font-family: var(--font-serif); font-size: 1rem; font-weight: var(--w-serif); color: var(--ink); transition: color 0.2s; }
.contact-item-val:hover { color: var(--terracotta); }
@media (max-width: 1024px) {
  /* ── RESPONSIVE ── */
  .photo-philosophy { grid-template-columns: 1fr; }
  .photo-philosophy-left { border-right: none; border-bottom: 1px solid var(--border); }
  .photo-approach { grid-template-columns: 1fr; gap: 4rem; }
  .photo-contact { grid-template-columns: 1fr; }
  .photo-contact-left { border-right: none; border-bottom: 1px solid var(--border); }
  .photo-press { flex-direction: column; align-items: flex-start; gap: 2rem; }
  .press-divider { display: none; }
  .press-items { flex-wrap: wrap; gap: 2rem; }
  .series-filter { gap: 1.5rem; flex-wrap: wrap; }
}
@media (max-width: 768px) {
  /* On mobile, stack all cards vertically — JS layout is disabled */
  .series-grid { grid-template-columns: 1fr !important; }
  .series-card { grid-column: span 1 !important; }
  .series-card-image { height: 65vw !important; }
}
/* ════════════════════════════════════════════════════════════════════════
   PAGE MAURITANIE (bientôt disponible)
   ════════════════════════════════════════════════════════════════════════ */
/* ── MAURITANIA SPECIFIC: Coming soon page ── */
.mau-teaser { display: grid; grid-template-columns: 1fr 1.4fr; border-bottom: 1px solid var(--border); background: var(--c-bg-dark); color: var(--white); }
.mau-teaser__left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); display: flex; flex-direction: column; justify-content: center; }
.mau-teaser__left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; color: var(--white); margin-bottom: 0; }
.mau-teaser__left h2 em { color: var(--c-on-dark); }
.mau-teaser__right { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; gap: 2rem; }
.mau-teaser-item { padding-left: 1.5rem; border-left: 2px solid var(--terracotta); }
.mau-teaser-item p { color: var(--c-on-dark); font-size: 0.9rem; line-height: 1.8; }
.mau-photo-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; border-bottom: 1px solid var(--border); }
.mau-photo-grid__item { overflow: hidden; aspect-ratio: 3/2; }
.mau-photo-grid__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease; }
.mau-photo-grid__item:hover img { transform: scale(1.04); }
.mau-notify { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); background: var(--sand); }
.mau-notify__left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
.mau-notify__left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; margin-bottom: 1.5rem; }
.mau-notify__left h2 em { color: var(--c-accent); }
.mau-notify__left p { color: var(--warm-gray); font-size: 0.9rem; line-height: 1.85; }
.mau-notify__form { padding: var(--pad-section) var(--pad-container); display: flex; flex-direction: column; justify-content: center; gap: 1.2rem; }
.mau-notify__form input[type="email"] { width: 100%; padding: 1rem 1.2rem; font-family: var(--font-sans); font-size: 0.88rem; border: 1px solid var(--border); background: var(--white); color: var(--ink); outline: none; }
.mau-notify__form input[type="email"]:focus { border-color: var(--terracotta); }
.mau-notify__form input::placeholder { color: var(--warm-gray); }
.mau-notify__btn { display: inline-block; padding: 1rem 2rem; background: var(--terracotta); color: var(--white); font-size: 0.65rem; letter-spacing: 0.15em; border: none; cursor: pointer; transition: background 0.3s ease; align-self: flex-start; }
.mau-notify__btn:hover { background: var(--chocolate); }
.mau-other { background: var(--light); padding: var(--pad-section) var(--pad-container); border-bottom: 1px solid var(--border); }
.mau-other h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 2.5vw, 2.4rem); font-weight: var(--w-serif); margin-bottom: 3rem; }
.mau-other h2 em { color: var(--c-accent); }
.mau-other__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.mau-exp-card { display: block; text-decoration: none; color: inherit; border: 1px solid var(--border); transition: border-color 0.3s ease; }
.mau-exp-card:hover { border-color: var(--terracotta); }
.mau-exp-card__img { height: 220px; overflow: hidden; }
.mau-exp-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease; }
.mau-exp-card:hover .mau-exp-card__img img { transform: scale(1.04); }
.mau-exp-card__body { padding: 1.5rem; }
.mau-exp-card__label { display: block; margin-bottom: 0.5rem; }
.mau-exp-card__body h3 { font-family: var(--font-serif); font-size: 1.3rem; font-weight: var(--w-serif); margin-bottom: 0.4rem; }
.mau-exp-card__body p { font-size: 0.8rem; color: var(--warm-gray); }
@media (max-width: 1024px) {
  .mau-teaser, .mau-notify { grid-template-columns: 1fr; }
  .mau-teaser__left, .mau-notify__left { border-right: none; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
  .mau-photo-grid, .mau-other__grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .mau-other__grid { grid-template-columns: 1fr; }
}
/* ════════════════════════════════════════════════════════════════════════
   LISTE D'ATTENTE
   ════════════════════════════════════════════════════════════════════════ */
.waitlist { display: grid; grid-template-columns: 1fr 1fr; background: var(--c-bg-dark); color: var(--sand); border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); }
.waitlist__left { padding: var(--pad-section) var(--pad-container); border-right: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); display: flex; flex-direction: column; justify-content: center; }
.waitlist__left h2 { font-family: var(--font-serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: var(--w-serif); line-height: 1.2; color: var(--sand); margin-bottom: 1.5rem; }
.waitlist__left h2 em { font-style: italic; color: var(--c-accent); }
.waitlist__left p { font-size: 0.95rem; color: var(--c-on-dark); line-height: 1.9; max-width: 420px; }
.waitlist__form { padding: var(--pad-section) var(--pad-container); background: var(--sand); display: flex; flex-direction: column; gap: 1.2rem; justify-content: center; }
.waitlist__form iframe { display: block; width: 100%; border: none; }
.waitlist__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.waitlist__field { display: flex; flex-direction: column; gap: 0.5rem; }
.waitlist__field label { font-size: 0.62rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--warm-gray); }
.waitlist__field input { width: 100%; padding: 1rem 1.2rem; font-family: var(--font-sans); font-size: 0.9rem; border: 1px solid var(--border); background: var(--white); color: var(--ink); outline: none; transition: border-color 0.3s ease; }
.waitlist__field input:focus { border-color: var(--terracotta); }
.waitlist__btn { display: inline-block; align-self: flex-start; margin-top: 0.5rem; padding: 1rem 2.4rem; background: var(--c-bg-dark); color: var(--white); font-size: 0.65rem; letter-spacing: 0.15em; border: none; cursor: pointer; transition: background 0.3s ease; }
.waitlist__btn:hover { background: var(--terracotta); }
.waitlist__btn:disabled { opacity: 0.6; cursor: not-allowed; }
.waitlist__note { font-size: 0.75rem; color: var(--warm-gray); }
@media (max-width: 900px) {
  .waitlist { grid-template-columns: 1fr; }
  .waitlist__left { border-right: none; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 8%, transparent); padding: 4rem var(--pad-mobile); }
  .waitlist__form { padding: 4rem var(--pad-mobile); }
  .waitlist__row { grid-template-columns: 1fr; gap: 1.2rem; }
}
/* ════════════════════════════════════════════════════════════════════════
   PAGES LÉGALES ET FAQ (en-tête sombre, textes)
   ════════════════════════════════════════════════════════════════════════ */
/* En-tête sombre des pages simples (FAQ, Terms, Privacy) */
.page-hero { padding: 10rem var(--pad-container) 5rem; background: var(--c-bg-dark); color: var(--white); display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: end; }
.page-hero h1 { font-family: var(--font-serif); font-size: clamp(3rem, 6vw, 5.5rem); font-weight: var(--w-serif); line-height: 1.05; color: var(--white); }
.page-hero h1 em { color: var(--c-accent); }
.page-hero__right p { font-size: 0.95rem; color: var(--c-on-dark); line-height: 1.85; max-width: 460px; }
.page-hero__right a { color: var(--gold); }
/* Texte juridique */
.legal { background: var(--light); padding: var(--pad-section) var(--pad-container) 6rem; }
.legal__body { max-width: 760px; margin: 0 auto; }
.legal__body h2 { font-family: var(--font-serif); font-size: clamp(1.6rem, 2.4vw, 2.1rem); font-weight: var(--w-serif); margin: 3.5rem 0 1.2rem; padding-top: 2rem; border-top: 1px solid var(--border); }
.legal__body h3 { font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-surtitle); margin: 2rem 0 0.8rem; font-weight: 500; }
.legal__body p { color: var(--warm-gray); line-height: 1.9; font-size: 0.95rem; margin-bottom: 1rem; }
.legal__body ul { margin: 0 0 1.2rem 0; }
.legal__body li { color: var(--warm-gray); line-height: 1.9; font-size: 0.95rem; position: relative; padding-left: 1.4rem; margin-bottom: 0.5rem; }
.legal__body li::before { content: '•'; position: absolute; left: 0.2rem; color: var(--gold); }
.legal__body ul ul li::before { content: '◦'; }
.legal__body ul ul { margin: 0.5rem 0 0; }
.legal__body strong { color: var(--ink); font-weight: 500; }
.legal__body a { border-bottom: 1px solid color-mix(in srgb, var(--c-link) 30%, transparent); }
.legal__updated { margin-top: 3rem; font-size: 0.8rem !important; letter-spacing: 0.05em; }
@media (max-width: 768px) {
  .page-hero { grid-template-columns: 1fr; gap: 2rem; padding: 8rem var(--pad-mobile) 3rem; }
  .legal { padding: 3rem var(--pad-mobile) 4rem; }
}

/* FAQ : une seule colonne centrée, le hero porte l'intro et le contact */
.page-faq .exp-faq__wrap { grid-template-columns: 1fr; max-width: calc(52rem + 2 * var(--pad-container)); margin: 0 auto; }
.page-faq .exp-faq__list { padding-top: clamp(1rem, 2vw, 2rem); }

/* Page 404 « Off the map » */
.nf { min-height: 100vh; background: var(--c-bg-dark); color: var(--c-on-dark, #fff); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 9rem var(--pad-container) 5rem; }
.nf__draw { width: clamp(11rem, 22vw, 16rem); height: auto; color: var(--c-surtitle); filter: url(#ink); margin-bottom: 2.2rem; }
.nf .surtitre { margin-bottom: 1rem; }
.nf h1 { font-family: var(--font-serif); font-weight: var(--w-serif); font-size: clamp(3rem, 7vw, 5.5rem); line-height: 1.05; color: var(--white, #fff); }
.nf h1 em { color: var(--c-accent-on-dark); }
.nf p { max-width: 34rem; margin: 1.4rem auto 0; font-size: 1rem; line-height: 1.8; color: color-mix(in srgb, var(--c-on-dark, #fff) 78%, transparent); }
.nf__links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1.2rem 2rem; margin-top: 2.6rem; }
.nf__btn { display: inline-block; padding: 0.95rem 1.8rem; border-radius: 999px; background: var(--c-surtitle); color: var(--c-bg-dark); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; transition: opacity .3s ease; }
.nf__btn:hover { opacity: .85; }
.nf .btn-line { color: var(--c-on-dark, #fff); }
.nf .btn-line::before { background-color: var(--c-surtitle); }

/* Menu sur tablette (601 à 1024 px) : liens centrés entre le logo et le bord droit, sans bouton à droite */
@media (min-width: 601px) and (max-width: 1024px) {
  nav { grid-template-columns: auto minmax(0, 1fr); padding-left: clamp(1.25rem, 4vw, 2.5rem); padding-right: clamp(1.25rem, 4vw, 2.5rem); }
  nav.scrolled { padding-left: clamp(1.25rem, 4vw, 2.5rem); padding-right: clamp(1.25rem, 4vw, 2.5rem); }
  nav .nav-links { grid-column: 2; justify-self: center; gap: clamp(1.1rem, 3.2vw, 2.4rem); }
  nav .nav-cta { display: none; }
}

/* Pied de page sur téléphone (toutes les pages) :
   KARAI et newsletter centrés, puis Expeditions et KARAI côte à côte, puis Information sur toute la largeur */
@media (max-width: 600px) {
  .exp-page-footer .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.2rem 1.2rem; padding: 2.8rem 1.5rem 2rem; text-align: center; }
  .exp-page-footer .footer-brand { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; padding-bottom: 2.2rem; border-bottom: 1px solid color-mix(in srgb, var(--c-on-dark) 12%, transparent); }
  .exp-page-footer .footer-logo { font-size: 1.8rem; margin-bottom: .4rem; }
  .exp-page-footer .footer-col h4 { margin-bottom: .7rem; }
  .exp-page-footer .footer-col ul li { margin-bottom: 0; }
  .exp-page-footer .footer-col ul li a { display: inline-block; padding: .38rem 0; font-size: .9rem; }
  /* Information : tous les liens sur une seule ligne, centrés, séparés par un point
     (« Terms » et « Privacy » en version courte, la taille suit la largeur de l'écran) */
  .exp-page-footer .footer-col:last-child { grid-column: 1 / -1; padding-top: 2rem; border-top: 1px solid color-mix(in srgb, var(--c-on-dark) 12%, transparent); }
  .exp-page-footer .footer-col:last-child ul { display: flex; flex-wrap: wrap; justify-content: center; column-gap: .45rem; white-space: nowrap; }
  .exp-page-footer .footer-col:last-child li a { font-size: clamp(.66rem, 3.15vw, .85rem); }
  .exp-page-footer .footer-col:last-child li + li::before { content: "·"; margin-right: .45rem; color: var(--c-footer-head); }
  .exp-page-footer .footer-col:last-child li:last-child a { color: var(--c-footer-head); }
  /* l'adresse e-mail passe seule sur la ligne du dessous */
  .exp-page-footer .footer-col:last-child li:last-child { flex-basis: 100%; margin-top: .2rem; }
  .exp-page-footer .footer-col:last-child li:last-child::before { content: none; }
  .ft-long { display: none; }
  .footer-bottom { justify-content: center; text-align: center; height: auto; padding: 1.4rem 1.5rem calc(1.6rem + env(safe-area-inset-bottom)); font-size: .7rem; opacity: .75; }
  .exp-page-footer .footer-bottom { justify-content: center; }
  /* fiches expédition : de la place pour la barre de réservation fixe */
  body:has(.exp-mbar) .footer-bottom { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
}

/* Formulaire Tally en popup : grand bouton de fermeture, téléphone uniquement */
.tally-close-big { display: none; }
@media (max-width: 600px) {
  .tally-close-big.is-on { display: grid; place-items: center; position: fixed; z-index: 2147483647; top: calc(.8rem + env(safe-area-inset-top)); right: .8rem; width: 3rem; height: 3rem; border-radius: 50%; border: 0; background: var(--c-bg-dark); color: var(--c-on-dark); box-shadow: 0 6px 20px rgb(0 0 0 / .3); cursor: pointer; }
}

/* Page Contact : case anti-robots invisible, message après envoi */
.ct-botcheck { display: none !important; }
.ct-status { font-size: .85rem; line-height: 1.6; margin: 0; min-height: 0; }
.ct-status:empty { display: none; }
.ct-status.is-error { color: #b4513a; }
.ct-card--dark .ct-status { color: var(--c-on-dark); }
.ct-btn:disabled { opacity: .5; cursor: wait; }

/* Menu Journal : sous le titre, le pays à gauche et la catégorie à droite */
.nav-mega__meta { display: flex; justify-content: space-between; gap: .8rem; }
.nav-mega__meta > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-mega__cat { flex: none; }