{"id":14126,"date":"2026-06-29T13:46:55","date_gmt":"2026-06-29T11:46:55","guid":{"rendered":"https:\/\/www.discountetqualite.fr\/blog\/?page_id=14126"},"modified":"2026-07-07T11:46:18","modified_gmt":"2026-07-07T09:46:18","slug":"accompagnement-pro","status":"publish","type":"page","link":"https:\/\/www.discountetqualite.fr\/blog\/accompagnement-pro\/","title":{"rendered":""},"content":{"rendered":"\n<style>\n  \/* Masquer le header + supprimer les espaces r\u00e9serv\u00e9s du th\u00e8me sur la page pro *\/\n\n  body:has(#dqpro-page) header,\n  body:has(#dqpro-page) #header,\n  body:has(#dqpro-page) #masthead,\n  body:has(#dqpro-page) .site-header,\n  body:has(#dqpro-page) .main-header,\n  body:has(#dqpro-page) .td-header-wrap,\n  body:has(#dqpro-page) .tdc-header-wrap,\n  body:has(#dqpro-page) .elementor-location-header,\n  body:has(#dqpro-page) .wp-block-template-part,\n  body:has(#dqpro-page) .page-header,\n  body:has(#dqpro-page) .entry-header,\n  body:has(#dqpro-page) .post-header,\n  body:has(#dqpro-page) .hero-header,\n  body:has(#dqpro-page) .blog-header {\n    display: none !important;\n    height: 0 !important;\n    min-height: 0 !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    overflow: hidden !important;\n  }\n\n  body:has(#dqpro-page),\n  body:has(#dqpro-page) #page,\n  body:has(#dqpro-page) .site,\n  body:has(#dqpro-page) .site-content,\n  body:has(#dqpro-page) .content-area,\n  body:has(#dqpro-page) #content,\n  body:has(#dqpro-page) #primary,\n  body:has(#dqpro-page) main,\n  body:has(#dqpro-page) article,\n  body:has(#dqpro-page) .entry-content,\n  body:has(#dqpro-page) .wp-block-post-content {\n    margin-top: 0 !important;\n    padding-top: 0 !important;\n  }\n\n  body:has(#dqpro-page) .dqpro {\n    margin-top: 0 !important;\n  }\n\n  body:has(#dqpro-page) .dqpro-inner {\n    padding-top: 16px !important;\n  }\n<\/style>\n\n\n\n<style>\n  \/* =========================================================\n     DISCOUNT&QUALIT\u00c9 \u2014 PAGE PRO FINALE (100% MOBILE FRIENDLY)\n     ========================================================= *\/\n\n  .dqpro {\n    \/* Variables de marque & UI *\/\n    --black: #111827; \n    --text: #374151;\n    --muted: #6b7280;\n    --white: #ffffff;\n    --bg: #f9fafb;\n    --border: #e5e7eb;\n\n    --green: #BCCF01;\n    --green-dark: #8c9a00;\n    --orange: #E65816;\n    --violet: #6C1246;\n    --blue: #84C9EA;\n    --red: #ef4444;\n\n    --violet-soft: rgba(108, 18, 70, 0.08);\n    --orange-soft: rgba(230, 88, 22, 0.10);\n    --blue-soft: rgba(132, 201, 234, 0.15);\n    --green-soft: rgba(188, 207, 1, 0.20);\n    --green-flash: rgba(188, 207, 1, 0.35);\n\n    --radius-xl: clamp(20px, 4vw, 32px);\n    --radius-lg: clamp(16px, 3vw, 24px);\n    --radius-md: 16px;\n\n    --shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.05);\n    --shadow-soft: 0 20px 40px -15px rgba(0, 0, 0, 0.05);\n    --shadow-card: 0 25px 50px -12px rgba(0, 0, 0, 0.12);\n    --shadow-dark: 0 30px 60px -10px rgba(17, 24, 39, 0.3);\n\n    \/* Hack WP pleine largeur S\u00c9CURIS\u00c9 (anti-d\u00e9bordement droite) *\/\n    width: 100vw !important;\n    max-width: 100vw !important;\n    margin-left: calc(50% - 50vw) !important;\n    margin-right: calc(50% - 50vw) !important;\n    box-sizing: border-box;\n    overflow-x: hidden; \/* Coupe tout ce qui tente de sortir *\/\n    \n    background: \n      radial-gradient(circle at 10% 0%, var(--green-soft), transparent 25%),\n      radial-gradient(circle at 90% 10%, var(--blue-soft), transparent 25%),\n      radial-gradient(circle at 10% 60%, var(--violet-soft), transparent 25%),\n      #ffffff;\n    font-family: \"Poppins\", system-ui, -apple-system, sans-serif;\n    color: var(--text);\n    line-height: 1.6;\n    -webkit-font-smoothing: antialiased;\n  }\n\n  .dqpro *, .dqpro *::before, .dqpro *::after { box-sizing: border-box; }\n  .dqpro svg { flex-shrink: 0; display: inline-block; vertical-align: middle; }\n  .dqpro p, .dqpro h1, .dqpro h2, .dqpro h3, .dqpro span { word-wrap: break-word; overflow-wrap: break-word; }\n\n  .dqpro-container { width: 100%; max-width: 1200px; margin-inline: auto; padding: clamp(40px, 6vw, 80px) 20px; box-sizing: border-box; }\n  .dqpro-stack { display: grid; gap: clamp(24px, 5vw, 40px); }\n\n  \/* Animations *\/\n  @keyframes dqproFadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }\n  @keyframes dqproPulse { 0% { box-shadow: 0 0 0 0 rgba(188, 207, 1, 0.6); } 70% { box-shadow: 0 0 0 10px rgba(188, 207, 1, 0); } 100% { box-shadow: 0 0 0 0 rgba(188, 207, 1, 0); } }\n  @keyframes dqproSpin { 100% { transform: rotate(360deg); } }\n  @keyframes dqproToastSlide { 0% { transform: translate(-50%, 100px); opacity: 0; } 10% { transform: translate(-50%, 0); opacity: 1; } 90% { transform: translate(-50%, 0); opacity: 1; } 100% { transform: translate(-50%, 100px); opacity: 0; } }\n\n  \/* Panels *\/\n  .dqpro-panel {\n    position: relative; border-radius: var(--radius-xl); background: #ffffff;\n    border: 1px solid var(--border); box-shadow: var(--shadow-soft); overflow: hidden;\n    animation: dqproFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;\n  }\n  .dqpro-panel::before {\n    content: \"\"; position: absolute; top: 0; left: clamp(16px, 4vw, 40px); right: clamp(16px, 4vw, 40px); height: 4px; border-radius: 0 0 8px 8px;\n    background: linear-gradient(90deg, var(--green), var(--orange), var(--violet), var(--blue));\n  }\n  .dqpro-panel-pad { padding: clamp(24px, 5vw, 64px) clamp(16px, 4vw, 64px); }\n\n  \/* Typo & Kickers *\/\n  .dqpro-title {\n    margin: 0; color: var(--black);\n    font-size: clamp(26px, 6vw, 44px); line-height: 1.15; font-weight: 800; letter-spacing: -0.03em;\n  }\n  .dqpro-title span { color: var(--violet); }\n  .dqpro-text { margin: 16px 0 0; font-size: clamp(15px, 2.5vw, 17px); }\n  .dqpro-text strong { color: var(--black); font-weight: 700; }\n  .dqpro-call-direct {\n    display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px;\n    margin-top: 14px; padding: 10px 14px; border-radius: 999px;\n    background: var(--orange-soft); color: var(--black);\n    font-size: clamp(14px, 2.4vw, 16px); line-height: 1.25; font-weight: 650;\n  }\n  .dqpro-call-direct a {\n    display: inline-flex; align-items: center; gap: 7px;\n    padding: 8px 12px; border-radius: 999px; background: var(--orange);\n    color: #fff !important; font-weight: 900; text-decoration: none; white-space: nowrap;\n    box-shadow: 0 10px 20px rgba(230, 88, 22, 0.18);\n  }\n\n  .dqpro-kicker {\n    display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 6px 14px;\n    border-radius: 999px; background: var(--violet-soft); color: var(--violet);\n    font-size: 12px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase;\n  }\n  .dqpro-kicker--dark { background: var(--black); color: var(--white); }\n  .dqpro-kicker--orange { background: var(--orange-soft); color: var(--orange); }\n  .dqpro-kicker--green { background: var(--green-soft); color: var(--black); }\n  .dqpro-kicker__dots { display: inline-flex; gap: 4px; }\n  .dqpro-kicker__dots span { width: 8px; height: 8px; border-radius: 50%; }\n  .dqpro-kicker__dots span:nth-child(1) { background: var(--green); }\n  .dqpro-kicker__dots span:nth-child(2) { background: var(--orange); }\n  .dqpro-kicker__dots span:nth-child(3) { background: var(--blue); }\n\n  \/* Buttons *\/\n  .dqpro-btn {\n    display: inline-flex; align-items: center; justify-content: center; gap: 8px;\n    min-height: 56px; padding: 12px 28px; border-radius: 999px; border: 1px solid transparent;\n    font-family: inherit; font-size: 15px; font-weight: 700; cursor: pointer; text-decoration: none;\n    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); text-align: center; line-height: 1.2;\n  }\n  .dqpro-btn:hover { transform: translateY(-2px); }\n  .dqpro-btn:active { transform: translateY(0); }\n  .dqpro-btn--orange { background: var(--orange); color: #ffffff !important; box-shadow: 0 10px 25px rgba(230, 88, 22, 0.3); }\n  .dqpro-btn--orange:hover { box-shadow: 0 15px 35px rgba(230, 88, 22, 0.4); }\n  .dqpro-btn--white { background: #ffffff; color: var(--violet) !important; border-color: var(--border); box-shadow: var(--shadow-sm); }\n  .dqpro-btn--white:hover { border-color: var(--violet); }\n  .dqpro-btn--outline { background: transparent; color: var(--black) !important; border: 1px solid var(--border); }\n  .dqpro-btn--outline:hover { border-color: var(--black); background: var(--bg); }\n  .dqpro-btn.is-disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }\n\n  \/* =========================\n     HERO & STATUS\n     ========================= *\/\n  .dqpro-hero {\n    position: relative; padding: clamp(32px, 6vw, 80px) clamp(16px, 5vw, 80px); border-radius: var(--radius-xl);\n    background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%); border: 1px solid var(--border); box-shadow: var(--shadow-soft); overflow: hidden;\n  }\n  .dqpro-hero::after {\n    content: \"\"; position: absolute; left: clamp(16px, 4vw, 40px); right: clamp(16px, 4vw, 40px); bottom: 0; height: 6px; border-radius: 8px 8px 0 0;\n    background: linear-gradient(90deg, var(--green) 0 25%, var(--orange) 25% 50%, var(--violet) 50% 75%, var(--blue) 75% 100%);\n  }\n  .dqpro-hero__grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(32px, 5vw, 80px); align-items: center; }\n  \n  .dqpro-hero__title {\n    margin: 0; color: var(--black);\n    font-size: clamp(28px, 6vw, 56px); line-height: 1.1; font-weight: 900; letter-spacing: -0.04em;\n  }\n  .dqpro-hero__title span {\n    background: linear-gradient(135deg, var(--violet), var(--orange));\n    -webkit-background-clip: text; -webkit-text-fill-color: transparent;\n    display: inline; padding-right: 4px;\n  }\n  .dqpro-hero__lead { margin: 24px 0 0; font-size: clamp(15px, 2vw, 19px); }\n  .dqpro-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; width: 100%; }\n  \n  \/* Status En direct *\/\n  .dqpro-live-status {\n    display: flex; align-items: flex-start; gap: 16px; margin-top: 32px; padding: 20px;\n    border-radius: var(--radius-lg); background: #ffffff; border: 1px solid var(--border); box-shadow: var(--shadow-sm); transition: all 0.3s ease;\n  }\n  .dqpro-live-status__icon {\n    flex: 0 0 48px; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;\n    border-radius: var(--radius-md); transition: all 0.3s;\n  }\n  \n  .dqpro-live-status.is-loading { border-color: var(--blue-soft); }\n  .dqpro-live-status.is-loading .dqpro-live-status__icon { background: var(--blue-soft); color: var(--blue); }\n  .dqpro-spinner { animation: dqproSpin 1s linear infinite; }\n  \n  .dqpro-live-status.is-open { border-color: rgba(188, 207, 1, 0.4); }\n  .dqpro-live-status.is-open .dqpro-live-status__icon { background: var(--green); color: var(--black); animation: dqproPulse 2s infinite; }\n  .dqpro-live-status.is-closed { background: #fafafa; border-color: rgba(230, 88, 22, 0.2); }\n  .dqpro-live-status.is-closed .dqpro-live-status__icon { background: var(--orange); color: #fff; }\n\n  .dqpro-live-status__content { width: 100%; min-width: 0; \/* MAGIC FIX OVERFLOW FLEXBOX *\/ }\n  .dqpro-live-status__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }\n  .dqpro-live-status__top strong { color: var(--black); font-size: 16px; font-weight: 700; }\n  .dqpro-live-status__top span { padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }\n  \n  .dqpro-live-status.is-open .dqpro-live-status__top span { background: var(--green-soft); color: var(--black); }\n  .dqpro-live-status.is-closed .dqpro-live-status__top span { background: var(--orange-soft); color: var(--orange); }\n  .dqpro-live-status p { margin: 6px 0 0; font-size: 14px; color: var(--muted); }\n  \n  .dqpro-live-agents {\n    display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;\n    padding: 6px 12px; border-radius: 8px; background: rgba(188, 207, 1, 0.1);\n    font-size: 13px; font-weight: 600; color: var(--green-dark); flex-wrap: wrap;\n  }\n  .dqpro-live-agents::before { content: \"\"; width: 8px; height: 8px; border-radius: 50%; background: var(--green-dark); animation: dqproPulse 2s infinite; flex-shrink: 0;}\n  .dqpro-live-agents strong { color: var(--black); font-weight: 800; margin-inline: 4px;}\n\n  \/* =========================\n     CLUB CARD & ALIGNEMENT GRILLE\n     ========================= *\/\n  .dqpro-club {\n    position: relative; padding: clamp(24px, 5vw, 40px) clamp(16px, 4vw, 32px); border-radius: var(--radius-xl);\n    background: linear-gradient(145deg, var(--black) 0%, #1f2937 100%); color: #fff; box-shadow: var(--shadow-dark);\n  }\n  .dqpro-club::before {\n    content: \"\"; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;\n    background: radial-gradient(circle at top right, rgba(132, 201, 234, 0.15), transparent 50%);\n  }\n  .dqpro-club__top { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }\n  .dqpro-chip { padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.1); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }\n  .dqpro-status { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: rgba(188, 207, 1, 0.15); font-size: 12px; font-weight: 700; }\n  .dqpro-status::before { content: \"\"; width: 8px; height: 8px; border-radius: 50%; background: var(--green); animation: dqproPulse 2s infinite; flex-shrink: 0; }\n  .dqpro-club__content { position: relative; z-index: 2; margin-top: clamp(24px, 5vw, 48px); }\n  .dqpro-club__content h2 { margin: 0; font-size: clamp(24px, 4vw, 32px); font-weight: 800; line-height: 1.15; letter-spacing: -0.03em; color: #fff; }\n  .dqpro-club__content p { margin: 16px 0 0; color: rgba(255,255,255,0.8); font-size: clamp(14px, 2vw, 15px); }\n  \n  \/* Grille Avantages ultra-robuste *\/\n  .dqpro-club__benefits {\n    position: relative; z-index: 2; display: grid; \n    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); \n    gap: 12px; margin-top: 32px; align-items: stretch; \n  }\n  .dqpro-club__benefit {\n    padding: 16px; border-radius: var(--radius-md); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);\n    display: flex; flex-direction: column; \n  }\n  .dqpro-club__benefit strong {\n    display: flex; align-items: center; gap: 8px;\n    font-size: 14px; font-weight: 700; color: #fff; line-height: 1.25;\n  }\n  .dqpro-club__benefit strong span { flex-shrink: 0; font-size: 16px; }\n  .dqpro-club__benefit-text { \n    flex-grow: 1; display: block; margin-top: 8px; font-size: 13px; color: rgba(255,255,255,0.7); line-height: 1.4; \n    transition: opacity 0.3s ease, transform 0.3s ease; opacity: 1; transform: translateY(0);\n  }\n  .dqpro-club__benefit-text.is-switching { opacity: 0; transform: translateY(-4px); }\n  \n  \/* Ligne directe Fix Overflow *\/\n  .dqpro-phone-card {\n    position: relative; z-index: 2; display: flex; align-items: center; gap: 16px; margin-top: 24px; padding: 16px;\n    border-radius: var(--radius-lg); background: #ffffff; color: var(--black);\n  }\n  .dqpro-phone-card__icon { flex-shrink: 0; width: 48px; height: 48px; border-radius: var(--radius-md); background: var(--orange-soft); color: var(--orange); display: flex; align-items: center; justify-content: center; }\n  .dqpro-phone-card > div { min-width: 0; \/* MAGIC FIX OVERFLOW FLEXBOX *\/ flex-grow: 1; }\n  .dqpro-phone-card p { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.3; }\n  .dqpro-phone-card strong { display: block; font-size: clamp(18px, 4vw, 22px); font-weight: 800; color: var(--black); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}\n\n  \/* =========================\n     SERVICES\n     ========================= *\/\n  .dqpro-section-head { display: grid; grid-template-columns: 1fr minmax(280px, 450px); gap: clamp(16px, 4vw, 40px); align-items: end; margin-bottom: clamp(24px, 5vw, 48px); }\n  .dqpro-services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }\n  .dqpro-service { position: relative; padding: 24px 20px; border-radius: var(--radius-lg); background: #ffffff; border: 1px solid var(--border); box-shadow: var(--shadow-sm); overflow: hidden; transition: all 0.3s ease; }\n  .dqpro-service:hover { transform: translateY(-6px); box-shadow: var(--shadow-card); border-color: var(--violet-soft); }\n  .dqpro-service::before { content: \"\"; position: absolute; width: 120px; height: 120px; right: -40px; top: -40px; border-radius: 50%; opacity: 0.5; }\n  .dqpro-service:nth-child(1):before { background: var(--violet-soft); }\n  .dqpro-service:nth-child(2):before { background: var(--orange-soft); }\n  .dqpro-service:nth-child(3):before { background: var(--blue-soft); }\n  .dqpro-service:nth-child(4):before { background: var(--green-soft); }\n  .dqpro-service__icon { position: relative; z-index: 2; width: 48px; height: 48px; margin-bottom: 20px; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; }\n  .dqpro-service:nth-child(1) .dqpro-service__icon { background: var(--violet); color: #fff; box-shadow: 0 8px 16px rgba(108,18,70,0.2); }\n  .dqpro-service:nth-child(2) .dqpro-service__icon { background: var(--orange); color: #fff; box-shadow: 0 8px 16px rgba(230,88,22,0.2); }\n  .dqpro-service:nth-child(3) .dqpro-service__icon { background: var(--blue); color: #000; box-shadow: 0 8px 16px rgba(132,201,234,0.3); }\n  .dqpro-service:nth-child(4) .dqpro-service__icon { background: var(--green); color: #000; box-shadow: 0 8px 16px rgba(188,207,1,0.3); }\n  .dqpro-service__title { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -0.02em; color: var(--black); }\n  .dqpro-service__text { margin: 8px 0 0; font-size: 14px; color: var(--muted); }\n\n  \/* =========================\n     FORMULAIRE UX PREMIUM\n     ========================= *\/\n  .dqpro-prep-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 32px; align-items: start; }\n  .dqpro-form-list { display: grid; gap: 16px; }\n\n  .dqpro-form-group-label {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    width: fit-content;\n    margin: 6px 0 0;\n    padding: 7px 12px;\n    border-radius: 999px;\n    background: var(--violet-soft);\n    color: var(--violet);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: 0.04em;\n    text-transform: uppercase;\n  }\n\n  .dqpro-form-group-label::before {\n    content: \"\";\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background: currentColor;\n    flex-shrink: 0;\n  }\n  .dqpro-field {\n    display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 20px; border-radius: var(--radius-lg);\n    background: #ffffff; border: 1px solid var(--border); box-shadow: 0 2px 4px rgba(0,0,0,0.02); transition: all 0.3s ease;\n  }\n  .dqpro-field:focus-within { border-color: var(--violet); box-shadow: 0 0 0 4px var(--violet-soft), var(--shadow-sm); }\n  .dqpro-field.is-error { border-color: var(--red); box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1); }\n  .dqpro-field.is-filled { border-color: var(--green-dark); background: #fdfdfc; }\n  \n  .dqpro-field__number {\n    width: 48px; height: 48px; border-radius: var(--radius-md); background: var(--bg); color: var(--muted);\n    display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 800; transition: all 0.3s;\n  }\n  .dqpro-field:focus-within .dqpro-field__number { background: var(--violet-soft); color: var(--violet); }\n  .dqpro-field.is-filled .dqpro-field__number { background: var(--green); color: var(--black); }\n\n  .dqpro-field__header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }\n  .dqpro-field__label { font-size: 16px; font-weight: 700; color: var(--black); }\n  .dqpro-field__check { color: var(--green-dark); opacity: 0; transform: scale(0); transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }\n  .dqpro-field.is-filled .dqpro-field__check { opacity: 1; transform: scale(1); }\n\n  .dqpro-required { padding: 2px 8px; border-radius: 999px; background: rgba(239, 68, 68, 0.1); color: var(--red); font-size: 10px; font-weight: 800; text-transform: uppercase; }\n  .dqpro-optional { padding: 2px 8px; border-radius: 999px; background: var(--bg); color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }\n  .dqpro-field__hint { display: block; margin-top: 4px; font-size: 13px; color: var(--muted); line-height: 1.4;}\n  \n  .dqpro-field textarea {\n    width: 100%; min-height: 60px; margin-top: 16px; padding: 14px 16px; border-radius: var(--radius-md);\n    border: 1px solid var(--border); background: var(--bg); font-family: inherit; font-size: 15px; color: var(--black);\n    resize: none; overflow: hidden; outline: none; transition: background 0.2s, border-color 0.2s; line-height: 1.5;\n  }\n  .dqpro-field textarea:focus { background: #fff; border-color: var(--violet); }\n  .dqpro-error { display: none; margin-top: 8px; font-size: 13px; color: var(--red); font-weight: 600; }\n  .dqpro-field.is-error .dqpro-error { display: block; }\n\n  \/* Memo & Progress *\/\n  .dqpro-memo {\n    position: sticky; top: 32px; padding: clamp(24px, 5vw, 40px) clamp(16px, 4vw, 32px); border-radius: var(--radius-xl);\n    background: var(--black); color: #fff; box-shadow: var(--shadow-card); overflow: hidden;\n  }\n  .dqpro-memo::before { content: \"\"; position: absolute; inset: 0; background: radial-gradient(circle at top right, rgba(132, 201, 234, 0.1), transparent 70%); pointer-events: none; }\n\n  \/* Sticky r\u00e9capitulatif desktop : suit le scroll jusqu'\u00e0 la fin du formulaire *\/\n  @media (min-width: 1051px) {\n    .dqpro-panel--prep,\n    .dqpro-panel--prep .dqpro-panel-pad {\n      overflow: visible;\n    }\n\n    .dqpro-panel--prep .dqpro-memo {\n      position: sticky;\n      top: 24px;\n      align-self: start;\n      max-height: calc(100vh - 48px);\n      overflow-y: auto;\n      overflow-x: hidden;\n      scrollbar-width: thin;\n      scrollbar-color: rgba(255,255,255,0.28) rgba(255,255,255,0.08);\n    }\n\n    .dqpro-panel--prep .dqpro-memo::-webkit-scrollbar {\n      width: 6px;\n    }\n\n    .dqpro-panel--prep .dqpro-memo::-webkit-scrollbar-track {\n      background: rgba(255,255,255,0.08);\n      border-radius: 999px;\n    }\n\n    .dqpro-panel--prep .dqpro-memo::-webkit-scrollbar-thumb {\n      background: rgba(255,255,255,0.28);\n      border-radius: 999px;\n    }\n  }\n\n  \n  .dqpro-progress { margin-top: 16px; margin-bottom: 24px; }\n  .dqpro-progress__text { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 8px; }\n  .dqpro-progress__bar { height: 6px; background: rgba(255,255,255,0.1); border-radius: 999px; overflow: hidden; }\n  .dqpro-progress__fill { height: 100%; background: var(--green); width: 0%; transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1); border-radius: 999px; box-shadow: var(--shadow-green); }\n\n  .dqpro-memo__title { margin: 0; font-size: clamp(20px, 4vw, 24px); font-weight: 800; line-height: 1.2; color: #fff; }\n  .dqpro-summary { margin-top: 24px; padding: 16px; border-radius: var(--radius-md); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); }\n  .dqpro-summary ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }\n  .dqpro-summary li { font-size: 14px; color: rgba(255,255,255,0.8); transition: background-color 0.4s; border-radius: 4px; padding: 2px 4px; margin: -2px -4px; overflow-wrap: break-word;}\n  .dqpro-summary strong { color: #fff; display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 2px; opacity: 0.7;}\n  \n  .dqpro-memo-actions { display: grid; gap: 12px; margin-top: 32px; }\n  \n  \/* Toast Notification *\/\n  .dqpro-toast-container { position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%); z-index: 9999; pointer-events: none; display: flex; flex-direction: column; gap: 12px; width: max-content; max-width: 90vw; }\n  .dqpro-toast { background: var(--black); color: #fff; padding: 12px 24px; border-radius: 999px; font-size: 14px; font-weight: 700; box-shadow: var(--shadow-card); display: flex; align-items: center; gap: 8px; animation: dqproToastSlide 3s cubic-bezier(0.16, 1, 0.3, 1) forwards; }\n  .dqpro-toast svg { color: var(--green); flex-shrink: 0; }\n  .dqpro-toast.is-error svg { color: var(--red); }\n\n  \/* =========================\n     REVIEWS (GRILLE SUPERPOS\u00c9E ANTI-OVERFLOW)\n     ========================= *\/\n  .dqpro-reviews-grid { display: grid; grid-template-columns: 320px 1fr; gap: 24px; }\n  .dqpro-rating { padding: clamp(24px, 5vw, 40px) 24px; border-radius: var(--radius-xl); background: #fff; border: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; text-align: center; align-items: center; }\n  .dqpro-rating__score { margin: 24px 0 0; font-size: clamp(60px, 8vw, 80px); font-weight: 800; line-height: 1; color: var(--black); letter-spacing: -0.05em; }\n  .dqpro-rating__score span { color: var(--green); font-size: 0.7em; }\n  .dqpro-rating__based { margin: 12px 0 0; font-size: 15px; color: var(--muted); }\n  \n  .dqpro-rating__stars { width: 140px; max-width: 100%; height: auto; object-fit: contain; margin: 24px auto 0; display: block; }\n  .dqpro-rating__logo { width: 150px; max-width: 100%; height: auto; object-fit: contain; margin: 24px auto 0; display: block; }\n\n  \/* Superposition Grid pour adapter la hauteur au plus grand avis *\/\n  .dqpro-review-panel { position: relative; border-radius: var(--radius-xl); background: linear-gradient(145deg, var(--black) 0%, #1f2937 100%); overflow: hidden; box-shadow: var(--shadow-card); display: flex; flex-direction: column; }\n  .dqpro-review-wrapper { display: grid; flex-grow: 1; }\n  \n  .dqpro-review { \n    grid-area: 1 \/ 1; \n    padding: clamp(24px, 5vw, 64px); display: flex; flex-direction: column; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(10px); transition: all 0.4s ease; \n  }\n  .dqpro-review.is-active { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }\n  \n  .dqpro-review__tag { align-self: flex-start; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,0.1); font-size: 11px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: auto;}\n  .dqpro-review__text { font-size: clamp(18px, 3vw, 32px); font-weight: 800; line-height: 1.35; color: #fff; letter-spacing: -0.02em; margin: 32px 0; }\n  .dqpro-review__text span { color: var(--green); }\n  .dqpro-review__bottom { display: flex; justify-content: space-between; align-items: flex-end; }\n  .dqpro-review__author { font-size: 16px; font-weight: 700; color: #fff; margin: 0; }\n  .dqpro-review__meta { font-size: 13px; color: rgba(255,255,255,0.6); margin: 4px 0 0; }\n  \n  \/* Contr\u00f4les du Carousel *\/\n  .dqpro-review-footer { padding: 0 clamp(24px, 5vw, 64px) clamp(24px, 5vw, 64px); display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 24px;}\n  .dqpro-review-dots { display: flex; gap: 8px; align-items: center; }\n  .dqpro-review-dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: rgba(255,255,255,0.2); cursor: pointer; transition: all 0.3s; padding:0; }\n  .dqpro-review-dot.is-active { width: 24px; background: var(--green); border-radius: 4px; }\n  \n  .dqpro-review-controls { display: flex; gap: 12px; }\n  .dqpro-review-arrow { width: 44px; height: 44px; border-radius: 50%; border: none; background: rgba(255,255,255,0.1); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; }\n  .dqpro-review-arrow:hover { background: rgba(255,255,255,0.2); transform: scale(1.05); }\n\n  \/* =========================\n     FINAL CTA\n     ========================= *\/\n  .dqpro-final { padding: clamp(32px, 6vw, 64px) clamp(20px, 5vw, 64px); border-radius: var(--radius-xl); background: var(--black); color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; box-shadow: var(--shadow-card); position: relative; overflow: hidden; }\n  .dqpro-final::before { content: \"\"; position: absolute; inset: 0; background: radial-gradient(circle at center, rgba(108,18,70,0.3), transparent 70%); pointer-events: none;}\n  .dqpro-final__content { position: relative; z-index: 2; flex: 1; min-width: 250px; }\n  .dqpro-final__eyebrow { display: block; color: var(--green); font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 12px; }\n  .dqpro-final h2 { margin: 0; font-size: clamp(26px, 4vw, 40px); font-weight: 800; line-height: 1.15; color: #fff; }\n  .dqpro-final p { margin: 16px 0 0; font-size: clamp(15px, 2vw, 16px); color: rgba(255,255,255,0.7); max-width: 600px; }\n  .dqpro-final__actions { position: relative; z-index: 2; display: flex; gap: 16px; flex-wrap: wrap; width: 100%; justify-content: flex-start;}\n\n  \/* =========================\n     RESPONSIVE (ULTRA MOBILE)\n     ========================= *\/\n  @media (min-width: 769px) {\n    .dqpro-final__actions { width: auto; justify-content: flex-end; }\n  }\n\n  @media (max-width: 1050px) {\n    .dqpro-hero__grid, .dqpro-section-head, .dqpro-prep-grid, .dqpro-reviews-grid { grid-template-columns: 1fr; }\n    .dqpro-memo { position: static; }\n  }\n  @media (max-width: 768px) {\n    \/* Container Padding r\u00e9duit sur mobile *\/\n    .dqpro-container { padding: 32px 16px 60px; }\n    \n    \/* Grilles adapt\u00e9es pour ne pas \u00e9craser *\/\n    .dqpro-club__benefits { grid-template-columns: 1fr; }\n    \n    .dqpro-field { grid-template-columns: 40px 1fr; padding: 16px; gap: 12px; }\n    .dqpro-field__number { width: 40px; height: 40px; font-size: 16px; }\n    \n    \/* Boutons Full Width sur mobile *\/\n    .dqpro-actions, .dqpro-final__actions, .dqpro-memo-actions { flex-direction: column; width: 100%; gap: 12px;}\n    .dqpro-btn { width: 100%; justify-content: center; }\n    \n    \/* Ajustement Review Controls Mobile *\/\n    .dqpro-review-footer { flex-direction: column-reverse; align-items: flex-start; gap: 24px;}\n  }\n\n\n  \/* =========================================================\n     CORRECTION STICKY R\u00c9CAP DESKTOP\n     Le r\u00e9capitulatif suit le scroll m\u00eame sur les largeurs desktop < 1050px.\n     ========================================================= *\/\n\n  .dqpro {\n    overflow-x: clip !important;\n    overflow-y: visible !important;\n  }\n\n  .dqpro-panel--prep,\n  .dqpro-panel--prep .dqpro-panel-pad,\n  .dqpro-panel--prep .dqpro-prep-grid {\n    overflow: visible !important;\n  }\n\n  .dqpro-panel--prep .dqpro-prep-grid {\n    align-items: start !important;\n  }\n\n  @media (min-width: 769px) {\n    .dqpro-panel--prep .dqpro-memo {\n      position: -webkit-sticky !important;\n      position: sticky !important;\n      top: 24px !important;\n      align-self: start !important;\n      max-height: calc(100vh - 48px) !important;\n      overflow-y: auto !important;\n      overflow-x: hidden !important;\n      z-index: 5 !important;\n    }\n  }\n\n  @media (max-width: 768px) {\n    .dqpro-panel--prep .dqpro-memo {\n      position: static !important;\n      top: auto !important;\n      max-height: none !important;\n      overflow: visible !important;\n    }\n  }\n\n<\/style>\n\n<div class=\"dqpro\" id=\"dqpro-page\">\n  <div class=\"dqpro-container\">\n    <div class=\"dqpro-stack\">\n\n      <!-- HERO -->\n      <section class=\"dqpro-hero\">\n        <div class=\"dqpro-hero__grid\">\n          <div>\n            <div class=\"dqpro-kicker dqpro-kicker--dark\">\n              <span class=\"dqpro-kicker__dots\" aria-hidden=\"true\"><span><\/span><span><\/span><span><\/span><\/span>\n              Acc\u00e8s Pro Prioritaire\n            <\/div>\n            <h1 class=\"dqpro-hero__title\">\n              Votre raccourci pro pour commander <span>sans perdre de temps.<\/span>\n            <\/h1>\n            <p class=\"dqpro-hero__lead\">\n              <strong>Chez Discount&amp;Qualit\u00e9, les PRO sont notre priorit\u00e9.<\/strong><br>\n              Une question sur un produit, un lot ou une livraison ? Vous n\u2019\u00eates pas seul face au site : un conseiller vous accompagne directement pour s\u00e9curiser votre commande.\n            <\/p>\n            \n            <div class=\"dqpro-actions\">\n              <a class=\"dqpro-btn dqpro-btn--orange\" href=\"tel:0240972134\">\n                <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"><\/path><\/svg>\n                Je veux un conseiller\n              <\/a>\n              <a class=\"dqpro-btn dqpro-btn--white\" href=\"#dqpro-prep\">Pr\u00e9parer ma demande pro<\/a>\n            <\/div>\n\n            <!-- STATUS EN DIRECT -->\n            <div class=\"dqpro-live-status is-loading\" data-dqpro-live-status=\"\">\n              <div class=\"dqpro-live-status__icon\" data-status-icon=\"\">\n                <svg class=\"dqpro-spinner\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 12a9 9 0 1 1-6.219-8.56\"><\/path><\/svg>\n              <\/div>\n              <div class=\"dqpro-live-status__content\">\n                <div data-status-loading=\"\">\n                  <div class=\"dqpro-live-status__top\"><strong>V\u00e9rification du service...<\/strong><\/div>\n                  <p>Connexion \u00e0 l'\u00e9quipe en cours<\/p>\n                <\/div>\n                <div data-status-loaded=\"\" style=\"display: none;\">\n                  <div class=\"dqpro-live-status__top\">\n                    <strong data-status-title=\"\">...<\/strong>\n                    <span data-status-pill=\"\">...<\/span>\n                  <\/div>\n                  <p data-status-text=\"\">...<\/p>\n                  <div class=\"dqpro-live-agents\" data-status-agents=\"\" style=\"display: none;\"><\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n\n          <!-- CLUB CARD -->\n          <aside class=\"dqpro-club\">\n            <div class=\"dqpro-club__top\">\n              <span class=\"dqpro-chip\">Club Pro Discount&amp;Qualit\u00e9<\/span>\n              <span class=\"dqpro-status\">Assistance d\u00e9di\u00e9e<\/span>\n            <\/div>\n            <div class=\"dqpro-club__content\">\n              <h2>Un acc\u00e8s direct \u00e0 l\u2019\u00e9quipe.<\/h2>\n              <p>Stock \u00e0 v\u00e9rifier, quantit\u00e9 importante, demande de lot, livraison urgente ou doute avant validation.<\/p>\n            <\/div>\n            \n            <div class=\"dqpro-club__benefits\">\n              <div class=\"dqpro-club__benefit\">\n                <strong><span>\ud83d\udce6<\/span> Stock<\/strong>\n                <span class=\"dqpro-club__benefit-text\" data-benefit=\"stock\">Tous nos produits sont en stock !<\/span>\n              <\/div>\n              <div class=\"dqpro-club__benefit\">\n                <strong><span>\ud83d\udcb6<\/span> Lots<\/strong>\n                <span class=\"dqpro-club__benefit-text\" data-benefit=\"lots\">\u00c9tude sur mesure<\/span>\n              <\/div>\n              <div class=\"dqpro-club__benefit\">\n                <strong><span>\ud83d\ude9a<\/span> Livraison<\/strong>\n                <span class=\"dqpro-club__benefit-text\" data-benefit=\"livraison\">Retrait d\u00e9p\u00f4t 24h<\/span>\n              <\/div>\n            <\/div>\n\n            <div class=\"dqpro-phone-card\">\n              <div class=\"dqpro-phone-card__icon\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"><\/path><\/svg>\n              <\/div>\n              <div>\n                <p>Ligne directe conseiller pro<\/p>\n                <strong>02 40 97 21 34<\/strong>\n              <\/div>\n            <\/div>\n          <\/aside>\n        <\/div>\n      <\/section>\n\n      <!-- SERVICES -->\n      <section class=\"dqpro-panel\">\n        <div class=\"dqpro-panel-pad\">\n          <div class=\"dqpro-section-head\">\n            <div>\n              <div class=\"dqpro-kicker\">L'Accompagnement Pro<\/div>\n              <h2 class=\"dqpro-title\">Vous avez une demande ? <span>On prend le relais.<\/span><\/h2>\n            <\/div>\n            <p class=\"dqpro-text\">Un pro a rarement le temps de chercher pendant 20 minutes. Notre r\u00f4le : vous donner <strong>la bonne information rapidement<\/strong>, pour avancer sans bloquer votre chantier.<\/p>\n          <\/div>\n\n          <div class=\"dqpro-services-grid\">\n            <article class=\"dqpro-service\">\n              <div class=\"dqpro-service__icon\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg><\/div>\n              <h3 class=\"dqpro-service__title\">V\u00e9rifier un stock<\/h3>\n              <p class=\"dqpro-service__text\">On vous aide \u00e0 confirmer la disponibilit\u00e9 et les quantit\u00e9s possibles sur une r\u00e9f\u00e9rence.<\/p>\n            <\/article>\n            <article class=\"dqpro-service\">\n              <div class=\"dqpro-service__icon\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M12 1v22M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6\"><\/path><\/svg><\/div>\n              <h3 class=\"dqpro-service__title\">\u00c9tudier un lot<\/h3>\n              <p class=\"dqpro-service__text\">Besoin de volume ? On regarde ce qui est possible selon l\u2019arrivage et on ajuste.<\/p>\n            <\/article>\n            <article class=\"dqpro-service\">\n              <div class=\"dqpro-service__icon\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"><\/line><polyline points=\"12 5 19 12 12 19\"><\/polyline><\/svg><\/div>\n              <h3 class=\"dqpro-service__title\">Livraison \/ D\u00e9p\u00f4t<\/h3>\n              <p class=\"dqpro-service__text\">Retrait d\u00e9p\u00f4t, livraison rapide ou contrainte chantier : on trouve la solution.<\/p>\n            <\/article>\n            <article class=\"dqpro-service\">\n              <div class=\"dqpro-service__icon\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\"><\/path><line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\"><\/line><\/svg><\/div>\n              <h3 class=\"dqpro-service__title\">Aide \u00e0 l'achat<\/h3>\n              <p class=\"dqpro-service__text\">Un doute avant de valider le panier ? On vous guide pas \u00e0 pas jusqu'\u00e0 la fin.<\/p>\n            <\/article>\n          <\/div>\n        <\/div>\n      <\/section>\n\n      <!-- FORMULAIRE -->\n      <section class=\"dqpro-panel dqpro-panel--prep\" id=\"dqpro-prep\">\n        <div class=\"dqpro-panel-pad\" data-dqpro-prep=\"\">\n          <div class=\"dqpro-section-head\">\n            <div>\n              <div class=\"dqpro-kicker\">Gagnez du temps<\/div>\n              <h2 class=\"dqpro-title\">Pr\u00e9parez votre demande, <span>envoyez en un clic.<\/span><\/h2>\n              <p class=\"dqpro-call-direct\">ou appelez-nous directement au <a href=\"tel:0240972134\" aria-label=\"Appeler Discount et Qualit\u00e9 au 02 40 97 21 34\">\n                <svg width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2A19.79 19.79 0 0 1 11.19 19 19.5 19.5 0 0 1 5 12.81 19.79 19.79 0 0 1 2.08 4.18 2 2 0 0 1 4.07 2h3a2 2 0 0 1 2 1.72c.12.91.33 1.79.62 2.63a2 2 0 0 1-.45 2.11L8.1 9.6a16 16 0 0 0 6.3 6.3l1.14-1.14a2 2 0 0 1 2.11-.45c.84.29 1.72.5 2.63.62A2 2 0 0 1 22 16.92z\"><\/path><\/svg>\n                02 40 97 21 34\n              <\/a><\/p>\n            <\/div>\n            <p class=\"dqpro-text\">Renseignez vos infos ici. Le r\u00e9capitulatif s'ouvrira directement dans votre bo\u00eete mail, pr\u00eat \u00e0 \u00eatre envoy\u00e9 \u00e0 <strong>serviceclients@discountetqualite.fr<\/strong>.<\/p>\n          <\/div>\n\n          <div class=\"dqpro-prep-grid\">\n            <div class=\"dqpro-form-list\">\n              <div class=\"dqpro-form-group-label\">Fiche de renseignement<\/div>\n\n              <label class=\"dqpro-field\" data-required-wrapper=\"\">\n                <span class=\"dqpro-field__number\">1<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Nom et pr\u00e9nom <span class=\"dqpro-required\">Obligatoire<\/span><\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Indiquez votre nom complet pour que le conseiller vous identifie facilement.<\/span>\n                  <textarea data-prep-field=\"nomprenom\" data-required-field=\"\"  placeholder=\"Ex: Jean Dupont\" required=\"\"><\/textarea>\n                  <span class=\"dqpro-error\">Ce champ est obligatoire pour pr\u00e9parer l\u2019email.<\/span>\n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\" data-required-wrapper=\"\">\n                <span class=\"dqpro-field__number\">2<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Nom de l\u2019entreprise <span class=\"dqpro-required\">Obligatoire<\/span><\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Indiquez le nom de votre soci\u00e9t\u00e9, artisanat ou structure.<\/span>\n                  <textarea data-prep-field=\"entreprise\" data-required-field=\"\"  placeholder=\"Ex: Dupont Plomberie, Martin \u00c9lectricit\u00e9...\" required=\"\"><\/textarea>\n                  <span class=\"dqpro-error\">Ce champ est obligatoire pour pr\u00e9parer l\u2019email.<\/span>\n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\" data-required-wrapper=\"\">\n                <span class=\"dqpro-field__number\">3<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">T\u00e9l\u00e9phone <span class=\"dqpro-required\">Obligatoire<\/span><\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Indiquez le num\u00e9ro sur lequel le conseiller peut vous joindre.<\/span>\n                  <textarea data-prep-field=\"telephone\" data-required-field=\"\"  inputmode=\"tel\" placeholder=\"Ex: 06 00 00 00 00\" required=\"\"><\/textarea>\n                  <span class=\"dqpro-error\">Ce champ est obligatoire pour pr\u00e9parer l\u2019email.<\/span>\n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\" data-required-wrapper=\"\">\n                <span class=\"dqpro-field__number\">4<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Adresse email <span class=\"dqpro-required\">Obligatoire<\/span><\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Indiquez l\u2019adresse email depuis laquelle vous allez envoyer la demande.<\/span>\n                  <textarea data-prep-field=\"email\" data-required-field=\"\"  inputmode=\"email\" placeholder=\"Ex: contact@entreprise.fr\" required=\"\"><\/textarea>\n                  <span class=\"dqpro-error\">Ce champ est obligatoire pour pr\u00e9parer l\u2019email.<\/span>\n                <\/span>\n              <\/label>\n\n              <div class=\"dqpro-form-group-label\">Votre demande produit<\/div>\n\n              <label class=\"dqpro-field\" data-link-field-wrapper=\"\">\n                <span class=\"dqpro-field__number\">5<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Lien du produit <span class=\"dqpro-optional\">Facultatif<\/span><\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Collez l'URL de la fiche produit si vous l'avez d\u00e9j\u00e0.<\/span>\n                  <textarea data-prep-field=\"produit\" placeholder=\"Ex: https:\/\/www.discountetqualite.fr\/... (facultatif)\"><\/textarea>\n                  \n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\">\n                <span class=\"dqpro-field__number\">6<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Quantit\u00e9 souhait\u00e9e<\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Ex: 3 unit\u00e9s, 10 pi\u00e8ces, tout le lot disponible...<\/span>\n                  <textarea data-prep-field=\"quantite\"  placeholder=\"Votre besoin en quantit\u00e9...\"><\/textarea>\n                  \n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\">\n                <span class=\"dqpro-field__number\">7<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Logistique &amp; Livraison<\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Ex: retrait d\u00e9p\u00f4t, livraison sur chantier mardi...<\/span>\n                  <textarea data-prep-field=\"logistique\"  placeholder=\"Vos contraintes logistiques...\"><\/textarea>\n                  \n                <\/span>\n              <\/label>\n\n              <label class=\"dqpro-field\">\n                <span class=\"dqpro-field__number\">8<\/span>\n                <span>\n                  <span class=\"dqpro-field__header\">\n                    <span class=\"dqpro-field__label\">Votre question principale<\/span>\n                    <svg class=\"dqpro-field__check\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n                  <\/span>\n                  <span class=\"dqpro-field__hint\">Stock, prix par lot, compatibilit\u00e9 technique...<\/span>\n                  <textarea data-prep-field=\"question\"  placeholder=\"Ce que vous souhaitez demander au conseiller...\"><\/textarea>\n                  \n                <\/span>\n              <\/label>\n            <\/div>\n\n            <!-- MEMO STICKY -->\n            <aside class=\"dqpro-memo\">\n              <h3 class=\"dqpro-memo__title\">Votre r\u00e9capitulatif est pr\u00eat.<\/h3>\n              \n              <div class=\"dqpro-progress\">\n                <div class=\"dqpro-progress__text\">\n                  <span>Progression de la demande<\/span>\n                  <span data-progress-text=\"\">0\/8<\/span>\n                <\/div>\n                <div class=\"dqpro-progress__bar\">\n                  <div class=\"dqpro-progress__fill\" data-progress-bar=\"\"><\/div>\n                <\/div>\n              <\/div>\n\n              <div class=\"dqpro-summary\">\n                <ul>\n                  <li><strong>Nom<\/strong> <span data-prep-preview=\"nomprenom\">...<\/span><\/li>\n                  <li><strong>Entreprise<\/strong> <span data-prep-preview=\"entreprise\">...<\/span><\/li>\n                  <li><strong>T\u00e9l\u00e9phone<\/strong> <span data-prep-preview=\"telephone\">...<\/span><\/li>\n                  <li><strong>Email<\/strong> <span data-prep-preview=\"email\">...<\/span><\/li>\n                  <li><strong>Produit<\/strong> <span data-prep-preview=\"produit\">...<\/span><\/li>\n                  <li><strong>Quantit\u00e9<\/strong> <span data-prep-preview=\"quantite\">...<\/span><\/li>\n                  <li><strong>Logistique<\/strong> <span data-prep-preview=\"logistique\">...<\/span><\/li>\n                  <li><strong>Question<\/strong> <span data-prep-preview=\"question\">...<\/span><\/li>\n                <\/ul>\n              <\/div>\n\n              <div class=\"dqpro-memo-actions\">\n                <button class=\"dqpro-btn dqpro-btn--orange is-disabled\" type=\"button\" data-prep-email=\"\">\n                  <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"><\/path><polyline points=\"22,6 12,13 2,6\"><\/polyline><\/svg>\n                  Envoyer par Email\n                <\/button>\n                <button class=\"dqpro-btn dqpro-btn--ghost\" type=\"button\" data-prep-copy=\"\">\n                  <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" ry=\"2\"><\/rect><path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\"><\/path><\/svg>\n                  Copier le texte\n                <\/button>\n              <\/div>\n            <\/aside>\n          <\/div>\n        <\/div>\n      <\/section>\n\n      <!-- AVIS CAROUSEL -->\n      <section class=\"dqpro-panel\">\n        <div class=\"dqpro-panel-pad\">\n          <div class=\"dqpro-section-head\" style=\"grid-template-columns: 1fr;\">\n            <div>\n              <div class=\"dqpro-kicker dqpro-kicker--orange\">Avis V\u00e9rifi\u00e9s<\/div>\n              <h2 class=\"dqpro-title\">La confiance des pros : <span>3 104 avis.<\/span><\/h2>\n            <\/div>\n          <\/div>\n\n          <div class=\"dqpro-reviews-grid\">\n            <article class=\"dqpro-rating\">\n              <div class=\"dqpro-kicker dqpro-kicker--green\" style=\"margin:0;\">Certifi\u00e9<\/div>\n              <div class=\"dqpro-rating__score\">4,8<span>\/5<\/span><\/div>\n              <p class=\"dqpro-rating__based\">Bas\u00e9 sur <strong>3 104 avis<\/strong><\/p>\n              \n              <img decoding=\"async\" class=\"dqpro-rating__stars\" src=\"https:\/\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2026\/06\/etoile-avis-verifiees-discountetqualite.png\" alt=\"\u00c9toiles\" loading=\"lazy\">\n              <img decoding=\"async\" class=\"dqpro-rating__logo\" src=\"https:\/\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2026\/06\/logo-etoile-avis-verifiees-discountetqualite.png\" alt=\"Logo Avis V\u00e9rifi\u00e9s\" loading=\"lazy\">\n              \n              <a class=\"dqpro-btn dqpro-btn--outline\" href=\"https:\/\/www.avis-verifies.com\/avis-clients\/discountetqualite.fr\" target=\"_blank\" rel=\"noopener noreferrer\" style=\"margin-top: 32px; width: 100%; font-size: 14px;\">\n                Voir tous nos avis\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6\"><\/path><polyline points=\"15 3 21 3 21 9\"><\/polyline><line x1=\"10\" y1=\"14\" x2=\"21\" y2=\"3\"><\/line><\/svg>\n              <\/a>\n            <\/article>\n\n            <div class=\"dqpro-review-panel\" data-dqpro-review-carousel=\"\">\n              \n              <div class=\"dqpro-review-wrapper\">\n                <article class=\"dqpro-review is-active\">\n                  <span class=\"dqpro-review__tag\">Stock &amp; dispo<\/span>\n                  <p class=\"dqpro-review__text\">\"Pouvoir v\u00e9rifier un stock avant de commander permet de <span>gagner un temps pr\u00e9cieux<\/span>.\"<\/p>\n                  <div class=\"dqpro-review__bottom\">\n                    <div><p class=\"dqpro-review__author\">Julien, \u00e0 Nantes<\/p><p class=\"dqpro-review__meta\">Pro du chauffage<\/p><\/div>\n                  <\/div>\n                <\/article>\n                <article class=\"dqpro-review\">\n                  <span class=\"dqpro-review__tag\">Service client<\/span>\n                  <p class=\"dqpro-review__text\">\"Des prix attractifs, mais surtout un <span>vrai contact humain<\/span> quand il faut avancer vite.\"<\/p>\n                  <div class=\"dqpro-review__bottom\">\n                    <div><p class=\"dqpro-review__author\">Thomas, \u00e0 Rennes<\/p><p class=\"dqpro-review__meta\">Entreprise de plomberie<\/p><\/div>\n                  <\/div>\n                <\/article>\n                <article class=\"dqpro-review\">\n                  <span class=\"dqpro-review__tag\">Lots &amp; arrivages<\/span>\n                  <p class=\"dqpro-review__text\">\"Une question sur un lot peut transformer une commande en <span>vraie opportunit\u00e9<\/span>.\"<\/p>\n                  <div class=\"dqpro-review__bottom\">\n                    <div><p class=\"dqpro-review__author\">Maxime, \u00e0 Bordeaux<\/p><p class=\"dqpro-review__meta\">Artisan installateur<\/p><\/div>\n                  <\/div>\n                <\/article>\n                <article class=\"dqpro-review\">\n                  <span class=\"dqpro-review__tag\">Confiance<\/span>\n                  <p class=\"dqpro-review__text\">\"Commander avec un conseiller dispo, c\u2019est avancer avec <span>plus de s\u00e9r\u00e9nit\u00e9<\/span>.\"<\/p>\n                  <div class=\"dqpro-review__bottom\">\n                    <div><p class=\"dqpro-review__author\">S\u00e9bastien, \u00e0 Toulouse<\/p><p class=\"dqpro-review__meta\">Soci\u00e9t\u00e9 de maintenance<\/p><\/div>\n                  <\/div>\n                <\/article>\n              <\/div>\n\n              <div class=\"dqpro-review-footer\">\n                <div class=\"dqpro-review-dots\">\n                  <button class=\"dqpro-review-dot is-active\"><\/button>\n                  <button class=\"dqpro-review-dot\"><\/button>\n                  <button class=\"dqpro-review-dot\"><\/button>\n                  <button class=\"dqpro-review-dot\"><\/button>\n                <\/div>\n                <div class=\"dqpro-review-controls\">\n                  <button class=\"dqpro-review-arrow dqpro-review-prev\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><polyline points=\"15 18 9 12 15 6\"><\/polyline><\/svg><\/button>\n                  <button class=\"dqpro-review-arrow dqpro-review-next\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><polyline points=\"9 18 15 12 9 6\"><\/polyline><\/svg><\/button>\n                <\/div>\n              <\/div>\n\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/section>\n\n      <!-- CTA FINAL -->\n      <section class=\"dqpro-final\">\n        <div class=\"dqpro-final__content\">\n          <span class=\"dqpro-final__eyebrow\">Chez Discount&amp;Qualit\u00e9, les PRO sont notre priorit\u00e9<\/span>\n          <h2>Une question avant d'acheter ?<\/h2>\n          <p>L\u2019objectif est simple : vous aider \u00e0 commander plus vite et plus sereinement.<\/p>\n        <\/div>\n        <div class=\"dqpro-final__actions\">\n          <a class=\"dqpro-btn dqpro-btn--white\" href=\"tel:0240972134\">Appeler un conseiller<\/a>\n          <a class=\"dqpro-btn dqpro-btn--orange\" href=\"#dqpro-prep\">Pr\u00e9parer ma demande<\/a>\n        <\/div>\n      <\/section>\n\n    <\/div>\n  <\/div>\n\n  <!-- Toasts -->\n  <div id=\"dqpro-toast-container\" class=\"dqpro-toast-container\"><\/div>\n<\/div>\n\n<script>\n  document.addEventListener('DOMContentLoaded', function () {\n    \n    \/* =========================================================\n       0. Syst\u00e8me Global de Toasts\n       ========================================================= *\/\n    function showToast(message, type = 'success') {\n      const container = document.getElementById('dqpro-toast-container');\n      if (!container) return;\n      const toast = document.createElement('div');\n      toast.className = `dqpro-toast ${type === 'error' ? 'is-error' : ''}`;\n      \n      const icon = type === 'error' \n        ? '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"><\/line><line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"><\/line><\/svg>'\n        : '<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"><\/path><polyline points=\"22 4 12 14.01 9 11.01\"><\/polyline><\/svg>';\n      \n      toast.innerHTML = `${icon} <span>${message}<\/span>`;\n      container.appendChild(toast);\n      setTimeout(() => { if (toast.parentNode) toast.remove(); }, 3200);\n    }\n\n    \/* =========================================================\n       1. Animation Dynamique de la Club Card\n       ========================================================= *\/\n    function initDynamicBenefits() {\n      const elStock = document.querySelector('[data-benefit=\"stock\"]');\n      const elLots = document.querySelector('[data-benefit=\"lots\"]');\n      const elLiv = document.querySelector('[data-benefit=\"livraison\"]');\n\n      const stockPhrase = \"Tous nos produits sont en stock !\";\n      const lotPhrases = [\"Prix pour 5 palettes ?\", \"Devis pour 10 pi\u00e8ces\", \"Remise sur lot complet\", \"Dispo pour 50 unit\u00e9s ?\", \"Achat en gros volume\"];\n      const livPhrases = [\"Retrait d\u00e9p\u00f4t 24h\", \"Exp\u00e9dition en 24h\"];\n\n      const getRandom = (arr) => {\n        const item = arr[Math.floor(Math.random() * arr.length)];\n        return typeof item === 'function' ? item() : item;\n      };\n\n      const animateText = (element, newText) => {\n        if (!element) return;\n        element.classList.add('is-switching');\n        setTimeout(() => {\n          element.textContent = newText;\n          element.classList.remove('is-switching');\n        }, 300);\n      };\n\n      if (elStock) animateText(elStock, stockPhrase);\n      setTimeout(() => {\n        if (elLots) setInterval(() => animateText(elLots, getRandom(lotPhrases)), 6000);\n      }, 3500);\n      setTimeout(() => {\n        if (elLiv) setInterval(() => animateText(elLiv, getRandom(livPhrases)), 7500);\n      }, 5000);\n    }\n    initDynamicBenefits();\n\n    \/* =========================================================\n       2. Statut dynamique (Loading 2s & Faux Conseillers)\n       ========================================================= *\/\n    const statusBlocks = document.querySelectorAll(\"[data-dqpro-live-status]\");\n    setTimeout(() => {\n      const now = new Date();\n      const options = { timeZone: \"Europe\/Paris\", hour: 'numeric', minute: 'numeric', weekday: 'long' };\n      const formatter = new Intl.DateTimeFormat('fr-FR', options);\n      const parts = formatter.formatToParts(now);\n      \n      let hour = 0, minute = 0, weekday = '';\n      parts.forEach(p => {\n        if (p.type === 'hour') hour = parseInt(p.value, 10);\n        if (p.type === 'minute') minute = parseInt(p.value, 10);\n        if (p.type === 'weekday') weekday = p.value.toLowerCase();\n      });\n\n      const currentMinutes = (hour * 60) + minute;\n      const openMinutes = 9 * 60;\n      const closeMinutes = 17 * 60;\n      const isBusinessDay = ['lundi','mardi','mercredi','jeudi','vendredi'].includes(weekday);\n      const isOpen = isBusinessDay && currentMinutes >= openMinutes && currentMinutes < closeMinutes;\n\n      statusBlocks.forEach(block => {\n        block.classList.remove('is-loading');\n        \n        const loadingView = block.querySelector('[data-status-loading]');\n        const loadedView = block.querySelector('[data-status-loaded]');\n        const icon = block.querySelector(\"[data-status-icon]\");\n        const title = block.querySelector(\"[data-status-title]\");\n        const pill = block.querySelector(\"[data-status-pill]\");\n        const text = block.querySelector(\"[data-status-text]\");\n        const agentsWrap = block.querySelector(\"[data-status-agents]\");\n\n        loadingView.style.display = 'none';\n        loadedView.style.display = 'block';\n\n        block.classList.toggle(\"is-open\", isOpen);\n        block.classList.toggle(\"is-closed\", !isOpen);\n\n        if (isOpen) {\n          title.textContent = \"Service client ouvert\";\n          pill.textContent = \"En ligne\";\n          icon.innerHTML = '<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>';\n          text.textContent = \"Un conseiller est disponible jusqu'\u00e0 17h. Appelez-nous directement.\";\n          \n          agentsWrap.style.display = 'inline-flex';\n          const updateAgents = () => {\n            const count = Math.floor(Math.random() * 3) + 1;\n            agentsWrap.innerHTML = `Actuellement <strong>${count} conseiller${count > 1 ? 's' : ''}<\/strong> libre${count > 1 ? 's' : ''}`;\n          };\n          updateAgents();\n          setInterval(updateAgents, 15000);\n          \n        } else {\n          title.textContent = \"Service client ferm\u00e9\";\n          pill.textContent = \"Hors ligne\";\n          icon.innerHTML = '<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg>';\n          text.textContent = \"R\u00e9ouverture \u00e0 9h le prochain jour ouvr\u00e9. Pr\u00e9parez votre demande par mail.\";\n          agentsWrap.style.display = 'none';\n        }\n      });\n    }, 2000);\n\n    \/* =========================================================\n       3. Formulaire UX Premium\n       ========================================================= *\/\n    const prepBlocks = document.querySelectorAll(\"[data-dqpro-prep]\");\n    prepBlocks.forEach((block, idx) => {\n      const storageKey = \"dqpro_memo_\" + idx;\n      const fields = block.querySelectorAll(\"[data-prep-field]\");\n      const requiredFields = block.querySelectorAll(\"[data-required-field]\");\n      const linkField = block.querySelector(\"[data-required-product-link]\");\n      const linkWrapper = block.querySelector(\"[data-link-field-wrapper]\");\n      const emailBtn = block.querySelector(\"[data-prep-email]\");\n      const copyBtn = block.querySelector(\"[data-prep-copy]\");\n      const progText = block.querySelector(\"[data-progress-text]\");\n      const progBar = block.querySelector(\"[data-progress-bar]\");\n      \n      const saved = JSON.parse(localStorage.getItem(storageKey)) || {};\n\n      fields.forEach(f => {\n        const resize = () => { f.style.height = 'auto'; f.style.height = (f.scrollHeight) + 'px'; };\n        f.addEventListener('input', resize);\n        setTimeout(resize, 100);\n      });\n\n      function checkValidity(showErrors = false) {\n        let isValid = true;\n\n        requiredFields.forEach(field => {\n          const wrapper = field.closest('.dqpro-field');\n          const filled = field.value.trim().length > 0;\n\n          if (!filled) isValid = false;\n\n          if (showErrors && wrapper) {\n            wrapper.classList.toggle('is-error', !filled);\n          }\n\n          if (filled && wrapper) {\n            wrapper.classList.remove('is-error');\n          }\n        });\n\n        if (emailBtn) {\n          if (isValid) {\n            emailBtn.classList.remove('is-disabled');\n          } else {\n            emailBtn.classList.add('is-disabled');\n          }\n        }\n\n        return isValid;\n      }\n\n      function updatePreviewAndProgress(flash = true) {\n        const data = {};\n        let filledCount = 0;\n\n        fields.forEach(f => {\n          const key = f.getAttribute(\"data-prep-field\");\n          const val = f.value.trim();\n          data[key] = val;\n          \n          const parentField = f.closest('.dqpro-field');\n          if (val.length > 0) { filledCount++; parentField.classList.add('is-filled'); } \n          else { parentField.classList.remove('is-filled'); }\n\n          const previewEl = block.querySelector(`[data-prep-preview=\"${key}\"]`);\n          if (previewEl) {\n            previewEl.textContent = val || \"...\";\n            if (flash && val) {\n              previewEl.style.backgroundColor = 'var(--green-flash)';\n              setTimeout(() => previewEl.style.backgroundColor = 'transparent', 300);\n            }\n          }\n        });\n\n        if (progText && progBar) {\n          progText.textContent = `${filledCount}\/${fields.length}`;\n          progBar.style.width = `${(filledCount \/ fields.length) * 100}%`;\n        }\n\n        localStorage.setItem(storageKey, JSON.stringify(data));\n        checkValidity(false);\n        return data;\n      }\n\n      fields.forEach(f => {\n        const k = f.getAttribute(\"data-prep-field\");\n        if(saved[k]) f.value = saved[k];\n        f.addEventListener('input', () => updatePreviewAndProgress(false));\n        f.addEventListener('blur', () => updatePreviewAndProgress(true));\n      });\n      updatePreviewAndProgress(false);\n\n      function buildText(data) {\n        return `Bonjour,\\n\\nJe suis ${data.nomprenom || 'Non renseign\u00e9'}, de l'entreprise ${data.entreprise || 'Non renseign\u00e9e'}.\\n\\nVoici mes coordonn\u00e9es :\\nT\u00e9l\u00e9phone : ${data.telephone || 'Non renseign\u00e9'}\\nEmail : ${data.email || 'Non renseign\u00e9'}\\n\\nJe suis actuellement en \u00e9change avec un conseiller Discount&Qualit\u00e9 au sujet d'une demande pro.\\n\\nVoici les informations utiles :\\n\\nLien produit : ${data.produit || 'Non renseign\u00e9'}\\nQuantit\u00e9 : ${data.quantite || 'Non renseign\u00e9'}\\nLogistique : ${data.logistique || 'Non renseign\u00e9'}\\nQuestion : ${data.question || 'Non renseign\u00e9'}\\n\\nMerci.`;\n      }\n\n      emailBtn?.addEventListener('click', () => {\n        if(!checkValidity(true)) {\n          const firstMissing = Array.from(requiredFields).find(field => !field.value.trim());\n          if (firstMissing) firstMissing.focus();\n          showToast(\"Merci de remplir les coordonn\u00e9es obligatoires.\", \"error\");\n          return;\n        }\n\n        const data = updatePreviewAndProgress(false);\n        const text = buildText(data);\n        const subject = data.entreprise ? `Demande Pro D&Q - ${data.entreprise}` : \"Demande Pro D&Q\";\n\n        window.location.href = `mailto:serviceclients@discountetqualite.fr?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(text)}`;\n      });\n\n      copyBtn?.addEventListener('click', () => {\n        const text = buildText(updatePreviewAndProgress(false));\n        navigator.clipboard.writeText(text).then(() => {\n          showToast(\"R\u00e9capitulatif copi\u00e9 dans le presse-papier !\");\n        }).catch(() => {\n          showToast(\"Erreur lors de la copie.\", \"error\");\n        });\n      });\n    });\n\n    \/* =========================================================\n       4. Carrousel d'avis\n       ========================================================= *\/\n    const carousels = document.querySelectorAll(\"[data-dqpro-review-carousel]\");\n    carousels.forEach(carousel => {\n      const slides = carousel.querySelectorAll(\".dqpro-review\");\n      const dots = carousel.querySelectorAll(\".dqpro-review-dot\");\n      const prev = carousel.querySelector(\".dqpro-review-prev\");\n      const next = carousel.querySelector(\".dqpro-review-next\");\n      \n      let current = 0;\n      let timer;\n\n      function showSlide(index) {\n        current = (index + slides.length) % slides.length;\n        slides.forEach((s, i) => s.classList.toggle(\"is-active\", i === current));\n        dots.forEach((d, i) => d.classList.toggle(\"is-active\", i === current));\n      }\n\n      function start() { clearInterval(timer); timer = setInterval(() => showSlide(current + 1), 6000); }\n      function stop() { clearInterval(timer); }\n\n      next?.addEventListener(\"click\", () => { showSlide(current + 1); start(); });\n      prev?.addEventListener(\"click\", () => { showSlide(current - 1); start(); });\n      dots.forEach((d, i) => d.addEventListener(\"click\", () => { showSlide(i); start(); }));\n\n      carousel.addEventListener(\"mouseenter\", stop);\n      carousel.addEventListener(\"mouseleave\", start);\n      \n      start();\n    });\n  });\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Acc\u00e8s Pro Prioritaire Votre raccourci pro pour commander sans perdre de temps. Chez Discount&amp;Qualit\u00e9, les PRO sont notre priorit\u00e9. Une question sur un produit, un lot ou une livraison ? Vous n\u2019\u00eates pas seul face au site : un conseiller vous accompagne directement pour s\u00e9curiser votre commande. Je veux un conseiller Pr\u00e9parer ma demande pro [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_seopress_titles_title":"Espace Pro Discount&Qualit\u00e9 | Conseiller d\u00e9di\u00e9 & stock","_seopress_titles_desc":"Un conseiller Discount&Qualit\u00e9 accompagne les pros pour v\u00e9rifier un produit, un stock, un lot ou une livraison avant commande. Service ouvert du lundi au vendredi.","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"","_seopress_redirections_param":"","_seopress_redirections_type":0,"_seopress_analysis_target_kw":"","inline_featured_image":false,"_uag_custom_page_level_css":"","cybocfi_hide_featured_image":"","iawp_total_views":21,"footnotes":""},"class_list":["post-14126","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Vincent Pillet","author_link":"https:\/\/www.discountetqualite.fr\/blog\/author\/vincentdq\/"},"uagb_comment_info":0,"uagb_excerpt":"Acc\u00e8s Pro Prioritaire Votre raccourci pro pour commander sans perdre de temps. Chez Discount&amp;Qualit\u00e9, les PRO sont notre priorit\u00e9. Une question sur un produit, un lot ou une livraison ? Vous n\u2019\u00eates pas seul face au site : un conseiller vous accompagne directement pour s\u00e9curiser votre commande. Je veux un conseiller Pr\u00e9parer ma demande pro\u2026","jetpack-related-posts":[{"id":13575,"url":"https:\/\/www.discountetqualite.fr\/blog\/destockage-professionnel\/","url_meta":{"origin":14126,"position":0},"title":"LE fournisseur des professionnels du b\u00e2timent","author":"Vincent Pillet","date":"7 octobre 2025","format":false,"excerpt":"VOUS \u00caTES PLOMBIERS, CHAUFFAGISTES OU FRIGORISTES ? TROUVEZ TOUT LE MAT\u00c9RIEL DONT VOUS AVEZ BESOIN AU MEILLEUR PRIX. Discount&Qualit\u00e9 est le site de plomberie et de mat\u00e9riel professionnel pl\u00e9biscit\u00e9 par les artisans. V\u00e9ritable grossiste en plomberie sanitaire, nous proposons tout le mat\u00e9riel de plomberie pour professionnel, l\u2019outillage de plomberie, ainsi\u2026","rel":"","context":"Article similaire","block_context":{"text":"Article similaire","link":""},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2025\/10\/page-pro-discount-qualite.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2025\/10\/page-pro-discount-qualite.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2025\/10\/page-pro-discount-qualite.jpg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2025\/10\/page-pro-discount-qualite.jpg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/www.discountetqualite.fr\/blog\/wp-content\/uploads\/2025\/10\/page-pro-discount-qualite.jpg?resize=1050%2C600&ssl=1 3x"},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/pages\/14126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/comments?post=14126"}],"version-history":[{"count":17,"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/pages\/14126\/revisions"}],"predecessor-version":[{"id":14166,"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/pages\/14126\/revisions\/14166"}],"wp:attachment":[{"href":"https:\/\/www.discountetqualite.fr\/blog\/wp-json\/wp\/v2\/media?parent=14126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}