/* Design des pages ville, d'après la maquette Lyon validée par Florian le 2026-10-15
   (https://claude.ai/artifact/1o9dF5R3S6RpCs7y1868iv, source villes-design/maquette-lyon.src.html).

   Servie par l'extension FF Design, à la fin du <head>, sur les seules pages dont le contenu porte la classe
   ffd-design (posée sur la rangée de tête par outils-villes/design-lyon.py). Tout reste sous #page-content,
   pour l'emporter sur le thème et sur le bloc ffv-style de la page, qui reste.
   Les deux fichiers Instrument Serif (sous-ensemble latin de Google Fonts, licence OFL) sont dans polices/.
   design-villes.js, servi sur les mêmes pages, pose les flèches des avis : leurs styles sont ici.

   Taille du texte : celle du thème (1rem, soit 20 px sur ordinateur et 18 px sous 600 px), comme sur les pages ville
   d'avant le design. La maquette était à 16 px pour une colonne de 760 px ; en ligne, sur 1200 px, Florian l'a trouvée
   « très petite par rapport à ce qu'on avait initialement » (2026-10-15). Le texte courant est donc en em, les boutons en
   rem, les titres en Instrument Serif ; les étiquettes et les pastilles gardent leur taille. */

@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(polices/instrument-serif-regular.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(polices/instrument-serif-italic.woff2) format("woff2")}

#page-content{
  --ffd-fond:#0f0e17;--ffd-surface:#1c1c21;--ffd-surface2:#26262d;--ffd-bord:#3a3a44;
  --ffd-texte:#fffffe;--ffd-doux:#c9cbd6;--ffd-gris:#9a9aa5;
  --ffd-rose:#ff3363;--ffd-rose-pale:rgba(255,51,99,.14);
  --ffd-turq:#4ECDC4;--ffd-turq-pale:rgba(78,205,196,.13);--ffd-dore:#EDB88B;
  --ffd-titre:"Instrument Serif","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --ffd-corps:system-ui,-apple-system,"Segoe UI",Roboto,Tahoma,sans-serif;
  background:var(--ffd-fond);color:var(--ffd-texte);font-family:var(--ffd-corps);font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased
}

/* Sections : la largeur du site réglée dans Impreza (--site-content-width, 1200 px), sans image de fond ni voile.
   Florian, 2026-10-15, sur la colonne de 760 px de la maquette : « un poil plus large et moins de marge sur les côtés ».
   Les paragraphes d'intro et de « Ce qu'il faut savoir » gardent leur largeur de lecture (56ch, 62ch).
   Le padding-top du .l-section-h de la première section porte la hauteur de l'en-tête fixe : on n'y touche pas. */
#page-content .l-section{--padding-inline:16px;padding:64px 16px 0;background:var(--ffd-fond)}
#page-content .l-section:first-of-type{padding-top:16px}
#page-content .l-section:last-of-type{padding-bottom:56px}
#page-content .l-section-h{max-width:var(--site-content-width,1200px)}
#page-content .l-section .l-section.wpb_row{padding:0;background:none}
#page-content .l-section-img,#page-content .l-section-overlay,#page-content .w-separator{display:none!important}
#page-content .vc_column-inner{display:flex;flex-direction:column;gap:16px;padding:0}
#page-content .l-section:first-of-type .vc_column-inner{display:block}

/* Texte courant */
#page-content .wpb_text_column p{margin:0}
#page-content .wpb_text_column p + p{margin-top:14px}
#page-content strong{color:var(--ffd-texte);font-weight:600}
#page-content .wpb_text_column a{color:var(--ffd-turq);text-underline-offset:3px}
#page-content .strong-white-without-bold{background:none;padding:0;border-radius:0;color:inherit}

