/* Lifemoz — Tendance RSE — Front CSS (v1.1) */
.lfmz-rse {
    /* Charte (strict) */
    --c-violet: #5B2D90;
    --c-violet-soft: #6e36b0;
    --c-beige: #A8957A;
    --c-turquoise: #2EBFC5;
    --c-oui: #92D050;
    --c-ambre: #FFC000;
    --c-non: #FF0000;
    --c-gris: #BFBFBF;
    --c-bg: #EFEDE5;
    --c-card: #FFFFFF;
    --c-text: #1A1A1A;
    --c-muted: #6B6B6B;
    --c-border: #E2DFD6;
    --c-border-soft: #EAE7DE;

    /* System */
    --radius-lg: 20px;
    --radius-md: 14px;
    --radius-sm: 10px;
    --shadow-card: 0 1px 0 rgba(0,0,0,.02), 0 10px 32px rgba(91,45,144,.07);
    --shadow-pop:  0 1px 0 rgba(0,0,0,.02), 0 20px 48px rgba(91,45,144,.12);
    --shadow-btn:  0 6px 18px rgba(91,45,144,.18);
    --ease: cubic-bezier(.2,.7,.2,1);

    font-family: Arial, "Helvetica Neue", Helvetica, system-ui, sans-serif;
    color: var(--c-text);
    background:
        radial-gradient(1200px 600px at -10% -20%, rgba(91,45,144,.06), transparent 60%),
        radial-gradient(900px 500px at 110% 110%, rgba(46,191,197,.06), transparent 60%),
        var(--c-bg);
    padding: 36px 28px;
    border-radius: var(--radius-lg);
    line-height: 1.5;
    font-size: 15px;
}
.lfmz-rse * { box-sizing: border-box; }
.lfmz-rse__stage--hidden { display: none; }
.lfmz-rse-hidden { display: none !important; }
.lfmz-rse-h1 { font-size: 26px; font-weight: 500; margin: 0 0 8px; letter-spacing: -.2px; }
.lfmz-rse-lede { color: var(--c-muted); margin: 0 0 24px; font-size: 15px; }

/* ---------- Card ---------- */
.lfmz-rse-card {
    background: var(--c-card);
    border: 1px solid var(--c-border-soft);
    border-radius: var(--radius-md);
    padding: 28px;
    min-width: 0;
    box-shadow: var(--shadow-card);
}

/* ---------- Intro ---------- */
.lfmz-rse-intro {
    max-width: 680px;
    margin: 0 auto;
    padding: 36px 32px;
    background:
        radial-gradient(900px 260px at -20% -40%, rgba(91,45,144,.07), transparent 60%),
        radial-gradient(900px 260px at 120% 140%, rgba(46,191,197,.08), transparent 60%),
        #fff;
}
.lfmz-rse-intro .lfmz-rse-h1 { font-size: 30px; }
.lfmz-rse-intro__pillars { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.lfmz-rse-intro__stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 12px;
    margin: 16px 0 28px;
    padding: 18px;
    background: linear-gradient(135deg, rgba(91,45,144,.05), rgba(46,191,197,.05));
    border-radius: var(--radius-sm);
    border: 1px solid rgba(91,45,144,.08);
}
.lfmz-rse-stat { display: flex; flex-direction: column; gap: 2px; }
.lfmz-rse-stat strong { font-size: 22px; font-weight: 500; color: var(--c-violet); letter-spacing: -.3px; }
.lfmz-rse-stat span { font-size: 11px; color: var(--c-muted); letter-spacing: .3px; text-transform: uppercase; }

.lfmz-rse-form { display: flex; flex-direction: column; gap: 18px; margin-top: 8px; }
.lfmz-rse-field { display: flex; flex-direction: column; gap: 6px; }
.lfmz-rse-field label {
    font-size: 11px;
    font-weight: 500;
    color: var(--c-muted);
    letter-spacing: .4px;
    text-transform: uppercase;
}
.lfmz-rse-field input {
    border: 1px solid var(--c-border);
    border-radius: var(--radius-sm);
    padding: 13px 14px;
    font-size: 15px;
    background: #fff;
    color: var(--c-text);
    transition: box-shadow .2s var(--ease), border-color .2s var(--ease);
    font-family: inherit;
}
.lfmz-rse-field input:focus { outline: none; border-color: var(--c-violet); box-shadow: 0 0 0 4px rgba(91,45,144,.15); }
.lfmz-rse-rgpd { color: var(--c-muted); font-size: 12.5px; margin: 8px 0 0; line-height: 1.5; }
.lfmz-rse-footer { margin-top: 24px; color: var(--c-muted); }
.lfmz-rse-footer a { color: var(--c-violet); text-decoration: none; }
.lfmz-rse-footer a:hover { text-decoration: underline; }

