/* ══════════════════════════════════════════════════════════════════════
   ToriTrip — sections de la page d'accueil
   Mobile d'abord. Paliers : 768 (tablette), 1024 (portable), 1280 (large).
   ══════════════════════════════════════════════════════════════════════ */

/* ── 01 · OUVERTURE ────────────────────────────────────────────── */
.tt-ouverture{display:grid;gap:clamp(1.75rem,4vw,3rem);align-items:center;}
.tt-ouverture-txt{display:flex;flex-direction:column;gap:1rem;min-width:0;}
.tt-h1{font-size:clamp(1.95rem,5.2vw,3.15rem);line-height:1.05;letter-spacing:-.025em;margin:0;}
.tt-ouverture-chapo{font-size:clamp(1rem,1.5vw,1.1rem);color:var(--tt-sumi-2);max-width:46ch;margin:0;}
.tt-reassurance{display:flex;flex-wrap:wrap;gap:.4em .75em;margin:.35rem 0 0;padding-top:.85rem;
  border-top:1px solid var(--tt-keisen);
  font-family:var(--tt-mono);font-size:.67rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tt-sumi-3);}
/* Trois colonnes sur grand écran : texte | carte | liste.
   .tt-carte passe en display:contents pour que ses deux enfants deviennent
   des éléments de CETTE grille. On évite ainsi deux grilles imbriquées dont
   les media queries, basées sur la fenêtre, ne connaissent pas la largeur
   réellement disponible — c'est ce qui écrasait la carte à 5 px. */
@media (min-width:1100px){
  .tt-ouverture{grid-template-columns:minmax(0,1fr) minmax(0,340px) minmax(220px,270px);}
  .tt-ouverture > .tt-carte{display:contents;}
}
@media (min-width:768px) and (max-width:1099px){
  .tt-ouverture > .tt-carte{display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);
    gap:clamp(1rem,3vw,2rem);align-items:start;}
}

/* ── 02 · DERNIERS ARTICLES ────────────────────────────────────── */
/* Un seul conteneur pour les trois blocs : c'est ce qui permet de réordonner
   sans toucher au HTML. Sur mobile, TikTok passe APRÈS le carrousel — les
   articles restent groupés au lieu d'être coupés en deux. */
/* min-width:0 est indispensable : par défaut un élément de grille ne peut pas
   devenir plus étroit que son contenu. La bande du carrousel imposait donc sa
   largeur intrinsèque à toute la grille — 950 px dans une fenêtre de 768,
   d'où un débordement horizontal de la page sur tablette. */
.tt-articles{display:grid;gap:var(--tt-gap);align-items:stretch;}
.tt-articles > *{min-width:0;}
.tt-articles > .tt-vedette{order:1;}
.tt-articles > .tt-carrousel-zone{order:2;margin-top:0;}
.tt-articles > .tt-tiktok{order:3;}
@media (min-width:1024px){
  .tt-articles{grid-template-columns:minmax(0,1fr) minmax(260px,320px);}
  .tt-articles > .tt-vedette{order:0;grid-column:1;grid-row:1;}
  .tt-articles > .tt-tiktok{order:0;grid-column:2;grid-row:1;}
  .tt-articles > .tt-carrousel-zone{order:0;grid-column:1 / -1;grid-row:2;}
}

.tt-vedette-lien{display:flex;flex-direction:column;gap:.6rem;text-decoration:none;color:inherit;height:100%;}
.tt-vedette-img{display:block;overflow:hidden;background:var(--tt-surface-2);}
.tt-vedette-img img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  transition:filter .2s ease;}
.tt-vedette-lien:hover .tt-vedette-img img{filter:brightness(.94);}
.tt-art-meta{font-family:var(--tt-mono);font-size:.67rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tt-sumi-3);}
.tt-vedette-titre{font-size:clamp(1.15rem,2.2vw,1.5rem);line-height:1.2;margin:0;
  transition:color .16s ease;}
