:root{--demo-axe:900px;--demo-mesure:640px}.demo-hero{background:var(--gradient-primary);padding:120px 0 60px;color:var(--color-white)}.demo-hero__inner{max-width:var(--demo-axe);margin:0 auto}.demo-hero__title{font-size:44px;font-weight:700;line-height:1.15;margin-bottom:20px}.demo-hero__lead{max-width:var(--demo-mesure);font-size:18px;line-height:1.7;opacity:0.95;margin:0}.demo-hero__highlight{color:var(--color-yellow)}.demo-fil{font-size:14px;margin-bottom:22px;opacity:0.9}.demo-fil ol{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0;padding:0;list-style:none}.demo-fil a{color:var(--color-white);text-decoration:underline}.demo-fil li:not(:last-child)::after{content:'/';margin-left:10px;opacity:0.6}.demo-hero__lead a{color:var(--color-white);text-decoration:underline;text-underline-offset:3px}.demo-hero__lead a:hover,.demo-hero__lead a:focus-visible{text-decoration-thickness:3px}.demo-section p a{color:var(--color-blue);text-decoration:underline;text-underline-offset:2px}.demo-section p a:hover,.demo-section p a:focus-visible{text-decoration-thickness:2px}.demo-section{padding:var(--spacing-xl) 0}.demo-section--gris{background-color:var(--color-light-gray)}.demo-section__inner{max-width:var(--demo-axe);margin:0 auto}.demo-section__inner p{max-width:var(--demo-mesure);margin-right:auto}.demo-section h2{font-size:30px;line-height:1.25;margin-bottom:22px;color:var(--color-blue)}.demo-section h3{font-size:20px;margin:30px 0 10px;color:var(--color-blue)}.demo-section p{font-size:17px;line-height:1.75;color:#3d4a4f;margin-bottom:18px}.demo-liste-titre{max-width:var(--demo-axe);margin:0 auto 26px}.demo-liste{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;max-width:var(--demo-axe);margin:0 auto;padding:0;list-style:none}.demo-carte{display:flex;flex-direction:column;height:100%;padding:0;overflow:hidden;background-color:var(--color-white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:transform 0.3s ease,box-shadow 0.3s ease}.demo-carte__figure{margin:0}.demo-carte__image{display:block;width:100%;height:auto;aspect-ratio:16 / 10;object-fit:cover;background-color:#062a33}.demo-carte__corps{display:flex;flex-direction:column;flex:1 1 auto;padding:26px 30px 30px}.demo-carte:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}.demo-carte__titre{font-size:22px;line-height:1.3;margin:0 0 12px;color:var(--color-blue)}.demo-carte__titre a{color:inherit;text-decoration:none}.demo-carte__titre a:hover{text-decoration:underline}.demo-carte__meta{margin:0 0 20px;font-size:14px;color:#5c6b72}.demo-carte__texte{font-size:16px;line-height:1.65;color:#4a5568;margin:0 0 18px}.demo-carte__lien{margin-top:auto;align-self:flex-start}.demo-liste > li:last-child:nth-child(odd){grid-column:1 / -1;max-width:calc((100% - 26px) / 2);margin:0 auto}.demo-cta{padding:var(--spacing-xl) 0;background:var(--gradient-primary);color:var(--color-white);text-align:center}.demo-cta h2{font-size:28px;margin-bottom:16px}.demo-cta p{max-width:620px;margin:0 auto 26px;font-size:17px;line-height:1.7;opacity:0.95}@media (max-width:768px){.demo-hero{padding:100px 0 45px}.demo-hero__title{font-size:30px}.demo-hero__lead{font-size:16px}.demo-section h2{font-size:24px}.demo-section p{font-size:16px}.demo-liste{grid-template-columns:1fr;gap:20px}.demo-carte__corps{padding:22px 24px 26px}}.demo-compteurs{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:0;padding:0;list-style:none}.demo-compteur{display:inline-flex;align-items:center;gap:8px;font-size:0.9rem;letter-spacing:0.02em;color:#cfe0e5}.demo-compteur i{font-size:0.95rem;color:var(--color-yellow)}.demo-compteur strong{font-size:1.1rem;font-weight:700;color:var(--color-white);font-variant-numeric:tabular-nums}.demo-aide{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:18px;font-size:0.92rem;color:#4a5568}.demo-aide-item{display:inline-flex;align-items:center;gap:8px}.demo-aide i{color:var(--color-blue)}.demo-touche{display:inline-block;padding:2px 8px;border:1px solid #cbd5d8;border-bottom-width:2px;border-radius:5px;background-color:#f4f7f8;font-family:inherit;font-size:0.85rem;font-weight:600;color:#2d3b40}@media (hover:none) and (pointer:coarse){.demo-aide-item--clavier{display:none}}@media (hover:hover) and (pointer:fine){.demo-aide-item--tactile{display:none}}.demo-aide-plus{margin:14px 0 0;text-align:center}.demo-aide-bouton{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border:2px solid var(--color-blue);border-radius:20px;background-color:transparent;color:var(--color-blue);font-family:inherit;font-size:0.92rem;font-weight:600;cursor:pointer;transition:background-color 0.2s ease,color 0.2s ease}.demo-aide-bouton:hover,.demo-aide-bouton:focus-visible{background-color:var(--color-blue);color:var(--color-white)}.demo-aide-bouton[hidden]{display:none}.demo-fond-verrouille,.demo-fond-verrouille body{overflow:hidden;overscroll-behavior:none}.demo-modale:not([open]):not(.demo-modale--statique){display:none}.demo-modale{width:min(92vw,640px);max-height:min(84vh,760px);padding:0;border:none;border-radius:12px;background-color:var(--color-white);color:#1f2c31;box-shadow:0 30px 70px rgba(0,0,0,0.35);margin:auto;display:flex;flex-direction:column;overflow:hidden}.demo-modale::backdrop{background-color:rgba(4,33,42,0.62)}.demo-modale-entete{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px 14px;border-bottom:1px solid #e3eaec}.demo-modale-titre{margin:0;font-size:1.3rem;line-height:1.3;color:var(--color-blue)}.demo-modale-fermer{flex:0 0 auto;width:40px;height:40px;border:none;border-radius:50%;background-color:#f1f5f6;color:#33454b;font-size:1.05rem;cursor:pointer;transition:background-color 0.2s ease}.demo-modale-fermer:hover,.demo-modale-fermer:focus-visible{background-color:#dfe7e9}.demo-modale-corps{padding:18px 22px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;font-size:1rem;line-height:1.65}.demo-modale-corps p{margin:0 0 16px;color:#3d4a4f}.demo-modale-corps p:last-child{margin-bottom:0}.demo-regles{margin:0 0 18px}.demo-regles dt{margin-top:14px;font-weight:700;color:var(--color-blue)}.demo-regles dt:first-child{margin-top:0}.demo-regles dd{margin:4px 0 0;color:#3d4a4f}.demo-modale-pied{padding:14px 22px 20px;border-top:1px solid #e3eaec;text-align:right}.demo-modale-ok{padding:11px 26px;border:none;border-radius:20px;background-color:var(--color-blue);color:var(--color-white);font-family:inherit;font-size:0.95rem;font-weight:700;cursor:pointer}.demo-modale-ok:hover,.demo-modale-ok:focus-visible{background-color:#00647d}.demo-modale-fermer[hidden],.demo-modale-ok[hidden]{display:none}.demo-modale--statique{display:block;position:static;width:auto;max-width:none;max-height:none;margin:18px 0 0;border:1px solid #cfdbde;box-shadow:none;overflow:visible}.demo-modale--statique .demo-modale-corps{overflow:visible}@media (max-width:600px){.demo-compteurs{gap:14px}.demo-compteur{font-size:0.85rem}.demo-compteur strong{font-size:1rem}.demo-aide{gap:14px;font-size:0.85rem}.demo-modale{width:94vw;max-height:88vh}.demo-modale-entete{padding:16px 16px 12px}.demo-modale-titre{font-size:1.12rem}.demo-modale-corps{padding:14px 16px;font-size:0.95rem}.demo-modale-pied{padding:12px 16px 16px;text-align:center}.demo-modale-ok{width:100%}}@media print{.demo-aide,.demo-aide-plus,.demo-modale{display:none !important}}@media (prefers-reduced-motion:reduce){.demo-carte,.demo-aide-bouton,.demo-modale-fermer{transition:none}.demo-carte:hover{transform:none}}