/* ---------- Buttons ---------- */
.lfmz-rse-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.lfmz-rse-actions--column { flex-direction: column; }
.lfmz-rse-btn {
    appearance: none;
    border: 1px solid var(--c-border);
    padding: 12px 20px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .1px;
    transition: transform .15s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
    background: #fff;
    color: var(--c-text);
    font-family: inherit;
}
.lfmz-rse-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,.06); }
.lfmz-rse-btn:active { transform: translateY(0); }
.lfmz-rse-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.lfmz-rse-btn--primary {
    background: linear-gradient(135deg, var(--c-violet) 0%, var(--c-violet-soft) 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: var(--shadow-btn);
}
.lfmz-rse-btn--primary:hover { box-shadow: 0 10px 24px rgba(91,45,144,.28); }
.lfmz-rse-btn--primary:disabled { background: var(--c-violet); opacity: .35; box-shadow: none; }
.lfmz-rse-btn--secondary { background: #fff; border-color: var(--c-border); }
.lfmz-rse-btn--secondary:hover { border-color: var(--c-violet); color: var(--c-violet); }
.lfmz-rse-btn--ghost { background: transparent; border-color: transparent; color: var(--c-muted); }
.lfmz-rse-btn--ghost:hover { color: var(--c-non); box-shadow: none; }

/* ---------- Layout questionnaire ---------- */
.lfmz-rse-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    gap: 36px;
    align-items: start;
}
.lfmz-rse-layout__left, .lfmz-rse-layout__right { min-width: 0; }
.lfmz-rse-layout__left { position: sticky; top: 16px; }
@media (max-width: 1023px) { .lfmz-rse-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; } }
@media (max-width: 767px)  { .lfmz-rse-layout { grid-template-columns: 1fr; } .lfmz-rse-layout__left { position: static; } }

/* ---------- Rosace ---------- */
.lfmz-rse-rosace-wrapper {
    position: relative;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 540px;
    margin: 0 auto;
    filter: drop-shadow(0 12px 28px rgba(91,45,144,.10));
}
.lfmz-rse-rosace-wrapper--lg { max-width: 620px; filter: drop-shadow(0 18px 42px rgba(91,45,144,.14)); }
.lfmz-rse-rosace { width: 100%; height: 100%; display: block; }
.lfmz-rse-rosace-center {
    position: absolute; inset: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; pointer-events: none; padding: 36% 28%;
}
.lfmz-rse-rosace-center__company { font-size: 14px; font-weight: 500; color: var(--c-text); margin-bottom: 4px; line-height: 1.2; }
.lfmz-rse-rosace-center__period  { font-size: 11px; color: var(--c-muted); letter-spacing: .3px; }
.lfmz-rse-rosace-center__progress{
    font-size: 10px;
    color: var(--c-violet);
    margin-top: 10px;
    font-weight: 500;
    letter-spacing: .4px;
    text-transform: uppercase;
    padding: 3px 10px;
    background: rgba(91,45,144,.08);
    border-radius: 999px;
}

