/**
 * Omega Bridge — Styles v3 (Néo-Tokyo)
 * Direction bicolore : surfaces papier washi pour les formulaires,
 * accents sombres pour les cards featured + ambiance manga.
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Bangers&family=Noto+Sans+JP:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap');

/* =============================================================
   TOKENS — scoped to .omega-bridge so we don't leak into the WP theme
   ============================================================= */
.omega-bridge {
    /* Brand */
    --o-orange: #FF6210;
    --o-orange-hover: #E5580E;
    --o-orange-soft: #FFB48A;
    --o-orange-100: #FFE7D8;

    /* Dark surfaces (featured cards) */
    --o-ink-900: #0B0604;
    --o-ink-800: #140A06;
    --o-ink-700: #1F120C;
    --o-ink-600: #2D1A12;

    /* Light surfaces (forms, washi paper) */
    --o-paper:    #FAF6EE;
    --o-paper-2:  #F2EAD8;
    --o-paper-3:  #E7DCC4;
    --o-cream:    #FFFDF7;

    /* Foreground */
    --o-fg-dark:    #1B100A;
    --o-fg-dark-70: rgba(27, 16, 10, 0.72);
    --o-fg-dark-50: rgba(27, 16, 10, 0.50);
    --o-fg-dark-30: rgba(27, 16, 10, 0.28);
    --o-fg-light:    #F6F4ED;
    --o-fg-light-70: rgba(246, 244, 237, 0.72);
    --o-fg-light-50: rgba(246, 244, 237, 0.50);
    --o-fg-light-30: rgba(246, 244, 237, 0.30);

    /* Lines */
    --o-line-dark: rgba(246, 244, 237, 0.12);
    --o-line-dark-strong: rgba(246, 244, 237, 0.22);
    --o-line-light: rgba(27, 16, 10, 0.10);
    --o-line-light-strong: rgba(27, 16, 10, 0.18);

    /* Sémantique */
    --o-success: #2D9F6E;
    --o-warning: #C77400;
    --o-danger:  #C53030;

    /* Type */
    --f-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --f-display: 'Bangers', 'Inter', system-ui, sans-serif;
    --f-jp: 'Noto Sans JP', system-ui, sans-serif;
    --f-mono: 'JetBrains Mono', ui-monospace, monospace;

    /* Radius */
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 22px;
    --r-pill: 999px;

    /* Shadows */
    --sh-sm: 0 1px 2px rgba(20, 10, 6, 0.08);
    --sh-md: 0 6px 24px -8px rgba(20, 10, 6, 0.18);
    --sh-lg: 0 24px 48px -16px rgba(20, 10, 6, 0.28);

    /* Manga corner accent */
    --corner-size: 14px;
    --corner-stroke: 2px;

    font-family: var(--f-body);
    color: var(--o-fg-dark);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;

    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
    padding: 24px 24px 80px;
    box-sizing: border-box;
}

.omega-bridge *,
.omega-bridge *::before,
.omega-bridge *::after { box-sizing: border-box; }

