/* =============================================
   MODERNA — home.css — Luxe Minimaliste
   ============================================= */

/* ── HERO ── */
.hero{position:relative;height:96vh;min-height:620px;overflow:hidden;background:var(--dark);}
.hero-track{display:flex;height:100%;transition:transform .9s cubic-bezier(.76,0,.24,1);}
.hero-slide{min-width:100%;height:100%;position:relative;opacity:0;transition:opacity .9s ease;}
.hero-slide.active{opacity:1;}
.slide-bg{position:absolute;inset:0;background-size:cover;background-position:center top;transform:scale(1.04);transition:transform 8s ease;}
.hero-slide.active .slide-bg{transform:scale(1);}
.slide-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.05) 100%);}
.slide-content{
  position:absolute;bottom:12%;left:7%;max-width:560px;color:white;
  transform:translateY(36px);opacity:0;
  transition:transform 1s cubic-bezier(.16,1,.3,1) .4s,opacity 1s ease .4s;
}
.hero-slide.active .slide-content{transform:translateY(0);opacity:1;}
.slide-tag{font-size:11px;letter-spacing:5px;font-weight:400;text-transform:uppercase;display:inline-block;margin-bottom:20px;border:1px solid rgba(255,255,255,.4);color:rgba(255,255,255,.8);padding:6px 16px;}
.slide-content h1{font-family:var(--font-title);font-size:clamp(46px,6.5vw,90px);font-weight:300;line-height:1.0;margin-bottom:20px;}
.slide-content h1 em{font-style:italic;color:var(--gold-light);}
.slide-content p{font-size:17px;color:rgba(255,255,255,.65);line-height:1.85;font-weight:300;max-width:400px;margin-bottom:36px;}
.hero-controls{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:10;}
.hero-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.3);border:none;cursor:pointer;transition:all .4s;}
.hero-dot.active{background:white;width:28px;border-radius:3px;}
.hero-arrows{position:absolute;bottom:24px;right:5%;display:flex;gap:8px;z-index:10;}
.hero-arrow{width:44px;height:44px;border:1px solid rgba(255,255,255,.25);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.3s;color:white;}
.hero-arrow:hover{background:white;color:var(--dark);}
.hero-arrow svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;}
.hero-label{position:absolute;top:50%;right:20px;transform:translateY(-50%) rotate(90deg);font-size:8px;letter-spacing:4px;color:rgba(255,255,255,.2);text-transform:uppercase;pointer-events:none;}

/* ── MARQUEE ── */
.marquee-band{background:var(--dark);padding:11px 0;overflow:hidden;white-space:nowrap;border-top:1px solid rgba(255,255,255,.06);}
.marquee-track{display:inline-block;animation:marquee 32s linear infinite;}
.marquee-item{font-size:11px;letter-spacing:2px;color:rgba(255,255,255,.5);text-transform:uppercase;font-weight:300;margin:0 4px;}
.marquee-sep{color:var(--gold);margin:0 20px;font-size:8px;}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── CATEGORIES ── */
.categories-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:3px;background:var(--light);}
@media(max-width:900px){.categories-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.categories-grid{grid-template-columns:1fr;}}
.cat-card{position:relative;overflow:hidden;aspect-ratio:3/4;cursor:pointer;display:block;}
.cat-card img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1);}
.cat-card:hover img{transform:scale(1.06);}
.cat-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.1) 55%,transparent 100%);transition:.4s;}
.cat-card:hover .cat-overlay{background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.2) 55%,transparent 100%);}
.cat-info{position:absolute;bottom:0;left:0;right:0;text-align:center;color:white;padding:32px 20px;}
.cat-info h3{font-family:var(--font-title);font-size:26px;font-weight:300;letter-spacing:3px;margin-bottom:10px;}
.cat-info span{font-size:11px;letter-spacing:1.5px;font-weight:400;text-transform:uppercase;display:inline-block;border:1px solid rgba(255,255,255,.4);color:rgba(255,255,255,.8);padding:5px 14px;opacity:0;transform:translateY(10px);transition:.4s;}
.cat-card:hover .cat-info span{opacity:1;transform:translateY(0);}

/* ── PRODUCTS ── */
.products-section{padding:0 5% 96px;}
.products-filter{display:flex;justify-content:center;gap:6px;margin-bottom:52px;flex-wrap:wrap;}
.filter-btn{background:none;border:1px solid var(--light);font-size:13px;letter-spacing:2px;font-weight:400;text-transform:uppercase;color:var(--mid);padding:10px 22px;transition:all .3s;cursor:pointer;font-family:var(--font-body);}
.filter-btn:hover{border-color:var(--dark);color:var(--dark);}
.filter-btn.active{background:var(--dark);border-color:var(--dark);color:white;}

/* Grille produits — MISE EN VALEUR PHOTO */
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media(max-width:1100px){.products-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:800px){.products-grid{grid-template-columns:repeat(2,1fr);gap:14px;}}
@media(max-width:480px){.products-grid{grid-template-columns:repeat(2,1fr);gap:10px;}}

/* Carte produit — élégante avec ombre */
.product-card{
  position:relative;background:white;overflow:hidden;
  transition:transform .4s ease,box-shadow .4s ease;
  border:1px solid var(--light);
}
.product-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 64px rgba(0,0,0,.1);
  border-color:transparent;
  z-index:2;
}