.lfmz-rse-rosace .sector {
    cursor: pointer;
    stroke: #fff;
    stroke-width: 1.2;
    transition: opacity .15s var(--ease), filter .15s var(--ease);
}
.lfmz-rse-rosace .sector:hover { opacity: .82; filter: brightness(1.08); }
.lfmz-rse-rosace .sector.is-current { stroke: #1A1A1A; stroke-width: 2.5; }
.lfmz-rse-rosace .sector-number {
    fill: #ffffff;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
    pointer-events: none;
    paint-order: stroke;
    stroke: rgba(0, 0, 0, .28);
    stroke-width: 0.6px;
}
.lfmz-rse-rosace .pillar-arc-label {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* ---------- Legend ---------- */
.lfmz-rse-legend {
    display: flex; flex-wrap: wrap; gap: 14px;
    margin-top: 18px;
    justify-content: center;
    font-size: 12px;
    color: var(--c-muted);
}
.lfmz-rse-legend--stacked { flex-direction: column; align-items: flex-start; gap: 10px; }
.lfmz-rse-legend__item { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; background: #fff; border: 1px solid var(--c-border-soft); border-radius: 999px; }
.lfmz-rse-legend li { display: flex; align-items: center; gap: 10px; list-style: none; }
.lfmz-rse-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; box-shadow: 0 0 0 2px rgba(0,0,0,.04); }

/* ---------- Question card ---------- */
.lfmz-rse-question { padding: 32px; }
.lfmz-rse-question__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; gap: 12px; }
.lfmz-rse-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .3px;
    text-transform: uppercase;
}
.lfmz-rse-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.7); }
.lfmz-rse-pill[data-pillar="gouvernance"]   { background: var(--c-violet); }
.lfmz-rse-pill[data-pillar="environnement"] { background: var(--c-beige); }
.lfmz-rse-pill[data-pillar="social"]        { background: var(--c-turquoise); }
.lfmz-rse-question__index { color: var(--c-muted); font-size: 12px; font-weight: 500; }

/* Slim progress bar above the question title */
.lfmz-rse-progress { position: relative; height: 3px; background: var(--c-border-soft); border-radius: 999px; margin-bottom: 22px; overflow: hidden; }
.lfmz-rse-progress__bar {
    position: absolute; inset: 0;
    width: 0;
    background: linear-gradient(90deg, var(--c-violet), var(--c-turquoise));
    border-radius: 999px;
    transition: width .35s var(--ease);
}

.lfmz-rse-question__title { font-size: 19px; font-weight: 500; margin: 0 0 10px; line-height: 1.4; letter-spacing: -.1px; }
.lfmz-rse-question__help { color: var(--c-muted); margin: 0 0 22px; font-size: 13.5px; line-height: 1.55; }

/* ---------- Answers ---------- */
.lfmz-rse-answers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}
.lfmz-rse-answer {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px;
    background: #fff;
    border: 1.5px solid var(--c-border);
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 14px;
    min-width: 0;
    text-align: left;
    font-family: inherit;
    transition: transform .15s var(--ease), background .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.lfmz-rse-answer:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,.05); }
.lfmz-rse-answer__bullet {
    width: 16px; height: 16px;
    border-radius: 50%;
    border: 2px solid currentColor;
    flex: none;
    position: relative;
    transition: background .2s var(--ease);
}
.lfmz-rse-answer[data-answer="oui"]          { color: var(--c-oui); }
.lfmz-rse-answer[data-answer="oui"]:hover    { border-color: var(--c-oui); }
.lfmz-rse-answer[data-answer="en_cours"]     { color: var(--c-ambre); }
.lfmz-rse-answer[data-answer="en_cours"]:hover{ border-color: var(--c-ambre); }
.lfmz-rse-answer[data-answer="non_concerne"] { color: var(--c-ambre); }
.lfmz-rse-answer[data-answer="non_concerne"]:hover{ border-color: var(--c-ambre); }
.lfmz-rse-answer[data-answer="non"]          { color: var(--c-non); }
.lfmz-rse-answer[data-answer="non"]:hover    { border-color: var(--c-non); }
.lfmz-rse-answer .lfmz-rse-answer__label { color: var(--c-text); font-weight: 500; }

