/* ===== MakeItNow — IA Premium Marketplace ===== */
:root {
    /* Confiance — Bleu nuit / Indigo profond */
    --navy: #0B1020;
    --navy-light: #312E81;
    --navy-mid: #1e1b4b;
    /* Désir — Violet électrique / Cyan IA */
    --violet: #7C3AED;
    --violet-dark: #6D28D9;
    --violet-light: #8B5CF6;
    --cyan: #22D3EE;
    --cyan-dark: #06B6D4;
    /* Action — Orange CTA premium */
    --orange: #F97316;
    --orange-dark: #EA580C;
    --orange-light: #FB923C;
    /* Réassurance — Vert confiance */
    --success: #22C55E;
    --success-dark: #16A34A;
    /* Neutres */
    --white: #ffffff;
    --gray: #64748b;
    --gray-light: #94a3b8;
    --light-bg: #f1f5f9;
    --body-bg: #F8FAFC;
    --card-bg: #ffffff;
    --border: #e2e8f0;
    --border-dark: #cbd5e1;
    --danger: #EF4444;
    --link: #7C3AED;
    --link-hover: #22D3EE;
    --price: #0B1020;
    --star: #F97316;
    --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-display: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--font); background: var(--body-bg); color: #0f1111; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--link); text-decoration: none; transition: color .2s; }
a:hover { color: var(--link-hover); text-decoration: underline; }
img { max-width:100%; height:auto; }

/* === ANIMATIONS === */
@keyframes fadeInUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes shimmer { 0% { background-position:-200% 0; } 100% { background-position:200% 0; } }

.reveal { animation: fadeInUp .5s ease both; }
.reveal:nth-child(2) { animation-delay: .1s; }
.reveal:nth-child(3) { animation-delay: .2s; }
.reveal:nth-child(4) { animation-delay: .3s; }

