/* ============================================================
   Navigation partagée — Caisserie des Caduels
   Source de vérité : ce fichier définit l'apparence de la nav
   sur toutes les pages. Chargé en priorité avant le CSS de page.
   ============================================================ */

    .nav {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 100;
      padding: 0 clamp(1.5rem, 5vw, 4rem);
      height: 103px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: rgba(253, 250, 245, 0.97);
      backdrop-filter: blur(12px);
      box-shadow: 0 1px 0 var(--border);
    }

    .nav-logo {
      display: flex;
      align-items: center;
    }

    .nav-logo-img {
      height: 66px;
      width: auto;
      max-width: 220px;
      object-fit: contain;
      transition: opacity 0.2s;
    }

    .nav-logo:hover .nav-logo-img { opacity: 0.85; }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 1.2rem;
      list-style: none;
    }

    .nav-links a {
      font-size: 1.00rem;
      font-weight: 500;
      color: var(--text-mid);
      letter-spacing: 0.02em;
      transition: color 0.2s;
      position: relative;
    }

    .nav-links a::after {
      content: '';
      position: absolute;
      bottom: -3px;
      left: 0; right: 100%;
      height: 1.5px;
      background: var(--amber);
      transition: right 0.3s var(--ease-out);
    }

    .nav-links a:hover { color: var(--green-deep); }

    .nav-links a:hover::after { right: 0; }

    .nav-cta {
      background: var(--green-deep);
      color: var(--warm-white) !important;
      padding: 0.55rem 1.3rem;
      border-radius: 4px;
      font-size: 0.8rem !important;
      font-weight: 600 !important;
      letter-spacing: 0.04em;
      transition: background 0.2s !important;
    }

    .nav-cta::after { display: none !important; }

    .nav-cta:hover { background: var(--green-mid) !important; color: var(--warm-white) !important; }

    .nav-hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 4px;
    }

    .nav-hamburger span {
      display: block;
      width: 24px;
      height: 2px;
      background: var(--green-deep);
      border-radius: 2px;
      transition: transform 0.3s, opacity 0.3s;
    }

    .nav-mobile {
      display: none;
      position: fixed;
      inset: 0;
      background: var(--warm-white);
      z-index: 99;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2rem;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.3s;
    }

    .nav-mobile.open {
      opacity: 1;
      pointer-events: all;
    }

    .nav-mobile a {
      font-family: var(--font-display);
      font-size: clamp(2rem, 6vw, 3rem);
      font-weight: 400;
      color: var(--green-deep);
      letter-spacing: -0.02em;
      transition: color 0.2s;
    }

    .nav-mobile a:hover { color: var(--amber); }

    .nav-mobile .mob-cta {
      margin-top: 1rem;
      background: var(--green-deep);
      color: var(--warm-white);
      padding: 0.8rem 2.4rem;
      border-radius: 4px;
      font-family: var(--font-body);
      font-size: 0.9rem;
      font-weight: 600;
    }

      .nav-links { display: none; }

      .nav-hamburger { display: flex; }

      .nav-mobile { display: flex; }