.lfmz-rse-answer.is-selected { transform: none; }
.lfmz-rse-answer.is-selected[data-answer="oui"]          { background: var(--c-oui);   border-color: var(--c-oui);   box-shadow: 0 6px 18px rgba(146,208,80,.30); }
.lfmz-rse-answer.is-selected[data-answer="en_cours"]     { background: var(--c-ambre); border-color: var(--c-ambre); box-shadow: 0 6px 18px rgba(255,192,0,.30); }
.lfmz-rse-answer.is-selected[data-answer="non_concerne"] { background: var(--c-ambre); border-color: var(--c-ambre); box-shadow: 0 6px 18px rgba(255,192,0,.30); }
.lfmz-rse-answer.is-selected[data-answer="non"]          { background: var(--c-non);   border-color: var(--c-non);   box-shadow: 0 6px 18px rgba(255,0,0,.22); }
.lfmz-rse-answer.is-selected .lfmz-rse-answer__label,
.lfmz-rse-answer.is-selected .lfmz-rse-answer__bullet { color: #fff; }
.lfmz-rse-answer.is-selected .lfmz-rse-answer__bullet { background: #fff; border-color: #fff; }
.lfmz-rse-answer.is-selected .lfmz-rse-answer__bullet::after {
    content: "";
    position: absolute; top: 50%; left: 50%;
    width: 6px; height: 6px;
    background: currentColor;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

/* ---------- Sub-questions ---------- */
.lfmz-rse-sub { margin-bottom: 20px; min-width: 0; padding: 16px; background: rgba(91,45,144,.04); border-radius: var(--radius-sm); border: 1px solid rgba(91,45,144,.10); }
.lfmz-rse-sub:empty { display: none; }
.lfmz-rse-sub__label { font-weight: 500; margin: 0 0 12px; font-size: 13px; color: var(--c-violet); letter-spacing: .2px; }
.lfmz-rse-sub__error { margin: 10px 0 0; font-size: 13px; font-weight: 500; color: #c0392b; }
.lfmz-rse-sub__error::before { content: "⚠ "; }
.lfmz-rse-answer-error { margin: 12px 0 0; font-size: 13px; font-weight: 500; color: #c0392b; }
.lfmz-rse-answer-error::before { content: "⚠ "; }
.lfmz-rse-answer-error[hidden] { display: none; }
.lfmz-rse-sub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 8px;
}
.lfmz-rse-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--c-border);
    border-radius: var(--radius-sm);
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.35;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
    transition: border-color .15s var(--ease), background .15s var(--ease);
}
.lfmz-rse-checkbox:hover { border-color: var(--c-violet); }
.lfmz-rse-checkbox:has(input:checked) { background: rgba(91,45,144,.05); border-color: var(--c-violet); }
.lfmz-rse-checkbox input { accent-color: var(--c-violet); flex: none; margin-top: 2px; width: 16px; height: 16px; }
.lfmz-rse-select {
    width: 100%;
    max-width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--c-border);
    border-radius: var(--radius-sm);
    background: #fff;
    font-size: 14px;
    font-family: inherit;
    color: var(--c-text);
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.lfmz-rse-select:focus { outline: none; border-color: var(--c-violet); box-shadow: 0 0 0 4px rgba(91,45,144,.15); }
.lfmz-rse-sub-other {
    display: block;
    width: 100%;
    max-width: 100%;
    margin-top: 10px;
    padding: 12px 14px;
    border: 1px solid var(--c-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: inherit;
    box-sizing: border-box;
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.lfmz-rse-sub-other:focus { outline: none; border-color: var(--c-violet); box-shadow: 0 0 0 4px rgba(91,45,144,.15); }

/* ---------- Nav ---------- */
.lfmz-rse-nav { display: flex; justify-content: space-between; gap: 10px; margin-top: 4px; }

/* ---------- Result ---------- */
.lfmz-rse-result__header { text-align: center; margin-bottom: 32px; padding: 0 8px; }
.lfmz-rse-result__header .lfmz-rse-h1 { font-size: 32px; }
.lfmz-rse-result__body {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 36px;
    align-items: start;
    background: #fff;
    border-radius: var(--radius-md);
    padding: 32px;
    box-shadow: var(--shadow-card);
    border: 1px solid var(--c-border-soft);
}
@media (max-width: 767px) { .lfmz-rse-result__body { grid-template-columns: 1fr; padding: 20px; gap: 24px; } }
.lfmz-rse-result__sidebar h3 { font-size: 11px; font-weight: 500; margin: 0 0 14px; color: var(--c-muted); text-transform: uppercase; letter-spacing: .5px; }
.lfmz-rse-result__sidebar ul { padding: 0; margin: 0 0 24px; }
.lfmz-rse-result__sidebar li { padding: 8px 12px; background: #fff; border: 1px solid var(--c-border-soft); border-radius: var(--radius-sm); font-size: 13px; color: var(--c-text); margin-bottom: 8px; }

/* small responsive niceties */
@media (max-width: 600px) {
    .lfmz-rse { padding: 20px 14px; }
    .lfmz-rse-card { padding: 20px; }
    .lfmz-rse-intro { padding: 28px 22px; }
    .lfmz-rse-intro .lfmz-rse-h1 { font-size: 24px; }
    .lfmz-rse-question { padding: 22px; }
}