/* ---- WP theme defeat — strip aggressive heading/button defaults inside the plugin ---- */
.omega-bridge h1,
.omega-bridge h2,
.omega-bridge h3,
.omega-bridge h4,
.omega-bridge h5,
.omega-bridge h6 {
    font-family: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
    line-height: 1.2;
    background: none;
    border: 0;
    text-transform: none;
    letter-spacing: normal;
    font-weight: inherit;
}
.omega-bridge button,
.omega-bridge a,
.omega-bridge input {
    font-family: inherit;
    color: inherit;
}
.omega-bridge p {
    margin: 0;
    padding: 0;
    color: inherit;
    font-family: inherit;
}
.omega-bridge ul,
.omega-bridge ol,
.omega-bridge li {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Paper background for the whole tunnel */
.omega-bridge--paper {
    background: var(--o-paper);
    border-radius: var(--r-xl);
    background-image:
        radial-gradient(ellipse 600px 300px at 100% 0%, rgba(255, 98, 16, 0.05), transparent 60%),
        radial-gradient(ellipse 400px 240px at 0% 100%, rgba(255, 98, 16, 0.03), transparent 60%);
}

/* =============================================================
   STEPPER (signature component) — scoped + centered
   ============================================================= */
.omega-bridge .omega-stepper {
    margin: 0 auto 24px;
    padding: 12px 18px;
    background: rgba(255, 253, 247, 0.85);
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-pill);
    backdrop-filter: blur(8px);
    box-shadow: var(--sh-sm);
    max-width: 720px;
}
.omega-bridge .omega-stepper-track {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.omega-bridge .omega-step-item {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;          /* connectors stretch */
    color: var(--o-fg-dark-50);
    font-size: 11px;
    font-weight: 600;
    position: relative;
    min-width: 0;
}
.omega-bridge .omega-step-item:last-child { flex: 0 0 auto; }
.omega-bridge .omega-step-item:not(:last-child)::after {
    content: '';
    flex: 1 1 auto;
    height: 1px;
    min-width: 14px;
    margin: 0 4px;
    background: var(--o-line-light);
    align-self: center;
}
.omega-bridge .omega-step-item.is-done:not(:last-child)::after,
.omega-bridge .omega-step-item.is-active:not(:last-child)::after {
    background: var(--o-orange);
}
.omega-bridge .omega-step-bullet {
    width: 26px;
    height: 26px;
    border-radius: var(--r-pill);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    border: 1.5px solid var(--o-line-light);
    background: transparent;
    color: var(--o-fg-dark-50);
    transition: all 0.2s ease;
    flex: 0 0 auto;
}
.omega-bridge .omega-step-label {
    font-family: var(--f-display);
    letter-spacing: 0.1em;
    font-size: 11px;
    text-transform: uppercase;
    display: none;
    white-space: nowrap;
}
.omega-bridge .omega-step-item.is-done .omega-step-bullet {
    background: rgba(255, 98, 16, 0.14);
    border-color: var(--o-orange);
    color: var(--o-orange);
    font-size: 0;
}
.omega-bridge .omega-step-item.is-done .omega-step-bullet::after {
    content: '✓';
    font-size: 13px;
    line-height: 1;
}
.omega-bridge .omega-step-item.is-active .omega-step-bullet {
    background: var(--o-orange);
    border-color: var(--o-orange);
    color: #fff;
}
.omega-bridge .omega-step-item.is-active { color: var(--o-fg-dark); }
.omega-bridge .omega-step-item.is-active .omega-step-label { display: inline; }

@media (max-width: 480px) {
    .omega-bridge .omega-stepper { padding: 10px 14px; }
    .omega-bridge .omega-step-item:not(:last-child)::after { min-width: 6px; }
}

/* =============================================================
   CHAPTER TITLE (kanji eyebrow + title + subtitle) — fully scoped
   ============================================================= */
.omega-bridge .omega-chapter,
.omega-bridge .omega-step-header {
    margin: 0 0 24px !important;
    padding: 0 !important;
}
.omega-bridge .omega-chapter-eyebrow {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
}
.omega-bridge .omega-chapter-kanji {
    display: inline-flex;
    align-items: center;
    font-family: var(--f-jp);
    font-size: 14px;
    line-height: 1.25;
    color: var(--o-orange);
    background: rgba(255, 98, 16, 0.12);
    border: 1px solid rgba(255, 98, 16, 0.35);
    padding: 3px 9px;
    border-radius: 6px;
    text-transform: none;
}
.omega-bridge .omega-chapter-num {
    font-family: var(--f-display);
    font-size: 13px;
    letter-spacing: 0.16em;
    color: var(--o-orange);
    text-transform: uppercase;
}
.omega-bridge .omega-chapter-title,
.omega-bridge .omega-step-title,
.omega-bridge h3.omega-step-title {
    font-family: var(--f-body) !important;
    font-size: clamp(24px, 4.5vw, 32px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.15 !important;
    color: var(--o-fg-dark) !important;
    margin: 0 !important;
    padding: 0 !important;
    text-wrap: balance;
    text-transform: none !important;
}
.omega-bridge .omega-step-subtitle {
    font-size: 15px !important;
    color: var(--o-fg-dark-70) !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    line-height: 1.55 !important;
    max-width: 60ch;
    font-style: normal !important;
}

/* =============================================================
   NAV — dark band showing current selection + "Changer" button
   (style varies per step via [data-step] selectors)
   ============================================================= */
.omega-bridge .omega-nav {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 20px !important;
    padding: 12px 16px;
    background: var(--o-ink-800);
    color: var(--o-fg-light);
    border: 1px solid rgba(255, 98, 16, 0.35);
    border-radius: var(--r-md);
    flex-wrap: wrap;
    position: relative;
}
.omega-bridge .omega-nav::before {
    content: attr(data-kanji);
    font-family: var(--f-jp);
    font-size: 14px;
    color: var(--o-orange);
    background: rgba(255, 98, 16, 0.15);
    padding: 3px 9px;
    border-radius: 6px;
    flex-shrink: 0;
}
/* Per-step kanji injected on the nav */
.omega-bridge [data-step="license"] .omega-nav::before { content: '道場'; }
.omega-bridge [data-step="results"] .omega-nav::before { content: '免許'; }
.omega-bridge [data-step="detail"]  .omega-nav::before { content: '形';   }
.omega-bridge [data-step="events"]  .omega-nav::before { content: '道場'; }

.omega-bridge .omega-nav .omega-breadcrumb {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 12px;
    color: var(--o-fg-light-50);
    min-width: 0;
}
.omega-bridge .omega-nav .omega-breadcrumb::before {
    content: 'TON DOJO';
    font-size: 9.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--o-fg-light-50);
    margin-right: 4px;
    flex-shrink: 0;
}
.omega-bridge [data-step="results"] .omega-nav .omega-breadcrumb::before { content: 'TON PERMIS'; }
.omega-bridge [data-step="detail"]  .omega-nav .omega-breadcrumb::before { content: 'TA FORMULE'; }

.omega-bridge .omega-nav .omega-crumb {
    color: var(--o-fg-light) !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    line-height: 1.3 !important;
    white-space: nowrap;
}
.omega-bridge .omega-nav .omega-crumb:hover { color: var(--o-orange) !important; }
/* Show only the FIRST crumb in the dark band — that's the "current selection" the user can change */
.omega-bridge .omega-nav .omega-crumb ~ .omega-crumb,
.omega-bridge .omega-nav .omega-crumb-sep { display: none !important; }

/* Le bandeau montre la sélection pertinente selon l'étape (label en ::before) :
   - results → "TON PERMIS" → on montre le crumb PERMIS (pas l'agence)
   - detail  → "TA FORMULE" → on montre le crumb PACK (ni agence ni permis)
   Le fil d'Ariane est [agence, permis, (pack sur détail)]. */

/* Étape formule : afficher le permis, masquer l'agence. */
.omega-bridge [data-step="results"] .omega-nav .omega-crumb[data-goto="office"] {
    display: none !important;
}
.omega-bridge [data-step="results"] .omega-nav .omega-crumb[data-goto="license"] {
    display: inline-block !important;
}

/* Étape détail : afficher le pack, masquer l'agence ET le permis. */
.omega-bridge [data-step="detail"] .omega-nav .omega-crumb[data-goto="office"],
.omega-bridge [data-step="detail"] .omega-nav .omega-crumb[data-goto="license"] {
    display: none !important;
}
.omega-bridge [data-step="detail"] .omega-nav .omega-crumb.omega-crumb-pack {
    display: inline-block !important;
}

.omega-bridge .omega-nav .omega-btn-back {
    background: transparent;
    border: 1px solid rgba(255, 98, 16, 0.45);
    color: var(--o-orange);
    font: 700 0/1 var(--f-body);
    padding: 6px 14px;
    border-radius: var(--r-pill);
    cursor: pointer;
    transition: all 0.15s ease;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 30px;
}
.omega-bridge .omega-nav .omega-btn-back::before {
    content: 'Changer';
    font-size: 11.5px;
    line-height: 1;
    letter-spacing: 0.04em;
}
.omega-bridge .omega-nav .omega-btn-back:hover {
    background: rgba(255, 98, 16, 0.12);
    color: var(--o-orange-soft);
}

/* =============================================================
   BUTTONS
   ============================================================= */
.omega-btn {
    appearance: none;
    -webkit-appearance: none;
    border: 1.5px solid var(--o-line-light-strong);
    background: var(--o-cream);
    color: var(--o-fg-dark);
    font: 600 13px var(--f-body);
    padding: 10px 18px;
    border-radius: var(--r-pill);
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    line-height: 1.2;
    transition: all 0.15s ease;
}
.omega-bridge .omega-btn:hover { border-color: var(--o-fg-dark); background: #fff; }
.omega-bridge .omega-btn--primary,
.omega-bridge a.omega-btn--primary,
.omega-bridge button.omega-btn--primary {
    background: var(--o-orange) !important;
    color: #fff !important;
    border-color: var(--o-orange) !important;
    font-weight: 700;
    letter-spacing: 0.02em;
    box-shadow: 0 8px 22px -6px rgba(255, 98, 16, 0.55), inset 0 -2px 0 rgba(0, 0, 0, 0.15);
}
.omega-bridge .omega-btn--primary:hover,
.omega-bridge a.omega-btn--primary:hover,
.omega-bridge button.omega-btn--primary:hover {
    background: var(--o-orange-hover) !important;
    border-color: var(--o-orange-hover) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 12px 28px -6px rgba(255, 98, 16, 0.6), inset 0 -2px 0 rgba(0, 0, 0, 0.18);
}
.omega-bridge .omega-btn--full { width: 100%; }
.omega-bridge .omega-btn-retry { margin-top: 16px; }

/* Secondary button variant on a DARK featured pack card — light tinted bg + light text */
.omega-bridge .omega-pack-card--highlighted .omega-btn:not(.omega-btn--primary) {
    background: rgba(246, 244, 237, 0.08) !important;
    color: var(--o-fg-light) !important;
    border: 1px solid rgba(246, 244, 237, 0.25) !important;
}
.omega-bridge .omega-pack-card--highlighted .omega-btn:not(.omega-btn--primary):hover {
    background: rgba(246, 244, 237, 0.15) !important;
    border-color: rgba(246, 244, 237, 0.4) !important;
    color: #fff !important;
}

/* =============================================================
   SELECTABLES (office card, license card — generic base)
   ============================================================= */
.omega-selectable {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
    background: var(--o-cream);
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-lg);
    padding: 16px;
    box-shadow: var(--sh-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: all 0.15s ease;
    position: relative;
    overflow: hidden;
}
.omega-selectable:hover,
.omega-selectable:focus-visible {
    border-color: var(--o-orange);
    box-shadow: 0 12px 24px -8px rgba(255, 98, 16, 0.18);
    transform: translateY(-1px);
    outline: none;
}
.omega-selectable-title {
    font-family: var(--f-display);
    letter-spacing: 0.05em;
    font-size: 18px;
    color: var(--o-fg-dark);
}
.omega-selectable-sub {
    font-size: 12.5px;
    color: var(--o-fg-dark-70);
    line-height: 1.45;
}

/* =============================================================
   STEP 1 — OFFICES
   ============================================================= */

/* Section label above the offices grid (kanji pill + text) */
.omega-bridge .omega-section-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--o-fg-dark-50);
}
.omega-bridge .omega-section-kanji-pill {
    font-family: var(--f-jp);
    font-size: 13px;
    color: var(--o-orange);
    background: rgba(255, 98, 16, 0.12);
    border: 1px solid rgba(255, 98, 16, 0.35);
    padding: 2px 8px;
    border-radius: 6px;
    letter-spacing: 0;
    line-height: 1.25;
}

