/* ============================================================
   Lady Lily — Couche PREMIUM (à charger APRÈS style.css)
   Additive : n'écrase pas la logique, embellit les détails.
   Charte : nuit #050507 · champagne #d8c48f / reflets #f3e7c4
   Pour retirer : enlever le <link> premium.css. C'est réversible.
   ============================================================ */

/* ---------- Réglages fins globaux ---------- */
::selection{ background:var(--accent); color:#14100a; }
html{ scroll-behavior:smooth; }
*{ -webkit-tap-highlight-color:transparent; }

/* Barre de défilement discrète champagne */
*{ scrollbar-color:var(--accent-dim) transparent; scrollbar-width:thin; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,var(--accent-dim),#6d6248); border-radius:20px; border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background:var(--accent); }

/* Accessibilité : focus élégant */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--accent); outline-offset:3px; border-radius:2px;
}

/* ---------- Titres nimbés (subtil dégradé champagne) ---------- */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .section-title, .hero-inner h1{
    background-image:linear-gradient(180deg, var(--text) 0%, #d7d3de 55%, var(--accent) 140%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 2px 34px rgba(216,196,143,.12));
  }
}
.hero-inner h1{ letter-spacing:.005em; }

/* Étoile décorative devant les intitulés de section */
.section-eyebrow{ display:inline-flex; align-items:center; gap:.6em; }
.section-eyebrow::before{
  content:'✶'; color:var(--accent); font-size:.9em; line-height:1;
  filter:drop-shadow(0 0 8px rgba(216,196,143,.6));
  animation:llTwinkle 4s ease-in-out infinite;
}
@keyframes llTwinkle{ 0%,100%{opacity:.55;transform:scale(1)} 50%{opacity:1;transform:scale(1.15)} }

/* ---------- Navigation : verre dépoli au défilement ---------- */
#header{ transition:background .4s ease, backdrop-filter .4s ease, border-color .4s ease, box-shadow .4s ease; }
#header.scrolled{
  background:rgba(5,5,7,.62)!important;
  backdrop-filter:blur(14px) saturate(1.2);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid var(--line);
  box-shadow:0 10px 40px -24px rgba(0,0,0,.9);
}

/* ---------- Hero : profondeur & points de navigation ---------- */
.hero-inner h1{ text-shadow:0 6px 60px rgba(0,0,0,.5); }
.hero-dots button{ transition:transform .3s, box-shadow .3s, background .3s; }
.hero-dots button.active{ box-shadow:0 0 14px rgba(216,196,143,.8); }

/* ---------- Recherche : halo champagne au focus ---------- */
.search-wrap input{
  transition:border-color .3s, box-shadow .3s, background .3s;
  background:rgba(13,13,19,.6); backdrop-filter:blur(6px);
}
.search-wrap input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(216,196,143,.14), 0 12px 40px -18px rgba(216,196,143,.4);
}
.search-ic{ transition:color .3s; }
.search-wrap:focus-within .search-ic{ color:var(--accent); }

/* ---------- Filtres : pastilles raffinées + halo actif ---------- */
.filter-chip{
  transition:color .25s, border-color .25s, background .25s, box-shadow .25s, transform .25s;
  backdrop-filter:blur(6px);
}
.filter-chip:hover{ color:var(--text); border-color:var(--accent-dim); transform:translateY(-1px); }
.filter-chip.active{
  background:linear-gradient(180deg,var(--accent-2),var(--accent));
  color:#14100a; border-color:var(--accent);
  box-shadow:0 0 22px -4px rgba(216,196,143,.5);
}

