/* ================================================================
   PERTICOM Academy — Design System Premium v2
   "Dark-first, light-accented."

   Architecture :
   1. Tokens (couleurs, espacement, typographie, animations)
   2. Fond et atmosphère globale
   3. Typographie
   4. Boutons — 3 variants + états riches
   5. Cards — profondeur 3D, hover magnétique
   6. Grid, layout
   7. Progress bars animées
   8. Tags, badges, kickers
   9. Animations d'entrée (Intersection Observer-ready)
   10. Utilitaires
   ================================================================ */

/* ================================================================
   1. TOKENS
   ================================================================ */
.pac-academy {

    /* — Palette principale — */
    --pac-red:         #ed1b2f;
    --pac-red-dark:    #c91426;
    --pac-red-deeper:  #a00f1e;
    --pac-red-soft:    rgba(237, 27, 47, 0.09);
    --pac-red-glow:    rgba(237, 27, 47, 0.28);
    --pac-red-halo:    rgba(237, 27, 47, 0.12);

    /* — Neutres sombres — */
    --pac-void:        #030305;
    --pac-black:       #080810;
    --pac-dark-1:      #0d0d16;
    --pac-dark-2:      #12121e;
    --pac-dark-3:      #18182a;

    /* — Neutres clairs — */
    --pac-ink:         #0f172a;
    --pac-ink-soft:    #1e293b;
    --pac-white:       #ffffff;
    --pac-bg:          #f4f6fb;
    --pac-bg-2:        #edf0f8;
    --pac-card:        #ffffff;

    /* — Texte — */
    --pac-text:        #0f172a;
    --pac-text-muted:  #475569;
    --pac-text-soft:   #64748b;
    --pac-text-ghost:  #94a3b8;

    /* — Bordures — */
    --pac-border:      #e2e8f0;
    --pac-border-2:    #cbd5e1;
    --pac-border-glow: rgba(237, 27, 47, 0.22);

    /* — Sémantiques — */
    --pac-success:     #16a34a;
    --pac-success-bg:  rgba(22, 163, 74, 0.09);
    --pac-warning:     #d97706;
    --pac-warning-bg:  rgba(217, 119, 6, 0.10);
    --pac-info:        #2563eb;
    --pac-info-bg:     rgba(37, 99, 235, 0.09);

    /* — Radius — */
    --pac-r-xs:   8px;
    --pac-r-sm:   12px;
    --pac-r:      18px;
    --pac-r-md:   24px;
    --pac-r-lg:   32px;
    --pac-r-xl:   44px;
    --pac-r-pill: 999px;

    /* — Espacement — */
    --pac-sp-xs:  6px;
    --pac-sp-sm:  12px;
    --pac-sp-md:  20px;
    --pac-sp-lg:  32px;
    --pac-sp-xl:  52px;
    --pac-sp-2xl: 80px;

    /* — Typographie — */
    --pac-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --pac-font-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

    /* — Ombres — */
    --pac-shadow-xs:   0 1px 3px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
    --pac-shadow-sm:   0 4px 12px rgba(15,23,42,.07), 0 2px 4px rgba(15,23,42,.04);
    --pac-shadow:      0 10px 32px rgba(15,23,42,.09), 0 4px 10px rgba(15,23,42,.05);
    --pac-shadow-lg:   0 22px 60px rgba(15,23,42,.12), 0 8px 20px rgba(15,23,42,.06);
    --pac-shadow-xl:   0 40px 100px rgba(15,23,42,.16), 0 14px 36px rgba(15,23,42,.08);
    --pac-shadow-red:  0 16px 50px rgba(237,27,47,.28), 0 6px 16px rgba(237,27,47,.16);
    --pac-shadow-card-hover: 0 28px 72px rgba(15,23,42,.14), 0 10px 24px rgba(15,23,42,.07);

    /* — Animations — */
    --pac-ease:        cubic-bezier(0.22, 0.61, 0.36, 1);
    --pac-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --pac-ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1);
    --pac-ease-in:     cubic-bezier(0.4, 0.0, 1.0, 1);
    --pac-t-fast:  0.14s;
    --pac-t-base:  0.24s;
    --pac-t-slow:  0.42s;

    /* — Conteneur — */
    --pac-container: 1180px;
    --pac-container-wide: 1380px;

    /* Rendu texte */
    color: var(--pac-text);
    font-family: var(--pac-font);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.pac-academy *,