.omega-bridge .omega-offices-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 14px;
}

/* Office card — design-aligned: photo strip + city Bangers + meta */
.omega-bridge .omega-office-card {
    position: relative;
    padding: 0 !important;
    overflow: hidden;
    min-height: 112px;
    /* push the visible content right of the photo strip */
    padding-left: 110px !important;
    padding-right: 18px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 6px !important;
}
.omega-bridge .omega-office-card::before {
    content: '道';
    font-family: var(--f-jp);
    font-size: 32px;
    line-height: 1;
    color: var(--o-orange);
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        repeating-linear-gradient(135deg, rgba(255, 98, 16, 0.10) 0 8px, transparent 8px 18px),
        var(--o-paper-2);
    border-right: 1px solid var(--o-line-light);
}
.omega-bridge .omega-office-card .omega-selectable-title {
    font-family: var(--f-display);
    font-size: 22px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    line-height: 1.1;
    color: var(--o-fg-dark);
}
.omega-bridge .omega-office-card .omega-selectable-sub {
    font-size: 12.5px;
    color: var(--o-fg-dark-70);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}
.omega-bridge .omega-office-card .omega-selectable-sub:last-of-type {
    color: var(--o-fg-dark-50);
    font-variant-numeric: tabular-nums;
    font-size: 12px;
}
.omega-bridge .omega-office-card:hover::before {
    background:
        repeating-linear-gradient(135deg, rgba(255, 98, 16, 0.14) 0 8px, transparent 8px 18px),
        var(--o-paper-2);
}

