@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap');

/* ═══════════════════════════════════════════════════════════════
   MTSTORE — Page d'accueil (refonte pixel-perfect, web + mobile)
   Accent orange #e89445, sombre #14161B. Images contraintes (!important)
   pour neutraliser thecore.css.
   ═══════════════════════════════════════════════════════════════ */

.mt-home{ font-family:'Hanken Grotesk',system-ui,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif; color:#1B2330; background:#E9ECF0; }
.mt-home *{ box-sizing:border-box; }
.mt-home a{ text-decoration:none!important; color:inherit; }
.mt-home img{ display:block; }
[data-hide-sb]{ scrollbar-width:none; -ms-overflow-style:none; }
[data-hide-sb]::-webkit-scrollbar{ display:none; }

.mt-wrap{ max-width:1500px; margin:0 auto; padding:0 18px; }
.mt-wrap-pad{ padding-top:16px; padding-bottom:40px; }
.mt-seeall{ font-size:13px; color:#e89445!important; font-weight:600; white-space:nowrap; }

/* ── HERO ── */
.mt-hero-sec{ padding-top:16px; }
.mt-hero{ position:relative; margin-bottom:16px; }
.mt-hero-track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; border-radius:12px; scrollbar-width:none; }
.mt-hero-track::-webkit-scrollbar{ display:none; }
.mt-slide{ scroll-snap-align:start; flex:0 0 100%!important; min-width:100%!important; width:100%!important; position:relative; display:grid; grid-template-columns:1.35fr 1fr; align-items:center; min-height:360px; padding:0 56px; background:linear-gradient(135deg,#14161B 0%,#21243a 60%,#2d2a52 120%); }
.mt-slide:nth-child(3n+2){ background:linear-gradient(135deg,#14161B 0%,#241c44 70%,#3a2d6b 120%); }
.mt-slide:nth-child(3n+3){ background:linear-gradient(135deg,#101826 0%,#1d2440 60%,#2b2c63 120%); }
.mt-slide-txt{ color:#fff; padding:34px 0; z-index:2; }
.mt-slide-badge{ display:inline-flex; align-items:center; gap:7px; padding:5px 12px; border-radius:999px; background:rgba(255,255,255,.1); font-size:12.5px; font-weight:600; margin-bottom:16px; color:#fff; }
.mt-slide-badge i{ width:6px; height:6px; border-radius:999px; background:#e89445; display:inline-block; }
.mt-slide-title{ font-size:34px; font-weight:800; line-height:1.08; letter-spacing:-.02em; margin:0 0 12px; max-width:18ch; color:#fff; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.mt-slide-sub{ margin:0 0 22px; color:#c4c8d6; font-size:15px; max-width:42ch; }
.mt-sub-m{ display:none; }
.mt-slide-cta{ display:flex; gap:10px; flex-wrap:wrap; }
.mt-btn-primary{ border:none; background:#e89445; color:#fff!important; font-family:inherit; font-weight:700; font-size:15px; padding:13px 24px; border-radius:12px; cursor:pointer; display:inline-block; transition:filter .15s; }
.mt-btn-primary:hover{ filter:brightness(1.1); }
.mt-btn-light{ background:#fff; color:#14161B!important; border:none; font-family:inherit; font-weight:700; font-size:15px; padding:13px 24px; border-radius:12px; cursor:pointer; display:inline-block; transition:background .15s; }
.mt-btn-light:hover{ background:#eef0f3; }
.mt-slide-media{ position:relative; height:100%; display:flex; align-items:center; justify-content:center; padding:18px 0; }
.mt-slide-prod{ position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.mt-slide-media img{ width:auto!important; max-width:100%!important; height:auto!important; max-height:300px!important; object-fit:contain!important; border-radius:0!important; padding:0!important; filter:drop-shadow(0 22px 38px rgba(0,0,0,.45)); }
.mt-slide-price{ position:absolute; bottom:6px; right:0; background:#fff; color:#14161B; border-radius:12px; padding:9px 14px; box-shadow:0 12px 30px -12px rgba(0,0,0,.5); display:flex; flex-direction:column; line-height:1.15; z-index:3; }
.mt-slide-price-l{ font-size:11px; color:#8A909C; }
.mt-slide-price-v{ font-size:19px; font-weight:800; color:#14161B; }
.mt-slide-price-off{ font-size:12px; color:#DC4A2B; font-weight:700; }
.mt-hero-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:42px; height:42px; border-radius:999px; border:none; background:rgba(255,255,255,.92); color:#14161B; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px -6px rgba(0,0,0,.5); transition:background .15s; }
.mt-hero-nav:hover{ background:#fff; }
.mt-hero-nav svg{ width:18px; height:18px; fill:none; stroke:#14161B; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.mt-hero-prev{ left:10px; } .mt-hero-next{ right:10px; }
.mt-hero-dots{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:5; }
.mt-hero-dots span{ width:7px; height:7px; border-radius:999px; background:rgba(255,255,255,.55); cursor:pointer; transition:width .2s,background .2s; }
.mt-hero-dots span.on{ width:22px; background:#fff; }

/* ── RAIL CATÉGORIES (mobile) ── */
.mt-catrail{ display:none; }
.mt-catrail-item{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:6px; width:72px; }
.mt-catrail-img{ width:60px; height:60px; border-radius:999px; background:#F0F1F4; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.mt-catrail-img img{ width:100%!important; height:100%!important; max-width:none!important; object-fit:cover!important; }
.mt-catrail-name{ font-size:11px; font-weight:600; color:#1A1A1A; text-align:center; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:72px; }

/* ── DECK GRID (desktop) ── */
.mt-deck-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; }
.mt-deck{ background:#fff; border:1px solid #E4E7EC; border-radius:12px; padding:15px; display:flex; flex-direction:column; }
.mt-deck-title{ font-size:16px; font-weight:700; margin:0 0 12px; color:#14161B; }
.mt-deck-items{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mt-deck-cell{ cursor:pointer; }
.mt-deck-img{ background:#F6F8FB; border:1px solid #EEF0F4; border-radius:6px; height:94px!important; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.mt-deck-img img{ width:auto!important; height:auto!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; padding:8px!important; }
.mt-deck-label{ font-size:11px; color:#5B616D; margin-top:4px; line-height:1.2; height:26px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.mt-deck-more{ font-size:13px; color:#e89445!important; font-weight:600; margin-top:12px; }

/* ── PUBLICITÉ ── */
.mt-ad{ position:relative; border:1px dashed #C7CCD4; border-radius:12px; overflow:hidden; margin-bottom:16px; background-image:repeating-linear-gradient(45deg,#F4F6F9 0 12px,#EDF0F4 12px 24px); display:flex; align-items:center; justify-content:center; }
.mt-ad-lb{ height:120px; } .mt-ad-lb-tall{ height:160px; }
.mt-ad-tag{ position:absolute; top:9px; left:10px; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:#8A909C; background:#fff; padding:2px 7px; border-radius:4px; font-weight:700; border:1px solid #E4E7EC; }
.mt-ad-mono{ text-align:center; }
.mt-ad-mono-1{ font-family:ui-monospace,monospace; font-size:13px; color:#6E7480; font-weight:600; }
.mt-ad-mono-2{ font-size:12px; color:#A6ABB5; margin-top:3px; }

/* ── VENTES FLASH ── */
.mt-flash{ background:#fff; border:1px solid #E4E7EC; border-radius:12px; padding:16px; margin-bottom:16px; }
.mt-flash-head{ display:flex; align-items:center; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.mt-flash-h2{ font-size:20px; font-weight:800; margin:0; color:#14161B; display:flex; align-items:center; gap:7px; }
.mt-flash-timer{ display:flex; align-items:center; gap:6px; font-size:13px; color:#5B616D; }
.mt-tt{ display:inline-flex; gap:3px; align-items:center; }
.mt-tt > span{ background:#14161B; color:#fff; font-weight:700; padding:2px 6px; border-radius:4px; font-variant-numeric:tabular-nums; }
.mt-flash-head .mt-seeall{ margin-left:auto; }
.mt-flash-card{ min-width:174px!important; max-width:174px!important; display:flex; flex-direction:column; }
.mt-flash-img{ position:relative; height:150px!important; background:#fff; border:1px solid #E4E7EC; border-radius:12px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.mt-flash-img img{ width:auto!important; height:auto!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; padding:10px!important; }
.mt-flash-off{ position:absolute; top:8px; left:8px; background:#DC4A2B; color:#fff; font-size:13px; font-weight:800; padding:4px 8px; border-radius:5px; }
.mt-flash-body{ padding-top:9px; }
.mt-flash-tag{ display:inline-block; background:#FDECE7; color:#DC4A2B; font-size:11px; font-weight:700; padding:2px 7px; border-radius:4px; }
.mt-flash-bar{ height:8px; background:#EFE6D8; border-radius:999px; margin:9px 0 4px; overflow:hidden; }
.mt-flash-bar > div{ height:100%; background:linear-gradient(90deg,#F5A623,#DC4A2B); }
.mt-flash-claim{ font-size:11.5px; color:#8A909C; }
.mt-flash-price{ display:flex; align-items:baseline; gap:6px; margin-top:7px; }
.mt-flash-name{ font-size:12px; color:#1B2330; margin-top:3px; line-height:1.25; height:30px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }

/* ── BANDEAU CONFIANCE ── */
.mt-trust{ background:#fff; border:1px solid #E4E7EC; border-radius:12px; padding:14px 18px; margin-bottom:16px; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.mt-trust-item{ display:flex; align-items:center; gap:11px; }
.mt-trust-ic{ width:38px; height:38px; flex-shrink:0; border-radius:8px; background:rgba(232,148,69,.14); color:#e89445; display:flex; align-items:center; justify-content:center; }
.mt-trust-ic svg{ width:19px; height:19px; }
.mt-trust-t{ font-weight:700; font-size:14px; color:#14161B; }
.mt-trust-s{ font-size:12.5px; color:#8A909C; }

/* ── CARROUSELS / CARTES PRODUIT ── */
.mt-rail-sec{ background:#fff; border:1px solid #E4E7EC; border-radius:12px; padding:16px; margin-bottom:16px; }
.mt-rail-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:13px; }
.mt-rail-h2{ font-size:19px; font-weight:800; margin:0; color:#14161B; }
.mt-rail{ display:flex; gap:13px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; }
.mt-rail::-webkit-scrollbar{ display:none; }
.mt-pc{ position:relative; min-width:190px!important; max-width:190px!important; background:#fff; border:1px solid #E4E7EC; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s,border-color .2s; }
.mt-pc:hover{ box-shadow:0 10px 26px -16px rgba(16,18,24,.5); border-color:#d6dae1; }
.mt-pc-imgwrap{ display:block; }
.mt-pc-img{ position:relative; height:152px!important; background:#fff; display:flex; align-items:center; justify-content:center; border-bottom:1px solid #F1F2F5; overflow:hidden; }
.mt-pc-img img{ width:auto!important; height:auto!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; padding:12px!important; }
.mt-pc-off{ position:absolute; top:8px; left:8px; background:#DC4A2B; color:#fff; font-size:11.5px; font-weight:700; padding:3px 7px; border-radius:5px; z-index:2; }
.mt-pc-wish{ position:absolute; top:8px; right:8px; width:30px; height:30px; border-radius:999px; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(16,18,24,.1); cursor:pointer; border:none; z-index:3; }
.mt-pc-wish svg{ width:15px; height:15px; fill:none; stroke:#9aa0ac; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mt-pc-wish:hover svg{ stroke:#e89445; }
.mt-pc-body{ padding:10px 11px 12px; display:flex; flex-direction:column; flex:1; }
.mt-pc-brand{ font-size:11px; color:#8A909C; margin-bottom:3px; }
.mt-pc-name{ font-size:12.5px; line-height:1.3; color:#1B2330!important; height:33px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.mt-pc-stars{ display:flex; align-items:center; gap:1px; margin:6px 0 7px; }
.mt-pc-stars svg{ width:12px; height:12px; }
.mt-pc-rev{ font-size:11px; color:#8A909C; margin-left:4px; }
.mt-pc-pr{ display:flex; align-items:baseline; gap:6px; }
.mt-pc-price{ font-size:17px; font-weight:800; color:#14161B; }
.mt-pc-old{ font-size:12px; color:#A6ABB5; text-decoration:line-through; }
.mt-pc-add{ margin-top:9px; border:none; background:#e89445; color:#fff!important; font-family:inherit; font-weight:700; font-size:12.5px; padding:8px; border-radius:8px; cursor:pointer; transition:filter .15s; }
.mt-pc-add:hover{ filter:brightness(1.1); }

/* ── MARQUES ── */
.mt-brands{ background:#fff; border:1px solid #E4E7EC; border-radius:12px; padding:16px; margin-bottom:16px; }
.mt-brands-h2{ font-size:17px; font-weight:800; margin:0 0 13px; color:#14161B; }
.mt-brand-list{ display:flex; gap:11px; flex-wrap:wrap; }
.mt-brand-pill{ padding:9px 18px; border:1px solid #E4E7EC; border-radius:8px; font-weight:700; font-size:14px; color:#3b414c!important; transition:border-color .15s,color .15s; }
.mt-brand-pill:hover{ border-color:#e89445; color:#e89445!important; }

/* ── RECOMMANDÉ (AJAX) ── */
.mt-grid{ display:flex; flex-wrap:wrap; gap:13px; }
.mt-more-btn{ background:#fff; color:#e89445; border:1.5px solid #e89445; border-radius:8px; font-size:14px; font-weight:700; padding:12px 48px; margin:18px auto 0; cursor:pointer; font-family:inherit; display:block; }
.mt-more-btn:hover{ background:#e89445; color:#fff; }

/* ═══════════════ RESPONSIVE ═══════════════ */
@media(max-width:1100px){ .mt-deck-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:991px){
    /* HÉRO MOBILE — slide sombre, texte à gauche / image à droite, prix à côté de l'image, 1 bouton orange (2 lignes) */
    .mt-slide{ grid-template-columns:1fr 130px; min-height:0; padding:20px 18px; gap:14px; align-items:center; border-radius:14px; }
    .mt-slide-txt{ order:1; padding:0; display:flex; flex-direction:column; align-items:flex-start; }
    .mt-slide-badge{ font-size:11px; padding:4px 10px; margin-bottom:10px; }
    .mt-slide-title{ font-size:22px; margin:0 0 8px; max-width:none; }
    .mt-slide-sub{ font-size:13px; margin:0 0 14px; max-width:none; }
    .mt-sub-d{ display:none; }
    .mt-sub-m{ display:block; }
    .mt-slide-cta{ gap:0; }
    .mt-slide-cta .mt-btn-light{ display:none; }
    .mt-slide-cta .mt-btn-primary{ font-size:13px; padding:9px 16px; max-width:130px; white-space:normal; line-height:1.2; text-align:center; }
    .mt-slide-media{ order:2; padding:0; height:auto; align-self:center; }
    .mt-slide-prod{ height:auto; }
    .mt-slide-media img{ max-height:172px!important; max-width:100%!important; border-radius:12px!important; }
    .mt-slide-price{ left:0; right:auto; bottom:0; padding:5px 11px; }
    .mt-slide-price-l{ font-size:9px; }
    .mt-slide-price-v{ font-size:15px; }
    .mt-slide-price-off{ font-size:10.5px; }
    .mt-hero-sec .mt-wrap{ padding:8px 14px 0; }
    .mt-hero{ margin-bottom:12px; }
    .mt-hero-nav{ display:none; }
    .mt-hero-track{ border-radius:14px; gap:12px; }
    .mt-trust{ grid-template-columns:1fr 1fr; }
}
@media(max-width:767px){
    .mt-wrap{ padding:0 12px; }
    .mt-wrap-pad{ padding-top:8px; }
    .mt-catrail{ display:flex; gap:10px; overflow-x:auto; padding:12px 0 6px; }
    .mt-deck-grid{ display:none; }
    .mt-ad-lb,.mt-ad-lb-tall{ height:96px; }
    .mt-flash,.mt-rail-sec,.mt-brands{ padding:14px; margin-bottom:12px; }
    .mt-flash-h2,.mt-rail-h2{ font-size:17px; }
    .mt-flash-timer{ font-size:11.5px; }
    .mt-trust{ display:flex; overflow-x:auto; gap:10px; padding:12px 14px; }
    .mt-trust-item{ flex:0 0 auto; min-width:200px; }
    .mt-pc{ min-width:152px!important; max-width:152px!important; }
    .mt-pc-img{ height:128px!important; }
    .mt-pc-price{ font-size:15px; }
    .mt-flash-card{ min-width:140px!important; max-width:140px!important; }
    .mt-flash-img{ height:124px!important; }
    .mt-brands-h2{ font-size:15px; }
    .mt-brand-pill{ font-size:12.5px; padding:7px 14px; }
}


/* ── BLOCS SPONSORISÉS ── */
.mt-spon{ position:relative; border:1px solid #E4E7EC; border-radius:12px; overflow:hidden; margin-bottom:16px; display:grid; grid-template-columns:1.25fr .75fr; }
.mt-spon-rev{ grid-template-columns:.75fr 1.25fr; }
.mt-spon-tag{ position:absolute; top:9px; right:10px; z-index:2; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.85); background:rgba(0,0,0,.25); padding:2px 7px; border-radius:4px; font-weight:700; }
.mt-spon-text{ background:linear-gradient(115deg,#14161B,#3a2a1e 58%,#e89445); color:#fff; padding:30px 34px; display:flex; flex-direction:column; justify-content:center; gap:11px; }
.mt-spon-rev .mt-spon-text{ order:2; }
.mt-spon-rev .mt-spon-media{ order:1; }
.mt-spon-brand{ font-size:11.5px; font-weight:700; color:rgba(255,255,255,.65); }
.mt-spon-h{ font-size:28px; font-weight:800; line-height:1.05; letter-spacing:-.02em; }
.mt-spon-s{ font-size:14.5px; color:rgba(255,255,255,.85); max-width:46ch; }
.mt-spon-cta{ align-self:flex-start; margin-top:5px; background:#fff; color:#14161B!important; font-weight:700; font-size:14px; padding:11px 20px; border-radius:8px; text-decoration:none!important; }
.mt-spon-media{ min-height:170px; background-color:#0e1430; background-image:repeating-linear-gradient(45deg,#181d3a 0 12px,#10142e 12px 24px); }

/* ── Arrondi des visuels produit ── */
.mt-deck-img,.mt-flash-img,.mt-pc-img{ border-radius:12px!important; }

@media(max-width:767px){
    .mt-spon,.mt-spon-rev{ grid-template-columns:1fr; }
    .mt-spon-text{ padding:22px 18px; }
    .mt-spon-h{ font-size:22px; }
    .mt-spon-media{ min-height:120px; }
}