.pac-academy *::before,
.pac-academy *::after {
    box-sizing: border-box;
}

/* ================================================================
   2. FOND ET ATMOSPHÈRE
   ================================================================ */

.pac-academy {
    position: relative;
    padding: var(--pac-sp-2xl) 0;
    overflow-x: hidden;
    background: var(--pac-bg);
}

/* Halo global discret en haut à gauche */
.pac-academy::before {
    content: "";
    position: fixed;
    top: -200px;
    left: -200px;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(237,27,47,.06) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.pac-academy .pac-shell {
    position: relative;
    z-index: 1;
    width: min(var(--pac-container), calc(100% - 32px));
    margin: 0 auto;
}

/* ================================================================
   3. TYPOGRAPHIE
   ================================================================ */

.pac-academy h1,
.pac-academy h2,
.pac-academy h3,
.pac-academy h4 {
    color: var(--pac-text);
    font-family: var(--pac-font);
    letter-spacing: -0.032em;
    line-height: 1.08;
    font-weight: 800;
    margin: 0 0 0.5em;
}

.pac-academy h1 {
    font-size: clamp(38px, 5.5vw, 72px);
    letter-spacing: -0.045em;
    font-weight: 900;
}

.pac-academy h1 strong {
    color: var(--pac-red);
    font-weight: 900;
    position: relative;
    display: inline;
}

/* Soulignement animé sous le strong */
.pac-academy h1 strong::after {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 100%;
    height: 3px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--pac-red), var(--pac-red-dark));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.6s var(--pac-ease) 0.3s;
}

.pac-academy.is-visible h1 strong::after {
    transform: scaleX(1);
}

.pac-academy h2 { font-size: clamp(26px, 3.2vw, 42px); }
.pac-academy h3 { font-size: 21px; line-height: 1.28; }
.pac-academy h4 { font-size: 17px; letter-spacing: -0.02em; }

.pac-academy p {
    margin: 0 0 1em;
    color: var(--pac-text-muted);
}

.pac-academy .pac-lead {
    font-size: clamp(16px, 1.5vw, 20px);
    color: var(--pac-text-soft);
    line-height: 1.7;
    max-width: 680px;
    margin-top: var(--pac-sp-md);
}

.pac-academy a {
    color: inherit;
    text-decoration: none;
    transition: color var(--pac-t-fast) var(--pac-ease);
}

/* ================================================================
   4. KICKER
   ================================================================ */

.pac-academy .pac-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px 8px 12px;
    border-radius: var(--pac-r-pill);
    background: var(--pac-red-halo);
    border: 1px solid var(--pac-red-glow);
    color: var(--pac-red);
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: var(--pac-sp-sm);
    backdrop-filter: blur(6px);
}

.pac-academy .pac-kicker::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pac-red);
    box-shadow: 0 0 0 3px rgba(237,27,47,.22), 0 0 12px var(--pac-red);
    animation: pac-pulse-dot 2.4s ease-in-out infinite;
    flex-shrink: 0;
}

@keyframes pac-pulse-dot {
    0%, 100% { box-shadow: 0 0 0 3px rgba(237,27,47,.22), 0 0 12px var(--pac-red); }
    50%       { box-shadow: 0 0 0 5px rgba(237,27,47,.10), 0 0 20px var(--pac-red); }
}

/* ================================================================
   5. BOUTONS
   ================================================================ */

.pac-academy .pac-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 24px;
    border-radius: var(--pac-r-sm);
    font-family: var(--pac-font);
    font-weight: 700;
    font-size: 14.5px;
    line-height: 1;
    text-decoration: none !important;
    cursor: pointer;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
    transition:
        transform var(--pac-t-fast) var(--pac-ease-spring),
        box-shadow var(--pac-t-base) var(--pac-ease),
        background var(--pac-t-fast) var(--pac-ease),
        color var(--pac-t-fast) var(--pac-ease),
        border-color var(--pac-t-fast) var(--pac-ease);
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
}

