/* DIAG MiiS : section de la page Conseil. Tokens issus de style.css (:root). */
.dg { scroll-margin-top:80px; }
.dg-block { padding:104px 0; position:relative; overflow:hidden; }
.dg-dark { background:var(--noir);color:var(--ivoire); }
.dg-dark.dg-block-first { background:var(--noir2);border-top:.5px solid rgba(253,250,247,.08); }
.dg-light { background:var(--ivoire);color:var(--noir); }
.dg-light.dg-alt { background:var(--ivoire2); }
.dg-block h2, .dg-block h3, .dg-block h4 { color:inherit; }
.dg-dark :focus-visible { outline:2px solid var(--citron);outline-offset:3px; }
.dg-light :focus-visible { outline:2px solid var(--noir);outline-offset:3px; }

/* Typo */
.dg-h2 { font-size:clamp(38px,4.8vw,60px);line-height:1.02;margin-bottom:24px; }
.dg-h3 { font-size:clamp(30px,3.6vw,46px);line-height:1.08;margin-bottom:24px; }
.dg-lead { font-size:16px;font-weight:300;line-height:1.75;max-width:520px; }
.dg-dark .dg-lead { color:rgba(253,250,247,.72); }
.dg-text { font-size:16px;font-weight:300;line-height:1.8;max-width:620px;margin-bottom:18px; }
.dg-light .dg-text { color:var(--noir); }
.dg-dark .dg-text { color:rgba(253,250,247,.75); }
.dg-micro { font-size:12px;font-weight:300;margin-top:14px; }
.dg-dark .dg-micro { color:rgba(253,250,247,.55); }
.dg-note { font-size:11px;font-weight:300;letter-spacing:.04em;text-align:center;margin-top:12px; }
.dg-dark .dg-note { color:rgba(253,250,247,.5); }
.dg-light .dg-note { color:var(--gris-texte); }

/* Surlignage : sur fond clair, le citron est un surligneur derrière du noir */
.dg-mark { background:linear-gradient(transparent 56%,var(--citron) 56%);color:var(--noir);padding:0 .08em; }
.dg-dark .dg-mark { background:var(--citron);color:var(--noir);padding:0 .14em; }

/* Boutons */
.dg .btn-primary { transition:background .2s,transform .2s; }
.dg .btn-primary:hover { transform:translateY(-2px); }
.dg-link { color:inherit;font-size:14px;font-weight:500;text-decoration:underline;text-decoration-color:var(--citron);text-decoration-thickness:2px;text-underline-offset:4px; }
.dg-link:hover { background:var(--citron);color:var(--noir); }
.dg-actions { display:flex;gap:20px 28px;flex-wrap:wrap;align-items:center;margin-top:32px; }

/* Apparition au scroll : fondu + translation de 16px, 400ms, une seule fois */
.dg-js .dg-reveal { opacity:0;transform:translateY(16px);transition:opacity .4s ease,transform .4s ease;transition-delay:var(--d,0ms); }
.dg-js .dg-reveal.is-in { opacity:1;transform:none; }

/* Rosace */
.dg-rosace { position:relative;width:100%;max-width:440px;margin:0 auto; }
.dg-rosace-svg { display:block;width:100%;height:auto;overflow:visible; }
.dg-wedge { outline:none;cursor:pointer;transform-box:view-box;transform-origin:50% 50%; }
.dg-js .dg-wedge { transform:scale(0);opacity:0; }
.dg-js .dg-rosace.is-in .dg-wedge { transform:scale(1);opacity:1;transition:transform .62s cubic-bezier(.2,.8,.25,1),opacity .4s ease;transition-delay:calc(var(--i) * 120ms); }
.dg-track { fill:rgba(253,250,247,.09); }
.dg-s { fill:var(--citron); }
.dg-c { fill:var(--citron);fill-opacity:.5; }
.dg-rosace-num { font-family:'Inter',sans-serif;font-size:7px;font-weight:600;letter-spacing:.06em;fill:rgba(253,250,247,.6);text-anchor:middle;dominant-baseline:middle; }
.dg-hit { fill:transparent; }
.dg-wedge:hover .dg-track, .dg-wedge:focus-visible .dg-track { fill:rgba(253,250,247,.18); }
.dg-rosace.is-light .dg-track { fill:rgba(20,18,16,.07); }
.dg-rosace.is-light .dg-wedge:hover .dg-track, .dg-rosace.is-light .dg-wedge:focus-visible .dg-track { fill:rgba(20,18,16,.15); }
.dg-rosace.is-light .dg-s { fill:var(--noir); }
.dg-rosace.is-light .dg-c { fill:var(--citron);fill-opacity:1;stroke:var(--noir);stroke-width:.7; }
.dg-rosace.is-light .dg-rosace-num { fill:var(--gris-texte); }
.dg-rosace-legend { display:flex;justify-content:center;gap:22px;margin-top:14px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase; }
.dg-dark .dg-rosace-legend { color:rgba(253,250,247,.7); }
.dg-light .dg-rosace-legend { color:var(--noir); }
.dg-rosace-legend i { display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:7px;vertical-align:-1px; }
.dg-tip { position:absolute;z-index:3;width:max-content;max-width:230px;padding:12px 14px;border-radius:8px;font-size:12px;line-height:1.5;font-weight:300;pointer-events:none;opacity:0;transition:opacity .15s;background:var(--ivoire);color:var(--noir);box-shadow:0 8px 24px rgba(0,0,0,.25); }
.dg-tip.is-on { opacity:1; }
.dg-tip b { display:block;font-weight:600;font-size:13px;margin-bottom:4px; }
.dg-rosace.is-light .dg-tip { background:var(--noir);color:var(--ivoire); }
.dg-ghost { position:absolute;right:-120px;top:50%;width:560px;max-width:70vw;transform:translateY(-50%);opacity:.09;pointer-events:none; }
.dg-ghost .dg-track { fill:none;stroke:var(--ivoire);stroke-width:.6; }
.dg-ghost .dg-wedge { transform:none !important;opacity:1 !important; }