/* Titres : serif, à gauche ; la seconde ligne en italique (dorée dans un H2) */
#page-content h1.w-text,#page-content h2.w-text{font-family:var(--ffd-titre);font-weight:400;text-align:left!important;text-wrap:balance;color:var(--ffd-texte);padding:0}
#page-content h1.w-text{font-size:clamp(40px,10vw,62px);line-height:1.02;letter-spacing:-.01em;margin:20px 0 12px}
#page-content h2.w-text{font-size:clamp(32px,7.6vw,44px);line-height:1.06;letter-spacing:-.005em;margin:0}
#page-content h1 .ffv-sous{font-style:italic}
#page-content h2 .ffv-sous{font-style:italic;color:var(--ffd-dore)}
#page-content p.ffv-accroche{font-family:var(--ffd-titre);font-style:italic;font-size:clamp(22px,5.4vw,28px)!important;line-height:1.2!important;color:var(--ffd-doux);text-align:left;max-width:none;margin:0 0 22px!important;padding:0}
#page-content p.ffv-accroche em{white-space:nowrap}

/* En-tête : pastille, intro, encart, vue de la ville */
#page-content .ffvr-chips{margin:4px 0 18px}
#page-content .ffvr-chip{display:inline-block;font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.06em;text-transform:uppercase;padding:6px 11px;border-radius:999px;border:1px solid rgba(255,51,99,.5);color:#ff8aa5;background:var(--ffd-rose-pale)}
#page-content .ffvr-tete.g-cols{grid-template-columns:minmax(0,1fr);gap:26px}
#page-content .ffvr-intro .wpb_text_column{font-size:1em;line-height:1.55;color:var(--ffd-doux);max-width:56ch}
#page-content .ffvr-intro p + p{margin-top:12px}
#page-content .ffvr-intro p:first-child{color:var(--ffd-texte)}

#page-content .w-actionbox.ffv-encart{background:linear-gradient(160deg,#1d2b2c,#1a1a22 70%)!important;color:var(--ffd-texte);border:1px solid rgba(78,205,196,.38);border-radius:22px;box-shadow:none;padding:20px 18px 18px;text-align:left;margin:0}
#page-content .ffv-encart .w-actionbox-text{display:flex;flex-direction:column;gap:12px;text-align:left}
#page-content .ffv-encart .w-actionbox-title{position:relative;display:flex;align-items:flex-start;gap:12px;font-family:var(--ffd-titre);font-weight:400;font-size:clamp(26px,6.4vw,32px);line-height:1.1;color:var(--ffd-texte)}
#page-content .ffv-encart .w-actionbox-title::before{content:"";flex:none;width:12px;height:12px;margin-top:.42em;border-radius:50%;background:var(--ffd-turq)}
#page-content .ffv-encart .w-actionbox-title::after{content:"";position:absolute;left:0;top:.42em;width:12px;height:12px;border-radius:50%;background:var(--ffd-turq);animation:ffvr-pulse 2s ease-out infinite}
@keyframes ffvr-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.8);opacity:0}}
#page-content .ffv-encart .w-actionbox-description{display:flex;flex-direction:column;gap:4px}
#page-content .ffv-encart .w-actionbox-text p.ffv-preuve{display:block;margin:0;color:var(--ffd-texte);font-weight:600;font-size:1em;line-height:1.5}
#page-content .ffv-encart .w-actionbox-text p.ffv-preuve::before{display:none}
#page-content .ffv-encart .w-actionbox-text p.ffv-lieu{margin:0;color:var(--ffd-doux);font-size:1em;line-height:1.5}
#page-content .ffv-encart .w-actionbox-controls{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px;padding-top:18px;margin:0}
#page-content .ffvr-rappel{margin-top:40px}
#page-content .ffv-nobr{white-space:nowrap}

#page-content .w-image.ffvr-vue{position:relative;margin:26px 0 0;border-radius:22px;overflow:hidden;aspect-ratio:16/9;background:#2a1f2b}
#page-content .ffvr-vue .w-image-h,#page-content .ffvr-vue img{display:block;width:100%;height:100%;object-fit:cover}
#page-content .w-image.ffvr-vue::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(15,14,23,0) 55%,rgba(15,14,23,.55));pointer-events:none}