.tt-vedette-lien:hover .tt-vedette-titre{color:var(--tt-shu);}
.tt-vedette-extrait{color:var(--tt-sumi-2);font-size:.93rem;line-height:1.55;}
.tt-vedette-cta{font-size:.87rem;font-weight:650;color:var(--tt-ai);margin-top:auto;padding-top:.4rem;}

/* TikTok */
.tt-tiktok{background:var(--tt-sumi);color:var(--tt-on-sumi);padding:clamp(1.25rem,3vw,1.6rem);
  display:flex;flex-direction:column;gap:1rem;justify-content:space-between;}
.tt-tk-l{font-family:var(--tt-mono);font-size:.65rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tt-on-sumi-3);margin:0;}
.tt-tk-n{font-family:var(--tt-display);font-weight:600;font-size:clamp(2.4rem,6vw,3rem);
  line-height:.95;letter-spacing:-.02em;margin:.15em 0;font-variant-numeric:tabular-nums;}
.tt-tk-n span{color:var(--tt-shu-clair);}
.tt-tk-p{color:var(--tt-on-sumi-2);font-size:.88rem;line-height:1.5;margin:0;}
@media (max-width:1023px){
  .tt-tiktok{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.5rem;align-items:center;}
  .tt-tiktok>:last-child{grid-column:2;}
}
@media (max-width:600px){
  .tt-tiktok{grid-template-columns:1fr;}
  .tt-tiktok>:last-child{grid-column:1;}
}

/* Carrousel — scroll-snap natif, aucune librairie */
.tt-carrousel-zone{margin-top:var(--tt-gap);position:relative;min-width:0;max-width:100%;}
.tt-carrousel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,1fr);
  max-width:100%;
  gap:var(--tt-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scroll-padding-inline:0;padding-bottom:.5rem;
  scrollbar-width:thin;scrollbar-color:var(--tt-keisen-2) transparent;}
.tt-carrousel::-webkit-scrollbar{height:3px;}
.tt-carrousel::-webkit-scrollbar-thumb{background:var(--tt-keisen-2);}
.tt-carte-art{scroll-snap-align:start;min-width:0;}
.tt-carte-art a{display:flex;flex-direction:column;gap:.5rem;text-decoration:none;color:inherit;}
.tt-carte-art-img{display:block;overflow:hidden;background:var(--tt-surface-2);}
.tt-carte-art-img img{display:block;width:100%;height:auto;aspect-ratio:5/3;object-fit:cover;
  transition:filter .2s ease;}
.tt-carte-art a:hover .tt-carte-art-img img{filter:brightness(.94);}
.tt-carte-art-titre{font-size:.95rem;line-height:1.25;margin:0;transition:color .16s ease;}
.tt-carte-art a:hover .tt-carte-art-titre{color:var(--tt-shu);}
.tt-carrousel-nav{display:flex;gap:.4rem;justify-content:flex-end;margin-top:.6rem;}
.tt-cnav{width:38px;height:38px;border:1px solid var(--tt-keisen-2);background:none;
  color:var(--tt-sumi-2);cursor:pointer;border-radius:var(--tt-radius);font-size:.95rem;
  transition:border-color .15s ease,color .15s ease;}
.tt-cnav:hover:not([disabled]){border-color:var(--tt-shu);color:var(--tt-shu);}
.tt-cnav[disabled]{opacity:.32;cursor:default;}
@media (max-width:767px){
  .tt-carrousel{grid-auto-columns:78%;}
  .tt-carrousel-nav{display:none;}     /* le geste tactile suffit */
}

/* ── 03 · SAISONS (fond encre) ─────────────────────────────────── */
.tt-saisons{display:grid;gap:0;border-top:1px solid var(--tt-keisen-sumi);margin-top:1.75rem;}
.tt-saison{border-bottom:1px solid var(--tt-keisen-sumi);}
.tt-saison-tete{cursor:pointer;list-style:none;display:flex;align-items:baseline;
  justify-content:space-between;gap:1rem;padding:.95rem 0;}