/* Bloc A */
.dg-a-grid { display:grid;grid-template-columns:1.08fr 1fr;gap:72px;align-items:center; }

/* Bloc B */
.dg-b-grid { display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center; }
.dg-tags { position:relative;min-height:340px; }
.dg-tag { position:absolute;transform:rotate(var(--rot,0deg)) translateY(var(--py,0px));will-change:transform; }
.dg-tag span { display:inline-block;padding:18px 28px;border-radius:6px;font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:700;animation:dg-float 6s ease-in-out infinite;animation-delay:var(--fd,0s); }
.dg-tag-1 { --rot:-5deg;top:6%;left:4%; }
.dg-tag-1 span { background:var(--noir);color:var(--ivoire); }
.dg-tag-2 { --rot:3deg;top:38%;left:34%; }
.dg-tag-2 span { background:var(--citron);color:var(--noir); }
.dg-tag-3 { --rot:-2deg;top:72%;right:0; }
.dg-tag-3 span { background:var(--ivoire);color:var(--noir);border:1px solid rgba(20,18,16,.25); }
@keyframes dg-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }

/* Bloc C */
.dg-axes { display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:40px; }
.dg-axis { grid-column:span 2;background:var(--ivoire);border:.5px solid rgba(20,18,16,.12);border-radius:12px;padding:28px;transition:background .25s,color .25s,transform .25s;display:flex;flex-direction:column; }
.dg-axis-wide { grid-column:span 4; }
.dg-axis-n { font-family:'Cormorant Garamond',serif;font-size:60px;font-weight:700;line-height:1;margin-bottom:14px;transition:color .25s; }
.dg-axis svg { width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:16px; }
.dg-axis-title { font-family:'Inter',sans-serif;font-size:16px;font-weight:600;line-height:1.3;margin-bottom:10px; }
.dg-axis-q { font-size:13px;font-weight:300;line-height:1.65;color:var(--gris-texte);transition:color .25s; }
.dg-axis-q + .dg-axis-q { margin-top:14px;padding-top:14px;border-top:1px solid rgba(20,18,16,.14);transition:border-color .25s,color .25s; }
.dg-axis:hover .dg-axis-q + .dg-axis-q, .dg-axis:focus-within .dg-axis-q + .dg-axis-q { border-top-color:rgba(253,250,247,.22); }
.dg-axis-tag { align-self:flex-start;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;background:var(--citron-pale);color:var(--noir);padding:3px 10px;border-radius:20px;margin-bottom:14px; }
.dg-axis:hover, .dg-axis:focus-within { background:var(--noir);color:var(--ivoire); }
.dg-axis:hover .dg-axis-n, .dg-axis:focus-within .dg-axis-n { color:var(--citron); }
.dg-axis:hover .dg-axis-q, .dg-axis:focus-within .dg-axis-q { color:rgba(253,250,247,.78); }

/* Bloc D */
.dg-duo { display:grid;grid-template-columns:1fr auto 1fr;gap:28px;align-items:stretch;margin:44px 0 40px; }
.dg-panel { background:rgba(253,250,247,.05);border:.5px solid rgba(253,250,247,.16);border-radius:14px;padding:36px;will-change:transform; }
.dg-panel-s { transform:translateX(var(--dx,0px)); }
.dg-panel-c { transform:translateX(calc(var(--dx,0px) * -1)); }
.dg-panel-letter { font-family:'Cormorant Garamond',serif;font-size:72px;font-weight:700;line-height:1;color:var(--citron);margin-bottom:8px; }
.dg-panel-label { font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--citron);margin-bottom:12px;display:block; }
.dg-panel p { font-size:15px;font-weight:300;line-height:1.75;color:rgba(253,250,247,.8);margin-bottom:14px; }
.dg-panel .dg-ex { font-size:13px;font-style:italic;color:rgba(253,250,247,.6);margin-bottom:0; }
.dg-gap { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--citron);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase; }
.dg-gap-line { flex:1;min-height:36px;border-left:2px dashed var(--citron); }
.dg-gap svg { width:36px;height:18px;fill:none;stroke:var(--citron);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round; }
.dg-conclusion { font-size:17px;font-weight:300;line-height:1.75;max-width:720px;color:rgba(253,250,247,.85); }

