/* Page d'accueil multi-restaurants. L'univers se règle dans la fiche (Design) en redéfinissant les variables de .cmd. */
.cmd{--c-bg:#f5f3ee;--c-pan:#fff;--c-pan2:#ebe8e0;--c-tx:#0b0c14;--c-mut:#6b6f85;--c-line:#dedbd2;--c-acc:#0b0c14;--c-acc2:#c9381c;--c-onacc:#fff;--c-f-d:'Bricolage Grotesque',system-ui,sans-serif;--c-f-b:'Manrope',system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.cmd-body{background:#fbf8f2}
.acc{min-height:100vh;background:var(--c-bg);color:var(--c-tx);font:16px/1.55 var(--c-f-b)}
.acc a{color:inherit;text-decoration:none}
.acc h1,.acc h2,.acc h3,.acc .o{font-family:var(--c-f-d)}
.acc .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px var(--c-f-d);letter-spacing:.02em;border-radius:99px;padding:14px 24px;transition:.2s;border:0;cursor:pointer}
.acc .btn.p{background:var(--c-acc);color:var(--c-onacc)}.acc .btn.p:hover{filter:brightness(1.1)}
.acc .btn.g{border:1px solid color-mix(in srgb,var(--c-tx) 28%,transparent);color:var(--c-tx)}.acc .btn.g:hover{border-color:var(--c-acc);color:var(--c-acc)}
.acc .hero{position:relative;min-height:88vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:60px 20px 90px}
.acc .hero .bg{position:absolute;left:-6%;top:-6%;width:112%;height:112%;background:center/cover;animation:acc-zoom 22s ease-in-out infinite alternate}
@keyframes acc-zoom{from{transform:scale(1)}to{transform:scale(1.12) translateY(-1%)}}
.acc .hero:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--c-bg) 90%,transparent) 0,color-mix(in srgb,var(--c-bg) 70%,transparent) 55%,color-mix(in srgb,var(--c-bg) 56%,transparent) 100%),linear-gradient(#0000 60%,var(--c-bg) 100%)}
.acc .hero>div.tx{position:relative;z-index:2;width:100%;max-width:760px}
.acc .hero .s{width:96px;height:auto;margin:0 auto 18px;display:block;animation:acc-fade 1.2s both}
.acc .hero .w{width:min(440px,78vw);height:auto;margin:0 auto;display:block;animation:acc-fade 1.2s .15s both}
.acc .hero .nm{font:700 clamp(34px,6vw,56px) var(--c-f-d);animation:acc-fade 1.2s .15s both}
.acc .hero h1{font-size:clamp(20px,3.4vw,30px);font-weight:300;letter-spacing:.34em;text-transform:uppercase;margin-top:22px;animation:acc-fade 1.2s .3s both}
.acc .hero p{margin:14px auto 0;max-width:30em;color:var(--c-mut);font-size:16.5px;animation:acc-fade 1.2s .45s both}
.acc .hero .cta{margin-top:30px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap;animation:acc-fade 1.2s .6s both}
@keyframes acc-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.acc .scroll{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:2;width:22px;height:36px;border:1.5px solid color-mix(in srgb,var(--c-tx) 35%,transparent);border-radius:99px}
.acc .scroll:after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:3px;background:var(--c-acc);animation:acc-sc 1.8s infinite}
@keyframes acc-sc{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(12px)}}
.acc section{padding:72px 20px}.acc .wrap{max-width:1120px;margin:0 auto}
.acc .kick{font:500 12px var(--c-f-d);letter-spacing:.28em;text-transform:uppercase;color:var(--c-acc);text-align:center}
.acc h2{font-size:clamp(28px,4.4vw,44px);font-weight:700;text-align:center;line-height:1.1;margin:8px 0 10px}
.acc .lead{text-align:center;color:var(--c-mut);max-width:34em;margin:0 auto 38px}
.acc .sites{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.acc .site{position:relative;min-height:520px;border-radius:24px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;isolation:isolate;border:1px solid var(--c-line);color:#fff}
.acc .site .ph{position:absolute;inset:0;background-size:cover;background-position:center;z-index:-2;transition:transform .9s}.acc .site:hover .ph{transform:scale(1.06)}
.acc .site:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(#0000 0,#000e 88%)}
.acc .badge{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;font:600 12px var(--c-f-d);letter-spacing:.08em;text-transform:uppercase;background:#000a;border:1px solid #ffffff2a;border-radius:99px;padding:6px 14px;backdrop-filter:blur(6px);margin-bottom:auto}
.acc .badge i{width:8px;height:8px;border-radius:50%;background:#7bd88f;box-shadow:0 0 0 0 #7bd88f;animation:acc-pulse 2s infinite}.acc .badge.off i{background:#e0795f;animation:none}
@keyframes acc-pulse{70%{box-shadow:0 0 0 7px #7bd88f00}100%{box-shadow:0 0 0 0 #7bd88f00}}
.acc .site h3{font-size:clamp(32px,4.6vw,48px);font-weight:700;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.acc .site address{font-style:normal;color:#e6e0d4;margin-top:8px;font-size:15px}.acc .site .meta{color:#c9c3b6;font-size:13.5px;margin-top:4px}
.acc .site .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.acc .site .acts .btn{padding:13px 20px;font-size:14.5px}
.acc .site .btn.g{color:#fff;border-color:#ffffff55}
.acc .site .soon{font-size:12.5px;color:#e5de9a;margin-top:12px;letter-spacing:.04em}
.acc .alt{background:var(--c-pan)}
.acc .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.acc .step{background:var(--c-pan2);border:1px solid var(--c-line);border-radius:20px;padding:26px}
.acc .step i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--c-acc);color:var(--c-onacc);font:700 16px var(--c-f-d);font-style:normal;margin-bottom:14px}
.acc .step b{display:block;font:600 19px var(--c-f-d);margin-bottom:6px}.acc .step p{color:var(--c-mut);font-size:14.5px}
.acc .code{display:inline-block;margin-top:12px;font:700 22px var(--c-f-d);letter-spacing:.08em;color:var(--c-acc2);border:1.5px dashed var(--c-acc);border-radius:12px;padding:6px 16px}
.acc .strip{display:flex;gap:12px;overflow-x:auto;padding:4px 20px 10px;scrollbar-width:none;margin:0 -20px}.acc .strip::-webkit-scrollbar{display:none}
.acc .cat{flex:none;width:170px;height:240px;border-radius:18px;background-size:cover;background-position:center;position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:14px;border:1px solid var(--c-line);transition:transform .3s;color:#fff}
.acc .cat:hover{transform:translateY(-4px)}.acc .cat:after{content:"";position:absolute;inset:0;background:linear-gradient(#0000 40%,#000e)}.acc .cat b{position:relative;z-index:1;font:600 16px/1.15 var(--c-f-d)}
.acc .more{text-align:center;margin-top:28px}
.acc footer{padding:44px 20px 50px;border-top:1px solid var(--c-line);text-align:center;color:var(--c-mut);font-size:13.5px}
.acc footer .row{display:flex;gap:44px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}
.acc footer b{display:block;font:600 14px var(--c-f-d);letter-spacing:.14em;text-transform:uppercase;color:var(--c-tx);margin-bottom:4px}
.acc footer img{height:34px;margin-bottom:22px}
@media(max-width:820px){.acc .site{min-height:440px;padding:24px}.acc section{padding:56px 20px}.acc .hero{min-height:84vh}}
@media(prefers-reduced-motion:reduce){.acc *{animation:none!important}}

.acc .site .ordp{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:5px 12px;border-radius:99px;font:500 12.5px var(--c-f-b);background:#ffffff12;border:1px solid #ffffff22;color:#e6e0d4}
.acc .site .ordp i{width:8px;height:8px;border-radius:50%;background:#7bd88f}.acc .site .ordp.off{border-color:#e0795f88;color:#f0b3a3}.acc .site .ordp.off i{background:#e0795f}

/* Crédit photo en pied de la page d'accueil */
.acc footer .cred{margin-top:14px;font-size:12px;opacity:.75}.acc footer .cred a{color:inherit;text-decoration:none;border-bottom:1px solid color-mix(in srgb,currentColor 35%,transparent)}

/* Page de transition : « bientôt » tant que la commande en ligne n'est pas ouverte */
.acc .btn.pre{cursor:default;opacity:.85;border-style:dashed}.acc .btn.pre:hover{border-color:color-mix(in srgb,var(--c-tx) 28%,transparent);color:var(--c-tx)}
.acc section.pre .steps{opacity:.55}.acc section.pre .step i{background:var(--c-line);color:var(--c-mut)}

/* Mobile : le restaurant qui prend les commandes passe en premier ; « Voir la carte » en bouton pleine largeur, téléphone et itinéraire dessous, côte à côte */
@media(max-width:700px){
.acc .sites{display:flex;flex-direction:column}.acc .site.ord{order:-1}
.acc .site .acts .btn{flex:1 1 calc(50% - 5px);justify-content:center;text-align:center}
.acc .site .acts .btn.p{flex:1 1 100%}
}