.tt-saison-tete::-webkit-details-marker{display:none;}
.tt-saison-tete::after{content:"+";font-family:var(--tt-mono);color:var(--tt-shu-clair);
  font-size:1.1rem;line-height:1;}
.tt-saison[open] .tt-saison-tete::after{content:"–";}
.tt-saison-nom{font-size:1.08rem;margin:0;display:flex;align-items:baseline;gap:.45em;color:var(--tt-on-sumi);}
.tt-saison-nom i{font-style:normal;font-size:.72rem;color:var(--tt-on-sumi-3);letter-spacing:.06em;}
.tt-saison-periode{font-family:var(--tt-mono);font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--tt-on-sumi-3);white-space:nowrap;}
.tt-saison-corps{margin:0;padding:0 0 1.1rem;display:flex;flex-direction:column;gap:.6rem;}
.tt-saison-corps dt{font-family:var(--tt-mono);font-size:.58rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tt-on-sumi-3);}
.tt-saison-corps dd{margin:0;font-size:.85rem;color:var(--tt-on-sumi-2);line-height:1.45;}
.tt-saison-fort{color:var(--tt-shu-clair)!important;font-weight:650;}
.tt-saisons-cta{margin:1.75rem 0 0;}

/* Au-delà de 768 px : quatre colonnes, panneaux toujours ouverts */
@media (min-width:768px){
  .tt-saisons{grid-template-columns:1fr 1fr;}
  .tt-saison{border-right:1px solid var(--tt-keisen-sumi);padding-right:1.25rem;}
  .tt-saison:nth-child(2n){border-right:none;padding-right:0;padding-left:1.25rem;}
  .tt-saison-tete{cursor:default;pointer-events:none;}
  .tt-saison-tete::after{content:"";}
}
@media (min-width:1024px){
  .tt-saisons{grid-template-columns:repeat(4,1fr);}
  .tt-saison{border-right:1px solid var(--tt-keisen-sumi);padding:0 1.1rem;border-bottom:none;}
  .tt-saison:first-child{padding-left:0;}
  .tt-saison:last-child{border-right:none;padding-right:0;}
  .tt-saison:nth-child(2n){padding-left:1.1rem;}
  .tt-saison-tete{flex-direction:column;align-items:flex-start;gap:.2rem;}
}

/* ── 04 · BUDGET ───────────────────────────────────────────────── */
.tt-budget{display:grid;gap:clamp(1.5rem,3.5vw,2.5rem);align-items:center;}
.tt-budget > *{min-width:0;}
@media (min-width:1024px){ .tt-budget{grid-template-columns:1fr 1fr;} }

.tt-carnet{display:block;position:relative;background:var(--tt-surface);
  border:1px solid var(--tt-keisen-2);padding:1.25rem 1.4rem 1.1rem;
  text-decoration:none;color:inherit;transition:border-color .18s ease;}
.tt-carnet:hover{border-color:var(--tt-shu);}
.tt-carnet-tampon{position:absolute;top:.9rem;right:1.1rem;width:44px;height:44px;
  border:2px solid var(--tt-shu);color:var(--tt-shu);display:flex;align-items:center;
  justify-content:center;font-family:var(--tt-display);font-size:1.05rem;font-weight:600;
  transform:rotate(-7deg);opacity:.9;}
.tt-carnet-tete{display:block;font-family:var(--tt-mono);font-size:.63rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--tt-or);padding-bottom:.75rem;
  border-bottom:1px dashed var(--tt-keisen-2);}
.tt-sc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.1rem .9rem;
  align-items:baseline;padding:.8rem 0;border-bottom:1px solid var(--tt-keisen);}