/* ---------- Cartes produit : verre dépoli, halo, reflets ---------- */
.card{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, rgba(20,20,28,.66), rgba(13,13,19,.82));
  backdrop-filter:blur(8px);
  border:1px solid var(--line);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s, border-color .5s;
}
/* liseré supérieur champagne */
.card::after{
  content:''; position:absolute; top:0; left:0; right:0; height:1px; z-index:3; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(216,196,143,.55), transparent);
  opacity:.4; transition:opacity .5s;
}
/* reflet qui balaie la carte au survol */
.card::before{
  content:''; position:absolute; inset:0; z-index:3; pointer-events:none;
  background:linear-gradient(120deg, transparent 32%, rgba(243,231,196,.10) 50%, transparent 68%);
  transform:translateX(-120%); transition:transform 1s cubic-bezier(.2,.7,.2,1);
}
.card:hover{
  transform:translateY(-6px);
  border-color:rgba(216,196,143,.45);
  box-shadow:0 26px 60px -26px rgba(0,0,0,.85), 0 0 46px -14px rgba(216,196,143,.22);
}
.card:hover::after{ opacity:1; }
.card:hover::before{ transform:translateX(120%); }

/* image : léger zoom + dégradé de profondeur */
.card .thumb{ position:relative; overflow:hidden; }
.card .thumb img{ transition:transform .9s cubic-bezier(.2,.7,.2,1), filter .6s; will-change:transform; }
.card:hover .thumb img{ transform:scale(1.06); }
.card .thumb::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, transparent 55%, rgba(5,5,7,.55) 100%);
}

/* badge (Fait main / Dernières pièces / Épuisé) */
.card .thumb .tag{
  backdrop-filter:blur(6px);
  background:rgba(5,5,7,.5)!important; border:1px solid var(--line);
  letter-spacing:.14em; text-transform:uppercase; font-size:10px;
}
/* bouton favori */
.card .fav-btn{ transition:transform .3s, color .3s, background .3s; }
.card .fav-btn:hover{ transform:scale(1.15); color:var(--accent); }
.card .fav-btn.on{ color:var(--accent); filter:drop-shadow(0 0 6px rgba(216,196,143,.6)); }

/* corps de carte */
.card-body h3{ transition:color .3s; }
.card:hover .card-body h3{ color:var(--accent-2); }
.card .price{ color:var(--accent); letter-spacing:.02em; }
.card .swatches i{ box-shadow:0 0 0 1px rgba(255,255,255,.15), 0 2px 6px rgba(0,0,0,.5); }

/* bouton "Voir" de la carte */
.card .add{ position:relative; overflow:hidden; transition:color .3s, border-color .3s, background .3s; }
.card .add::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
  transform:translateX(-130%); transition:transform .8s;
}
.card .add:hover::before{ transform:translateX(130%); }

/* ---------- Boutons principaux : reflet + halo ---------- */
.btn, .btn-solid{ position:relative; overflow:hidden; transition:transform .3s, box-shadow .3s, background .3s, color .3s, border-color .3s; }
.btn::before, .btn-solid::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 28%, rgba(255,255,255,.38) 50%, transparent 72%);
  transform:translateX(-130%); transition:transform .9s cubic-bezier(.2,.7,.2,1);
}
.btn:hover::before, .btn-solid:hover::before{ transform:translateX(130%); }
.btn:hover, .btn-solid:hover{ transform:translateY(-2px); box-shadow:0 14px 40px -16px rgba(216,196,143,.5); }

/* ---------- Révélation au scroll : on ajoute un flou (classes existantes) ---------- */
.reveal{ transition-property:opacity, transform, filter; }
.reveal:not(.visible){ filter:blur(7px); }
.reveal.visible{ filter:blur(0); }

/* ---------- Sections informatives : petites finitions ---------- */
.stat .n{ background-image:linear-gradient(180deg,var(--accent-2),var(--accent)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.faq-item{ transition:border-color .3s, background .3s; }
.faq-item:hover{ border-color:var(--accent-dim); }
.lb-item{ overflow:hidden; }
.lb-item img{ transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.lb-item:hover img{ transform:scale(1.05); }

/* newsletter & pied de page */
.newsletter{ position:relative; }
.newsletter input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(216,196,143,.12); }
.site-footer{ border-top:1px solid var(--line); }

/* Respect de la préférence "réduire les animations" */
@media (prefers-reduced-motion: reduce){
  .card, .card .thumb img, .btn, .btn-solid, .filter-chip, .lb-item img{ transition:none!important; }
  .card::before, .btn::before, .btn-solid::before, .card .add::before{ display:none; }
  .reveal:not(.visible){ filter:none; }
  .section-eyebrow::before{ animation:none; }
}
