/* CapOrientation — reset, shell, layout, background, utilities */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body.capo-body{
  margin:0;font-family:var(--capo-font);font-size:var(--capo-fs-body);
  line-height:1.6;color:var(--capo-text);background:var(--capo-bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  min-height:100dvh;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--capo-primary);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit}
h1,h2,h3,h4,p,figure{margin:0}
h1{font-size:var(--capo-fs-h1);line-height:1.2;font-weight:700;letter-spacing:-.01em}
h2{font-size:var(--capo-fs-h2);line-height:1.25;font-weight:650;letter-spacing:-.01em}
h3{font-size:var(--capo-fs-h3);line-height:1.3;font-weight:600}
:focus-visible{outline:3px solid var(--capo-focus);outline-offset:2px;border-radius:6px}

/* Premium background: dégradé doux + halos lumineux lents */
.capo-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;
  background:radial-gradient(1200px 700px at 15% -5%,var(--capo-bg-2),transparent 60%),
             radial-gradient(1000px 800px at 100% 0%,#EAF6FF,transparent 55%),
             linear-gradient(180deg,var(--capo-bg),#FBFDFF)}
.capo-bg::before,.capo-bg::after{content:"";position:absolute;border-radius:50%;filter:blur(60px);opacity:.5}
.capo-bg::before{width:520px;height:520px;left:-120px;top:-80px;
  background:radial-gradient(circle,rgba(56,189,248,.45),transparent 70%);animation:capo-float1 26s ease-in-out infinite}
.capo-bg::after{width:460px;height:460px;right:-100px;bottom:-120px;
  background:radial-gradient(circle,rgba(3,105,161,.30),transparent 70%);animation:capo-float2 32s ease-in-out infinite}
@keyframes capo-float1{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,30px)}}
@keyframes capo-float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,-24px)}}

/* Skip link */
.capo-skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--capo-surface);
  color:var(--capo-text);padding:10px 16px;border-radius:var(--capo-radius-sm);box-shadow:var(--capo-shadow-md)}
.capo-skip:focus{left:8px}

/* ---- App shell (conseiller/admin) ---- */
.capo-shell{display:grid;grid-template-columns:264px 1fr;min-height:100dvh}
.capo-sidebar{position:sticky;top:0;height:100dvh;overflow-y:auto;padding:var(--capo-space-5);
  background:var(--capo-glass-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-right:1px solid var(--capo-border);z-index:var(--capo-z-sidebar)}
.capo-main{min-width:0;display:flex;flex-direction:column}
.capo-appbar{position:sticky;top:0;z-index:var(--capo-z-sticky);display:flex;align-items:center;gap:var(--capo-space-4);
  padding:var(--capo-space-4) var(--capo-space-7);
  background:var(--capo-glass-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--capo-border)}
.capo-content{padding:var(--capo-space-7);max-width:1180px;width:100%;margin:0 auto}
.capo-page-head{margin-bottom:var(--capo-space-6)}
.capo-page-head .capo-sub{color:var(--capo-text-secondary);margin-top:6px;max-width:70ch}

/* Container centré (écrans publics) */
.capo-center{min-height:100dvh;display:flex;flex-direction:column}
.capo-wrap{width:100%;max-width:1120px;margin:0 auto;padding:var(--capo-space-6)}

/* Nav sidebar links */
.capo-brand{display:flex;align-items:center;gap:10px;margin-bottom:var(--capo-space-6);font-weight:700;color:var(--capo-text)}
.capo-nav-group{margin:var(--capo-space-5) 0 var(--capo-space-2)}
.capo-nav-group>span{display:block;font-size:var(--capo-fs-xs);text-transform:uppercase;letter-spacing:.08em;
  color:var(--capo-text-muted);font-weight:650;margin:0 8px 6px}
.capo-nav-link{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--capo-radius-sm);
  color:var(--capo-text-secondary);font-size:var(--capo-fs-sm);font-weight:500;transition:background var(--capo-dur-fast),color var(--capo-dur-fast)}
.capo-nav-link:hover{background:var(--capo-primary-50);color:var(--capo-text);text-decoration:none}
.capo-nav-link[aria-current="page"]{background:var(--capo-primary);color:#fff}
.capo-nav-link[aria-current="page"] svg{color:#fff}
.capo-nav-link svg{width:18px;height:18px;flex:0 0 auto;color:var(--capo-text-muted)}

/* Demo banner */
.capo-demobar{display:flex;align-items:center;gap:10px;justify-content:center;flex-wrap:wrap;
  padding:8px 16px;background:var(--capo-warning-50);color:var(--capo-warning);
  border-bottom:1px solid #F1DFC4;font-size:var(--capo-fs-sm);font-weight:600}
.capo-demobar svg{width:16px;height:16px}
.capo-demobar select{font:inherit;font-size:var(--capo-fs-sm);padding:4px 8px;border-radius:8px;
  border:1px solid var(--capo-border-strong);background:#fff;color:var(--capo-text)}

/* Grids & utilities */
.capo-grid{display:grid;gap:var(--capo-space-6)}
.capo-grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.capo-grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.capo-grid-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.capo-row{display:flex;gap:var(--capo-space-4);align-items:center;flex-wrap:wrap}
.capo-row-between{display:flex;gap:var(--capo-space-4);align-items:center;justify-content:space-between;flex-wrap:wrap}
.capo-stack{display:flex;flex-direction:column;gap:var(--capo-space-4)}
.capo-muted{color:var(--capo-text-muted)}
.capo-sec{color:var(--capo-text-secondary)}
.capo-center-text{text-align:center}
.capo-mt-2{margin-top:var(--capo-space-2)}.capo-mt-4{margin-top:var(--capo-space-4)}
.capo-mt-6{margin-top:var(--capo-space-6)}.capo-mb-4{margin-bottom:var(--capo-space-4)}
.capo-mb-6{margin-bottom:var(--capo-space-6)}
.capo-tabnum{font-variant-numeric:tabular-nums}
.capo-hide-desktop{display:none}
.capo-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:var(--capo-fs-sm);font-weight:650;
  color:var(--capo-primary);text-transform:uppercase;letter-spacing:.06em}

/* Responsive */
@media (max-width:1024px){
  .capo-shell{grid-template-columns:1fr}
  .capo-sidebar{display:none}
  .capo-content{padding:var(--capo-space-5)}
  .capo-appbar{padding:var(--capo-space-4)}
  .capo-hide-desktop{display:block}
  .capo-bottomnav{display:flex}
  .capo-main{padding-bottom:76px}
}
@media (min-width:1025px){ .capo-bottomnav{display:none} }

/* Bottom nav (mobile) */
.capo-bottomnav{position:fixed;left:0;right:0;bottom:0;z-index:var(--capo-z-sidebar);
  justify-content:space-around;align-items:center;padding:8px 6px env(safe-area-inset-bottom);
  background:var(--capo-glass-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-top:1px solid var(--capo-border)}
.capo-bottomnav a{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:56px;min-height:44px;
  justify-content:center;color:var(--capo-text-muted);font-size:11px;font-weight:600}
.capo-bottomnav a[aria-current="page"]{color:var(--capo-primary)}
.capo-bottomnav svg{width:22px;height:22px}

@media (prefers-reduced-motion:reduce){
  .capo-bg::before,.capo-bg::after{animation:none}
  *{scroll-behavior:auto!important}
}