/* =============================================================
   STEP 2 — LICENSES
   ============================================================= */
.omega-license-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
@media (min-width: 600px) {
    .omega-license-grid {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 12px;
    }
}
.omega-license-card {
    align-items: stretch;
    padding: 16px 14px;
    min-height: 132px;
    gap: 4px;
}
.omega-license-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(255, 98, 16, 0.10);
    border: 1px solid rgba(255, 98, 16, 0.3);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--o-orange);
    margin-bottom: 12px;
}
.omega-license-icon svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
}
.omega-license-card .omega-selectable-title {
    font-family: var(--f-display);
    font-size: 19px;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}
.omega-license-card .omega-selectable-sub { font-size: 12px; }

/* =============================================================
   STEP 3 — PACKS
   ============================================================= */
.omega-packs-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 8px;
}
@media (min-width: 720px) {
    .omega-packs-grid {
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }
}
.omega-pack-card {
    position: relative;
    background: var(--o-cream);
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-lg);
    box-shadow: 0 2px 8px rgba(20, 10, 6, 0.04);
    padding: 18px 18px 16px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    transition: all 0.2s ease;
}
.omega-pack-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--sh-md);
}
.omega-pack-card--highlighted {
    background: var(--o-ink-800);
    color: var(--o-fg-light);
    border-color: var(--o-orange);
    box-shadow: 0 14px 28px -10px rgba(255, 98, 16, 0.35);
}
.omega-pack-card--highlighted::before,
.omega-pack-card--highlighted::after {
    content: '';
    position: absolute;
    width: var(--corner-size);
    height: var(--corner-size);
    border-color: var(--o-orange);
    border-style: solid;
    border-width: 0;
    pointer-events: none;
}
.omega-pack-card--highlighted::before {
    top: -1px; left: -1px;
    border-top-width: var(--corner-stroke);
    border-left-width: var(--corner-stroke);
    border-top-left-radius: var(--r-lg);
}
.omega-pack-card--highlighted::after {
    bottom: -1px; right: -1px;
    border-bottom-width: var(--corner-stroke);
    border-right-width: var(--corner-stroke);
    border-bottom-right-radius: var(--r-lg);
}
.omega-pack-badge {
    position: absolute;
    top: -10px;
    right: 16px;
    background: var(--o-orange);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    padding: 5px 12px;
    border-radius: 4px;
    text-transform: uppercase;
    transform: rotate(2deg);
    box-shadow: 0 6px 14px rgba(255, 98, 16, 0.4);
    z-index: 2;
}
.omega-pack-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}
.omega-pack-name {
    font-family: var(--f-display);
    letter-spacing: 0.04em;
    font-size: 22px;
    font-weight: 400;
    color: inherit;
    margin: 0;
    text-transform: uppercase;
}
.omega-pack-desc {
    font-size: 13px;
    color: var(--o-fg-dark-70);
    margin: 0;
    line-height: 1.5;
}
.omega-pack-card--highlighted .omega-pack-desc { color: var(--o-fg-light-70); }
.omega-pack-features {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.omega-pack-features li {
    font-size: 11px;
    padding: 3px 10px;
    border-radius: var(--r-pill);
    background: rgba(27, 16, 10, 0.05);
    color: var(--o-fg-dark-70);
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.omega-pack-features li::before {
    content: '✓';
    color: var(--o-orange);
    font-weight: 800;
    font-size: 10px;
}
.omega-pack-card--highlighted .omega-pack-features li {
    background: rgba(246, 244, 237, 0.08);
    color: var(--o-fg-light-70);
}

.omega-pack-footer {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--o-line-light);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.omega-pack-card--highlighted .omega-pack-footer {
    border-top-color: rgba(246, 244, 237, 0.15);
}
.omega-pack-price {
    font-family: var(--f-display);
    font-size: 30px;
    color: var(--o-orange);
    letter-spacing: 0.02em;
    line-height: 1;
}
.omega-pack-price-sub {
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--o-fg-dark-50);
    margin-top: 4px;
    display: block;
    min-height: 1em;
}
.omega-pack-card--highlighted .omega-pack-price-sub { color: var(--o-fg-light-50); }
.omega-pack-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
@media (min-width: 540px) {
    .omega-pack-buttons { flex-direction: row; }
}

/* =============================================================
   NEXT SLOT BANNER
   ============================================================= */
.omega-next-slot-info { margin-top: 14px; }
.omega-next-slot {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: rgba(255, 98, 16, 0.08);
    border: 1px dashed rgba(255, 98, 16, 0.4);
    border-radius: var(--r-md);
    color: var(--o-fg-dark);
    font-size: 13px;
}
.omega-next-slot strong { color: var(--o-orange); }

/* =============================================================
   EVENTS
   ============================================================= */
.omega-events-section { margin-top: 28px; }
.omega-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-family: var(--f-display);
    letter-spacing: 0.08em;
    font-size: 18px;
    color: var(--o-fg-dark);
    text-transform: uppercase;
}
.omega-section-kanji {
    font-family: var(--f-jp);
    font-size: 13px;
    color: var(--o-orange);
    background: rgba(255, 98, 16, 0.12);
    border: 1px solid rgba(255, 98, 16, 0.35);
    padding: 2px 8px;
    border-radius: 6px;
    letter-spacing: 0;
}
.omega-event-filters {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.omega-btn-filter {
    padding: 7px 14px;
    font-size: 12px;
    font-weight: 600;
    background: transparent;
    border: 1.5px solid var(--o-line-light-strong);
    color: var(--o-fg-dark-70);
}
.omega-btn-filter.active,
.omega-btn-filter:hover {
    background: rgba(255, 98, 16, 0.10);
    border-color: var(--o-orange);
    color: var(--o-orange);
}
.omega-events-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
@media (min-width: 720px) {
    .omega-events-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
}
.omega-event-card {
    background: var(--o-cream);
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-lg);
    padding: 16px;
    box-shadow: var(--sh-sm);
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
}
.omega-event-card--full { opacity: 0.6; }
.omega-event-type {
    display: inline-flex;
    align-self: flex-start;
    background: rgba(255, 98, 16, 0.10);
    color: var(--o-orange);
    padding: 3px 10px;
    border-radius: var(--r-pill);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.omega-event-title {
    font-family: var(--f-body);
    font-size: 15px;
    font-weight: 700;
    color: var(--o-fg-dark);
    line-height: 1.3;
}
.omega-event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    font-size: 12px;
    color: var(--o-fg-dark-70);
}
.omega-event-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.omega-event-meta svg { color: var(--o-orange); flex-shrink: 0; }
/* Session théorique multi-séances : badge + une ligne par séance (empilées). */
.omega-event-sessions-count {
    flex-basis: 100%;
    font-weight: 600;
    color: var(--o-orange);
}
.omega-event-session-line { flex-basis: 100%; }
.omega-event-footer {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px dashed var(--o-line-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.omega-event-spots {
    font-size: 12px;
    color: var(--o-success);
    font-weight: 600;
}
.omega-event-full-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--o-fg-dark-50);
}

