:root{--color-olive-base: #8f9b6b;--color-olive-dark: #6f7b52;--color-olive-light: #b7a66a;--color-olive-pale: #c9c1a8;--color-olive-muted: #8a8d7a;--color-beige-warm: #f6f4ee;--color-beige-light: #e8e2d0;--color-beige-medium: #e2dcc9;--color-beige-dark: #d4ccb4;--color-beige-darker: #dcd4bc;--color-beige-neutral: #dad2bc;--color-beige-hover: #e0d8c4;--color-beige-deep: #d0c7ae;--color-brown-dark: #2f2f2a;--color-brown-medium: #6f735f;--primary-blue: var(--color-olive-base);--primary-blue-dark: var(--color-olive-dark);--primary-blue-light: var(--color-olive-light);--bg-main: var(--color-beige-warm);--bg-card: linear-gradient( 135deg, var(--color-beige-medium), var(--color-beige-dark) );--bg-card-hover: linear-gradient( 135deg, var(--color-beige-neutral), var(--color-olive-pale) );--bg-search: linear-gradient( 135deg, var(--color-beige-light), var(--color-beige-darker) );--bg-search-hover: linear-gradient( 135deg, var(--color-beige-hover), var(--color-beige-deep) );--text-primary: var(--color-brown-dark);--text-secondary: var(--color-brown-medium);--text-accent: var(--color-olive-muted);--text-tertiary: #888;--border-color: rgba(111, 123, 82, .45);--border-color-hover: var(--color-olive-base);--shadow-base-color: rgba(90, 90, 60, .18);--shadow-medium-color: rgba(90, 90, 60, .25);--shadow-large-color: rgba(90, 90, 60, .3);--shadow-glow-color: rgba(143, 155, 107, .45);--shadow-sm: 0 4px 12px var(--shadow-base-color);--shadow-md: 0 8px 24px var(--shadow-medium-color);--shadow-lg: 0 16px 40px var(--shadow-large-color);--shadow-glow: 0 0 18px var(--shadow-glow-color);--badge-bg: rgba(74, 158, 255, .1);--badge-bg-hover: rgba(74, 158, 255, .2);--badge-highlight: rgba(255, 255, 255, .1);--badge-gray-bg: rgba(255, 255, 255, .08);--badge-gray-highlight: rgba(255, 255, 255, .05);--card-gray-bg: rgba(255, 255, 255, .05);--gradient-shine: linear-gradient(90deg, transparent, var(--color-olive-base), transparent);--gradient-underline: linear-gradient(90deg, transparent, var(--color-olive-base), transparent);--gradient-vertical: linear-gradient(180deg, var(--color-olive-base), var(--color-olive-base));--gradient-accent: linear-gradient(90deg, rgba(143, 155, 107, .12), rgba(143, 155, 107, .06));--transition-fast: .3s ease;--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1);--transition-elastic: .5s cubic-bezier(.68, -.55, .265, 1.55);--gap-main: clamp(2rem, 5vw, 3rem);--radius-sm: 12px;--radius-md: 18px;--radius-lg: 24px;--radius-pill: 50px;--spacing-xs: clamp(.5rem, 1vw, .75rem);--spacing-sm: clamp(.6rem, 1.5vw, .8rem);--spacing-md: clamp(1rem, 2vw, 1.5rem);--spacing-lg: clamp(1.5rem, 3vw, 2rem);--spacing-xl: clamp(2rem, 4vw, 2.5rem);--font-xs: clamp(.9rem, 2vw, 1rem);--font-sm: clamp(.9rem, 2vw, 1.1rem);--font-base: clamp(1rem, 2vw, 1.25rem);--font-md: clamp(1.1rem, 2.5vw, 1.4rem);--font-lg: clamp(1.5rem, 4vw, 2rem);--padding-card: clamp(1.5rem, 3vw, 2rem) clamp(2rem, 4vw, 2.5rem);--padding-card-mobile: clamp(1.2rem, 2.5vw, 1.5rem);--padding-card-small: clamp(1rem, 2vw, 1.2rem);--padding-search: clamp(1rem, 2vw, 1.5rem) clamp(1.5rem, 3vw, 2rem);--padding-badge: clamp(.6rem, 1.5vw, .8rem) clamp(1.2rem, 2.5vw, 1.5rem);--width-content-max: min(100%, 1200px);--width-main: 90%;--width-medium: 85%;--width-small: 95%;--width-full: 100%;--z-card-overlay: 1;--z-card-shine: 2}.dark{--color-olive-base: #a8b58a;--color-olive-dark: #7c875c;--color-olive-light: #c1cf9a;--color-olive-pale: #d4d8b2;--color-olive-muted: #a3a88f;--color-beige-warm: #141810;--color-beige-light: #1a2013;--color-beige-medium: #1c2215;--color-beige-dark: #222816;--color-beige-darker: #1e2415;--color-beige-neutral: #1b2012;--color-beige-hover: #1f2614;--color-beige-deep: #1c2211;--color-brown-dark: #e7e9dd;--color-brown-medium: #a3a88f;--primary-blue: #a8b58a;--primary-blue-dark: #7c875c;--primary-blue-light: #c1cf9a;--bg-main: #12140f;--bg-card: linear-gradient(135deg, #1c2215, #222816);--bg-card-hover: linear-gradient(135deg, #1b2012, #d4d8b2);--bg-search: linear-gradient(135deg, #1a2013, #1e2415);--bg-search-hover: linear-gradient(135deg, #1f2614, #1c2211);--text-primary: #e7e9dd;--text-secondary: #a3a88f;--text-accent: #c1cf9a;--text-tertiary: #bfc3a8;--border-color: rgba(168, 181, 138, .45);--border-color-hover: #a8b58a;--shadow-base-color: rgba(0, 0, 0, .6);--shadow-medium-color: rgba(0, 0, 0, .7);--shadow-large-color: rgba(0, 0, 0, .75);--shadow-glow-color: rgba(168, 181, 138, .45);--shadow-sm: 0 4px 12px rgba(0,0,0,.6);--shadow-md: 0 8px 24px rgba(0,0,0,.7);--shadow-lg: 0 16px 40px rgba(0,0,0,.75);--shadow-glow: 0 0 18px rgba(168, 181, 138, .45);--badge-bg: rgba(168, 181, 138, .1);--badge-bg-hover: rgba(168, 181, 138, .2);--badge-highlight: rgba(255, 255, 255, .08);--badge-gray-bg: rgba(255, 255, 255, .03);--badge-gray-highlight: rgba(255, 255, 255, .02);--card-gray-bg: rgba(26, 30, 24, .85);--gradient-shine: linear-gradient(90deg, transparent, #a8b58a, transparent);--gradient-underline: linear-gradient(90deg, transparent, #a8b58a, transparent);--gradient-vertical: linear-gradient(180deg, #a8b58a, #a8b58a);--gradient-accent: linear-gradient(90deg, rgba(168, 181, 138, .12), rgba(168, 181, 138, .06));--transition-fast: .3s ease;--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1);--transition-elastic: .5s cubic-bezier(.68, -.55, .265, 1.55);--gap-main: clamp(2rem, 5vw, 3rem);--radius-sm: 12px;--radius-md: 18px;--radius-lg: 24px;--radius-pill: 50px;--spacing-xs: clamp(.5rem, 1vw, .75rem);--spacing-sm: clamp(.6rem, 1.5vw, .8rem);--spacing-md: clamp(1rem, 2vw, 1.5rem);--spacing-lg: clamp(1.5rem, 3vw, 2rem);--spacing-xl: clamp(2rem, 4vw, 2.5rem);--font-xs: clamp(.9rem, 2vw, 1rem);--font-sm: clamp(.9rem, 2vw, 1.1rem);--font-base: clamp(1rem, 2vw, 1.25rem);--font-md: clamp(1.1rem, 2.5vw, 1.4rem);--font-lg: clamp(1.5rem, 4vw, 2rem);--padding-card: clamp(1.5rem, 3vw, 2rem) clamp(2rem, 4vw, 2.5rem);--padding-card-mobile: clamp(1.2rem, 2.5vw, 1.5rem);--padding-card-small: clamp(1rem, 2vw, 1.2rem);--padding-search: clamp(1rem, 2vw, 1.5rem) clamp(1.5rem, 3vw, 2rem);--padding-badge: clamp(.6rem, 1.5vw, .8rem) clamp(1.2rem, 2.5vw, 1.5rem);--width-content-max: min(100%, 1200px);--width-main: 90%;--width-medium: 85%;--width-small: 95%;--width-full: 100%;--z-card-overlay: 1;--z-card-shine: 2}.content{display:flex;flex-direction:column;gap:var(--gap-main);color:var(--text-primary);margin:0 auto;width:var(--width-content-max);padding:0 clamp(1rem,3vw,2rem);animation:fadeInUp .8s var(--transition-smooth);will-change:opacity,transform}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.search{width:var(--width-main);display:block;margin:10px auto;padding:var(--padding-search);font-size:var(--font-base);color:var(--text-primary);border-radius:var(--radius-lg);border:1px solid var(--border-color);background:var(--bg-search);outline:none;transition:var(--transition-smooth);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:relative;box-shadow:var(--shadow-sm)}.search::-moz-placeholder{color:var(--text-secondary);-moz-transition:var(--transition-fast);transition:var(--transition-fast)}.search::placeholder{color:var(--text-secondary);transition:var(--transition-fast)}.search:hover{border-color:var(--border-color-hover);background:var(--bg-search-hover);box-shadow:var(--shadow-md),var(--shadow-glow);transform:translateY(-2px)}.search:hover::-moz-placeholder{color:var(--primary-blue-light)}.search:hover::placeholder{color:var(--primary-blue-light)}.search:focus-visible{border-color:var(--border-color-hover);box-shadow:0 0 0 3px var(--shadow-large-color),var(--shadow-glow);transform:translateY(-4px) scale(1.02)}.content h2{font-size:var(--font-lg);font-weight:700;color:var(--text-accent);letter-spacing:-.5px;text-shadow:var(--shadow-sm);margin:var(--spacing-lg) auto var(--spacing-md) auto;position:relative;padding-left:var(--spacing-md);width:clamp(70%,80vw,90%);display:flex;align-items:center;gap:.5rem}.content h2:before{content:"";width:clamp(4px,1vw,6px);height:80%;background:var(--gradient-vertical);border-radius:var(--radius-pill);box-shadow:var(--shadow-glow);flex-shrink:0}.bloc-right{display:flex;flex-direction:column;gap:15px;margin-top:25px;width:var(--width-full);align-items:center}.bloc-right .card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:clamp(1rem,2vw,2rem);padding:var(--padding-card);border-radius:var(--radius-md);border:1px solid var(--border-color);background:var(--bg-card);position:relative;overflow:hidden;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:var(--width-main);transition:var(--transition-smooth);box-shadow:var(--shadow-sm);will-change:transform,box-shadow;animation:slideInStagger .6s var(--transition-smooth) backwards}.bloc-right .card .card-link{text-decoration:none;color:inherit;cursor:pointer;flex:1}.bloc-right .card:nth-child(1){animation-delay:.1s}.bloc-right .card:nth-child(2){animation-delay:.2s}.bloc-right .card:nth-child(3){animation-delay:.3s}.bloc-right .card:nth-child(4){animation-delay:.4s}.bloc-right .card:nth-child(5){animation-delay:.5s}@keyframes slideInStagger{0%{opacity:0;transform:translateY(40px) rotateX(10deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}.bloc-right .card:before{content:"";position:absolute;top:0;left:-100%;width:var(--width-full);height:var(--width-full);background:var(--gradient-shine);transition:left .8s ease;z-index:var(--z-card-overlay)}.bloc-right .card:hover:before{left:100%}.bloc-right .card:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:4px;transform:translate(-50%);background:var(--gradient-underline);opacity:0;transition:var(--transition-smooth);box-shadow:var(--shadow-glow);z-index:var(--z-card-shine)}.bloc-right .card:hover{border-color:var(--border-color-hover);background:var(--bg-card-hover);box-shadow:var(--shadow-lg),var(--shadow-glow)}.bloc-right .card:hover:after{width:80%;opacity:1}.bloc-right .card:active{transform:translateY(-4px) scale(1) rotateX(0);transition:var(--transition-fast)}.bloc-right .card-info{display:flex;flex-direction:column;gap:var(--spacing-xs)}.bloc-right .card-info h3{margin:0;font-size:var(--font-md);font-weight:700;color:var(--text-primary);letter-spacing:-.3px;text-shadow:var(--shadow-sm);transition:var(--transition-fast)}.bloc-right .card:hover .card-info h3{text-shadow:var(--shadow-glow)}.bloc-right .card-info span{font-size:var(--font-sm);color:var(--text-secondary);display:flex;align-items:center;gap:var(--spacing-xs);transition:var(--transition-fast)}.bloc-right .badge{padding:var(--padding-badge);border-radius:var(--radius-pill);font-size:var(--font-xs);font-weight:600;letter-spacing:.5px;white-space:nowrap;color:var(--primary-blue);border:1px solid var(--primary-blue);background:var(--badge-bg);box-shadow:var(--shadow-sm),inset 0 1px 0 var(--badge-highlight);transition:var(--transition-smooth);justify-self:end}.bloc-right .badge:hover{transform:scale(1.08) translateY(-2px);background:var(--badge-bg-hover);box-shadow:var(--shadow-md),var(--shadow-glow);border-color:var(--primary-blue-light)}.btn-follow{display:flex;align-items:center;gap:.5rem;padding:clamp(.6rem,1.5vw,.8rem) clamp(1rem,2vw,1.2rem);border-radius:var(--radius-pill);font-size:var(--font-xs);font-weight:600;letter-spacing:.3px;white-space:nowrap;border:1.5px solid var(--primary-blue);background:transparent;color:var(--primary-blue);cursor:pointer;transition:all var(--transition-smooth);box-shadow:var(--shadow-sm);justify-self:end;z-index:10;position:relative}.btn-follow .icon-heart{width:16px;height:16px;transition:all var(--transition-smooth);stroke:var(--primary-blue);fill:none}.btn-follow:hover{background:var(--badge-bg);transform:translateY(-2px) scale(1.05);box-shadow:var(--shadow-md),var(--shadow-glow);border-color:var(--primary-blue-light)}.btn-follow:active{transform:translateY(0) scale(1)}.btn-follow.following:hover{background:var(--primary-blue-dark);border-color:var(--primary-blue-dark)}@media(max-width:768px){.btn-follow .btn-text{display:none}.btn-follow{padding:.7rem;border-radius:50%;width:40px;height:40px;justify-content:center}}.bloc-right .card.gray{background:var(--card-gray-bg);border:1px solid var(--border-color);color:var(--text-secondary);cursor:not-allowed;box-shadow:var(--shadow-sm);pointer-events:none;transform:none}.bloc-right .card.gray .card-info h3{color:var(--text-secondary);text-shadow:none}.bloc-right .card.gray .card-info span{color:var(--text-tertiary)}.bloc-right .card.gray .badge{background:var(--badge-gray-bg);color:var(--text-secondary);border-color:var(--border-color);box-shadow:inset 0 1px 0 var(--badge-gray-highlight),var(--shadow-sm)}.bloc-right .card.gray .badge:hover{transform:none;background:var(--badge-gray-bg);border-color:var(--border-color);color:var(--text-secondary)}@media(max-width:1200px){.content{max-width:1000px}.search,.card,.content h2{width:var(--width-medium)}}@media(max-width:768px){.content{gap:var(--gap-main);padding:0 clamp(1rem,2vw,1.5rem)}.search,.card,.content h2{width:var(--width-small)}.card{grid-template-columns:1fr;gap:var(--spacing-md);padding:var(--padding-card-mobile)}}@media(max-width:480px){.content{padding:0 .75rem;gap:clamp(1.5rem,3vw,2rem)}.search,.card,.content h2{width:var(--width-full)}.card{padding:var(--padding-card-small)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.btn-follow{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:transparent;border:2px solid var(--primary-blue);border-radius:var(--radius-pill);color:var(--primary-blue);font-weight:600;font-size:.95rem;cursor:pointer;transition:all var(--transition-smooth);position:relative;overflow:hidden;white-space:nowrap}.btn-follow .icon-heart{width:18px;height:18px;transition:all var(--transition-smooth);flex-shrink:0}.btn-follow:not(.following) .icon-heart{stroke:var(--primary-blue);fill:transparent}.btn-follow.following{background:var(--primary-blue);color:#fff;border-color:var(--primary-blue)}.btn-follow.following .icon-heart{fill:#fff;stroke:#fff}.btn-follow:not(.following):hover{background:var(--primary-blue);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md),var(--shadow-glow)}.btn-follow:not(.following):hover .icon-heart{stroke:#fff}.btn-follow.following:hover{background:var(--primary-blue-dark);border-color:var(--primary-blue-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-follow:active{transform:translateY(0) scale(.98)}.btn-follow-large{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2rem;background:transparent;border:2px solid var(--primary-blue);border-radius:var(--radius-pill);color:var(--primary-blue);font-weight:700;font-size:1.1rem;cursor:pointer;transition:all var(--transition-smooth)}.btn-follow-large .icon-heart{width:22px;height:22px}.btn-follow-large:not(.following) .icon-heart{stroke:var(--primary-blue);fill:transparent}.btn-follow-large.following{background:var(--primary-blue);color:#fff;border-color:var(--primary-blue)}.btn-follow-large.following .icon-heart{fill:#fff;stroke:#fff}.btn-follow-large:hover{background:var(--primary-blue);color:#fff;transform:translateY(-3px);box-shadow:var(--shadow-lg),var(--shadow-glow)}.btn-follow-large.following:hover{background:var(--primary-blue-dark);border-color:var(--primary-blue-dark)}.btn-unfollow{background:transparent;border:none;cursor:pointer;padding:.5rem;border-radius:50%;transition:all var(--transition-fast);flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.btn-unfollow svg{width:20px;height:20px;fill:var(--primary-blue);stroke:none;transition:all var(--transition-fast)}.btn-unfollow:hover{background:#ef44441a}.btn-unfollow:hover svg{fill:#ef4444;transform:scale(1.1)}@media(max-width:768px){.btn-follow{padding:.6rem 1rem;font-size:.9rem}.btn-follow .icon-heart{width:16px;height:16px}.btn-follow-large{padding:.85rem 1.5rem;font-size:1rem}.btn-follow-large .icon-heart{width:20px;height:20px}}@media(max-width:480px){.btn-follow .btn-text{display:none}.btn-follow{padding:.75rem;border-radius:50%;width:42px;height:42px}.btn-follow-large .btn-text{font-size:.95rem}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.btn-follow:hover .icon-heart,.btn-follow-large:hover .icon-heart{animation:pulse .6s ease infinite}@keyframes heartBeat{0%{transform:scale(1)}25%{transform:scale(1.3)}50%{transform:scale(1.1)}to{transform:scale(1)}}.btn-follow.animating .icon-heart,.btn-follow-large.animating .icon-heart{animation:heartBeat .4s ease}.course-block{display:flex;align-items:center;justify-content:space-between;gap:1rem}.course-block .card-link{flex:1;min-width:0}.course-block .btn-follow{flex-shrink:0}.cours-header{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;margin-bottom:2rem;padding:2rem;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-color)}.cours-info{flex:1}@media(max-width:768px){.cours-header{flex-direction:column;gap:1.5rem}.btn-follow-large{width:100%;justify-content:center}}.mes-cours-link{display:flex;align-items:center;gap:.5rem;position:relative}.mes-cours-link .nav-icon-heart{width:20px;height:20px;fill:var(--primary-blue)}.cours-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 .5rem;background:var(--primary-blue);color:#fff;border-radius:var(--radius-pill);font-size:.75rem;font-weight:700;line-height:1}@keyframes badge-pulse{0%,to{transform:scale(1);box-shadow:0 0 #3885ffb3}50%{transform:scale(1.1);box-shadow:0 0 0 4px #3885ff00}}.cours-count{animation:badge-pulse 2s ease infinite}.btn-follow:disabled{opacity:.5;cursor:not-allowed}.btn-follow:disabled:hover{transform:none;box-shadow:none;background:transparent}.btn-follow.loading{opacity:.7;cursor:wait}.btn-follow.loading .icon-heart{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes success-flash{0%{background:var(--primary-blue)}50%{background:#10b981}to{background:var(--primary-blue)}}.btn-follow.success{animation:success-flash .6s ease}
