/* Travel2World — l'accompagnement en éventail de 3 cartes (version du 16 octobre 2026). Voir accomp.js.
   Les cartes se chevauchent comme les 6 guides du pack ; la formule choisie passe devant, son contenu s'affiche dessous.
   Aucune animation tant qu'on ne touche à rien ; « Réduire les animations » respecté. */
#of-accompagnement{scroll-margin-top:90px}
@media (max-width:760px){#of-accompagnement{scroll-margin-top:70px}}
html.lenis #of-accompagnement{scroll-margin-top:0}
#app .acc{--w:212px;--h:282px;--dx:172px;--ang:7deg;--acc-ok:#2d7a4f;margin-top:6px}

/* ---------- l'éventail ---------- */
#app .acc-fan{position:relative;height:calc(var(--h) + 58px);margin:0 auto;max-width:720px;-webkit-tap-highlight-color:transparent}
#app .acc-card{--c:#1f5f7a;--frame:rgba(255,255,255,.26);--tag:rgba(255,255,255,.82);
  position:absolute;left:50%;bottom:18px;width:var(--w);height:var(--h);margin:0 0 0 calc(var(--w) / -2);padding:20px 20px 18px;
  display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:6px;
  border:0;border-radius:18px;background:var(--c);color:#fff;cursor:pointer;font:inherit;overflow:hidden;
  background-image:radial-gradient(130% 90% at 0% 0%,rgba(255,255,255,.17),rgba(255,255,255,0) 58%),linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.16));
  box-shadow:0 1px 2px rgba(15,27,42,.2),0 12px 28px rgba(15,27,42,.2);
  transform-origin:50% 100%;
  transform:translateX(calc(var(--pos) * var(--dx))) rotate(calc(var(--pos) * var(--ang))) translateY(calc(var(--pos) * var(--pos) * 12px));
  z-index:calc(2 - var(--pos) * var(--pos));
  transition:transform .55s cubic-bezier(.2,.85,.25,1.1),box-shadow .35s ease,filter .35s ease}
#app .acc-card[data-plan=depart]{--c:#c94d23}
#app .acc-card[data-plan=premium]{--c:#0f1b2a;--frame:rgba(242,179,61,.55);--tag:#f2b33d}
/* filet intérieur, comme une carte de membre */
#app .acc-card:before{content:"";position:absolute;inset:8px;border:1px solid var(--frame);border-radius:12px;pointer-events:none}
/* reflet qui passe sur la carte quand on la choisit (classe posée par accomp.js) */
#app .acc-card:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(105deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 65%) no-repeat;background-size:250% 100%;background-position:130% 0}
#app .acc-card[aria-checked=false]{filter:saturate(.82) brightness(.94)}
#app .acc-card[aria-checked=true]{z-index:4;transform:translateX(calc(var(--pos) * var(--dx))) rotate(calc(var(--pos) * var(--ang) * .3)) translateY(-14px) scale(1.04);
  box-shadow:0 2px 4px rgba(15,27,42,.22),0 22px 44px rgba(15,27,42,.3)}
