/**
 * WP Fixer – Suite | Composants de la maquette 2026
 * Reproduction des styles d'origine, préfixée pour Impreza / WPBakery.
 * Les polices DM Sans et Space Grotesk sont celles de la charte WP Fixer.
 */
.wpfs-component { box-sizing:border-box; max-width:100%; font-family:'DM Sans',sans-serif; }
.wpfs-component *, .wpfs-component *::before, .wpfs-component *::after { box-sizing:border-box; }
.wpfs-component svg { display:block; flex-shrink:0; }

/* 1. Illustration du suivi : styles originaux de la homepage. */
.wpfs-dashboard-visual.visual { position:relative; width:100%; padding:33px 11px 26px 10px; line-height:1.55; }
.wpfs-dashboard-visual .dashboard { background:#fff; color:#12151c; border:1px solid rgba(255,255,255,.3); border-radius:25px; padding:27px; box-shadow:0 32px 80px rgba(0,0,0,.25); transform:rotate(2deg); position:relative; }
.wpfs-dashboard-visual .dash-top { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #ecedef; padding-bottom:20px; margin-bottom:22px; gap:15px; }
.wpfs-dashboard-visual .dash-top h4 { margin:0; padding:0; font-family:'DM Sans',sans-serif; color:#12151c; font-size:13px; font-weight:700; line-height:1.4; letter-spacing:0; text-transform:none; }
.wpfs-dashboard-visual .dash-top small { display:block; color:#9298a0; font-size:10px; line-height:1.5; }
.wpfs-dashboard-visual .dash-avatar { flex-shrink:0; width:30px; height:30px; border-radius:10px; display:grid; place-items:center; background:#f0ebfc; color:#12151c; }
.wpfs-dashboard-visual .dash-status { background:#f0f9df; padding:20px; border-radius:17px; display:flex; align-items:center; gap:15px; margin-bottom:21px; }
.wpfs-dashboard-visual .dash-status-icon { flex-shrink:0; width:48px; height:48px; border-radius:15px; display:grid; place-items:center; background:#c9f578; color:#12151c; }
.wpfs-dashboard-visual .dash-status strong { display:block; color:#12151c; font-size:18px; font-family:'Space Grotesk',sans-serif; font-weight:700; line-height:1.25; }
.wpfs-dashboard-visual .dash-status small { display:block; font-size:11px; color:#65725f; margin-top:4px; line-height:1.5; }
.wpfs-dashboard-visual p.dash-title { font-family:'DM Sans',sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:#949a9e; font-weight:800; margin:0 0 8px; line-height:1.55; }
.wpfs-dashboard-visual .dash-row { display:flex; justify-content:space-between; align-items:center; padding:12px 0; gap:12px; border-bottom:1px solid #f0f1f2; }
.wpfs-dashboard-visual .dash-row .name { display:flex; gap:10px; align-items:center; color:#12151c; font-weight:700; font-size:12px; min-width:0; line-height:1.5; }
.wpfs-dashboard-visual .dash-row .name svg { width:17px; height:17px; color:#79828a; }
.wpfs-dashboard-visual .dash-chip { background:#eef7db; color:#53622e; border-radius:7px; font-size:10px; font-weight:800; padding:5px 9px; white-space:nowrap; line-height:1.55; }
.wpfs-dashboard-visual .dash-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:21px; color:#81898f; font-size:10px; }
.wpfs-dashboard-visual .dash-bottom b { color:#12151c; font-weight:800; white-space:nowrap; }
.wpfs-dashboard-visual .floating-badge { position:absolute; z-index:2; bottom:9px; left:-22px; display:flex; align-items:center; gap:11px; background:#fff; color:#12151c; border-radius:14px; padding:13px 17px; box-shadow:0 12px 35px rgba(0,0,0,.15); transform:rotate(-5deg); }
.wpfs-dashboard-visual .floating-badge-icon { flex-shrink:0; width:35px; height:35px; border-radius:10px; background:#e9e2fc; color:#8351d2; display:grid; place-items:center; }
.wpfs-dashboard-visual .floating-badge strong { display:block; font-size:12px; font-weight:700; color:#12151c; line-height:1.4; }
.wpfs-dashboard-visual .floating-badge small { display:block; font-size:10px; color:#838a91; line-height:1.5; }
.wpfs-dashboard-visual.visual .deco-star { position:absolute; right:-25px; top:0; color:#c9f578; font-size:47px; transform:rotate(-18deg); line-height:1; }

/* 2. Illustration de marque : styles originaux de la homepage. */
.wpfs-brand-art.brand-art { min-height:365px; width:100%; background:#1e222b; border-radius:27px; position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; overflow:hidden; isolation:isolate; padding:20px; }
.wpfs-brand-art.brand-art::before { content:""; position:absolute; width:340px; height:340px; left:-60px; top:-170px; border:65px solid #302d43; border-radius:50%; pointer-events:none; }
.wpfs-brand-art.brand-art::after { content:"✳"; position:absolute; bottom:-85px; right:16px; font-size:270px; color:#c9f578; opacity:.11; line-height:1; pointer-events:none; }
.wpfs-brand-art .brand-big { position:relative; font:700 clamp(47px,6vw,76px)/1 'Space Grotesk',sans-serif; letter-spacing:-.08em; color:#fff; z-index:1; white-space:nowrap; }
.wpfs-brand-art .brand-big span { color:#c9f578; }
.wpfs-brand-art small { position:relative; display:block; color:#ada0ca; font:800 12px/1.55 'DM Sans',sans-serif; letter-spacing:.1em; text-align:center; margin-top:13px; z-index:1; }

@media (max-width: 1085px) {
    .wpfs-dashboard-visual.visual { width:min(520px,100%); margin:0 auto; }
}
@media (max-width: 540px) {
    .wpfs-dashboard-visual.visual { padding:0 10px 20px 13px; }
    .wpfs-dashboard-visual .dashboard { padding:16px; }
    .wpfs-dashboard-visual .dash-status { padding:14px; gap:10px; }
    .wpfs-dashboard-visual .dash-status strong { font-size:16px; }
    .wpfs-dashboard-visual .floating-badge { left:-14px; bottom:0; padding:10px; }
    .wpfs-brand-art.brand-art { min-height:280px; }
    .wpfs-brand-art .brand-big { font-size:55px; }
}
@media (max-width: 360px) {
    .wpfs-dashboard-visual .dash-chip { font-size:9px; padding:4px 6px; }
    .wpfs-dashboard-visual .dash-row .name { font-size:11px; gap:7px; }
    .wpfs-dashboard-visual .dash-bottom { flex-wrap:wrap; }
    .wpfs-dashboard-visual .floating-badge small { max-width:225px; }
    .wpfs-brand-art .brand-big { font-size:46px; }
}