/* Boutons : plein rose, trait gris, lien turquoise (le dernier bouton de l'encart) */
/* Le thème dessine un second cadre en ::before (largeur --btn-border-width, posé dans le bouton) : il doublait la bordure */
#page-content .w-btn::before{display:none!important}
#page-content .w-btn{display:inline-flex;align-items:center;justify-content:center;margin:0;padding:13px 18px;border-radius:14px;font-family:var(--ffd-corps);font-style:normal;font-weight:800;font-size:1rem;line-height:1.2!important;letter-spacing:0;text-align:center;text-decoration:none;box-shadow:none;transition:background-color .3s ease,color .3s ease,border-color .3s ease}
#page-content .w-btn.us-btn-style_2{background:var(--ffd-rose)!important;border:2px solid var(--ffd-rose)!important;color:#fff!important}
#page-content .w-btn.us-btn-style_1,#page-content .w-btn.us-btn-style_4{background:var(--ffd-surface2)!important;border:2px solid var(--ffd-bord)!important;color:var(--ffd-texte)!important}
#page-content .ffv-encart .w-btn.us-btn-style_1:not(.ffrdv-appel){background:none!important;border-color:transparent!important;color:var(--ffd-turq)!important;padding-left:6px;padding-right:6px;font-weight:700}
#page-content .ffv-encart .w-btn.us-btn-style_1:not(.ffrdv-appel)::after{display:inline-block!important;content:"›";margin-left:6px;font-size:1.2em;line-height:1;transition:transform .3s ease}
#page-content .w-btn:focus-visible{outline:2px solid var(--ffd-turq);outline-offset:3px}
#page-content .w-btn-wrapper{margin:0}
/* Le survol, à la manière du thème (Florian, 2026-10-15 : « ce qu'on perd aussi, c'est les effets sur les boutons ») : le
   plein rose passe en blanc au texte rose, le trait gris se remplit de rose, le lien turquoise se souligne et sa flèche
   avance. Seulement avec une souris : sur un écran tactile, l'effet resterait collé après le toucher. */
@media (hover:hover){
  #page-content .w-btn.us-btn-style_2:hover{background:#fff!important;border-color:#fff!important;color:var(--ffd-rose)!important}
  #page-content .w-btn.us-btn-style_1:hover,#page-content .w-btn.us-btn-style_4:hover{background:var(--ffd-rose)!important;border-color:var(--ffd-rose)!important;color:#fff!important}
  #page-content .ffv-encart .w-btn.us-btn-style_1:not(.ffrdv-appel):hover{background:none!important;border-color:transparent!important;color:var(--ffd-turq)!important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
  #page-content .ffv-encart .w-btn.us-btn-style_1:not(.ffrdv-appel):hover::after{transform:translateX(4px)}
}

/* « Ce qu'il faut savoir » : la photo flotte à droite dans le texte */
#page-content .ffvr-savoir .vc_column-inner{display:flow-root}
#page-content .w-image.ffvr-photo{float:right;margin:4px 0 10px 18px;shape-outside:circle(50%) border-box;shape-margin:10px}
#page-content .ffvr-photo img{display:block;width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--ffd-surface2)}
#page-content .ffvr-savoir .wpb_text_column{color:var(--ffd-doux);font-size:1em;max-width:62ch}

/* Les avis : une file à faire défiler, comme dans la maquette, à toutes les largeurs (Florian, 2026-10-15, sur la grille
   de deux par ligne : « tu avais fait une espèce de liste au début »). La dernière carte visible est coupée, ce qui dit
   qu'il y en a d'autres. À partir de 640 px, design-villes.js pose deux flèches à droite du titre (.ffd-fleches) et passe la
   colonne en grille (.ffd-avis) pour les mettre sur sa ligne ; sans le script, la file défile au doigt ou au pavé. */