/* =============================================================
   STEP 4 — DETAIL
   ============================================================= */
.omega-detail {
    background: var(--o-cream);
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-xl);
    padding: 24px;
    position: relative;
    box-shadow: var(--sh-md);
}
.omega-detail::before,
.omega-detail::after {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    border-color: var(--o-orange);
    border-style: solid;
    border-width: 0;
    pointer-events: none;
}
.omega-detail::before {
    top: -1px; left: -1px;
    border-top-width: var(--corner-stroke);
    border-left-width: var(--corner-stroke);
    border-top-left-radius: var(--r-xl);
}
.omega-detail::after {
    bottom: -1px; right: -1px;
    border-bottom-width: var(--corner-stroke);
    border-right-width: var(--corner-stroke);
    border-bottom-right-radius: var(--r-xl);
}
.omega-detail-top { margin-bottom: 22px; }
.omega-detail-badge {
    display: inline-block;
    background: var(--o-orange);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    padding: 4px 12px;
    border-radius: 4px;
    transform: rotate(-1deg);
    margin-bottom: 12px;
    text-transform: uppercase;
    box-shadow: 0 4px 12px rgba(255, 98, 16, 0.35);
}
.omega-detail-title {
    font-family: var(--f-body);
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--o-fg-dark);
    margin: 0 0 8px;
}
.omega-detail-desc {
    color: var(--o-fg-dark-70);
    margin: 0;
    line-height: 1.55;
}
.omega-detail-features {
    margin: 22px 0;
    padding: 16px;
    background: var(--o-paper);
    border-radius: var(--r-md);
    border: 1px solid var(--o-line-light);
}
.omega-detail-features h4 {
    font-family: var(--f-display);
    letter-spacing: 0.08em;
    font-size: 14px;
    color: var(--o-orange);
    margin: 0 0 10px;
    text-transform: uppercase;
}
.omega-detail-features ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.omega-detail-features li {
    font-size: 13.5px;
    color: var(--o-fg-dark);
    padding-left: 22px;
    position: relative;
}
.omega-detail-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--o-orange);
    font-weight: 800;
}
.omega-detail-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border: 1px solid var(--o-line-light);
    border-radius: var(--r-md);
    overflow: hidden;
    margin-bottom: 22px;
}
@media (min-width: 540px) {
    .omega-detail-stats { grid-template-columns: 1fr 1fr; }
}
.omega-detail-stat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid var(--o-line-light);
}
.omega-detail-stat:nth-child(2n) { background: var(--o-paper); }
@media (min-width: 540px) {
    .omega-detail-stat:nth-child(odd) { border-right: 1px solid var(--o-line-light); }
    .omega-detail-stat:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 539px) {
    .omega-detail-stat:last-child { border-bottom: 0; }
}
.omega-detail-stat-label {
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--o-fg-dark-50);
    font-weight: 600;
}
.omega-detail-stat-value {
    font-weight: 700;
    color: var(--o-fg-dark);
    font-variant-numeric: tabular-nums;
    text-align: right;
}
.omega-detail-stat-value--orange {
    color: var(--o-orange);
    font-family: var(--f-display);
    font-size: 22px;
    letter-spacing: 0.02em;
    font-weight: 400;
}
.omega-detail-bottom {
    display: flex;
    justify-content: flex-end;
}
.omega-detail-bottom .omega-btn--primary { padding: 14px 24px; font-size: 14px; }