/* Shimmer effect sur tous les boutons */
.pac-academy .pac-btn::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg,
        transparent 35%,
        rgba(255,255,255,.18) 50%,
        transparent 65%);
    transform: translateX(-100%);
    transition: transform 0.5s var(--pac-ease);
}

.pac-academy .pac-btn:hover::after {
    transform: translateX(100%);
}

.pac-academy .pac-btn:active {
    transform: scale(0.97) !important;
}

/* Primary */
.pac-academy .pac-btn-primary {
    background: linear-gradient(135deg, var(--pac-red) 0%, var(--pac-red-dark) 100%);
    color: #fff !important;
    box-shadow: var(--pac-shadow-red);
}

.pac-academy .pac-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 60px rgba(237,27,47,.38), 0 8px 20px rgba(237,27,47,.22);
    background: linear-gradient(135deg, #f42238 0%, var(--pac-red) 100%);
    color: #fff !important;
}

/* Ghost */
.pac-academy .pac-btn-ghost {
    background: transparent;
    color: var(--pac-text);
    border-color: var(--pac-border-2);
    backdrop-filter: blur(8px);
}

.pac-academy .pac-btn-ghost:hover {
    background: var(--pac-ink);
    color: var(--pac-white) !important;
    border-color: var(--pac-ink);
    transform: translateY(-2px);
    box-shadow: var(--pac-shadow);
}

/* Dark glass */
.pac-academy .pac-btn-dark {
    background: rgba(8, 8, 16, 0.88);
    color: var(--pac-white) !important;
    border-color: rgba(255,255,255,.12);
    backdrop-filter: blur(12px);
}

.pac-academy .pac-btn-dark:hover {
    background: var(--pac-void);
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(0,0,0,.32);
    color: var(--pac-white) !important;
}

.pac-academy .pac-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: var(--pac-sp-lg);
}

/* ================================================================
   6. CARDS
   ================================================================ */

.pac-academy .pac-card {
    background: var(--pac-card);
    border: 1px solid var(--pac-border);
    border-radius: var(--pac-r-md);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    position: relative;
    transition:
        transform var(--pac-t-base) var(--pac-ease),
        box-shadow var(--pac-t-base) var(--pac-ease),
        border-color var(--pac-t-base) var(--pac-ease);
    will-change: transform;
    box-shadow: var(--pac-shadow-xs);
}

/* Bordure top rouge animée */
.pac-academy .pac-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--pac-red), var(--pac-red-dark));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--pac-t-base) var(--pac-ease);
    z-index: 2;
}

.pac-academy .pac-card:hover::before {
    transform: scaleX(1);
}

.pac-academy .pac-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--pac-shadow-card-hover);
    border-color: transparent;
}

/* Media */
.pac-academy .pac-card__media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, var(--pac-bg-2), var(--pac-bg));
    overflow: hidden;
}

.pac-academy .pac-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s var(--pac-ease);
}

.pac-academy .pac-card:hover .pac-card__media img {
    transform: scale(1.06);
}

/* Fallback image avec ambiance */
.pac-academy .pac-card__media-fallback {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 25% 35%, rgba(237,27,47,.14) 0%, transparent 55%),
        radial-gradient(ellipse at 75% 65%, rgba(37,99,235,.08) 0%, transparent 50%),
        linear-gradient(135deg, #f0f2f8 0%, #e8ecf5 100%);
}

/* Badge sur le media */
.pac-academy .pac-card__thumb-badge {
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 5px 10px;
    background: rgba(8,8,16,.75);
    backdrop-filter: blur(10px);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    border-radius: var(--pac-r-pill);
    border: 1px solid rgba(255,255,255,.12);
}

/* Body */
.pac-academy .pac-card__body {
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 0;
}

.pac-academy .pac-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.pac-academy .pac-card__title {
    font-size: 18.5px;
    font-weight: 700;
    line-height: 1.28;
    margin: 0 0 10px;
    color: var(--pac-text);
    letter-spacing: -0.02em;
}

