/* ========================================
   Les Délices de Farinette — V2 Écrin Noir
   Pâtisserie luxe, textures chaudes, dorures
   ======================================== */

/* --- Smooth scroll base --- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* --- Selection --- */
::selection {
  background: rgba(201, 169, 110, 0.35);
  color: #fff;
}

/* --- Scrollbar doré discret --- */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #0d0d0d; }
::-webkit-scrollbar-thumb {
  background: rgba(201, 169, 110, 0.25);
  border-radius: 2px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(201, 169, 110, 0.45);
}

/* --- Bandeau noir fixe au-dessus du header (safe area iOS) --- */
body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: env(safe-area-inset-top, 0px);
  background: #0d0d0d;
  z-index: 51;
  pointer-events: none;
}

/* --- Navbar --- */
#navbar {
  background: transparent;
  border-bottom: none;
  padding-top: env(safe-area-inset-top, 0px);
}
#navbar.scrolled {
  border-bottom: none;
}

/* --- Nav links underline doré --- */
.nav-link { position: relative; }
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 1px;
  background: #c9a96e;
  transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.nav-link:hover::after { width: 100%; }

/* --- Hero video background --- */
.hero-video-wrap {
  will-change: transform;
}
.hero-video-wrap video {
  filter: brightness(0.85);
}

/* Hero filet doré animation */
.hero-filet {
  transition: width 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Creation cards --- */
.creation-card {
  transition: transform 0.4s ease;
}
.creation-card:hover {
  transform: translateY(-4px);
}
.creation-card .rounded-xl {
  border: 1px solid transparent;
  transition: border-color 0.4s ease, box-shadow 0.4s ease;
}
.creation-card:hover .rounded-xl {
  border-color: rgba(201, 169, 110, 0.25);
  box-shadow: 0 8px 40px rgba(201, 169, 110, 0.08);
}

/* Horizontal scroll — hide scrollbar */
.creation-scroll {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.creation-scroll::-webkit-scrollbar {
  display: none;
}

/* --- CTA cards --- */
.cta-card {
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.cta-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(201, 169, 110, 0.08);
}

/* --- Paper texture for crème sections --- */
.paper-texture {
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 512px 512px;
}

/* --- Grain chaud sur sections sombres --- */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.025;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
}

/* --- Section ornaments fade in --- */
.section-ornament {
  opacity: 0;
  transition: opacity 0.8s ease;
}
.section-ornament.visible {
  opacity: 1;
}

/* --- Product cards --- */
.product-card,
.product-card-disabled {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 14px;
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(60, 36, 21, 0.08);
  border-radius: 16px;
}
.product-card {
  transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}
.product-card:hover {
  transform: translateY(-3px);
  border-color: rgba(201, 169, 110, 0.35);
  box-shadow: 0 10px 30px rgba(60, 36, 21, 0.06);
}
.product-card .cart-controls {
  margin-top: auto;
  padding-top: 8px;
}

/* --- Mobile menu fullscreen fade overlay --- */
#mobile-menu.open {
  opacity: 1;
  pointer-events: auto;
}

/* --- Burger → Cross animation --- */
#menu-toggle.active .menu-bar:nth-child(1) {
  transform: translateY(7.5px) rotate(45deg);
}
#menu-toggle.active .menu-bar:nth-child(2) {
  opacity: 0;
}
#menu-toggle.active .menu-bar:nth-child(3) {
  transform: translateY(-7.5px) rotate(-45deg);
}
#menu-toggle.active .menu-bar {
  background: white;
}

/* --- Cart float animation --- */
#cart-float {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
}

/* --- Cart drawer --- */
#cart-drawer {
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Cart controls on product cards --- */
.cart-controls button {
  transition: all 0.2s ease;
  cursor: pointer;
  line-height: 1;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  font-weight: 500;
  padding: 0;
}
.cart-controls .cart-plus {
  font-size: 18px;
  padding-bottom: 2px;
}
.cart-controls .cart-minus {
  font-size: 22px;
  padding-bottom: 3px;
}
.cart-controls button:active {
  transform: scale(0.9);
}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .hero-slide img {
    animation: none;
  }
  .hero-slide {
    transition: none;
  }
}