/* YORU — page carte : bandeau LED, pastilles collantes, rubriques, recherche, feuille mobile */
.page-carte{background:var(--porcelaine)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

.carte-hero{position:relative;overflow:hidden;background:#000;color:#fff;padding:170px 0 70px}
.carte-hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.75}
.carte-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#06183dee,#06183d99 60%,#06183d55)}
.carte-hero .wrap{position:relative;z-index:2}
.carte-hero .jp{color:var(--elec);font-size:20px}
.carte-hero h1{font-size:clamp(64px,8vw,120px);line-height:1;margin:10px 0 18px}
.carte-hero p{font-size:20px;color:#d6e4f2;max-width:46ch;margin-bottom:30px}
.recherche{display:block;max-width:560px}
.recherche input{width:100%;font:inherit;font-size:18px;padding:18px 24px 18px 54px;border-radius:999px;border:1px solid #ffffff4d;background:#ffffff14 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23cfeaf7' stroke-width='2'%3E%3Ccircle cx='8.5' cy='8.5' r='6.5'/%3E%3Cpath d='M13.5 13.5 19 19'/%3E%3C/svg%3E") 22px center no-repeat;color:#fff;backdrop-filter:blur(10px);transition:border-color .3s,box-shadow .3s}
.recherche input::placeholder{color:#cfe3f5b3}
.recherche input:focus{outline:0;border-color:var(--elec);box-shadow:0 0 0 4px #3fd7ff33}

.pastilles{position:sticky;top:96px;z-index:40;background:#f4f7faeb;backdrop-filter:blur(14px);border-bottom:1px solid var(--trait)}
.pastilles-piste{display:flex;gap:8px;overflow-x:auto;padding:14px max(40px,calc((100vw - 84rem)/2 + 40px));scrollbar-width:none;scroll-padding-inline:40px}
.pastilles-piste::-webkit-scrollbar{display:none}
.pastilles a{flex:none;font-size:15px;font-weight:700;padding:9px 16px;border-radius:999px;border:1.5px solid var(--trait);color:var(--abysse);white-space:nowrap;transition:background .3s,color .3s,border-color .3s,box-shadow .3s}
.pastilles a:hover{border-color:var(--cobalt)}
.pastilles a.on{background:var(--abysse);color:#fff;border-color:var(--abysse);box-shadow:0 0 0 3px #3fd7ff55}

.carte-corps{padding-top:30px;padding-bottom:110px}
.recherche-vide{font-size:20px;color:var(--gris);padding:60px 0;text-align:center}
.rubrique{display:grid;grid-template-columns:minmax(260px,32%) 1fr;gap:56px;padding:64px 0;border-bottom:1px solid var(--trait);scroll-margin-top:170px}
.r-tete{position:sticky;top:180px;align-self:start}
.r-vue{border-radius:22px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 60px #06183d26}
.r-vue img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.rubrique:hover .r-vue img{transform:scale(1.05)}
.r-tete h2{font-size:42px;color:var(--abysse);margin-top:22px}
.compte{display:inline-block;margin-top:8px;font-size:15px;font-weight:700;color:var(--cobalt);background:#0b3a8c12;border-radius:999px;padding:3px 12px}
.articles{display:grid;grid-template-columns:1fr 1fr;gap:6px 44px;align-content:start}
.article{position:relative;padding:18px 0 16px;border-bottom:1px solid var(--trait)}
.a-ligne{display:flex;align-items:baseline;gap:10px}
.a-ligne b{font-family:var(--display);font-weight:400;font-size:23px;color:var(--abysse);line-height:1.2}
.a-ligne small{font-size:14px;color:var(--gris);white-space:nowrap}
.a-ligne .px{margin-left:auto;font-weight:700;color:var(--cobalt);white-space:nowrap;padding-left:12px}
.article p{font-size:16px;line-height:1.55;color:var(--gris);margin-top:6px}
.nouveau{font-size:12px;font-weight:700;color:#00131c;background:var(--elec);border-radius:999px;padding:2px 9px;box-shadow:0 0 12px #3fd7ff88;white-space:nowrap;align-self:center}
.a-photo{display:none}
/* photo du plat (tablette du restaurant) à gauche de son nom */
.article{display:grid;grid-template-columns:104px 1fr;column-gap:20px;align-items:start}
.article>:not(.a-vue){grid-column:2}
.article.sans-vue{display:block}
.a-vue{grid-row:1/span 3;width:104px;height:104px;border-radius:16px;object-fit:cover;background:#06183d22;box-shadow:0 10px 24px #06183d33;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.article:hover .a-vue{transform:scale(1.04)}
.article .a-ligne{display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:baseline}
.article .a-ligne b{grid-area:1/1}
.article .a-ligne .px{grid-area:1/2;padding-left:0}
.article .a-ligne small{grid-area:2/1;margin-top:4px}
.a-vide{display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,#1b2f66,#06183d 70%);border:1px solid #ff29a833;font-family:var(--display);font-size:46px;line-height:1;color:var(--rose,#ff29a8);text-shadow:0 0 14px #ff29a8aa,0 0 30px #ff29a855}

.carte-cta{background:var(--abysse);color:#fff;padding:90px 0;text-align:center}
.carte-cta h2{margin-bottom:26px}
.carte-cta .wrap{display:flex;flex-direction:column;align-items:center;gap:12px}
.carte-cta .btn{min-width:260px}

.feuille{display:none}

@media (max-width:900px){
  .carte-hero{padding:120px 0 44px}
  .carte-hero h1{font-size:64px}
  .carte-hero p{font-size:17px;margin-bottom:22px}
  .recherche input{font-size:16px;padding:15px 18px 15px 48px;background-position:18px center}
  .pastilles{top:74px}
  .pastilles-piste{padding:12px 20px;scroll-padding-inline:20px}
  .carte-corps{padding-top:10px;padding-bottom:70px}
  .rubrique{display:block;padding:0;scroll-margin-top:140px;border:0;margin-bottom:12px}
  .r-tete{position:relative;top:auto;display:grid;grid-template-columns:76px 1fr auto;align-items:center;gap:14px;padding:12px;border-radius:18px;background:#fff;border:1px solid var(--trait);cursor:pointer;transition:box-shadow .3s}
  .r-vue{border-radius:12px;aspect-ratio:1;box-shadow:none}
  .r-tete h2{font-size:24px;margin:0}
  .compte{margin:0}
  .rubrique.ouverte .r-tete{box-shadow:0 0 0 2px var(--abysse),0 0 24px #3fd7ff44}
  .articles{grid-template-columns:1fr;gap:0;padding:4px 6px 18px}
  html.js .rubrique:not(.ouverte) .articles{display:none}
  .rubrique.ouverte .articles{animation:deplie .45s cubic-bezier(.2,.8,.2,1)}
  @keyframes deplie{from{opacity:0;transform:translateY(-10px)}}
  .a-ligne b{font-size:20px}
  .article{grid-template-columns:76px 1fr;column-gap:14px}
  .article[data-photo]{cursor:pointer}
  .a-vide{font-size:34px}
  .a-vue{width:76px;height:76px;border-radius:14px}
  .a-photo{display:none!important;position:absolute;right:0;top:18px;width:32px;height:32px;border-radius:50%;background:var(--abysse) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%233fd7ff' stroke-width='1.8'%3E%3Crect x='1.5' y='3.5' width='13' height='10' rx='2'/%3E%3Ccircle cx='8' cy='8.5' r='2.6'/%3E%3C/svg%3E") center no-repeat;box-shadow:0 0 10px #3fd7ff66}
  .article[data-photo] .a-ligne .px{padding-right:0}
  .feuille{display:block;position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:88svh;border:0;border-radius:26px 26px 0 0;padding:0 0 30px;background:#fff;color:var(--encre);transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.8,.2,1);overflow:auto;visibility:hidden}
  .feuille[open]{transform:none;visibility:visible}
  .feuille::backdrop{background:#06183d99;backdrop-filter:blur(4px)}
  .feuille .poignee{display:block;width:44px;height:5px;border-radius:9px;background:var(--trait);margin:10px auto}
  .feuille .fermer{position:absolute;right:14px;top:14px;width:42px;height:42px;border-radius:50%;border:0;background:#fffe;font-size:24px;z-index:2;box-shadow:0 4px 14px #0003}
  .feuille img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
  .feuille .f-corps{padding:18px 22px 0}
  .feuille .a-photo,.feuille .a-vue{display:none!important}
}
.rubrique[hidden],.article[hidden]{display:none!important}
.page-carte .tete{background:#06183de6;backdrop-filter:blur(14px)}
@media (max-width:900px){.feuille img{aspect-ratio:4/3;max-height:46svh}}