/* =========================================================
   Mandymilleailleurs · v2 : deux parcours (avec / comme), pages voyage, page carnet « Les carnets de mes ailleurs »
   S'ajoute à style.css (mêmes variables : crème, rose poudré, bordeaux, Gloock + Source Sans 3).
   ========================================================= */
.nav a { white-space: nowrap; }
.lead--center { margin-inline: auto; text-align: center; }
.narrow { max-width: 860px; }
.center-note { text-align: center; }
.section--choc .eyebrow { color: var(--ochre-l); }
.section--choc .h2 em { color: var(--ochre-l); }

/* ---------- Confiance : bandeau de chiffres ---------- */
.proof { background: var(--choc); color: var(--linen); }
.proof__list { list-style: none; margin: 0 auto; padding: 30px 0; width: min(var(--wrap), 100% - 48px); display: flex; justify-content: space-between; gap: 20px; }
.proof li { flex: 1; display: flex; flex-direction: column; gap: 4px; padding-left: 22px; border-left: 1px solid rgba(243, 235, 224, .18); }
.proof li:first-child { border-left: 0; padding-left: 0; }
.proof b { font: 400 clamp(28px, 2.6vw, 38px)/1 var(--display); color: #fff; white-space: nowrap; }
.proof span { font-size: 16px; line-height: 1.35; color: #ead9dc; }

/* ---------- Les deux parcours ---------- */
.doors-s { padding-bottom: clamp(56px, 6vw, 88px); }
.doors { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.door { position: relative; display: flex; align-items: flex-end; min-height: 520px; border-radius: 32px; overflow: hidden; text-decoration: none; color: #fff; isolation: isolate; }
.door img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.door::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(24, 14, 17, .88) 0%, rgba(24, 14, 17, .45) 45%, rgba(24, 14, 17, .05) 75%); }
.door:hover img { transform: scale(1.04); }
.door__in { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 34px; }
.door .kind { background: var(--paper); color: var(--choc); box-shadow: none; }
.door .kind::before { background: var(--burnt); }
.door__t { font: 400 clamp(34px, 3.4vw, 48px)/1.04 var(--display); margin-top: 6px; }
.door__p { font-size: 18.5px; line-height: 1.5; color: #f4e9e6; max-width: 34ch; }
.door__meta { font-weight: 700; font-size: 16px; color: var(--ochre-l); }
.door .btn { margin-top: 10px; }
.door:hover .btn { background: var(--burnt-d); border-color: var(--burnt-d); }

/* ---------- Cartes voyage datées ---------- */
.dcs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.dc { background: var(--linen); border-radius: 30px; overflow: hidden; box-shadow: 0 1px 0 var(--line), 0 22px 40px -30px rgba(45, 27, 32, .5); transition: transform .3s, box-shadow .3s; }
.dc:has(a.dc__link):hover { transform: translateY(-6px); box-shadow: 0 1px 0 var(--line), 0 34px 50px -30px rgba(45, 27, 32, .6); }
.dc__link { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); height: 100%; text-decoration: none; color: inherit; }
.dc__media { position: relative; display: block; min-height: 300px; overflow: hidden; }
.dc__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.dc:hover .dc__media img { transform: scale(1.04); }
.dc__media .tag { position: absolute; left: 14px; bottom: 14px; }
.dc__date { position: absolute; left: 14px; top: 14px; display: flex; flex-direction: column; align-items: center; min-width: 78px; padding: 12px 12px 10px; border-radius: 20px; background: var(--paper); color: var(--choc); font: 700 15px/1.1 var(--sans); text-transform: uppercase; letter-spacing: .06em; box-shadow: 0 12px 24px -14px rgba(45, 27, 32, .6); }
.dc__date b { font: 400 40px/1 var(--display); color: var(--burnt); letter-spacing: 0; }
.dc__date small { font-size: 12.5px; color: var(--ink-2); margin-top: 3px; }
.dc__body { display: flex; flex-direction: column; gap: 8px; padding: 26px 26px 24px; }
.dc__place { display: inline-flex; align-items: center; gap: 6px; font: 700 13.5px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.dc__place svg, .stop__k svg, .th__media figcaption svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dc__title { font: 400 34px/1.06 var(--display); }
.dc__hook { color: var(--ink-2); font-size: 17.5px; line-height: 1.45; }
.dc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin: 10px 0 6px; padding-top: 16px; border-top: 1px solid var(--line); font-weight: 700; font-size: 17px; line-height: 1.3; }
.dc__grid small { display: block; font: 700 12px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 2px; }
.dc__go { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 14px; font-weight: 700; font-size: 18px; color: var(--burnt); }
.dc__go i { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--burnt); color: #fff; transition: transform .3s; }
.dc__go svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.dc:hover .dc__go i { transform: translateX(4px); }
.dc--full .dc__media img { filter: saturate(.6); }
.dc--full .dc__media { min-height: 220px; }
.dc--full .dc__title { font-size: 27px; }
.dc--full .btn { margin-top: auto; min-height: 50px; }
.alert .link { font-weight: 700; }
#voyages .alert { margin-top: 28px; }

/* ---------- Témoignages vidéo ---------- */
.vts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.vt { position: relative; aspect-ratio: 3 / 4.2; border-radius: 26px; overflow: hidden; color: #fff; isolation: isolate; background: var(--choc); }
.vt img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.vt::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(24, 14, 17, .9) 0%, rgba(24, 14, 17, .2) 55%, rgba(24, 14, 17, 0) 100%); }
.vt__play { position: absolute; left: 50%; top: 38%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: rgba(255, 255, 255, .22); border: 1px solid rgba(255, 255, 255, .5); backdrop-filter: blur(8px); }
.vt__play svg { width: 26px; height: 26px; fill: #fff; margin-left: 3px; }
.vt__tag { position: absolute; right: 12px; top: 12px; font: 700 12px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; background: rgba(255, 253, 251, .9); color: var(--choc); border-radius: 999px; padding: 6px 10px; }
.vt__txt { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 18px 20px; }

/* ---------- Comment ça marche, animé ---------- */
.how { list-style: none; margin: 0; padding: 0; position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
.js .how.reveal { opacity: 1; transform: none; }
.how__line { position: absolute; left: 16.66%; right: 16.66%; top: 92px; height: 0; border-top: 2px dashed rgba(243, 184, 198, .45); }
.how__plane { position: absolute; left: 0; top: -19px; width: 38px; margin-left: -19px; color: var(--ochre-l); }
.how__plane svg { display: block; width: 100%; }
.how__step { position: relative; text-align: center; }
.how__img { position: relative; display: block; width: 184px; height: 184px; margin: 0 auto 26px; }
.how__img img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 5px solid var(--choc); box-shadow: 0 0 0 2px rgba(243, 184, 198, .5); }
.how__img b { position: absolute; right: 2px; bottom: 2px; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--burnt); color: #fff; font: 400 28px/1 var(--display); border: 4px solid var(--choc); }
.how h3 { font: 400 28px/1.15 var(--display); color: #fff; }
.how__step p { margin: 10px auto 0; color: #ead9dc; font-size: 18px; max-width: 30ch; }
.js .how .how__step { opacity: 0; transform: translateY(26px) scale(.96); }
.js .how.is-in .how__step { animation: how-in .7s cubic-bezier(.2, .8, .2, 1) forwards; }
.js .how.is-in .how__step:nth-child(3) { animation-delay: 1s; }
.js .how.is-in .how__step:nth-child(4) { animation-delay: 2s; }
.js .how.is-in .how__plane { animation: how-fly 2.4s cubic-bezier(.45, .05, .35, 1) .2s forwards; }
.js .how .how__img b { transform: scale(0); }
.js .how.is-in .how__img b { animation: how-pop .5s cubic-bezier(.3, 1.6, .5, 1) .5s forwards; }
.js .how.is-in .how__step:nth-child(3) .how__img b { animation-delay: 1.5s; }
.js .how.is-in .how__step:nth-child(4) .how__img b { animation-delay: 2.5s; }
@keyframes how-in { to { opacity: 1; transform: none; } }
@keyframes how-fly { to { left: 100%; } }
@keyframes how-pop { to { transform: none; } }

/* ---------- Teaser carnet + couverture ---------- */
.teaser { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(36px, 6vw, 96px); align-items: center; }
.teaser__media { display: grid; place-items: center; }
.teaser__cta { margin-top: 30px; }
.cover { position: relative; display: flex; flex-direction: column; justify-content: flex-end; width: min(340px, 100%); aspect-ratio: 3 / 4.1; border-radius: 10px 26px 26px 10px; overflow: hidden; padding: 26px 24px; color: #fff; isolation: isolate; transform: rotate(-3deg); box-shadow: 0 40px 70px -34px rgba(45, 27, 32, .75), inset 8px 0 0 rgba(0, 0, 0, .18); }
.cover img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.cover::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(115, 22, 51, .95) 0%, rgba(115, 22, 51, .5) 48%, rgba(24, 14, 17, .15) 100%); }
.cover__k { font: 700 12.5px/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ochre-l); }
.cover__t { font: 400 38px/1.04 var(--display); margin-top: 8px; }
.cover__s { margin-top: 10px; font-weight: 600; font-size: 16px; }
.cover--big { width: min(380px, 100%); }
.ticks { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.ticks li { position: relative; padding-left: 32px; font-size: 18.5px; line-height: 1.4; }
.ticks li::before { content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--burnt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }

/* ---------- En-tête des pages voyage et carnet ---------- */
.th { position: relative; background: var(--choc); color: #fff; overflow: hidden; isolation: isolate; padding-bottom: 34px; }
.th::before { content: ""; position: absolute; z-index: -1; right: -12%; top: -30%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(139, 30, 63, .7), rgba(139, 30, 63, 0)); }
.th .hd__nav { position: relative; }
.th__in { width: min(1320px, 100% - 48px); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 80px); align-items: center; padding: clamp(36px, 5vw, 64px) 0 clamp(30px, 4vw, 48px); }
.th__back { display: inline-block; font-weight: 600; font-size: 16px; color: #ead9dc; text-decoration: none; margin-bottom: 18px; }
.th__back:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.th__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.th .kind { box-shadow: none; }
.th__title { font: 400 clamp(46px, 5.2vw, 78px)/1.02 var(--display); letter-spacing: -.01em; margin-top: 18px; }
.th--od .th__title { font-size: clamp(42px, 4.5vw, 66px); }
.th__hook { font: 400 clamp(22px, 2vw, 27px)/1.3 var(--display); color: var(--ochre-l); margin-top: 18px; max-width: 26em; }
.th__desc { font-size: 19.5px; line-height: 1.55; color: #f4e9e6; margin-top: 14px; max-width: 34em; }
.th__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 30px; }
.th__note { margin-top: 14px; font-size: 15.5px; color: #cdb6ba; }
.th__media { margin: 0; position: relative; justify-self: end; width: min(440px, 100%); }
.th__media > img { width: 100%; aspect-ratio: 4 / 4.9; object-fit: cover; border-radius: 999px 999px 30px 30px; box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .7); }
.th__media figcaption { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; background: rgba(255, 253, 251, .94); color: var(--choc); font-weight: 700; font-size: 15px; border-radius: 999px; padding: 9px 15px; }
.th__facts { list-style: none; width: min(1320px, 100% - 48px); margin: 0 auto; padding: 22px 28px; display: grid; grid-template-columns: repeat(5, auto); justify-content: space-between; gap: 18px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .22); border-radius: 26px; backdrop-filter: blur(10px); }
.th__facts small { display: block; font: 700 12px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ochre-l); margin-bottom: 4px; }
.th__facts b { font-weight: 700; font-size: 18px; }
.th__media--od { display: grid; place-items: center; min-height: 480px; }
.page--float { position: absolute; right: -6px; top: 4px; width: 290px; max-width: 78%; padding: 18px 18px 14px; transform: rotate(4deg); color: var(--choc); }
.page--float h4 { font-size: 21px; margin: 10px 0 0; }
.page--float dl { margin-top: 8px; }
.page--float dl div { grid-template-columns: 72px 1fr; font-size: 13.5px; padding: 7px 0; }
.chips { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.chips li { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; padding: 7px 13px; }
.chips li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ochre-l); }