.tt-carnet .tt-sc:last-of-type{border-bottom:none;padding-bottom:0;}
.tt-sc-l{font-size:.85rem;font-weight:650;}
.tt-sc-v{font-family:var(--tt-display);font-weight:600;font-size:1.42rem;
  grid-row:1/3;align-self:center;
  white-space:nowrap;}   /* « 1 850 € » ne doit jamais se couper */
.tt-sc-d{font-size:.72rem;color:var(--tt-sumi-3);grid-column:1;}
.tt-sc-j{font-family:var(--tt-mono);font-size:.63rem;color:var(--tt-sumi-3);
  grid-row:2;text-align:right;white-space:nowrap;}
/* Sous 420 px, le montant passe sous le libellé plutôt que d'être comprimé. */
@media (max-width:420px){
  .tt-sc{grid-template-columns:1fr;gap:.15rem;}
  .tt-sc-v{grid-row:auto;font-size:1.55rem;}
  .tt-sc-d{grid-column:auto;}
  .tt-sc-j{grid-row:auto;text-align:left;}
}
.tt-budget-note{font-size:.8rem;color:var(--tt-sumi-3);margin:.75rem 0 0;}

/* ── 05 · ITINÉRAIRE ───────────────────────────────────────────── */
.tt-itin-diag{margin:1.5rem 0;}
.tt-rt{width:100%;height:auto;display:block;}
.tt-rt-ligne{stroke:var(--tt-keisen-2);stroke-width:2;fill:none;stroke-linecap:round;}
.tt-rt-n{fill:var(--tt-surface);stroke:var(--tt-sumi);stroke-width:2;}
.tt-rt-n.is-bout{fill:var(--tt-shu);stroke:var(--tt-shu);}
.tt-rt-lib{font-family:var(--tt-display);font-weight:600;font-size:13px;
  fill:var(--tt-sumi);text-anchor:middle;}
.tt-rt-sub{font-family:var(--tt-mono);font-size:8.5px;letter-spacing:.09em;
  fill:var(--tt-sumi-3);text-anchor:middle;text-transform:uppercase;}
.tt-rt-lib--v,.tt-rt-sub--v{text-anchor:start;}
.tt-rt--v{display:block;max-width:320px;}
.tt-rt--h{display:none;}
@media (min-width:768px){ .tt-rt--v{display:none;} .tt-rt--h{display:block;} }
@media (max-width:899px) and (min-width:768px){ .tt-rt--h .tt-rt-sub:last-of-type{display:none;} }

/* ── 06 · EBOOK (fond encre) ───────────────────────────────────── */
.tt-ebook{display:grid;gap:clamp(1.5rem,4vw,2.75rem);align-items:center;}
.tt-ebook > *{min-width:0;}
@media (min-width:768px){ .tt-ebook{grid-template-columns:minmax(160px,240px) minmax(0,1fr);align-items:start;} }
.tt-ebook-cover{max-width:240px;margin-inline:auto;}
.tt-ebook-cover a{display:block;transition:transform .2s ease;}
.tt-ebook-cover a:hover{transform:translateY(-3px);}
.tt-ebook-cover img{display:block;width:100%;height:auto;
  box-shadow:0 12px 32px -14px rgba(0,0,0,.55);}
.tt-ebook-cover-vide{display:flex;align-items:center;justify-content:center;text-align:center;
  aspect-ratio:1/1.414;background:var(--tt-keisen-sumi);color:var(--tt-on-sumi-3);
  font-family:var(--tt-mono);font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;padding:1rem;line-height:1.6;}
.tt-ebook-txt{display:flex;flex-direction:column;gap:.85rem;min-width:0;}
.tt-ebook-accroche{color:var(--tt-on-sumi-2);font-size:.98rem;max-width:56ch;margin:0;}
.tt-ebook-liste{list-style:none;margin:.4rem 0 0;padding:0;display:grid;gap:.55rem;}
@media (min-width:900px){ .tt-ebook-liste{grid-template-columns:1fr 1fr;column-gap:1.75rem;} }
.tt-ebook-liste li{font-size:.87rem;color:var(--tt-on-sumi-2);line-height:1.45;
  padding-left:1rem;position:relative;}