#page-content .layout_11519 .w-grid-list{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 8px;scrollbar-width:none;overscroll-behavior-x:contain}
#page-content .layout_11519 .w-grid-list::-webkit-scrollbar{display:none}
#page-content .layout_11519 .w-grid-item{flex:none;width:38%;margin:0;scroll-snap-align:start}
#page-content .vc_column-inner.ffd-avis{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px 12px}
#page-content .ffd-avis > *{grid-column:1/-1}
#page-content .ffd-avis > h2.w-text{grid-column:1}
#page-content .ffd-avis > .ffd-fleches{grid-column:2}
#page-content .ffd-fleches{display:flex;gap:8px;margin:0}
#page-content .ffd-fleches[hidden]{display:none}
#page-content .ffd-fleche{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0 0 3px;border-radius:50%;border:2px solid var(--ffd-bord);background:var(--ffd-surface);color:var(--ffd-texte);font:400 26px/1 var(--ffd-corps);cursor:pointer;box-shadow:none;transition:background-color .3s ease,border-color .3s ease,opacity .2s}
#page-content .ffd-fleche:focus-visible{outline:2px solid var(--ffd-turq);outline-offset:3px}
#page-content .ffd-fleche:disabled{opacity:.35;cursor:default}
@media (hover:hover){#page-content .ffd-fleche:not(:disabled):hover{background:var(--ffd-rose);border-color:var(--ffd-rose)}}
#page-content .layout_11519 .usg_vwrapper_2{height:100%;box-sizing:border-box;background:var(--ffd-surface);border:1px solid var(--ffd-bord)!important;border-radius:20px!important;padding:18px 18px 20px}
#page-content .layout_11519 .usg_vwrapper_1,#page-content .layout_15480 .usg_vwrapper_1{align-items:stretch!important;--vwrapper-gap:10px}
#page-content .layout_11519 .usg_post_custom_field_1,#page-content .layout_15480 .usg_post_custom_field_1{font-family:var(--ffd-titre);font-size:30px;font-weight:400!important;line-height:1;color:var(--ffd-texte);text-align:left!important;border-bottom:0!important;margin:0!important;padding:0!important}
#page-content .layout_11519 .usg_post_content_1,#page-content .layout_15480 .usg_post_content_1{text-align:left!important;margin-top:0!important}
#page-content .layout_11519 .usg_post_content_1 p{color:var(--ffd-doux);font-size:1em;line-height:1.55}

/* Les cartes du déroulé et des arguments */
#page-content .ffvr-cartes.g-cols{gap:12px}
#page-content .ffvr-cartes .ffvr-carte .vc_column-inner{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;background:var(--ffd-surface);border:1px solid var(--ffd-bord);border-radius:20px;padding:20px 18px}
#page-content .ffvr-carte h3{display:block;margin:0;font-family:var(--ffd-titre);font-weight:400;font-size:clamp(24px,5.6vw,29px);line-height:1.12;color:var(--ffd-texte)}
#page-content .ffvr-carte h3 span{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:var(--ffd-corps);font-size:12.5px;font-weight:800;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;color:var(--ffd-turq)!important}
#page-content .ffvr-carte h3 i.material-icons{font-size:18px!important;vertical-align:0!important;margin:0!important;line-height:1}
#page-content .ffvr-carte h3 br{display:none}
#page-content .ffvr-carte p{color:var(--ffd-doux);font-size:1em}
#page-content .ffvr-carte h3 + p{margin-top:12px}
#page-content .ffvr-cartes .ffvr-duree .vc_column-inner{flex-direction:row;flex-wrap:wrap;align-items:center;gap:16px}
#page-content .ffvr-duree .wpb_text_column{flex:1 1 200px;margin:0}
#page-content .ffvr-duree .wpb_text_column:first-child{flex-basis:220px}
/* Une carte Durée sans titre après l'étiquette (Annecy) s'empile, comme les autres cartes. Celle de Lyon a un titre, donc un
   <br> dans son H3 (posé par wpautop), et reste sur une ligne. */
#page-content .ffvr-cartes .ffvr-duree .vc_column-inner:not(:has(h3 br)){flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:12px}
#page-content .ffvr-duree .vc_column-inner:not(:has(h3 br)) .wpb_text_column{flex:none}
#page-content .ffvr-duree .vc_column-inner:not(:has(h3 br)) p{margin-top:0!important}
#page-content .ffvr-temps .vc_column-inner::before{content:"1";display:grid;place-items:center;flex:none;align-self:flex-start;width:40px;height:40px;border-radius:50%;font-family:var(--ffd-titre);font-size:24px;line-height:1;background:var(--ffd-turq-pale);color:var(--ffd-turq);border:1px solid rgba(78,205,196,.4)}
#page-content .ffvr-temps .ffvr-carte + .ffvr-carte .vc_column-inner::before{content:"2";background:var(--ffd-rose-pale);color:#ff8aa5;border-color:rgba(255,51,99,.45)}
#page-content .ffvr-cartes .ffvr-mien .vc_column-inner{border-color:rgba(255,51,99,.45);background:linear-gradient(160deg,#2a1a22,#1c1c21 70%)}
#page-content .ffvr-mien p{color:var(--ffd-texte)}

/* Les témoins : une carte rosée, le nom et les étoiles sur une ligne */
#page-content .ffvr-temoin .usg_vwrapper_2{background:linear-gradient(160deg,#241a22,#1c1c21 65%);border:1px solid rgba(255,51,99,.32)!important;border-radius:22px!important;padding:22px 20px}
#page-content .ffvr-temoin .usg_vwrapper_1{flex-direction:row;flex-wrap:wrap;align-items:baseline!important;gap:12px}
#page-content .ffvr-temoin .usg_post_content_1{flex:1 1 100%}
#page-content .ffvr-temoin .usg_post_custom_field_2{color:var(--ffd-dore)!important;font-size:15px;margin:0!important}
#page-content .ffvr-temoin .usg_post_content_1 p{color:var(--ffd-doux);font-size:1em;line-height:1.6}
#page-content .ffvr-temoin + .w-btn-wrapper{display:flex;justify-content:center}

/* « Pas un salon » : les deux boutons côte à côte, centrés, sous le témoin */
#page-content .ffvr-salon .vc_column-inner{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:16px 10px}
#page-content .ffvr-salon .vc_column-inner .vc_column-inner{flex-direction:column;flex-wrap:nowrap;justify-content:flex-start}
#page-content .ffvr-salon .w-text,#page-content .ffvr-salon .g-cols,#page-content .ffvr-salon .w-grid{flex:1 1 100%;min-width:0}
#page-content .ffvr-salon .w-btn-wrapper{flex:0 0 auto}

/* FAQ : la photo ronde devant le titre, des questions en cartes */
#page-content .ffvr-faq .vc_column-inner{flex-direction:row;flex-wrap:wrap;align-items:center}
#page-content .w-image.ffvr-faq-photo{flex:none;width:64px;margin:0}
#page-content .ffvr-faq-photo img{display:block;width:64px;height:64px;border-radius:50%;object-fit:cover;border:2px solid var(--ffd-surface2)}
#page-content .ffvr-faq h2.w-text{flex:1 1 0;min-width:0}
#page-content .ffvr-faq .w-tabs,#page-content .ffvr-faq .w-actionbox{flex:1 1 100%;min-width:0}
#page-content .w-tabs-sections{display:flex;flex-direction:column;gap:10px}
#page-content .w-tabs-section{background:var(--ffd-surface);border:1px solid var(--ffd-bord)!important;border-radius:16px;overflow:hidden;margin:0}
#page-content .w-tabs-section.active{border-color:#4a4a58!important}
#page-content .w-tabs-section-header{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:15px 16px;background:none!important;color:var(--ffd-texte)!important;text-align:left;border:0}
#page-content .w-tabs-section-title{display:block;margin:0;font-family:var(--ffd-corps);font-size:1em;font-weight:700;line-height:1.35;color:inherit}
#page-content .w-tabs-section-control{flex:none;position:static;width:10px;height:10px;margin:0;border-right:2.5px solid var(--ffd-turq);border-bottom:2.5px solid var(--ffd-turq);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s}
#page-content .w-tabs-section.active .w-tabs-section-control{transform:rotate(-135deg) translate(-2px,-2px)}
#page-content .w-tabs-section-control::before,#page-content .w-tabs-section-control::after{display:none!important}
#page-content .w-tabs-section-content{padding:0 16px 16px;color:var(--ffd-doux);font-size:1em}
#page-content .w-tabs-section-content-h{padding:0}

/* « À découvrir aussi » : quatre vignettes, deux par ligne sur téléphone */
#page-content .w-text.us_custom_40cffc68{font-size:13px!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ffd-gris);text-align:left!important;line-height:1.4}
#page-content .g-cols.cols_4.mobiles-cols_2{gap:12px}
#page-content .cols_4.mobiles-cols_2 .vc_column-inner{gap:0;background:var(--ffd-surface);border:1px solid var(--ffd-bord);border-radius:18px;overflow:hidden;height:100%;box-sizing:border-box}
#page-content .cols_4.mobiles-cols_2 .w-image img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
#page-content .w-text.us_custom_58b1af09{padding:10px 12px 0;font-weight:800!important;font-size:.97em;line-height:1.25;text-align:left!important}
#page-content .w-text.us_custom_58b1af09 a{color:var(--ffd-texte);text-decoration:none}
#page-content .w-text.us_custom_0377b6a0{padding:3px 12px 13px;color:var(--ffd-gris);font-size:.84em!important;line-height:1.35!important;text-align:left!important}

/* Les modules des autres pages ville, que Lyon n'a pas (1.0.4). Les classes sont posées par outils-villes/design-villes.py.
   Deux règles visent des classes que Lyon porte aussi, ffv-fin (son h3) et ffvr-duree (plus haut, sans titre après
   l'étiquette), mais ne touchent que ce que Lyon n'a pas. villes-design/comparer-geometrie.mjs vérifie que le rendu de Lyon
   ne bouge pas d'un pixel d'une version à l'autre. */

/* « À qui s'adresse ce massage » : la photo ronde en tête de chaque carte */
#page-content .ffvr-pourqui .w-image{order:-1;align-self:flex-start;width:96px;margin:0}
#page-content .ffvr-pourqui .w-image img{display:block;width:96px;height:96px;border-radius:50%;object-fit:cover;border:2px solid var(--ffd-surface2)}

/* Les cartes à icône (Lieu, Durée) : l'icône dans une pastille turquoise, tout à gauche */
#page-content .ffvr-carte .w-iconbox{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:0;text-align:left}
#page-content .ffvr-carte .w-iconbox-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;margin:0;padding:0;border-radius:50%;font-size:22px!important;line-height:1;background:var(--ffd-turq-pale);color:var(--ffd-turq);border:1px solid rgba(78,205,196,.4)}
#page-content .ffvr-carte .w-iconbox-icon i{font-size:22px;line-height:1;color:inherit}
#page-content .ffvr-carte .w-iconbox-meta{text-align:left;padding:0}
#page-content .ffvr-carte .w-iconbox-title{padding:0;margin:0}
#page-content .ffvr-carte .w-iconbox-text{margin-top:12px;color:var(--ffd-doux)}
#page-content .ffvr-carte .w-iconbox-text p{margin-top:0!important}
#page-content .ffvr-carte .w-iconbox-text p + p{margin-top:14px!important}

/* Le texte qui présente les communes, en carte ; « Liens utiles » en étiquette ; les pages liées en boutons arrondis */
#page-content .ffvr-zone{margin-top:24px}
#page-content .wpb_text_column.ffvr-zone-texte{background:var(--ffd-surface);border:1px solid var(--ffd-bord);border-radius:20px;padding:20px 18px;color:var(--ffd-doux)}
#page-content .w-text.ffvr-label{font-size:13px!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ffd-gris);text-align:left!important;line-height:1.4;margin:0}
#page-content .w-vwrapper.ffvr-villes{flex-direction:row!important;flex-wrap:wrap;align-items:center!important;justify-content:flex-start!important;gap:8px;margin:0}
#page-content .w-vwrapper.ffvr-villes > *{margin:0!important}
#page-content .ffvr-villes .wpb_text_column p{margin:0}
#page-content .ffvr-villes a{display:inline-block;padding:8px 14px;border-radius:999px;border:1px solid var(--ffd-bord);background:var(--ffd-surface);color:var(--ffd-texte);font-size:.9em;font-weight:600;line-height:1.3;text-decoration:none;transition:background-color .3s ease,border-color .3s ease}
@media (hover:hover){#page-content .ffvr-villes a:hover{background:var(--ffd-rose-pale);border-color:var(--ffd-rose);color:var(--ffd-texte)}}

/* La rangée de réservation : la photo et le titre, puis la carte de fin sur toute la largeur, rosée comme « le mien ».
   Le bloc ffv-style de la page la dessine centrée sur 760 px avec un halo : on la reprend ici. */
#page-content .ffvr-faq .vc_column-inner .vc_column-inner{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
#page-content .ffvr-faq > .l-section-h > .g-cols > .wpb_column > .vc_column-inner > :is(.g-cols,.wpb_text_column,.w-btn-wrapper){flex:1 1 100%;min-width:0}
#page-content .ffvr-resa .ffv-fin .vc_column-inner{max-width:none;margin:0!important;padding:22px 20px!important;text-align:left;background:linear-gradient(160deg,#2a1a22,#1c1c21 70%);border:1px solid rgba(255,51,99,.45);border-radius:22px;box-shadow:none}
#page-content .ffvr-resa .ffv-fin p{color:var(--ffd-texte)}
#page-content .ffvr-resa .ffv-fin .w-btn-wrapper{margin:4px 0 0;text-align:left}
/* L'intertitre que douze cartes de fin portent (« Florian, masseur érotique… ») : comme les titres des autres cartes */
#page-content .ffv-fin h3{margin:0 0 12px;font-family:var(--ffd-titre);font-weight:400;font-size:clamp(24px,5.6vw,29px);line-height:1.12;letter-spacing:0;color:var(--ffd-texte)}

/* Les vignettes vers les villes voisines (Aix-les-Bains), comme celles de « À découvrir aussi » */
#page-content .ffvr-vignettes.g-cols{gap:12px}
#page-content .ffvr-vignettes .vc_column-inner{height:100%;box-sizing:border-box;gap:0;background:var(--ffd-surface);border:1px solid var(--ffd-bord);border-radius:18px;overflow:hidden}
#page-content .ffvr-vignettes .w-image img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:0}
#page-content .ffvr-vignettes .wpb_text_column{padding:12px 14px 14px;font-weight:800;color:var(--ffd-texte)}

/* La liste à feuilles (Fribourg, Neuchâtel, Sion) : l'icône en turquoise, plus près du texte (style en ligne) */
#page-content .wpb_text_column span.material-icons{color:var(--ffd-turq)!important;margin-right:10px!important;font-size:22px;vertical-align:-5px}

@media (min-width:640px){
  #page-content .w-image.ffvr-vue{aspect-ratio:21/9}
  #page-content .ffvr-photo img{width:150px;height:150px}
  #page-content .ffvr-cartes.g-cols{gap:14px}
}
@media (max-width:1023px){
  #page-content .layout_11519 .w-grid-item{width:58%}
}
@media (max-width:639px){
  #page-content .layout_11519 .w-grid-list{margin:0 -16px;padding:0 16px 8px;scroll-padding-inline:16px}
  #page-content .layout_11519 .w-grid-item{width:min(320px,84%)}
  #page-content .ffd-fleches{display:none}
}
@media (max-width:479px){
  #page-content .ffv-encart .w-btn.us-btn-style_2,#page-content .ffv-encart .w-btn.ffrdv-appel,#page-content .ffvr-salon .w-btn-wrapper{flex:1 1 100%}
  #page-content .ffvr-salon .w-btn{width:100%}
}
@media (max-width:399px){
  #page-content .ffvr-photo img{width:92px;height:92px}
  #page-content .w-image.ffvr-photo{margin-left:14px}
}

@media (prefers-reduced-motion:reduce){
  #page-content .ffv-encart .w-actionbox-title::after{animation:none}
  #page-content .ffd-fleche{transition:none!important}
}