/* ---------- Points forts ---------- */
.forts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.forts li { background: var(--paper); border-radius: 28px; padding: 30px 28px 32px; box-shadow: 0 18px 34px -28px rgba(45, 27, 32, .45); }
.forts b { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--clay); color: var(--burnt); font: 400 26px/1 var(--display); }
.forts h3 { font: 400 28px/1.12 var(--display); margin-top: 18px; }
.forts p { margin-top: 8px; color: var(--ink-2); }

/* ---------- Parcours animé : le chemin et le personnage ---------- */
.route { position: relative; max-width: 1040px; margin: 0 auto; }
.route__svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.route__svg path { fill: none; stroke-linecap: round; }
.route__base { stroke: var(--clay-2); stroke-width: 3; stroke-dasharray: 2 12; }
.route__prog { stroke: var(--burnt); stroke-width: 4; }
.route__who { position: absolute; left: 0; top: 0; z-index: 3; width: 64px; height: 64px; margin: -32px 0 0 -32px; pointer-events: none; will-change: transform; display: none; }
.route.is-ready .route__who { display: block; }
.route__who img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 4px solid var(--paper); box-shadow: 0 0 0 3px var(--burnt), 0 14px 24px -8px rgba(45, 27, 32, .6); animation: who-bob 1.1s ease-in-out infinite alternate; }
@keyframes who-bob { to { transform: translateY(-5px) rotate(4deg); } }
.stops { list-style: none; margin: 0; padding: 0; position: relative; display: grid; gap: 26px; }
.stop { display: grid; grid-template-columns: minmax(0, 1fr) 190px minmax(0, 1fr); align-items: center; }
.stop__dot { grid-column: 2; grid-row: 1; justify-self: start; position: relative; z-index: 2; width: 22px; height: 22px; border-radius: 50%; background: var(--paper); border: 4px solid var(--clay-2); transition: background .3s, border-color .3s, transform .3s; }
.stop:nth-child(even) .stop__dot { justify-self: end; }
.stop__card { grid-column: 1; grid-row: 1; justify-self: end; width: min(400px, 100%); background: var(--linen); border-radius: 26px; padding: 22px 24px 24px; box-shadow: 0 18px 34px -28px rgba(45, 27, 32, .5); }
.stop:nth-child(even) .stop__card { grid-column: 3; justify-self: start; }
.js .route.is-ready .stop__card { opacity: .35; transform: translateX(-26px) scale(.97); transition: opacity .5s ease, transform .6s cubic-bezier(.2, .8, .2, 1); }
.js .route.is-ready .stop:nth-child(even) .stop__card { transform: translateX(26px) scale(.97); }
.js .route.is-ready .stop.is-on .stop__card { opacity: 1; transform: none; }
.stop.is-on .stop__dot { background: var(--burnt); border-color: var(--burnt); transform: scale(1.15); }
.stop__k { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.stop__k b { font: 400 30px/1 var(--display); color: var(--burnt); }
.stop__k span { display: inline-flex; align-items: center; gap: 5px; font: 700 12.5px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); background: var(--clay); border-radius: 999px; padding: 7px 11px; }
.stop h3 { font: 400 26px/1.15 var(--display); margin-top: 10px; }
.stop__card > p:last-child { margin-top: 6px; color: var(--ink-2); font-size: 18px; line-height: 1.5; }
.route__more { text-align: center; margin: 34px auto 0; color: var(--ink-2); font-size: 17px; max-width: 60ch; }

/* ---------- Inclus / à apporter ---------- */
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: start; }
.incl--card { margin: 0; padding: 28px 28px 14px; border: 0; background: var(--linen); border-radius: 28px; }
.incl--bring { background: var(--clay); }
.incl--bring li::before { background-color: var(--choc); }

/* ---------- Prix ---------- */
.pricebox { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 90px); align-items: center; }
.pricebox__p { margin-top: 20px; font-size: 20px; line-height: 1.6; color: #ead9dc; max-width: 34em; }
.pricebox__card { background: var(--paper); color: var(--choc); border-radius: 32px; padding: 34px 34px 28px; box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .6); }
.pricebox__old { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding-bottom: 18px; border-bottom: 1px dashed var(--clay-2); color: var(--ink-2); font-size: 17px; }
.pricebox__old s { font: 400 30px/1 var(--display); text-decoration-color: var(--burnt); text-decoration-thickness: 2px; white-space: nowrap; }
.pricebox__new { display: flex; flex-direction: column; margin-top: 18px; font-size: 17px; color: var(--ink-2); }
.pricebox__new b { font: 400 clamp(56px, 6vw, 76px)/1 var(--display); color: var(--burnt); margin: 4px 0; }
.pricebox__card .btn { width: 100%; margin-top: 22px; justify-content: space-between; padding-left: 30px; }
.pricebox__note { margin-top: 12px; font-size: 15.5px; color: var(--ink-2); text-align: center; }
.pricebox__card .demo-note { margin-top: 8px; text-align: center; font-size: 13.5px; }