/* Image — grande, format portrait */
.product-img-wrap{position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--cream);}
.product-img-wrap img{
  width:100%;height:100%;object-fit:cover;object-position:top center;
  transition:transform .9s cubic-bezier(.16,1,.3,1);
}
.product-card:hover .product-img-wrap img{transform:scale(1.06);}

/* Bouton hover sur l'image */
.btn-addcart{
  background:white;color:var(--dark);border:none;
  padding:12px 28px;font-family:var(--font-body);font-size:9px;
  letter-spacing:2px;font-weight:400;text-transform:uppercase;
  transition:all .3s;cursor:pointer;
  box-shadow:0 2px 12px rgba(0,0,0,.1);
}
.btn-addcart:hover{background:var(--dark);color:white;}

/* Info produit — stylé */
.product-info{padding:0;background:white;}

/* Nom + catégorie */
.product-info-top{padding:14px 16px 12px;}
.product-cat{font-size:11px;letter-spacing:2px;color:var(--gold);text-transform:uppercase;margin-bottom:5px;font-weight:400;}
.product-name{font-family:var(--font-title);font-size:18px;font-weight:300;color:var(--dark);margin-bottom:8px;line-height:1.2;}
.product-sizes{display:flex;gap:4px;flex-wrap:wrap;}
.size-tag{font-size:11px;color:var(--mid);border:1px solid var(--light);padding:3px 8px;letter-spacing:.5px;}

/* Bloc prix — mis en valeur */
.product-price-block{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;
  background:var(--cream);
  border-top:1px solid var(--light);
}
.product-price{font-size:16px;font-weight:400;color:var(--dark);font-family:var(--font-title);}
.product-price .old{color:var(--mid);text-decoration:line-through;font-weight:300;font-size:12px;font-family:var(--font-body);display:block;margin-bottom:1px;}
.product-price-eur{font-size:13px;color:var(--mid);font-weight:300;}

/* ── VIDEO ── */
.video-section{position:relative;height:72vh;overflow:hidden;}
.video-section img,.video-section video{width:100%;height:100%;object-fit:cover;display:block;}
.video-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(0,0,0,.38);color:#fff;padding:20px;}
.video-overlay h2{font-family:var(--font-title);font-size:clamp(32px,5vw,64px);font-weight:300;margin:14px 0 24px;letter-spacing:1px;}
.video-overlay em{font-style:italic;color:var(--gold-light);}

/* ── CATALOGUE ── */
.cat-hero{position:relative;height:52vh;min-height:380px;overflow:hidden;background:var(--dark);}
.cat-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;}
.cat-hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.7),rgba(0,0,0,.25));}
.cat-hero-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:white;padding:20px;}
.cat-hero-content h1{font-family:var(--font-title);font-size:clamp(42px,7vw,84px);font-weight:300;letter-spacing:5px;margin:10px 0;}
.cat-hero-content p{font-size:13px;color:rgba(255,255,255,.6);max-width:480px;line-height:1.75;margin-top:10px;font-weight:300;}

.filter-bar{display:flex;justify-content:space-between;align-items:center;padding:20px 5%;border-bottom:1px solid var(--light);background:white;position:sticky;top:0;z-index:100;gap:16px;flex-wrap:wrap;}
.filter-bar-left{display:flex;gap:8px;flex-wrap:wrap;}
.filter-pill{background:none;border:1px solid var(--light);font-size:13px;letter-spacing:1px;font-weight:400;text-transform:uppercase;color:var(--mid);padding:9px 20px;transition:.3s;cursor:pointer;font-family:var(--font-body);}
.filter-pill:hover{border-color:var(--dark);color:var(--dark);}
.filter-pill.active{background:var(--dark);border-color:var(--dark);color:white;}
.count-label{font-size:14px;color:var(--mid);letter-spacing:1px;font-weight:300;}
.catalogue-layout{padding:32px 5% 80px;max-width:1400px;margin:0 auto;}
.catalogue-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media(max-width:1100px){.catalogue-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:800px){.catalogue-grid{grid-template-columns:repeat(2,1fr);gap:14px;}}
@media(max-width:480px){.catalogue-grid{grid-template-columns:repeat(2,1fr);gap:10px;}}

/* ── SECTION MARQUE ── */
.brand-section{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:600px;
  background:var(--cream);
}
@media(max-width:860px){.brand-section{grid-template-columns:1fr;}}

.brand-img{
  position:relative;overflow:hidden;
  min-height:500px;
}
.brand-img img{
  width:100%;height:100%;
  object-fit:cover;object-position:top center;
  transition:transform 1s ease;
}
.brand-section:hover .brand-img img{transform:scale(1.03);}
.brand-img-label{
  position:absolute;bottom:24px;left:24px;
  background:var(--dark);color:white;
  font-size:8px;letter-spacing:4px;text-transform:uppercase;
  padding:7px 16px;font-weight:300;
}

.brand-text{
  display:flex;flex-direction:column;justify-content:center;
  padding:72px 64px;
}
@media(max-width:860px){.brand-text{padding:52px 32px;}}

.brand-title{
  font-family:var(--font-title);
  font-size:clamp(28px,3.5vw,46px);
  font-weight:300;line-height:1.15;
  margin:14px 0 28px;
  color:var(--dark);
}
.brand-title em{font-style:italic;color:var(--gold);}

.brand-desc{
  font-size:15px;color:var(--mid);
  line-height:1.95;font-weight:300;
  margin-bottom:16px;max-width:420px;
}