.pac-academy .pac-card__title a {
    color: inherit;
    transition: color var(--pac-t-fast) var(--pac-ease);
}

.pac-academy .pac-card__title a:hover {
    color: var(--pac-red);
}

.pac-academy .pac-card__excerpt {
    font-size: 14px;
    line-height: 1.65;
    color: var(--pac-text-muted);
    margin: 0 0 auto;
    padding-bottom: 16px;
}

.pac-academy .pac-card__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--pac-border);
    margin-top: 14px;
}

/* ================================================================
   7. GRID
   ================================================================ */

.pac-academy .pac-grid {
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    justify-content: center;
}

/* Limite la largeur quand il y a peu d'éléments — évite l'effet "carte qui s'étire" */
.pac-academy .pac-grid > * {
    max-width: 420px;
    width: 100%;
    margin: 0 auto;
}

@media (min-width: 700px) {
    .pac-academy .pac-grid > * {
        max-width: none;
    }
}

/* Stagger d'apparition */
.pac-academy .pac-grid > *:nth-child(1) { animation-delay: 0.05s; }
.pac-academy .pac-grid > *:nth-child(2) { animation-delay: 0.12s; }
.pac-academy .pac-grid > *:nth-child(3) { animation-delay: 0.19s; }
.pac-academy .pac-grid > *:nth-child(4) { animation-delay: 0.26s; }
.pac-academy .pac-grid > *:nth-child(5) { animation-delay: 0.33s; }
.pac-academy .pac-grid > *:nth-child(6) { animation-delay: 0.40s; }

/* ================================================================
   8. PROGRESS
   ================================================================ */

.pac-academy .pac-progress-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 12px 0 14px;
}

.pac-academy .pac-progress {
    flex: 1;
    position: relative;
    height: 7px;
    background: var(--pac-border);
    border-radius: var(--pac-r-pill);
    overflow: hidden;
}

.pac-academy .pac-progress__bar {
    position: absolute;
    inset: 0 auto 0 0;
    background: linear-gradient(90deg, var(--pac-red) 0%, #ff3d50 100%);
    border-radius: inherit;
    transition: width 0.8s var(--pac-ease);
    box-shadow: 0 0 8px rgba(237,27,47,.35);
}

/* Shimmer sur la progress bar */
.pac-academy .pac-progress__bar::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(255,255,255,.35) 50%,
        transparent 100%);
    animation: pac-shimmer-bar 2s linear infinite;
}

@keyframes pac-shimmer-bar {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(400%); }
}

.pac-academy .pac-progress__label {
    font-size: 12px;
    font-weight: 800;
    color: var(--pac-text-soft);
    flex-shrink: 0;
    min-width: 32px;
    text-align: right;
}

/* ================================================================
   9. TAGS & BADGES
   ================================================================ */

.pac-academy .pac-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: var(--pac-r-pill);
    background: var(--pac-bg-2);
    border: 1px solid var(--pac-border);
    color: var(--pac-text-soft);
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: 0.01em;
    line-height: 1.4;
}

.pac-academy .pac-tag--success,
.pac-academy .pac-tag--access-free {
    background: var(--pac-success-bg);
    color: var(--pac-success);
    border-color: rgba(22,163,74,.2);
}

.pac-academy .pac-tag--access-paid {
    background: var(--pac-red-soft);
    color: var(--pac-red);
    border-color: var(--pac-red-glow);
}

.pac-academy .pac-tag--duration {
    background: rgba(37,99,235,.07);
    color: var(--pac-info);
    border-color: rgba(37,99,235,.15);
}

.pac-academy .pac-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: var(--pac-r-pill);
    background: var(--pac-red);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

/* ================================================================
   10. ÉTATS VIDES
   ================================================================ */

.pac-academy .pac-empty {
    text-align: center;
    padding: 64px 32px;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(237,27,47,.04) 0%, transparent 60%),
        var(--pac-card);
    border: 1px dashed var(--pac-border-2);
    border-radius: var(--pac-r-lg);
    margin: var(--pac-sp-lg) 0;
}