.tt-ebook-liste li::before{content:"—";position:absolute;left:0;color:var(--tt-shu-clair);}
.tt-ebook-liste strong{color:var(--tt-on-sumi);font-weight:650;}
.tt-ebook-pied{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;
  padding-top:.9rem;margin-top:.4rem;border-top:1px solid var(--tt-keisen-sumi);}
.tt-ebook-prix{font-family:var(--tt-display);font-weight:600;font-size:2.1rem;
  letter-spacing:-.02em;margin:0;color:var(--tt-on-sumi);}

/* ── 07 · BONNES ADRESSES ──────────────────────────────────────── */
.tt-adresses{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:.75rem;max-width:100%;}
.tt-adresses > *{min-width:0;}
@media (min-width:768px){ .tt-adresses{grid-template-columns:repeat(6,1fr);} }
.tt-adr{min-width:0;display:flex;}   /* la carte est un conteneur : son enfant
      s'étire par flex plutôt que par height:100%, qui se résout mal dans une
      case de grille dont la hauteur est elle-même déduite du contenu — c'est
      ce qui faisait déborder les cartes de 34 px sur la rangée suivante. */
@media (min-width:768px){
  .tt-adr{grid-column:span 2;}
  .tt-adr--nara{grid-column:span 2;}
  .tt-adr--japon{grid-column:span 4;}
}
.tt-adr-lien{display:flex;flex-direction:column;justify-content:space-between;gap:.7rem;
  flex:1 1 auto;min-height:142px;padding:1rem .95rem;border:1px solid var(--tt-keisen);
  background:var(--tt-surface);text-decoration:none;color:inherit;
  background-image:var(--tt-adr-img,none);background-size:cover;background-position:center;
  transition:border-color .16s ease,transform .16s ease;}
a.tt-adr-lien:hover{border-color:var(--tt-shu);transform:translateY(-2px);}
.tt-adr.has-img .tt-adr-lien{position:relative;color:#fff;}
.tt-adr.has-img .tt-adr-lien::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(22,35,58,.25),rgba(22,35,58,.82));}
.tt-adr.has-img .tt-adr-corps,.tt-adr.has-img .tt-adr-badge{position:relative;}
.tt-adr-corps{display:flex;flex-direction:column;gap:.3rem;}
.tt-adr-nom{font-size:1.08rem;margin:0;display:flex;align-items:baseline;gap:.45em;}
.tt-adr-nom i{font-style:normal;font-size:.72rem;color:var(--tt-sumi-3);}
.tt-adr.has-img .tt-adr-nom i{color:rgba(255,255,255,.7);}
.tt-adr-desc{font-size:.78rem;color:var(--tt-sumi-3);line-height:1.4;}
.tt-adr.has-img .tt-adr-desc{color:rgba(255,255,255,.85);}
.tt-adr-fleche{color:var(--tt-keisen-2);align-self:flex-start;transition:color .14s ease,transform .14s ease;}
a.tt-adr-lien:hover .tt-adr-fleche{color:var(--tt-shu);transform:translateX(3px);}
.tt-adr-badge{align-self:flex-start;font-family:var(--tt-mono);font-size:.58rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--tt-or);
  border:1px solid var(--tt-or);padding:.15rem .4rem;}
.tt-adr.is-attente .tt-adr-lien{background-color:var(--tt-paper);}
.tt-adresses-cta{margin:1.25rem 0 0;}
@media (max-width:767px){
  /* overflow-y doit être déclaré explicitement : dès qu'un axe vaut autre chose
     que « visible », l'autre est calculé à « auto » par la spécification CSS.
     Sans cette ligne, la bande défile aussi verticalement et masque le badge. */
  .tt-adresses{grid-auto-flow:column;grid-auto-columns:78%;
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;padding-bottom:.5rem;}
  .tt-adr{scroll-snap-align:start;}
}

