.course{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:transform .15s}.course:hover{transform:translateY(-3px)}.course .th{aspect-ratio:16/9;position:relative;display:grid;place-items:center;overflow:hidden}.course .th strong{font-size:19px;font-weight:800;color:#fff;text-transform:uppercase;text-align:center;line-height:.95;text-shadow:0 2px 0 rgba(0,0,0,.2);position:relative}.course .th .floor{height:75%;background-size:34px 34px;animation:none}.course .th .tag{position:absolute;top:10px;left:10px;font-size:11.5px;font-weight:700;padding:4px 8px;border-radius:7px;background:#ffffffeb;color:var(--ink)}.course .th .tag.free{background:var(--green-tint);color:#178a43}.course .bd{padding:13px 14px 14px;display:flex;flex-direction:column;gap:8px;flex:1}.course h3{line-height:1.08;font-size:15.5px;letter-spacing:-.01em}.course .meta{font-size:12.5px;color:var(--muted)}.course .xp{height:6px}.course .foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 8px;font-size:13px;font-weight:600}.course .foot .ok{color:#178a43}.course .foot .price{color:var(--ink);font-size:15px;white-space:nowrap}.course .foot .pass{color:var(--blue);font-size:12.5px}.course.locked .th:after{content:"";position:absolute;inset:0;background:#151b2e40}.course.soon .th{filter:grayscale(.7)}.course .th{aspect-ratio:21/9;background:linear-gradient(160deg,#5b82ff,#3260e8)}.course.course-obby .th{background:linear-gradient(160deg,#4f78f0,#2c4fcf)}.course .th .floor{position:absolute;left:-20%;right:-20%;bottom:-2px;height:75%;background-image:linear-gradient(rgba(255,255,255,.13) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.13) 1.5px,transparent 1.5px);background-size:34px 34px;transform:perspective(420px) rotateX(62deg);transform-origin:bottom;animation:none;mask-image:linear-gradient(to top,#000 10%,transparent 90%)}.course .xp{height:6px;border-radius:9px;background:#eef0f5;overflow:hidden}.course .xp span{display:block;height:100%;background:var(--blue);border-radius:9px;transition:width .6s ease}.course .th strong{white-space:pre-line}@media(prefers-reduced-motion:reduce){.course,.course .xp span{transition:none}}.course[href="/formation/les-bases"] .th:before,.course[href="/formation/obby"] .th:before{content:"";position:absolute;inset:0;pointer-events:none;background:center / 100% 100% no-repeat;transition:transform .45s cubic-bezier(.2,.7,.2,1)}.course[href="/formation/les-bases"] .th:before{background-image:url(/assets/formations/bases.svg)}.course[href="/formation/obby"] .th:before{background-image:url(/assets/formations/obby.svg)}.course .th .floor{pointer-events:none;opacity:.65}.course .th .tag{z-index:2}.course .th strong{z-index:1}.course[href="/formation/obby"] .th strong{transform:translateY(-14px)}@media(hover:hover)and (prefers-reduced-motion:no-preference){.course:hover .th:before{transform:translateY(-4px)}}@media(prefers-reduced-motion:no-preference){.course:focus-visible .th:before{transform:translateY(-4px)}}@media(prefers-reduced-motion:reduce){.course .th:before{transition:none}}