:root{--pink:#df0872;--soft:#fff0f6;--gold:#c99524;--navy:#071b47;--text:#17131a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}.top{background:linear-gradient(90deg,#d60068,#ed2b91);color:#fff;padding:8px 6%;font-size:13px;display:flex;justify-content:space-between}header{height:84px;display:flex;align-items:center;padding:0 6%;gap:35px;position:sticky;top:0;background:#fff;z-index:20;box-shadow:0 2px 14px #0000000c}.logo{width:76px;height:76px;border-radius:50%;object-fit:cover;border:2px solid #e7b844}nav{display:flex;gap:28px;flex:1;justify-content:center}a{text-decoration:none;color:inherit}header nav a{font-weight:600;font-size:14px}.actions{display:flex;gap:8px}.actions button,.drawerHead button{border:0;background:#fff;font-size:20px;cursor:pointer}.actions b{background:var(--pink);color:#fff;border-radius:20px;padding:2px 6px;font-size:10px}.hero{min-height:430px;margin:0 3%;border-radius:0 0 24px 24px;padding:65px 7%;display:flex;justify-content:space-between;align-items:center;background:radial-gradient(circle at 78% 30%,#ffd1e6 0 14%,transparent 15%),linear-gradient(115deg,#170d12,#61203f 55%,#f09ac4);color:#fff;overflow:hidden}.heroText small{color:#ffd66b;font-weight:bold;letter-spacing:2px}.hero h1{font-family:Georgia,serif;font-size:64px;margin:12px 0 5px}.hero h1 em{color:#ff5bac;font-weight:normal}.heroText>p{font-family:Georgia,serif;font-size:28px;margin:8px 0}.hero .sub{font:600 18px Arial;margin:22px 0 34px}.cta{display:inline-block;border:0;background:var(--pink);color:#fff;padding:15px 24px;border-radius:10px;font-weight:bold;cursor:pointer}.heroLogo{display:flex;align-items:center;gap:22px}.heroLogo img{width:210px;height:210px;border-radius:50%;object-fit:cover;box-shadow:0 15px 45px #0005}.heroLogo strong{font-family:Georgia,serif;color:#fff;font-size:28px;font-style:italic}.cats{padding:30px 6%;display:grid;grid-template-columns:repeat(6,1fr);gap:18px;background:var(--soft)}.cat{text-align:center;cursor:pointer}.cat .bubble{aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font-size:42px;background:#fff;border:2px solid #ef68a7;box-shadow:0 7px 20px #a30a4d18}.cat b{display:block;margin-top:10px}.section{padding:42px 6%}.sectionHead{display:flex;justify-content:space-between;align-items:end}.sectionHead h2{color:var(--pink);margin:0}.sectionHead p{color:#777}.outline{border:1px solid var(--pink);color:var(--pink);background:#fff;border-radius:20px;padding:9px 18px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid #eee;border-radius:16px;padding:12px;position:relative;box-shadow:0 7px 24px #0000000b}.pic{height:250px;border-radius:12px;display:grid;place-items:center;font-size:90px;background:linear-gradient(145deg,#fff2f7,#f5d7e7)}.badge{position:absolute;top:22px;left:22px;background:var(--pink);color:#fff;padding:5px 9px;border-radius:8px;font-size:11px}.heart{position:absolute;right:22px;top:20px;border:0;background:#fff;border-radius:50%;width:32px;height:32px}.card h3{margin-bottom:6px}.price{color:var(--pink);font-weight:bold}.stars{color:#f5ad14;font-size:12px}.add{width:100%;border:0;background:var(--pink);color:#fff;padding:11px;border-radius:8px;margin-top:12px;font-weight:bold;cursor:pointer}.promos{padding:20px 6% 45px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.promos article{padding:25px;border-radius:14px;background:#ffe3ef;display:flex;flex-direction:column;gap:7px;color:#b30759}.promos .dark{background:#25101c;color:#fff}.about{padding:45px 15%;text-align:center;background:#fff7fa}.about h2{font-family:Georgia;color:var(--pink);font-size:35px}footer{display:flex;justify-content:space-between;align-items:center;background:#111;color:#fff;padding:35px 6%}footer img{width:80px;height:80px;border-radius:50%}.drawer{position:fixed;right:-430px;top:0;width:min(420px,94vw);height:100%;background:#fff;z-index:40;padding:25px;transition:.3s;box-shadow:-15px 0 40px #0002}.drawer.open{right:0}.drawerHead{display:flex;justify-content:space-between}.cartLine{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid #eee}.total{display:flex;justify-content:space-between;font-size:20px;margin:25px 0}.full{width:100%}.shade{display:none;position:fixed;inset:0;background:#0006;z-index:30}.shade.on{display:block}.mobileNav{display:none}
@media(max-width:800px){.top span,header nav{display:none}header{height:68px;padding:0 4%}.logo{width:58px;height:58px}.actions{margin-left:auto}.hero{margin:0;border-radius:0;padding:42px 7%;min-height:420px}.hero h1{font-size:43px}.heroLogo{display:none}.cats{display:flex;overflow:auto;padding:22px 4%}.cat{min-width:88px}.grid{grid-template-columns:repeat(2,1fr);gap:10px}.pic{height:165px;font-size:60px}.promos{grid-template-columns:1fr}.section{padding:32px 4%}.sectionHead p{font-size:13px}.mobileNav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;z-index:25;justify-content:space-around;padding:8px 3px max(8px,env(safe-area-inset-bottom));box-shadow:0 -4px 18px #0001}.mobileNav a,.mobileNav button{border:0;background:none;display:flex;flex-direction:column;align-items:center;color:var(--pink);font-size:20px}.mobileNav small{font-size:10px;margin-top:3px}footer{margin-bottom:58px;flex-direction:column;gap:10px;text-align:center}.heroText>p{font-size:23px}}

/* v4 — Logo officiel visible dans la bannière mobile */
@media(max-width:800px){
  .hero{position:relative;background:linear-gradient(115deg,#170d12,#61203f 58%,#e47caf);padding-right:7%;}
  .heroText{position:relative;z-index:2;width:100%;}
  .heroLogo{display:block;position:absolute;right:5%;top:74px;z-index:1;}
  .heroLogo img{display:block;width:132px;height:132px;border-radius:50%;object-fit:cover;border:3px solid #e7b844;background:#fff;box-shadow:0 10px 28px #0005;}
  .heroLogo strong{display:none;}
  .hero h1{max-width:78%;font-size:43px;line-height:1.06;}
  .heroText>p{max-width:68%;}
  .hero .sub{max-width:78%;margin-top:24px;}
}
@media(max-width:420px){
  .heroLogo{right:4%;top:78px;}
  .heroLogo img{width:112px;height:112px;}
  .hero h1{font-size:40px;max-width:76%;}
}
