:root{--cream:#FBF4EC;--pink:#F7C6CF;--pink2:#FCE6EA;--brown:#2D0E06;--lbrown:#B88A6E;--rose:#C9937E;--txt:#3A1C12;--r:18px}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font-family:Jost,system-ui,sans-serif;background:var(--cream);color:var(--txt);line-height:1.55}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;line-height:1.15}
img{max-width:100%}a{color:inherit}button,.btn{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:3px solid var(--rose);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}
.announce{background:var(--brown);color:var(--pink);overflow:hidden;white-space:nowrap;font-size:.9rem;padding:8px 0}
.track{display:inline-flex;gap:48px;animation:slide 30s linear infinite;padding-left:48px}.announce:hover .track{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.head{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;padding:8px 5vw;background:rgba(251,244,236,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--pink)}
.logo img{display:block;border-radius:50%}
#nav{display:flex;gap:22px;margin-left:12px;flex:1}
#nav a{text-decoration:none;padding:6px 2px;font-weight:500;border-bottom:2px solid transparent}#nav a:hover{border-color:var(--rose)}
#search{display:flex;border:1px solid var(--lbrown);border-radius:99px;overflow:hidden;background:#fff}
#search input{border:0;padding:8px 14px;width:170px;background:none;font:inherit}#search button{padding:0 12px}
.cartbtn{text-decoration:none;background:var(--brown);color:var(--pink);padding:8px 14px;border-radius:99px}
#burger{display:none;font-size:1.6rem}
.sec{padding:56px 5vw;max-width:1200px;margin:auto}
.hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:32px;padding:48px 5vw;max-width:1200px;margin:auto}
.hero h1{font-size:clamp(2.2rem,5vw,4rem);font-weight:800}.hero p{margin:16px 0 26px;max-width:34ch;font-size:1.1rem}
.btn{display:inline-block;text-decoration:none;background:linear-gradient(135deg,var(--rose),#E3B5A4);color:#fff;padding:14px 28px;border-radius:99px;font-weight:500;box-shadow:0 8px 20px rgba(201,147,126,.4);transition:transform .2s}
.btn:hover{transform:translateY(-2px)}.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.alt{background:var(--brown);color:var(--pink);box-shadow:none}.btn.ghost{background:none;border:1.5px solid var(--rose);color:var(--txt);box-shadow:none}
.stage{perspective:1100px;position:relative;height:440px;background:radial-gradient(circle at 50% 40%,var(--pink2),var(--pink) 70%);border-radius:50% 50% var(--r) var(--r)/40% 40% var(--r) var(--r);overflow:hidden}
.tilt{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .15s ease-out}
.group{position:absolute;inset:0;transform-style:preserve-3d;animation:turn 14s ease-in-out infinite}
.obj{position:absolute;filter:drop-shadow(0 26px 22px rgba(45,14,6,.3))}
.bottle{width:230px;left:50%;top:50%;margin:-120px 0 0 -115px;transform:translateZ(80px);animation:bob 5s ease-in-out infinite}
.lip{width:70px;left:14%;top:46%;transform:translateZ(-10px) rotate(-8deg);animation:bob 6s ease-in-out infinite .6s}
.bag{width:150px;right:8%;top:44%;transform:translateZ(-50px) rotate(6deg);animation:bob 7s ease-in-out infinite 1.2s}
.floor{position:absolute;left:12%;right:12%;bottom:12%;height:30px;background:radial-gradient(ellipse,rgba(45,14,6,.28),transparent 70%);transform:rotateX(75deg) translateZ(-20px)}
@keyframes turn{0%,100%{transform:rotateY(-16deg) rotateX(3deg)}50%{transform:rotateY(16deg) rotateX(-2deg)}}
@keyframes bob{50%{translate:0 -14px}}
.cats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cat{display:block;text-decoration:none;background:var(--brown);color:var(--pink);padding:38px 20px;border-radius:var(--r);font-family:'Playfair Display',serif;font-size:1.3rem;text-align:center;border:1px solid var(--rose);transition:.25s}
.cat:hover{transform:translateY(-6px) rotateX(6deg);box-shadow:0 16px 28px rgba(45,14,6,.3)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.chip{text-decoration:none;padding:8px 18px;border:1px solid var(--lbrown);border-radius:99px}.chip[aria-current=true]{background:var(--brown);color:var(--pink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 6px 20px rgba(184,138,110,.18);transition:.3s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(184,138,110,.32)}
.art{display:block;background:linear-gradient(160deg,var(--pink2),var(--pink));min-height:120px}
.art img{display:block;width:100%;height:230px;object-fit:cover}.art.big img{height:auto;max-height:480px}
.cb{padding:14px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}.cb h3 a{text-decoration:none}
.price{font-weight:500;font-size:1.15rem;color:var(--rose)}.old{color:#999;font-size:.9rem}.big-price{font-size:1.6rem;margin:10px 0}
.cb .btn{width:100%;padding:10px;text-align:center}
.detail{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}.detail form{display:grid;gap:12px;margin:14px 0}
.detail .art{border-radius:var(--r);overflow:hidden}.qtyrow{display:flex;gap:14px;align-items:end;flex-wrap:wrap}
select,input[type=number]{font:inherit;padding:10px;border:1px solid var(--lbrown);border-radius:12px;background:#fff}
.rich{margin:12px 0}
.row{display:grid;grid-template-columns:90px 1fr auto auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--pink)}
.row .art{border-radius:12px;overflow:hidden;min-height:0}.row .art img{height:80px}.qin{width:80px}
.rm{color:#9b2c2c;text-decoration:underline}.tot{margin:22px 0;text-align:right}.tot b{font-size:1.5rem}.small{font-size:.85rem;opacity:.8}
.actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.foot{background:var(--brown);color:var(--pink);display:grid;grid-template-columns:auto repeat(3,1fr);gap:32px;padding:44px 5vw;margin-top:40px}
.foot img{border-radius:50%}.foot h3{margin-bottom:8px;color:#E3B5A4}
.wa{position:fixed;right:18px;bottom:18px;z-index:30;background:#25D366;color:#fff;text-decoration:none;padding:14px 18px;border-radius:99px;font-weight:500;box-shadow:0 10px 24px rgba(0,0,0,.3);animation:pulse 2.6s infinite}
@keyframes pulse{50%{transform:scale(1.07)}}
@media(max-width:800px){
 #burger{display:block;order:4}
 #nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--cream);flex-direction:column;padding:16px 5vw;margin:0;border-bottom:1px solid var(--pink)}#nav.open{display:flex}
 .head{flex-wrap:wrap}#search{order:5;width:100%}#search input{flex:1;width:auto}.cartbtn{order:3}.logo{margin-right:auto}
 .hero,.detail{grid-template-columns:1fr}.stage{height:340px}.cats{grid-template-columns:1fr}
 .row{grid-template-columns:70px 1fr}.foot{grid-template-columns:1fr}.wa span{display:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.navlink{text-decoration:none;padding:6px 2px;font-weight:500;border-bottom:2px solid transparent}.navlink:hover,.navlink[aria-current]{border-color:var(--rose)}

.herologo{display:block;border-radius:50%;margin-bottom:18px;box-shadow:0 14px 30px rgba(45,14,6,.25)}
.logo img{width:64px;height:64px}

/* ===== Effet 3D sur tout le site ===== */
.grid,.cats,.detail{perspective:1200px}
.card,.cat,.detail .art.big{transform-style:preserve-3d;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out,box-shadow .3s;will-change:transform}
.card{overflow:visible;box-shadow:0 2px 0 #fff inset,0 10px 0 -4px #EFD3D8,0 22px 34px rgba(184,138,110,.35)}
.card:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(14px)}
.card .art{margin:12px 12px 0;border-radius:calc(var(--r) - 4px);overflow:hidden;transform:translateZ(38px);box-shadow:0 18px 26px rgba(45,14,6,.28)}
.card .art img{transition:transform .4s}.card:hover .art img{transform:scale(1.08)}
.card .cb{transform:translateZ(22px)}
.card::after{content:"";position:absolute;inset:0;border-radius:var(--r);pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.55),transparent 55%);opacity:0;transition:opacity .3s;transform:translateZ(60px)}
.card:hover::after{opacity:1}
.card{position:relative}
.cat{box-shadow:0 8px 0 -2px #4a1c10,0 22px 30px rgba(45,14,6,.35)}
.detail .art.big{box-shadow:0 30px 50px rgba(45,14,6,.3)}
.btn{box-shadow:0 5px 0 #A9715C,0 14px 22px rgba(201,147,126,.45)}.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #A9715C}
.btn.alt{box-shadow:0 5px 0 #000,0 14px 22px rgba(45,14,6,.35)}
.btn.ghost{box-shadow:none}
.cartbtn,.wa{box-shadow:0 4px 0 rgba(0,0,0,.25),0 12px 22px rgba(0,0,0,.3)}
@media(prefers-reduced-motion:reduce){.card,.cat,.detail .art.big{transform:none!important}}

/* ===== Publicité animée ===== */
.pub{background:linear-gradient(135deg,#2D0E06,#4a1c10 60%,#2D0E06);color:var(--pink);margin:20px 0;overflow:hidden;position:relative}
.pub-inner{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:24px;max-width:1200px;margin:auto;padding:56px 5vw 40px}
.pub-text h2{font-size:clamp(1.9rem,4.5vw,3.2rem);font-weight:800}
.shine{background:linear-gradient(100deg,#F7C6CF 20%,#fff 40%,#E3B5A4 55%,#F7C6CF 80%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 4s linear infinite}
@keyframes shine{to{background-position:-250% 0}}
.pub-text p{margin:14px 0 24px;max-width:42ch;color:#F3DCDF}
.pub-scene{position:relative;height:320px;perspective:900px}
.pi{position:absolute;filter:drop-shadow(0 24px 22px rgba(0,0,0,.45))}
.p1{width:190px;left:34%;top:18%;animation:fl1 5s ease-in-out infinite}
.p2{width:150px;left:4%;top:42%;animation:fl2 6s ease-in-out infinite}
.p3{width:140px;right:2%;top:40%;animation:fl3 7s ease-in-out infinite}
@keyframes fl1{0%,100%{transform:translateY(0) rotateY(-20deg)}50%{transform:translateY(-22px) rotateY(20deg)}}
@keyframes fl2{0%,100%{transform:translateY(0) rotateY(25deg) rotate(-6deg)}50%{transform:translateY(-16px) rotateY(-15deg) rotate(-6deg)}}
@keyframes fl3{0%,100%{transform:translateY(0) rotateY(-25deg) rotate(6deg)}50%{transform:translateY(-18px) rotateY(15deg) rotate(6deg)}}
.spark{position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#fff,rgba(247,198,207,0) 70%);animation:tw 2.4s ease-in-out infinite}
.s1{left:20%;top:12%}.s2{right:18%;top:20%;animation-delay:.8s}.s3{left:50%;bottom:8%;animation-delay:1.4s}.s4{left:8%;top:30%;animation-delay:.4s}
@keyframes tw{0%,100%{transform:scale(.4);opacity:.3}50%{transform:scale(2.2);opacity:1}}
.pub-ticker{border-top:1px solid rgba(247,198,207,.25);white-space:nowrap;overflow:hidden;padding:10px 0;font-size:.95rem}
.ptrack{display:inline-flex;gap:48px;animation:slide 26s linear infinite;padding-left:48px}
/* ===== Formulaires de commande ===== */
.orderbox{background:#fff;border:1px solid var(--pink);border-radius:var(--r);padding:20px;margin-top:18px;box-shadow:0 14px 30px rgba(184,138,110,.25)}
.orderbox h2{font-size:1.4rem;margin-bottom:4px}
.orderbox label,.fgrid label{display:grid;gap:4px;font-weight:500;margin-top:12px}
.orderbox input,.orderbox textarea{font:inherit;padding:12px;border:1px solid var(--lbrown);border-radius:12px;background:#fff;width:100%}
.orderbox input:invalid:not(:placeholder-shown){border-color:#c0392b}
.orderbox .btn{width:100%;margin-top:14px;text-align:center}
.btn.wa-btn{background:#25D366;box-shadow:0 5px 0 #1a9e4b,0 14px 22px rgba(37,211,102,.35)}
.detail .orderbox form{display:block;margin:0}
.errors{color:#9b2c2c;margin-top:10px}
@media(max-width:800px){.pub-inner{grid-template-columns:1fr;padding-top:40px}.pub-scene{height:240px}.p1{width:150px}.p2{width:110px}.p3{width:105px}}
@media(prefers-reduced-motion:reduce){.shine{color:var(--pink);background:none}}

/* ===== Avis, produits associés ===== */
.avg-rating{color:#E0A030;font-size:1.2rem;margin:4px 0}
.reviews,.related{margin-top:44px}
.reviews form{display:grid;gap:12px;max-width:520px;margin-top:12px}
.reviews label{display:grid;gap:4px;font-weight:500}
.reviews select,.reviews input,.reviews textarea{font:inherit;padding:12px;border:1px solid var(--lbrown);border-radius:12px;background:#fff}
.okmsg{background:var(--pink2);border:1px solid var(--rose);padding:10px 14px;border-radius:12px}

/* ================= NOUVEAU LOOK : rose vif + or rosé ================= */
:root{--cream:#FFF5F1;--pink:#F9C6D3;--pink2:#FFE3EA;--hot:#E8799A;--brown:#2A0D07;--rose:#C98273;--gold:linear-gradient(135deg,#B8727D 0%,#EBB9A4 35%,#F8DCCD 50%,#D79A86 75%,#B8727D 100%)}
body{background:radial-gradient(circle at 8% 0%,#FFD9E3 0,transparent 38%),radial-gradient(circle at 100% 30%,#FFE9D9 0,transparent 36%),var(--cream)}
.head{background:rgba(255,245,241,.82);border-bottom:2px solid transparent;border-image:var(--gold) 1}
.announce{background:linear-gradient(90deg,#2A0D07,#5a1f2e,#2A0D07);color:#FFE3EA}
h2{font-size:clamp(1.7rem,3.6vw,2.5rem);margin-bottom:6px}
h2::after{content:"";display:block;width:72px;height:4px;border-radius:4px;background:var(--gold);margin-top:10px}
.pub-text h2::after{display:none}
/* Hero */
.hero{position:relative}
.hero::before{content:"";position:absolute;width:340px;height:340px;left:-90px;top:-40px;border-radius:50%;background:radial-gradient(circle,#FFC2D4,transparent 68%);filter:blur(10px);z-index:-1}
.hero h1{background:linear-gradient(100deg,#6b2a3a 10%,#C0577A 45%,#B8727D 70%,#6b2a3a);-webkit-background-clip:text;background-clip:text;color:transparent}
.stage{background:radial-gradient(circle at 30% 25%,#fff 0,transparent 35%),conic-gradient(from 200deg at 50% 60%,#FFC2D4,#F6B7C9,#EBB9A4,#FFD9E3,#FFC2D4);box-shadow:inset 0 0 60px rgba(255,255,255,.6),0 30px 60px rgba(201,130,115,.35)}
.btn{background:var(--gold);background-size:200% 100%;color:#4a1c10;font-weight:600;box-shadow:0 5px 0 #A56A5B,0 16px 26px rgba(201,130,115,.45);animation:gleam 5s linear infinite}
@keyframes gleam{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.btn.alt{background:var(--brown);color:#FFE3EA;animation:none}
.btn.ghost{animation:none;background:none}
.btn.wa-btn{color:#fff;animation:none}
/* Catégories */
.cat{border:0;color:#fff;font-size:1.45rem;padding:56px 20px;position:relative;overflow:hidden;text-shadow:0 2px 6px rgba(0,0,0,.25)}
.cats .cat:nth-child(1),.cat:nth-child(1){background:linear-gradient(135deg,#E8799A,#F4A5BB 55%,#F9C6D3)}
.cats .cat:nth-child(2),.cat:nth-child(2){background:linear-gradient(135deg,#3a130b,#7a3b2c 55%,#C98273)}
.cats .cat:nth-child(3),.cat:nth-child(3){background:linear-gradient(135deg,#B8860B,#D9A441 55%,#F1D08A)}
.cat::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 15%,rgba(255,255,255,.45),transparent 40%);pointer-events:none}
.cat::after{content:"→";position:absolute;right:22px;bottom:14px;font-size:1.6rem;opacity:.9}
/* Avantages */
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1200px;margin:8px auto 0;padding:0 5vw}
.b-item{display:flex;gap:14px;align-items:center;background:rgba(255,255,255,.75);backdrop-filter:blur(6px);border:1px solid #F5C4D1;border-radius:var(--r);padding:16px 18px;box-shadow:0 10px 22px rgba(201,130,115,.18)}
.b-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--gold);font-size:1.5rem;flex:none;box-shadow:0 6px 12px rgba(201,130,115,.4)}
.b-item b{display:block;font-family:'Playfair Display',serif}.b-item small{opacity:.75}
/* Produits */
.card{background:#fff;border:1px solid #F8D3DD}
.card .art{background:linear-gradient(160deg,#FFE3EA,#F9C6D3 60%,#F3B2C4)}
.price{display:inline-block;background:var(--gold);color:#4a1c10;font-weight:600;padding:3px 14px;border-radius:99px;width:max-content}
.card h3{font-size:1.1rem}
.chip{background:#fff;border-color:#F0B6C6}.chip:hover{background:var(--pink2)}
.chip[aria-current=true]{background:linear-gradient(135deg,#E8799A,#C0577A);color:#fff;border-color:transparent}
.cartbtn{background:linear-gradient(135deg,#E8799A,#C0577A);color:#fff;box-shadow:0 4px 0 #9c3f5d,0 10px 18px rgba(192,87,122,.4)}
.foot{background:linear-gradient(160deg,#2A0D07,#4a1c26)}
.orderbox{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--gold) border-box}
@media(max-width:800px){.benefits{grid-template-columns:1fr}.cat{padding:42px 20px}}
@media(prefers-reduced-motion:reduce){.btn{animation:none}}

/* ===== Bouton 3D animé ===== */
.btn3d{position:relative;overflow:hidden;padding:19px 44px;font-size:1.15rem;letter-spacing:.3px;border-radius:99px;color:#4a1c10;
 background:linear-gradient(180deg,#FFF0E6 0%,#F6C4B1 38%,#DC9482 100%);
 box-shadow:0 9px 0 #A5604F,0 0 0 2px rgba(255,255,255,.7) inset,0 -6px 10px rgba(165,96,79,.35) inset,0 26px 34px rgba(165,96,79,.5);
 transform:perspective(520px) rotateX(10deg);transition:transform .2s,box-shadow .2s;animation:btnbob 2.4s ease-in-out infinite}
.btn3d::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.85),transparent);transform:skewX(-20deg);animation:sweep 3s ease-in-out infinite}
.btn3d:hover{transform:perspective(520px) rotateX(0deg) scale(1.06)}
.btn3d:active{transform:perspective(520px) rotateX(0deg) translateY(7px);box-shadow:0 2px 0 #A5604F,0 0 0 2px rgba(255,255,255,.7) inset,0 8px 14px rgba(165,96,79,.4)}
@keyframes btnbob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes sweep{0%,55%{left:-70%}100%{left:130%}}
@media(prefers-reduced-motion:reduce){.btn3d,.btn3d::after{animation:none}}

#cart-order{max-width:560px;margin:26px 0 0 auto}
#cart-order label{display:grid;gap:4px;font-weight:500;margin-top:12px}

.errbox{background:#FFF0F0;border:1px solid #E58C8C;color:#8a1f1f;border-radius:12px;padding:12px 14px;margin-bottom:8px}
.errbox ul{margin:6px 0 0 18px}
.thanks{display:grid;place-items:center;min-height:50vh}
.thanks-box{text-align:center;background:#fff;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--gold) border-box;border-radius:var(--r);padding:40px 28px;max-width:560px;box-shadow:0 20px 40px rgba(201,130,115,.3)}
.check{width:72px;height:72px;border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;font-size:2.2rem;color:#fff;background:linear-gradient(135deg,#E8799A,#C0577A);box-shadow:0 10px 20px rgba(192,87,122,.4);animation:pop .6s}
@keyframes pop{0%{transform:scale(.2)}70%{transform:scale(1.15)}100%{transform:scale(1)}}

.social-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.social-row .btn{padding:11px 22px;font-size:.95rem}
.okmsg{text-align:center;font-size:1.05rem}

.okmodal{position:fixed;inset:0;z-index:100;background:rgba(42,13,7,.65);display:grid;place-items:center;padding:20px;backdrop-filter:blur(4px)}
.okmodal-box{background:#fff;border-radius:var(--r);padding:32px 24px;max-width:460px;text-align:center;box-shadow:0 30px 60px rgba(0,0,0,.4);animation:pop .4s}
.okmodal-box h2::after{margin:10px auto 0}
.okmodal-box p{margin:10px 0 4px}
.okclose{margin-top:16px;text-decoration:underline;color:#7a3b2c}

/* ===== Univers girly + couleurs par page ===== */
:root{--lilac:#EBDDF7;--mint:#DDF5E8;--peach:#FFE3D3;--rosepop:#E8799A;--green:#1FB26B}
.btn{background:linear-gradient(135deg,var(--b1,var(--rose)),var(--b2,#E3B5A4))}
.band{position:relative;overflow:hidden}
.band h2{text-align:center;margin-bottom:8px}
.band h2::before{content:"✦ ";color:var(--rosepop);font-size:.6em;vertical-align:middle}
.band h2::after{content:" ✦";color:var(--rosepop);font-size:.6em;vertical-align:middle}
.band-hero{background:linear-gradient(180deg,#FFE9EF,#FBF4EC)}
.band-packs{background:linear-gradient(135deg,#F9C6D8 0%,#EBDDF7 55%,#FFE3D3 100%);padding:8px 0}
.band-packs::before,.band-packs::after{content:"♡";position:absolute;font-size:7rem;color:rgba(232,121,154,.18);animation:floaty 7s ease-in-out infinite;pointer-events:none}
.band-packs::before{left:3%;top:8%}.band-packs::after{right:4%;bottom:6%;content:"✦";animation-delay:1.5s}
.kicker{text-align:center;letter-spacing:.3em;font-size:.8rem;color:#C0577A;font-weight:600}
.packs-sub{text-align:center;max-width:56ch;margin:6px auto 26px}
.packs-cta{text-align:center;margin-top:28px}
.band-packs .card{box-shadow:0 14px 30px rgba(192,87,122,.25);border:2px solid #fff}
.band-cats{background:var(--cream)}
.band-shop{background:linear-gradient(180deg,#FBF4EC,#F6EAFB)}
.band-benefits{background:linear-gradient(135deg,var(--mint),#FFF4E0);padding:30px 0}
@keyframes floaty{50%{transform:translateY(-18px) rotate(8deg)}}
.pg{min-height:60vh}
.pg-product{background:linear-gradient(160deg,#FFE9EF,#F3E6FB 70%);--b1:#E8799A;--b2:#C0577A}
.pg-collection{background:linear-gradient(160deg,#FFE9DA,#FFF3E6 70%);--b1:#F08A6B;--b2:#E8799A}
.pg-cart{background:linear-gradient(160deg,#EEE2FB,#FDEBF3);--b1:#A57BE0;--b2:#E8799A}
.pg-search{background:linear-gradient(160deg,#DDF5E8,#FDF6EA);--b1:#2DBB8B;--b2:#7BCF9F}
.pg-page{background:linear-gradient(160deg,#FFF0F4,#FBF4EC);--b1:#D98AA3;--b2:#C9937E}
.pg-thankyou{background:linear-gradient(160deg,#DDF5E8,#F2FBF6);--b1:#1FB26B;--b2:#5BD39A}
.pg h1{color:#7a2a47}.pg-collection h1{color:#a64b2e}.pg-cart h1{color:#5b3a99}.pg-search h1,.pg-thankyou h1{color:#12794a}
.pg h1::after{content:"";display:block;width:70px;height:4px;border-radius:4px;margin-top:10px;background:linear-gradient(90deg,var(--b1),var(--b2))}
.pg-thankyou h1::after{margin-left:auto;margin-right:auto}

/* ===== Confirmation verte ===== */
.check{background:linear-gradient(135deg,#34d58a,#16a05f)!important;box-shadow:0 12px 26px rgba(31,178,107,.45)!important;position:relative}
.check svg{width:44px;height:44px;fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.check svg path{stroke-dasharray:48;stroke-dashoffset:48;animation:draw .6s .35s ease forwards}
.check::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:3px solid rgba(31,178,107,.45);animation:ring 1.6s ease-out infinite}
.check.sm{width:46px;height:46px;margin:0 auto 8px}.check.sm svg{width:28px;height:28px}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes ring{from{transform:scale(.85);opacity:1}to{transform:scale(1.35);opacity:0}}
.okmsg{background:linear-gradient(135deg,#E9FBF1,#D6F5E3)!important;border:2px solid var(--green)!important;color:#0f5f3a;box-shadow:0 10px 24px rgba(31,178,107,.25);padding:16px!important}
.okmsg .btn{background:linear-gradient(135deg,#1FB26B,#5BD39A);color:#fff}
.okmodal-box{border-top:6px solid var(--green);position:relative;overflow:hidden}
.okmodal-box h2{color:#12794a}
.confetti{position:absolute;inset:0;pointer-events:none}
.confetti i{position:absolute;top:-20px;font-style:normal;color:var(--rosepop);font-size:1.3rem;animation:fall 3s linear infinite}
.confetti i:nth-child(1){left:10%}.confetti i:nth-child(2){left:28%;animation-delay:.6s;color:var(--green)}.confetti i:nth-child(3){left:46%;animation-delay:1.2s}
.confetti i:nth-child(4){left:64%;animation-delay:.3s;color:#d9a441}.confetti i:nth-child(5){left:80%;animation-delay:.9s}.confetti i:nth-child(6){left:92%;animation-delay:1.5s;color:var(--green)}
@keyframes fall{to{transform:translateY(420px) rotate(240deg);opacity:0}}
@media(max-width:700px){.band-packs::before,.band-packs::after{font-size:4rem}}
@media(prefers-reduced-motion:reduce){.band-packs::before,.band-packs::after,.check::after,.confetti i{animation:none}.check svg path{animation:none;stroke-dashoffset:0}}
.band h2::after{display:inline;width:auto;height:auto;background:none;margin:0}
