/* Vitrine Primevère : bleu nuit et or comme la façade de la boutique, arches, lumière dorée,
   titres Cormorant (latin) et Amiri (arabe). Se charge après style.css. Les fenêtres (fiche, panier) restent claires. */
:root{
  --navy:#1b2438; --navy-2:#26324d; --ink:#1b2438; --muted:#6b645c; --line:#ece4d6;
  --bg:#111a2c; --soft:#f5eddc; --teal:#c9a14a; --teal-dark:#9a7425; --teal-deep:#7a5a17;
  --noir:#111a2c; --noir-2:#16213a; --noir-3:#1d2a47; --or:#d9b25c; --or-clair:#f1d796; --creme:#f4efe4; --gris:#a3acc0;
  --filet:rgba(217,178,92,.22);
  --dore:linear-gradient(120deg,#f6e2a6,#d9b25c 45%,#a8791f);
  --r:4px;
}
html,body{overflow-x:clip}
body{background:var(--noir);color:var(--creme)}
h1,h2,.ved-nom,.fiche-info h3,.drawer-head h3,.why strong,.cat-photo strong,.etapes strong{font-family:Cormorant,'Amiri',serif;font-weight:600;letter-spacing:0}
[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] .ved-nom,[dir=rtl] .fiche-info h3,[dir=rtl] .drawer-head h3,[dir=rtl] .why strong,[dir=rtl] .cat-photo strong,[dir=rtl] .etapes strong{font-family:Amiri,serif;font-weight:700}
h2{font-size:clamp(34px,4.6vw,56px);line-height:1.02;color:var(--creme)}
[dir=rtl] h2{font-size:clamp(30px,4vw,48px);line-height:1.4}
h1 span,h2 em{font-style:italic;background:linear-gradient(100deg,#a8791f,#f6e2a6 25%,#d9b25c 50%,#f6e2a6 75%,#a8791f);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:or 6s linear infinite}
[dir=rtl] h1 span,[dir=rtl] h2 em{font-style:normal}
@keyframes or{to{background-position:-200% 0}}
.eyebrow{background:none;border-radius:0;padding:0;color:var(--or);text-transform:uppercase;letter-spacing:.32em;font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--or)}
[dir=rtl] .eyebrow{letter-spacing:0;font-size:14px;text-transform:none}
.center{text-align:center}
.lead{color:var(--gris)}

/* Bandeau et en-tête */
.topbar{background:#0b1220;color:var(--gris);border-bottom:1px solid var(--filet)}
.topbar .ic{color:var(--or)}
.topbar a{color:var(--creme)}
.site-header{background:rgba(17,26,44,.86);border-bottom:1px solid var(--filet)}
.site-header.scrolled{background:rgba(17,26,44,.96)}
.logo img{height:48px}
.nav{color:var(--gris);text-transform:uppercase;letter-spacing:.18em;font-size:11.5px}
[dir=rtl] .nav{letter-spacing:0;font-size:14px;text-transform:none}
.nav a:hover{color:var(--creme)}
.nav a::after{background:var(--or)}
.lang{background:transparent;border-color:var(--filet);color:var(--creme);border-radius:0}
.lang:hover{border-color:var(--or)}
.cart-btn{background:var(--dore);color:var(--noir)}
.cart-n{background:var(--creme);color:var(--noir);border-color:var(--noir)}

/* Boutons */
.btn{border-radius:0;letter-spacing:.06em}
.btn-lg{padding:17px 28px}
.btn-primary{position:relative;overflow:hidden;background:var(--dore);color:var(--noir);box-shadow:0 12px 36px rgba(217,178,92,.18)}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s}
.btn-primary:hover{background:var(--dore);transform:translateY(-2px)}
.btn-primary:hover::after{transform:translateX(120%)}
.btn-wa{background:transparent;color:var(--creme);border-color:rgba(37,211,102,.6);box-shadow:none}
.btn-wa .ic{color:var(--wa)}
.btn-wa:hover{background:rgba(37,211,102,.1)}
.btn-ghost{background:transparent;border-color:var(--filet);color:var(--creme)}
.btn-ghost:hover{border-color:var(--or);color:var(--or-clair)}

/* Accueil */
.hero{--mx:72%;--my:28%;background:var(--noir);padding:80px 0 110px;isolation:isolate}
.hero::after{display:none}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(460px circle at var(--mx) var(--my),rgba(217,178,92,.10),transparent 70%)}
.lumiere{position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(60% 70% at 75% 35%,rgba(217,178,92,.22),transparent 60%),
  conic-gradient(from 200deg at 75% -10%,transparent 0 10deg,rgba(241,215,150,.07) 14deg,transparent 22deg,rgba(241,215,150,.05) 30deg,transparent 40deg);}
.lumiere::before,.lumiere::after{content:"";position:absolute;border:1px solid var(--filet);border-radius:50%}
.lumiere::before{width:640px;height:640px;top:-80px;inset-inline-end:-120px}
.lumiere::after{width:900px;height:900px;top:-210px;inset-inline-end:-250px;opacity:.5}
@media (min-width:761px){.hero-grid{grid-template-columns:1.05fr .95fr}}
h1{font-size:clamp(48px,7vw,96px);line-height:.98;font-weight:500;color:var(--creme)}
[dir=rtl] h1{font-size:clamp(40px,5.8vw,76px);line-height:1.35}
.hero .eyebrow{margin-bottom:26px}
.hero .lead{font-size:17px;margin:26px 0 34px}
.trust{gap:30px;border-top:1px solid var(--filet);padding-top:26px;margin-top:40px}
.trust-ic{background:none;box-shadow:none;border:1px solid var(--filet);border-radius:50%;color:var(--or)}
.trust strong{color:var(--creme);font-weight:600}
.trust small{color:var(--gris)}

/* Scène : vedette sous une arche */
.scene{position:relative;padding:10px 0}
.ved-card{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--filet);border-radius:240px 240px 6px 6px;padding:14px 14px 18px;color:var(--creme);box-shadow:0 40px 100px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06);max-width:400px;transition:transform .25s ease-out}
.ved-card::before{display:none}
.ved-pic{aspect-ratio:4/5;border-radius:226px 226px 2px 2px;background:#1c2740}
.ved-tag{background:var(--noir);color:var(--or);border:1px solid var(--filet);border-radius:0;top:auto;bottom:14px;letter-spacing:.12em;text-transform:uppercase;font-size:10.5px}
[dir=rtl] .ved-tag{letter-spacing:0;font-size:12px}
.ved-info{padding:18px 6px 6px}
.ved-nom{font-size:24px;font-weight:600}
.ved-det{color:var(--gris)}
.ved-prix{color:var(--or-clair);font-family:Poppins,Cairo,sans-serif}
.ved-prix s{color:var(--gris)}
.ved-card .btn-ghost{color:var(--creme)}
.ved-vide{border-radius:240px 240px 6px 6px;background:linear-gradient(110deg,#172138 30%,#202d4a 50%,#172138 70%);background-size:200% 100%;max-width:400px}
.sceau{position:absolute;z-index:3;width:150px;height:150px;top:-14px;inset-inline-start:2%;animation:tourne 26s linear infinite}
.sceau text{direction:ltr;unicode-bidi:embed;font-family:Poppins,sans-serif;font-size:12px;letter-spacing:1px;fill:var(--or);font-weight:500}
@keyframes tourne{to{rotate:360deg}}
.flotte{position:absolute;z-index:2;bottom:12%;inset-inline-start:0;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 8px 10px;background:rgba(17,26,44,.8);border:1px solid var(--filet);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 24px 50px rgba(0,0,0,.5);animation:flotte 7s ease-in-out infinite}
.flotte img{width:96px;height:96px;display:block;object-fit:cover}
.flotte span{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--or)}
[dir=rtl] .flotte span{letter-spacing:0;font-size:12px}
@keyframes flotte{0%,100%{translate:0 0}50%{translate:0 -12px}}

/* Bandeau défilant : lettres dorées en contour */
.defile{border-block:1px solid var(--filet);overflow:hidden;white-space:nowrap;padding:22px 0;background:var(--noir-2)}
.defile-in{display:inline-flex;animation:defile 36s linear infinite}
.defile span{font-family:Cormorant,Amiri,serif;font-style:italic;font-size:clamp(30px,4vw,52px);font-weight:500;color:transparent;-webkit-text-stroke:1px var(--or);padding-inline-end:.3em}
[dir=rtl] .defile span{font-family:Amiri,serif;font-style:normal;color:var(--or);-webkit-text-stroke:0;opacity:.85}
[dir=rtl] .defile-in{animation-name:defile-rtl}
@keyframes defile{to{transform:translateX(-50%)}}
@keyframes defile-rtl{to{transform:translateX(50%)}}

/* Univers : cinq arches */
.cats{margin-top:0;padding:100px 0 20px}
.cats .head{margin-bottom:34px}
.cats-grid.n5{grid-template-columns:repeat(5,1fr)}
.cats-grid{gap:18px}
.cat-photo{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;padding:0;background:none;border:0;box-shadow:none;text-align:center;color:var(--creme)}
.cat-photo:hover{transform:none;box-shadow:none}
.cat-photo .cat-img{display:block;width:100%;aspect-ratio:3/4;border-radius:999px 999px 4px 4px;overflow:hidden;border:1px solid var(--filet);padding:6px;transition:border-color .4s}
.cat-photo .cat-img img{width:100%;height:100%;object-fit:cover;border-radius:999px 999px 2px 2px;transition:transform .8s cubic-bezier(.2,.7,.2,1);display:block}
.cat-photo:hover .cat-img{border-color:var(--or)}
.cat-photo:hover .cat-img img{transform:scale(1.08)}
.cat-photo strong{font-size:24px;font-weight:500;display:block}
.cat-photo small{color:var(--gris);font-size:12px;letter-spacing:.08em}

/* Catalogue sur fond noir */
.catalogue{padding-top:90px}
.count{color:var(--gris)}
.search{background:transparent;border:0;border-bottom:1px solid var(--filet);border-radius:0;box-shadow:none;padding:0 4px}
.search:focus-within{border-color:var(--or)}
.search input{color:var(--creme)}
.search input::placeholder{color:#7f8aa3}
.search .ic{color:var(--or)}
.chip{background:transparent;border-color:var(--filet);color:var(--gris);border-radius:0;letter-spacing:.06em}
.chip:hover{color:var(--creme);border-color:var(--or)}
.chip.on{background:var(--or);border-color:var(--or);color:var(--noir)}
.grid{gap:26px 20px}
@media (min-width:961px){.grid{grid-template-columns:repeat(3,1fr);gap:34px 26px}}
.card{background:transparent;border:0;border-radius:0;overflow:visible}
.card:hover{transform:none;box-shadow:none}
.pic{aspect-ratio:4/5;background:#1c2740;border:1px solid var(--filet);transition:border-color .4s}
.card:hover .pic{border-color:var(--or)}
.card:hover .pic img{transform:scale(1.06)}
.badges{top:12px;inset-inline-start:12px}
.badge{border-radius:0;box-shadow:none;letter-spacing:.08em;text-transform:uppercase;font-size:10px}
.b-promo{background:var(--dore);color:var(--noir)}
.b-off{background:var(--noir);color:var(--gris);border:1px solid var(--filet)}
.info{padding:16px 2px 0;text-align:center;align-items:center}
.name{color:var(--creme);font-family:Cormorant,Amiri,serif;font-size:21px;font-weight:600;text-align:center}
[dir=rtl] .name{font-family:Amiri,serif;font-size:19px}
.name:hover{color:var(--or-clair)}
.spec{color:var(--gris)}
.price{color:var(--or-clair);font-weight:600;font-size:17px}
.price s{color:#7f8aa3}
.order{background:transparent;color:var(--creme);border:1px solid var(--filet);border-radius:0;letter-spacing:.06em}
.order:hover{background:var(--or);color:var(--noir);border-color:var(--or)}
.order.in{background:rgba(217,178,92,.12);color:var(--or-clair);border-color:var(--or)}
.order.ask{background:transparent;color:var(--gris);border-color:var(--filet)}
.empty,.load-msg{color:var(--gris)}

/* L'art d'offrir */
.cadeau{padding:110px 0}
.cadeau-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.cadeau-img{display:block;aspect-ratio:4/5;border-radius:999px 999px 4px 4px;overflow:hidden;border:1px solid var(--filet);padding:8px}
.cadeau-img img{width:100%;height:100%;object-fit:cover;border-radius:999px 999px 2px 2px;transition:transform .9s}
.cadeau-img:hover img{transform:scale(1.05)}
.cadeau .lead{margin:22px 0 34px}
.etapes{list-style:none;display:flex;flex-direction:column}
.etapes li{display:flex;gap:22px;align-items:baseline;padding:20px 0;border-top:1px solid var(--filet)}
.etapes li:last-child{border-bottom:1px solid var(--filet)}
.etapes span{font-family:Cormorant,serif;font-style:italic;font-size:30px;color:var(--or);min-width:42px}
.etapes strong{display:block;font-size:24px;font-weight:500}
.etapes small{color:var(--gris);font-size:14px}

/* La boutique : façade et marques */
.maison{padding:100px 0 110px}
.maison-in{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.maison-img{border:1px solid var(--filet);padding:8px}
.maison-img img{width:100%;height:auto;display:block;aspect-ratio:878/768;object-fit:cover}
.maison .lead{margin:22px 0 26px}
.marques{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.marques li{border:1px solid var(--filet);padding:7px 14px;font-size:12.5px;letter-spacing:.06em;color:var(--creme)}
[dir=rtl] .marques{direction:ltr;justify-content:flex-end}

/* Pourquoi nous */
.pourquoi{background:var(--noir-2);border-block:1px solid var(--filet);padding:96px 0}
.why-grid{gap:0;margin-top:50px}
.why{background:none;box-shadow:none;border-radius:0;padding:10px 28px 6px;border-inline-start:1px solid var(--filet)}
.why:first-child{border-inline-start:0}
.why-ic{background:none;color:transparent;-webkit-text-stroke:1px var(--or);font-family:Cormorant,serif;font-size:58px;font-weight:500;width:auto;height:auto;margin-bottom:10px;display:block;line-height:1}
.why strong{font-size:24px;color:var(--creme);font-weight:500}
.why p{color:var(--gris)}

/* Instagram */
.reseau{padding:110px 0 40px}
.reseau-in{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.reseau-txt p{color:var(--gris);font-size:16px;margin:20px 0 32px;max-width:440px}
.mosaique{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mosaique img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--filet);display:block}
.mosaique img:nth-child(even){translate:0 34px}

/* Contact et pied de page */
.box{background:var(--noir-2);border:1px solid var(--filet);border-radius:0;box-shadow:none}
.row{color:var(--creme)}
.row-ic{background:none;border:1px solid var(--filet);border-radius:50%;color:var(--or)}
.row a:hover{color:var(--or-clair)}
.social a{border-color:var(--filet);color:var(--gris);border-radius:0}
.social a:hover{color:var(--or-clair);border-color:var(--or)}
.map-box{filter:grayscale(.6) contrast(1.05)}
.site-footer{background:#0b1220;border-top:1px solid var(--filet);color:var(--gris);margin-top:60px}
.site-footer h4{color:var(--or);font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-size:11.5px}
[dir=rtl] .site-footer h4{letter-spacing:0;font-size:14px}
.foot-bottom{border-color:var(--filet)}
.float-cart{background:var(--dore);color:var(--noir)}
.toast{background:var(--noir-3);color:var(--or-clair);border:1px solid var(--filet)}

/* Fenêtres claires (fiche produit, panier) */
dialog{background:#faf7f2;color:var(--ink);border-radius:2px}
dialog::backdrop{background:rgba(8,13,24,.75)}
.fiche-media,.ligne-img{background:#1c2740}
.vignettes{background:#faf7f2}
.fiche-info .price,.total strong{color:var(--teal-deep)}
.fiche-info .price s{color:var(--muted)}
.fiche-info .btn-ghost,.sent .btn-ghost{color:var(--ink);border-color:var(--line)}
.fiche-info .btn-primary{background:var(--navy);color:#fff}
.drawer{border-radius:0}
.drawer-body{background:#f5f0e6}
.drawer .btn-wa,.sent .btn-wa{background:var(--wa);color:var(--wa-ink);border-color:transparent}
.drawer .btn-wa .ic,.sent .btn-wa .ic{color:currentColor}

/* Apparition au défilement */
.reveal{opacity:0;transform:translateY(30px);transition:opacity 1s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.reveal.vu{opacity:1;transform:none}
.why-grid .reveal:nth-child(2){transition-delay:.12s}
.why-grid .reveal:nth-child(3){transition-delay:.24s}
.why-grid .reveal:nth-child(4){transition-delay:.36s}
.cadeau-txt.reveal{transition-delay:.15s}

@media (max-width:960px){
  .cats-grid.n5{grid-template-columns:repeat(3,1fr)}
  .why-grid{grid-template-columns:1fr 1fr;gap:30px 0}
  .why:nth-child(3){border-inline-start:0}
  .cadeau-in,.reseau-in,.maison-in{grid-template-columns:1fr;gap:44px}
  .cadeau-img{max-width:420px;width:100%;margin:0 auto}
}
@media (max-width:760px){
  .logo img{height:40px}
  .hero{padding:40px 0 70px}
  .hero-grid{gap:44px}
  h1{font-size:clamp(46px,13vw,62px)}
  [dir=rtl] h1{font-size:clamp(38px,10.5vw,50px)}
  .hero .eyebrow{margin-bottom:18px}
  .hero .lead{font-size:15px;margin:18px 0 26px}
  .trust{gap:8px;padding-top:18px}
  .trust li{background:none;border:1px solid var(--filet);border-radius:0}
  .lumiere::before{width:420px;height:420px;top:auto;bottom:-60px;inset-inline-end:-160px}
  .lumiere::after{display:none}
  .sceau{width:104px;height:104px;top:-30px;inset-inline-start:-6px}
  .flotte{bottom:24%;inset-inline-start:auto;inset-inline-end:-6px}
  .flotte img{width:66px;height:66px}
  .ved-card{margin:0 auto}
  .defile{padding:14px 0}
  .cats{padding:64px 0 0}
  .cats-grid.n5{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:10px;scrollbar-width:none}
  .cats-grid.n5::-webkit-scrollbar{display:none}
  .cats-grid.n5 .cat-photo{flex:0 0 44%;scroll-snap-align:start;align-items:center}
  .cat-photo strong{font-size:20px}
  .catalogue{padding-top:56px}
  .grid{gap:26px 12px}
  .name{font-size:18px}
  .info{padding-top:12px}
  .cadeau{padding:70px 0}
  .etapes strong{font-size:21px}
  .pourquoi{padding:64px 0}
  .why{padding:6px 16px}
  .why-ic{font-size:44px}
  .why strong{font-size:20px}
  .reseau{padding:70px 0 40px}
  .maison{padding:70px 0 70px}
  .marques li{font-size:11.5px;padding:6px 10px}
}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}
@media (max-width:760px){
  .topbar-in>span:first-child{flex:1;min-width:0}
  .topbar-in>span:first-child>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Recherche rapide sur l'en-tête bleu nuit */
.search-btn{background:transparent;border-color:var(--filet);color:var(--creme)}
.search-btn:hover,.search-btn[aria-expanded=true]{border-color:var(--or);color:var(--or-clair)}
.rech-panel{border-top-color:var(--filet)}
.rech-barre .close{background:transparent;color:var(--creme);border-color:var(--filet);border-radius:0}
.rech-item{background:var(--noir-2);border-color:var(--filet);border-radius:0;color:var(--creme)}
.rech-item:hover{border-color:var(--or)}
.rech-img{background:#1c2740;border-radius:0}
.rech-txt strong{font-family:Cormorant,Amiri,serif;font-size:17px;font-weight:600}
[dir=rtl] .rech-txt strong{font-family:Amiri,serif;font-size:16px}
.rech-txt small,.rech-vide{color:var(--gris)}
.rech-prix{color:var(--or-clair);font-weight:600}
.rech-tout{color:var(--or)}

/* Marque, tailles, budgets et marques cliquables */
.marque{color:var(--or);letter-spacing:.2em;font-weight:600}
.info .marque{margin-bottom:2px}
.ved-card .marque{margin-bottom:4px}
dialog .marque{color:var(--teal-dark)}
.taille{border-radius:0}
.taille.on{background:var(--navy);border-color:var(--navy)}
.budgets{margin-top:30px}
.budgets-titre{display:block;font-family:Cormorant,Amiri,serif;font-size:24px;margin-bottom:12px}
[dir=rtl] .budgets-titre{font-family:Amiri,serif;font-size:21px}
.budgets-choix{display:flex;flex-wrap:wrap;gap:10px}
.budgets-choix .btn{padding:11px 16px;font-size:13px}
.marques-aide{color:var(--gris);font-size:12.5px;margin:-10px 0 10px}
.marques button{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer;padding:0}
.marques li:has(button){border-color:rgba(217,178,92,.5);cursor:pointer;transition:background .2s,color .2s}
.marques li:has(button):hover{background:var(--or);color:var(--noir)}
.marques li:not(:has(button)){opacity:.55}
.chip-budget{background:var(--or)!important;border-color:var(--or)!important;color:var(--noir)!important}
.form .cadeau-opt:has(input:checked){border-color:var(--or);background:#f6efdf}
.marques li:has(button){padding:0}
.marques button{display:block;padding:7px 14px}
@media (max-width:760px){.marques button{padding:6px 10px}}