#app .acc-card:focus{outline:none}
#app .acc-card:focus-visible{outline:3px solid var(--orange,#c94d23);outline-offset:4px}
#app .acc-card>span{position:relative;z-index:1}
/* carte de droite : textes calés à droite, la partie visible quand la carte du milieu la recouvre */
#app .acc-card.acc-d{align-items:flex-end;text-align:right}
#app .acc-card.acc-d .acc-card-ok{right:auto;left:14px}
/* cartes du bord : les textes restent dans la partie que la carte du milieu ne couvre pas */
#app .acc-card:is(.acc-g,.acc-d)[aria-checked=false]>span:not(.acc-card-ok){max-width:calc(var(--dx) - 22px)}
#app .acc-card-tag{font:600 .64rem/1.2 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--tag)}
#app .acc-card-nom{font:700 1.6rem/1.08 "Playfair Display",Georgia,serif;letter-spacing:-.01em;color:#fff;max-width:9ch}
#app .acc-card-bas{margin-top:auto;display:grid;gap:4px}
#app .acc-card-bas .acc-price{font-size:2.15rem;line-height:1;color:#fff}
#app .acc-card[data-plan=premium] .acc-card-bas .acc-price{color:#f6c768}
#app .acc-card-bas small{font:500 .76rem/1.2 var(--f-body);color:rgba(255,255,255,.82)}
#app .acc-card-ok{position:absolute!important;top:16px;right:14px;display:none;align-items:center;gap:4px;padding:4px 8px 4px 6px;border-radius:999px;background:#fff;color:var(--acc-ok);font:700 .62rem/1 var(--f-body)}
#app .acc-card-ok svg,#app .acc-buy-ok svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#app .acc:has(.acc-buy[data-buy="accompagnement:decouverte"].in-cart) .acc-card[data-plan=decouverte] .acc-card-ok,
#app .acc:has(.acc-buy[data-buy="accompagnement:depart"].in-cart) .acc-card[data-plan=depart] .acc-card-ok,
#app .acc:has(.acc-buy[data-buy="accompagnement:premium"].in-cart) .acc-card[data-plan=premium] .acc-card-ok{display:inline-flex}
#app .acc:has(.acc-buy.in-cart) .acc-card .acc-card-tag{max-width:calc(100% - 92px)}
@media (hover:hover) and (pointer:fine){
  #app .acc-card[aria-checked=false]:hover{filter:none;transform:translateX(calc(var(--pos) * var(--dx))) rotate(calc(var(--pos) * var(--ang))) translateY(calc(var(--pos) * var(--pos) * 12px - 10px))}
}
html[data-theme=dark] #app .acc-card{box-shadow:0 1px 2px rgba(0,0,0,.4),0 12px 28px rgba(0,0,0,.4)}
html[data-theme=dark] #app .acc-card[data-plan=premium]{--c:#1c2a44}
html[data-theme=dark] #app .acc-card[aria-checked=true]{box-shadow:0 2px 4px rgba(0,0,0,.45),0 22px 44px rgba(0,0,0,.55)}

