/* ============ « Les suggestions de la semaine » — la fiche de Salvatore, animée ============ */
:root{--fs:'Kaushan Script',cursive;--fn:'Caveat',cursive;--brush:#CFE0BE;--brush2:#B9D2A2;--ink2:#2B4620;--vert-prix:#3E6A2A}
.fiche-menu{padding:110px 0 90px;position:relative;overflow:clip;background:#fff}
.fm-wrap{position:relative;z-index:1;max-width:980px}
/* en-tête : brasserie, titre script, trait de pinceau */
.fm-head{text-align:center;position:relative;padding:0 20px}
.fm-brand{font-family:var(--fd);font-style:normal;text-transform:uppercase;letter-spacing:.42em;font-size:13px;color:var(--g);margin-bottom:6px}
.fm-title{font-family:var(--fs);font-style:normal;font-weight:400;font-size:clamp(34px,5vw,68px);line-height:1.02;color:var(--g);margin:0 auto;display:inline-block;position:relative;text-transform:none;letter-spacing:0}
.fm-title .scr{display:inline-block;clip-path:inset(0 100% 0 0);transition:clip-path 1.6s cubic-bezier(.4,0,.2,1)}
.fm-title.in .scr{clip-path:inset(0 0 0 0)}
.fm-under{display:block;width:78%;height:14px;margin:-4px auto 0;overflow:visible}
.fm-under path{fill:none;stroke:var(--g);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.fm-title.in .fm-under path{transition:stroke-dashoffset .9s cubic-bezier(.4,0,.2,1) 1.2s;stroke-dashoffset:0}
/* petites notes manuscrites avec un cœur */
.fm-note{position:absolute;font-family:var(--fn);font-style:normal;font-size:clamp(19px,2vw,26px);line-height:1.05;color:var(--gd);text-align:center;opacity:0;transform:rotate(var(--r,-10deg)) scale(.85);transition:opacity .6s,transform .8s cubic-bezier(.2,1.5,.4,1);pointer-events:none;z-index:2}
.fm-note.in{opacity:1;transform:rotate(var(--r,-10deg)) scale(1)}
.fm-note svg{display:block;width:22px;height:20px;margin:4px auto 0;overflow:visible}
.fm-note svg path{fill:none;stroke:var(--gd);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.fm-note.in svg path{transition:stroke-dashoffset .8s ease .5s;stroke-dashoffset:0}
.fm-note.n1{left:-4%;top:-26px;--r:-12deg}
.fm-note.n2{right:-4%;top:-16px;--r:9deg}
.fm-note.n3{left:1%;bottom:-6px;--r:-8deg}
.fm-note.n3 b{display:block;font-family:var(--fd);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--g);margin-bottom:2px}
/* onglets : trois chips manuscrites */
.fm-tabs{display:flex;justify-content:center;gap:10px 22px;flex-wrap:wrap;margin:26px 0 30px;list-style:none;padding:0}
.fm-tabs li{border:0}
.fm-tabs button{font-family:var(--fs);font-style:normal;font-weight:400;font-size:clamp(20px,2.4vw,27px);color:var(--g);padding:6px 18px;position:relative;min-height:46px;letter-spacing:0;text-transform:none;width:auto;text-align:center;transition:color .3s}
.fm-tabs button::before{content:"";position:absolute;left:6px;right:6px;top:8px;bottom:6px;background:var(--brush);border-radius:40% 55% 45% 60%/60% 40% 60% 45%;transform:scaleX(0) rotate(-1.5deg);transform-origin:left center;transition:transform .45s cubic-bezier(.4,0,.2,1);z-index:-1;opacity:.9}
.fm-tabs button:hover::before{transform:scaleX(1) rotate(-1.5deg);opacity:.55}
.fm-tabs button.on{color:var(--gd)}
.fm-tabs button.on::before{transform:scaleX(1) rotate(-1.5deg);opacity:1}
.fm-tabs button .sub{display:block;font-family:var(--fb);font-style:italic;font-size:12px;color:var(--ink2);opacity:.7;letter-spacing:0;margin-top:-2px}
/* le corps : la fiche au centre, les assiettes qui dépassent */
.fm-body{position:relative;max-width:820px;margin:0 auto;min-height:520px}
.fiche-menu .paper{background:transparent;border:0;outline:0;box-shadow:none;transform:none;padding:6px 120px 20px;max-width:none;min-height:0;margin:0;border-radius:0}
.fiche-menu .paper::before,.fiche-menu .paper::after,.fiche-menu .paper .ph,.fiche-menu .paper .pt,.fiche-menu .paper .pl,.fiche-menu .paper > .stamp{display:none}
.fiche-menu .paper .pg{display:none}.fiche-menu .paper .pg.on{display:block}
/* familles : script sur un coup de pinceau, un trait fin de chaque côté */
.fiche-menu .paper h4{display:flex;align-items:center;gap:18px;font-family:var(--fs);font-style:normal;font-weight:400;font-size:clamp(26px,3.2vw,38px);color:var(--g);margin:26px 0 12px;text-align:center}
.fiche-menu .paper h4::before,.fiche-menu .paper h4::after{content:"";flex:1;height:1px;background:rgba(62,106,42,.35);transform:scaleX(0);transition:transform .8s cubic-bezier(.4,0,.2,1) .35s}
.fiche-menu .paper h4::before{transform-origin:right}.fiche-menu .paper h4::after{transform-origin:left}
.fiche-menu .paper h4 .hl{position:relative;display:inline-block;padding:2px 22px;z-index:0;white-space:nowrap;opacity:0;transform:translateY(6px);transition:opacity .6s .3s,transform .6s cubic-bezier(.4,0,.2,1) .3s}
.fiche-menu .paper h4 .hl::before{content:"";position:absolute;left:0;right:0;top:12%;bottom:10%;background:var(--brush);border-radius:45% 55% 40% 60%/55% 45% 60% 40%;transform:scaleX(0) rotate(-1deg);transform-origin:left center;transition:transform .55s cubic-bezier(.4,0,.2,1);z-index:-1}
.fiche-menu .paper h4.in .hl{opacity:1;transform:none}
.fiche-menu .paper h4.in .hl::before{transform:scaleX(1) rotate(-1deg)}
.fiche-menu .paper h4.in::before,.fiche-menu .paper h4.in::after{transform:scaleX(1)}
/* les lignes : puce, nom en gras, détail, prix vert à droite */
.fiche-menu .paper .d{display:grid;grid-template-columns:14px 1fr auto;gap:0 10px;align-items:baseline;padding:7px 0;margin:0;border-bottom:0;font-family:var(--fb);font-style:normal;color:#1f2a18;opacity:0;transform:translateX(-18px);transition:opacity .5s,transform .6s cubic-bezier(.4,0,.2,1)}
.fiche-menu .paper .d::before{content:"";position:static;width:7px;height:7px;border-radius:50%;background:var(--g);transform:none!important;opacity:1;mix-blend-mode:normal;margin-top:0;align-self:center}
.fiche-menu .paper .d.in{opacity:1;transform:none}
.fiche-menu .paper .d > div{font-size:clamp(15px,1.3vw,18px);line-height:1.35}
.fiche-menu .paper .d b{display:inline;font-family:var(--fb);font-style:normal;font-weight:700;text-transform:none;letter-spacing:0;font-size:inherit;color:#1f2a18}
.fiche-menu .paper .d span{display:inline;font-style:normal;font-size:inherit;color:#2f3a2a}
.fiche-menu .paper .d span:not(:empty)::before{content:" : "}
.fiche-menu .paper .d em{font-style:normal;font-family:var(--fb);font-weight:700;font-size:clamp(15px,1.3vw,18px);color:var(--vert-prix);white-space:nowrap;display:inline-block;transform:scale(.6);opacity:0;transition:transform .5s cubic-bezier(.2,1.6,.4,1) .25s,opacity .3s .25s}
.fiche-menu .paper .d.in em{transform:none;opacity:1}
.fiche-menu .paper .note{margin:8px 0 4px 24px;text-align:left;font-family:var(--fn);font-style:normal;font-size:17px;color:var(--ink2);opacity:.85}
/* les assiettes : demi-cachées sur les bords, elles tournent doucement et suivent le scroll */
.fm-plate{position:absolute;width:min(23vw,280px);aspect-ratio:1;border-radius:50%;background:#fff;padding:10px;box-shadow:0 30px 50px -22px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06);z-index:2;will-change:transform}
.fm-plate::after{content:"";position:absolute;inset:6px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);pointer-events:none}
.fm-plate img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;animation:tourne 70s linear infinite}
.fm-plate.p1{left:-150px;top:16%}
.fm-plate.p2{right:-150px;top:-2%;width:min(20vw,240px)}
.fm-plate.p2 img{animation-direction:reverse;animation-duration:85s}
.fm-plate.p3{right:-170px;top:56%}
@keyframes tourne{to{transform:rotate(360deg)}}
.fm-plate .tag{left:auto;right:8px;bottom:-14px;font-size:13px;padding:4px 10px}
/* pied : feuille, trois mots */
.fm-foot{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:34px;font-family:var(--fd);font-style:normal;text-transform:uppercase;letter-spacing:.32em;font-size:11px;color:var(--gd)}
.fm-foot i{width:6px;height:6px;border-radius:50%;background:var(--g);display:inline-block}
.fm-foot svg{width:30px;height:26px;margin-right:6px}
.fm-foot svg path{fill:none;stroke:var(--g);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.fm-foot.in svg path{transition:stroke-dashoffset 1.2s ease;stroke-dashoffset:0}
.fm-foot .l{width:90px;height:1px;background:rgba(62,106,42,.35)}
@media(max-width:900px){
  .fiche-menu .paper{padding:6px 24px 20px}
  .fm-plate{width:150px}
  .fm-plate.p1{left:-90px;top:auto;bottom:-40px}
  .fm-plate.p2{right:-80px;top:-30px;width:130px}
  .fm-plate.p3{right:-90px;top:auto;bottom:220px;width:140px}
  .fm-note.n1{left:0;top:-34px;font-size:18px}.fm-note.n2{right:0;top:-30px;font-size:18px}.fm-note.n3{position:static;transform:none;margin:26px auto 0;max-width:280px;display:block}
  .fm-note.n3.in{transform:none}
  .fiche-menu .paper h4{gap:10px;font-size:26px}
  .fiche-menu .paper .d{grid-template-columns:10px 1fr auto;gap:0 8px}
  .fm-foot{flex-wrap:wrap;gap:8px 12px;letter-spacing:.22em;font-size:10px}
  .fm-foot .l{display:none}
}
@media(max-width:600px){
  .fiche-menu{padding:80px 0 60px}
  .fm-plate.p1{left:-70px;width:130px;bottom:-30px}
  .fm-plate.p2{right:-64px;top:-26px;width:110px}
  .fm-plate.p3{right:-70px;bottom:260px;width:120px}
  .fiche-menu .paper .d > div{font-size:15px}
  .fiche-menu .paper .d em{font-size:15px}
}
/* correctifs : les feuillages restent absolus quoi qu'en dise la section ; les chips ne reprennent pas le soulignage rouge du menu d'origine */
.feuille{position:absolute!important}
.fm-tabs button:hover,.fm-tabs button.on{padding:6px 18px}
.fm-tabs button::before,.fm-tabs button.on::before,.fm-tabs button:hover::before{width:auto;height:auto;right:6px;top:8px;bottom:6px;left:6px;background:var(--brush)}
.fm-body{padding-bottom:70px}
@media(max-width:900px){.fm-body{padding-bottom:0}}
@media(max-width:600px){
  .fm-tabs{flex-wrap:nowrap;gap:2px;justify-content:space-between;margin:18px 0 22px}
  .fm-tabs button{font-size:19px;padding:6px 10px;min-height:44px}
  .fm-tabs button:hover,.fm-tabs button.on{padding:6px 10px}
  .fm-tabs button .sub{display:none}
  .fm-title{font-size:32px}
}


/* plus d'écriture : coup de cœur manuscrit à côté d'un plat, brins de feuille qui se dessinent, 4e note */
.fiche-menu .paper .d .cc{display:inline-block;font-family:var(--fn);font-style:normal;font-size:15px;color:var(--red);margin-left:10px;transform:rotate(-4deg);white-space:nowrap;vertical-align:baseline;opacity:0;transition:opacity .5s .5s}
.fiche-menu .paper .d.in .cc{opacity:1}
.fiche-menu .paper .d .cc::before{content:"";display:inline-block;width:11px;height:10px;margin-right:4px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 20 C 4 14, 1 9, 4 5 C 6.5 2, 10.5 3, 12 6 C 13.5 3, 17.5 2, 20 5 C 23 9, 20 14, 12 20 Z' fill='%23B8352B'/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-1px}
.fiche-menu .paper .d.coeur::before{background:var(--red)}
.fm-note.n4{right:1%;bottom:30px;--r:7deg}
.fm-brin{position:absolute;top:-6px;width:44px;height:66px;overflow:visible}
.fm-brin.g{left:-52px;transform:rotate(-18deg)}.fm-brin.d{right:-52px;transform:rotate(18deg)}
.fm-brin path{fill:none;stroke:var(--g);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.fm-title.in .fm-brin path{transition:stroke-dashoffset 1.4s ease 1.5s;stroke-dashoffset:0}
/* le coup de pinceau : deux couches décalées, plus peint */
.fiche-menu .paper h4 .hl::after{content:"";position:absolute;left:4%;right:2%;top:22%;bottom:18%;background:var(--brush2);opacity:.45;border-radius:60% 40% 55% 45%/40% 60% 45% 55%;transform:scaleX(0) rotate(1.5deg);transform-origin:left center;transition:transform .6s cubic-bezier(.4,0,.2,1) .08s;z-index:-1}
.fiche-menu .paper h4.in .hl::after{transform:scaleX(1) rotate(1.5deg)}
@media(max-width:900px){.fm-note.n4{position:static;transform:none;margin:14px auto 0;max-width:240px;display:block}.fm-note.n4.in{transform:none}.fm-brin{display:none}.fiche-menu .paper .d .cc{display:block;margin:2px 0 0}}

/* page carte : chaque papier est une fiche, la photo collante reste à côté */
.fiche-style .paper{background:#fff;border:0;outline:0;box-shadow:none;transform:none!important;padding:10px 6px 20px;max-width:none;margin:0;border-radius:0}
.fiche-style .paper .pt{display:block!important;text-align:center;font-family:var(--fs);font-style:normal;font-weight:400;text-transform:none;letter-spacing:0;font-size:clamp(30px,3.4vw,44px);color:var(--g);margin:0 0 6px}
.fiche-style .paper .pt small{display:block;font-family:var(--fn);font-style:normal;font-size:19px;color:var(--ink2);opacity:.85;margin-top:2px;text-transform:none;letter-spacing:0}
.fiche-style .paper .pl{display:block!important;width:120px;height:2px;background:var(--g);margin:10px auto 18px;border-radius:2px}
.fiche-style .paper > .stamp{display:inline-block!important;position:absolute;right:0;top:-8px;left:auto;transform:rotate(8deg)!important;color:var(--g);border-color:var(--g);font-size:11px}
.fiche-style .paper .ph{display:none!important}
.fiche-style .paper .d{opacity:1;transform:none}
.fiche-style .paper .d em{opacity:1;transform:none}
.fiche-style .paper.in .d{opacity:1;transform:none}
.fiche-style .paper .note{margin-left:24px}
.msec > .ph{border-radius:50%;aspect-ratio:1;width:min(100%,420px);margin:0 auto;box-shadow:0 30px 50px -22px rgba(0,0,0,.4);background:#fff;padding:10px}
.msec > .ph img{border-radius:50%}
/* le petit mot de la photo ronde : une étiquette blanche posée à cheval sur le bas du rond, jamais coupée par le cercle */
.msec > .ph{overflow:visible}
.msec > .ph .tag,.msec > .ph.pola .tag{left:50%;right:auto;bottom:-6px;transform:translateX(-50%) rotate(-2deg)!important;background:#fff;padding:5px 16px;box-shadow:0 10px 20px -12px rgba(0,0,0,.5);white-space:nowrap;border-radius:3px}
.msec > .ph.clip img{clip-path:none;transform:none}
.cnav a{font-family:var(--fs);font-style:normal;text-transform:none;font-weight:400;letter-spacing:0;font-size:24px;color:var(--g)}
.cnav a::before{background:var(--brush);height:60%;top:20%;transform:none;width:0;border-radius:40% 55% 45% 60%/60% 40% 60% 45%;z-index:-1;left:-8px}
.cnav a.on::before,.cnav a:hover::before{width:calc(100% + 16px)}
.cnav a.on,.cnav a:hover{padding-left:0;color:var(--gd)}
.cnav{position:relative;z-index:0}

/* la page carte réutilise le style fiche : la grille porte .fiche-menu, sans le padding de section */
.carte-grid.fiche-menu{padding:0;overflow:visible;background:transparent}

/* la vigne : tige qui pousse au scroll, feuilles et fleurs qui s'ouvrent à son passage */
.carte-grid{position:relative}
.vigne{position:absolute;top:0;bottom:0;pointer-events:none;z-index:3;opacity:.95}
.vigne.droite{right:-200px}.vigne.gauche{left:-200px}
.vigne svg{display:block;overflow:visible;animation:vigneSway 7s ease-in-out infinite}
.vigne.gauche svg{animation-delay:-4s}
@keyframes vigneSway{0%,100%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
.vigne .vt{fill:none;stroke:var(--g);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.vigne .vf{fill:#DCE9CF;stroke:var(--g);stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round}
.vigne .vfl{stroke:rgba(0,0,0,.12);stroke-width:.6}
.vigne .vb{fill:#B8352B;stroke:rgba(0,0,0,.15);stroke-width:.5}
.vigne .vc{fill:#F6D35B;stroke:rgba(0,0,0,.15);stroke-width:.5}
.vigne .vo:nth-child(3n) .vf{fill:#CFE0BE}.vigne .vo:nth-child(4n) .vf{fill:#B9D2A2}
@media(max-width:1500px){.vigne.droite{right:-165px}.vigne.gauche{left:-165px}}
@media(max-width:1260px){.vigne.gauche{display:none}.vigne.droite{right:-110px}}
@media(max-width:700px){.vigne.gauche{display:block;left:0;opacity:.95}.vigne.droite{display:none}.fiche-style .paper{padding-left:50px}.vigne .vt{stroke-width:2.6}}
/* téléphone : les photos rondes de la carte et des boissons, beaucoup plus petites */
@media(max-width:700px){.msec > .ph{width:min(52vw,210px);margin:0 auto 18px;padding:6px}.msec{padding:16px 0 50px}}
