/* ════════════════════════════════════════
   B2B RIM – Feuille de style principale
   Police titres : Barlow Condensed
   ════════════════════════════════════════ */
:root {
  --green:  #006233;
  --green2: #007A42;
  --red:    #C8002B;
  --gold:   #FFD700;
  --gold2:  #F4A225;
  --light:  #F4F7F2;
  --dark:   #0D1A0D;
  --mid:    #4A5A48;
  --border: #D6E4D0;
  --white:  #FFFFFF;
  --radius: 10px;
  --shadow: 0 4px 20px rgba(0,98,51,.1);
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; max-width:100%; }
body { font-family:'DM Sans',sans-serif; background:#f0f2ef; color:var(--dark); overflow-x:hidden; max-width:100vw; line-height:1.5; }
a { text-decoration:none; }
img { max-width:100%; }

/* ── TOPBAR / HEADER combiné ── */
.topbar-header { background:var(--green); position:sticky; top:0; z-index:100; box-shadow:0 2px 16px rgba(0,0,0,.15); }
.topbar-inner { max-width:1400px; margin:0 auto; padding:0 20px; display:flex; align-items:center; gap:12px; min-height:56px; flex-wrap:wrap; }

/* ── LOGO ── */
.logo { font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:28px; color:#fff; text-decoration:none; white-space:nowrap; letter-spacing:0; display:flex; align-items:center; gap:6px; }
.logo .dot { color:var(--red); }

/* ── TOP SEARCH ── */
.top-search { flex:1; display:flex; background:#fff; border-radius:8px; overflow:hidden; height:34px; max-width:680px; }
.top-search input { flex:1; border:none; outline:none; padding:0 14px; font-size:13px; font-family:'DM Sans',sans-serif; color:var(--dark); min-width:0; }
.top-search select { border:none; border-left:1px solid var(--border); padding:0 10px; background:var(--light); font-size:12px; font-family:'DM Sans',sans-serif; color:var(--mid); outline:none; cursor:pointer; }
.top-search button { background:var(--red); color:#fff; border:none; padding:0 18px; font-size:13px; font-weight:600; cursor:pointer; transition:background .2s; white-space:nowrap; }
.top-search button:hover { background:#a0001f; }

.topbar-actions { display:flex; gap:10px; margin-left:auto; flex-shrink:0; }
.topbar-actions a { color:rgba(255,255,255,.85); font-size:13px; transition:color .2s; }
.topbar-actions a:hover { color:var(--gold); }
.topbar-actions a.sell { color:var(--gold); font-weight:700; border:1px solid rgba(255,215,0,.5); padding:5px 12px; border-radius:6px; }
.topbar-actions a.sell:hover { background:rgba(255,215,0,.15); }

/* ── FLAG ── */
.flag-stripe { height:4px; background:linear-gradient(to right,var(--red) 15%,var(--green) 15%,var(--green) 85%,var(--red) 85%); }

/* ── NAV ── */
nav { background:var(--green); border-top:1px solid rgba(255,255,255,.1); }
.nav-inner { max-width:1400px; margin:0 auto; padding:0 8px; display:flex; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.nav-inner::-webkit-scrollbar { display:none; }
.nav-inner a { color:rgba(255,255,255,.8); font-size:13px; font-weight:500; padding:11px 18px; white-space:nowrap; border-bottom:3px solid transparent; transition:all .2s; display:block; flex-shrink:0; }
.nav-inner a:hover,.nav-inner a.active { color:#fff; border-bottom-color:var(--gold); background:rgba(255,255,255,.07); }

/* ── HERO compact ── */
.hero { background:linear-gradient(140deg,var(--green) 0%,#004d28 55%,#002d16 100%); color:#fff; padding:28px 24px 24px; text-align:center; position:relative; overflow:hidden; }
.hero::before { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 60% 50% at 80% 30%,rgba(255,215,0,.06) 0%,transparent 60%); }
.hero-crescent { position:absolute; right:4%; top:50%; transform:translateY(-50%); font-size:90px; opacity:.05; pointer-events:none; }
.hero-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(255,215,0,.15); border:1px solid rgba(255,215,0,.3); padding:4px 14px; border-radius:20px; font-size:11px; font-weight:700; color:var(--gold); margin-bottom:12px; font-family:'Barlow Condensed',sans-serif; letter-spacing:.5px; }
.hero h1 { font-family:'Barlow Condensed',sans-serif; font-size:clamp(26px,4vw,48px); font-weight:800; margin-bottom:8px; line-height:1.15; color:#fff; letter-spacing:.3px; }
.hero h1 .gold { color:var(--gold); }
.hero h1 .red  { color:#ff6b7a; }
.hero p { font-size:14px; color:rgba(255,255,255,.75); margin-bottom:12px; }
.hero-tags { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.hero-tag { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.85); padding:4px 12px; border-radius:20px; font-size:12px; cursor:pointer; transition:all .2s; }
.hero-tag:hover { background:rgba(255,215,0,.2); border-color:var(--gold); color:var(--gold); }

/* ── DIASPORA BANNER ── */
.diaspora-banner { background:linear-gradient(90deg,var(--red),#9a0020); padding:14px 24px; color:#fff; }
.diaspora-inner { max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; font-size:14px; }
.diaspora-inner strong { color:var(--gold); }
.diaspora-inner a { background:#fff; color:var(--red); padding:7px 18px; border-radius:6px; font-size:13px; font-weight:700; transition:all .2s; white-space:nowrap; }
.diaspora-inner a:hover { background:var(--gold); color:var(--dark); }

/* ── TRUST ── */
.trust { background:var(--white); border-bottom:2px solid var(--border); padding:14px 24px; }
.trust-inner { max-width:1400px; margin:0 auto; display:flex; justify-content:space-around; align-items:center; flex-wrap:wrap; gap:14px; }
.trust-item { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--mid); }
.trust-item strong { color:var(--green); font-weight:700; }
.trust-icon { font-size:20px; }

/* ── BODY 2 COLONNES ── */
.body-wrap { max-width:1400px; margin:0 auto; padding:18px 24px; display:grid; grid-template-columns:1fr 250px; gap:20px; align-items:start; }
.col-left { display:flex; flex-direction:column; gap:20px; }
.col-right { display:flex; flex-direction:column; gap:14px; position:sticky; top:56px; }

/* ── LOGIN NOTICE ── */
.login-notice { display:flex; align-items:center; gap:10px; background:rgba(0,98,51,.07); border:1.5px solid rgba(0,98,51,.2); border-radius:var(--radius); padding:10px 16px; font-size:13px; }
.login-notice a { color:var(--green); font-weight:700; }

/* ── SECTIONS ── */
section { padding:0; }
.section-header-row { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:14px; flex-wrap:wrap; gap:10px; }
.section-title { font-family:'Barlow Condensed',sans-serif; font-size:26px; font-weight:800; color:var(--green); letter-spacing:.3px; margin-bottom:4px; }
.section-title .red { color:var(--red); }
.section-sub { font-size:13px; color:var(--mid); margin-bottom:16px; }
.products-section { padding:0; }

/* ── TABS ── */
.tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.tab { padding:6px 16px; border-radius:20px; border:1.5px solid var(--border); font-size:12px; cursor:pointer; background:#fff; color:var(--mid); transition:all .2s; font-family:'DM Sans',sans-serif; user-select:none; }
.tab.active,.tab:hover { background:var(--green); color:#fff; border-color:var(--green); }

/* ── PRODUCTS GRID ── */
.products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; }
.product-card { border:1.5px solid var(--border); border-radius:var(--radius); overflow:hidden; background:#fff; transition:all .2s; }
.product-card:hover { border-color:var(--green); box-shadow:var(--shadow); transform:translateY(-3px); }
.prod-img { height:110px; display:flex; align-items:center; justify-content:center; position:relative; }
.prod-emoji { font-size:42px; filter:drop-shadow(0 2px 8px rgba(0,0,0,.15)); }
.prod-badges { position:absolute; top:6px; right:6px; display:flex; flex-direction:column; gap:3px; align-items:flex-end; }
.prod-boost { background:var(--gold); color:var(--dark); font-size:9px; font-weight:700; padding:2px 6px; border-radius:20px; }
.prod-trend { background:var(--red); color:#fff; font-size:9px; font-weight:700; padding:2px 6px; border-radius:20px; }
.prod-body { padding:10px; }
.prod-tag { font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--green); background:rgba(0,98,51,.08); padding:2px 7px; border-radius:10px; display:inline-block; margin-bottom:5px; }
.prod-name { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:15px; margin-bottom:3px; line-height:1.2; letter-spacing:.2px; }
.prod-origin { font-size:10px; color:var(--mid); margin-bottom:3px; }
.prod-moq { font-size:11px; color:var(--mid); margin-bottom:4px; }
.prod-moq strong { color:var(--green); }
.prod-price { font-size:14px; font-weight:800; color:var(--red); margin-bottom:4px; font-family:'Barlow Condensed',sans-serif; letter-spacing:.2px; }
.prod-price.blurred { display:flex; align-items:center; gap:6px; }
.prod-price.blurred span:first-child { filter:blur(4px); user-select:none; color:var(--mid); }
.lock-tip { font-size:9px; color:var(--mid); font-weight:400; white-space:nowrap; }
.prod-company { font-size:11px; color:var(--mid); margin-bottom:8px; }
.prod-company.blurred { display:flex; align-items:center; gap:4px; }
.prod-company.blurred span { filter:blur(3px); user-select:none; }
.prod-footer { border-top:1px solid var(--border); padding-top:8px; display:flex; gap:6px; }
.btn-contact { flex:1; text-align:center; padding:5px; border-radius:6px; font-size:11px; font-weight:600; border:none; cursor:pointer; background:var(--green); color:#fff; transition:background .2s; text-decoration:none; display:inline-block; }
.btn-contact:hover { background:var(--red); }
.btn-contact-prod { flex:1; background:var(--light); color:var(--dark); border:1.5px solid var(--border); padding:5px; border-radius:6px; font-size:11px; font-weight:600; cursor:pointer; transition:all .2s; font-family:'DM Sans',sans-serif; }
.btn-contact-prod:hover { background:var(--green); color:#fff; border-color:var(--green); }

/* ── PUB LABEL ── */
.pub-label { font-size:10px; color:var(--mid); padding:5px 14px; background:var(--light); border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
.pub-close { cursor:pointer; color:var(--green); font-weight:700; font-size:13px; }

/* ── PUB 1 — 2 colonnes ── */
.pub1 { border-radius:var(--radius); overflow:hidden; border:1.5px solid var(--border); background:#fff; }
.pub1-body { display:grid; grid-template-columns:1fr 1fr; }
.pub1-item { padding:14px; display:flex; gap:12px; align-items:center; }
.pub1-item:first-child { border-right:1px solid var(--border); }
.pub1-icon { width:50px; height:50px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.pub1-info strong { display:block; font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800; color:var(--dark); margin-bottom:3px; letter-spacing:.2px; }
.pub1-info p { font-size:11px; color:var(--mid); line-height:1.4; margin-bottom:5px; }
.pub1-info a { font-size:11px; color:var(--red); font-weight:700; border-bottom:1px solid var(--red); }
.pub1-info a:hover { color:var(--green); border-color:var(--green); }

/* ── CATEGORIES ── */
.categories { padding:0; }
.cat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; }
.cat-card { background:#fff; border:1.5px solid var(--border); border-radius:var(--radius); padding:12px; text-decoration:none; color:var(--dark); display:flex; align-items:center; gap:10px; transition:all .2s; }
.cat-card:hover { border-color:var(--green); box-shadow:var(--shadow); transform:translateY(-2px); }
.cat-icon { width:40px; height:40px; border-radius:8px; background:var(--green); display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.cat-card:nth-child(3n+2) .cat-icon { background:var(--red); }
.cat-card:nth-child(3n)   .cat-icon { background:var(--gold2); }
.cat-info strong { display:block; font-size:12px; font-weight:600; margin-bottom:2px; }
.cat-info span { font-size:10px; color:var(--mid); }

/* ── PUB 2 — Carousel ── */
.pub2 { border-radius:var(--radius); overflow:hidden; border:1.5px solid var(--border); background:#fff; }
.pub2-viewport { overflow:hidden; position:relative; }
.pub2-track { display:flex; transition:transform 0.5s ease; }
.pub2-slide { min-width:100%; display:flex; align-items:center; gap:18px; padding:18px 20px; }
.pub2-img { width:100px; height:84px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:40px; flex-shrink:0; }
.pub2-content strong { display:block; font-family:'Barlow Condensed',sans-serif; font-size:18px; font-weight:800; color:var(--dark); margin-bottom:5px; letter-spacing:.2px; }
.pub2-content p { font-size:12px; color:var(--mid); line-height:1.5; margin-bottom:8px; }
.pub2-content a { display:inline-block; background:var(--red); color:#fff; font-size:11px; font-weight:700; padding:6px 16px; border-radius:6px; transition:background .2s; }
.pub2-content a:hover { background:var(--green); }
.pub2-nav { display:flex; justify-content:space-between; align-items:center; padding:8px 14px; border-top:1px solid var(--border); background:var(--light); }
.pub2-dots { display:flex; gap:6px; }
.pub2-dot { width:8px; height:8px; border-radius:50%; background:var(--border); cursor:pointer; border:none; transition:all .2s; }
.pub2-dot.active { background:var(--green); width:20px; border-radius:4px; }
.pub2-arrows { display:flex; gap:6px; }
.pub2-arr { background:#fff; border:1.5px solid var(--border); width:28px; height:28px; border-radius:50%; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.pub2-arr:hover { background:var(--green); color:#fff; border-color:var(--green); }

/* ── WILAYAS ── */
.cities-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; }
.city-card { border:1.5px solid var(--border); border-radius:var(--radius); padding:12px 10px; text-align:center; text-decoration:none; color:var(--dark); transition:all .2s; background:#fff; display:block; }
.city-card:hover { border-color:var(--green); background:var(--green); color:#fff; transform:translateY(-2px); }
.city-icon { font-size:24px; display:block; margin-bottom:5px; }
.city-name { font-size:12px; font-weight:700; margin-bottom:2px; }
.city-count { font-size:10px; color:var(--mid); }
.city-card:hover .city-count { color:rgba(255,255,255,.7); }

/* ── HOW IT WORKS ── */
.how { background:var(--light); border-radius:14px; padding:28px 24px; }
.steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.step { text-align:center; padding:24px 16px; background:#fff; border-radius:var(--radius); border:1.5px solid var(--border); }
.step-num { width:50px; height:50px; background:var(--green); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; margin:0 auto 14px; }
.step:nth-child(2) .step-num { background:var(--red); }
.step:nth-child(3) .step-num { background:var(--gold2); color:var(--dark); }
.step:nth-child(4) .step-num { background:#004d28; }
.step h3 { font-family:'Barlow Condensed',sans-serif; font-size:17px; font-weight:800; margin-bottom:8px; letter-spacing:.2px; }
.step p { font-size:12px; color:var(--mid); line-height:1.6; }

/* ── PRICING ── */
.pricing-section { background:var(--light); border-radius:14px; padding:28px 24px; }
.pricing-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; max-width:820px; margin:0 auto; }
.pricing-card { background:#fff; border:2px solid var(--border); border-radius:14px; padding:26px; position:relative; }
.pricing-card.premium { border-color:var(--gold2); box-shadow:0 8px 32px rgba(244,162,37,.15); }
.pricing-badge-top { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--gold2); color:var(--dark); font-size:11px; font-weight:700; padding:3px 16px; border-radius:20px; white-space:nowrap; }
.pricing-header { text-align:center; margin-bottom:20px; padding-bottom:18px; border-bottom:1px solid var(--border); }
.pricing-plan { font-family:'Barlow Condensed',sans-serif; font-size:20px; font-weight:800; margin-bottom:8px; letter-spacing:.3px; }
.pricing-price { font-family:'Barlow Condensed',sans-serif; font-size:34px; font-weight:800; color:var(--green); margin-bottom:6px; letter-spacing:.2px; }
.pricing-price span { font-size:14px; font-weight:400; color:var(--mid); }
.pricing-header p { font-size:12px; color:var(--mid); }
.pricing-features { list-style:none; margin-bottom:20px; }
.pricing-features li { font-size:12px; padding:6px 0; border-bottom:1px solid var(--border); }
.pricing-features li:last-child { border-bottom:none; }
.feat-yes { color:var(--dark); }
.feat-no  { color:var(--mid); }
.feat-ad  { color:var(--red); }
.pricing-btn { display:block; text-align:center; padding:12px; border-radius:var(--radius); font-size:13px; font-weight:700; text-decoration:none; transition:all .2s; font-family:'Barlow Condensed',sans-serif; letter-spacing:.2px; }
.free-btn { background:var(--light); color:var(--green); border:2px solid var(--green); }
.free-btn:hover { background:var(--green); color:#fff; }
.premium-btn { background:var(--gold2); color:var(--dark); }
.premium-btn:hover { background:var(--red); color:#fff; }

/* ── DIASPORA ── */
.intl { padding:0; }
.intl-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px; }
.intl-card { border:1.5px solid var(--border); border-radius:var(--radius); padding:12px 8px; text-align:center; text-decoration:none; color:var(--dark); transition:all .2s; background:#fff; display:block; }
.intl-card:hover { border-color:var(--red); background:var(--red); color:#fff; transform:translateY(-2px); }
.intl-flag { font-size:26px; display:block; margin-bottom:5px; }
.intl-name { font-size:11px; font-weight:700; margin-bottom:2px; }
.intl-count { font-size:9px; color:var(--mid); }
.intl-card:hover .intl-count { color:rgba(255,255,255,.7); }

/* ── PANNEAU DROIT ── */
.panel { background:#fff; border:1.5px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.panel-hdr { padding:8px 12px; font-size:11px; font-weight:700; font-family:'Barlow Condensed',sans-serif; letter-spacing:.3px; font-size:13px; }
.stats-grid { display:grid; grid-template-columns:1fr 1fr; }
.stat-cell { padding:10px 8px; text-align:center; border-right:1px solid var(--border); border-bottom:1px solid var(--border); }
.stat-cell:nth-child(2n) { border-right:none; }
.stat-cell:nth-child(3),.stat-cell:nth-child(4) { border-bottom:none; }
.stat-cell strong { display:block; font-family:'Barlow Condensed',sans-serif; font-size:20px; font-weight:800; color:var(--green); letter-spacing:.2px; }
.stat-cell span { font-size:9px; color:var(--mid); }
.premium-body { padding:12px; }
.pz-title { font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:800; margin-bottom:3px; letter-spacing:.2px; }
.pz-sub { font-size:11px; color:var(--mid); margin-bottom:8px; line-height:1.4; }
.pz-list { list-style:none; margin-bottom:10px; }
.pz-list li { font-size:11px; color:var(--mid); padding:3px 0; border-bottom:1px solid var(--border); }
.pz-list li:last-child { border-bottom:none; }
.pz-btn { display:block; width:100%; padding:8px; background:var(--gold2); color:var(--dark); border:none; border-radius:var(--radius); font-size:11px; font-weight:700; cursor:pointer; font-family:'Barlow Condensed',sans-serif; letter-spacing:.2px; text-align:center; text-decoration:none; transition:all .2s; }
.pz-btn:hover { background:var(--red); color:#fff; }
.pub-ext-body { padding:10px 12px; display:flex; flex-direction:column; gap:9px; }
.pub-ext-item { display:flex; gap:9px; align-items:center; padding-bottom:9px; border-bottom:1px solid var(--border); }
.pub-ext-item:last-child { border-bottom:none; padding-bottom:0; }
.pub-ext-img { width:40px; height:40px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.pub-ext-info strong { display:block; font-size:11px; font-weight:700; color:var(--dark); margin-bottom:1px; font-family:'Barlow Condensed',sans-serif; letter-spacing:.1px; }
.pub-ext-info span { display:block; font-size:9px; color:var(--mid); margin-bottom:3px; line-height:1.3; }
.pub-ext-info a { font-size:9px; color:var(--red); font-weight:700; }
.pub-ext-info a:hover { color:var(--green); }

/* ── BOUTONS GÉNÉRAUX ── */
.btn-outline { border:2px solid var(--green); color:var(--green); padding:7px 16px; border-radius:var(--radius); font-size:13px; font-weight:600; text-decoration:none; transition:all .2s; white-space:nowrap; display:inline-block; }
.btn-outline:hover { background:var(--green); color:#fff; }
.btn-fill { background:var(--red); color:#fff; padding:7px 16px; border-radius:var(--radius); font-size:13px; font-weight:600; text-decoration:none; border:2px solid var(--red); transition:all .2s; white-space:nowrap; display:inline-block; }
.btn-fill:hover { background:#a0001f; border-color:#a0001f; }
.btn-outline-sm { border:1.5px solid var(--green); color:var(--green); padding:5px 12px; border-radius:6px; font-size:12px; font-weight:600; text-decoration:none; transition:all .2s; }
.btn-outline-sm:hover { background:var(--green); color:#fff; }

/* ── MODAL CONTACT ── */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:1000; display:flex; align-items:center; justify-content:center; padding:16px; }
.modal-box { background:#fff; border-radius:14px; padding:28px; max-width:460px; width:100%; max-height:90vh; overflow-y:auto; position:relative; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.modal-close { position:absolute; top:14px; right:14px; background:var(--light); border:none; width:30px; height:30px; border-radius:50%; font-size:14px; cursor:pointer; color:var(--mid); font-weight:700; }
.modal-close:hover { background:var(--red); color:#fff; }
.form-group { margin-bottom:14px; }
.form-group label { display:block; font-size:12px; font-weight:600; margin-bottom:5px; }
.form-group input,.form-group textarea,.form-group select { width:100%; padding:10px 12px; border:1.5px solid var(--border); border-radius:var(--radius); font-size:13px; font-family:'DM Sans',sans-serif; outline:none; transition:border-color .2s; }
.form-group input:focus,.form-group textarea:focus { border-color:var(--green); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.btn-submit { width:100%; padding:12px; background:var(--green); color:#fff; border:none; border-radius:var(--radius); font-size:14px; font-weight:700; cursor:pointer; font-family:'DM Sans',sans-serif; transition:background .2s; }
.btn-submit:hover { background:var(--red); }

/* ── AD POPUP ── */
.ad-popup { position:fixed; bottom:24px; right:24px; z-index:900; max-width:300px; width:100%; }
.ad-popup-inner { background:#fff; border:2px solid var(--gold2); border-radius:14px; box-shadow:0 8px 32px rgba(0,0,0,.2); overflow:hidden; animation:slideUp .3s ease; }
@keyframes slideUp { from{transform:translateY(30px);opacity:0} to{transform:translateY(0);opacity:1} }
.ad-popup-bar { background:var(--light); padding:7px 12px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--border); }

/* ── TOAST ── */
.toast { position:fixed; bottom:80px; left:50%; transform:translateX(-50%) translateY(20px); background:var(--green); color:#fff; padding:12px 28px; border-radius:50px; font-size:13px; font-weight:600; z-index:9999; opacity:0; transition:all .3s; pointer-events:none; white-space:nowrap; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ── FOOTER ── */
footer { background:#050d05; color:rgba(255,255,255,.6); padding:48px 24px 20px; margin-top:20px; }
.footer-stripe { max-width:1400px; margin:0 auto 36px; height:4px; background:linear-gradient(to right,var(--red) 20%,var(--green) 20%,var(--green) 80%,var(--red) 80%); }
.footer-grid { max-width:1400px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; margin-bottom:36px; }
.footer-brand .logo { font-size:24px; color:#fff; }
.footer-brand p { font-size:13px; margin-top:10px; line-height:1.7; }
.footer-mr { font-size:11px; margin-top:12px; background:rgba(255,255,255,.05); padding:8px 12px; border-radius:8px; border:1px solid rgba(255,255,255,.08); }
.footer-col h4 { font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:800; color:#fff; margin-bottom:12px; letter-spacing:.3px; }
.footer-col a { display:block; color:rgba(255,255,255,.5); font-size:12px; margin-bottom:7px; transition:color .2s; }
.footer-col a:hover { color:var(--gold); }
.footer-bottom { max-width:1400px; margin:0 auto; border-top:1px solid rgba(255,255,255,.08); padding-top:16px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:11px; }
.footer-bottom a { color:rgba(255,255,255,.4); margin-left:14px; transition:color .2s; }
.footer-bottom a:hover { color:var(--gold); }

/* ── PAGES INTERNES ── */
.page-hero { padding:48px 24px; text-align:center; }
.page-hero h1 { font-family:'Barlow Condensed',sans-serif; font-size:clamp(24px,4vw,42px); font-weight:800; margin-bottom:12px; letter-spacing:.3px; }
.section-inner { max-width:1400px; margin:0 auto; }
.appels-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:20px; }
.appel-card { border:1.5px solid var(--border); border-radius:var(--radius); padding:20px; background:#fff; transition:all .2s; }
.appel-card:hover { border-color:var(--red); box-shadow:var(--shadow); transform:translateY(-2px); }
.appel-header { display:flex; gap:8px; margin-bottom:10px; }
.appel-badge { font-size:12px; font-weight:600; }
.appel-sector { background:var(--light); color:var(--mid); font-size:11px; padding:2px 8px; border-radius:4px; }
.appel-title { font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:800; margin-bottom:12px; line-height:1.3; letter-spacing:.2px; }
.appel-meta { display:flex; flex-direction:column; gap:5px; font-size:13px; color:var(--mid); margin-bottom:14px; }
.appel-footer { display:flex; gap:10px; }
.marches-table-wrap { overflow-x:auto; border-radius:var(--radius); border:1.5px solid var(--border); }
.marches-table { width:100%; border-collapse:collapse; font-size:13px; }
.marches-table th { background:var(--green); color:#fff; padding:12px 16px; text-align:left; font-weight:600; white-space:nowrap; font-family:'Barlow Condensed',sans-serif; letter-spacing:.2px; }
.marches-table td { padding:12px 16px; border-bottom:1px solid var(--border); vertical-align:middle; }
.marches-table tr:last-child td { border-bottom:none; }
.marches-table tr:hover td { background:var(--light); }
.ref-badge { background:var(--light); color:var(--green); font-size:11px; font-weight:700; padding:3px 8px; border-radius:4px; white-space:nowrap; }
.form-card { background:var(--light); border:1.5px solid var(--border); border-radius:14px; padding:28px; }
.product-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.prod-detail-img { border-radius:14px; overflow:hidden; height:360px; display:flex; align-items:center; justify-content:center; position:relative; }

/* ── PAGES LÉGALES ── */
.cgu-wrap { display:grid; grid-template-columns:220px 1fr; gap:40px; align-items:start; }
.cgu-toc { position:sticky; top:80px; background:var(--light); border:1.5px solid var(--border); border-radius:var(--radius); padding:18px; }
.cgu-toc strong { display:block; font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:800; color:var(--green); margin-bottom:10px; text-transform:uppercase; letter-spacing:.5px; }
.cgu-toc a { display:block; font-size:13px; color:var(--mid); padding:5px 0; border-bottom:1px solid var(--border); transition:color .2s; }
.cgu-toc a:last-child { border-bottom:none; }
.cgu-toc a:hover { color:var(--green); font-weight:600; }
.cgu-section { margin-bottom:36px; padding-bottom:36px; border-bottom:1px solid var(--border); scroll-margin-top:80px; }
.cgu-section:last-child { border-bottom:none; }
.cgu-section h2 { font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:800; color:var(--green); margin-bottom:12px; padding-bottom:8px; border-bottom:2px solid var(--border); letter-spacing:.3px; }
.cgu-section h3 { font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:800; color:var(--dark); margin:16px 0 8px; letter-spacing:.2px; }
.cgu-section p { font-size:14px; color:var(--mid); line-height:1.8; margin-bottom:10px; }
.cgu-section ul { padding-left:20px; margin-bottom:10px; }
.cgu-section ul li { font-size:14px; color:var(--mid); line-height:1.8; margin-bottom:5px; }
.cgu-section strong { color:var(--dark); }
.privacy-table { width:100%; border-collapse:collapse; font-size:13px; margin-bottom:12px; }
.privacy-table th { background:var(--green); color:#fff; padding:10px 14px; text-align:left; font-weight:600; }
.privacy-table td { padding:10px 14px; border-bottom:1px solid var(--border); vertical-align:top; }
.privacy-table tr:last-child td { border-bottom:none; }
.privacy-table tr:hover td { background:var(--light); }
.cookie-category { border:1.5px solid var(--border); border-radius:var(--radius); padding:16px; margin-bottom:14px; }
.cookie-category.essential { border-color:var(--green); background:rgba(0,98,51,.03); }
.cookie-category.analytics { border-color:var(--gold2); background:rgba(244,162,37,.03); }
.cookie-category.third { border-color:var(--red); background:rgba(200,0,43,.03); }
.cookie-cat-header { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.cookie-cat-icon { font-size:22px; }
.cookie-cat-header strong { display:block; font-size:14px; font-weight:700; font-family:'Barlow Condensed',sans-serif; letter-spacing:.2px; }
.cookie-status { display:inline-block; font-size:10px; font-weight:700; padding:2px 8px; border-radius:20px; margin-top:3px; }
.cookie-status.always { background:var(--green); color:#fff; }
.cookie-status.optional { background:var(--gold2); color:var(--dark); }
.cookie-table { width:100%; border-collapse:collapse; font-size:12px; margin-top:12px; }
.cookie-table th { background:var(--light); color:var(--dark); padding:8px 12px; text-align:left; font-weight:600; border-bottom:2px solid var(--border); }
.cookie-table td { padding:8px 12px; border-bottom:1px solid var(--border); }
.cookie-table tr:last-child td { border-bottom:none; }
.cookie-table code { background:var(--light); padding:2px 6px; border-radius:4px; font-size:11px; color:var(--green); border:1px solid var(--border); }

/* ══════════════════════════════════════
   RESPONSIVE — 1100px
   ══════════════════════════════════════ */
@media (max-width:1100px) {
  .body-wrap { grid-template-columns:1fr 210px; padding:16px 20px; }
  .footer-grid { grid-template-columns:1.5fr 1fr 1fr 1fr; gap:24px; }
}

/* ══════════════════════════════════════
   RESPONSIVE — 900px (tablette)
   ══════════════════════════════════════ */
@media (max-width:900px) {
  .body-wrap { grid-template-columns:1fr; padding:14px 16px; gap:16px; }
  .col-right { position:static; display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .pub1-body { grid-template-columns:1fr; }
  .pub1-item:first-child { border-right:none; border-bottom:1px solid var(--border); }
  .pricing-grid { grid-template-columns:1fr; max-width:480px; margin:0 auto; }
  .product-detail-grid { grid-template-columns:1fr; gap:20px; }
  .cgu-wrap { grid-template-columns:1fr; }
  .cgu-toc { position:static; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:20px; }
  .steps { grid-template-columns:1fr 1fr; gap:12px; }
  .appels-grid { grid-template-columns:1fr; }
}

/* ══════════════════════════════════════
   RESPONSIVE — 768px (mobile)
   ══════════════════════════════════════ */
@media (max-width:768px) {
  /* ── Empêcher tout débordement ── */
  .topbar-inner,
  .nav-inner,
  .body-wrap,
  .col-left,
  .hero,
  .trust-inner,
  .diaspora-inner { width:100%; max-width:100%; }

  /* ── Header ── */
  .topbar-inner { padding:8px 12px; gap:8px; min-height:auto; }
  .logo { font-size:21px; }
  .top-search { order:3; flex:0 0 100%; width:100%; max-width:100%; height:40px; }
  .top-search input { font-size:16px; padding:0 10px; }
  .top-search select { display:none; }
  .top-search button { padding:0 14px; font-size:13px; }
  .topbar-actions { gap:8px; }
  .topbar-actions a { font-size:11px; }
  .topbar-actions a.sell { padding:4px 8px; font-size:11px; }
  .topbar-actions a[href*="lang"] { display:none; }

  /* ── Nav ── */
  .nav-inner { padding:0; }
  .nav-inner a { padding:10px 12px; font-size:12px; }

  /* ── Hero ── */
  .hero { padding:16px 14px; }
  .hero h1 { font-size:clamp(20px,6vw,32px); line-height:1.2; }
  .hero p { font-size:13px; margin-bottom:10px; }
  .hero-crescent { display:none; }
  .hero-tag { font-size:11px; padding:3px 10px; }

  /* ── Diaspora banner ── */
  .diaspora-banner { padding:12px 14px; }
  .diaspora-inner { flex-direction:column; gap:10px; text-align:center; font-size:13px; }

  /* ── Trust ── */
  .trust { padding:10px 14px; }
  .trust-inner { gap:10px; justify-content:flex-start; }
  .trust-item { font-size:11px; }
  .trust-icon { font-size:16px; }

  /* ── Body ── */
  .body-wrap { padding:10px 12px; gap:12px; }
  .col-left { gap:12px; }
  .col-right { display:none; }

  /* ── Sections ── */
  .section-title { font-size:20px; }
  .section-header-row { flex-direction:column; align-items:flex-start; gap:6px; }
  .section-sub { font-size:12px; margin-bottom:10px; }

  /* ── Tabs ── */
  .tabs { overflow-x:auto; flex-wrap:nowrap; padding-bottom:2px; gap:5px; }
  .tabs::-webkit-scrollbar { display:none; }
  .tab { padding:5px 12px; font-size:11px; white-space:nowrap; flex-shrink:0; }

  /* ── Products ── */
  .products-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
  .prod-img { height:80px; }
  .prod-emoji { font-size:28px; }
  .prod-name { font-size:12px; }
  .prod-body { padding:7px; }
  .prod-price { font-size:12px; }
  .prod-tag { font-size:8px; }
  .prod-footer { gap:4px; }
  .btn-contact { font-size:10px; padding:5px 3px; }
  .btn-contact-prod { font-size:10px; padding:5px 3px; }

  /* ── Categories ── */
  .cat-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
  .cat-card { padding:10px; gap:8px; }
  .cat-icon { width:32px; height:32px; font-size:15px; flex-shrink:0; }
  .cat-info strong { font-size:11px; }
  .cat-info span { font-size:10px; }

  /* ── Pub 1 ── */
  .pub1-body { grid-template-columns:1fr; }
  .pub1-item:first-child { border-right:none; border-bottom:1px solid var(--border); }

  /* ── Pub 2 ── */
  .pub2-slide { padding:14px; gap:12px; }
  .pub2-img { width:72px; height:60px; font-size:28px; }
  .pub2-content strong { font-size:15px; }
  .pub2-content p { font-size:11px; }

  /* ── Wilayas ── */
  .cities-grid { grid-template-columns:repeat(3,1fr); gap:6px; }
  .city-card { padding:8px 6px; }
  .city-icon { font-size:20px; }
  .city-name { font-size:10px; }

  /* ── How it works ── */
  .how { padding:16px 12px; border-radius:10px; }
  .steps { grid-template-columns:1fr; gap:8px; }
  .step { padding:14px 12px; }
  .step-num { width:40px; height:40px; font-size:18px; margin-bottom:10px; }
  .step h3 { font-size:15px; }
  .step p { font-size:12px; }

  /* ── Pricing ── */
  .pricing-section { padding:16px 12px; border-radius:10px; }
  .pricing-grid { grid-template-columns:1fr; max-width:100%; gap:16px; }
  .pricing-card { padding:16px 14px; }
  .pricing-price { font-size:28px; }

  /* ── Diaspora ── */
  .intl-grid { grid-template-columns:repeat(3,1fr); gap:6px; }
  .intl-card { padding:10px 6px; }
  .intl-flag { font-size:22px; }
  .intl-name { font-size:10px; }
  .intl-count { font-size:9px; }

  /* ── Footer compact ── */
  footer { padding:20px 14px 12px; margin-top:8px; }
  .footer-stripe { height:3px; margin-bottom:16px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:16px 20px; margin-bottom:16px; }
  .footer-brand { grid-column:1 / -1; margin-bottom:4px; }
  .footer-brand .logo { font-size:20px; }
  .footer-brand p { font-size:11px; margin-top:6px; display:none; }
  .footer-mr { display:none; }
  .footer-col h4 { font-size:12px; margin-bottom:8px; }
  .footer-col a { font-size:11px; margin-bottom:5px; }
  .footer-bottom { flex-direction:column; align-items:center; gap:5px; font-size:10px; padding-top:12px; }
  .footer-bottom > div { display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
  .footer-bottom a { margin-left:0; }

  /* ── Forms ── */
  .form-row { grid-template-columns:1fr; }
  .form-card { padding:16px 14px; border-radius:10px; }
  .form-group input,.form-group textarea,.form-group select { font-size:16px; } /* évite zoom iOS */
  .btn-submit { padding:13px; font-size:14px; }

  /* ── Modal ── */
  .modal-overlay { padding:0; align-items:flex-end; }
  .modal-box { border-radius:16px 16px 0 0; padding:20px 14px; max-height:90vh; }

  /* ── Ad popup ── */
  .ad-popup { bottom:0; right:0; left:0; max-width:100%; }
  .ad-popup-inner { border-radius:14px 14px 0 0; border-left:none; border-right:none; border-bottom:none; }

  /* ── Tables ── */
  .marches-table-wrap { font-size:12px; }
  .marches-table th,.marches-table td { padding:8px 8px; white-space:nowrap; }

  /* ── Pages légales ── */
  .cgu-wrap { grid-template-columns:1fr; }
  .cgu-toc { position:static; }
  .cgu-section h2 { font-size:17px; }
  .cgu-section p,.cgu-section li { font-size:13px; }

  /* ── Boutons ── */
  .btn-fill,.btn-outline { padding:9px 16px; font-size:13px; }
  .btn-outline-sm { padding:5px 10px; font-size:11px; }
}

/* ══════════════════════════════════════
   RESPONSIVE — 480px (petit mobile)
   ══════════════════════════════════════ */
@media (max-width:480px) {
  .logo { font-size:19px; }
  .topbar-actions a.sell { font-size:10px; padding:3px 7px; }

  .hero { padding:14px 12px; }
  .hero h1 { font-size:clamp(18px,7vw,26px); }
  .hero-badge { font-size:10px; padding:3px 10px; }
  .hero-tag { font-size:10px; padding:3px 8px; }

  .products-grid { grid-template-columns:repeat(2,1fr); gap:6px; }

  .cat-grid { grid-template-columns:repeat(2,1fr); gap:6px; }

  .intl-grid { grid-template-columns:repeat(2,1fr); }
  .cities-grid { grid-template-columns:repeat(2,1fr); }

  .pub2-slide { flex-direction:column; text-align:center; gap:8px; padding:12px; }
  .pub2-img { width:60px; height:50px; margin:0 auto; }

  .pricing-price { font-size:26px; }

  .toast { width:94%; white-space:normal; text-align:center; font-size:12px; }

  footer { padding:16px 12px 10px; }
  .footer-grid { grid-template-columns:1fr; gap:12px; }
  .footer-brand { margin-bottom:2px; }
  .footer-col h4 { font-size:12px; }
  .footer-col a { font-size:10px; margin-bottom:3px; }
}