.pac-academy .pac-empty h2 {
    font-size: 22px;
    margin-bottom: 10px;
}

.pac-academy .pac-empty p {
    max-width: 420px;
    margin: 0 auto var(--pac-sp-lg);
    color: var(--pac-text-soft);
}

/* ================================================================
   11. HERO SECTIONS
   ================================================================ */

/* Section sombre (home, sales page) */
.pac-academy .pac-hero-dark {
    background:
        radial-gradient(ellipse 80% 60% at 12% 12%, rgba(237,27,47,.22) 0%, transparent 50%),
        radial-gradient(ellipse 60% 50% at 88% 80%, rgba(37,99,235,.10) 0%, transparent 45%),
        radial-gradient(ellipse 100% 80% at 50% 100%, rgba(8,8,16,.9) 0%, transparent 70%),
        linear-gradient(180deg, var(--pac-dark-1) 0%, var(--pac-dark-2) 60%, var(--pac-dark-3) 100%);
    color: var(--pac-white);
    position: relative;
    overflow: hidden;
    padding: var(--pac-sp-2xl) 0;
    border-radius: var(--pac-r-xl);
    margin-bottom: var(--pac-sp-xl);
}

/* Grain texture overlay */
.pac-academy .pac-hero-dark::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 1;
    opacity: 0.5;
    border-radius: inherit;
}

.pac-academy .pac-hero-dark > * {
    position: relative;
    z-index: 2;
}

.pac-academy .pac-hero-dark h1,
.pac-academy .pac-hero-dark h2,
.pac-academy .pac-hero-dark h3,
.pac-academy .pac-hero-dark .pac-lead {
    color: rgba(255,255,255,.92);
}

.pac-academy .pac-hero-dark p { color: rgba(255,255,255,.65); }

/* ================================================================
   12. GLASSMORPHISM CARDS
   ================================================================ */

.pac-academy .pac-glass {
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(20px) saturate(1.4);
    -webkit-backdrop-filter: blur(20px) saturate(1.4);
    border: 1px solid rgba(255,255,255,.5);
    border-radius: var(--pac-r-md);
    box-shadow:
        0 8px 32px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,.6);
}

.pac-academy .pac-glass-dark {
    background: rgba(13,13,22,.65);
    backdrop-filter: blur(20px) saturate(1.2);
    -webkit-backdrop-filter: blur(20px) saturate(1.2);
    border: 1px solid rgba(255,255,255,.09);
    border-radius: var(--pac-r-md);
    box-shadow:
        0 16px 50px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.06);
    color: var(--pac-white);
}

/* ================================================================
   13. STAT / KPI BLOCKS
   ================================================================ */

.pac-academy .pac-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 18px 16px;
    background: var(--pac-card);
    border: 1px solid var(--pac-border);
    border-radius: var(--pac-r);
    text-align: center;
    position: relative;
    overflow: hidden;
    transition: transform var(--pac-t-base) var(--pac-ease),
                box-shadow var(--pac-t-base) var(--pac-ease);
}

.pac-academy .pac-stat::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--pac-red), var(--pac-red-dark));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--pac-t-slow) var(--pac-ease);
}

.pac-academy .pac-stat:hover::before { transform: scaleX(1); }
.pac-academy .pac-stat:hover {
    transform: translateY(-3px);
    box-shadow: var(--pac-shadow);
}