/* ── 08 · NEWSLETTER ───────────────────────────────────────────── */
.tt-newsletter{max-width:660px;margin-inline:auto;text-align:center;
  border-top:1px solid var(--tt-keisen);border-bottom:1px solid var(--tt-keisen);
  padding-block:clamp(1.75rem,4vw,2.5rem);}
.tt-newsletter .tt-section-chapo{margin-inline:auto;}
.tt-newsletter-form{margin-top:1.35rem;}

/* MailPoet impose ses polices aux champs par un attribut style= en ligne, qui
   bat toute feuille externe : Cormorant sur le champ e-mail, Montserrat sur le
   bouton. Deux fichiers TTF de 371 et 323 Ko — 694 Ko téléchargés pour deux
   champs de formulaire. Le !important est ici justifié : c'est le seul moyen
   de l'emporter sur un style en ligne sans modifier le formulaire. */
.tt-newsletter-form .mailpoet_form *,
.tt-newsletter-form .mailpoet_text,
.tt-newsletter-form input[type=email],
.tt-newsletter-form input[type=text],
.tt-newsletter-form input[type=submit],
.tt-newsletter-form button{font-family:inherit!important;}

/* Le formulaire MailPoet porte son propre titre et sa propre description.
   Ils font doublon avec le H2 et l'accroche de la section, et ne mentionnent
   pas la promesse d'extrait. On les masque en CSS — le formulaire, ses champs
   et son traitement restent strictement intacts.
   Pour les réafficher : supprimer cette règle et retirer titre/accroche de
   inc/config.php. */
.tt-newsletter-form .mailpoet_form_columns{display:none;}

.tt-newsletter-form .mailpoet_form{padding:0!important;background:none!important;}
.tt-newsletter-form .mailpoet_paragraph{margin:0 0 .6rem;}
.tt-newsletter-form .mailpoet_text,
.tt-newsletter-form input[type=email]{width:100%;padding:.78em .95em;
  border:1px solid var(--tt-keisen-2);border-radius:var(--tt-radius);
  background:var(--tt-surface);color:var(--tt-sumi);font-size:.95rem;
  font-family:inherit;line-height:1.3;}
.tt-newsletter-form .mailpoet_text:focus{outline:2px solid var(--tt-shu);outline-offset:2px;}
.tt-newsletter-form input[type=submit]{width:100%;padding:.8em 1.5em;
  border:1px solid var(--tt-ai);background:var(--tt-ai);color:#fff;
  font-weight:650;font-size:.9rem;font-family:inherit;
  border-radius:var(--tt-radius);cursor:pointer;transition:background .16s ease;}
.tt-newsletter-form input[type=submit]:hover{background:var(--tt-ai-dark);}
.tt-newsletter-form .mailpoet_validate_success{color:#2C6B50;}
.tt-newsletter-form .mailpoet_validate_error{color:var(--tt-shu);}
.tt-newsletter-rgpd{font-size:.75rem;color:var(--tt-sumi-3);margin:1rem 0 0;}

/* Champ et bouton en ligne dès qu'il y a la place */
@media (min-width:560px){
  .tt-newsletter-form form.mailpoet_form_form{
    display:flex;flex-wrap:wrap;gap:.55rem;align-items:flex-start;
    justify-content:center;
  }
  /* MailPoet marque le paragraphe du bouton avec la classe .last — et non
     :last-of-type, que .mailpoet_message vient occuper. */
  .tt-newsletter-form .mailpoet_paragraph{flex:1 1 260px;margin:0;}
  .tt-newsletter-form .mailpoet_paragraph.last{flex:0 0 auto;}
  .tt-newsletter-form .mailpoet_message{flex:1 0 100%;margin:0;}
  .tt-newsletter-form input[type=submit]{width:auto;white-space:nowrap;}
}