/* ---------- le contenu de la formule choisie ---------- */
#app .acc-panels{--sel:0;position:relative;max-width:760px;margin:0 auto}
#app .acc:has(.acc-card[data-plan=decouverte][aria-checked=true]) .acc-panels{--sel:-1}
#app .acc:has(.acc-card[data-plan=premium][aria-checked=true]) .acc-panels{--sel:1}
/* petite pointe qui relie le contenu à la carte choisie */
#app .acc-panels:before{content:"";position:absolute;z-index:1;top:-8px;left:calc(50% + var(--sel) * var(--dx) - 8px);width:16px;height:16px;transform:rotate(45deg);
  background:var(--surface,#fff);border-left:1px solid var(--line,#e5e7eb);border-top:1px solid var(--line,#e5e7eb);border-radius:3px 0 0 0;transition:left .45s cubic-bezier(.2,.85,.25,1)}
#app .acc-panel{display:grid;gap:22px;padding:28px 32px 26px;border:1px solid var(--line,#e5e7eb);border-radius:18px;background:var(--surface,#fff);color:var(--ink,#0f1b2a);box-shadow:0 1px 2px rgba(15,27,42,.05)}
#app .acc-panel:not(.is-on){display:none}
#app .acc-panel-tag{margin:0 0 4px;font:600 .7rem/1.2 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--orange-ink,#a83b17)}
#app .acc-panel h3{margin:0 0 16px;font-family:"Playfair Display",Georgia,serif!important;font-weight:700;font-size:clamp(1.6rem,1.2rem + 1.2vw,2rem);line-height:1.1;letter-spacing:-.01em}
#app .acc-inclus{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px}
#app .acc-inclus li{display:flex;gap:10px;align-items:flex-start;margin:0;font-size:.95rem;line-height:1.45}
#app .acc-inclus svg{flex:none;width:20px;height:20px;margin-top:1px;padding:3px;border-radius:50%;background:var(--tp-tint,#fdf1ec);fill:none;stroke:var(--orange,#c94d23);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;box-sizing:border-box}
#app .acc-herite{margin:18px 0 0;padding:14px 16px;border-radius:12px;background:var(--soft,#f6f7f9)}
#app .acc-herite p{margin:0 0 6px;font:600 .74rem/1.2 var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#556070)}
#app .acc-herite ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 28px;font-size:.88rem;line-height:1.45;color:var(--muted,#556070)}
#app .acc-herite li{position:relative;margin:0;padding-left:14px}
#app .acc-herite li:before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--line-strong,#d1d5db)}

/* achat */
#app .acc-achat{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;padding-top:20px;border-top:1px solid var(--line,#e5e7eb)}
#app .acc-achat>.acc-price{display:none}
#app .acc-buy{display:inline-flex;align-items:center;gap:14px;min-height:52px;min-width:300px;padding:10px 12px 10px 22px;border:0;border-radius:12px;cursor:pointer;
  background:#c94d23;color:#fff;font:600 1rem/1.1 var(--f-body);transition:background-color .2s ease,transform .2s ease}
#app .acc-buy .acc-price{margin-left:auto;padding:6px 12px;border-radius:8px;background:rgba(255,255,255,.16);font-size:1.3rem;line-height:1;color:#fff}
#app .acc-buy:hover{background:#b3421c}
#app .acc-buy:active{transform:translateY(1px)}
#app .acc-buy:focus-visible{outline:3px solid var(--ink,#0f1b2a);outline-offset:3px}
#app .acc-buy-ok{display:none;align-items:center;gap:8px}
#app .acc-buy.in-cart{background:var(--acc-ok)}
#app .acc-buy.in-cart .acc-buy-l{display:none}
#app .acc-buy.in-cart .acc-buy-ok{display:inline-flex}
#app .acc-buy-ok svg{width:16px;height:16px}
#app .acc-fine{display:flex;align-items:center;gap:6px;margin:0;font-size:.78rem;line-height:1.4;color:var(--muted,#556070)}
#app .acc-fine svg{flex:none;width:13px;height:13px;fill:currentColor;opacity:.8}

/* note réseau */
#app .acc-net{margin:20px auto 0;max-width:760px;font-size:.86rem;color:var(--muted,#556070);line-height:1.55}
#app .acc-net a{color:var(--ink,#0f1b2a);font-weight:600;text-decoration-color:var(--orange,#c94d23);text-underline-offset:3px}

/* ---------- mouvements (seulement quand on choisit une formule) ---------- */
@media (prefers-reduced-motion:no-preference){
  #app .acc-card.acc-pose:after{animation:acc-reflet .75s cubic-bezier(.3,.6,.3,1) .12s both}
  #app .acc-panel.acc-entre .acc-panel-corps>*,#app .acc-panel.acc-entre .acc-achat{animation:acc-monte .42s cubic-bezier(.2,.8,.2,1) both}
  #app .acc-panel.acc-entre .acc-panel-corps>:nth-child(2){animation-delay:.03s}
  #app .acc-panel.acc-entre .acc-panel-corps>:nth-child(3){animation-delay:.07s}
  #app .acc-panel.acc-entre .acc-panel-corps>:nth-child(4){animation-delay:.11s}
  #app .acc-panel.acc-entre .acc-achat{animation-delay:.14s}
}
@keyframes acc-reflet{0%{opacity:1;background-position:130% 0}100%{opacity:1;background-position:-30% 0}}
@keyframes acc-monte{from{opacity:0;transform:translateY(10px)}}
@media (prefers-reduced-motion:reduce){
  #app .acc-card,#app .acc-panels:before,#app .acc-buy{transition:none}
}

/* ---------- téléphone ---------- */
@media (max-width:760px){
  #app .acc{--w:140px;--h:192px;--dx:93px;--ang:7deg}
  #app .acc-fan{height:calc(var(--h) + 46px)}
  #app .acc-card{padding:14px 13px 13px;border-radius:14px;gap:4px}
  #app .acc-card:before{inset:6px;border-radius:9px}
  #app .acc-card-tag{font-size:.56rem;letter-spacing:.1em}
  #app .acc-card-nom{font-size:1.06rem}
  #app .acc-card-bas .acc-price{font-size:1.6rem}
  #app .acc-card-bas small{font-size:.68rem}
  #app .acc-card-ok{top:auto;bottom:12px;right:10px;padding:4px;font-size:0;gap:0}
  #app .acc-card.acc-d .acc-card-ok{left:10px}
  #app .acc-card-ok svg{width:12px;height:12px}
  #app .acc:has(.acc-buy.in-cart) .acc-card .acc-card-tag{max-width:none}
  #app .acc-panel{padding:22px 18px 20px;gap:18px;border-radius:16px}
  #app .acc-inclus,#app .acc-herite ul{grid-template-columns:1fr;gap:10px}
  #app .acc-herite ul{gap:4px}
  #app .acc-inclus li{font-size:.92rem}
  #app .acc-achat{display:grid;gap:10px}
  #app .acc-buy{width:100%;min-width:0}
  #app .acc-fine{justify-content:center;text-align:center}
}
@media (max-width:360px){#app .acc{--w:128px;--h:180px;--dx:88px}}

/* /offres — « Les 6 guides » en éventail (offres.js → window.T2W_offresPack + eventail.js), 16/10/2026.
   (offres.css n'est chargé par aucune page : le style du pack vit ici, accomp.css est sur toutes les pages.) */
#app .of-guides>.of-pack{grid-column:1/-1}
#app .of-pack{display:grid;gap:clamp(8px,1.5vw,16px);padding:clamp(20px,3vw,32px);border:1px solid var(--orange,#c94d23);border-radius:16px;background:var(--surface,#fff);color:var(--ink,#0f1b2a)}
#app .of-pack-tete small{display:block;margin:0 0 4px;font:700 .72rem/1.2 var(--f-body,inherit);letter-spacing:.12em;color:var(--muted,#556070)}
#app .of-pack-tete h3{margin:0 0 6px;font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.1;color:var(--ink,#0f1b2a)}
#app .of-pack-tete p{margin:0;max-width:62ch;color:var(--muted,#556070);font-size:.95rem;line-height:1.5}
#app .of-pack .ev{--ev-ink:var(--ink,#0f1b2a);--ev-muted:var(--muted,#556070)}
#app .of-pack .gd-buy{width:100%;max-width:360px;margin-top:4px}
#app .of-pack .gd-secure{justify-content:flex-start;margin:0;color:var(--muted,#556070)}
@media (max-width:760px){#app .of-pack .gd-buy{max-width:none}}

/* ---------- Les 3 formules en passeports (17/10) : Japon · France (au milieu) · Australie ----------
   couleur de couverture, dos relié à gauche, dorure ; emblème générique, pas de blason officiel */
#app .acc-card[data-plan=decouverte]{--c:#9b1c2c;--frame:rgba(217,180,91,.45);--tag:#e6c77d}
#app .acc-card[data-plan=depart]{--c:#5b1726;--frame:rgba(217,180,91,.5);--tag:#e6c77d}
#app .acc-card[data-plan=premium]{--c:#14284a;--frame:rgba(217,180,91,.55);--tag:#e6c77d}
#app .acc-card{background-image:linear-gradient(90deg,rgba(0,0,0,.28) 0,rgba(0,0,0,.08) 9px,rgba(255,255,255,.06) 10px,rgba(0,0,0,0) 14px),radial-gradient(120% 90% at 30% 0%,rgba(255,255,255,.10),rgba(255,255,255,0) 60%);border-radius:10px 14px 14px 10px}
#app .acc-card:before{border-color:var(--frame);border-style:solid;inset:10px 10px 10px 16px;border-radius:8px}
#app .acc-pp{display:grid;justify-items:center;gap:2px;margin:2px 0 6px;width:100%;color:#d9b45b}
#app .acc-card.acc-d .acc-pp,#app .acc-card.acc-g .acc-pp{justify-items:center}
#app .acc-pp-titre{font:700 .62rem/1 var(--f-body,Inter),sans-serif;letter-spacing:.32em;text-transform:uppercase;font-style:normal}
#app .acc-pp-pays{font:700 1rem/1.1 "Playfair Display",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:#e6c77d}
#app .acc-pp-emb{width:46px;height:46px;margin:6px 0 2px;fill:none;stroke:#d9b45b;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 0 rgba(0,0,0,.25))}
#app .acc-pp-emb .acc-pp-avion{fill:#d9b45b;stroke:none}
#app .acc-pp-puce{width:26px;height:18px;fill:none;stroke:#d9b45b;stroke-width:1.4;opacity:.85}
#app .acc-card-tag{color:#e6c77d}
#app .acc-card-nom{color:#f6efe0}
#app .acc-card-bas .acc-price,#app .acc-card[data-plan=premium] .acc-card-bas .acc-price{color:#f0d391}
#app .acc-card-bas small{color:rgba(246,239,224,.8)}
html[data-theme=dark] #app .acc-card[data-plan=premium]{--c:#1a3160}
@media (max-width:760px){#app .acc-pp-emb{width:30px;height:30px;margin:3px 0 0}#app .acc-pp-pays{font-size:.74rem;letter-spacing:.08em}#app .acc-pp-titre{font-size:.5rem;letter-spacing:.2em}#app .acc-pp-puce{display:none}}

/* ---------- passeports : texte toujours à l'intérieur du cadre doré (17/10) ----------
   le cadre est à 10/16 px du bord : le contenu commence 12 px plus loin, et rien ne déborde */
#app .acc-card{padding:24px 24px 22px 30px}
#app .acc-card>span{max-width:100%;min-width:0;overflow-wrap:normal;word-break:keep-all;hyphens:none}
#app .acc-pp{margin-bottom:4px}
#app .acc-pp-pays{max-width:100%}
#app .acc-card-bas{padding-bottom:2px}
@media (max-width:760px){
  #app .acc-card:before{inset:7px 7px 7px 12px}
  #app .acc-card{padding:16px 14px 14px 19px;gap:3px}
  #app .acc-pp-titre{font-size:.44rem;letter-spacing:.16em}
  #app .acc-pp-pays{font-size:.62rem;letter-spacing:.06em}
  #app .acc-pp-emb{width:24px;height:24px;margin:2px 0 0}
  #app .acc-card-tag{font-size:.5rem;letter-spacing:.06em}
  #app .acc-card-nom{font-size:.9rem;max-width:100%}
  #app .acc-card-bas .acc-price{font-size:1.3rem}
  #app .acc-card-bas small{font-size:.58rem}
  /* passeports de côté (en partie cachés derrière celui du milieu) : seulement la couverture, le nom et le prix,
     dans la bande qui reste visible */
  #app .acc-card:is(.acc-g,.acc-d)[aria-checked=false] .acc-card-tag,
  #app .acc-card:is(.acc-g,.acc-d)[aria-checked=false] .acc-card-bas small{display:none}
  #app .acc-card:is(.acc-g,.acc-d)[aria-checked=false]>span:not(.acc-card-ok){max-width:calc(var(--dx) - 24px)}
  #app .acc-card:is(.acc-g,.acc-d)[aria-checked=false] .acc-card-nom{font-size:.66rem;white-space:nowrap}
  #app .acc-card:is(.acc-g,.acc-d)[aria-checked=false] .acc-card-bas .acc-price{font-size:1.1rem}
}