.pac-academy .pac-stat__num {
    font-size: 34px;
    font-weight: 900;
    letter-spacing: -0.04em;
    color: var(--pac-text);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.pac-academy .pac-stat__label {
    font-size: 12px;
    font-weight: 650;
    color: var(--pac-text-soft);
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

/* ================================================================
   14. PRIX
   ================================================================ */

.pac-academy .pac-price {
    font-size: 19px;
    font-weight: 800;
    color: var(--pac-text);
    margin-right: auto;
    letter-spacing: -0.03em;
}

.pac-academy .pac-price--free {
    color: var(--pac-success);
    background: var(--pac-success-bg);
    padding: 4px 10px;
    border-radius: var(--pac-r-pill);
    font-size: 14px;
}

/* ================================================================
   15. ANIMATIONS D'ENTRÉE
   ================================================================ */

@keyframes pac-fade-up {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes pac-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes pac-scale-in {
    from { opacity: 0; transform: scale(0.92); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes pac-slide-right {
    from { opacity: 0; transform: translateX(-20px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Classes d'animation utilisables */
.pac-academy .pac-anim-fade-up {
    opacity: 0;
    animation: pac-fade-up 0.5s var(--pac-ease) forwards;
}

.pac-academy .pac-anim-scale-in {
    opacity: 0;
    animation: pac-scale-in 0.4s var(--pac-ease-spring) forwards;
}

/* Les cards de la grille s'animent automatiquement */
.pac-academy .pac-grid > * {
    opacity: 0;
    animation: pac-fade-up 0.5s var(--pac-ease) both;
}

/* ================================================================
   16. CURSEUR / FOCUS ACCESSIBLE
   ================================================================ */

.pac-academy :focus-visible {
    outline: 2.5px solid var(--pac-red);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ================================================================
   17. SCROLLBAR (WebKit)
   ================================================================ */

.pac-academy ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.pac-academy ::-webkit-scrollbar-track {
    background: var(--pac-bg-2);
    border-radius: 3px;
}

.pac-academy ::-webkit-scrollbar-thumb {
    background: var(--pac-border-2);
    border-radius: 3px;
}

.pac-academy ::-webkit-scrollbar-thumb:hover {
    background: var(--pac-text-ghost);
}

/* ================================================================
   18. UTILITAIRES
   ================================================================ */

.pac-academy .pac-text-red    { color: var(--pac-red); }
.pac-academy .pac-text-muted  { color: var(--pac-text-muted); }
.pac-academy .pac-text-soft   { color: var(--pac-text-soft); }
.pac-academy .pac-text-ghost  { color: var(--pac-text-ghost); }
.pac-academy .pac-text-white  { color: #fff; }
.pac-academy .pac-text-success{ color: var(--pac-success); }

.pac-academy .pac-fw-400 { font-weight: 400; }
.pac-academy .pac-fw-600 { font-weight: 600; }
.pac-academy .pac-fw-700 { font-weight: 700; }
.pac-academy .pac-fw-800 { font-weight: 800; }
.pac-academy .pac-fw-900 { font-weight: 900; }

.pac-academy .pac-mt-0  { margin-top: 0; }
.pac-academy .pac-mb-0  { margin-bottom: 0; }
.pac-academy .pac-mt-sm { margin-top: var(--pac-sp-sm); }
.pac-academy .pac-mt-md { margin-top: var(--pac-sp-md); }
.pac-academy .pac-mt-lg { margin-top: var(--pac-sp-lg); }

.pac-academy .pac-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--pac-border), transparent);
    margin: var(--pac-sp-lg) 0;
    border: 0;
}

.pac-academy .pac-dot-sep {
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--pac-border-2);
    margin: 0 8px;
    vertical-align: middle;
}

/* ================================================================
   19. RESPONSIVE
   ================================================================ */

@media (max-width: 768px) {
    .pac-academy {
        padding: var(--pac-sp-xl) 0;
    }
    .pac-academy .pac-shell {
        width: calc(100% - 24px);
    }
    .pac-academy .pac-cta-row {
        flex-direction: column;
        align-items: stretch;
    }
    .pac-academy .pac-cta-row .pac-btn {
        width: 100%;
        justify-content: center;
    }
    .pac-academy .pac-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .pac-academy h1 { letter-spacing: -0.035em; }
}

@media (max-width: 480px) {
    .pac-academy .pac-card__body { padding: 18px 16px 20px; }
    .pac-academy .pac-hero-dark { border-radius: var(--pac-r-lg); }
}

/* ================================================================
   20. REDUCED MOTION
   ================================================================ */

@media (prefers-reduced-motion: reduce) {
    .pac-academy *,
    .pac-academy *::before,
    .pac-academy *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}