/* =============================================================
   LOADING / EMPTY / ERROR
   ============================================================= */
.omega-loading {
    text-align: center;
    padding: 40px 24px;
    color: var(--o-fg-dark-50);
    font-size: 14px;
}
.omega-loading::before {
    content: '';
    display: block;
    width: 28px;
    height: 28px;
    margin: 0 auto 14px;
    border: 2px solid var(--o-line-light-strong);
    border-top-color: var(--o-orange);
    border-radius: 50%;
    animation: omega-spin 0.7s linear infinite;
}
@keyframes omega-spin { to { transform: rotate(360deg); } }
.omega-empty {
    text-align: center;
    padding: 40px 24px;
    color: var(--o-fg-dark-50);
    font-size: 14px;
    background: var(--o-paper);
    border: 1px dashed var(--o-line-light-strong);
    border-radius: var(--r-md);
}
.omega-error {
    text-align: center;
    padding: 32px 20px;
    background: rgba(197, 48, 48, 0.05);
    border: 1px solid rgba(197, 48, 48, 0.25);
    border-radius: var(--r-lg);
    color: var(--o-fg-dark);
}
.omega-error-icon {
    width: 44px;
    height: 44px;
    margin: 0 auto 12px;
    border-radius: 50%;
    background: rgba(197, 48, 48, 0.12);
    color: var(--o-danger);
    font-weight: 800;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.omega-error p { margin: 0 0 14px; font-size: 14px; }

/* =============================================================
   RESPONSIVE TIGHTENING
   ============================================================= */
@media (max-width: 480px) {
    .omega-bridge { padding: 16px 12px 60px; }
    .omega-pack-card { padding: 16px 14px 14px; }
    .omega-detail { padding: 20px 16px; }
    .omega-license-grid { gap: 8px; }
    .omega-nav { flex-direction: column; align-items: flex-start; gap: 8px; }
}