/* Bloc E */
.dg-e-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-top:40px; }
.dg-gauge { margin-bottom:32px; }
.dg-gauge-bar { display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:30px;position:relative; }
.dg-gauge-seg { height:10px;border-radius:3px;background:rgba(20,18,16,.1); }
.dg-gauge-seg.is-on { background:var(--noir); }
.dg-gauge-labels { display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:8px;font-size:11px;font-weight:500;color:var(--gris-texte); }
.dg-gauge-labels span.is-on { color:var(--noir);font-weight:700; }
.dg-gauge-marker { position:absolute;top:-24px;left:calc(37.5% - 6px);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid var(--noir); }
.dg-gauge-cap { position:absolute;top:-24px;left:calc(37.5% + 12px);font-size:11px;font-weight:600;white-space:nowrap; }
.dg-scores { display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:22px; }
.dg-score { text-align:center;background:var(--ivoire);border:.5px solid rgba(20,18,16,.12);border-radius:8px;padding:10px 4px; }
.dg-score b { display:block;font-family:'Cormorant Garamond',serif;font-size:26px;line-height:1;font-weight:700; }
.dg-score small { font-size:10px;font-weight:600;letter-spacing:.08em;color:var(--gris-texte); }
.dg-cards { display:flex;flex-direction:column;gap:14px; }
.dg-card { background:var(--ivoire);border:.5px solid rgba(20,18,16,.12);border-radius:12px;padding:24px 26px; }
.dg-alt .dg-card { background:var(--ivoire); }
.dg-card h4 { font-family:'Inter',sans-serif;font-size:15px;font-weight:600;line-height:1.3;margin-bottom:6px; }
.dg-card p { font-size:13px;font-weight:300;line-height:1.65;color:var(--gris-texte); }
.dg-frame { border:1.5px solid var(--citron);border-radius:10px;padding:22px 26px;background:var(--ivoire);margin-top:4px; }
.dg-frame p { font-size:14px;font-weight:300;line-height:1.7;color:var(--noir); }
.dg-frame b { font-weight:600; }

/* Bloc F */
.dg-f-inner { position:relative;z-index:1; }
.dg-credit { margin-top:48px;padding-top:20px;border-top:.5px solid rgba(253,250,247,.12);font-size:12px;font-weight:300;color:rgba(253,250,247,.5);line-height:1.6;max-width:720px; }

/* Responsive */
@media (max-width:900px) {
  .dg-block { padding:80px 0; }
  .dg-a-grid, .dg-b-grid, .dg-e-grid { grid-template-columns:1fr;gap:48px; }
  .dg-axes { grid-template-columns:repeat(2,1fr); }
  .dg-axis, .dg-axis-wide { grid-column:span 1; }
  .dg-axis-wide { grid-column:span 2; }
  .dg-tags { min-height:300px; }
  .dg-duo { grid-template-columns:1fr;gap:16px; }
  .dg-panel-s, .dg-panel-c { transform:none; }
  .dg-gap { flex-direction:row;padding:4px 0; }
  .dg-gap-line { border-left:none;border-top:2px dashed var(--citron);min-height:0;min-width:36px; }
  .dg-gap svg { transform:rotate(90deg); }
  .dg-ghost { right:-200px; }
}
@media (max-width:640px) {
  .dg-block { padding:64px 0; }
  .dg-actions { flex-direction:column;align-items:stretch;gap:20px; }
  .dg-actions .btn-primary { display:block;width:100%;text-align:center; }
  .dg-actions .dg-link { text-align:center; }
  .dg-axes { display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-right:-20px;padding-right:20px;padding-bottom:12px;-webkit-overflow-scrolling:touch; }
  .dg-axis, .dg-axis-wide { flex:0 0 82%;scroll-snap-align:start; }
  .dg-tag span { font-size:22px;padding:14px 20px; }
  .dg-tags { min-height:280px; }
  .dg-panel { padding:26px; }
  .dg-scores { grid-template-columns:repeat(5,1fr);gap:6px; }
}

/* Mouvement réduit : tout est affiché dans son état final */
@media (prefers-reduced-motion: reduce) {
  .dg-js .dg-reveal { opacity:1;transform:none;transition:none; }
  .dg-js .dg-wedge { transform:none;opacity:1;transition:none !important; }
  .dg-tag span { animation:none; }
  .dg .btn-primary, .dg-axis, .dg-axis-n, .dg-axis-q { transition:none; }
  .dg .btn-primary:hover { transform:none; }
}
