:root{--demo-ciel: color-mix(in srgb, var(--zego-blue-900) 42%, black);--demo-mur: color-mix(in srgb, var(--zego-blue-900) 62%, var(--surface-sunken));--demo-sol: color-mix(in srgb, var(--zego-blue-800) 28%, var(--demo-mur));--demo-lueur: color-mix(in srgb, var(--brand-primary) 20%, transparent);--demo-lueur-sol: color-mix(in srgb, var(--zego-blue-700) 40%, transparent);--demo-ambiance: radial-gradient(68% 46% at 50% 40%, var(--demo-lueur), transparent 70%), radial-gradient(130% 55% at 50% 116%, var(--demo-lueur-sol), transparent 68%), linear-gradient(180deg, var(--demo-ciel) 0%, var(--demo-mur) 52%, var(--demo-sol) 100%);--demo-chassis: color-mix(in srgb, var(--surface-raised) 88%, black);--demo-chassis-detail: var(--text-faint);--demo-coque-haut: color-mix(in srgb, var(--text) 16%, var(--demo-chassis));--demo-coque-bas: color-mix(in srgb, black 42%, var(--demo-chassis));--demo-arete-claire: color-mix(in srgb, var(--text) 22%, transparent);--demo-arete-sombre: color-mix(in srgb, black 55%, transparent);--demo-lisere: color-mix(in srgb, var(--text) 14%, transparent);--demo-ombre-contact: color-mix(in srgb, black 55%, transparent);--demo-ombre-portee: color-mix(in srgb, black 45%, transparent);--demo-glissement: .44s;--demo-arrivee: .62s}body{margin:0;background:var(--demo-ciel);color:var(--text);font-family:var(--font-sans)}body:before{content:"";position:fixed;inset:0;z-index:0;background:var(--demo-ambiance);animation:d-parution .9s var(--ease-out) both}.d-page,.d-centre{position:relative;z-index:1}@keyframes d-parution{0%{opacity:0}}@keyframes d-poser{0%{opacity:0;transform:translateY(34px)}}@keyframes d-descendre{0%{opacity:0;transform:translateY(-100%)}}@keyframes d-monter{0%{opacity:0;transform:translate(-50%,28px)}}.d-centre{min-height:100dvh;display:grid;place-content:center;justify-items:center;padding:var(--space-8);text-align:center}.d-carte{display:grid;justify-items:center;gap:var(--space-4);max-width:34rem;padding:var(--space-12) var(--space-10) var(--space-10);border:1px solid var(--border);border-radius:calc(var(--radius-xl) * 1.5);background:var(--surface);box-shadow:var(--shadow-lg);animation:d-poser var(--demo-arrivee) var(--ease-out) both}.d-carte__embleme{display:grid;place-items:center;width:var(--space-16);height:var(--space-16);margin-bottom:var(--space-2);border-radius:var(--radius-full);background:var(--brand-primary-soft);color:var(--brand-primary-strong)}.d-carte__embleme svg{width:var(--space-8);height:var(--space-8)}.d-carte__signature{margin-top:var(--space-6);padding-top:var(--space-5);width:100%;border-top:1px solid var(--border)}.d-centre__texte{margin:0;max-width:42ch;color:var(--text-muted);font-size:var(--fs-xl);line-height:var(--lh-normal)}.d-fin__titre{margin:0;font-size:var(--fs-3xl);font-weight:var(--fw-bold);line-height:var(--lh-snug);letter-spacing:-.01em}.d-fin__bouton{margin-top:var(--space-2);min-height:var(--touch-target);padding:0 var(--space-8);border:0;border-radius:var(--radius-full);background:var(--brand-action);color:var(--text-on-primary);font:var(--fw-semibold) var(--fs-lg) / 1 var(--font-sans);cursor:pointer;box-shadow:var(--shadow);transition:background .16s var(--ease-out),transform .16s var(--ease-out)}.d-fin__bouton:hover{background:var(--brand-primary-hover);transform:translateY(-1px)}.d-fin__bouton:active{transform:translateY(0)}.d-carte--attente{gap:var(--space-6);padding:var(--space-16) var(--space-12)}.d-jauge{position:relative;overflow:hidden;width:var(--space-16);height:var(--space-1);border-radius:var(--radius-full);background:var(--surface-sunken)}.d-jauge__fil{position:absolute;inset:0;border-radius:inherit;background:var(--brand-primary);animation:d-jauge 1.4s var(--ease-in-out) infinite}@keyframes d-jauge{0%{transform:translate(-100%)}to{transform:translate(100%)}}.d-page{height:100dvh;display:grid;grid-template-rows:auto 1fr;overflow:hidden}.d-bandeau{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:color-mix(in srgb,var(--surface) 70%,transparent);border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent);font-size:var(--fs-sm);color:var(--text-muted);animation:d-descendre var(--demo-arrivee) var(--ease-out) both}.d-bandeau__enseigne{font-weight:var(--fw-semibold);color:var(--text)}.d-bandeau__mention{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);background:var(--brand-primary-soft);color:var(--brand-primary-strong);font-size:var(--fs-xs);font-weight:var(--fw-medium)}.d-bandeau__point{width:var(--space-2);height:var(--space-2);border-radius:var(--radius-full);background:var(--brand-primary);animation:d-battement 2.4s var(--ease-in-out) infinite}@keyframes d-battement{50%{opacity:.3}}.d-bandeau__sep{width:var(--space-1);height:var(--space-1);border-radius:var(--radius-full);background:var(--border-strong)}.d-scene{position:relative;overflow:hidden}.d-scene:before,.d-scene:after{content:"";position:absolute;top:0;bottom:0;z-index:2;pointer-events:none;transition:opacity var(--demo-glissement) var(--ease-out)}.d-scene:before{left:0;width:var(--demo-voile-g, 0);opacity:var(--demo-voile-g-o, 0);background:var(--demo-ambiance);background-attachment:fixed;-webkit-mask-image:linear-gradient(to right,black 30%,transparent);mask-image:linear-gradient(to right,black 30%,transparent)}.d-scene:after{right:0;width:var(--demo-voile-d, 0);opacity:var(--demo-voile-d-o, 0);background:var(--demo-ambiance);background-attachment:fixed;-webkit-mask-image:linear-gradient(to left,black 30%,transparent);mask-image:linear-gradient(to left,black 30%,transparent)}.d-piste{position:absolute;left:50%;top:var(--space-6);bottom:calc(var(--space-16) * 2);display:flex;align-items:stretch;gap:var(--space-8);will-change:transform}.d-piste[data-pret]{transition:transform var(--demo-glissement) var(--ease-out)}.d-zone{position:relative;flex:0 0 auto;opacity:.6;scale:.92;transition:opacity var(--demo-glissement) var(--ease-out),scale var(--demo-glissement) var(--ease-out)}.d-zone[data-actif]{opacity:1;scale:1}.d-zone__pose{position:absolute;inset:0;animation:d-poser var(--demo-arrivee) var(--ease-out) both;animation-delay:calc(.16s + var(--rang, 0) * 90ms)}.d-zone__aller{position:absolute;inset:0;z-index:1;padding:0;border:0;background:transparent;cursor:pointer}.d-zone__hors-ecran{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.d-zone__aller:focus-visible{outline-offset:calc(var(--space-1) * -1);border-radius:var(--radius-lg)}.d-appareil{position:absolute;top:50%;left:50%;display:flex;flex-direction:column;align-items:center;transform-origin:center center}.d-appareil__corps{position:relative;background:linear-gradient(170deg,var(--demo-coque-haut) 0%,var(--demo-chassis) 38%,var(--demo-coque-bas) 100%);box-shadow:inset 0 2px 0 var(--demo-arete-claire),inset 0 -3px 0 var(--demo-arete-sombre),0 0 0 2px var(--demo-lisere),0 6px 10px var(--demo-ombre-contact),0 40px 80px -20px var(--demo-ombre-portee)}.d-appareil__ecran{position:relative;overflow:hidden;background:var(--surface);box-shadow:0 0 0 2px var(--demo-arete-sombre)}.d-appareil__iframe{display:block;border:0}.d-appareil__pied{position:relative;background:linear-gradient(100deg,var(--demo-chassis) 0%,var(--demo-coque-bas) 60%);box-shadow:0 6px 10px var(--demo-ombre-contact)}.d-appareil__pied:before{content:"";position:absolute;left:50%;bottom:0;transform:translate(-50%);background:inherit;box-shadow:0 6px 12px var(--demo-ombre-contact)}.d-appareil--tablette .d-appareil__corps{padding:var(--space-10) var(--space-16);border-radius:calc(var(--radius-xl) * 3)}.d-appareil--tablette .d-appareil__ecran{border-radius:var(--radius-lg)}.d-appareil--tablette .d-appareil__corps:before{content:"";position:absolute;top:50%;left:var(--space-6);width:var(--space-3);height:var(--space-3);transform:translateY(-50%);border-radius:var(--radius-full);background:var(--demo-chassis-detail);opacity:.5}.d-appareil--tablette .d-appareil__pied{display:none}.d-appareil--borne .d-appareil__corps{padding:var(--space-16) var(--space-12);border-radius:calc(var(--radius-xl) * 2) calc(var(--radius-xl) * 2) 0 0}.d-appareil--borne .d-appareil__ecran{border-radius:var(--radius-md)}.d-appareil--borne .d-appareil__pied{width:82%;height:calc(var(--space-16) * 3);border-radius:0 0 var(--radius-lg) var(--radius-lg)}.d-appareil--borne .d-appareil__pied:before{bottom:calc(var(--space-16) * 1.2);width:34%;height:var(--space-3);border-radius:var(--radius-full);background:var(--demo-chassis-detail);box-shadow:none;opacity:.45}.d-appareil--televiseur .d-appareil__corps{padding:var(--space-6);border-radius:var(--radius-lg)}.d-appareil--televiseur .d-appareil__ecran{border-radius:var(--radius-xs)}.d-appareil--televiseur .d-appareil__pied{width:calc(var(--space-16) * 2.5);height:calc(var(--space-16) * 1.1);border-radius:0 0 var(--radius-sm) var(--radius-sm)}.d-appareil--televiseur .d-appareil__pied:before{bottom:calc(var(--space-6) * -1);width:420%;height:var(--space-6);border-radius:var(--radius-full)}.d-appareil--moniteur .d-appareil__corps{padding:var(--space-6);border-radius:var(--radius-lg)}.d-appareil--moniteur .d-appareil__ecran{border-radius:var(--radius-xs)}.d-appareil--moniteur .d-appareil__pied{width:calc(var(--space-16) * 1.6);height:calc(var(--space-16) * .9);border-radius:0 0 var(--radius-sm) var(--radius-sm)}.d-appareil--moniteur .d-appareil__pied:before{bottom:calc(var(--space-5) * -1);width:380%;height:var(--space-5);border-radius:var(--radius-full)}.d-nav{position:fixed;left:50%;bottom:var(--space-8);transform:translate(-50%);display:flex;gap:var(--space-1);padding:var(--space-1);border:1px solid color-mix(in srgb,var(--text) 10%,transparent);border-radius:var(--radius-full);background:var(--surface-overlay);box-shadow:inset 0 1px 0 var(--demo-arete-claire),0 18px 40px -12px var(--demo-ombre-portee),0 2px 6px var(--demo-ombre-contact);animation:d-monter var(--demo-arrivee) var(--ease-out) both;animation-delay:.42s}.d-nav__curseur{position:absolute;top:var(--space-1);bottom:var(--space-1);left:0;border-radius:var(--radius-full);background:var(--brand-primary-soft);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand-primary) 45%,transparent);transition:transform var(--demo-glissement) var(--ease-out),width var(--demo-glissement) var(--ease-out)}.d-nav__bouton{position:relative;display:flex;align-items:center;gap:var(--space-2);min-height:var(--touch-target);padding:0 var(--space-5);border:0;border-radius:var(--radius-full);background:transparent;color:var(--text-muted);cursor:pointer;transition:background .16s var(--ease-out),color .16s var(--ease-out)}.d-nav__bouton:hover{background:color-mix(in srgb,var(--text) 7%,transparent);color:var(--text)}.d-nav__bouton[aria-current],.d-nav__bouton[aria-current]:hover{background:transparent;color:var(--brand-primary-strong)}.d-nav__forme{width:var(--space-5);height:var(--space-5);flex:none}.d-nav__libelle{font-size:var(--fs-lg);font-weight:var(--fw-semibold);line-height:var(--lh-tight);color:inherit;white-space:nowrap}@media(prefers-reduced-motion:reduce){.d-piste[data-pret],.d-zone,.d-nav__curseur,.d-scene:before,.d-scene:after{transition:none}body:before,.d-carte,.d-bandeau,.d-zone__pose,.d-nav{animation:d-parution .2s var(--ease-out) both;animation-delay:0ms}.d-jauge__fil,.d-bandeau__point{animation:none}}