*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --cream:      #FAF8F4;
      --cream-dark: #F2EDE4;
      --cream-mid:  #EDE6DA;
      --dark:       #1A1714;
      --dark-mid:   #4A4540;
      --muted:      #9A928A;
      --yellow:     #F5C200;
      --yellow-bg:  #FFFAE8;
      --border:     #E4DDD3;
      --nav-h:      68px;
    }

    html { scroll-behavior: auto; } /* Lenis handles smoothing */

    body {
      background: var(--cream);
      color: var(--dark);
      font-family: 'Inter', sans-serif;
      font-size: 16px;
      line-height: 1.6;
      overflow-x: hidden;
    }

    /* ─── REVEAL ANIMATIONS ─── */
    .reveal {
      opacity: 0;
      transform: translateY(32px);
      transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                  transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0);
    }
    .reveal-delay-1 { transition-delay: 0.1s; }
    .reveal-delay-2 { transition-delay: 0.2s; }
    .reveal-delay-3 { transition-delay: 0.3s; }
    .reveal-delay-4 { transition-delay: 0.4s; }
    .reveal-left {
      opacity: 0;
      transform: translateX(-40px);
      transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
                  transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal-left.is-visible { opacity: 1; transform: translateX(0); }
    .reveal-scale {
      opacity: 0;
      transform: scale(0.96);
      transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
                  transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal-scale.is-visible { opacity: 1; transform: scale(1); }

    /* ─── NAV ─── */
    nav {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 100;
      height: var(--nav-h);
      background: rgba(250,248,244,0.94);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      border-bottom: 1px solid var(--border);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 48px;
      transition: box-shadow 0.3s;
    }
    nav.scrolled { box-shadow: 0 4px 24px rgba(26,23,20,0.06); }

    .nav-logo {
      cursor: pointer;
      text-decoration: none;
      display: flex;
      align-items: center;
    }
    .nav-logo img { height: 36px; width: auto; display: block; }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 36px;
      list-style: none;
    }
    .nav-links a {
      font-size: 0.79rem;
      font-weight: 500;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      color: var(--dark-mid);
      text-decoration: none;
      position: relative;
      transition: color 0.2s;
    }
    .nav-links a::after {
      content: '';
      position: absolute;
      bottom: -3px; left: 0; right: 0;
      height: 1.5px;
      background: var(--yellow);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .nav-links a:hover { color: var(--dark); }
    .nav-links a:hover::after,
    .nav-links a.active::after { transform: scaleX(1); }
    .nav-links a.active { color: var(--dark); }

    .nav-cta {
      background: var(--yellow) !important;
      color: var(--dark) !important;
      padding: 10px 22px;
      border-radius: 4px;
      font-weight: 600 !important;
    }
    .nav-cta::after { display: none !important; }
    .nav-cta:hover { opacity: 0.85; }

    /* ─── PAGE SYSTEM ─── */
    .page { display: none; padding-top: var(--nav-h); }
    .page.active { display: block; }
    .page.fade-in { animation: pageFadeIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
    @keyframes pageFadeIn {
      from { opacity: 0; transform: translateY(12px); }
      to { opacity: 1; transform: translateY(0); }
    }

    /* ─── SHARED ─── */
    .label {
      font-size: 0.71rem;
      font-weight: 600;
      letter-spacing: 0.13em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 16px;
    }
    h1 { font-family: 'Playfair Display', serif; font-size: clamp(3rem, 6vw, 5.5rem); font-weight: 900; line-height: 1.0; letter-spacing: -0.02em; }
    h2 { font-family: 'Playfair Display', serif; font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; }
    h3 { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 600; line-height: 1.2; }
    h4 { font-size: 0.95rem; font-weight: 600; }
    p { color: var(--dark-mid); line-height: 1.75; }

    .btn {
      display: inline-block;
      padding: 14px 32px;
      font-size: 0.8rem;
      font-weight: 600;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      text-decoration: none;
      border-radius: 4px;
      cursor: pointer;
      transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
      border: none;
      font-family: 'Inter', sans-serif;
    }
    .btn-yellow { background: var(--yellow); color: var(--dark); }
    .btn-yellow:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(245,194,0,0.35); }
    .btn-outline { background: transparent; color: var(--dark); border: 1.5px solid var(--dark); }
    .btn-outline:hover { background: var(--dark); color: var(--cream); }
    .btn-outline-white { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.6); }
    .btn-outline-white:hover { background: #fff; color: var(--dark); }

    .photo-ph {
      background: linear-gradient(135deg, #E8DCC8 0%, #D4C4AA 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
      font-size: 0.72rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      font-weight: 500;
      overflow: hidden;
    }

    /* ─── NOS ADRESSES ─── */
    .home-adresses {
      display: grid;
      grid-template-columns: 1fr 1fr;
      height: 72vh;
      min-height: 520px;
      border-top: 2px solid var(--dark);
      border-bottom: 2px solid var(--dark);
    }
    .adresse-col {
      position: relative;
      overflow: hidden;
    }
    .adresse-col:first-child {
      border-right: 1px solid var(--dark);
    }
    .adresse-col-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      transform: scale(1.04);
      transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .adresse-col:hover .adresse-col-bg {
      transform: scale(1);
    }
    .adresse-col-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(26,23,20,0.88) 0%, rgba(26,23,20,0.3) 55%, rgba(26,23,20,0.1) 100%);
    }
    .adresse-col-content {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 44px 48px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .adresse-ville-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--yellow);
      color: var(--dark);
      font-size: 0.63rem;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      padding: 5px 12px;
      border-radius: 2px;
      width: fit-content;
      margin-bottom: 10px;
    }
    .adresse-nom {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.6rem, 2.8vw, 2.4rem);
      font-weight: 900;
      color: #fff;
      line-height: 1.05;
      letter-spacing: -0.02em;
      margin: 0;
    }
    .adresse-rue {
      font-size: 0.88rem;
      color: rgba(255,255,255,0.6);
      line-height: 1.6;
      margin: 8px 0 0;
    }
    .adresse-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 20px;
      padding-top: 18px;
      border-top: 1px solid rgba(255,255,255,0.12);
    }
    .adresse-tel {
      font-size: 0.85rem;
      font-weight: 600;
      color: rgba(255,255,255,0.75);
      text-decoration: none;
      transition: color 0.2s;
    }
    .adresse-tel:hover { color: var(--yellow); }
    .adresse-maps-link {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--yellow);
      text-decoration: none;
      transition: opacity 0.2s;
    }
    .adresse-maps-link:hover { opacity: 0.75; }
    @media (max-width: 768px) {
      .home-adresses { grid-template-columns: 1fr; height: auto; }
      .adresse-col { height: 56vw; min-height: 280px; }
      .adresse-col:first-child { border-right: none; border-bottom: 1px solid var(--dark); }
      .adresse-col-content { padding: 28px 20px; }
    }

    .welcome-static {
      text-align: center;
      padding: clamp(20px, 3vw, 36px) 24px;
      background: var(--dark);
      border-top: 2px solid var(--cream);
      border-bottom: 2px solid var(--cream);
    }
    .welcome-static__text {
      font-family: 'Playfair Display', serif;
      font-weight: 900;
      font-style: italic;
      font-size: clamp(1.4rem, 3vw, 2.4rem);
      letter-spacing: -0.02em;
      line-height: 1;
      color: rgba(255,255,255,0.45);
      margin: 0;
    }
    /* ─── MARQUEE (Bikette style exact) ─── */
    .marquee-css {
      overflow: hidden;
      width: 100%;
      display: flex;
      background: var(--dark);
      border-top: 2px solid var(--cream);
      border-bottom: 2px solid var(--cream);
    }
    .marquee-css.light {
      background: var(--cream-dark);
      border-color: var(--border);
    }
    .marquee-css__list {
      display: flex;
      flex-shrink: 0;
      align-items: center;
      animation: marqueeFwd 10s linear infinite;
    }
    .marquee-css.light .marquee-css__list {
      animation: marqueeRev 14s linear infinite;
    }
    .marquee-css__item {
      display: flex;
      align-items: center;
      gap: 0.5em;
      padding: 0.8em 0.4em;
      white-space: nowrap;
    }
    .marquee-css__item-p {
      font-family: 'Playfair Display', serif;
      font-size: clamp(3rem, 7vw, 6rem);
      font-weight: 900;
      font-style: italic;
      letter-spacing: -0.04em;
      line-height: 1;
      color: var(--cream);
      white-space: nowrap;
      text-transform: lowercase;
      -webkit-text-stroke: 1px var(--dark);
    }
    .marquee-css.light .marquee-css__item-p {
      color: var(--dark);
      -webkit-text-stroke: 1px var(--cream-dark);
    }
    .marquee-css__item-svg {
      width: 2.2em;
      flex-shrink: 0;
    }
    @keyframes marqueeFwd {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }
    @keyframes marqueeRev {
      from { transform: translateX(-50%); }
      to { transform: translateX(0); }
    }

    /* ─── MENU PHOTO SECTION ─── */
    .menu-photos {
      height: 100vh;
      display: flex;
      position: relative;
      overflow: hidden;
      border-top: 2px solid var(--cream);
      border-bottom: 2px solid var(--cream);
      background: var(--dark);
    }
    .menu-photo {
      flex: 0 0 50%;
      position: relative;
      overflow: hidden;
    }
    .menu-photo .photo-ph {
      position: absolute;
      inset: 0;
      height: 130%;
      top: -15%;
      background: linear-gradient(160deg, #C8B898 0%, #B0A080 100%);
    }
    .menu-photo:first-child { border-right: 1px solid rgba(255,255,255,0.1); }

    /* ─── STACKING CARDS (Bikette exact) ─── */
    .cards-section {
      background: var(--yellow);
      padding: 5vh 6vw 15vh;
      border-bottom: 2px solid var(--dark);
      overflow-x: clip;
    }
    .cards-list {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 5em;
      position: relative;
    }
    .card-item {
      flex: 0 0 auto;
      width: 100%;
      max-width: 21em;
      position: sticky;
      top: calc(50vh - 20em);
    }
    /* Portrait cards, sticky stacking avec rotations fan */
    .card-item:nth-child(1) { top: calc(50vh - 20em); }
    .card-item:nth-child(2) { top: calc(50vh - 17.5em); }
    .card-item:nth-child(3) { top: calc(50vh - 15em); }
    /* Rotations gérées par GSAP */

    /* Wide cards, sticky, glissent sur le fan */
    .card-item.is--wide {
      max-width: 38em;
      top: calc(50vh - 10em);
    }
    .card-item.is--wide:nth-child(4) { top: calc(50vh - 10em); }
    .card-item.is--wide:nth-child(5) { top: calc(50vh - 7.5em); }
    .card-item.is--wide:nth-child(6) { top: calc(50vh - 5em); }
    /* card */
    .stack-card {
      border: 3px solid var(--dark);
      background-color: var(--cream);
      border-radius: 1em;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 3.5em;
      overflow: hidden;
      box-shadow: 10px 10px 0 var(--dark);
      position: relative;
    }
    .stack-card--portrait { aspect-ratio: 2 / 3; }
    .stack-card--wide {
      aspect-ratio: 5 / 3;
      box-shadow: 8px 8px 0 var(--dark);
    }
    .stack-card--wide .stack-card__services { min-height: 0; }
    .stack-card--last {
      aspect-ratio: auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 4em;
      width: 55em;
      max-width: 90vw;
      box-shadow: 8px 8px 0 var(--dark);
    }
    .stack-card__number {
      font-family: 'Playfair Display', serif;
      font-size: min(3.6em, 8vw);
      font-weight: 900;
      line-height: 0.95;
      color: var(--dark);
      -webkit-text-stroke: 0;
      letter-spacing: -0.02em;
      text-transform: uppercase;
    }
    .stack-card__services-p strong { font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: -0.01em; }
    .stack-card__end {
      display: flex;
      flex-direction: column;
      gap: 1.2em;
    }
    .stack-card__end-2 {
      display: flex;
      flex-direction: column;
      gap: 1.2em;
    }
    .stack-card__name {
      font-family: 'Playfair Display', serif;
      font-size: 1.55em;
      font-weight: 900;
      line-height: 1.05;
      color: var(--dark);
      letter-spacing: -0.02em;
      margin: 0;
      text-transform: uppercase;
    }
    .stack-card__name::before {
      content: '';
      display: block;
      width: 3em;
      height: 4px;
      background: var(--yellow);
      border-radius: 2px;
      margin-bottom: 0.6em;
      border: 1.5px solid var(--dark);
    }
    .pill {
      display: inline;
    }
    .stack-card__services {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      min-height: 9em;
      gap: 0.15em;
    }
    .stack-card__services-p {
      font-family: 'Inter', sans-serif;
      font-size: 0.9em;
      font-weight: 500;
      color: var(--dark-mid);
      line-height: 1.45;
      margin: 0;
    }
    .stack-card__services-p.extra {
      color: var(--muted);
      font-size: 0.82em;
      margin-top: 0.4em;
    }
    /* drinks grid inside card */
    .drinks-details {
      display: flex;
      justify-content: space-between;
      gap: 1em;
      border-bottom: 1px solid var(--border);
      padding: 0.5em 0;
    }
    .drinks-details:last-child { border-bottom: none; }
    .drinks-details .stack-card__services-p { font-size: 0.9em; }
    .drinks-details .stack-card__services-p:last-child { color: var(--dark); font-weight: 600; }

    /* ─── FOOTER ─── */
    footer {
      background: var(--dark);
      color: var(--cream);
      padding: 0 80px 40px;
      position: relative;
      overflow: hidden;
    }
    footer::before {
      content: "Welcome to the Bun's Nation";
      white-space: nowrap;
      position: absolute;
      bottom: 24px;
      left: 40px;
      text-align: left;
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.8rem, 5vw, 4rem);
      font-weight: 900;
      font-style: italic;
      color: rgba(255,255,255,0.04);
      line-height: 0.9;
      letter-spacing: -0.02em;
      pointer-events: none;
      user-select: none;
    }
    .footer-headline {
      padding: 88px 0 72px;
      border-bottom: 1px solid rgba(255,255,255,0.08);
      margin-bottom: 60px;
      position: relative;
    }
    .footer-headline h2 {
      font-family: 'Playfair Display', serif;
      font-size: clamp(3rem, 7.5vw, 6.5rem);
      font-weight: 900;
      color: #fff;
      line-height: 1;
      margin: 0 0 36px;
      letter-spacing: -0.02em;
    }
    .footer-headline h2 em { font-style: italic; color: var(--yellow); }
    .footer-headline-cta { display: flex; align-items: center; gap: 24px; }
    .footer-headline-cta a.btn { font-size: 0.9rem; }
    .footer-headline-cta .footer-hl-info { font-size: 0.8rem; color: rgba(255,255,255,0.3); letter-spacing: 0.06em; text-transform: uppercase; }
    .footer-top {
      display: grid;
      grid-template-columns: 1.6fr 1fr 1fr 1fr;
      gap: 48px;
      padding-bottom: 56px;
      border-bottom: 1px solid rgba(255,255,255,0.08);
      margin-bottom: 32px;
      position: relative;
    }
    .footer-logo { margin-bottom: 20px; display: inline-block; background: var(--cream); padding: 10px 18px; border-radius: 8px; }
    .footer-logo img { height: 44px; width: auto; display: block; }
    .footer-tagline { font-size: 0.82rem; color: rgba(255,255,255,0.32); line-height: 1.8; }
    .footer-col h5 {
      font-size: 0.63rem; font-weight: 700; letter-spacing: 0.14em;
      text-transform: uppercase; color: var(--yellow);
      margin-bottom: 22px;
      display: flex; align-items: center; gap: 10px;
    }
    .footer-col h5::before { content: ''; display: block; width: 18px; height: 2px; background: var(--yellow); flex-shrink: 0; }
    .footer-col ul { list-style: none; }
    .footer-col ul li { margin-bottom: 12px; }
    .footer-col ul li a,
    .footer-col a { color: rgba(255,255,255,0.55); text-decoration: none; font-size: 0.88rem; transition: color 0.2s; }
    .footer-col a:hover,
    .footer-col ul li a:hover { color: #fff; }
    .footer-col p { color: rgba(255,255,255,0.45); font-size: 0.88rem; line-height: 2.1; }
    .footer-hours .fh-loc { margin-bottom: 16px; }
    .footer-hours .fh-loc:last-child { margin-bottom: 0; }
    .footer-hours .fh-name { display: block; color: #fff; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 9px; }
    .footer-hours .fh-row { display: flex; justify-content: space-between; gap: 18px; font-size: 0.82rem; line-height: 1.5; padding: 2px 0; }
    .footer-hours .fh-row span:first-child { color: rgba(255,255,255,0.4); }
    .footer-hours .fh-row span:last-child { color: rgba(255,255,255,0.7); white-space: nowrap; text-align: right; }
    .footer-social-icons { display: flex; gap: 12px; margin-top: 18px; }
    .footer-social-icons a {
      width: 38px; height: 38px; border-radius: 50%;
      border: 1.5px solid rgba(255,255,255,0.22);
      display: inline-flex; align-items: center; justify-content: center;
      color: rgba(255,255,255,0.6); transition: background 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
    }
    .footer-social-icons a:hover { background: var(--yellow); border-color: var(--yellow); color: var(--dark); transform: translateY(-2px); }
    .footer-social-icons svg { width: 18px; height: 18px; }
    .footer-bottom { display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 10px; position: relative; }
    .footer-bottom p { font-size: 0.73rem; color: rgba(255,255,255,0.2); }
    .footer-socials { display: flex; gap: 24px; }
    .footer-socials a {
      color: rgba(255,255,255,0.35); text-decoration: none; transition: color 0.2s;
      font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600;
    }
    .footer-socials a:hover { color: var(--yellow); }

    /* ════════════════════════════════════════════
       PAGE 1, HOME
    ════════════════════════════════════════════ */

    /* Hero */
    .home-hero {
      height: calc(100vh - var(--nav-h));
      min-height: 640px;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 80px;
      overflow: hidden;
    }
    .home-hero-bg {
      position: absolute;
      inset: 0;
      background-image: url('../../photos/martysbun-01.jpg');
      background-size: cover;
      background-position: center 40%;
      transform: scale(1.05);
      animation: heroZoom 12s ease-out forwards;
    }
    @keyframes heroZoom {
      from { transform: scale(1.05); }
      to { transform: scale(1); }
    }
    .home-hero-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(26,23,20,0.6) 0%, rgba(26,23,20,0.15) 50%, transparent 100%);
    }
    .hero-badge {
      position: absolute;
      top: 40px; right: 80px;
      background: rgba(250,248,244,0.14);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,0.2);
      border-radius: 6px;
      padding: 16px 22px;
      color: #fff;
      animation: fadeSlideDown 1s 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    @keyframes fadeSlideDown {
      from { opacity: 0; transform: translateY(-16px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .hero-badge .city { font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; opacity: 0.55; margin-bottom: 4px; }
    .hero-badge .since { font-family: 'Playfair Display', serif; font-size: 1.05rem; font-weight: 700; }

    .home-hero-label {
      position: relative;
      font-size: 0.7rem;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.6);
      margin-bottom: 20px;
      animation: fadeSlideUp 0.9s 0.3s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .home-hero h1 {
      position: relative;
      color: #fff;
      max-width: 860px;
      margin-bottom: 40px;
      animation: fadeSlideUp 0.9s 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .home-hero h1 em { font-style: italic; color: var(--yellow); }
    .home-hero-actions {
      position: relative;
      display: flex;
      gap: 16px;
      animation: fadeSlideUp 0.9s 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    @keyframes fadeSlideUp {
      from { opacity: 0; transform: translateY(24px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .hero-scroll {
      position: absolute;
      bottom: 40px; right: 80px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      color: rgba(255,255,255,0.4);
      font-size: 0.65rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      animation: fadeSlideUp 0.9s 0.9s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    .hero-scroll-line {
      width: 1px;
      height: 52px;
      background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.4));
      animation: scrollPulse 2s ease-in-out infinite;
    }
    @keyframes scrollPulse {
      0%, 100% { opacity: 0.4; }
      50% { opacity: 1; }
    }

    /* Intro split */
    .home-intro {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
      padding: 100px 80px;
    }
    .home-intro-text .label { margin-bottom: 20px; }
    .home-intro-text h2 { margin-bottom: 24px; }
    .home-intro-text p { font-size: 1.05rem; max-width: 460px; margin-bottom: 36px; }
    .home-intro-img { height: 560px; border-radius: 6px; }

    /* ─── MENU SECTION (Bikette style) ─── */
    .home-menu {
      padding-bottom: 0;
    }

    /* Ticker band */
    .menu-ticker {
      overflow: hidden;
      width: 100%;
      display: flex;
      background: var(--dark);
      padding: 2px 0;
    }
    .menu-ticker-track {
      display: flex;
      flex-shrink: 0;
      white-space: nowrap;
      animation: marqueeFwd 14s linear infinite;
    }
    .menu-ticker-item {
      display: flex;
      align-items: center;
      padding: 0.7em 0;
      font-family: 'Playfair Display', serif;
      font-size: clamp(2.8rem, 6vw, 5rem);
      font-weight: 900;
      font-style: italic;
      letter-spacing: -0.03em;
      color: var(--cream);
      white-space: nowrap;
      line-height: 1;
      padding-right: 0.4em;
    }
    .menu-ticker-dot {
      display: inline-block;
      width: 9px; height: 9px;
      background: var(--yellow);
      border-radius: 50%;
      margin: 0 0.6em;
      flex-shrink: 0;
    }

    /* Menu items display area */
    .menu-display {
      background: var(--dark);
      padding: 0 80px 80px;
    }
    .menu-display-inner {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 6px;
      overflow: hidden;
    }
    .menu-item {
      background: var(--dark);
      padding: 36px 32px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      transition: background 0.3s;
      cursor: default;
      position: relative;
      overflow: hidden;
    }
    .menu-item::before {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(245,194,0,0.04);
      opacity: 0;
      transition: opacity 0.3s;
    }
    .menu-item:hover::before { opacity: 1; }
    .menu-item:hover { background: #222018; }
    .menu-item-top {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 12px;
    }
    .menu-item-price {
      font-family: 'Playfair Display', serif;
      font-size: 1.6rem;
      font-weight: 700;
      color: var(--yellow);
      flex-shrink: 0;
    }
    .menu-item-name {
      font-size: 0.95rem;
      font-weight: 600;
      color: var(--cream);
      text-align: right;
    }
    .menu-item-desc {
      font-size: 0.8rem;
      color: rgba(250,248,244,0.4);
      line-height: 1.65;
    }
    .menu-item-tag {
      display: inline-block;
      background: rgba(245,194,0,0.12);
      color: var(--yellow);
      font-size: 0.65rem;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 2px;
      align-self: flex-start;
      margin-top: 4px;
    }
    .menu-item-divider {
      width: 24px;
      height: 1px;
      background: rgba(255,255,255,0.12);
      margin: 4px 0;
    }
    .menu-note {
      padding: 32px;
      grid-column: 1 / -1;
      border-top: 1px solid rgba(255,255,255,0.06);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .menu-note p {
      font-size: 0.8rem;
      color: rgba(250,248,244,0.35);
    }
    .menu-note a {
      font-size: 0.78rem;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--yellow);
      text-decoration: none;
      transition: opacity 0.2s;
    }
    .menu-note a:hover { opacity: 0.75; }

    /* Ambiance */
    /* ─── COMPOSITION SECTION ─── */
    .composition-section {
      background: var(--dark);
      padding: 100px 80px;
      overflow: hidden;
    }
    .composition-section-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      margin-bottom: 56px;
    }
    .composition-section-header .label { color: var(--yellow); margin-bottom: 14px; }
    .composition-section-header h2 {
      color: #fff;
      font-size: clamp(2rem, 3.5vw, 3rem);
      margin: 0;
      line-height: 1.05;
    }
    .ingr-cards-track {
      display: flex;
      gap: 1.5em;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      padding-bottom: 24px;
      cursor: grab;
    }
    .ingr-cards-track:active { cursor: grabbing; }
    .ingr-cards-track::-webkit-scrollbar { height: 3px; }
    .ingr-cards-track::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); border-radius: 2px; }
    .ingr-cards-track::-webkit-scrollbar-thumb { background: var(--yellow); border-radius: 2px; }
    .ingr-card {
      flex: 0 0 260px;
      scroll-snap-align: start;
      background: var(--cream);
      border: 3px solid var(--dark);
      /* inner border visible since bg = cream on dark section */
      outline: 3px solid var(--cream);
      border-radius: 1em;
      box-shadow: 8px 8px 0 var(--yellow);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      position: relative;
    }
    .ingr-card__photo {
      width: 100%;
      aspect-ratio: 1;
      overflow: hidden;
      background: var(--cream);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom: 3px solid var(--dark);
      position: relative;
    }
    .ingr-card__photo img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center 30%;
      transform: scale(0.85) translateY(-6%);
      mix-blend-mode: multiply;
    }
    .ingr-card__logo {
      position: absolute;
      top: 20%;
      right: -8px;
      width: 90px;
      z-index: 2;
      pointer-events: none;
      transform: translateY(-50%) rotate(90deg);
      transform-origin: center center;
    }
    .ingr-card__logo img {
      width: 100%;
      height: auto;
      mix-blend-mode: normal;
    }
    .ingr-card__body {
      padding: 1.4em 1.5em 1.6em;
      display: flex;
      flex-direction: column;
      gap: 0.4em;
      flex: 1;
    }
    .ingr-card__name {
      font-family: 'Playfair Display', serif;
      font-size: 1em;
      font-weight: 900;
      color: var(--dark);
      text-transform: uppercase;
      letter-spacing: -0.01em;
      line-height: 1.1;
      margin: 0;
    }
    .ingr-card__desc {
      font-family: 'Inter', sans-serif;
      font-size: 0.78em;
      color: var(--dark-mid);
      line-height: 1.4;
      margin: 0;
    }

    .home-ambiance {
      padding: 100px 80px;
    }
    .home-ambiance-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 48px;
    }
    .home-ambiance-title {
      font-family: 'Playfair Display', serif;
      font-size: clamp(2.5rem, 5vw, 4.2rem);
      font-weight: 900;
      font-style: italic;
      color: var(--dark);
      line-height: 1;
    }
    .home-ambiance-sub {
      font-size: 0.85rem;
      color: var(--muted);
      max-width: 240px;
      text-align: right;
      line-height: 1.6;
    }
    .ambiance-grid {
      display: grid;
      grid-template-columns: 1.3fr 1fr 1fr;
      grid-template-rows: 290px 290px;
      gap: 14px;
    }
    .ambiance-grid > div {
      border-radius: 12px !important;
      box-shadow: 0 6px 28px rgba(0,0,0,0.14);
      transition: transform 0.35s ease, box-shadow 0.35s ease;
      overflow: hidden;
    }
    .ambiance-grid > div:first-child { grid-row: 1 / 3; transform: rotate(-1deg); }
    .ambiance-grid > div:nth-child(2) { transform: rotate(0.9deg); }
    .ambiance-grid > div:nth-child(3) { transform: rotate(-0.7deg); }
    .ambiance-grid > div:nth-child(4) { transform: rotate(1.2deg); }
    .ambiance-grid > div:nth-child(5) { transform: rotate(-0.5deg); }
    .ambiance-grid > div:hover { transform: scale(1.03); box-shadow: 0 14px 42px rgba(0,0,0,0.22); position: relative; z-index: 2; }
    .ambiance-grid .photomaton-ph {
      background: var(--cream-mid, #ede9e1);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      color: var(--muted, #a09a92);
      font-size: 0.78rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      border: 2px dashed #d4cfc8;
    }

    /* B2B Section */
    .home-b2b-section {
      background: var(--dark);
      padding: 100px 80px;
    }
    .home-b2b-header { margin-bottom: 64px; }
    .home-b2b-header .label { color: var(--yellow); margin-bottom: 16px; }
    .home-b2b-header h2 { color: #fff; font-size: clamp(2.2rem, 4vw, 3.8rem); margin-bottom: 16px; }
    .home-b2b-header h2 em { font-style: italic; }
    .home-b2b-header p { color: rgba(255,255,255,0.45); font-size: 0.95rem; max-width: 480px; }
    .home-b2b-cards {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .home-b2b-card {
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.09);
      border-radius: 12px;
      padding: 36px 32px 40px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      transition: background 0.25s, border-color 0.25s;
    }
    .home-b2b-card:hover { background: rgba(255,255,255,0.07); border-color: rgba(245,194,0,0.3); }
    .home-b2b-card-icon { font-size: 2rem; line-height: 1; }
    .home-b2b-card h3 { color: #fff; font-size: 1.15rem; font-weight: 700; margin: 0; }
    .home-b2b-card p { color: rgba(255,255,255,0.45); font-size: 0.85rem; line-height: 1.7; flex: 1; margin: 0; }
    .btn-outline-dark {
      display: inline-block;
      padding: 12px 22px;
      border: 1.5px solid rgba(255,255,255,0.2);
      border-radius: 4px;
      color: rgba(255,255,255,0.7) !important;
      font-size: 0.78rem;
      font-weight: 600;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      text-decoration: none;
      transition: border-color 0.2s, color 0.2s;
      align-self: flex-start;
      margin-top: 8px;
    }
    .btn-outline-dark:hover { border-color: var(--yellow); color: var(--yellow) !important; }

    /* Events CTA */
    .home-events-cta {
      background: var(--yellow);
      padding: 88px 80px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 48px;
    }
    .home-events-cta-left {}
    .home-events-cta .label { color: rgba(26,23,20,0.5); margin-bottom: 16px; }
    .home-events-cta h2 { color: var(--dark); max-width: 520px; }
    .home-events-cta h2 em { font-style: italic; }

    /* ════════════════════════════════════════════
       PAGE 2, À PROPOS
    ════════════════════════════════════════════ */
    .about-hero {
      padding: 100px 80px 72px;
      border-bottom: 1px solid var(--border);
    }
    .about-hero .label { margin-bottom: 20px; }
    .about-hero h1 { max-width: 720px; }
    .about-hero h1 em { font-style: italic; color: var(--dark-mid); }

    .about-story {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
      padding: 100px 80px;
    }
    .about-story-img { height: 580px; border-radius: 6px; }
    .about-story-text .label { margin-bottom: 20px; }
    .about-story-text h2 { margin-bottom: 24px; }
    .about-story-text p { margin-bottom: 20px; font-size: 1.05rem; max-width: 450px; }
    .about-story-text p:last-of-type { margin-bottom: 32px; }

    .about-values {
      background: var(--cream-dark);
      padding: 100px 80px;
    }
    .about-values .label { margin-bottom: 20px; text-align: center; }
    .about-values h2 { text-align: center; margin-bottom: 64px; }
    .values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; }
    .value-icon {
      width: 46px; height: 46px;
      background: var(--yellow);
      border-radius: 4px;
      margin-bottom: 22px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.25rem;
    }
    .value-item { text-align: center; }
    .value-item h3 { margin-bottom: 12px; }
    .value-item p { font-size: 0.95rem; max-width: 320px; margin: 0 auto; }

    /* ── Qui est derrière Marty's ── */
    .about-founder {
      background: var(--dark);
      color: var(--cream);
      display: grid;
      grid-template-columns: 1.7fr 1fr;
      gap: 64px;
      align-items: center;
      padding: 110px 80px;
      position: relative;
      overflow: hidden;
    }
    .about-founder-bio { column-count: 2; column-gap: 40px; margin-bottom: 4px; }
    .about-founder-bio p { max-width: none; break-inside: avoid; margin-bottom: 16px; font-size: 0.98rem; }
    .about-founder::before {
      content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
      background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1.4px);
      background-size: 8px 8px;
    }
    .about-founder-text { position: relative; }
    .about-founder-text .label { color: var(--yellow); margin-bottom: 20px; }
    .about-founder-text h2 { color: #fff; margin-bottom: 28px; }
    .about-founder-text h2 em { font-style: italic; color: var(--yellow); }
    .about-founder-text p { font-size: 1.05rem; line-height: 1.75; color: rgba(255,255,255,0.65); margin-bottom: 20px; max-width: 460px; }
    .about-founder-quote {
      font-family: 'Playfair Display', serif; font-style: italic; font-weight: 700;
      font-size: 1.5rem; line-height: 1.35; color: #fff; margin: 32px 0 20px; max-width: 460px;
      padding-left: 22px; border-left: 3px solid var(--yellow);
    }
    .about-founder-sign { display: flex; align-items: center; gap: 14px; }
    .about-founder-sign .name { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.2rem; color: #fff; }
    .about-founder-sign .role { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.4); }
    .about-founder-img {
      position: relative; height: 560px; border-radius: 6px;
      background-size: cover; background-position: center;
    }
    .about-founder-img--placeholder {
      display: flex; align-items: center; justify-content: center;
      background: repeating-linear-gradient(45deg, rgba(255,255,255,0.04) 0 12px, rgba(255,255,255,0.07) 12px 24px);
      border: 1.5px dashed rgba(255,255,255,0.25);
    }
    .about-founder-img--placeholder .ph-label {
      text-align: center; color: rgba(255,255,255,0.55);
      font-size: 0.95rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.6;
    }
    .about-founder-img--placeholder .ph-label small { font-size: 0.72rem; font-weight: 400; opacity: 0.7; letter-spacing: 0.12em; }
    .about-founder-badge {
      position: absolute; bottom: -18px; left: -18px;
      background: var(--yellow); color: var(--dark);
      font-family: 'Playfair Display', serif; font-weight: 900; font-style: italic;
      font-size: 1.1rem; padding: 14px 22px; border-radius: 6px;
      box-shadow: 0 14px 30px -10px rgba(0,0,0,0.5);
    }

    /* ── Galerie ── */
    .about-gallery { padding: 100px 80px; background: var(--cream); }
    .about-gallery .label { text-align: center; margin-bottom: 20px; }
    .about-gallery h2 { text-align: center; margin-bottom: 56px; }
    .gallery-mosaic {
      display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; gap: 16px;
      max-width: 1400px; margin: 0 auto;
    }
    .gallery-mosaic .g { position: relative; border-radius: 6px; overflow: hidden; cursor: pointer; }
    .gallery-mosaic .g > span {
      position: absolute; inset: 0; background-size: cover; background-position: center;
      transition: transform 0.55s cubic-bezier(0.16,1,0.3,1);
    }
    .gallery-mosaic .g::after {
      content: ''; position: absolute; inset: 0; background: rgba(26,23,20,0); transition: background 0.4s;
    }
    .gallery-mosaic .g:hover > span { transform: scale(1.07); }
    .gallery-mosaic .g:hover::after { background: rgba(26,23,20,0.12); }
    .gallery-mosaic .g--tall { grid-row: span 2; }
    .gallery-mosaic .g--wide { grid-column: span 2; }

    /* placeholder image générique */
    .img-ph {
      display: flex; align-items: center; justify-content: center; text-align: center;
      background: repeating-linear-gradient(45deg, var(--cream-dark) 0 12px, var(--cream-mid) 12px 24px);
      border: 1.5px dashed rgba(26,23,20,0.22);
      color: var(--muted); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
    }

    .about-photo-full {
      height: 460px;
      background: linear-gradient(135deg, #E0D5C4 0%, #CFC1AA 100%);
    }

    /* ════════════════════════════════════════════
       PAGE 3, ÉVÉNEMENTS
    ════════════════════════════════════════════ */
    .events-hero {
      height: 520px;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 72px 80px;
      background: linear-gradient(150deg, #D8CEBB 0%, #C4B59A 100%);
      overflow: hidden;
    }
    .events-hero-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(to top, rgba(26,23,20,0.65) 0%, rgba(26,23,20,0.1) 65%, transparent 100%);
    }
    .events-hero .label { position: relative; color: rgba(255,255,255,0.6); margin-bottom: 16px; }
    .events-hero h1 { position: relative; color: #fff; max-width: 640px; }

    .events-formats { padding: 100px 80px; }
    .events-formats .label { margin-bottom: 20px; }
    .events-formats h2 { margin-bottom: 56px; }
    .formats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px; }
    .format-card {
      border: 1px solid var(--border);
      border-radius: 6px;
      overflow: hidden;
      background: #fff;
      display: flex; flex-direction: column;
      transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s;
    }
    .format-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(26,23,20,0.1); }
    .format-card-img { height: 220px; }
    .format-card-body { padding: 32px; display: flex; flex-direction: column; flex: 1; }
    .format-capacity {
      display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
      background: var(--cream-dark); color: var(--dark);
      font-size: 0.78rem; font-weight: 700; letter-spacing: 0.04em;
      padding: 7px 14px; border-radius: 100px; margin-bottom: 22px;
    }
    .format-capacity svg { width: 15px; height: 15px; }
    .format-cta {
      margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      background: var(--dark); color: #fff !important; text-decoration: none;
      font-size: 0.82rem; font-weight: 600; letter-spacing: 0.04em;
      padding: 13px 20px; border-radius: 4px; transition: background 0.2s, transform 0.15s;
    }
    .format-cta:hover { background: var(--yellow); color: var(--dark) !important; }
    .format-cta:active { transform: translateY(1px); }
    .format-tag {
      font-size: 0.66rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
      color: #8A7000; background: var(--yellow-bg);
      padding: 4px 10px; border-radius: 2px; display: inline-block; margin-bottom: 14px;
    }
    .format-card-body h3 { margin-bottom: 12px; }
    .format-card-body p { font-size: 0.9rem; margin-bottom: 20px; }
    .from { font-size: 0.8rem; color: var(--muted); }
    .from strong { font-size: 1.1rem; font-weight: 700; color: var(--dark); font-family: 'Playfair Display', serif; }

    .events-gallery { padding: 80px 80px 100px; }
    .events-gallery h2 { margin-bottom: 40px; }
    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-auto-rows: 220px;
      gap: 10px;
    }
    .gallery-grid img {
      width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 4px;
    }
    .gallery-grid .g-feature { grid-column: span 2; grid-row: span 2; }
    .gallery-grid .g-feature img { border-radius: 6px; }
    .gallery-grid .g-wide { grid-column: span 2; }

    /* Logo wall */
    .events-logos { padding: 80px 80px 76px; background: #000; }
    .events-logos-label { font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.45); text-align: center; margin-bottom: 48px; }
    .logos-row { display: flex; align-items: center; justify-content: center; gap: 48px; flex-wrap: wrap; }
    .logo-item {
      height: 60px; padding: 0 14px;
      display: flex; align-items: center; justify-content: center;
      transition: opacity 0.25s; opacity: 0.7;
      font-family: 'Playfair Display', serif; font-size: 1.1rem; font-weight: 700;
      color: rgba(255,255,255,0.7); letter-spacing: -0.01em; white-space: nowrap;
    }
    .logo-item:hover { opacity: 1; }
    .logo-item img { max-height: 34px; max-width: 130px; width: auto; object-fit: contain; }
    /* normalisation couleur : tout en blanc, sans cadre */
    .logo--white img { filter: brightness(0) invert(1); }                       /* logos transparents → blanc */
    .logo--blend img { mix-blend-mode: screen; filter: grayscale(1) brightness(1.6); } /* logo sur fond noir → fond fondu + blanc */

    .events-testimonials { background: var(--cream-dark); padding: 100px 80px; }
    .events-testimonials .label { text-align: center; margin-bottom: 20px; }
    .events-testimonials h2 { text-align: center; margin-bottom: 56px; }
    .testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
    .testimonial {
      background: #fff; border-radius: 6px; padding: 32px;
      border: 1px solid var(--border);
      transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .testimonial:hover { transform: translateY(-4px); }
    .testimonial-quote { font-family: 'Playfair Display', serif; font-size: 2.8rem; color: var(--yellow); line-height: 1; margin-bottom: 16px; }
    .testimonial p { font-size: 0.93rem; font-style: italic; margin-bottom: 24px; }
    .testimonial-author { font-size: 0.82rem; font-weight: 600; color: var(--dark); }
    .testimonial-company { font-size: 0.76rem; color: var(--muted); }

    .events-cta { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 100px 80px; }
    .events-cta .label { margin-bottom: 20px; }
    .events-cta h2 { max-width: 560px; margin-bottom: 16px; }
    .events-cta > p { max-width: 460px; margin-bottom: 40px; }

    /* ════════════════════════════════════════════
       PAGE 4, DEVIS B2B
    ════════════════════════════════════════════ */
    .devis-header {
      background: var(--dark);
      padding: 80px 80px 72px;
    }
    .devis-header .label { color: rgba(255,255,255,0.4); margin-bottom: 20px; }
    .devis-header h1 { color: #fff; margin-bottom: 16px; }
    .devis-header p { color: rgba(255,255,255,0.5); max-width: 500px; font-size: 1.05rem; }

    .devis-form-wrap { max-width: 860px; margin: 0 auto; padding: 72px 40px 96px; }

    .form-section { margin-bottom: 56px; padding-bottom: 56px; border-bottom: 1px solid var(--border); }
    .form-section:last-child { border-bottom: none; }
    .form-section-num { font-family: 'Playfair Display', serif; font-size: 0.88rem; font-weight: 700; color: var(--yellow); margin-bottom: 8px; }
    .form-section h3 { margin-bottom: 8px; }
    .form-section > p { font-size: 0.88rem; color: var(--muted); margin-bottom: 28px; }

    .event-type-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
    .event-type-card {
      border: 2px solid var(--border); border-radius: 6px; padding: 24px 16px;
      cursor: pointer; transition: all 0.25s; text-align: center; background: #fff;
    }
    .event-type-card:hover { border-color: var(--dark-mid); }
    .event-type-card.selected { border-color: var(--yellow); background: var(--yellow-bg); }
    .event-type-icon { margin-bottom: 10px; display: flex; justify-content: center; }
    .event-type-icon svg { width: 28px; height: 28px; }
    .event-type-card h4 { font-size: 0.85rem; }

    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-bottom: 22px; }
    .form-group { display: flex; flex-direction: column; gap: 8px; }
    .form-group label { font-size: 0.76rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--dark-mid); }
    .form-group input, .form-group select, .form-group textarea {
      border: 1.5px solid var(--border); border-radius: 4px; padding: 13px 16px;
      font-family: 'Inter', sans-serif; font-size: 0.95rem; color: var(--dark);
      background: #fff; transition: border-color 0.2s; outline: none;
    }
    .form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--dark); }
    .form-group textarea { min-height: 120px; resize: vertical; }

    .formule-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .formule-item {
      display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px;
      border: 1.5px solid var(--border); border-radius: 4px; cursor: pointer;
      transition: border-color 0.2s; background: #fff;
    }
    .formule-item:hover { border-color: var(--dark-mid); }
    .formule-item input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--yellow); cursor: pointer; margin-top: 2px; flex-shrink: 0; }
    .formule-item label { font-size: 0.88rem; font-weight: 500; cursor: pointer; }
    .formule-sub { font-size: 0.75rem; color: var(--muted); display: block; margin-top: 2px; }

    .budget-options { display: flex; gap: 10px; flex-wrap: wrap; }
    .budget-btn {
      border: 1.5px solid var(--border); border-radius: 24px; padding: 10px 20px;
      font-size: 0.83rem; font-weight: 500; cursor: pointer; background: #fff;
      font-family: 'Inter', sans-serif; transition: all 0.2s;
    }
    .budget-btn:hover, .budget-btn.selected { border-color: var(--dark); background: var(--dark); color: #fff; }

    .devis-submit {
      display: flex; align-items: center; justify-content: space-between; gap: 32px;
      padding: 32px 36px; background: var(--cream-dark); border-radius: 8px;
    }
    .devis-submit p { font-size: 0.83rem; color: var(--muted); max-width: 320px; }

    /* ════════════════════════════════════════════
       PAGE 5, CONTACT
    ════════════════════════════════════════════ */
    .contact-header { padding: 80px 80px 56px; border-bottom: 1px solid var(--border); }
    .contact-header .label { margin-bottom: 20px; }
    .contact-header h1 { max-width: 600px; }

    .contact-main { display: grid; grid-template-columns: 1fr 1.15fr; min-height: 580px; }

    .contact-info { padding: 64px 72px 64px 80px; border-right: 1px solid var(--border); }
    .contact-info-block { margin-bottom: 44px; }
    .contact-info-block h4 { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
    .contact-info-block p { font-size: 1rem; line-height: 1.75; }
    .contact-info-block a { color: var(--dark); text-decoration: none; }
    .contact-info-block a:hover { text-decoration: underline; }
    .opening-grid { display: grid; grid-template-columns: auto 1fr; gap: 4px 20px; }
    .opening-grid span { font-size: 0.9rem; color: var(--dark-mid); }
    .opening-grid strong { font-size: 0.9rem; font-weight: 500; color: var(--dark); }
    .contact-social { display: flex; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
    .contact-social a {
      display: flex; align-items: center; gap: 8px;
      font-size: 0.83rem; font-weight: 500; color: var(--dark);
      text-decoration: none; padding: 10px 18px;
      border: 1.5px solid var(--border); border-radius: 4px;
      transition: all 0.2s;
    }
    .contact-social a:hover { border-color: var(--dark); background: var(--dark); color: #fff; }

    .contact-form-area { padding: 64px 80px; background: #fff; }
    .contact-form-area h3 { margin-bottom: 8px; }
    .contact-form-area > p { color: var(--muted); font-size: 0.9rem; margin-bottom: 36px; }
    .contact-form-area .form-row { margin-bottom: 20px; }
    .contact-form-area .form-group { margin-bottom: 18px; }

    .contact-map {
      height: 420px;
      position: relative;
      overflow: hidden;
    }
    .contact-map iframe {
      width: 100%; height: 100%;
      border: 0; display: block;
      filter: grayscale(20%) contrast(1.05);
    }
    .contact-map-overlay {
      position: absolute;
      bottom: 24px; left: 32px;
      background: var(--dark);
      color: var(--cream);
      padding: 14px 20px;
      border-radius: 8px;
      border-left: 4px solid var(--yellow);
      pointer-events: none;
    }
    .contact-map-overlay strong { display: block; font-size: 0.9rem; font-weight: 700; margin-bottom: 4px; }
    .contact-map-overlay span { font-size: 0.78rem; color: rgba(255,255,255,0.55); }

    /* ════════════════════════════════════════════
       PAGE CARTE
    ════════════════════════════════════════════ */
    .carte-hero {
      background: var(--dark);
      padding: 120px 80px 80px;
      position: relative;
      overflow: hidden;
      border-bottom: 2px solid var(--yellow);
    }
    .carte-hero::before {
      content: 'M';
      position: absolute;
      right: -40px; bottom: -80px;
      font-family: 'Playfair Display', serif;
      font-size: 40vw; font-weight: 900;
      color: rgba(255,255,255,0.03);
      line-height: 1; pointer-events: none;
    }
    .carte-hero .label { margin-bottom: 20px; }
    .carte-hero h1 { color: #fff; font-size: clamp(3.5rem, 8vw, 7rem); margin: 0 0 24px; }
    .carte-hero-sub { color: rgba(255,255,255,0.35); font-size: 0.88rem; letter-spacing: 0.12em; text-transform: uppercase; }
    .halal-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--yellow); color: var(--dark);
      font-weight: 800; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase;
      padding: 8px 16px; border-radius: 100px; margin-top: 22px;
    }
    .halal-badge svg { width: 15px; height: 15px; }

    .carte-section {
      padding: 80px;
      position: relative;
      overflow: hidden;
    }
    .carte-section:nth-child(even) { background: var(--dark); }
    .carte-section:nth-child(odd)  { background: var(--cream-light, #faf8f4); }
    /* Variante claire (fond blanc/crème), pour la section Burgers */
    .carte-section--light { background: #fff !important; }
    .carte-section--light .carte-section-header { border-color: rgba(26,23,20,0.15) !important; color: var(--dark) !important; }
    .carte-section--light .carte-section-num { color: var(--dark) !important; -webkit-text-stroke: 0 !important; }
    .carte-section--light .carte-item-name { color: var(--dark) !important; -webkit-text-stroke: 0 !important; }
    .carte-section--light .carte-item-desc { color: var(--muted) !important; }
    .carte-section--light .carte-item { border-color: rgba(26,23,20,0.1) !important; }
    .carte-section--light .carte-item-price { color: var(--dark) !important; -webkit-text-stroke: 0 !important; }
    .carte-section--light .carte-note p { color: var(--muted) !important; }

    /* ── Lunch Deal mis en avant (bandeau sous le hero) ── */
    .carte-lunch-feature {
      background: var(--yellow);
      padding: 40px 80px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 32px;
      border-bottom: 3px solid var(--dark);
      position: relative;
      overflow: hidden;
    }
    .carte-lunch-feature::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image: repeating-linear-gradient(45deg, rgba(26,23,20,0.05) 0 1px, transparent 1px 14px);
      pointer-events: none;
    }
    .carte-lunch-left { display: flex; flex-direction: column; gap: 10px; position: relative; z-index: 1; }
    .carte-lunch-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      align-self: flex-start;
      background: var(--dark);
      color: var(--yellow);
      font-size: 0.66rem;
      font-weight: 800;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 100px;
    }
    .carte-lunch-name {
      font-family: 'Playfair Display', serif;
      font-size: clamp(2rem, 4.5vw, 3.4rem);
      font-weight: 900;
      letter-spacing: -0.03em;
      text-transform: uppercase;
      line-height: 0.95;
      color: var(--dark);
      margin: 0;
    }
    .carte-lunch-desc { font-size: 0.9rem; line-height: 1.6; color: rgba(26,23,20,0.6); max-width: 380px; }
    .carte-lunch-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; position: relative; z-index: 1; flex-shrink: 0; }
    .carte-lunch-price {
      font-family: 'Inter', sans-serif;
      font-size: clamp(2.4rem, 5.5vw, 4.2rem);
      font-weight: 600;
      letter-spacing: -0.02em;
      line-height: 0.9;
      color: var(--dark);
    }
    .carte-lunch-when { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(26,23,20,0.55); }
    @media (max-width: 768px) {
      .carte-lunch-feature { flex-direction: column; align-items: flex-start; padding: 36px 20px; gap: 20px; }
      .carte-lunch-right { align-items: flex-start; }
    }

    .carte-section-header {
      display: flex;
      align-items: baseline;
      gap: 24px;
      margin-bottom: 56px;
      padding-bottom: 24px;
      border-bottom: 2px solid currentColor;
    }
    .carte-section:nth-child(even) .carte-section-header { border-color: rgba(255,255,255,0.12); color: #fff; }
    .carte-section:nth-child(odd)  .carte-section-header { border-color: rgba(26,23,20,0.15); color: var(--dark); }

    .carte-section-num {
      font-family: 'Inter', sans-serif;
      font-size: clamp(4rem, 8vw, 7rem);
      font-weight: 600;
      line-height: 1;
      color: var(--dark);
      -webkit-text-stroke: 0;
      letter-spacing: -0.02em;
    }
    .carte-section:nth-child(even) .carte-section-num { -webkit-text-stroke: 0; }

    .carte-section-title {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.8rem, 3vw, 2.8rem);
      font-weight: 900;
      letter-spacing: -0.02em;
      text-transform: uppercase;
      line-height: 1;
    }

    .carte-items { display: flex; flex-direction: column; gap: 0; }

    .carte-item {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: baseline;
      gap: 24px;
      padding: 28px 0;
      border-bottom: 1px solid;
    }
    .carte-section:nth-child(even) .carte-item { border-color: rgba(255,255,255,0.07); }
    .carte-section:nth-child(odd)  .carte-item { border-color: rgba(26,23,20,0.1); }
    .carte-item:last-child { border-bottom: none; }

    .carte-item-left { display: flex; flex-direction: column; gap: 6px; }

    .carte-item-name {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.3rem, 2.2vw, 1.9rem);
      font-weight: 900;
      letter-spacing: -0.02em;
      text-transform: uppercase;
      line-height: 1;
    }
    .carte-section:nth-child(even) .carte-item-name { color: #fff; }
    .carte-section:nth-child(odd)  .carte-item-name { color: var(--dark); }

    .carte-item-desc {
      font-size: 0.98rem;
      line-height: 1.6;
      letter-spacing: 0.02em;
    }
    .carte-section:nth-child(even) .carte-item-desc { color: rgba(255,255,255,0.38); }
    .carte-section:nth-child(odd)  .carte-item-desc { color: var(--muted); }

    .carte-item-tag {
      display: inline-block;
      background: var(--yellow);
      color: var(--dark);
      font-size: 0.6rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      padding: 3px 8px;
      border-radius: 2px;
      align-self: flex-start;
    }

    /* Pastilles de prix par taille (Single / Double / Triple), plus visibles */
    .carte-price-pills { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
    .carte-price-pills .carte-item-tag {
      font-family: 'Inter', sans-serif;
      color: var(--dark);
      font-size: 0.82rem;
      padding: 8px 15px;
      border-radius: 5px;
      border: 1.5px solid var(--dark);
      letter-spacing: 0.05em;
      box-shadow: 2px 2px 0 var(--dark);
    }

    .carte-item-price {
      font-family: 'Inter', sans-serif;
      font-size: clamp(1.2rem, 2vw, 1.8rem);
      font-weight: 600;
      color: var(--dark);
      -webkit-text-stroke: 0;
      letter-spacing: -0.01em;
      white-space: nowrap;
    }
    .carte-section:nth-child(even) .carte-item-price { -webkit-text-stroke: 0; }

    .carte-note {
      margin-top: 48px;
      padding: 24px 32px;
      border: 1.5px solid rgba(245,194,0,0.3);
      border-radius: 8px;
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .carte-note p { font-size: 0.8rem; line-height: 1.7; }
    .carte-section:nth-child(even) .carte-note p { color: rgba(255,255,255,0.45); }
    .carte-section:nth-child(odd)  .carte-note p { color: var(--muted); }

    /* Carte mobile */
    @media (max-width: 768px) {
      .carte-hero { padding: 80px 20px 56px; }
      .carte-section { padding: 56px 20px; }
      .carte-section-num { font-size: clamp(4rem, 18vw, 7rem); }
      .carte-item { grid-template-columns: 1fr auto; gap: 16px; padding: 22px 0; }
      .carte-item-price { font-size: 1.3rem; }
    }

    /* ════════════════════════════════════════════
       CARTE 2, "Le Ticket" (menu façon ticket de caisse, réaliste)
    ════════════════════════════════════════════ */
    .tk-stage {
      background: var(--dark);
      padding: 90px 20px 120px;
      min-height: 100dvh;
      display: flex; flex-direction: column; align-items: center; gap: 44px;
      position: relative; overflow: hidden;
    }
    .tk-stage::before {
      content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
      background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1.4px);
      background-size: 8px 8px;
    }
    .tk-intro { text-align: center; position: relative; z-index: 1; }
    .tk-intro .label { color: var(--yellow); margin-bottom: 14px; }
    .tk-intro h1 {
      font-family: 'Playfair Display', serif; font-style: italic; font-weight: 900;
      color: #fff; font-size: clamp(2.6rem, 6vw, 4.5rem); line-height: 0.9; letter-spacing: -0.02em; margin: 0;
    }

    /* enveloppe pour gérer l'ombre + la courbure sous le bord perforé */
    .tk-paper { position: relative; z-index: 1; width: 100%; max-width: 560px; }
    .tk-paper::after {
      /* ombre douce projetée (suit le découpage perforé) */
      content: ''; position: absolute; left: 6%; right: 6%; bottom: -14px; height: 40px;
      background: rgba(0,0,0,0.5); filter: blur(22px); border-radius: 50%; z-index: -1;
    }

    /* Le ticket */
    .tk {
      position: relative;
      background:
        repeating-linear-gradient(0deg, rgba(26,23,20,0.025) 0 1px, transparent 1px 3px),
        linear-gradient(180deg, #fdfcf9 0%, #f6f2ea 55%, #efe9df 100%);
      color: #2a2520;
      font-family: 'Space Mono', monospace;
      font-size: 0.98rem; line-height: 1.55;
      padding: 52px 44px 38px;
      /* bord perforé haut + bas */
      -webkit-mask:
        radial-gradient(8px at 8px 0, transparent 98%, #000) 0 0/16px 100% repeat-x,
        radial-gradient(8px at 8px 100%, transparent 98%, #000) 0 100%/16px 100% repeat-x;
      mask:
        radial-gradient(8px at 8px 0, transparent 98%, #000) 0 0/16px 100% repeat-x,
        radial-gradient(8px at 8px 100%, transparent 98%, #000) 0 100%/16px 100% repeat-x;
    }
    /* ombrage interne sur les bords latéraux (papier qui s'incurve) + pli léger */
    .tk::before {
      content: ''; position: absolute; inset: 0; pointer-events: none;
      background:
        linear-gradient(90deg, rgba(26,23,20,0.07), transparent 7%, transparent 93%, rgba(26,23,20,0.07)),
        linear-gradient(180deg, transparent 48%, rgba(26,23,20,0.05) 50%, transparent 52%);
      mix-blend-mode: multiply;
    }
    .tk > * { position: relative; }

    .tk-head { text-align: center; }
    .tk-logo {
      font-weight: 700; font-size: 1.9rem; letter-spacing: 0.04em; margin: 0 0 5px; text-transform: uppercase;
    }
    .tk-sub { font-size: 0.8rem; letter-spacing: 0.14em; text-transform: uppercase; color: #7a7065; }
    .tk-halal {
      display: inline-flex; align-items: center; gap: 7px;
      border: 1.5px solid #2a2520; border-radius: 100px;
      font-weight: 700; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase;
      padding: 5px 14px; margin-top: 12px;
    }
    .tk-halal svg { width: 13px; height: 13px; }
    .tk-meta { font-size: 0.78rem; color: #7a7065; margin-top: 12px; line-height: 1.7; }
    .tk-rule { border: none; border-top: 1.5px dashed rgba(42,37,32,0.4); margin: 16px 0; }
    .tk-cat {
      text-align: center; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
      font-size: 0.84rem; margin: 6px 0 12px;
    }
    .tk-line {
      display: flex; align-items: baseline; gap: 7px;
      padding: 5px 6px; border-radius: 3px; transition: background 0.18s;
    }
    .tk-line:hover { background: rgba(245,194,0,0.3); }
    .tk-line .nm { text-transform: uppercase; letter-spacing: 0.02em; flex: 0 0 auto; font-size: 1.18rem; font-weight: 600; }
    .tk-line .leader { flex: 1 1 auto; border-bottom: 1.5px dotted rgba(42,37,32,0.4); transform: translateY(-0.28em); min-width: 14px; }
    .tk-line .pr { font-weight: 700; white-space: nowrap; flex: 0 0 auto; font-size: 1.18rem; }
    .tk-note { font-size: 0.92rem; color: #6b6055; padding: 2px 6px 8px; line-height: 1.5; }
    .tk-sizes { font-size: 0.9rem; color: #6b6055; padding: 0 6px 5px; letter-spacing: 0.02em; }
    .tk-opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; padding: 4px 6px 8px; }
    .tk-opt {
      border: 1.5px solid #2a2520; border-radius: 3px; padding: 7px 6px 8px; text-align: center;
      transition: background 0.18s, transform 0.18s;
    }
    .tk-opt:hover { background: var(--yellow); transform: translateY(-2px); }
    .tk-opt .sz { display: block; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #6b6055; }
    .tk-opt .vl { display: block; font-weight: 700; font-size: 1.05rem; margin-top: 3px; }
    .tk-opts--2 { grid-template-columns: repeat(2, 1fr); }

    /* Lunch deal, ligne inversée */
    .tk-deal { background: #2a2520; color: #f6f2ea; border-radius: 3px; padding: 10px 12px; margin: 4px 0; }
    .tk-deal .tk-deal-top { display: grid; grid-template-columns: 1fr auto; gap: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
    .tk-deal .tk-deal-top .pr { color: var(--yellow); }
    .tk-deal .tk-deal-sub { font-size: 0.78rem; color: rgba(246,242,234,0.6); margin-top: 3px; }

    .tk-total { display: grid; grid-template-columns: 1fr auto; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: 1.08rem; padding: 2px 6px; }
    .tk-thanks { text-align: center; margin-top: 16px; }
    .tk-thanks .big {
      font-family: 'Playfair Display', serif; font-style: italic; font-weight: 900;
      font-size: 1.65rem; line-height: 1; margin: 6px 0 12px;
    }
    .tk-thanks .small { font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: #7a7065; }
    /* faux code-barres */
    .tk-barcode {
      height: 48px; margin: 16px auto 6px; max-width: 220px;
      background-image: repeating-linear-gradient(90deg, #2a2520 0 2px, transparent 2px 4px, #2a2520 4px 5px, transparent 5px 9px, #2a2520 9px 12px, transparent 12px 14px);
    }
    .tk-barcode-num { text-align: center; font-size: 0.76rem; letter-spacing: 0.3em; color: #7a7065; }

    @media (max-width: 768px) {
      .tk-stage { padding: 64px 14px 90px; }
      .tk { padding: 36px 22px 26px; }
    }

    /* ════════════════════════════════════════════
       CARTE V2, Composition mise en avant
    ════════════════════════════════════════════ */
    .cv2-hero {
      background: var(--yellow);
      padding: 120px 80px 80px;
      position: relative;
      overflow: hidden;
      border-bottom: 3px solid var(--dark);
    }
    .cv2-hero::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image: repeating-linear-gradient(
        45deg,
        rgba(26,23,20,0.04) 0px,
        rgba(26,23,20,0.04) 1px,
        transparent 1px,
        transparent 12px
      );
    }
    .cv2-hero .label { color: rgba(26,23,20,0.5); margin-bottom: 16px; }
    .cv2-hero h1 { font-size: clamp(4rem, 9vw, 8rem); color: var(--dark); margin: 0 0 12px; line-height: 0.9; }
    .cv2-hero-sub { font-size: 0.85rem; color: rgba(26,23,20,0.45); letter-spacing: 0.1em; text-transform: uppercase; }

    .cv2-burger {
      background: var(--cream-light, #faf8f4);
      border-bottom: 2px solid var(--dark);
    }
    .cv2-burger:nth-child(even) { background: var(--dark); }

    .cv2-burger-top {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      padding: 48px 80px 0;
      gap: 24px;
    }
    .cv2-burger-name {
      font-family: 'Playfair Display', serif;
      font-size: clamp(2.4rem, 5vw, 5rem);
      font-weight: 900;
      letter-spacing: -0.03em;
      text-transform: uppercase;
      line-height: 1;
      margin: 0;
    }
    .cv2-burger:nth-child(odd)  .cv2-burger-name { color: var(--dark); }
    .cv2-burger:nth-child(even) .cv2-burger-name { color: var(--yellow); }

    .cv2-burger-prices {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
      align-items: center;
      flex-shrink: 0;
    }
    .cv2-price-pill {
      border: 2px solid;
      padding: 6px 16px;
      border-radius: 100px;
      font-family: 'Playfair Display', serif;
      font-size: 1rem;
      font-weight: 900;
      letter-spacing: -0.02em;
      white-space: nowrap;
    }
    .cv2-burger:nth-child(odd)  .cv2-price-pill { border-color: var(--dark); color: var(--dark); }
    .cv2-burger:nth-child(even) .cv2-price-pill { border-color: rgba(255,255,255,0.25); color: #fff; }
    .cv2-price-pill.is-highlight {
      background: var(--yellow);
      border-color: var(--yellow);
      color: var(--dark);
    }

    .cv2-burger-compo {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 0;
      padding: 32px 80px 48px;
      border-top: 1px solid;
      margin-top: 28px;
    }
    .cv2-burger:nth-child(odd)  .cv2-burger-compo { border-color: rgba(26,23,20,0.1); }
    .cv2-burger:nth-child(even) .cv2-burger-compo { border-color: rgba(255,255,255,0.08); }

    .cv2-ingr {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 20px 24px 20px 0;
      border-right: 1px solid;
      position: relative;
    }
    .cv2-burger:nth-child(odd)  .cv2-ingr { border-color: rgba(26,23,20,0.1); }
    .cv2-burger:nth-child(even) .cv2-ingr { border-color: rgba(255,255,255,0.08); }
    .cv2-ingr:last-child { border-right: none; }

    .cv2-ingr-num {
      font-family: 'Playfair Display', serif;
      font-size: 0.65rem;
      font-weight: 900;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--yellow);
    }
    .cv2-ingr-name {
      font-size: 0.92rem;
      font-weight: 700;
      letter-spacing: 0.02em;
      text-transform: uppercase;
      line-height: 1.2;
    }
    .cv2-burger:nth-child(odd)  .cv2-ingr-name { color: var(--dark); }
    .cv2-burger:nth-child(even) .cv2-ingr-name { color: #fff; }
    .cv2-ingr-detail {
      font-size: 0.72rem;
      line-height: 1.5;
    }
    .cv2-burger:nth-child(odd)  .cv2-ingr-detail { color: var(--muted); }
    .cv2-burger:nth-child(even) .cv2-ingr-detail { color: rgba(255,255,255,0.32); }

    /* Sides / Drinks v2 */
    .cv2-extra {
      background: var(--yellow);
      padding: 80px;
      border-bottom: 2px solid var(--dark);
    }
    .cv2-extra-title {
      font-family: 'Playfair Display', serif;
      font-size: clamp(2rem, 4vw, 3.5rem);
      font-weight: 900;
      color: var(--dark);
      letter-spacing: -0.03em;
      text-transform: uppercase;
      margin: 0 0 40px;
    }
    .cv2-extra-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 24px;
    }
    .cv2-extra-item {
      background: rgba(26,23,20,0.06);
      border: 2px solid var(--dark);
      border-radius: 8px;
      padding: 20px 24px;
    }
    .cv2-extra-item-name { font-size: 0.95rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; color: var(--dark); margin-bottom: 4px; }
    .cv2-extra-item-desc { font-size: 0.75rem; color: rgba(26,23,20,0.5); line-height: 1.5; margin-bottom: 10px; }
    .cv2-extra-item-price { font-family: 'Playfair Display', serif; font-size: 1.3rem; font-weight: 900; color: var(--dark); }

    @media (max-width: 768px) {
      .cv2-hero { padding: 80px 20px 56px; }
      .cv2-burger-top { padding: 32px 20px 0; flex-wrap: wrap; gap: 16px; }
      .cv2-burger-compo { padding: 24px 20px 36px; grid-template-columns: 1fr 1fr; }
      .cv2-ingr { padding: 16px 16px 16px 0; }
      .cv2-extra { padding: 56px 20px; }
    }

    /* ════════════════════════════════════════════
       COMPOSITION STRIPS
    ════════════════════════════════════════════ */
    .compo-strips { background: var(--dark); overflow: hidden; }
    .compo-strips-header {
      padding: 80px 80px 0;
      border-bottom: 1px solid rgba(255,255,255,0.07);
      padding-bottom: 48px;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
    }
    .compo-strips-header .label { color: var(--yellow); margin-bottom: 14px; }
    .compo-strips-header h2 { color: #fff; margin: 0; }
    .compo-strips-header p { color: rgba(255,255,255,0.3); font-size: 0.85rem; max-width: 220px; text-align: right; line-height: 1.7; }

    .compo-strip {
      display: grid;
      grid-template-columns: 120px 1fr auto;
      align-items: center;
      gap: 40px;
      padding: 36px 80px;
      border-bottom: 1px solid rgba(255,255,255,0.06);
      position: relative;
      overflow: hidden;
      transition: background 0.3s;
      cursor: default;
    }
    .compo-strip:last-child { border-bottom: none; }
    .compo-strip:hover { background: rgba(255,255,255,0.03); }

    .compo-strip-num {
      font-family: 'Playfair Display', serif;
      font-size: 4.5rem;
      font-weight: 900;
      color: rgba(255,255,255,0.07);
      line-height: 1;
      letter-spacing: -0.04em;
      transition: color 0.3s;
      user-select: none;
    }
    .compo-strip:hover .compo-strip-num { color: var(--yellow); opacity: 0.5; }

    .compo-strip-content { display: flex; flex-direction: column; gap: 6px; }
    .compo-strip-name {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.6rem, 3vw, 2.8rem);
      font-weight: 900;
      color: #fff;
      letter-spacing: -0.025em;
      text-transform: uppercase;
      margin: 0;
      line-height: 1;
      transition: color 0.3s;
    }
    .compo-strip:hover .compo-strip-name { color: var(--yellow); }
    .compo-strip-desc { color: rgba(255,255,255,0.32); font-size: 0.82rem; letter-spacing: 0.04em; margin: 0; }

    .compo-strip-photo {
      width: 110px;
      height: 110px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.4s cubic-bezier(0.16,1,0.3,1);
    }
    .compo-strip:hover .compo-strip-photo { transform: scale(1.12) rotate(-2deg); }
    .compo-strip-photo img {
      width: 100%; height: 100%;
      object-fit: contain;
      mix-blend-mode: multiply;
      filter: brightness(0) invert(1);
      opacity: 0.75;
      transition: opacity 0.3s;
    }
    .compo-strip:hover .compo-strip-photo img { opacity: 1; filter: none; mix-blend-mode: normal; }

    @media (max-width: 768px) {
      .compo-strips-header { padding: 56px 20px 36px; flex-direction: column; align-items: flex-start; gap: 12px; }
      .compo-strips-header p { text-align: left; }
      .compo-strip { grid-template-columns: 60px 1fr auto; gap: 16px; padding: 24px 20px; }
      .compo-strip-num { font-size: 2.8rem; }
      .compo-strip-photo { width: 72px; height: 72px; }
      .compo-strip-name { font-size: 1.3rem; }
    }

    /* ════════════════════════════════════════════
       RESPONSIVE, NAV BURGER (hidden on desktop)
    ════════════════════════════════════════════ */
    .nav-burger { display: none; }

    /* ════════════════════════════════════════════
       RESPONSIVE, TABLET (≤ 1024px)
    ════════════════════════════════════════════ */
    @media (max-width: 1024px) {
      nav { padding: 0 32px; }
      .home-hero { padding: 60px; }
      .hero-badge { right: 60px; top: 32px; }
      .hero-scroll { right: 60px; }
      .home-intro { gap: 48px; padding: 80px 48px; }
      .menu-display { padding: 0 48px 60px; }
      .menu-display-inner { grid-template-columns: 1fr 1fr; }
      .composition-section { padding: 80px 48px; }
      .home-ambiance { padding: 80px 48px; }
      .home-events-cta { padding: 72px 48px; }
      .about-hero { padding: 80px 48px 56px; }
      .about-story { gap: 48px; padding: 80px 48px; }
      .about-values { padding: 80px 48px; }
      .events-formats { padding: 80px 48px; }
      .events-gallery { padding: 0 48px 80px; }
      .events-logos { padding: 60px 48px; }
      .events-testimonials { padding: 80px 48px; }
      .events-cta { padding: 80px 48px; }
      .devis-header { padding: 72px 48px; }
      .contact-header { padding: 64px 48px; }
      .contact-info { padding: 48px 40px 48px 48px; }
      .contact-form-area { padding: 48px; }
      footer { padding: 0 48px 36px; }
      .footer-top { grid-template-columns: 1fr 1fr; gap: 32px; }
    }

    /* ════════════════════════════════════════════
       RESPONSIVE, MOBILE (≤ 768px)
    ════════════════════════════════════════════ */
    @media (max-width: 768px) {

      /* ━━━ NAV ━━━ */
      /* backdrop-filter crée un containing block pour position:fixed sur WebKit, désactivé sur mobile */
      nav {
        padding: 0 20px;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(250,248,244,0.98) !important;
      }

      @keyframes navItemIn {
        from { opacity: 0; transform: translateY(16px); }
        to   { opacity: 1; transform: translateY(0); }
      }

      /* Overlay plein écran, fade in/out fiable */
      .nav-links {
        position: fixed;
        inset: 0;
        background: #1a1714;
        z-index: 999;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding: 80px 36px 52px;
        gap: 0;
        list-style: none;
        overflow: hidden;
        /* État fermé */
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.35s ease, visibility 0s linear 0.35s;
      }
      .nav-links::before {
        content: 'M';
        position: absolute;
        bottom: -40px; right: -10px;
        font-family: 'Playfair Display', serif;
        font-size: 60vw; font-weight: 900;
        color: rgba(255,255,255,0.03);
        line-height: 1; pointer-events: none; user-select: none;
      }
      /* État ouvert */
      .nav-links.is-open {
        opacity: 1;
        visibility: visible;
        transition: opacity 0.35s ease, visibility 0s;
      }

      /* Items, stagger via @keyframes avec fill-mode: both (pas de flash) */
      .nav-links li {
        width: 100%;
        border-bottom: 1px solid rgba(255,255,255,0.07);
      }
      .nav-links.is-open li { animation: navItemIn 0.45s cubic-bezier(0.16,1,0.3,1) both; }
      .nav-links.is-open li:nth-child(1) { animation-delay: 0.08s; }
      .nav-links.is-open li:nth-child(2) { animation-delay: 0.14s; }
      .nav-links.is-open li:nth-child(3) { animation-delay: 0.20s; }
      .nav-links.is-open li:nth-child(4) { animation-delay: 0.26s; }
      .nav-links.is-open li:nth-child(5) { animation-delay: 0.32s; }

      /* Liens, gros titres Playfair avec numéros */
      .nav-links a {
        display: flex;
        align-items: baseline;
        gap: 14px;
        padding: 18px 0;
        font-family: 'Playfair Display', serif !important;
        font-size: clamp(2rem, 9vw, 3rem) !important;
        font-weight: 900 !important;
        letter-spacing: -0.03em !important;
        text-transform: none !important;
        color: rgba(255,255,255,0.38) !important;
        transition: color 0.2s !important;
        line-height: 1.15;
        text-decoration: none;
      }
      .nav-links a:hover,
      .nav-links a:active { color: #fff !important; }
      .nav-links a.active  { color: var(--yellow) !important; }
      .nav-links a::after  { display: none !important; }

      /* Numéros */
      .nav-links a::before {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.58rem !important;
        font-weight: 700 !important;
        letter-spacing: 0.16em !important;
        color: rgba(255,255,255,0.2) !important;
        text-transform: uppercase !important;
        align-self: center;
        min-width: 24px;
        line-height: 1;
      }
      .nav-links li:nth-child(1) a::before { content: '01'; }
      .nav-links li:nth-child(2) a::before { content: '02'; }
      .nav-links li:nth-child(3) a::before { content: '03'; }
      .nav-links li:nth-child(4) a::before { content: '04'; }
      .nav-links li:nth-child(5) a::before { content: ''; display: none; }

      /* Dernier item (CTA) */
      .nav-links li:last-child { border-bottom: none; padding-top: 28px; margin-top: 8px; }
      .nav-links .nav-cta {
        display: block !important;
        width: 100% !important;
        background: var(--yellow) !important;
        color: var(--dark) !important;
        padding: 16px 28px !important;
        border-radius: 6px !important;
        text-align: center !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 0.82rem !important;
        font-weight: 800 !important;
        letter-spacing: 0.09em !important;
        text-transform: uppercase !important;
        line-height: 1 !important;
      }
      .nav-links .nav-cta::before { display: none !important; }

      /* Burger, z-index au-dessus de l'overlay */
      .nav-burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 6px;
        cursor: pointer;
        padding: 8px 4px;
        background: none;
        border: none;
        z-index: 1000;
        position: relative;
      }
      .nav-burger span {
        display: block;
        width: 24px; height: 2px;
        background: var(--dark);
        border-radius: 2px;
        transition: background 0.3s, transform 0.4s cubic-bezier(0.16,1,0.3,1), opacity 0.3s;
        transform-origin: center;
      }
      .nav-burger.is-open span { background: #fff; }
      .nav-burger.is-open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
      .nav-burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
      .nav-burger.is-open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

      /* ━━━ HERO ━━━ */
      .home-hero { padding: 24px 20px 36px; min-height: 92svh; }
      .hero-badge { top: 16px; right: 20px; padding: 10px 14px; }
      .hero-scroll { display: none; }
      .home-hero h1 { margin-bottom: 28px; }
      .home-hero-actions { flex-direction: column; gap: 10px; }
      .home-hero-actions .btn { text-align: center; width: 100%; }

      /* ━━━ HOME INTRO ━━━ */
      .home-intro { grid-template-columns: 1fr; gap: 0; padding: 56px 20px; }
      .home-intro-img { height: 260px; margin-top: 36px; }
      .home-intro-text p { max-width: 100%; }

      /* ━━━ STACKING CARDS, number mobile ━━━ */
      .stack-card__number { font-size: min(3em, 8vw) !important; }

      /* ━━━ WIDE CARDS, espace sous le texte ━━━ */
      .stack-card--wide .stack-card__end-2 { padding-bottom: 1.4em; }

      /* ━━━ MENU PHOTOS ━━━ */
      .menu-photos { height: 72vw; max-height: 400px; }
      .menu-photo { flex: 0 0 100%; }
      .menu-photo:last-child { display: none; }
      .menu-photo:first-child { border-right: none; }



/* ━━━ MENU TICKER ━━━ */
      .menu-ticker-item { font-size: clamp(2rem, 8vw, 3.2rem); }

      /* ━━━ MENU DISPLAY ━━━ */
      .menu-display { padding: 0 20px 40px; }
      .menu-display-inner { grid-template-columns: 1fr; }

      /* ━━━ COMPOSITION ━━━ */
      .composition-section { padding: 56px 20px; }
      .composition-section-header { flex-direction: column; align-items: flex-start; gap: 16px; }
      .composition-section-header > p { text-align: left !important; max-width: 100%; }
      .ingr-card { flex: 0 0 200px; }

      /* ━━━ AMBIANCE ━━━ */
      .home-ambiance { padding: 56px 20px; }
      .home-ambiance-header { flex-direction: column; align-items: flex-start; gap: 12px; }
      .home-ambiance-sub { text-align: left; max-width: 100%; }
      .ambiance-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
      }
      .ambiance-grid > div {
        height: 210px !important;
        border-radius: 18px !important;
        grid-row: auto !important;
        grid-column: auto !important;
        box-shadow: 0 8px 32px rgba(0,0,0,0.18) !important;
        transition: transform 0.35s ease !important;
      }
      .ambiance-grid > div:nth-child(odd)  { transform: rotate(-2deg) !important; }
      .ambiance-grid > div:nth-child(even) { transform: rotate(1.6deg) !important; }
      .ambiance-grid > div:hover { transform: rotate(0deg) scale(1.02) !important; }

      /* ━━━ B2B SECTION ━━━ */
      .home-b2b-section { padding: 56px 20px; }
      .home-b2b-cards { grid-template-columns: 1fr; gap: 16px; }

      /* ━━━ EVENTS CTA (home) ━━━ */
      .home-events-cta { flex-direction: column; align-items: flex-start; gap: 28px; padding: 56px 20px; }

      /* ━━━ MARQUEE ━━━ */
      .marquee-css__item-p { font-size: clamp(2rem, 9vw, 3.2rem); }

      /* ━━━ ABOUT ━━━ */
      .about-hero { padding: 56px 20px 40px; }
      .about-story { grid-template-columns: 1fr; gap: 36px; padding: 56px 20px; }
      .about-story-img { height: 260px; }
      .about-story-text p { max-width: 100%; }
      .about-values { padding: 56px 20px; }
      .values-grid { grid-template-columns: 1fr; gap: 28px; }
      .about-founder { grid-template-columns: 1fr; gap: 48px; padding: 64px 20px; }
      .about-founder-img { height: 320px; order: -1; }
      .about-founder-text p, .about-founder-quote { max-width: 100%; }
      .about-founder-bio { column-count: 1; }
      .about-gallery { padding: 56px 20px; }
      .gallery-mosaic { grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; gap: 10px; }
      .gallery-mosaic .g--wide { grid-column: span 2; }
      .gallery-mosaic .g--tall { grid-row: span 1; }

      /* ━━━ EVENTS PAGE ━━━ */
      .events-hero { height: auto; min-height: 360px; padding: 40px 20px 48px; }
      .events-formats { padding: 56px 20px; }
      .formats-grid { grid-template-columns: 1fr; gap: 16px; }
      .events-gallery { padding: 0 20px 56px; }
      .events-b2b { grid-template-columns: 1fr !important; padding: 56px 20px !important; gap: 32px !important; }
      .events-b2b div[style*="display:flex"] { flex-wrap: wrap; gap: 20px 28px !important; }
      .gallery-grid {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 150px;
      }
      .gallery-grid .g-feature { grid-column: 1 / -1; grid-row: auto; }
      .gallery-grid .g-feature img { height: 220px; }
      .gallery-grid .g-wide { grid-column: 1 / -1; }
      .events-logos { padding: 48px 20px; }
      .logo-item { min-width: 88px; height: 48px; padding: 0 12px; font-size: 0.78rem; }
      .events-testimonials { padding: 56px 20px; }
      .testimonials-grid { grid-template-columns: 1fr; gap: 16px; }
      .events-cta { padding: 56px 20px; }

      /* ━━━ DEVIS ━━━ */
      .devis-header { padding: 56px 20px 48px; }
      .devis-form-wrap { padding: 40px 20px 64px; }
      .event-type-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
      .form-row { grid-template-columns: 1fr; gap: 14px; }
      .formule-grid { grid-template-columns: 1fr; }
      .devis-submit { flex-direction: column; align-items: flex-start; gap: 20px; padding: 24px 20px; }

      /* ━━━ CONTACT ━━━ */
      .contact-header { padding: 48px 20px; }
      .contact-main { grid-template-columns: 1fr; min-height: auto; }
      .contact-info { padding: 40px 20px; border-right: none; border-bottom: 1px solid var(--border); }
      .contact-form-area { padding: 40px 20px; }

      /* ━━━ FOOTER ━━━ */
      footer { padding: 0 20px 28px; }
      .footer-headline { padding: 52px 0 40px; margin-bottom: 32px; }
      .footer-headline h2 { font-size: clamp(2.4rem, 11vw, 3.8rem); margin-bottom: 28px; line-height: 1.05; }
      .footer-headline-cta { flex-direction: column; align-items: flex-start; gap: 16px; }
      .footer-headline-cta .btn { width: 100%; text-align: center; }
      .footer-top {
        grid-template-columns: 1fr;
        gap: 32px;
        padding-bottom: 36px;
        margin-bottom: 20px;
      }
      .footer-logo { margin-bottom: 12px; }
      .footer-bottom { flex-direction: column; gap: 12px; align-items: flex-start; }
    }

/* ── Liens légaux footer ── */
.footer-legal-links { font-size: 0.73rem; color: rgba(255,255,255,0.2); }
.footer-legal-links a { color: rgba(255,255,255,0.4); text-decoration: none; transition: color 0.2s; }
.footer-legal-links a:hover { color: var(--yellow); }

/* ── Pages légales ── */
.legal { background: var(--cream); color: var(--dark); padding: 140px 24px 100px; }
.legal-wrap { max-width: 760px; margin: 0 auto; }
.legal .label { color: var(--muted); margin-bottom: 14px; }
.legal h1 { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: 1.05; margin-bottom: 12px; }
.legal .legal-updated { font-size: 0.8rem; color: var(--muted); margin-bottom: 48px; }
.legal h2 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.5rem; margin: 44px 0 14px; }
.legal h3 { font-size: 1.02rem; font-weight: 700; margin: 24px 0 8px; }
.legal p, .legal li { font-size: 0.98rem; line-height: 1.75; color: rgba(26,23,20,0.78); }
.legal p { margin-bottom: 14px; }
.legal ul { margin: 0 0 14px 20px; }
.legal li { margin-bottom: 6px; }
.legal a { color: var(--dark); text-decoration: underline; text-underline-offset: 2px; }
.legal a:hover { color: var(--yellow-ink, #b58a00); }
.legal .legal-note { background: #FBEFC4; border-left: 3px solid var(--yellow); padding: 12px 16px; border-radius: 4px; font-size: 0.9rem; margin: 20px 0; }
@media (max-width: 768px) { .legal { padding: 110px 20px 72px; } }

/* ── Crédit agence ── */
.footer-credit { font-size: 0.73rem; color: rgba(255,255,255,0.2); }
.footer-credit a { color: rgba(255,255,255,0.4); text-decoration: none; transition: color 0.2s; }
.footer-credit a:hover { color: var(--yellow); }