/* === HEADER / NAV (IA Premium) === */
.header { position:sticky; top:0; left:0; width:100%; z-index:1000; background:var(--navy); display:flex; flex-direction:column; }
.header-top { display:flex; align-items:center; gap:16px; padding:10px 20px; background:linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%); }
.header.scrolled { box-shadow:0 2px 20px rgba(124,58,237,.3); }
.logo { font-family:var(--font-display); font-size:22px; color:var(--white); font-weight:800; letter-spacing:0; text-decoration:none; white-space:nowrap; }
.logo:hover { text-decoration:none; color:var(--white); }
.logo span { color:var(--cyan); }
.header-bottom { display:flex; align-items:center; gap:20px; padding:6px 20px; background:var(--navy-light); overflow-x:auto; white-space:nowrap; scrollbar-width:none; }
.header-bottom::-webkit-scrollbar { display:none; }
.nav { display:flex; align-items:center; gap:0; }
.nav a { color:#c4b5fd; font-size:13px; font-weight:500; padding:6px 10px; border-radius:3px; border:1px solid transparent; transition:all .15s; white-space:nowrap; }
.nav a:hover { border-color:var(--violet-light); color:var(--white); text-decoration:none; }
.nav-icons { display:flex; align-items:center; gap:6px; margin-left:auto; }
.nav-icons a { color:var(--white); position:relative; padding:6px 10px; border:1px solid transparent; border-radius:3px; display:flex; align-items:center; gap:4px; font-size:12px; font-weight:500; white-space:nowrap; text-decoration:none; }
.nav-icons a:hover { border-color:var(--violet-light); text-decoration:none; }
.nav-icons a span.icon-label { color:#c4b5fd; font-size:11px; line-height:1.2; }
.nav-icons a span.icon-label strong { color:var(--white); font-size:13px; display:block; }
.cart-count { background:var(--orange); color:var(--white); font-size:12px; font-weight:800; min-width:18px; height:18px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 5px; }

/* Hamburger */
.hamburger { display:none; flex-direction:column; gap:4px; cursor:pointer; z-index:1001; padding:8px; }
.hamburger span { display:block; width:22px; height:2px; background:var(--white); transition:all .3s; }
.hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity:0; }
.hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

.mobile-menu { display:none; position:fixed; top:0; left:0; width:85%; max-width:360px; height:100vh; background:var(--white); z-index:9999; flex-direction:column; padding:0; overflow-y:auto; box-shadow:4px 0 20px rgba(124,58,237,.3); transform:translateX(-100%); transition:transform .3s ease; }
.mobile-menu.open { display:flex; transform:translateX(0); }
.mobile-menu-header { background:linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 100%); color:var(--white); padding:14px 20px; font-size:16px; font-weight:700; }
.mobile-menu a { color:#0f1111; font-size:15px; padding:14px 20px; border-bottom:1px solid var(--border); font-weight:500; text-decoration:none; }
.mobile-menu a:hover { background:var(--light-bg); text-decoration:none; }

/* === HERO (IA Premium) === */
.hero { position:relative; min-height:380px; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; background:linear-gradient(135deg, #0B1020 0%, #312E81 40%, #1e1b4b 70%, #0B1020 100%); }
.hero-bg { position:absolute; inset:0; z-index:0; }
.hero-bg::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 30% 50%, rgba(124,58,237,.15) 0%, transparent 60%), radial-gradient(ellipse at 70% 50%, rgba(34,211,238,.1) 0%, transparent 50%); }
.hero-particles { position:absolute; inset:0; z-index:1; overflow:hidden; }
.hero-content { position:relative; z-index:2; max-width:900px; padding:40px 20px; animation: fadeInUp .6s ease; }
.hero-label { font-size:13px; letter-spacing:3px; text-transform:uppercase; color:var(--cyan); margin-bottom:12px; font-weight:700; }
.hero-content h1 { font-family:var(--font-display); font-size:clamp(28px,5vw,52px); font-weight:800; line-height:1.15; margin-bottom:14px; color:var(--white); }
.hero-content h1 span { background:linear-gradient(135deg, var(--violet-light), var(--cyan)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-content p { font-size:16px; color:#c4b5fd; max-width:600px; margin:0 auto 30px; line-height:1.6; }
.hero-cta { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* === BUTTONS (IA Premium — Orange = seule couleur chaude CTA) === */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:10px 20px; font-size:13px; font-weight:600; border:none; cursor:pointer; transition:all .2s ease; font-family:var(--font); border-radius:8px; text-decoration:none; }
.btn:hover { text-decoration:none; transform:translateY(-1px); }
.btn-filled { background:linear-gradient(135deg, var(--orange), var(--orange-dark)); color:var(--white); border:none; box-shadow:0 4px 14px rgba(249,115,22,.35); }
.btn-filled:hover { background:linear-gradient(135deg, var(--orange-light), var(--orange)); box-shadow:0 6px 20px rgba(249,115,22,.45); color:var(--white); }
.btn-outline { border:1px solid var(--violet); color:var(--violet); background:var(--white); }
.btn-outline:hover { background:rgba(124,58,237,.06); color:var(--violet-dark); border-color:var(--violet-dark); }
.btn-primary { background:linear-gradient(135deg, var(--orange), var(--orange-dark)); color:var(--white); border:none; border-radius:20px; padding:12px 28px; font-weight:700; box-shadow:0 4px 14px rgba(249,115,22,.35); }
.btn-primary:hover { background:linear-gradient(135deg, var(--orange-light), var(--orange)); box-shadow:0 6px 20px rgba(249,115,22,.45); color:var(--white); }
.btn-sm { padding:7px 14px; font-size:12px; }
.btn-violet { background:linear-gradient(135deg, var(--violet), var(--violet-dark)); color:var(--white); border:none; box-shadow:0 4px 14px rgba(124,58,237,.3); }
.btn-violet:hover { box-shadow:0 6px 20px rgba(124,58,237,.4); }

/* === SECTIONS === */
.section { padding:28px 20px; max-width:1440px; margin:0 auto; }
.section-title { margin-bottom:20px; }
.section-title h2 { font-family:var(--font-display); font-size:clamp(20px,3vw,28px); font-weight:800; color:var(--navy); margin-bottom:4px; }
.section-title h2 span { background:linear-gradient(135deg, var(--violet), var(--cyan)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.section-title .line { display:none; }
.section-title p { color:var(--gray); font-size:14px; }
.section-label { font-size:12px; font-weight:700; text-transform:uppercase; color:var(--violet); margin-bottom:4px; letter-spacing:1px; }

/* === PRODUCTS (IA Premium Grid) === */
.products-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; }
.product-card { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; overflow:hidden; transition:all .25s ease; display:flex; flex-direction:column; }
.product-card:hover { box-shadow:0 8px 30px rgba(124,58,237,.12); border-color:var(--violet-light); transform:translateY(-2px); }
.product-card .img-wrap { position:relative; overflow:hidden; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, #f8fafc, #f1f5f9); padding:16px; }
.product-card .img-wrap img { width:100%; height:100%; object-fit:contain; transition:transform .3s ease; }
.product-card:hover .img-wrap img { transform:scale(1.05); }
.badge-promo { position:absolute; top:8px; left:8px; background:linear-gradient(135deg, var(--violet), var(--violet-dark)); color:var(--white); font-size:11px; font-weight:700; padding:4px 10px; border-radius:6px; }
.badge-best { position:absolute; top:8px; right:8px; background:linear-gradient(135deg, var(--navy), var(--navy-mid)); color:var(--cyan); font-size:10px; font-weight:700; padding:4px 10px; border-radius:6px; }
.product-card .info { padding:12px 14px; flex:1; display:flex; flex-direction:column; }
.product-card .cat { font-size:11px; color:var(--violet); margin-bottom:4px; font-weight:600; text-transform:uppercase; letter-spacing:.5px; }
.product-card h3 { font-size:14px; font-weight:600; margin-bottom:4px; color:var(--navy); line-height:1.35; }
.product-card h3:hover { color:var(--violet); }
.product-card .stars-line { margin-bottom:4px; }
.product-card .price { font-size:20px; font-weight:700; color:var(--navy); margin-bottom:4px; }
.product-card .price .currency { font-size:13px; vertical-align:super; font-weight:500; }
.product-card .price .old { font-size:13px; color:var(--gray-light); text-decoration:line-through; margin-left:6px; font-weight:400; }
.product-card .delivery-info { font-size:12px; color:var(--success); margin-bottom:8px; font-weight:500; }
.product-card .btns { margin-top:auto; padding-top:8px; }
.product-card .btns .btn { width:100%; justify-content:center; border-radius:20px; }

/* === CARROUSEL VEDETTES === */
.carousel-section { padding:24px 20px; overflow:hidden; max-width:1440px; margin:0 auto; background:var(--card-bg); border-radius:12px; margin-bottom:16px; border:1px solid var(--border); }
.carousel-container { position:relative; }
.carousel-track { display:flex; gap:16px; transition:transform .4s ease; }
.carousel-track .product-card { min-width:calc(25% - 12px); flex-shrink:0; border:none; box-shadow:none; }
.carousel-arrow { position:absolute; top:50%; transform:translateY(-50%); width:44px; height:80px; background:var(--white); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; transition:all .2s; border-radius:4px; box-shadow:0 2px 8px rgba(0,0,0,.1); }
.carousel-arrow:hover { box-shadow:0 4px 12px rgba(0,0,0,.2); }
.carousel-arrow svg { stroke:#0f1111; width:18px; height:18px; }
.carousel-arrow.prev { left:0; }
.carousel-arrow.next { right:0; }

/* === COLLECTIONS (Category Cards) === */
.collections-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.collection-card { position:relative; aspect-ratio:3/2; overflow:hidden; cursor:pointer; border-radius:12px; background:var(--card-bg); border:1px solid var(--border); }
.collection-card img { width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.collection-card:hover img { transform:scale(1.05); }
.collection-card .overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(11,16,32,.85) 0%, rgba(49,46,129,.3) 30%, transparent 60%); display:flex; align-items:flex-end; padding:20px; }
.collection-card .overlay h3 { font-family:var(--font-display); font-size:18px; font-weight:700; color:var(--white); }
.collection-card .overlay span { display:block; font-size:12px; color:var(--cyan); margin-top:4px; font-weight:600; }

/* === REASSURANCE (Vert confiance) === */
.reassurance { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; }
.reassurance-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.reassurance-item { text-align:center; padding:24px 16px; border-right:1px solid var(--border); }
.reassurance-item:last-child { border-right:none; }
.reassurance-item:hover { background:rgba(34,197,94,.04); }
.reassurance-item svg { width:36px; height:36px; stroke:var(--success); margin-bottom:10px; }
.reassurance-item h4 { font-size:14px; font-weight:700; margin-bottom:4px; color:var(--navy); }
.reassurance-item p { font-size:12px; color:var(--gray); }

/* === PRODUIT DETAIL (Marketplace) === */
.product-detail { display:grid; grid-template-columns:400px 1fr 280px; gap:24px; padding:24px 20px; max-width:1440px; margin:0 auto; background:var(--card-bg); border-radius:12px; border:1px solid var(--border); }
.product-gallery { display:flex; gap:10px; }
.product-thumbs { display:flex; flex-direction:column; gap:6px; }
.product-thumbs img { width:60px; height:60px; object-fit:contain; border:2px solid var(--border); border-radius:4px; cursor:pointer; padding:3px; background:var(--white); transition:all .2s; }
.product-thumbs img.active, .product-thumbs img:hover { border-color:var(--violet); box-shadow:0 0 0 2px rgba(124,58,237,.2); }
.product-main-img { flex:1; position:relative; overflow:hidden; cursor:zoom-in; border:1px solid var(--border); border-radius:4px; background:#fff; display:flex; align-items:center; justify-content:center; }
.product-main-img img { width:100%; height:100%; object-fit:contain; padding:20px; }
.gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px; background:var(--white); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; border-radius:4px; box-shadow:0 1px 4px rgba(0,0,0,.1); }
.gallery-arrow:hover { box-shadow:0 2px 6px rgba(0,0,0,.15); }
.gallery-arrow svg { stroke:#0f1111; width:16px; height:16px; }
.gallery-arrow.prev { left:8px; }
.gallery-arrow.next { right:8px; }
.product-info h1 { font-family:var(--font-display); font-size:24px; font-weight:700; line-height:1.3; margin-bottom:8px; color:var(--navy); }
.product-info .sku { font-size:12px; color:var(--gray-light); margin-bottom:12px; }
.product-info .price-big { font-size:28px; font-weight:700; color:var(--orange); margin-bottom:8px; }
.product-info .price-big .old { font-size:16px; color:var(--gray-light); text-decoration:line-through; margin-left:10px; font-weight:400; }
.product-info .desc { color:var(--gray); line-height:1.6; margin-bottom:20px; font-size:14px; }
.size-options { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.size-btn { padding:8px 16px; border:1px solid var(--border); background:var(--white); color:#0f1111; font-size:13px; cursor:pointer; transition:all .2s; border-radius:8px; }
.size-btn:hover, .size-btn.selected { border-color:var(--violet); color:var(--violet); box-shadow:0 0 0 2px rgba(124,58,237,.2); }
.size-btn.sold-out { opacity:.3; cursor:not-allowed; text-decoration:line-through; }
.qty-control { display:inline-flex; align-items:center; border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-bottom:16px; background:var(--light-bg); }
.qty-control button { width:36px; height:36px; border:none; background:transparent; color:#0f1111; font-size:18px; cursor:pointer; transition:background .15s; }
.qty-control button:hover { background:var(--border); }
.qty-control input { width:50px; text-align:center; border:none; border-left:1px solid var(--border); border-right:1px solid var(--border); background:var(--white); color:#0f1111; font-size:15px; padding:6px; }
.stock-info { font-size:14px; color:var(--success); margin-bottom:14px; font-weight:600; }
.product-reassurance { margin-top:20px; padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--light-bg); }
.product-reassurance .item { display:flex; align-items:center; gap:10px; padding:6px 0; }
.product-reassurance .item svg { width:18px; height:18px; stroke:var(--success); flex-shrink:0; }
.product-reassurance .item span { font-size:13px; color:var(--success-dark); font-weight:500; }
.product-reassurance .item span { font-size:13px; color:var(--gray); }
/* Buy box (right column) */
.buy-box { border:1px solid var(--border); border-radius:8px; padding:16px; background:var(--card-bg); position:sticky; top:120px; }

/* Lightbox */
.lightbox { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.9); display:flex; align-items:center; justify-content:center; z-index:9999; opacity:0; transition:opacity .3s; }
.lightbox.active { opacity:1; }
.lightbox img { max-width:90%; max-height:90%; object-fit:contain; background:var(--white); padding:20px; border-radius:8px; }
.lightbox-close { position:absolute; top:20px; right:20px; color:var(--white); font-size:36px; cursor:pointer; }

/* === PANIER (Marketplace) === */
.cart-page { padding:24px 16px; max-width:1000px; margin:0 auto; }
.cart-page h1 { font-size:28px; font-weight:500; color:#0f1111; margin-bottom:20px; }
.cart-table { width:100%; border-collapse:collapse; background:var(--card-bg); border-radius:8px; overflow:hidden; border:1px solid var(--border); }
.cart-table th { text-align:left; padding:10px 14px; border-bottom:1px solid var(--border); font-size:12px; color:var(--gray); background:var(--light-bg); }
.cart-table td { padding:12px 14px; border-bottom:1px solid var(--border); vertical-align:middle; }
.cart-table .cart-img { width:80px; height:80px; object-fit:contain; border:1px solid var(--border); border-radius:4px; background:#f7f7f7; padding:4px; }
.cart-total { text-align:right; padding:20px 0; font-size:20px; font-weight:700; }
.cart-total span { color:var(--danger); }

/* Address form */
.address-form { max-width:600px; margin:24px auto 0; background:var(--card-bg); padding:24px; border:1px solid var(--border); border-radius:8px; }
.form-group { margin-bottom:16px; }
.form-group label { display:block; font-size:13px; font-weight:700; color:#0f1111; margin-bottom:6px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:10px 12px; border:1px solid var(--border-dark); background:var(--white); color:#0f1111; font-size:14px; font-family:var(--font); border-radius:4px; transition:border-color .15s, box-shadow .15s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline:none; border-color:var(--violet); box-shadow:0 0 0 3px rgba(124,58,237,.15); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.address-suggestions { position:absolute; background:var(--white); border:1px solid var(--border); max-height:200px; overflow-y:auto; z-index:50; width:100%; border-radius:4px; box-shadow:0 4px 12px rgba(0,0,0,.1); }
.address-suggestions div { padding:10px 14px; cursor:pointer; font-size:13px; border-bottom:1px solid var(--border); }
.address-suggestions div:hover { background:var(--light-bg); }

/* Auth choice */
.auth-choice { display:flex; flex-direction:column; gap:12px; align-items:center; padding:24px; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; margin:20px 0; }

/* === AUTH PAGE (Marketplace) === */
.auth-page { padding:24px 16px; max-width:380px; margin:0 auto; }
.auth-box { background:var(--card-bg); border:1px solid var(--border); border-radius:8px; padding:24px; }
.auth-tabs { display:flex; gap:0; margin-bottom:20px; }
.auth-tab { flex:1; padding:12px; text-align:center; border:1px solid var(--border); font-size:13px; font-weight:700; cursor:pointer; background:var(--light-bg); color:var(--gray); transition:all .2s; }
.auth-tab:first-child { border-radius:8px 0 0 8px; }
.auth-tab:last-child { border-radius:0 8px 8px 0; }
.auth-tab.active { background:var(--white); color:var(--navy); border-bottom-color:var(--violet); box-shadow:0 -2px 0 var(--violet) inset; }

/* === COMPTE (Marketplace) === */
.compte-page { padding:24px 16px; max-width:1000px; margin:0 auto; }
.compte-tabs { display:flex; gap:0; margin-bottom:20px; border-bottom:2px solid var(--border); }
.compte-tab { padding:12px 24px; font-size:13px; font-weight:700; cursor:pointer; background:transparent; color:var(--gray); transition:all .2s; border-bottom:3px solid transparent; margin-bottom:-2px; }
.compte-tab.active { color:var(--violet); border-bottom-color:var(--violet); }
.order-card { background:var(--card-bg); border:1px solid var(--border); border-radius:8px; margin-bottom:12px; overflow:hidden; }
.order-card-header { display:flex; justify-content:space-between; align-items:center; padding:14px 16px; background:var(--light-bg); border-bottom:1px solid var(--border); flex-wrap:wrap; gap:8px; font-size:13px; }
.badge { padding:3px 10px; font-size:11px; font-weight:700; border-radius:3px; }
.badge-pending { background:#fef3cd; color:#856404; }
.badge-paid { background:#d1e7dd; color:#0f5132; }
.badge-shipped { background:#cfe2ff; color:#084298; }
.badge-delivered { background:#d1e7dd; color:#0f5132; }
.badge-cancelled { background:#f8d7da; color:#842029; }

/* === FAQ (Marketplace) === */
.faq-page { padding:24px 16px; max-width:800px; margin:0 auto; }
.faq-item { background:var(--card-bg); border:1px solid var(--border); border-radius:8px; margin-bottom:8px; overflow:hidden; }
.faq-question { padding:16px 20px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-weight:600; font-size:15px; color:#0f1111; transition:background .2s; }
.faq-question:hover { background:var(--light-bg); }
.faq-answer { display:none; padding:0 20px 16px; color:var(--gray); line-height:1.7; font-size:14px; }
.faq-item.open .faq-answer { display:block; }
.faq-item.open .faq-chevron { transform:rotate(180deg); }
.faq-chevron { transition:transform .2s; color:var(--gray); }

/* === CONTACT (Marketplace) === */
.contact-page { padding:24px 16px; max-width:1000px; margin:0 auto; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.contact-form-card { background:var(--card-bg); border:1px solid var(--border); border-radius:8px; padding:24px; }
.contact-info-card { background:var(--card-bg); border:1px solid var(--border); border-radius:8px; padding:24px; }
.contact-info-item { display:flex; gap:14px; align-items:flex-start; margin-bottom:20px; }
.contact-info-item svg { width:22px; height:22px; stroke:var(--violet); flex-shrink:0; margin-top:2px; }
.contact-info-item h4 { font-size:14px; font-weight:700; margin-bottom:2px; color:var(--navy); }
.contact-info-item p { font-size:13px; color:var(--gray); }

/* === SUCCESS === */
.success-page { padding:40px 16px; text-align:center; max-width:600px; margin:0 auto; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; }
.success-icon { width:64px; height:64px; stroke:var(--success); margin:0 auto 20px; }

/* === LEGAL (Marketplace) === */
.legal-page { padding:24px 16px; max-width:800px; margin:0 auto; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; }
.legal-page h1 { font-size:24px; font-weight:700; margin-bottom:20px; color:#0f1111; }
.legal-page h2 { font-size:18px; margin:24px 0 10px; color:var(--violet); font-weight:700; }
.legal-page p { color:var(--gray); line-height:1.7; margin-bottom:14px; font-size:14px; }

/* === FOOTER (IA Premium) === */
.footer-back { background:var(--navy-mid); text-align:center; padding:14px; cursor:pointer; }
.footer-back:hover { background:var(--navy-light); }
.footer-back span { color:#c4b5fd; font-size:13px; font-weight:500; }
.footer { background:linear-gradient(180deg, var(--navy-light) 0%, var(--navy) 100%); padding:40px 20px 0; }
.footer-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; max-width:1200px; margin:0 auto 30px; }
.footer h4 { font-size:15px; font-weight:700; margin-bottom:14px; color:var(--cyan); }
.footer a { display:block; color:#c4b5fd; font-size:13px; margin-bottom:8px; text-decoration:none; }
.footer a:hover { color:var(--white); text-decoration:underline; }
.footer-bottom { text-align:center; padding:20px 0; border-top:1px solid var(--navy-mid); font-size:12px; color:#94a3b8; background:var(--navy); margin:0 -20px; padding-left:20px; padding-right:20px; }

/* === COOKIE BANNER === */
.cookie-banner { position:fixed; bottom:0; left:0; width:100%; background:linear-gradient(135deg, var(--navy), var(--navy-mid)); padding:14px 20px; display:flex; align-items:center; justify-content:space-between; z-index:9998; gap:16px; box-shadow:0 -4px 20px rgba(124,58,237,.15); }
.cookie-banner p { font-size:13px; color:#c4b5fd; flex:1; }
.cookie-banner .btns { display:flex; gap:8px; }

/* === TOAST === */
.toast { position:fixed; top:20px; right:20px; padding:12px 20px; background:var(--success); color:var(--white); font-size:13px; font-weight:600; z-index:10000; animation:fadeInUp .3s ease; border-radius:8px; box-shadow:0 4px 12px rgba(34,197,94,.3); }
.toast.error { background:var(--danger); color:var(--white); }

/* === FILTERS (Marketplace) === */
.filters-bar { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; align-items:center; padding:12px 16px; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; }
.filter-btn { padding:6px 14px; border:1px solid var(--border); background:var(--white); color:var(--navy); font-size:12px; cursor:pointer; transition:all .15s; border-radius:20px; font-weight:500; }
.filter-btn:hover { border-color:var(--violet); background:rgba(124,58,237,.04); color:var(--violet); }
.filter-btn.active { background:linear-gradient(135deg, var(--violet), var(--violet-dark)); color:var(--white); border-color:var(--violet); box-shadow:0 2px 8px rgba(124,58,237,.25); }
.sort-select { padding:7px 12px; border:1px solid var(--border-dark); background:var(--light-bg); color:#0f1111; font-size:13px; cursor:pointer; border-radius:8px; margin-left:auto; }

/* === SEARCH BAR (Marketplace — Large Center) === */
.search-bar { position:relative; flex:1; max-width:680px; display:flex; }
.search-bar-cat { padding:8px 10px; border:1px solid var(--border-dark); border-right:none; background:var(--light-bg); color:#0f1111; font-size:12px; border-radius:6px 0 0 6px; cursor:pointer; white-space:nowrap; }
.search-bar input { flex:1; padding:9px 14px; border:2px solid var(--violet); background:var(--white); color:#0f1111; font-size:15px; border-radius:0 6px 6px 0; font-family:var(--font); outline:none; }
.search-bar input:focus { box-shadow:0 0 0 3px rgba(124,58,237,.25); border-color:var(--violet-light); }
.search-bar input::placeholder { color:#999; }
.search-bar .search-btn { position:absolute; right:0; top:0; height:100%; width:46px; background:linear-gradient(135deg, var(--violet), var(--violet-dark)); border:none; border-radius:0 6px 6px 0; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .15s; }
.search-bar .search-btn:hover { background:linear-gradient(135deg, var(--violet-light), var(--violet)); box-shadow:0 2px 8px rgba(124,58,237,.3); }
.search-bar .search-btn svg { stroke:var(--white); width:20px; height:20px; }
.search-results { display:none; position:absolute; top:100%; left:0; right:0; max-height:400px; overflow-y:auto; background:var(--white); border:1px solid var(--border); z-index:1001; border-radius:0 0 8px 8px; margin-top:2px; box-shadow:0 8px 24px rgba(0,0,0,.15); }
.search-item { display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid var(--border); color:#0f1111; transition:background .15s; text-decoration:none; }
.search-item:hover { background:var(--light-bg); text-decoration:none; }
.search-item img { width:44px; height:44px; object-fit:contain; background:#f7f7f7; border-radius:4px; padding:3px; }
.search-item strong { display:block; font-size:14px; color:#0f1111; }
.search-item span { font-size:13px; color:var(--danger); font-weight:700; }

/* === NEWSLETTER (IA Premium) === */
.newsletter-section { background:linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 50%, var(--navy-mid) 100%); text-align:center; border-radius:0; max-width:100%; margin:0; padding:40px 20px; }
.newsletter-section .section-title h2 { color:var(--white); }
.newsletter-section .section-title p { color:#c4b5fd; }
.newsletter-section .section-label { color:var(--cyan); }
.newsletter-form { display:flex; gap:0; justify-content:center; max-width:500px; margin:20px auto 0; }
.newsletter-form input { flex:1; min-width:200px; padding:12px 16px; border:1px solid var(--border-dark); background:var(--white); color:#0f1111; font-size:14px; font-family:var(--font); border-radius:4px 0 0 4px; }
.newsletter-form input:focus { outline:none; border-color:var(--violet); box-shadow:0 0 0 3px rgba(124,58,237,.15); }
.newsletter-form .btn { white-space:nowrap; border-radius:0 4px 4px 0; }

/* === WISHLIST BUTTON === */
.wishlist-btn { width:40px; height:40px; border:1px solid var(--border); background:var(--white); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .2s; border-radius:50%; }
.wishlist-btn:hover { border-color:var(--danger); background:#fef2f2; }
.wishlist-btn svg { width:18px; height:18px; stroke:var(--gray); fill:none; transition:all .2s; }
.wishlist-btn.active svg { stroke:var(--danger); fill:var(--danger); }

/* === REVIEWS (IA Premium) === */
.reviews-section { margin-top:24px; background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:24px; }
.reviews-section h3 { font-size:20px; font-weight:700; margin-bottom:16px; color:var(--navy); }
.review-card { background:var(--white); border:1px solid var(--border); padding:16px; margin-bottom:10px; border-radius:8px; }
.review-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.review-author { font-weight:700; font-size:14px; color:#0f1111; }
.review-date { font-size:12px; color:var(--gray-light); }
.stars { color:var(--star); font-size:15px; letter-spacing:1px; }
.review-count { font-size:12px; color:var(--link); margin-left:4px; }
.review-text { font-size:14px; color:var(--gray); line-height:1.6; }
.review-form { margin-top:20px; padding:20px; border:1px solid var(--border); border-radius:8px; background:var(--light-bg); }
.review-form h4 { margin-bottom:12px; font-size:15px; font-weight:700; color:#0f1111; }
.star-rating { display:flex; gap:2px; margin-bottom:12px; }
.star-rating label { cursor:pointer; font-size:28px; color:var(--border); transition:color .15s; }
.star-rating label:hover, .star-rating label.active { color:var(--star); }

/* === COUPON (Marketplace) === */
.coupon-bar { display:flex; gap:0; margin-bottom:12px; align-items:stretch; max-width:400px; }
.coupon-bar input { flex:1; padding:8px 12px; border:1px solid var(--border-dark); background:var(--white); color:#0f1111; font-size:13px; font-family:var(--font); text-transform:uppercase; border-radius:4px 0 0 4px; }
.coupon-bar input:focus { outline:none; border-color:var(--violet); box-shadow:0 0 0 3px rgba(124,58,237,.15); }
.coupon-bar .btn { border-radius:0 4px 4px 0; }
.coupon-msg { font-size:13px; margin-bottom:8px; }
.coupon-msg.success { color:var(--success); }
.coupon-msg.error { color:var(--danger); }
.discount-line { display:flex; justify-content:space-between; font-size:14px; color:var(--success); padding:6px 0; font-weight:600; }

/* === TVA === */
.tva-line { display:flex; justify-content:space-between; font-size:13px; color:var(--gray); padding:3px 0; }

/* === RESPONSIVE === */
@media(max-width:1200px) {
    .products-grid { grid-template-columns:repeat(3,1fr); }
    .product-detail { grid-template-columns:350px 1fr; }
    .product-detail .buy-box { display:none; }
}

@media(max-width:1024px) {
    .header-bottom .nav { display:none; }
    .hamburger { display:flex; }
    .carousel-track .product-card { min-width:calc(33.333% - 12px); }
    .collections-grid { grid-template-columns:1fr 1fr; }
    .footer-grid { grid-template-columns:1fr 1fr; }
    .product-detail { grid-template-columns:1fr; gap:20px; }
}

@media(max-width:768px) {
    .header-top .search-bar { min-width:0; }
    .search-bar-cat { display:none; }
    .hero { min-height:200px; }
    .hero-content h1 { font-size:24px; }
    .hero-content p { font-size:14px; }
    .products-grid { grid-template-columns:1fr 1fr; gap:8px; }
    .product-card .info { padding:8px 10px; }
    .product-card .price { font-size:16px; }
    .carousel-section { padding:16px 12px; }
    .carousel-arrow { display:none; }
    .carousel-track { overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; transform:none !important; }
    .carousel-track .product-card { min-width:45vw; scroll-snap-align:start; }
    .reassurance-grid { grid-template-columns:1fr 1fr; }
    .reassurance-item { padding:16px 10px; }
    .reassurance-item:nth-child(2) { border-right:none; }
    .collections-grid { grid-template-columns:1fr; }
    .contact-grid { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr 1fr; }
    .form-row { grid-template-columns:1fr; }
    .product-gallery { flex-direction:column-reverse; }
    .product-thumbs { flex-direction:row; }
    .gallery-arrow { display:none; }
    .cart-table thead { display:none; }
    .cart-table, .cart-table tbody, .cart-table tr, .cart-table td { display:block; width:100%; }
    .cart-table tr { padding:12px; border:1px solid var(--border); margin-bottom:8px; background:var(--card-bg); border-radius:8px; }
    .cart-table td { display:flex; justify-content:space-between; align-items:center; padding:4px 0; border:none; }
    .cart-table td::before { content:attr(data-label); font-weight:700; font-size:11px; color:var(--gray); }
}

@media(max-width:480px) {
    .products-grid { grid-template-columns:1fr 1fr; gap:6px; }
    .product-card h3 { font-size:12px; }
    .product-card .price { font-size:15px; }
    .reassurance-grid { grid-template-columns:1fr; }
    .reassurance-item { border-right:none !important; border-bottom:1px solid var(--border); }
    .reassurance-item:last-child { border-bottom:none; }
    .hero-cta { flex-direction:column; align-items:center; }
    .footer-grid { grid-template-columns:1fr; }
}

/* Google Fonts import */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');