/* ---------- Avis façon plateforme d'avis ---------- */
.tp__head { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.tp__score { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; font-size: 15.5px; color: var(--ink-2); text-align: right; max-width: 30ch; }
.tp__stars { display: inline-flex; gap: 4px; }
.tp__stars i { width: 26px; height: 26px; border-radius: 6px; background: var(--burnt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 3.5l2.6 5.4 5.9.8-4.3 4.1 1 5.800L12 16.900 6.800 19.600l1-5.800L3.500 9.700l5.900-.8z'/%3E%3C/svg%3E") center / 17px no-repeat; }
.tp { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.tp__card { display: flex; flex-direction: column; background: var(--paper); border-radius: 26px; padding: 28px 26px 24px; box-shadow: 0 18px 34px -28px rgba(45, 27, 32, .45); }
.tp__card h3 { font: 700 20px/1.3 var(--sans); margin-top: 16px; }
.tp__card > p:not([class]) { margin: 8px 0 22px; font-size: 18px; line-height: 1.55; color: var(--ink-2); }

/* ---------- Passerelle entre les deux parcours ---------- */
.cross { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 30px; align-items: center; background: var(--paper); border-radius: 32px; padding: 26px 34px 26px 26px; box-shadow: 0 22px 40px -30px rgba(45, 27, 32, .5); }
.cross img { width: 150px; height: 150px; object-fit: cover; border-radius: 24px; }
.cross .eyebrow { margin-bottom: 8px; }
.cross p:last-child { margin-top: 8px; color: var(--ink-2); max-width: 56ch; }
.cross__alt { margin-top: 22px; text-align: center; color: var(--ink-2); }
.endcta { text-align: center; padding-top: clamp(64px, 7vw, 96px); }
.endcta .center { margin-top: 32px; }

/* ---------- Page carnet ---------- */
.carnet--top { margin-top: 0; }
.gains { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.gains li { border-radius: 28px; overflow: hidden; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .16); }
.gains img { width: 100%; aspect-ratio: 4 / 3.2; object-fit: cover; }
.gains div { padding: 22px 24px 26px; }
.gains h3 { font: 400 26px/1.15 var(--display); color: #fff; }
.gains p { margin-top: 8px; color: #ead9dc; font-size: 18px; }
.prod { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(36px, 6vw, 90px); align-items: center; }
.prod__media { display: grid; place-items: center; position: sticky; top: 30px; align-self: start; padding-top: 20px; }
.prod__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; margin-top: 14px; color: var(--ink-2); font-size: 17px; }
.prod__price b { font: 400 64px/1 var(--display); color: var(--burnt); }
.prod .stepl { margin-top: 30px; }
.dests--sm { margin-bottom: 0; gap: 12px; }
.dests--sm .dest { aspect-ratio: 4 / 3; }
.dests--sm .dest__name { font-size: 22px; left: 14px; bottom: 12px; }
.prod__btn { width: 100%; justify-content: space-between; padding-left: 30px; white-space: normal; text-align: left; }
.prod__more { margin: 72px 0 26px; font: 400 32px/1.1 var(--display); }
.offers--two { grid-template-columns: repeat(2, 1fr); }
.cmp { border-radius: 28px; overflow: hidden; background: var(--paper); box-shadow: 0 22px 40px -30px rgba(45, 27, 32, .5); }
.cmp__row { display: grid; grid-template-columns: 1.1fr 1.15fr 1fr 1fr; }
.cmp__row > span { padding: 20px 22px; border-top: 1px solid var(--line); font-size: 17.5px; line-height: 1.4; color: var(--ink-2); }
.cmp__row > span:first-child { font-weight: 700; color: var(--choc); }
.cmp__row--head > span { border-top: 0; font: 700 14px/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--choc); }
.cmp__row > .cmp__us { background: var(--burnt); color: #fff; font-weight: 700; border-top-color: rgba(255, 255, 255, .18); }
.cmp__row--head > .cmp__us { color: #fff; font: 400 26px/1.1 var(--display); letter-spacing: 0; text-transform: none; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1100px) {
  .nav { gap: 20px; }
  .nav a { font-size: 16px; }
  .dcs { grid-template-columns: 1fr; }
  .vts { grid-template-columns: repeat(2, 1fr); }
  .proof__list { flex-wrap: wrap; }
  .proof li { flex: 1 1 28%; }
}
@media (max-width: 900px) {
  .doors { grid-template-columns: 1fr; }
  .door { min-height: 440px; }
  .teaser, .pricebox, .prod { grid-template-columns: 1fr; }
  .prod__media { position: static; }
  .th__in { grid-template-columns: 1fr; }
  .th__media { justify-self: center; width: min(360px, 100%); }
  .th__media--od { min-height: 0; padding: 10px 0 30px; }
  .th__facts { grid-template-columns: repeat(3, 1fr); justify-content: stretch; }
  .forts, .trio, .tp, .gains { grid-template-columns: 1fr; }
  .offers--two { grid-template-columns: 1fr; }
  .cross { grid-template-columns: 110px minmax(0, 1fr); }
  .cross img { width: 110px; height: 110px; }
  .cross .btn { grid-column: 1 / -1; }
  .how { grid-template-columns: 1fr; gap: 40px; }
  .how__line { left: 50%; right: auto; top: 92px; bottom: 120px; height: auto; border-top: 0; border-left: 2px dashed rgba(243, 184, 198, .35); }
  .how__plane { display: none; }
  .how__step { background: var(--choc); padding: 6px 0; }
  .stop { grid-template-columns: 56px minmax(0, 1fr); }
  .stop__dot, .stop:nth-child(even) .stop__dot { grid-column: 1; justify-self: start; margin-left: 6px; }
  .stop:nth-child(even) .stop__dot { margin-left: 26px; }
  .stop__card, .stop:nth-child(even) .stop__card { grid-column: 2; justify-self: stretch; width: auto; }
  .js .route.is-ready .stop__card, .js .route.is-ready .stop:nth-child(even) .stop__card { transform: translateX(20px) scale(.98); }
  .route__who { width: 52px; height: 52px; margin: -26px 0 0 -26px; }
}
@media (max-width: 760px) {
  .proof__list { width: calc(100% - 40px); display: grid; grid-template-columns: 1fr 1fr; gap: 20px 16px; padding: 26px 0; }
  .proof li { border-left: 0; padding-left: 0; }
  .proof li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .proof b { font-size: 28px; }
  .proof span { font-size: 15px; }
  .door { min-height: 400px; border-radius: 26px; }
  .door__in { padding: 24px 20px; }
  .door .btn { width: 100%; justify-content: space-between; padding-left: 24px; }
  .dc__link { grid-template-columns: 1fr; }
  .dc__media { min-height: 210px; }
  .dc--full .dc__media { min-height: 150px; }
  .dc__body { padding: 22px 20px 22px; }
  .dc__title { font-size: 30px; }
  .vts { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px; margin-inline: -20px; padding: 0 20px 10px; scrollbar-width: none; }
  .vts::-webkit-scrollbar { display: none; }
  .vt { flex: 0 0 68%; scroll-snap-align: center; }
  .how__img { width: 150px; height: 150px; margin-bottom: 18px; }
  .how__line { top: 75px; }
  .cover { width: min(270px, 80%); }
  .cover__t { font-size: 31px; }
  .th { padding-bottom: 24px; }
  .th .hd__nav { margin-top: 12px; }
  .th__in { width: calc(100% - 36px); padding: 30px 0 26px; gap: 28px; }
  .th__title { font-size: 42px; margin-top: 14px; }
  .th--od .th__title { font-size: 37px; }
  .th__hook { font-size: 21px; margin-top: 12px; }
  .th__desc { font-size: 18px; }
  .th__cta { margin-top: 22px; }
  .th__cta .btn { width: 100%; min-height: 54px; justify-content: space-between; padding-left: 26px; white-space: nowrap; }
  .th__media { width: min(300px, 86%); }
  .th__facts { width: calc(100% - 36px); grid-template-columns: 1fr 1fr; padding: 18px 20px; gap: 14px 16px; border-radius: 22px; }
  .th__facts li:last-child { grid-column: 1 / -1; }
  .th__facts b { font-size: 16.5px; }
  .page--float { display: none; }
  .th__media--od .cover { transform: rotate(-3deg); }
  .forts li { padding: 24px 22px 26px; }
  .stops { gap: 18px; }
  .stop { grid-template-columns: 50px minmax(0, 1fr); }
  .stop__card { padding: 18px 18px 20px; border-radius: 22px; }
  .stop h3 { font-size: 23px; }
  .stop__k b { font-size: 26px; }
  .pricebox__card { padding: 26px 22px 22px; border-radius: 26px; }
  .tp__score { align-items: flex-start; text-align: left; }
  .cross { padding: 20px; gap: 18px; border-radius: 26px; }
  .cross { grid-template-columns: 1fr; }
  .cross img { width: 100%; height: 150px; }
  .prod__price b { font-size: 54px; }
  .dests--sm { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .dests--sm .dest__name { font-size: 15px; left: 8px; bottom: 8px; font-family: var(--sans); font-weight: 700; }
  .prod__more { margin-top: 52px; font-size: 27px; }
  .cmp__row { grid-template-columns: 1fr 1fr; }
  .cmp__row--head { display: none; }
  .cmp__row > span { padding: 12px 16px; font-size: 16px; border-top: 0; }
  .cmp__row > span:first-child { grid-column: 1 / -1; padding: 18px 16px 4px; border-top: 1px solid var(--line); font-size: 17px; }
  .cmp__row > span:nth-child(3)::before { content: "Agence : "; font-weight: 700; color: var(--choc); }
  .cmp__row > span:nth-child(4)::before { content: "Seule : "; font-weight: 700; color: var(--choc); }
  .cmp__row > .cmp__us { grid-column: 1 / -1; margin: 6px 12px 16px; border-radius: 16px; }
  .cmp__row > .cmp__us::before { content: "Mon carnet : "; font-weight: 400; opacity: .85; }
}
@media (prefers-reduced-motion: reduce) {
  .js .how .how__step, .js .how .how__img b { opacity: 1; transform: none; }
  .how__plane { left: 100%; }
  .js .route.is-ready .stop__card { opacity: 1 !important; transform: none !important; }
}
@media (max-width: 760px) {
  .dests--sm .dest.is-on .dest__name::before { display: none; }
}

/* =========================================================
   Ajouts : avion à l'arrivée, vidéos fictives, étapes du parcours carnet
   ========================================================= */
/* ---------- Avion à l'arrivée : traverse le header et fait apparaître le texte ---------- */
.hd__plane { position: absolute; z-index: 2; left: 0; top: 46%; width: clamp(54px, 6vw, 92px); pointer-events: none; opacity: 0; }
.hd__plane svg, .hd__mini svg { display: block; width: 100%; fill: #fff; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .4)); }
.hd__mini { display: inline-block; width: 22px; vertical-align: -3px; margin-left: 4px; animation: mini-fly 2.6s ease-in-out infinite alternate; }
.hd__mini svg { fill: var(--ochre-l); filter: none; transform: rotate(-12deg); }
@keyframes mini-fly { to { transform: translate(6px, -5px) rotate(-6deg); } }
.js .hd__plane { animation: plane-in 2.6s cubic-bezier(.45, .05, .3, 1) .15s both; }
@keyframes plane-in {
  0% { opacity: 1; transform: translate(-20vw, 9vh) rotate(-10deg); }
  45% { opacity: 1; transform: translate(42vw, -3vh) rotate(-14deg); }
  100% { opacity: 0; transform: translate(112vw, -30vh) rotate(-24deg) scale(.7); }
}
.js .hd__title { animation: wipe-in 1.1s cubic-bezier(.3, .7, .2, 1) .35s both; }
.js .hd__hook { animation: rise-in .8s ease 1.05s both; }
.js .hd__cta { animation: rise-in .8s ease 1.25s both; }
.js .hd__mid { animation: rise-in .9s ease 1.45s both; }
.js .hd__side { animation: rise-in .9s ease 1.7s both; }
@keyframes wipe-in { from { clip-path: inset(0 100% 0 0); opacity: .2; } to { clip-path: inset(-10% -5% -10% 0); opacity: 1; } }
@keyframes rise-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------- Vidéos fictives : la carte se lit sur place ---------- */
.vt__btn { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; border-radius: inherit; overflow: hidden; }
.vt__btn img { transition: transform .6s ease; }
.vt:hover .vt__btn img { transform: scale(1.04); }
.vt__play { transition: opacity .3s, transform .3s; }
.vt:hover .vt__play { transform: translate(-50%, -50%) scale(1.08); }
.vt__dur { position: absolute; left: 12px; top: 12px; font: 700 12.5px/1 var(--sans); background: rgba(24, 14, 17, .6); border-radius: 999px; padding: 6px 9px; }
.vt__txt { display: block; }
.vt__q { display: block; font: 400 20px/1.25 var(--display); min-height: 3.75em; }
.vt__who { display: block; margin-top: 10px; font-size: 14.5px; color: #ead9dc; }
.vt__who b { display: block; color: var(--ochre-l); font-size: 15.5px; }
.vt__bar { position: absolute; left: 14px; right: 14px; bottom: 8px; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .25); opacity: 0; transition: opacity .3s; overflow: hidden; }
.vt__bar i { display: block; height: 100%; width: 0; background: #fff; }
.vt.is-playing .vt__play { opacity: 0; }
.vt.is-playing .vt__bar { opacity: 1; }
.vt.is-playing .vt__btn img { animation: vt-zoom 14s ease-in-out infinite alternate; }
.vt.is-playing .vt__q { animation: vt-sub .45s ease; }
.vt.is-playing .vt__dur::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #ff5a6e; margin-right: 6px; animation: vt-rec 1s steps(2) infinite; }
@keyframes vt-zoom { from { transform: scale(1.02) translate(0, 0); } to { transform: scale(1.14) translate(-2%, -2%); } }
@keyframes vt-sub { from { opacity: 0; transform: translateY(6px); } }
@keyframes vt-rec { 50% { opacity: .2; } }

/* ---------- « Comment ça marche » sur fond clair (page carnet) ---------- */
.how--light .how__line { border-top-color: var(--clay-2); }
.how--light .how__plane { color: var(--burnt); }
.how__plane svg { fill: currentColor; transform: none; }
.how--light .how__img img { border-color: var(--paper); box-shadow: 0 0 0 2px var(--clay-2); }
.how--light .how__img b { border-color: var(--paper); }
.how--light h3 { color: var(--choc); }
.how--light .how__step p { color: var(--ink-2); }

/* ---------- Page carnet : confiance, rien à perdre, pour qui ---------- */
.th__trust { display: inline-flex; align-items: center; gap: 12px; font-weight: 600; font-size: 15.5px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; padding: 6px 16px 6px 6px; }
.th__trust .stack img { width: 30px; height: 30px; }
.prod__price small { flex-basis: 100%; font: 700 13px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); margin-bottom: -2px; }
.norisk { margin-top: 56px; background: var(--clay); border-radius: 30px; padding: 34px 36px 36px; }
.norisk ul { list-style: none; margin: 24px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.norisk li { background: var(--paper); border-radius: 20px; padding: 20px 20px 22px; }
.norisk b { display: block; font: 400 23px/1.15 var(--display); color: var(--burnt); }
.norisk span { display: block; margin-top: 6px; font-size: 16.5px; line-height: 1.4; color: var(--ink-2); }
.whos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.whos li { background: var(--linen); border-radius: 26px; overflow: hidden; box-shadow: 0 18px 34px -28px rgba(45, 27, 32, .45); }
.whos img { width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; }
.whos div { padding: 20px 22px 24px; }
.whos b { font: 400 27px/1.1 var(--display); }
.whos p { margin-top: 6px; color: var(--ink-2); font-size: 17.5px; line-height: 1.45; }
@media (max-width: 900px) {
  .norisk ul, .whos { grid-template-columns: 1fr 1fr; }
  .how--light .how__line { border-left-color: var(--clay-2); }
  .how--light .how__step { background: var(--paper); }
}
@media (max-width: 760px) {
  .hd__plane { top: 30%; width: 50px; }
  .vt__q { font-size: 19px; }
  .norisk { padding: 24px 18px 20px; border-radius: 24px; }
  .norisk ul { gap: 10px; }
  .norisk li { padding: 16px; }
  .norisk b { font-size: 20px; }
  .whos { gap: 12px; }
  .whos div { padding: 14px 14px 18px; }
  .whos b { font-size: 22px; }
  .whos p { font-size: 15.5px; }
  .th__trust { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .hd__plane { display: none; }
  .js .hd__title { clip-path: none; opacity: 1; }
}

/* ---------- Qui est Mandy : deux sauts ---------- */
.about__media { padding-right: 56px; padding-bottom: 8px; }
.about__media .about__jump { position: absolute; right: 0; bottom: 46px; width: 44%; aspect-ratio: 3 / 4.2; border-radius: 22px; border: 6px solid var(--clay); object-position: 50% 30%; box-shadow: 0 24px 40px -22px rgba(45, 27, 32, .6); transform: rotate(4deg); }
.about__media > img:first-child { object-position: 50% 62%; }
@media (max-width: 900px) { .about__media { padding-right: 40px; } }

/* ---------- Points forts avec photo, story filmée ---------- */
.forts li.has-img { padding: 0; overflow: hidden; }
.forts li.has-img img { width: 100%; aspect-ratio: 4 / 3.3; object-fit: cover; }
.forts li.has-img div { padding: 24px 26px 30px; }
.story { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: clamp(36px, 6vw, 90px); align-items: center; max-width: 1080px; }
.story__phone { margin: 0; }

.story__phone figcaption { position: absolute; z-index: 3; left: 18px; top: 62px; display: flex; align-items: center; gap: 8px; color: #fff; font-weight: 700; font-size: 14px; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); }
.story__phone figcaption img { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--ochre-l); }
@media (max-width: 760px) {
  .story { grid-template-columns: 1fr; }
  .story__phone { width: min(300px, 82vw); margin: 0 auto; }
  .forts li.has-img div { padding: 20px 22px 24px; }
}

/* Carnet : conseils et liens, sous les six rubriques */
.carnet__plus { margin-top: 22px; padding: 16px 18px; border-left: 4px solid var(--burnt); border-radius: 8px; background: var(--clay); color: var(--choc); font-size: 17px; }

/* =====================================================================
   Itération 14/10 (Loom) : aperçu du carnet en ligne, confiance, programme illustré
   ===================================================================== */
/* --- Téléphone : maquette d'écran du carnet --- */
.phone { position: relative; width: 300px; aspect-ratio: 9 / 18.6; border-radius: 44px; padding: 11px; background: #1b1114; box-shadow: 0 40px 70px -30px rgba(20, 10, 13, .75), inset 0 0 0 2px rgba(255, 255, 255, .08); flex: none; }
.phone__screen { position: relative; height: 100%; border-radius: 34px; overflow: hidden; background: var(--linen); color: var(--choc); font-size: 13px; line-height: 1.4; display: flex; flex-direction: column; gap: 10px; padding: 34px 14px 14px; }
.phone__screen::before { content: ""; position: absolute; top: 10px; left: 50%; width: 84px; height: 22px; margin-left: -42px; border-radius: 20px; background: #1b1114; }
.cx-top { display: flex; align-items: center; justify-content: space-between; font: 700 10.5px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--burnt); }
.cx-top i { width: 16px; height: 10px; border-top: 2px solid var(--choc); border-bottom: 2px solid var(--choc); position: relative; }
.cx-top i::after { content: ""; position: absolute; left: 0; right: 0; top: 2px; border-top: 2px solid var(--choc); }
.cx-hero { position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 4 / 3.4; flex: none; }
.cx-hero img { width: 100%; height: 100%; object-fit: cover; }
.cx-hero div { position: absolute; inset: auto 0 0; padding: 30px 14px 12px; background: linear-gradient(to top, rgba(24, 14, 17, .85), transparent); color: #fff; }
.cx-hero small { display: block; font: 700 10px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ochre-l); }
.cx-hero b { display: block; margin-top: 5px; font: 400 21px/1.08 var(--display); }
.cx-tabs { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; overflow: hidden; }
.cx-tabs li { flex: none; padding: 6px 10px; border-radius: 99px; background: var(--paper); border: 1px solid var(--line); font-weight: 600; font-size: 11.5px; }
.cx-tabs li.is-on { background: var(--burnt); border-color: var(--burnt); color: #fff; }
.cx-tip { background: var(--clay); border-left: 3px solid var(--burnt); border-radius: 12px; padding: 10px 12px; }
.cx-tip b { display: block; font: 400 15px/1.1 var(--display); color: var(--burnt); }
.cx-tip p { margin-top: 4px; font-size: 12px; color: var(--ink-2); }
.cx-link { display: flex; align-items: center; gap: 10px; background: var(--paper); border-radius: 14px; padding: 9px 11px; box-shadow: 0 8px 18px -14px rgba(45, 27, 32, .5); }
.cx-link b { display: block; font-size: 12.5px; }
.cx-link small { display: block; color: var(--ink-2); font-size: 11px; }
.cx-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--clay); flex: none; }
.cx-go { margin-left: auto; color: var(--burnt); font-weight: 700; }
.cx-h { font: 400 22px/1.05 var(--display); }
.cx-h small { display: block; margin-top: 4px; font: 600 11px/1.2 var(--sans); color: var(--ink-2); }
.cx-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.cx-list li { display: flex; gap: 10px; align-items: center; background: var(--paper); border-radius: 13px; padding: 8px 10px; }
.cx-list i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clay); color: var(--burnt); font: 400 13px/1 var(--display); font-style: normal; flex: none; }
.cx-list b { display: block; font-size: 12.5px; }
.cx-list small { display: block; color: var(--ink-2); font-size: 10.5px; line-height: 1.25; }
.cx-card { border-radius: 16px; overflow: hidden; background: var(--paper); box-shadow: 0 10px 22px -16px rgba(45, 27, 32, .5); }
.cx-card img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.cx-card div { padding: 10px 12px 12px; }
.cx-card b { display: block; font: 400 18px/1.1 var(--display); }
.cx-card small { display: block; margin-top: 2px; font-size: 11px; color: var(--ink-2); }
.cx-card p { margin-top: 6px; font-size: 12px; color: var(--ink-2); }
.cx-btn { display: inline-block; margin-top: 8px; padding: 6px 12px; border-radius: 99px; background: var(--burnt); color: #fff; font-weight: 700; font-size: 11.5px; }
.cx-day { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cx-day li { display: grid; grid-template-columns: 46px 1fr; gap: 8px; background: var(--paper); border-radius: 13px; padding: 9px 10px; font-size: 12px; }
.cx-day i { font-style: normal; font-weight: 700; color: var(--burnt); font-size: 11.5px; }
/* hero de la page carnet */
.th__media--od { position: relative; }
.th__media--od .phone { transform: rotate(3deg); }
.phone-badge { position: absolute; z-index: 2; background: var(--paper); color: var(--choc); border-radius: 18px; padding: 10px 14px; font-size: 13px; line-height: 1.3; box-shadow: 0 18px 34px -18px rgba(0, 0, 0, .55); }
.phone-badge b { display: block; font: 400 17px/1.1 var(--display); color: var(--burnt); }
.phone-badge--a { left: 2%; top: 22%; }
.phone-badge--b { right: 0; bottom: 14%; }
/* section aperçu : trois écrans */
.phones { display: flex; justify-content: center; align-items: center; gap: 28px; margin-top: 44px; }
.phones .phone { width: 260px; }
.phones .phone--main { width: 300px; z-index: 1; }
.phones .phone:first-child { transform: rotate(-4deg) translateY(18px); }
.phones .phone:last-child { transform: rotate(4deg) translateY(18px); }
.rubs { list-style: none; margin: 56px auto 0; padding: 0; max-width: 1040px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.rubs li { display: grid; grid-template-columns: 38px 1fr; column-gap: 12px; align-items: center; background: var(--linen); border-radius: 18px; padding: 14px 16px; }
.rubs i { grid-row: span 2; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--clay); color: var(--burnt); font: 400 19px/1 var(--display); font-style: normal; }
.rubs b { font-size: 17px; }
.rubs span { color: var(--ink-2); font-size: 15.5px; line-height: 1.35; }
.center-box { max-width: 760px; margin: 18px auto 0; }
#apercu .center { margin-top: 30px; }
/* offre */
.prod__media .phone--offer { transform: rotate(-2deg); }
.prod__sub { margin: -12px 0 24px; color: var(--ink-2); font-size: 18px; max-width: 46em; }
.paysafe { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 14px; padding: 12px 16px; border-radius: 16px; background: var(--linen); border: 1px solid var(--line); }
.paysafe__lock { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 15px; }
.paysafe__lock svg { width: 18px; height: 18px; fill: none; stroke: var(--burnt); stroke-width: 2; }
.paysafe__cards { display: flex; gap: 6px; flex-wrap: wrap; }
.buyers, .live, .pricebox__social { display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 15.5px; color: var(--ink-2); }
.buyers b, .live b, .pricebox__social b { color: var(--choc); }
.buyers .stack img, .pricebox__social .stack img { width: 32px; height: 32px; }
.live { margin-top: 8px; font-size: 14.5px; }
.live i { width: 9px; height: 9px; border-radius: 50%; background: #2e9e5b; box-shadow: 0 0 0 4px rgba(46, 158, 91, .18); flex: none; }
.reassure-row { list-style: none; margin: 40px 0 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 14px; }
.reassure-row li { padding: 9px 16px; border-radius: 99px; background: var(--paper); border: 1px solid var(--line); font-weight: 600; font-size: 15px; }
/* page voyage : CTA après le programme */
.progcta { margin: 56px auto 0; max-width: 820px; display: flex; align-items: center; justify-content: space-between; gap: 18px 28px; flex-wrap: wrap; background: var(--clay); border-radius: 26px; padding: 24px 28px; }
.progcta b { display: block; font: 400 26px/1.15 var(--display); }
.progcta span { display: block; margin-top: 4px; color: var(--ink-2); }
/* page voyage : avis + prix réunis */
.tp-in { margin-bottom: 64px; }
.section--choc .tp__head .h2, .section--choc .tp__head { color: #fff; }
.section--choc .tp__score, .section--choc .tp-in > .demo-note { color: #ead9dc; }
.pricebox__urgent { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 7px 12px; border-radius: 99px; background: var(--clay); color: var(--burnt); font-weight: 700; font-size: 14.5px; }
.pricebox__urgent i { width: 8px; height: 8px; border-radius: 50%; background: var(--burnt); }
.pricebox__list { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 8px; }
.pricebox__list li { position: relative; padding-left: 30px; font-size: 16.5px; }
.pricebox__list li::before { content: ""; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%; background: var(--burnt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }
.pricebox__social { justify-content: center; }
/* programme : photos et vidéos par jour */
.stop__card { position: relative; }
/* ordinateur : la photo se place dans la colonne vide en face de la carte, sans changer la hauteur de l'étape (les vagues restent régulières) */
.stop__media { position: absolute; top: 50%; left: calc(100% + 230px); width: min(280px, 26vw); aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; background: var(--clay); transform: translateY(-50%) rotate(2deg); box-shadow: 0 18px 34px -22px rgba(45, 27, 32, .6); border: 5px solid var(--paper); }
.stop:nth-child(even) .stop__media { left: auto; right: calc(100% + 230px); transform: translateY(-50%) rotate(-2deg); }
.stop__media img, .stop__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .5s ease; }
.stop__media > :first-child, .stop__media .is-shown { opacity: 1; }
.stop__media.is-live > :first-child:not(.is-shown) { opacity: 0; }
.stop__count { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 6px; opacity: 1 !important; }
.stop__count i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.stop__count i.is-on { background: #fff; }
/* accueil : moins d'espace entre les départs et les témoignages */
#voyages { padding-bottom: 64px; }
#voyages + .section { padding-top: 72px; }
@media (max-width: 900px) {
  .phones { gap: 14px; overflow-x: auto; justify-content: flex-start; scroll-snap-type: x mandatory; padding: 10px 4px 26px; margin-left: -16px; margin-right: -16px; padding-left: 16px; }
  .phones .phone, .phones .phone--main { width: 248px; transform: none !important; scroll-snap-align: center; }
  .rubs { grid-template-columns: 1fr; gap: 10px; margin-top: 30px; }
  .th__media--od .phone { width: 260px; transform: rotate(2deg); }
  .phone-badge { font-size: 12px; padding: 8px 11px; }
  .phone-badge b { font-size: 15px; }
  .phone-badge--a { left: 0; top: 16%; }
  .phone-badge--b { right: 0; bottom: 10%; }
  .progcta { padding: 20px; }
  .progcta .btn { width: 100%; }
  .progcta b { font-size: 22px; }
  .paysafe { justify-content: flex-start; }
  .tp-in { margin-bottom: 44px; }
  #voyages { padding-bottom: 44px; }
  #voyages + .section { padding-top: 52px; }
}
.cx-hero--sm { aspect-ratio: 16 / 8; }
.phone--teaser { transform: rotate(-3deg); }
@media (max-width: 900px) {
  .stop__media, .stop:nth-child(even) .stop__media { position: relative; top: auto; left: auto; right: auto; width: auto; transform: none; margin: -4px -4px 14px; border: 0; box-shadow: none; aspect-ratio: 16 / 8; }
  .phone--teaser { width: 260px; }
}
/* page voyage : prix + inclus / non inclus / à apporter réunis */
.pricebox--incl { align-items: start; }
.pricebox--incl .pricebox__card { position: sticky; top: 24px; }
.pricebox__k { margin-top: 34px; font: 700 13px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ochre-l); }
.trio--price { margin-top: 14px; grid-template-columns: 1fr 1fr; gap: 14px; }
.trio--price .incl--card { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); padding: 22px 22px 6px; border-radius: 22px; }
.trio--price .incl--card:first-child { grid-row: span 2; }
.trio--price .incl h4 { color: #fff; }
.trio--price .incl li { color: #f3ebe6; font-size: 16.5px; }
.trio--price .incl .no li { color: #d9c4c9; }
.trio--price .incl--bring { background: rgba(243, 184, 198, .12); }
.trio--price .incl--bring li::before { background-color: var(--ochre-l); filter: none; }
@media (max-width: 900px) {
  .trio--price { grid-template-columns: 1fr; }
  .trio--price .incl--card:first-child { grid-row: auto; }
  .pricebox--incl .pricebox__card { position: static; }
}

/* ===== Loom 2 (14/10) ===== */
.section--tight { padding-top: 64px; padding-bottom: 64px; }
#programme { padding-bottom: 72px; }
/* prix : « Dans le prix » + « Dans ton sac à dos » */
.incl2 { margin-top: 14px; display: grid; grid-template-columns: 1.15fr 1fr; gap: 14px; align-items: stretch; }
.incl2__in { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); padding: 22px 22px 8px; border-radius: 22px; }
.incl2__in h4, .bag h4 { color: #fff; }
.incl2__in li { color: #f3ebe6; font-size: 16.5px; }
.incl2__in .no { padding-top: 14px; border-top: 1px dashed rgba(255, 255, 255, .2); }
.incl2__in .no li { color: #cdb6bc; }
.bag { position: relative; border-radius: 22px; padding: 22px; background: linear-gradient(160deg, rgba(243, 184, 198, .22), rgba(243, 184, 198, .06)); border: 1px solid rgba(243, 184, 198, .3); overflow: hidden; }
.bag h4 { font: 700 16px/1.2 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.bag__svg { position: absolute; right: -14px; bottom: -10px; width: 120px; color: var(--burnt); opacity: .55; transform: rotate(-8deg); }
.bag__items { position: relative; list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.bag__items li { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 14px; background: rgba(255, 253, 251, .94); color: var(--choc); font-size: 15.5px; line-height: 1.3; box-shadow: 0 10px 20px -16px rgba(0, 0, 0, .6); max-width: 92%; }
.bag__items li:nth-child(even) { margin-left: 8%; }
.bag__items span { font-size: 20px; flex: none; }
/* urgence : point « en direct » qui pulse, comme le rec d'une caméra */
.pricebox__urgent { background: #fbe9ec; }
.pricebox__urgent i { position: relative; background: #d6203d; animation: rec 1.4s ease-in-out infinite; }
.pricebox__urgent i::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid #d6203d; opacity: 0; animation: rec-ring 1.4s ease-out infinite; }
@keyframes rec { 50% { opacity: .35; } }
@keyframes rec-ring { 0% { transform: scale(.4); opacity: .7; } 100% { transform: scale(1.6); opacity: 0; } }
.live i { animation: rec 1.6s ease-in-out infinite; }
.live--top { margin: 0 0 14px; }
/* bannière « À cette table, il reste N chaises » */
.tablebanner { position: relative; border-radius: 28px; overflow: hidden; min-height: 380px; display: flex; align-items: flex-end; }
.tablebanner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tablebanner > div { position: relative; padding: 90px 40px 34px; width: 100%; background: linear-gradient(to top, rgba(24, 14, 17, .92), rgba(24, 14, 17, 0)); }
.lv-banner__k { color: var(--ochre-l); font-weight: 700; }
.tablebanner h3 { margin: 6px 0 20px; font: 400 clamp(30px, 3.4vw, 46px)/1.06 var(--display); color: #fff; }
/* sérénité : icônes + moyens de paiement */
.norisk li { position: relative; }
.norisk__ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--clay); margin-bottom: 12px; }
.norisk__ic svg { width: 22px; height: 22px; fill: none; stroke: var(--burnt); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.norisk__pay { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--ink-2); font-size: 14.5px; }
/* devis : champ libre + dictée */
.pi-voice { display: flex; gap: 8px; align-items: flex-start; }
.pi-voice textarea { flex: 1; }
.pi-mic { flex: none; width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer; }
.pi-mic svg { width: 22px; height: 22px; fill: none; stroke: var(--burnt); stroke-width: 2; stroke-linecap: round; }
.pi-mic.is-on { background: var(--burnt); border-color: var(--burnt); }
.pi-mic.is-on svg { stroke: #fff; }
.pi-hint { font-size: 13px; color: var(--ink-2); margin-top: 6px; }
@media (max-width: 900px) {
  .incl2 { grid-template-columns: 1fr; }
  .bag__svg { width: 96px; }
  .section--tight { padding-top: 48px; padding-bottom: 48px; }
  .tablebanner { min-height: 320px; }
  .tablebanner > div { padding: 70px 20px 22px; }
  .tablebanner .btn { width: 100%; justify-content: space-between; }
}
/* sérénité : icônes centrées dans les ronds (la règle .norisk span les cassait) + logos de paiement */
.norisk .norisk__ic { display: grid; place-items: center; margin-top: 0; }
.norisk .norisk__ic svg { display: block; }
.norisk__pay b { display: inline; font: 700 15px/1 var(--sans); color: var(--ink-2); margin-right: 4px; }
.pay { display: inline-flex; align-items: center; gap: 7px; font-style: normal; font: 700 13px/1 var(--sans); padding: 7px 11px 7px 8px; border-radius: 9px; background: var(--paper); border: 1px solid var(--line); color: var(--choc); }
.norisk .pay__logo, .paysafe .pay__logo { display: inline-grid; place-items: center; margin: 0; width: auto; height: 18px; }
.pay__logo svg { height: 18px; width: auto; display: block; }
.paysafe__cards .pay { padding: 5px 9px 5px 6px; font-size: 12px; }
@media (max-width: 640px) {
  .norisk__pay { gap: 6px; }
  .norisk__pay b { flex-basis: 100%; margin-bottom: 2px; }
  .pay { font-size: 12px; padding: 6px 9px 6px 7px; }
}

/* ===== Retours mobile (14/10) ===== */
/* téléphone de la vidéo : vrai format iPhone 16 */
/* comparatif téléphone (caché sur ordinateur) */
.cmpm { display: none; position: relative; }
/* comparatif façon Hector */
.cmpm__head, .cmpm__rows li { display: grid; grid-template-columns: minmax(0, 1fr) 84px 72px; align-items: center; column-gap: 6px; }
.cmpm__head { position: relative; z-index: 1; padding-bottom: 6px; }
.cmpm__head > span { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; font-size: 12.5px; line-height: 1.15; padding-top: 14px; }
.cmpm__us img { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; border: 2px solid #fff; box-shadow: 0 6px 12px -6px rgba(45, 27, 32, .5); }
.cmpm__us b { color: var(--burnt); font: 400 17px/1 var(--display); }
.cmpm__them i { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--line); color: var(--ink-2); font: 700 18px/1 var(--sans); font-style: normal; }
.cmpm__them b { color: var(--ink-2); font-weight: 600; }
.cmpm__rows { position: relative; z-index: 1; list-style: none; margin: 0; padding: 0; }
.cmpm__rows li { padding: 16px 0; }
.cmpm__rows p b { display: block; font-size: 17px; line-height: 1.25; color: var(--choc); }
.cmpm__rows p span { display: block; margin-top: 4px; font-size: 14.5px; line-height: 1.35; color: var(--ink-2); }
.cmpm__rows i { justify-self: center; display: grid; place-items: center; border-radius: 50%; }
.cmpm__rows i svg { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.cmpm__yes { width: 40px; height: 40px; background: var(--burnt); }
.cmpm__yes svg { width: 22px; height: 22px; stroke: #fff; stroke-width: 3; }
.cmpm__no { width: 32px; height: 32px; background: var(--line); }
.cmpm__no svg { width: 15px; height: 15px; stroke: var(--ink-2); stroke-width: 2.6; }
/* colonne « Mon carnet » mise en avant */
.cmpm__col { position: absolute; top: 0; bottom: 0; right: 78px; width: 84px; border: 2px solid var(--burnt); border-radius: 26px; background: var(--paper); box-shadow: 0 18px 30px -22px rgba(139, 30, 63, .55); }
.cmpm::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 72px; border-radius: 24px; background: rgba(236, 217, 211, .35); border: 1px solid var(--line); }
@media (max-width: 760px) {
  /* aperçu : les téléphones sans fond ni ombre coupée */
  .phones { overflow-x: auto; padding: 14px 16px 30px; }
  .phones .phone { box-shadow: 0 16px 26px -20px rgba(45, 27, 32, .55); }
  /* destinations : espacées, plus de chevauchement */
  .dests--sm { gap: 12px; padding: 4px; }
  .dests--sm .dest { outline-offset: 2px; outline-width: 2px; height: 84px; }
  /* avis : petites cartes côte à côte qui défilent */
  .tp { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 6px 16px 18px; scrollbar-width: none; }
  .tp::-webkit-scrollbar { display: none; }
  .tp__card { flex: 0 0 78%; scroll-snap-align: start; padding: 20px 18px 18px; border-radius: 22px; }
  .tp__card h3 { font-size: 17px; margin-top: 12px; }
  .tp__card > p:not([class]) { font-size: 15.5px; margin: 6px 0 14px; }
  /* trois moments : les cartes s'empilent au défilement */
  .forts { gap: 16px; }
  .forts li { position: sticky; top: 76px; }
  .forts li:nth-child(2) { top: 90px; }
  .forts li:nth-child(3) { top: 104px; }
  .forts li.has-img img { aspect-ratio: 16 / 10; }
  .cmp { display: none; }
  .cmpm { display: block; }
}

/* iPhone réaliste (même dessin que la maquette Agentova) */
.iphone { position: relative; width: 300px; padding: 10px; border-radius: 58px; background: #0b0b0d; box-shadow: 0 0 0 1.5px #2c2c30, 0 0 0 3.5px #9a9aa0, 0 0 0 5px #5c5c62, 0 50px 80px -40px rgba(30, 14, 20, .65); }
.iphone__screen { position: relative; border-radius: 48px; overflow: hidden; aspect-ratio: 393 / 852; background: #000; }
.iphone__screen video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.iphone__screen::after { content: ""; position: absolute; inset: 0 0 auto; height: 110px; background: linear-gradient(to bottom, rgba(0, 0, 0, .45), transparent); pointer-events: none; }
.iphone__status { position: absolute; z-index: 3; inset: 0 0 auto; height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 6px 26px 0 34px; color: #fff; font: 600 15px/1 -apple-system, "SF Pro Text", "Source Sans 3", sans-serif; letter-spacing: -.01em; }
.iphone__island { position: absolute; left: 50%; top: 11px; width: 34%; height: 31px; margin-left: -17%; border-radius: 20px; background: #000; }
.iphone__icons { display: flex; align-items: center; gap: 5px; }
.iphone__icons svg { height: 11px; width: auto; fill: currentColor; }
.iphone__icons svg:last-child { height: 12px; }
.iphone__side { position: absolute; width: 3.5px; border-radius: 2px; background: linear-gradient(90deg, #5c5c62, #b5b5bb, #5c5c62); }
.iphone__side--a { left: -7px; top: 110px; height: 26px; }
.iphone__side--b { left: -7px; top: 156px; height: 48px; }
.iphone__side--c { left: -7px; top: 214px; height: 48px; }
.iphone__side--p { right: -7px; top: 170px; height: 74px; }

/* ===== Retours mobile (15/10) ===== */
@media (max-width: 760px) {
  /* « C'est ton voyage, déjà prêt » : cartes plus compactes qui s'empilent au défilement */
  .gains { gap: 14px; }
  .gains li { position: sticky; top: 76px; background: #3a242b; }
  .gains li:nth-child(2) { top: 90px; }
  .gains li:nth-child(3) { top: 104px; }
  .gains img { aspect-ratio: 16 / 8; }
  .gains div { padding: 16px 18px 18px; }
  .gains h3 { font-size: 22px; }
  .gains p { font-size: 16px; margin-top: 4px; }
  /* choix de la destination : la sélection se voit tout de suite */
  .dests--sm { gap: 16px; padding: 6px; }
  .dests--sm .dest { height: 76px; outline: 0; transition: transform .25s ease, opacity .25s ease, filter .25s ease; }
  .dests--sm .dest:not(.is-on) { opacity: .6; filter: grayscale(.5); transform: scale(.94); }
  .dests--sm .dest.is-on { box-shadow: 0 0 0 3px var(--paper), 0 0 0 6px var(--burnt), 0 12px 22px -12px rgba(139, 30, 63, .7); transform: scale(1.02); }
}

/* ===== Corrections Mandy (16/10) ===== */
.pricebox__urgent--calm { background: var(--clay); color: var(--burnt); }
.pricebox__urgent--calm::before { content: none; }
.offers--one { grid-template-columns: minmax(0, 560px); }
.bespoke { margin: 8px 0 36px; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 0; background: var(--paper); border: 2px solid var(--burnt); border-radius: 30px; overflow: hidden; box-shadow: 0 30px 50px -36px rgba(139, 30, 63, .6); scroll-margin-top: 90px; }
.bespoke__media { position: relative; min-height: 320px; }
.bespoke__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bespoke__who { position: absolute; left: 16px; right: 16px; bottom: 16px; padding: 12px 14px; border-radius: 16px; background: rgba(255, 253, 251, .94); font-size: 14.5px; color: var(--ink-2); }
.bespoke__who b { display: block; font: 400 22px/1.1 var(--display); color: var(--burnt); }
.bespoke__body { padding: 30px 32px 28px; }
.bespoke__body .h3 { margin-top: 8px; }
.bespoke__lead { margin-top: 12px; font-size: 18px; color: var(--choc); }
.bespoke__julie { margin-top: 12px; padding: 12px 14px; border-radius: 14px; background: var(--clay); color: var(--ink-2); font-size: 16px; }
.bespoke__julie b { color: var(--burnt); }
.bespoke .offer__list { margin-top: 16px; }
.bespoke__price { margin: 14px 0 16px; color: var(--ink-2); }
.bespoke__price b { font: 400 26px/1 var(--display); color: var(--burnt); margin-right: 6px; }
.bespoke-cta { display: flex; align-items: center; gap: 16px; padding: 14px 18px 14px 14px; border-radius: 24px; background: var(--paper); border: 1.5px solid var(--burnt); text-decoration: none; color: var(--choc); max-width: 760px; margin: 0 auto; box-shadow: 0 18px 30px -26px rgba(139, 30, 63, .55); }
.bespoke-cta img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex: none; }
.bespoke-cta small { display: block; color: var(--ink-2); font-size: 15px; }
.bespoke-cta b { display: block; font: 400 22px/1.15 var(--display); color: var(--burnt); }
.bespoke-cta > i { margin-left: auto; flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--burnt); }
.bespoke-cta > i svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2; }
@media (max-width: 760px) {
  .bespoke { grid-template-columns: 1fr; }
  .bespoke__media { min-height: 300px; }
  .bespoke__media img { object-position: 50% 22%; }
  .bespoke__who { left: 12px; right: auto; bottom: 12px; padding: 8px 12px; font-size: 13px; }
  .bespoke__who b { font-size: 19px; }
  .bespoke__body { padding: 22px 20px 22px; }
  .bespoke .btn { width: 100%; justify-content: space-between; }
  .bespoke-cta b { font-size: 19px; }
}

/* Photos destinations (16/10) */
.door img.door__img--walk { object-position: 50% 58%; }
.door:has(.door__img--walk)::before { background: linear-gradient(to top, rgba(24, 14, 17, .9) 0%, rgba(24, 14, 17, .55) 45%, rgba(24, 14, 17, .1) 80%); }

/* =========================================================
   Octobre 2026 · « Partir comme moi » en trois formules + « Et demain, on part où ? »
   ========================================================= */
.trio__n { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: 10px; border-radius: 50%; background: var(--burnt); color: #fff; font: 700 14px/1 var(--sans); letter-spacing: 0; vertical-align: middle; }
.eyebrow .trio__n { margin-right: 4px; }
.trio .offer__tag { display: flex; align-items: center; }
.trio .offer__title { font-size: 28px; }
.trio .offer__desc { margin: 14px 0 0; }
.trio .offer__list { margin: 18px 0 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.trio .offer__price { border-bottom: 0; padding-bottom: 18px; margin-top: auto; }
.trio .offer .btn { margin-top: 0; }
.trio__note { max-width: 780px; margin: 30px auto 0; padding: 16px 20px; border-radius: 18px; background: var(--clay); color: var(--ink-2); font-size: 17px; text-align: center; }
.trio__note b { color: var(--choc); }
.chips--center { justify-content: center; }
.section .chips--center li { background: var(--paper); border-color: var(--line); color: var(--choc); }
.section .chips--center li::before { background: var(--burnt); }
.bespoke__quote { margin-top: 10px; font: 400 22px/1.25 var(--display); color: var(--burnt); }
.offer__list--steps { counter-reset: st; }
.offer__list--steps li { counter-increment: st; padding-left: 34px; }
.offer__list--steps li::before { content: counter(st); width: 22px; height: 22px; top: .1em; left: 0; display: grid; place-items: center; color: #fff; font: 700 13px/1 var(--sans); }
#formules, #roadbook, #sur-mesure, #cle-en-main { scroll-margin-top: 20px; }

.soon { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.soon__card { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 24px 22px; border-radius: 22px; background: var(--paper); border: 1.5px dashed var(--clay-2); }
.soon__t { margin-top: 10px; font: 400 32px/1.05 var(--display); color: var(--choc); }
.soon__p { color: var(--ink-2); font-size: 16px; }
.soon__note { margin: 18px auto 20px; text-align: center; color: var(--ink-2); font-size: 16px; }
@media (max-width: 760px) {
  .soon { grid-template-columns: 1fr; gap: 12px; }
  .soon__card { padding: 18px; }
  .soon__t { font-size: 28px; margin-top: 6px; }
  .trio .offer__title { font-size: 26px; }
  .trio__note { font-size: 16px; text-align: left; }
}

/* Vote « Et demain, on part où ? » (20/10) */
.soon--vote li { display: flex; }
.soon--vote .soon__card { width: 100%; font: inherit; color: inherit; text-align: left; cursor: pointer; transition: border-color .2s, transform .2s, box-shadow .2s, background .2s; }
.soon--vote .soon__card:hover { border-color: var(--burnt); transform: translateY(-2px); box-shadow: 0 18px 30px -24px rgba(139, 30, 63, .55); }
.soon--vote .soon__card:focus-visible { outline: 3px solid var(--burnt); outline-offset: 3px; }
.soon__cta { margin-top: 10px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 99px; background: var(--burnt); color: #fff; font-weight: 700; font-size: 15px; }
.soon__cta::before { content: "♡"; font-size: 16px; }
.soon__res { display: none; width: 100%; margin-top: 12px; align-items: center; gap: 10px; }
.soon__bar { flex: 1; height: 10px; border-radius: 99px; background: var(--clay); overflow: hidden; }
.soon__bar i { display: block; height: 100%; width: 0; border-radius: 99px; background: var(--burnt); transition: width .8s cubic-bezier(.2, .8, .2, 1); }
.soon__pct { min-width: 44px; text-align: right; font-weight: 800; color: var(--burnt); }
.soon--vote.has-voted .soon__cta { display: none; }
.soon--vote.has-voted .soon__res { display: flex; }
.soon--vote.has-voted .soon__card { cursor: default; transform: none; box-shadow: none; }
.soon--vote .soon__card[aria-pressed="true"] { border-style: solid; border-color: var(--burnt); background: #fdf3f5; }
.soon--vote .soon__card[aria-pressed="true"] .tag::after { content: " · votre choix"; }
.soon__total { margin: 14px auto 0; text-align: center; color: var(--ink-2); font-size: 15px; min-height: 1.4em; }
.soon__idea { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 22px auto 18px; max-width: 520px; }
.soon__idea label { font: 400 22px/1.2 var(--display); color: var(--choc); }
.soon__field { display: flex; gap: 8px; width: 100%; }
.soon__field input { flex: 1; min-width: 0; padding: 12px 16px; border-radius: 99px; border: 1.5px solid var(--clay-2); background: var(--paper); font: inherit; font-size: 16px; color: var(--choc); }
.soon__field input:focus { outline: none; border-color: var(--burnt); }
.soon__thanks { color: var(--burnt); font-weight: 700; }
@media (max-width: 700px) { .soon__idea label { font-size: 20px; } }
.soon__field[hidden] { display: none; }
.soon--vote .soon__card:disabled { outline: none; }

/* Retours du 23 octobre : contenu précis des formules, badges COMPLET plus visibles, bandeau mobile discret */
.incs li { display: grid; gap: 1px; }
.incs li b { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.incs li span { color: var(--choc); }
.incs li.inc--no span { color: var(--ink-2); }
.incs li.inc--no::before { background: var(--clay-2); }
.offer__price small { font: 600 15px/1 var(--sans); color: var(--ink-2); }
.offer__pay .link { border: 0; background: none; padding: 0; font: inherit; color: var(--burnt); text-decoration: underline; cursor: pointer; }
.dc--full .dc__media .tag--full { font-size: 18px; letter-spacing: .1em; padding: 11px 18px 11px 16px; background: var(--burnt); color: #fff; box-shadow: 0 10px 22px -10px rgba(45, 27, 32, .7); }
.dc--full .dc__media .tag--full::before { background: #fff; }
.dc--full .dc__grid span:last-child { font-weight: 800; color: var(--burnt); }
@media (max-width: 760px) {
  .dc--full .dc__media .tag--full { font-size: 17px; }
  .dock { padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
  .dock .btn { min-height: 44px; }
  body { padding-bottom: 0; }
}

/* 24/10 · lisibilité des deux portes de l'accueil : dégradé noir sur toute la hauteur */
.door::before, .door:has(.door__img--walk)::before { background: linear-gradient(to top, rgba(18, 10, 12, .92) 0%, rgba(18, 10, 12, .74) 40%, rgba(18, 10, 12, .5) 70%, rgba(18, 10, 12, .3) 100%); }
.door__t, .door__p { text-shadow: 0 1px 14px rgba(0, 0, 0, .35); }
@media (max-width: 700px) {
  .door::before, .door:has(.door__img--walk)::before { background: linear-gradient(to top, rgba(18, 10, 12, .94) 0%, rgba(18, 10, 12, .8) 45%, rgba(18, 10, 12, .62) 75%, rgba(18, 10, 12, .45) 100%); }
}

/* 24/10 · formules : coche rose pour ce qui est inclus, croix grise pour ce qui ne l'est pas */
.incs li.inc { padding-left: 30px; }
.incs li.inc::before { width: 20px; height: 20px; left: 0; top: .05em; border-radius: 50%; background: var(--clay) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.4l3 3 6-6.6' fill='none' stroke='%238b1e3f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat; }
.incs li.inc--no::before { background: #efe9e7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6.5 6.5l7 7M13.5 6.5l-7 7' fill='none' stroke='%23a3999b' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/20px no-repeat; }
.incs li.inc--no b, .incs li.inc--no span { color: #a3999b; }

/* 24/10 · cartes de l'accueil moins hautes : la hauteur suit le contenu, même marge en haut et en bas */
.door { min-height: 0; }
.door__in { padding: 34px; }
@media (max-width: 1000px) { .door { min-height: 0; } }
@media (max-width: 700px) { .door { min-height: 0; } .door__in { padding: 22px 20px; } }

/* 24/10 · texte d'intro du roadbook sur moins de lignes */
.lead--wide { max-width: 900px; }
/* 24/10 · coches sans rond (les ronds sont réservés aux étapes numérotées) */
.ticks li { padding-left: 30px; }
.ticks li::before { width: 20px; height: 20px; top: 3px; border-radius: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b1e3f' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center / 20px no-repeat; }
.gains picture { display: block; }
.gains img { height: auto; }
@media (max-width: 640px) { .lead--wide { font-size: 16.5px; line-height: 1.55; } }
/* 24/10 · tailles mobiles revues : titres de section et textes d'intro moins imposants */
@media (max-width: 640px) {
  .h2 { font-size: 34px; line-height: 1.06; }
  .lead, .lead--wide { font-size: 16.5px; line-height: 1.55; margin-top: 14px; }
  .head .chips { gap: 8px; }
  .head .chips li { font-size: 14px; padding: 7px 12px; }
}

/* 24/10 · menu mobile (bouton « trois traits » + panneau), créé par app.js */
.burger { display: none; flex: none; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .16); cursor: pointer; padding: 0; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.burger span { display: block; width: 17px; height: 2px; border-radius: 2px; background: #fff; }
.mmenu { position: fixed; inset: 0; z-index: 950; background: var(--choc); color: #fff; display: flex; flex-direction: column; padding: 14px 20px calc(24px + env(safe-area-inset-bottom)); overflow-y: auto; opacity: 0; transform: translateY(-12px); transition: opacity .25s ease, transform .25s ease; }
.mmenu.is-open { opacity: 1; transform: none; }
.mmenu[hidden] { display: none; }
.mmenu__top { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding-left: 6px; }
.mmenu__top .brand { color: #fff; font-size: 20px; text-decoration: none; }
.mmenu__top .brand span { color: var(--ochre-l); }
.mmenu__x { position: relative; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .08); cursor: pointer; }
.mmenu__x span { position: absolute; left: 13px; top: 21px; width: 18px; height: 2px; border-radius: 2px; background: #fff; transform: rotate(45deg); }
.mmenu__x span + span { transform: rotate(-45deg); }
.mmenu__list { list-style: none; margin: 28px 0 0; padding: 0 6px; display: grid; gap: 4px; }
.mmenu__a { display: block; padding: 12px 0; font: 400 34px/1.1 var(--display); color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.mmenu__a.is-here { color: var(--ochre-l); }
.mmenu__sub { list-style: none; margin: 4px 0 10px; padding: 0; display: grid; gap: 2px; }
.mmenu__sub a { display: block; padding: 7px 0 7px 16px; border-left: 2px solid rgba(243, 184, 198, .45); font-size: 17px; font-weight: 600; color: #ead9dc; text-decoration: none; }
.mmenu__foot { margin-top: auto; padding: 28px 6px 0; }
.mmenu__foot .btn { width: 100%; justify-content: space-between; padding-left: 24px; }
.mmenu__foot .btn i { display: grid; }
html.mmenu-on, html.mmenu-on body { overflow: hidden; }
@media (max-width: 900px) {
  .burger { display: flex; }
  .hd__nav { gap: 8px; }
  .hd__nav .btn { margin-left: auto; }
}
@media (max-width: 420px) {
  .hd__nav { padding: 6px 6px 6px 14px; gap: 6px; }
  .hd__nav .brand { font-size: 17px; }
  .hd__nav .arrowbtn { padding: 0 13px; min-height: 40px; font-size: 14px; }
  .burger { width: 40px; height: 40px; }
}
@media (max-width: 350px) { .hd__nav .brand span { display: none; } }
@media (max-width: 900px) { .hd__nav .btn { white-space: nowrap; } }
@media (max-width: 380px) { .hd__nav .brand { font-size: 15.5px; } .hd__nav .arrowbtn { padding: 0 11px; font-size: 13.5px; } .hd__nav { gap: 5px; padding-left: 12px; } }

/* 24/10 · cartes de l'accueil : le titre devient « Partir avec moi » / « Partir comme moi », le mot-clé en rose */
.door__t { font-size: clamp(44px, 4.6vw, 66px); line-height: 1; margin-top: 0; }
.door__t em { font-style: italic; color: var(--ochre-l); }
.door__p { margin-top: 4px; }
@media (max-width: 700px) { .door__t { font-size: 42px; } .door__p { font-size: 17px; } }
.door__t { font-size: clamp(40px, 3.8vw, 56px); white-space: nowrap; }
@media (max-width: 1000px) { .door__t { font-size: 46px; } }
@media (max-width: 700px) { .door__t { font-size: 36px; } }
@media (max-width: 360px) { .door__t { font-size: 32px; } }

/* 24/10 · voyages de groupe : une carte par destination, les départs se déplient */
.dests { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 22px; }
.gdest .dc__media { min-height: 0; aspect-ratio: 16 / 10; }
.gdest .dc__media .tag { left: 14px; bottom: 14px; background: var(--paper); color: var(--choc); }
.gdest .dc__media .tag::before { background: var(--burnt); }
.gdest .dc__body { padding: 22px 22px 22px; }
.gdest .dc__title { font-size: 32px; margin: 0; }
.gdest .dc__hook { margin: 0; font-size: 16.5px; }
.gdest .dc__grid { font-size: 16px; gap: 10px 14px; }
.dest__toggle { margin-top: 6px; width: 100%; justify-content: space-between; padding-left: 22px; }
.dest__chev { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s; }
.dest__toggle[aria-expanded="true"] .dest__chev { transform: rotate(180deg); }
.dest__page { display: inline-flex; align-items: center; justify-content: center; gap: 10px; margin-top: 4px; padding: 8px 0 0; font-weight: 700; color: var(--burnt); text-decoration: none; }
.dest__page i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--clay); }
.dest__page svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.deps { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.dep { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px 10px; padding: 12px 14px; border-radius: 16px; background: var(--paper); border: 1px solid var(--line); }
.dep__when b { display: block; font-size: 16.5px; line-height: 1.25; color: var(--choc); }
.dep__when small { display: block; font-size: 13.5px; color: var(--ink-2); }
.dep__st { justify-self: end; padding: 4px 10px; border-radius: 99px; font: 700 12.5px/1.2 var(--sans); white-space: nowrap; }
.dep__st--open { background: var(--clay); color: var(--burnt); }
.dep__st--full { background: #ece6e4; color: #7d7173; }
.dep__st--soon { background: #fff; color: var(--ink-2); border: 1px dashed var(--clay-2); }
.dep__btn { grid-column: 1 / -1; width: 100%; min-height: 44px; font-size: 15.5px; justify-content: center; padding: 0 16px; }
.dep--full .dep__when b { color: #8d8285; text-decoration: line-through; text-decoration-thickness: 1px; }
@media (max-width: 1000px) {
  .dests { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
}
@media (max-width: 640px) {
  .gdest .dc__media { aspect-ratio: 16 / 9; }
  .gdest .dc__body { padding: 18px 18px 20px; }
  .gdest .dc__title { font-size: 28px; }
  .gdest .dc__hook { font-size: 15.5px; }
  .gdest .dc__grid { font-size: 15px; }
}
/* départs compacts : date et état à gauche, bouton à droite */
.dep { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "when btn" "st btn"; gap: 4px 12px; padding: 10px 10px 10px 14px; }
.dep__when { grid-area: when; }
.dep__st { grid-area: st; justify-self: start; }
.dep__btn { grid-area: btn; grid-column: auto; width: auto; min-height: 40px; padding: 0 16px; font-size: 14.5px; white-space: nowrap; }
.dep--full .dep__btn { padding: 0 12px; }
/* 24/10 · page voyage : bloc « Choisissez votre date » */
.depbox { max-width: 640px; margin: 0 auto; }
.depbox .dep { padding: 14px 14px 14px 18px; }
.depbox .dep__when b { font-size: 18px; }