/* ============================================================
   Atlas Website Studio v2 — CMS visuel (extras)
   Réutilise st-* / sc-* + tokens admin. Préfixe .w2-
   ============================================================ */
.w2-head{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.w2-head-l{flex:1;min-width:220px}
.w2-head-l h2{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.5rem;color:#fff;display:flex;align-items:center;gap:10px}
.w2-head-l h2>svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}
.w2-status{display:flex;gap:14px;flex-wrap:wrap;font-size:.77rem;color:var(--mid);margin-top:6px}
.w2-status b{color:var(--txt);font-weight:600}
.w2-status .ok{color:#4ade80}
.w2-head-r{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.w2-env{display:inline-flex;border:1px solid var(--line2);border-radius:10px;overflow:hidden}
.w2-env button{padding:7px 12px;border:0;background:none;color:var(--dim);font:inherit;font-size:.76rem;font-weight:600;cursor:pointer}
.w2-env button.on{background:linear-gradient(120deg,var(--blue),#1e4cc4);color:#fff}
.w2-env button.on.prod{background:linear-gradient(120deg,#1fb87a,#16a34a)}

/* grouped subnav */
.w2-nav{display:flex;gap:16px;flex-wrap:wrap;padding:8px;margin-bottom:18px;border-radius:15px;background:rgba(6,12,32,.7);border:1px solid var(--line)}
body.theme-light .w2-nav{background:rgba(13,31,92,.045)}
.w2-navgrp{display:flex;align-items:center;gap:4px}
.w2-navgrp-l{font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-right:4px}
.w2-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:10px;font-size:.8rem;font-weight:600;color:var(--mid);cursor:pointer;white-space:nowrap;border:1px solid transparent}
.w2-tab svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.w2-tab:hover{color:var(--txt);background:rgba(96,165,250,.08)}
.w2-tab.on{background:linear-gradient(120deg,var(--blue),#1e4cc4);color:#fff}
.w2-tab .w2-b{min-width:17px;height:17px;padding:0 5px;border-radius:50px;background:var(--gold);color:#2a1c00;font-size:.62rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.w2-navsep{width:1px;background:var(--line);align-self:stretch;margin:2px 0}
@media(max-width:900px){.w2-nav{gap:8px}.w2-navsep{display:none}}

/* balanced KPI grid */
.w2-kgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
@media(max-width:1200px){.w2-kgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.w2-kgrid{grid-template-columns:repeat(2,1fr)}}
.w2-kpi{cursor:pointer}
.w2-kpi:hover{border-color:var(--blue-l)}

/* dashboard blocks */
.w2-blocks{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
@media(max-width:860px){.w2-blocks{grid-template-columns:1fr}}
.w2-stat{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:.83rem;color:var(--mid)}
.w2-stat:last-child{border-bottom:0}
.w2-stat b{color:var(--txt);font-family:'Space Grotesk',sans-serif}
.w2-stat.link{cursor:pointer}
.w2-stat.link:hover b{color:var(--blue-l)}

/* SEO dims */
.w2-dim{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.w2-dim:last-child{border-bottom:0}
.w2-dim .w2-dl{flex:1;font-size:.83rem;color:var(--txt)}
.w2-dim .bar{width:130px;height:6px;border-radius:50px;background:rgba(255,255,255,.08);overflow:hidden;flex-shrink:0}
.w2-dim .bar i{display:block;height:100%;border-radius:50px}
.w2-dim b{width:44px;text-align:right;font-family:'Space Grotesk',sans-serif;flex-shrink:0}

/* media fix before/after */
.w2-ba{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin:12px 0}
.w2-ba .w2-ba-c{padding:14px;border-radius:12px;border:1px solid var(--line);background:rgba(8,16,40,.4);text-align:center}
.w2-ba .w2-ba-c h6{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--dim);margin-bottom:6px}
.w2-ba .w2-ba-c b{font-family:'Space Grotesk',sans-serif;font-size:1.2rem;color:var(--txt)}
.w2-ba .w2-ba-c.after b{color:#4ade80}
.w2-ba .w2-arrow{color:var(--blue-l)}

/* status pill */
.w2-st{display:inline-flex;align-items:center;gap:5px;font-size:.71rem;font-weight:600;padding:3px 9px;border-radius:50px;white-space:nowrap}
.w2-st.pub{background:rgba(34,197,94,.12);color:#4ade80}
.w2-st.draft{background:rgba(148,163,184,.14);color:#94a3b8}
.w2-st.revoir{background:rgba(245,166,35,.13);color:var(--gold)}
.w2-st.valider{background:rgba(96,165,250,.13);color:var(--blue-l)}
.w2-st.prog{background:rgba(168,130,255,.14);color:var(--violet)}

/* preview frame */
.w2-preview{border:1px solid var(--line2);border-radius:14px;overflow:hidden;background:#0a1530}
.w2-preview-top{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.w2-vp{display:inline-flex;border:1px solid var(--line2);border-radius:9px;overflow:hidden}
.w2-vp button{padding:6px 10px;background:none;border:0;color:var(--dim);cursor:pointer}
.w2-vp button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.w2-vp button.on{background:rgba(96,165,250,.16);color:var(--txt)}
.w2-frame{margin:16px auto;background:#fff;border-radius:10px;box-shadow:0 20px 50px -20px rgba(0,0,0,.7);transition:width .3s;overflow:hidden}
.w2-frame-inner{padding:22px;color:#0d1f5c;font-family:Inter,sans-serif}

/* publish stepper */
.w2-steps{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.w2-step{font-size:.72rem;font-weight:600;padding:5px 10px;border-radius:8px;border:1px solid var(--line);color:var(--dim);background:rgba(8,16,40,.4)}
.w2-step.done{color:#4ade80;border-color:rgba(34,197,94,.3)}
.w2-step.now{color:var(--gold);border-color:rgba(245,166,35,.4)}
