/* ========== Base ==========
   Fichier: public/assets/css/style.css
   Mobile-first, compatible Bootstrap 5
=================================== */

/* Corps / typo */
body {
  background: #f7f6ee;
  color: #1c1c1c;
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans';
}

/* Aides simples */
.bg-cream { background: #f7f6ee; }
.text-dark { color: #1c1c1c; }
.display-hero { font-family: 'Playfair Display', serif; font-weight: 600; }

/* ===== Logo responsive ===== */
.logo-fluid {
  display: block;
  height: auto;
  width: clamp(140px, 40vw, 240px);
  max-width: 100%;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.08));
}

/* Bouton caché par défaut */
.time-locked { display: none; }

/* Style visuel si tu veux montrer un bouton “verrouillé” avant l’heure (optionnel) */
.btn-locked {
  pointer-events: none;
  opacity: .5;
  filter: grayscale(0.2);
} 

@media (max-width: 480px) {
  .logo-fluid { width: clamp(140px, 55vw, 200px); }
}

/* ===== Hero / fonds ===== */
.hero-wrap {
  background:
    radial-gradient(1200px 480px at 20% -10%, rgba(217,183,119,.22), transparent 60%),
    radial-gradient(800px 360px at 85% 10%, rgba(0,0,0,.06), transparent 60%);
}

/* Dégradé doré + halo doux */
.bg-gradient-gold {
  background:
    radial-gradient(1000px 420px at 20% -10%, rgba(217,183,119,.30), transparent 60%),
    radial-gradient(900px 380px at 85% 8%, rgba(0,0,0,.06), transparent 62%);
}

/* Légère texture "noise" */
.bg-noise { position: relative; }
.bg-noise::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none; opacity: .06;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Photo plein écran avec voile sombre (à utiliser avec --cover inline si besoin) */
.cover-hero {
  position: relative;
  background: center/cover no-repeat url('../img/cover-birthday.jpg');
}
.cover-hero::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,.55));
}
.cover-hero > .container { position: relative; z-index: 1; }

/* Version photo overlay générique (fallback hero) */
.bg-photo-overlay {
  position: relative;
  background: center/cover no-repeat url('../img/hero-fallback.jpg');
}
.bg-photo-overlay::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(247,246,238,.88), rgba(247,246,238,.88));
}

/* Badges/Buttons doux */
.badge-soft {
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.05);
}
.btn-dark-soft {
  background: #1c1c1c;
  border-color: #1c1c1c;
  color: #fff;
}
.btn-dark-soft:hover {
  filter: brightness(1.05);
  box-shadow: 0 10px 24px rgba(0,0,0,.15);
}

/* Cartes / mosaïque (si besoin plus tard) */
.card.shadow-sm { box-shadow: 0 10px 30px rgba(0,0,0,.06) !important; }

/* Lisibilité mobile */
@media (max-width: 480px) {
  .display-hero { font-size: 2rem; }
  .lead { font-size: 1rem; }
}