@font-face{font-family:'Baby Stingrays';src:url(../fonts/font-01-f5dd4588a2.woff2) format('woff2');font-display:swap}
  :root{
    --blue-900:#01245f; --blue-800:#013db9; --blue-700:#0a4fd0;
    --blue-500:#2f6fe0; --blue-300:#86b0f2; --blue-050:#eaf1fd;
    --orange:#013db9; --orange-dark:#012a80; --orange-light:#cde0ff;
    --white:#fff; --off:#f6f8fc; --ink:#132038; --muted:#5b6a86; --line:#e4eaf5;
    --shadow:0 20px 45px -20px rgba(14,42,94,.35);
    --shadow-sm:0 8px 24px -12px rgba(14,42,94,.28);
    --radius:20px; --radius-sm:14px; --max:1180px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  h1,h2,h3,.display{font-family:'Poppins',sans-serif;line-height:1.1;letter-spacing:-.02em}
  h1,h2{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;letter-spacing:.02em;line-height:.98;font-weight:400}
  a{text-decoration:none;color:inherit}
  img{max-width:100%;display:block}
  .wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 24px}

  /* Écran de chargement — petit âne qui court (voir #donkey-loader dans
     templates/partials/header.php). Caché par défaut : donkey-base.js ne
     l'affiche (.is-visible) que si le chargement dépasse un court délai,
     pour ne jamais clignoter inutilement sur un chargement rapide — voir
     la fin de donkey-base.js pour le détail du minutage. */
  #donkey-loader{position:fixed;inset:0;z-index:9999;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility .35s ease}
  #donkey-loader.is-visible{opacity:1;visibility:visible;pointer-events:auto}
  .donkey-run{animation:dr-bob .5s ease-in-out infinite}
  .dr-leg{transform-box:fill-box;transform-origin:top center;animation:dr-swing .5s ease-in-out infinite}
  .dr-leg-fr,.dr-leg-bl{animation-delay:0s}
  .dr-leg-fl,.dr-leg-br{animation-delay:.25s}
  .dr-tail{transform-box:fill-box;transform-origin:top center;animation:dr-tail .5s ease-in-out infinite}
  .dr-ear{transform-box:fill-box;transform-origin:bottom center;animation:dr-ear .5s ease-in-out infinite}
  .donkey-loader-dust{width:60px;height:10px;margin-top:6px;position:relative}
  .donkey-loader-dust::before,.donkey-loader-dust::after{content:"";position:absolute;bottom:0;left:26px;width:8px;height:8px;border-radius:50%;background:rgba(185,138,85,.35);animation:dr-dust 1s ease-out infinite}
  .donkey-loader-dust::after{animation-delay:.5s}
  @keyframes dr-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
  @keyframes dr-swing{0%,100%{transform:rotate(-20deg)}50%{transform:rotate(20deg)}}
  @keyframes dr-tail{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
  @keyframes dr-ear{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
  @keyframes dr-dust{0%{transform:scale(.3) translateX(0);opacity:.6}100%{transform:scale(1.4) translateX(-22px);opacity:0}}
  .eyebrow{display:inline-block;font-family:'Poppins';font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:14px}
  .eyebrow.on-dark{color:var(--orange-light)}

  /* Mascot pins */
  .pin{position:absolute;width:88px;height:88px;pointer-events:none;z-index:3;filter:drop-shadow(0 8px 14px rgba(0,0,0,.28));opacity:.96}
  .pin.small{width:60px;height:60px}

  /* Buttons */
  .btn{display:inline-flex;align-items:center;gap:10px;justify-content:center;font-family:'Poppins';font-weight:700;font-size:1rem;padding:15px 26px;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s;white-space:nowrap}
  .btn svg{width:20px;height:20px;flex:none}
  .btn-orange{background:#fff;color:var(--blue-800);box-shadow:0 10px 26px -10px rgba(1,36,95,.4)}
  .btn-orange:hover{background:#eaf1fd;transform:translateY(-2px)}
  .btn-blue{background:var(--blue-800);color:#fff}
  .btn-blue:hover{background:var(--blue-700);transform:translateY(-2px)}
  .btn-outline{background:transparent;color:var(--blue-800);border-color:var(--line)}
  .btn-outline:hover{border-color:var(--blue-500);transform:translateY(-2px)}
  .btn-ghost-light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.35)}
  .btn-ghost-light:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}
  .btn-white{background:#fff;color:var(--orange)}
  .btn-white:hover{background:#eaf1fd;transform:translateY(-2px)}
  .btn-ubereats{background:#06c167;color:#0a2617}
  .btn-ubereats:hover{background:#05a959;transform:translateY(-2px)}
  .btn-deliveroo{background:#00ccbc;color:#013b37}
  .btn-deliveroo:hover{background:#00b3a6;transform:translateY(-2px)}
  .btn-justeat{background:#ff8000;color:#fff}
  .btn-justeat:hover{background:#e67300;transform:translateY(-2px)}

  /* Nav */
  header.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:padding .25s;padding:18px 0}
  header.nav.scrolled{padding:12px 0}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;background:rgba(1,36,95,.34);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:9px 12px 9px 18px;transition:background .3s,box-shadow .3s,border-color .3s}
  header.nav.scrolled .nav-inner{background:rgba(255,255,255,.94);border-color:transparent;box-shadow:0 14px 34px -16px rgba(1,36,95,.45)}
  .logo{display:flex;align-items:center;gap:11px;color:#fff;transition:color .25s}
  .logo-word{height:32px;width:auto;display:block;filter:drop-shadow(0 3px 8px rgba(0,0,0,.30))}
  .logo-mark2{height:40px;width:auto;display:block;filter:drop-shadow(0 3px 8px rgba(0,0,0,.30))}
  header.nav.scrolled .logo-mark2{filter:invert(1)}
  footer .logo-mark2{display:none}
  header.nav.scrolled .logo-word{filter:invert(1)}
  footer .logo-word{height:36px}
  .logo .lg-name{display:flex;flex-direction:column;line-height:1;font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;letter-spacing:.03em;font-size:1.5rem;font-weight:400}
  .logo small{font-family:'Inter',sans-serif;font-weight:600;font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:#bcd3ff;margin-top:3px}
  header.nav.scrolled .logo{color:var(--blue-900)}
  header.nav.scrolled .logo small{color:var(--blue-500)}
  .nav-links{display:flex;align-items:center;gap:28px}
  .nav-links a{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;letter-spacing:.05em;font-weight:400;font-size:1.12rem;color:rgba(255,255,255,.92);transition:color .2s}
  header.nav.scrolled .nav-links a{color:var(--muted)}
  .nav-links a:hover{color:#fff}
  header.nav.scrolled .nav-links a:hover{color:var(--blue-800)}
  .nav-cta{display:flex;align-items:center;gap:12px}
  .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
  .burger span{width:26px;height:2.5px;background:#fff;border-radius:2px;transition:.25s}
  header.nav.scrolled .burger span{background:var(--blue-900)}
  .mobile-menu{position:fixed;inset:0;z-index:99;background:var(--blue-900);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:26px;transform:translateY(-100%);transition:transform .35s cubic-bezier(.7,0,.3,1)}
  .mobile-menu.open{transform:translateY(0)}
  .mobile-menu a{color:#fff;font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;letter-spacing:.04em;font-weight:400;font-size:1.9rem}
  .mobile-menu a:hover{color:var(--orange)}
  .mobile-menu a.btn-orange{color:var(--blue-800);font-size:1.1rem}
  .mobile-menu a.btn-orange:hover{color:var(--blue-700)}
  .mobile-close{position:absolute;top:24px;right:24px;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer}

  /* Hero cover — .hero-bg{position:absolute;inset:0} donne bien à ce div
     une hauteur "utilisée" de 100% de .hero (visible en JS/DevTools), mais
     cette hauteur est dérivée du positionnement (top/bottom), pas déclarée
     explicitement : un <img> normal en flux (position:static) avec
     height:100% ne "voit" donc pas cette hauteur comme définie et retombe
     sur sa hauteur intrinsèque (ratio naturel), laissant la photo trop
     courte pour couvrir tout le bloc — invisible sur desktop (l'image y
     est naturellement plus haute que le bloc, donc l'excédent est juste
     rogné par overflow:hidden), mais très visible sur mobile/tablette où
     le bloc est plus haut que large. Fix : .hero-bg passe en grid, l'image
     devient un item de grille qui s'étire par défaut sur toute la cellule
     (grid-area:1/1) — un mécanisme de dimensionnement qui ne dépend pas de
     la résolution de pourcentage, donc fiable sur toutes les tailles
     d'écran. Aucun changement visuel sur desktop (le rendu était déjà
     correct par ce rognage), corrige mobile et tablette. */
  .hero{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden;padding:150px 20px 120px}
  .hero-bg{position:absolute;inset:0;z-index:0;display:grid}
  .hero-bg img{grid-area:1/1;width:100%;height:100%;object-fit:cover}
  .hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,61,185,.80),rgba(1,61,185,.86))}
  .hero-inner{position:relative;z-index:3;max-width:940px;margin:0 auto}
  .cover-eyebrow{font-family:'Inter',sans-serif;font-weight:700;letter-spacing:.26em;text-transform:uppercase;font-size:.78rem;color:#cfe0ff;margin-bottom:22px}
  .cover-title{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;line-height:.9;font-weight:400;margin:0}
  .cover-title .l1{display:block;font-size:clamp(3.6rem,12vw,7.6rem);color:transparent;-webkit-text-stroke:2.5px #fff;letter-spacing:.02em}
  .cover-title .l2{display:inline-block;font-size:clamp(3rem,10.5vw,6.6rem);background:#fff;color:var(--blue-800);padding:.04em .3em .14em;border-radius:20px;margin-top:.08em;box-shadow:0 20px 46px -20px rgba(0,0,0,.55)}
  .cover-desc{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:clamp(1.05rem,2.6vw,1.7rem);margin-top:26px}
  .cover-cta{margin-top:34px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
  .cover-cta .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75)}
  .cover-cta .btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff}
  .btn-tilt{transform:rotate(-4deg)}
  .btn-tilt:hover{transform:rotate(0) translateY(-2px)}
  .cover-cta .btn{background:#fff;color:var(--blue-800);border:3px solid var(--blue-900);font-size:1.08rem;padding:15px 40px}
  .cover-cta .btn:hover{background:#eaf1fd;transform:translateY(-2px)}
  .hero-wave{position:absolute;left:0;bottom:-1px;width:100%;z-index:2;line-height:0}
  .hero-wave svg{width:100%;height:clamp(52px,7vw,112px);display:block}
  .hero-bubble{position:absolute;right:6%;bottom:12%;z-index:4;width:80px;height:80px;border-radius:24px 24px 24px 6px;background:#fff;display:grid;place-items:center;box-shadow:0 18px 40px -14px rgba(1,36,95,.6);transform:rotate(-6deg);animation:bubble 6s ease-in-out infinite}
  .hero-bubble img{width:58px;height:58px}
  @keyframes bubble{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-11px) rotate(-6deg)}}
  @media(max-width:600px){.hero-bubble{width:62px;height:62px;bottom:16%}.hero-bubble img{width:44px;height:44px}}

  /* Marquee : le bandeau est incliné à -3deg et sa largeur suit la largeur
     d'écran (114%), donc le débord vertical dû à la rotation grandit lui
     aussi avec la largeur d'écran (règle géométrique : largeur × sin(3°)).
     Un padding fixe était soit insuffisant sur grand écran (texte coupé en
     haut/bas, ~23px manquants à 1920px) soit excessif sur petit écran. Le
     padding en vw suit exactement ce débord à toutes les tailles — juste
     l'espace nécessaire, jamais plus. */
  .marquee-wrap{background:#fff;overflow:hidden;padding:3.3vw 0;position:relative;z-index:4}
  .marquee{background:#013db9;color:#fff;overflow:hidden;white-space:nowrap;padding:16px 0;transform:rotate(-3deg);width:114%;margin-left:-7%;box-shadow:0 16px 36px -16px rgba(1,36,95,.55)}
  .marquee-track{display:inline-flex;align-items:center;gap:0;animation:scroll 26s linear infinite;font-family:'Baby Stingrays','Poppins',sans-serif;font-weight:400;letter-spacing:.04em;text-transform:uppercase;font-size:clamp(1.7rem,4.4vw,3.1rem)}
  .marquee-track span{display:inline-flex;align-items:center;gap:34px;padding-right:34px}
  .mq-donkey{width:64px;height:64px;flex:none;background:url(../images/img-01-2ca3bd4f17.png) center/contain no-repeat}
  @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  .sec{padding:100px 0;position:relative;overflow:hidden}
  .sec-head{max-width:640px;margin-bottom:56px}
  .sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
  .sec-head h2{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin-bottom:16px}
  .sec-head p{color:var(--muted);font-size:1.1rem}

  /* Concept */
  .concept{background:var(--off)}
  .concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
  .concept-visual{aspect-ratio:1/1;border-radius:26px;position:relative;overflow:hidden;box-shadow:var(--shadow);background:linear-gradient(150deg,var(--blue-700),var(--blue-900))}
  .concept-visual img{width:100%;height:100%;object-fit:cover;opacity:.92}
  .feature-list{display:grid;gap:22px;margin-top:8px}
  .feature{display:flex;gap:16px;align-items:flex-start}
  .feature .ic{width:48px;height:48px;flex:none;border-radius:14px;background:var(--blue-050);display:grid;place-items:center;color:var(--blue-800)}
  .feature .ic svg{width:24px;height:24px}
  .feature h3{font-size:1.15rem;margin-bottom:4px}
  .feature p{color:var(--muted);font-size:.98rem}

  /* Menu */
  .menu-cats{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:40px}
  .cat-btn{font-family:'Inter',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;padding:12px 22px;border-radius:12px;border:2px solid var(--blue-800);background:#fff;color:var(--blue-800);cursor:pointer;transition:.2s}
  .cat-btn.active,.cat-btn:hover{background:var(--blue-900);border-color:var(--blue-900);color:#fff}
  .menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  .dish{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .22s;display:flex;flex-direction:column}
  .dish:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
  .dish .thumb{aspect-ratio:16/11;position:relative;background:linear-gradient(135deg,var(--blue-050),#dfe9fb);overflow:hidden}
  .dish .thumb img{width:100%;height:100%;object-fit:cover}
  .dish .tag{position:absolute;top:12px;left:12px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:var(--orange);padding:5px 11px;border-radius:999px;box-shadow:0 4px 10px -3px rgba(0,0,0,.4)}
  .dish .tag.veggie{background:#2e9e5b}
  /* Même badge, mais pour le markup réellement utilisé (.mdish-photo .tag)
     — ".dish" ci-dessus ne correspond à rien dans les templates actuels,
     ce qui laissait le badge s'afficher en texte brut sans fond. */
  .mdish-photo .tag{position:absolute;top:12px;left:12px;z-index:1;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:var(--orange);padding:5px 11px;border-radius:999px;box-shadow:0 4px 10px -3px rgba(0,0,0,.4)}
  .mdish-photo .tag.veggie{background:#2e9e5b}
  .dish-body{padding:20px 22px;display:flex;flex-direction:column;gap:8px}
  .dish .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
  .dish h3{font-size:1.12rem}
  .dish .price{font-family:'Poppins';font-weight:800;color:var(--orange);font-size:1.12rem;white-space:nowrap}
  .dish p{color:var(--muted);font-size:.9rem}
  .menu-note{text-align:center;margin-top:34px;color:var(--muted);font-size:.95rem}

  /* Order */
  .order{background:linear-gradient(160deg,var(--blue-900),var(--blue-700));color:#fff}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:0 0 56px}
  .step{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:30px 26px;text-align:center}
  .step .num{width:52px;height:52px;margin:0 auto 18px;border-radius:50%;background:#fff;color:var(--blue-800);display:grid;place-items:center;font-family:'Poppins';font-weight:800;font-size:1.3rem}
  .step h3{font-size:1.2rem;margin-bottom:8px}
  .step p{color:rgba(255,255,255,.78);font-size:.96rem}
  .order-cta{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:26px;padding:40px;text-align:center;position:relative}
  .order-cta h3{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:10px}
  .order-cta p{color:rgba(255,255,255,.8);margin-bottom:28px}
  .delivery-btns{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
  .delivery-btns .btn{font-size:1.05rem;padding:17px 30px}

  /* Loukoumades highlight */
  .louk{background:var(--off)}
  .louk-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
  .louk-photo{aspect-ratio:5/4;border-radius:26px;overflow:hidden;box-shadow:var(--shadow);position:relative;border:5px solid #fff;transform:rotate(-1.4deg)}
  .louk-photo img{width:100%;height:100%;object-fit:cover}

  /* Infos */
  .infos-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:stretch}
  .info-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px}
  .info-block{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
  .info-block:last-child{border-bottom:0;padding-bottom:0}
  .info-block .ic{width:46px;height:46px;flex:none;border-radius:12px;background:var(--orange);display:grid;place-items:center;color:#fff}
  .info-block .ic svg{width:22px;height:22px}
  .info-block h3{font-size:1.05rem;margin-bottom:2px}
  .info-block p{color:var(--muted);font-size:.96rem}
  .hours{display:grid;gap:8px;margin-top:6px}
  .hours .h-row{display:flex;justify-content:space-between;font-size:.95rem;color:var(--muted)}
  .hours .h-row b{color:var(--ink);font-weight:600}
  .map{border-radius:var(--radius);overflow:hidden;min-height:360px;border:1px solid var(--line);background:linear-gradient(rgba(14,42,94,.06),rgba(14,42,94,.06)),repeating-linear-gradient(0deg,#e9eff8 0 39px,#dde7f6 39px 40px),repeating-linear-gradient(90deg,#e9eff8 0 39px,#dde7f6 39px 40px);display:grid;place-items:center;position:relative}
  .map .pinbox{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--blue-800);text-align:center}
  .map .pinbox svg{width:46px;height:46px;color:var(--orange);filter:drop-shadow(0 6px 10px rgba(0,0,0,.2))}
  .map .pinbox b{font-family:'Poppins';font-size:1.05rem}

  /* CTA band */
  .cta-band{background:var(--orange);color:#fff;text-align:center;padding:80px 0;position:relative;overflow:hidden}
  .cta-band h2{font-size:clamp(1.8rem,4vw,2.8rem);margin-bottom:14px}
  .cta-band p{opacity:.95;font-size:1.1rem;margin-bottom:30px}
  .cta-band .btn-blue{background:var(--blue-900)}
  .cta-band .btn-blue:hover{background:var(--blue-800)}

  /* Footer */
  footer{background:var(--blue-900);color:rgba(255,255,255,.7);padding:64px 0 30px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:44px}
  footer .logo{color:#fff;margin-bottom:16px}
  footer p.about{max-width:320px;font-size:.95rem}
  footer h4{color:#fff;font-family:'Poppins';font-size:1rem;margin-bottom:16px}
  footer ul{list-style:none;display:grid;gap:10px}
  footer ul a{font-size:.95rem;transition:.2s}
  footer ul a:hover{color:var(--orange)}
  .socials{display:flex;gap:12px;margin-top:6px}
  .socials a{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.08);display:grid;place-items:center;color:#fff;transition:.2s}
  .socials a:hover{background:var(--orange)}
  .socials svg{width:20px;height:20px}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.85rem}

  /* Barre de commande mobile — repensée en barre flottante façon iOS
     (verre dépoli, coins arrondis, détachée des bords et de l'encoche
     du bas) plutôt qu'une barre plaquée aux bords avec 3 blocs pleine
     couleur façon Android/vieux web : chaque plateforme redevient un
     simple libellé + pastille de couleur dans un même "segmented
     control", avec un retour tactile au tap (scale) plutôt qu'un hover. */
  .mobile-order{position:fixed;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:90;display:none;background:rgba(255,255,255,.78);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.6);border-radius:20px;box-shadow:0 18px 40px -18px rgba(1,36,95,.5);padding:6px;gap:2px}
  .mobile-order .btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;background:transparent;color:var(--blue-900);padding:12px 4px;border-radius:15px;font-family:'Poppins',sans-serif;font-weight:700;font-size:.74rem;transition:background .15s ease,transform .15s ease}
  .mobile-order .btn::before{content:'';width:8px;height:8px;border-radius:50%;flex:none}
  .mobile-order .btn-ubereats::before{background:#06c167}
  .mobile-order .btn-deliveroo::before{background:#00ccbc}
  .mobile-order .btn-justeat::before{background:#ff8000}
  .mobile-order .btn:active{transform:scale(.94);background:rgba(1,36,95,.08)}

  .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s,transform .7s}
  .reveal.in{opacity:1;transform:none}

  @media(max-width:900px){
    .nav-links{display:none}.nav-cta .btn:not(.burger){display:none}.burger{display:flex}
    .hero-grid,.concept-grid,.infos-grid,.louk-grid{grid-template-columns:1fr;gap:36px}
    .hero-photo{max-width:420px;margin:0 auto}
    .menu-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}
    .foot-grid{grid-template-columns:1fr 1fr}
    .mobile-order{display:flex}body{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
    .pin{width:64px;height:64px}
  }
  @media(max-width:560px){
    .menu-grid{grid-template-columns:1fr}.foot-grid{grid-template-columns:1fr}
    .sec{padding:72px 0}.hero-actions .btn{flex:1}
    /* Bloc "Prêt à vous régaler ?" (.order-cta, partagé home/concept/menu) :
       les boutons Uber Eats/Deliveroo/Just Eat sont surdimensionnés sur
       mobile (padding + police plus grands que le bouton standard) — on
       les ramène à une taille plus sobre, carte elle-même resserrée. */
    .order-cta{padding:28px 20px}
    .order-cta h3{font-size:1.5rem}
    .delivery-btns{gap:10px}
    .delivery-btns .btn{font-size:.92rem;padding:13px 20px;gap:8px}
    .delivery-btns .btn svg{width:16px;height:16px}
  }
  /* Filet de sécurité responsive pour tous les boutons du site (.btn est
     white-space:nowrap par défaut, pour garder l'icône + le texte sur une
     seule ligne). Sur les téléphones les plus étroits (~360px et moins,
     type Android d'entrée de gamme), un libellé long comme "Découvrir
     l'histoire des loukoumades" dépasse la largeur de l'écran et le texte
     est coupé au bord — repéré sur /le-concept/, potentiellement présent
     sur n'importe quelle page avec un bouton au texte long. On autorise le
     retour à la ligne uniquement ici : un bouton qui tient déjà sur une
     ligne n'est pas affecté (le navigateur ne casse le texte que s'il n'a
     pas la place), donc aucun changement visuel pour les boutons courts. */
  @media(max-width:480px){
    .btn{white-space:normal;max-width:100%;text-align:center}
  }
  /* Wave dividers (façon Gyraya) */
  .wave{position:absolute;top:0;left:0;width:100%;line-height:0;transform:translateY(-1px);z-index:2;pointer-events:none}
  .wave svg{width:100%;height:clamp(38px,5vw,72px);display:block}
  footer{position:relative}
  .order,.louk,.cta-band{padding-top:130px}
  header.nav.scrolled .nav-cta .btn-orange{background:var(--blue-800);color:#fff}
  .mobile-menu a:hover,footer ul a:hover{color:var(--blue-300)}

  /* Stickers & hearts (instagrammable) */
  .sticker{position:absolute;pointer-events:none;z-index:3;filter:drop-shadow(0 0 2px rgba(255,255,255,.95)) drop-shadow(0 5px 8px rgba(0,0,0,.22));animation:bob 6s ease-in-out infinite}
  .heart{position:absolute;pointer-events:none;z-index:3;filter:drop-shadow(0 0 1.5px #fff) drop-shadow(0 3px 5px rgba(0,0,0,.2));animation:bob 5s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-9px) rotate(var(--r,0deg))}}
  @media(max-width:700px){.sticker,.heart{display:none}.sticker.keep,.heart.keep{display:block}}

  @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

  /* Community */
  .community{background:var(--off)}
  .community-card{background:linear-gradient(150deg,var(--blue-700),var(--blue-900));color:#fff;border-radius:28px;padding:clamp(40px,6vw,64px) clamp(24px,5vw,52px);text-align:center;max-width:840px;margin:0 auto;position:relative;overflow:visible;box-shadow:var(--shadow)}
  .community-card h2{font-size:clamp(2.1rem,5vw,3.4rem);margin:6px 0 14px}
  .community-card p{color:rgba(255,255,255,.85);max-width:580px;margin:0 auto 30px;font-size:1.06rem}
  .signup{display:flex;gap:12px;max-width:540px;margin:0 auto}
  .signup input{flex:1;min-width:0;border:0;border-radius:999px;padding:16px 24px;font-family:'Inter',sans-serif;font-size:1rem;background:#fff;color:var(--ink)}
  .signup input:focus{outline:3px solid rgba(255,255,255,.45)}
  .signup .btn{white-space:nowrap}
  .signup-note{display:block;margin-top:16px;color:rgba(255,255,255,.6);font-size:.82rem}
  @media(max-width:560px){.signup{flex-direction:column}.signup .btn{width:100%}}
  /* Modern footer */
  .foot-modern{display:flex;flex-direction:column;gap:26px}
  .foot-top{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.12)}
  .foot-links{display:flex;gap:24px;flex-wrap:wrap;justify-content:center}
  .foot-links a{color:rgba(255,255,255,.72);font-size:.95rem;transition:.2s}
  .foot-links a:hover{color:#fff}
  .foot-modern .foot-bottom{border-top:0;padding-top:0;justify-content:space-between;color:rgba(255,255,255,.5)}
  @media(max-width:760px){.foot-top{flex-direction:column;text-align:center}}

  /* Greek key (méandre) separators + eye */
  .greek-band{height:46px;background-color:#013db9;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='40'%20height='40'%3E%3Cpath%20d='M0%2040V0H40V40M8%2040V8H32V32H16V16H24V24'%20fill='none'%20stroke='%23ffffff'%20stroke-width='3'/%3E%3C/svg%3E");background-repeat:repeat-x;background-position:center;background-size:40px 40px}
  .greek-band.light{background-color:#eaf1fd;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='40'%20height='40'%3E%3Cpath%20d='M0%2040V0H40V40M8%2040V8H32V32H16V16H24V24'%20fill='none'%20stroke='%23013db9'%20stroke-width='3'/%3E%3C/svg%3E")}
  .eye-wm{position:absolute;width:min(44vw,400px);height:auto;opacity:.12;pointer-events:none;z-index:1}
  .order .eye-wm{right:-60px;top:30px}
  .community-card{isolation:isolate}
  .community-card .eye-wm{opacity:.16;width:200px;right:-24px;bottom:-30px}
  .community-card>*{position:relative;z-index:2}

  /* Composer (carte) */
  .composer{background:#013db9;color:#fff;overflow:hidden;padding-top:120px}
  .composer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1060px;margin:0 auto}
  .cc-photo{background:linear-gradient(135deg,#dfe9fb,#c3d6f5)}
  .menu-extra{max-width:1060px;margin:34px auto 0;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:28px 32px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .menu-extra .mx{display:flex;gap:16px;align-items:flex-start;text-align:left}
  .menu-extra .ic{width:54px;height:54px;flex:none;border-radius:15px;background:rgba(255,255,255,.15);display:grid;place-items:center}
  .menu-extra .ic svg{width:28px;height:28px}
  .menu-extra h4{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-size:1.2rem;font-weight:400;letter-spacing:.02em;color:#fff;margin-bottom:5px}
  .menu-extra p{color:rgba(255,255,255,.82);font-size:.92rem;line-height:1.5}
  @media(max-width:900px){.composer-grid{grid-template-columns:1fr 1fr;max-width:660px}.menu-extra{grid-template-columns:1fr;gap:20px;max-width:660px}}
  .compose-card{background:#fff;border-radius:26px;position:relative;box-shadow:0 34px 60px -34px rgba(0,0,0,.55);transition:transform .28s ease}
  .compose-card:hover{transform:translateY(-8px)}
  .cc-photo{margin:14px 14px 0;border-radius:20px;overflow:hidden}
  .cc-photo img{width:100%;aspect-ratio:16/11;object-fit:cover;display:block;transition:transform .5s ease}
  .compose-card:hover .cc-photo img{transform:scale(1.05)}
  .cc-body{padding:22px 26px 30px;text-align:center;color:var(--ink)}
  .cc-body h3{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;color:var(--blue-800);font-size:1.6rem;font-weight:400;letter-spacing:.02em;margin-bottom:10px}
  .cc-body p{color:var(--muted);font-size:.97rem;margin-bottom:16px;max-width:280px;margin-left:auto;margin-right:auto}
  .cc-price{font-family:'Inter',sans-serif;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:8px}
  .cc-price b{font-family:'Poppins',sans-serif;font-weight:800;font-size:1.35rem;letter-spacing:0;color:var(--blue-800)}
  .stamp{position:absolute;top:-30px;left:-26px;width:98px;height:98px;z-index:6;animation:spin 20s linear infinite;filter:drop-shadow(0 8px 16px rgba(1,36,95,.4))}
  @keyframes spin{to{transform:rotate(360deg)}}
  .stamp-house{animation:none;transform:rotate(-8deg)}
  .composer-cta{text-align:center;margin-top:46px}
  @media(max-width:760px){.composer-grid{grid-template-columns:1fr;gap:26px;max-width:420px}.stamp{width:78px;height:78px;top:-22px;left:-16px}}

  /* Notre carte (menu visible, style Gyraya) */
  .menu-visible{background:var(--off)}
  .menu-visible .menu-head{margin-bottom:26px}
  .menu-visible .menu-head h2{font-size:clamp(2.4rem,6vw,4rem);color:var(--blue-800);margin-top:6px}
  .menu-visible .menu-cats{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start;margin-bottom:46px}
  .menu-visible .menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
  .mdish{display:flex;flex-direction:column}
  .mdish-photo{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:1/1;margin-bottom:18px;box-shadow:0 22px 44px -26px rgba(1,36,95,.45)}
  .mdish-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .mdish:hover .mdish-photo img{transform:scale(1.06)}
  .mdish h3{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;color:var(--blue-800);font-size:1.6rem;font-weight:400;letter-spacing:.02em;margin-bottom:8px}
  .mdish p{color:var(--muted);font-size:.95rem;line-height:1.5;margin-bottom:16px;flex:1}
  .nutri{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;padding-top:14px;border-top:1px solid var(--line)}
  .nutri li{font-family:'Inter',sans-serif;font-size:.66rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-500)}
  @media(max-width:900px){.menu-visible .menu-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.menu-visible .menu-grid{grid-template-columns:1fr}}

  /* Loukoumades choices */
  .tag-phare{display:inline-block;font-family:'Inter',sans-serif;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:#fff;background:var(--blue-800);padding:6px 14px;border-radius:999px;margin-bottom:6px}
  .louk-choices{display:grid;gap:14px;margin:4px 0 26px}
  .lc-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
  .lc-label{font-family:'Inter',sans-serif;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--blue-500);width:78px;flex:none}
  .lc-group ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0}
  .lc-group li{font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:var(--blue-800);background:var(--blue-050);border:1px solid var(--line);padding:6px 13px;border-radius:999px;transition:.2s;cursor:default}
  .lc-group li:hover{background:var(--blue-800);color:#fff;border-color:var(--blue-800)}
  @media(max-width:520px){.lc-label{width:100%}}

  /* Loukoumades composer interactif */
  @keyframes loukfloat{0%,100%{transform:rotate(-1.4deg) translateY(0)}50%{transform:rotate(-1.4deg) translateY(-10px)}}
  .louk-photo{animation:loukfloat 6.5s ease-in-out infinite}
  .louk-photo:hover{animation-play-state:paused}
  .composer-box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px 22px;box-shadow:0 24px 46px -30px rgba(1,36,95,.45);margin:4px 0 22px}
  .cfg-row{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px dashed var(--line)}
  .cfg-row:last-of-type{border-bottom:0}
  .cfg-row.col{flex-direction:column;align-items:flex-start;gap:11px}
  .cfg-label{font-family:'Inter',sans-serif;font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--blue-800)}
  .cfg-label small{color:var(--muted);font-weight:500;letter-spacing:0;text-transform:none;font-size:.82em}
  .stepper{margin-left:auto;display:inline-flex;align-items:center;gap:16px;background:var(--blue-050);border-radius:999px;padding:5px 8px}
  .st-btn{width:34px;height:34px;border:0;border-radius:50%;background:var(--blue-800);color:#fff;font-size:1.35rem;line-height:1;font-weight:700;cursor:pointer;display:grid;place-items:center;transition:transform .15s,background .15s}
  .st-btn:hover{background:var(--blue-900);transform:scale(1.1)}
  .st-btn:active{transform:scale(.94)}
  .st-val{font-family:'Poppins',sans-serif;font-weight:800;font-size:1.25rem;color:var(--blue-900);min-width:28px;text-align:center}
  .chips{display:flex;flex-wrap:wrap;gap:8px}
  .chip{font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:var(--blue-800);background:#fff;border:1.5px solid var(--line);padding:7px 14px;border-radius:999px;cursor:pointer;transition:.18s;display:inline-flex;align-items:center;gap:6px}
  .chip:hover{border-color:var(--blue-500);transform:translateY(-1px)}
  .chip.active{background:var(--blue-800);border-color:var(--blue-800);color:#fff;box-shadow:0 6px 14px -6px rgba(1,61,185,.6)}
  .chip.active::before{content:"✓";font-size:.72rem;font-weight:800}
  .cfg-summary{font-family:'Inter',sans-serif;font-size:.9rem;line-height:1.5;color:var(--blue-900);background:linear-gradient(90deg,var(--blue-050),#fff);border-left:3px solid var(--blue-800);border-radius:10px;padding:12px 14px;margin-top:6px;transition:.2s}
  .cfg-summary b{color:var(--blue-800)}
  @media(prefers-reduced-motion:reduce){.louk-photo{animation:none}}

  /* Loukoumades réassurances */
  .louk-reassure{display:flex;flex-wrap:wrap;gap:12px 20px;margin:2px 0 20px}
  .lr-item{display:inline-flex;align-items:center;gap:9px;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:var(--blue-900)}
  .lr-item .ic{width:32px;height:32px;flex:none;border-radius:10px;background:var(--blue-050);display:grid;place-items:center;color:var(--blue-800)}
  .lr-item .ic svg{width:17px;height:17px}

  #sizeChips{gap:12px}
  .chip.size{width:58px;height:58px;min-width:0;padding:0;border-radius:14px;justify-content:center;font-family:'Poppins',sans-serif;font-weight:800;font-size:1.25rem;border-width:2px}
  .chip.size:hover{transform:translateY(-2px)}
  .chip.size.active{transform:none;box-shadow:0 10px 20px -8px rgba(1,61,185,.55)}
  .chip.size.active::before{content:none}

  /* Loukoumades — événements / traiteur */
  .louk-events{grid-column:1 / -1;margin-top:20px;background:linear-gradient(135deg,var(--blue-700),var(--blue-900));color:#fff;border-radius:26px;padding:36px 40px;display:flex;align-items:center;justify-content:space-between;gap:34px;flex-wrap:wrap;position:relative;overflow:hidden;box-shadow:var(--shadow)}
  .louk-events .eye-wm{right:-40px;top:-40px;opacity:.13;width:200px}
  .le-left{position:relative;z-index:2;max-width:640px}
  .louk-events h3{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-weight:400;font-size:clamp(1.6rem,3vw,2.3rem);margin:6px 0 10px;line-height:1}
  .louk-events p{color:rgba(255,255,255,.86);font-size:1rem;line-height:1.55;margin-bottom:16px}
  .le-tags{display:flex;flex-wrap:wrap;gap:9px}
  .le-tags span{font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:8px 14px;border-radius:999px}
  .le-right{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:9px;flex:none}
  .le-right small{color:rgba(255,255,255,.6);font-size:.78rem}
  @media(max-width:760px){.louk-events{padding:28px;flex-direction:column;align-items:flex-start}.le-right{align-items:flex-start}}

  /* Infos — localisation moderne */
  .infos-modern{background:var(--off)}
  .infos-grid2{display:grid;grid-template-columns:1fr 1.15fr;gap:30px;align-items:stretch}
  .loc-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px 32px;box-shadow:0 24px 48px -34px rgba(1,36,95,.42);display:flex;flex-direction:column}
  .loc-status{align-self:flex-start;display:inline-flex;align-items:center;gap:9px;font-family:'Inter',sans-serif;font-weight:700;font-size:.8rem;padding:8px 15px;border-radius:999px;margin-bottom:16px;background:var(--blue-050);color:var(--blue-800)}
  .loc-status .dot{width:9px;height:9px;border-radius:50%;background:var(--muted)}
  .loc-status.open{background:#e5f6ec;color:#1c7a43}
  .loc-status.open .dot{background:#22a75a;box-shadow:0 0 0 3px rgba(34,167,90,.22)}
  .loc-status.closed{background:#fcebeb;color:#c0392b}
  .loc-status.closed .dot{background:#e04b4b}
  .loc-card h3{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-weight:400;font-size:1.55rem;color:var(--blue-900);margin-bottom:10px}
  .loc-addr{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:1rem;margin-bottom:18px}
  .loc-addr svg{width:20px;height:20px;color:var(--blue-800);flex:none}
  .loc-actions{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
  .loc-hours{border-top:1px solid var(--line);padding-top:18px}
  .loc-hours h4,.loc-contact h4{font-family:'Inter',sans-serif;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--blue-500);margin-bottom:10px}
  .loc-hours ul{list-style:none;display:grid;gap:1px;margin:0;padding:0}
  .loc-hours li{display:flex;justify-content:space-between;gap:16px;font-size:.92rem;color:var(--muted);padding:7px 10px;border-radius:9px}
  .loc-hours li span:first-child{color:var(--ink);font-weight:500}
  .loc-hours li.today{background:var(--blue-050)}
  .loc-hours li.today span{color:var(--blue-900);font-weight:700}
  .loc-contact{border-top:1px solid var(--line);padding-top:18px;margin-top:18px;display:flex;flex-wrap:wrap;gap:12px 26px}
  .loc-contact a{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-size:.95rem;font-weight:500;transition:.2s}
  .loc-contact a:hover{color:var(--blue-800)}
  .loc-contact svg{width:18px;height:18px;color:var(--blue-800);flex:none}
  .loc-map{border-radius:22px;overflow:hidden;position:relative;min-height:440px;border:1px solid var(--line);box-shadow:0 24px 48px -34px rgba(1,36,95,.42)}
  .loc-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
  .map-note{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.94);color:var(--blue-800);font-size:.72rem;font-weight:600;padding:7px 13px;border-radius:999px;box-shadow:0 8px 20px -10px rgba(1,36,95,.5)}
  @media(max-width:860px){.infos-grid2{grid-template-columns:1fr}.loc-map{min-height:320px;order:-1}}

  /* Footer moderne */
  footer{position:relative;overflow:hidden;padding-bottom:26px}
  .foot-grid2{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.3fr;gap:40px;padding-top:10px;margin-bottom:14px}
  .foot-brand .logo{margin-bottom:16px}
  .foot-tagline{color:rgba(255,255,255,.72);font-size:.98rem;line-height:1.55;max-width:330px;margin-bottom:20px}
  .foot-tagline b{color:#fff}
  .foot-order{display:flex;gap:10px;flex-wrap:wrap}
  .foot-order .btn{padding:11px 20px;font-size:.9rem}
  .foot-col h4,.foot-social h4{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-weight:400;font-size:1.15rem;letter-spacing:.02em;color:#fff;margin-bottom:16px}
  .foot-col ul{list-style:none;display:grid;gap:11px;margin:0;padding:0}
  .foot-col a{color:rgba(255,255,255,.7);font-size:.95rem;transition:color .2s,padding .2s}
  .foot-col a:hover{color:#fff;padding-left:5px}
  .foot-social p{color:rgba(255,255,255,.7);font-size:.92rem;line-height:1.5;margin-bottom:15px;max-width:260px}
  .foot-social .socials{margin-bottom:18px}
  .foot-join{background:#fff;color:var(--blue-800);font-size:.88rem;padding:11px 20px}
  .foot-join:hover{background:#eaf1fd;transform:translateY(-2px)}
  .foot-wordmark{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-size:clamp(4.5rem,19vw,16rem);line-height:.78;color:rgba(255,255,255,.06);text-align:center;letter-spacing:.03em;user-select:none;pointer-events:none;margin:6px 0 2px;white-space:nowrap;overflow:hidden}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.82rem;color:rgba(255,255,255,.5)}
  .foot-legal a{color:rgba(255,255,255,.5);transition:.2s}
  .foot-legal a:hover{color:#fff}
  footer .socials{display:flex;gap:12px}
  footer .socials a{width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.09);display:grid;place-items:center;color:#fff;transition:.2s}
  footer .socials a:hover{background:#fff;color:var(--blue-900);transform:translateY(-3px)}
  footer .socials svg{width:20px;height:20px}
  @media(max-width:900px){.foot-grid2{grid-template-columns:1fr 1fr;gap:30px}.foot-brand{grid-column:1 / -1}.foot-wordmark{font-size:22vw}}
  @media(max-width:560px){.foot-grid2{grid-template-columns:1fr}.foot-bottom{flex-direction:column;gap:8px;text-align:center;justify-content:center}}

  /* Badge ouverture prochaine (hero) */
  .cover-badge{display:inline-flex;align-items:center;gap:11px;background:#fff;color:var(--blue-800);font-family:'Inter',sans-serif;font-weight:800;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;padding:10px 20px;border-radius:999px;margin-bottom:20px;box-shadow:0 12px 30px -12px rgba(0,0,0,.5)}
  .cover-badge .pulse{width:9px;height:9px;border-radius:50%;background:var(--blue-700);position:relative;flex:none}
  .cover-badge .pulse::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--blue-700);animation:pulsering 1.8s ease-out infinite}
  @keyframes pulsering{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.7);opacity:0}}
  @media(prefers-reduced-motion:reduce){.cover-badge .pulse::after{animation:none}}

  /* Stickers de marque (collés) */
  .bsticker{position:absolute;pointer-events:none;z-index:3;background-size:contain;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 7px 12px rgba(1,36,95,.22));animation:bob 6.5s ease-in-out infinite}
  .bs-dkw{background-image:url(../images/img-02-91e670a723.png)}
  .bs-Db{background-image:url(../images/img-03-91a05e2f2d.png)}
  .bs-Dw{background-image:url(../images/img-04-0915f501f8.png)}
  .bs-dkb{background-image:url(../images/img-05-a2b850bbbd.png)}
  @media(max-width:700px){.bsticker{display:none}.bsticker.keep{display:block}}

  /* Carte : tuile voir plus loukoumades */
  .mdish-more{display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:linear-gradient(150deg,var(--blue-700),var(--blue-900));color:#fff;border-radius:20px;padding:28px;text-decoration:none;transition:transform .22s;box-shadow:var(--shadow);min-height:100%}
  .mdish-more:hover{transform:translateY(-6px)}
  .mdish-more .mm-badge{font-family:'Inter',sans-serif;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:rgba(255,255,255,.16);padding:6px 12px;border-radius:999px}
  .mdish-more h3{font-family:'Baby Stingrays','Poppins',sans-serif;text-transform:uppercase;font-weight:400;font-size:1.5rem;color:#fff;margin:8px 0 0}
  .mdish-more p{color:rgba(255,255,255,.82);font-size:.92rem;line-height:1.5}
  .mdish-more .mm-go{font-family:'Poppins',sans-serif;font-weight:700;color:#fff;margin-top:auto}

/* === WordPress / Elementor compatibility: header === */
#donkey-site header.nav .logo{
  flex:0 0 auto;
  width:auto;
  max-width:none;
  min-width:0;
}
#donkey-site header.nav .logo img.logo-mark2{
  display:block !important;
  width:auto !important;
  height:40px !important;
  max-width:none !important;
  max-height:40px !important;
  object-fit:contain;
  flex:0 0 auto;
}
#donkey-site header.nav .logo img.logo-word{
  display:block !important;
  width:auto !important;
  height:32px !important;
  max-width:none !important;
  max-height:32px !important;
  object-fit:contain;
  flex:0 0 auto;
}
#donkey-site header.nav .nav-inner{
  flex-wrap:nowrap;
}
#donkey-site header.nav .nav-links{
  flex:0 1 auto;
  flex-wrap:nowrap;
  min-width:0;
}
#donkey-site header.nav .nav-links a{
  white-space:nowrap;
}
#donkey-site header.nav .nav-cta{
  flex:0 0 auto;
}

/* === WordPress / Elementor compatibility v1.0.2: header hard lock === */
#donkey-site header.nav > .nav-inner{
  width:calc(100% - 48px) !important;
  max-width:1180px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:20px !important;
}
#donkey-site header.nav .donkey-header-logo{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:11px !important;
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  line-height:1 !important;
}
#donkey-site header.nav .donkey-header-logo > img.logo-mark2{
  display:block !important;
  width:auto !important;
  height:40px !important;
  max-width:none !important;
  max-height:40px !important;
  min-width:0 !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}
#donkey-site header.nav .donkey-header-logo > img.logo-word{
  display:block !important;
  width:auto !important;
  height:32px !important;
  max-width:none !important;
  max-height:32px !important;
  min-width:0 !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}
#donkey-site header.nav .nav-links{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:28px !important;
  flex:1 1 auto !important;
  min-width:0 !important;
}
#donkey-site header.nav .nav-links > a{
  display:block !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
  width:auto !important;
}
#donkey-site header.nav .nav-cta{
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  width:auto !important;
}
@media(max-width:900px){
  #donkey-site header.nav > .nav-inner{width:calc(100% - 32px) !important;}
  #donkey-site header.nav .nav-links{display:none !important;}
  #donkey-site header.nav .nav-cta .btn:not(.burger){display:none !important;}
  #donkey-site header.nav .burger{display:flex !important;}
}


/* === WordPress admin bar spacing v1.0.3 === */
/* Quand on est connecté à WordPress, la barre d’administration est fixe en haut.
   On décale le header Donkey sous cette barre afin de conserver le même espace visuel qu’en mode visiteur. */
body.admin-bar #donkey-site header.nav{
  top:32px !important;
}
@media screen and (max-width:782px){
  body.admin-bar #donkey-site header.nav{
    top:46px !important;
  }
}

/* === Multi-page architecture additions (v1.1.0) — additive only === */
.donkey-breadcrumb{position:relative;z-index:5;padding:130px 24px 0;max-width:var(--max);margin:0 auto}
.donkey-breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0;font-family:'Inter',sans-serif;font-size:.85rem;color:var(--muted)}
.donkey-breadcrumb a{color:var(--blue-800)}
.donkey-breadcrumb a:hover{text-decoration:underline}
.donkey-breadcrumb-sep{margin-left:6px;color:var(--line)}

.donkey-legal{padding-top:150px}
.donkey-legal-content{max-width:760px}
.donkey-legal-content h1{font-size:clamp(2rem,4vw,2.6rem);margin-bottom:20px}
.donkey-legal-content p{color:var(--muted);font-size:1.05rem;line-height:1.7}

/* Formulaires partagés (bandeau de statut + champ + honeypot) — utilisés
   par la page Infos (contact) et la page Loukoumades (commande sur-mesure). */
.contact-banner{max-width:720px;margin:0 auto 24px;padding:16px 22px;border-radius:14px;font-size:.95rem;font-weight:600;text-align:center}
.contact-banner-success{background:#e5f6ec;color:#1c7a43}
.contact-banner-error{background:#fcebeb;color:#c0392b}
.contact-banner-error a{color:inherit;text-decoration:underline}
.contact-form{max-width:720px;margin:36px auto 0;background:#fff;border:1px solid var(--line);border-radius:22px;padding:36px 40px;box-shadow:0 24px 48px -34px rgba(1,36,95,.42);text-align:left}
.contact-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-field{display:flex;flex-direction:column;gap:7px;margin-bottom:20px}
.contact-field label{font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:var(--ink)}
.contact-field input,.contact-field select,.contact-field textarea{font-family:'Inter',sans-serif;font-size:.95rem;color:var(--ink);background:var(--off);border:1px solid var(--line);border-radius:12px;padding:12px 15px;transition:border-color .2s,background .2s}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{outline:none;border-color:var(--blue-500);background:#fff}
.contact-field textarea{resize:vertical;min-height:120px}
.contact-form .btn{margin-top:4px}
/* Piège à robots : jamais visible ni atteignable au clavier pour un humain. */
.contact-hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:640px){
  .contact-row{grid-template-columns:1fr}
  .contact-form{padding:28px 24px}
}

/* FAQ accordion (<details>/<summary>, no JS) — used by the Loukoumades
   page, content mirrored 1:1 in the FAQPage JSON-LD (includes/schema.php)
   so what's visible is exactly what's marked up. */
.faq-list{max-width:760px;margin:0 auto;display:grid;gap:14px;text-align:left}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:16px}
.faq-item summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px;font-family:'Inter',sans-serif;font-weight:700;color:var(--blue-900);font-size:.98rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:1.3rem;line-height:1;font-weight:400;color:var(--blue-500);transition:transform .2s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{margin:0;padding:0 22px 20px;color:var(--muted);font-size:.95rem;line-height:1.6}