/* Composant hero — aperçu d'administration V0.5.2 */
.hero-admin-demo{--demo-ink:#07131d;--demo-navy:#0c2230;--demo-panel:#f4f8fa;--demo-text:#102330;--demo-muted:#6f8794;--demo-line:#d9e4e9;--demo-cyan:#43c5f5;--demo-mint:#9ef0cf;position:relative;min-width:0;color:var(--demo-text)}
.hero-admin-demo-stage{position:relative;min-width:0;padding:clamp(44px,7vw,78px) clamp(4px,1vw,12px) clamp(46px,6vw,66px)}
.hero-admin-demo .demo-browser{position:relative;overflow:hidden;background:var(--demo-panel);border:1px solid rgba(255,255,255,.22);border-radius:clamp(18px,2vw,26px);box-shadow:0 38px 90px rgba(0,0,0,.38);transform:perspective(1400px) rotateY(-4deg) rotateX(1.5deg);transform-origin:center;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease}
.hero-admin-demo:hover .demo-browser{transform:perspective(1400px) rotateY(-2deg) rotateX(.6deg) translateY(-3px);box-shadow:0 44px 100px rgba(0,0,0,.42)}
.hero-admin-demo .demo-browser-bar{display:flex;min-height:48px;align-items:center;gap:10px;padding:0 clamp(14px,2vw,20px);background:#102635}
.hero-admin-demo .demo-browser-dots{display:flex;gap:7px;flex:0 0 auto}
.hero-admin-demo .demo-browser-dots i{display:block;width:8px;height:8px;background:var(--demo-cyan);border-radius:50%}
.hero-admin-demo .demo-browser-dots i:nth-child(2){opacity:.55}.hero-admin-demo .demo-browser-dots i:nth-child(3){opacity:.25}
.hero-admin-demo .demo-domain{min-width:0;overflow:hidden;color:#91a9b6;font-size:clamp(9px,1.1vw,11px);text-overflow:ellipsis;white-space:nowrap}
.hero-admin-demo .demo-browser-body{display:grid;grid-template-columns:clamp(48px,5vw,66px) minmax(0,1fr);min-height:clamp(350px,34vw,430px)}
.hero-admin-demo .demo-sidebar{display:flex;flex-direction:column;align-items:center;gap:clamp(18px,2.2vw,25px);padding-top:24px;background:#0b1b27}
.hero-admin-demo .demo-sidebar b{display:grid;width:34px;height:34px;place-items:center;color:var(--demo-ink);background:var(--demo-cyan);border-radius:11px;font-size:10px;letter-spacing:-.03em}
.hero-admin-demo .demo-sidebar span{display:block;width:20px;height:4px;background:#48606e;border-radius:99px}
.hero-admin-demo .demo-sidebar span.is-active{width:23px;background:var(--demo-cyan);box-shadow:0 0 14px rgba(67,197,245,.42)}
.hero-admin-demo .demo-dashboard{min-width:0;padding:clamp(22px,3.2vw,34px) clamp(16px,3vw,30px);background:var(--demo-panel);transition:background-color .3s,color .3s}
.hero-admin-demo .demo-dashboard-head{display:flex;align-items:center;justify-content:space-between;gap:18px}
.hero-admin-demo .demo-dashboard-head small,.hero-admin-demo .demo-dashboard-head strong{display:block}.hero-admin-demo .demo-dashboard-head small{color:var(--demo-muted);font-size:clamp(9px,1vw,11px)}
.hero-admin-demo .demo-dashboard-head strong{margin-top:4px;color:var(--demo-text);font-size:clamp(14px,1.55vw,19px);line-height:1.15}
.hero-admin-demo .demo-publish{flex:0 0 auto;padding:8px 14px;color:var(--demo-ink);background:var(--demo-mint);border-radius:99px;font-size:clamp(10px,1vw,12px);font-weight:850;box-shadow:0 8px 20px rgba(36,146,112,.14)}
.hero-admin-demo .demo-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:clamp(20px,2.4vw,28px)}
.hero-admin-demo .demo-metrics>span{min-width:0;padding:clamp(12px,1.7vw,17px);background:#fff;border:1px solid var(--demo-line);border-radius:13px;box-shadow:0 8px 25px rgba(14,46,64,.05);transition:transform .25s ease,border-color .25s ease}
.hero-admin-demo .demo-metrics>span:hover{transform:translateY(-2px);border-color:rgba(67,197,245,.62)}
.hero-admin-demo .demo-metrics small,.hero-admin-demo .demo-metrics b{display:block;min-width:0;overflow-wrap:anywhere}.hero-admin-demo .demo-metrics small{color:#77909d;font-size:clamp(8px,.9vw,10px)}
.hero-admin-demo .demo-metrics b{margin-top:7px;color:var(--demo-text);font-size:clamp(10px,1.1vw,13px)}
.hero-admin-demo .demo-chart{position:relative;display:block;height:clamp(130px,14vw,174px);margin-top:clamp(18px,2.2vw,25px);padding:0;overflow:hidden;background:#0e2432;border:1px solid rgba(255,255,255,.06);border-radius:17px}
.hero-admin-demo .demo-chart::before{content:"";position:absolute;inset:18px;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:100% 32%;pointer-events:none}
.hero-admin-demo .demo-chart-bars{position:absolute;inset:20px;display:flex;align-items:end;gap:clamp(7px,1.1vw,12px)}
.hero-admin-demo .demo-chart-bars span{flex:1;height:35%;background:linear-gradient(var(--demo-cyan),#207fa8);border-radius:6px 6px 2px 2px;transform-origin:center bottom}.hero-admin-demo .demo-chart-bars span:nth-child(2){height:52%}.hero-admin-demo .demo-chart-bars span:nth-child(3){height:44%}.hero-admin-demo .demo-chart-bars span:nth-child(4){height:73%}.hero-admin-demo .demo-chart-bars span:nth-child(5){height:62%}.hero-admin-demo .demo-chart-bars span:nth-child(6){height:86%;background:linear-gradient(var(--demo-mint),#36a98a)}.hero-admin-demo .demo-chart-bars span:nth-child(7){height:76%}
.hero-admin-demo .demo-chart-line{position:absolute;inset:20px;width:calc(100% - 40px);height:calc(100% - 40px);overflow:visible}.hero-admin-demo .demo-line-area{fill:url(#hero-demo-line-fill)}.hero-admin-demo .demo-line-path{fill:none;stroke:var(--demo-cyan);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.hero-admin-demo .demo-chart-line circle{fill:var(--demo-mint);stroke:#0e2432;stroke-width:4;vector-effect:non-scaling-stroke}
.hero-admin-demo.cms-demo_chart-bars .demo-chart-line,.hero-admin-demo:not(.cms-demo_chart-line) .demo-chart-line{display:none}.hero-admin-demo.cms-demo_chart-line .demo-chart-bars{display:none}.hero-admin-demo.cms-demo_chart-line .demo-chart-line{display:block}
.hero-admin-demo .floating-feature{position:absolute;z-index:3;min-width:clamp(145px,15vw,172px);padding:14px 16px;color:#fff;background:rgba(10,30,43,.88);border:1px solid rgba(255,255,255,.16);border-radius:16px;backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.25);animation:hero-demo-float 8s ease-in-out infinite;transition:transform .28s ease,border-color .28s ease}
.hero-admin-demo .floating-feature:hover{transform:translateY(-3px);border-color:rgba(67,197,245,.5)}
.hero-admin-demo .floating-feature>span{float:left;display:grid;width:29px;height:29px;margin-right:10px;place-items:center;color:var(--demo-ink);background:var(--demo-mint);border-radius:9px;font-size:11px;font-weight:900}
.hero-admin-demo .floating-feature strong,.hero-admin-demo .floating-feature small{display:block;line-height:1.25}.hero-admin-demo .floating-feature strong{font-size:12px}.hero-admin-demo .floating-feature small{margin-top:4px;color:#a9bdc7;font-size:10px}
.hero-admin-demo .feature-admin{top:7px;left:-16px}.hero-admin-demo .feature-speed{right:-22px;top:43%;animation-delay:-2.6s}.hero-admin-demo .feature-secure{left:8%;bottom:0;animation-delay:-5.2s}
.hero-admin-demo.cms-demo_badge_admin-hide .feature-admin,.hero-admin-demo.cms-demo_badge_performance-hide .feature-speed,.hero-admin-demo.cms-demo_badge_security-hide .feature-secure{display:none}
.hero-admin-demo.cms-demo_variant-dark{--demo-panel:#0b1d29;--demo-text:#f5fbfd;--demo-muted:#91aab7;--demo-line:rgba(255,255,255,.13)}
.hero-admin-demo.cms-demo_variant-dark .demo-metrics>span{background:#122a39}.hero-admin-demo.cms-demo_variant-dark .demo-dashboard{background:linear-gradient(145deg,#0a1d29,#102e40)}
.hero-admin-demo.is-entering .demo-browser{animation:hero-demo-window-in .78s cubic-bezier(.22,1,.36,1) both}
.hero-admin-demo.is-entering .demo-metrics>span{animation:hero-demo-item-in .48s cubic-bezier(.22,1,.36,1) both}.hero-admin-demo.is-entering .demo-metrics>span:nth-child(2){animation-delay:.08s}.hero-admin-demo.is-entering .demo-metrics>span:nth-child(3){animation-delay:.16s}
.hero-admin-demo.is-entering .demo-chart-bars span{animation:hero-demo-bar-in .72s cubic-bezier(.22,1,.36,1) both}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(2){animation-delay:.05s}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(3){animation-delay:.1s}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(4){animation-delay:.15s}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(5){animation-delay:.2s}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(6){animation-delay:.25s}.hero-admin-demo.is-entering .demo-chart-bars span:nth-child(7){animation-delay:.3s}
.hero-admin-demo.is-entering .floating-feature{animation:hero-demo-badge-in .58s .28s cubic-bezier(.22,1,.36,1) both}.hero-admin-demo.is-entering .feature-speed{animation-delay:.38s}.hero-admin-demo.is-entering .feature-secure{animation-delay:.48s}
@keyframes hero-demo-window-in{from{opacity:0;transform:perspective(1400px) rotateY(-4deg) rotateX(1.5deg) translateY(22px) scale(.975)}to{opacity:1;transform:perspective(1400px) rotateY(-4deg) rotateX(1.5deg)}}
@keyframes hero-demo-item-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes hero-demo-bar-in{from{opacity:.25;transform:scaleY(.08)}to{opacity:1;transform:scaleY(1)}}
@keyframes hero-demo-badge-in{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes hero-demo-float{50%{translate:0 -4px}}
@media(max-width:1180px){.hero-admin-demo .feature-admin{left:-4px}.hero-admin-demo .feature-speed{right:-5px}}
@media(max-width:1099px){.home-hero-grid{grid-template-columns:1fr}.home-hero-copy{max-width:790px}.hero-demo{width:min(100%,720px);margin-inline:auto}.hero-admin-demo{width:100%;margin-inline:auto}.hero-admin-demo .demo-browser{transform:none}.hero-admin-demo:hover .demo-browser{transform:translateY(-2px)}.hero-admin-demo .demo-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-admin-demo .demo-metrics>span:nth-child(n+2){display:block}}
@media(max-width:700px){.hero-admin-demo-stage{padding:28px 0 14px}.hero-admin-demo .demo-browser{border-radius:18px}.hero-admin-demo .demo-browser-body{grid-template-columns:46px minmax(0,1fr);min-height:330px}.hero-admin-demo .demo-sidebar{gap:19px}.hero-admin-demo .demo-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-admin-demo .demo-metrics>span:nth-child(n+2){display:block}.hero-admin-demo .floating-feature{display:none}.hero-admin-demo .demo-chart{height:135px}}
@media(max-width:430px){.hero-admin-demo .demo-browser-bar{min-height:43px;padding-inline:12px}.hero-admin-demo .demo-browser-body{grid-template-columns:42px minmax(0,1fr);min-height:300px}.hero-admin-demo .demo-sidebar{padding-top:18px;gap:17px}.hero-admin-demo .demo-sidebar b{width:29px;height:29px;font-size:9px}.hero-admin-demo .demo-sidebar span{width:17px}.hero-admin-demo .demo-dashboard{padding:18px 12px}.hero-admin-demo .demo-publish{padding:7px 9px}.hero-admin-demo .demo-metrics{gap:6px;margin-top:18px}.hero-admin-demo .demo-metrics>span{padding:10px 8px}.hero-admin-demo .demo-chart{height:116px;margin-top:15px}.hero-admin-demo .demo-chart-bars{inset:16px;gap:5px}.hero-admin-demo .demo-chart-line{inset:16px;width:calc(100% - 32px);height:calc(100% - 32px)}}
@media(max-width:360px){.hero-admin-demo .demo-dashboard-head{align-items:flex-start;gap:8px}.hero-admin-demo .demo-publish{font-size:9px}.hero-admin-demo .demo-metrics{grid-template-columns:1fr}.hero-admin-demo .demo-metrics>span:nth-child(n+2){display:none}.hero-admin-demo .demo-chart{height:108px}}
@media(prefers-reduced-motion:reduce){.hero-admin-demo *{animation:none!important;transition:none!important;translate:none!important}.hero-admin-demo .demo-browser,.hero-admin-demo:hover .demo-browser{transform:none}.hero-admin-demo .floating-feature:hover,.hero-admin-demo .demo-metrics>span:hover{transform:none}}