/* ═══════════════════════════════════════════════════════
   TALENT SHOW WF — PAGE D'ACCUEIL v22
   Design clair, structuré, impactant
   ═══════════════════════════════════════════════════════ */

/* Reset global accueil */
#ts-accueil, #ts-accueil * { box-sizing:border-box; }
#ts-accueil { font-family:'Inter',system-ui,sans-serif; overflow:hidden; }

/* ── HERO ── */
.ta-hero {
  position:relative; min-height:100vh;
  background:#060612;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  padding:80px 24px 80px; text-align:center; overflow:hidden;
}
#ta-canvas { position:absolute; inset:0; pointer-events:none; z-index:0; }
.ta-hero-inner {
  position:relative; z-index:2;
  max-width:860px; margin:0 auto;
  animation:ta-rise .8s ease both;
}
@keyframes ta-rise { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:none} }

.ta-hero-badge {
  display:inline-block;
  background:rgba(251,191,36,.12); border:1px solid rgba(251,191,36,.3);
  color:#fbbf24; padding:6px 22px; border-radius:50px;
  font-size:.72rem; font-weight:700; letter-spacing:3px; text-transform:uppercase;
  margin-bottom:22px;
}
.ta-hero-title {
  font-size:clamp(2.8rem,7vw,5.5rem);
  font-weight:900; letter-spacing:-2px; line-height:1;
  color:#fff;
  background:linear-gradient(135deg,#fff 0%,#fbbf24 45%,#f87171 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-bottom:18px;
}
.ta-hero-sub {
  font-size:clamp(.9rem,1.8vw,1.1rem);
  color:rgba(255,255,255,.5); letter-spacing:1px;
  margin-bottom:32px; line-height:1.5;
}
.ta-hero-stats {
  display:inline-flex; flex-wrap:wrap; justify-content:center;
  gap:0; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1); border-radius:50px;
  padding:4px; margin-bottom:32px;
}
.ta-hs { display:flex; flex-direction:column; align-items:center; padding:10px 20px; }
.ta-hs+.ta-hs { border-left:1px solid rgba(255,255,255,.08); }
.ta-hn { font-size:1.5rem; font-weight:900; color:#fbbf24; line-height:1; }
.ta-hl { font-size:.6rem; color:rgba(255,255,255,.35); text-transform:uppercase; letter-spacing:1px; margin-top:2px; }
.ta-cta-btn {
  display:inline-flex; align-items:center; gap:10px;
  background:linear-gradient(135deg,#1F4E79,#2E75B6);
  color:#fff; text-decoration:none;
  padding:16px 36px; border-radius:50px;
  font-weight:800; font-size:.95rem;
  box-shadow:0 8px 32px rgba(46,117,182,.4);
  transition:all .3s;
}
.ta-cta-btn:hover { transform:translateY(-3px); box-shadow:0 16px 48px rgba(46,117,182,.5); color:#fff; }
.ta-cta-btn span { transition:transform .25s; }
.ta-cta-btn:hover span { transform:translateX(5px); }
.ta-cta-lg { font-size:1.05rem; padding:18px 44px; }
.ta-scroll-hint {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.2); font-size:1.2rem; z-index:2;
  animation:ta-bob 2s ease-in-out infinite;
}
@keyframes ta-bob { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }

/* ── SECTIONS ── */
.ta-sec { padding:72px 24px; color:#fff; }
.ta-sec-dark { background:#08081a; }
#ts-accueil .ta-sec:not(.ta-sec-dark) { background:#0d0d22; }
.ta-cta-final { background:linear-gradient(135deg,#060612,#1a0b30); }
.ta-container { max-width:1060px; margin:0 auto; }
.ta-sec-badge {
  display:inline-block;
  background:rgba(251,191,36,.1); border:1px solid rgba(251,191,36,.2);
  color:#fbbf24; padding:4px 14px; border-radius:50px;
  font-size:.68rem; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  margin-bottom:12px;
}
.ta-sec-title {
  font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:900;
  color:#fff; margin-bottom:36px; letter-spacing:-.5px;
}

/* ── PITCH ── */
.ta-pitch-body { max-width:760px; }
.ta-pitch-lead {
  font-size:1.05rem; color:rgba(255,255,255,.78);
  line-height:1.85; margin-bottom:20px;
}
.ta-pitch-lead strong { color:#fbbf24; }
.ta-quote {
  border-left:3px solid #fbbf24;
  padding:14px 20px; font-style:italic;
  color:rgba(255,255,255,.55); font-size:.95rem;
  background:rgba(251,191,36,.05); border-radius:0 10px 10px 0;
  line-height:1.7; margin-bottom:28px;
}
.ta-talent-chips { display:flex; flex-wrap:wrap; gap:10px; }
.ta-chip {
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
  border-radius:50px; padding:8px 18px; font-size:.84rem;
  color:rgba(255,255,255,.75); font-weight:600;
  transition:all .2s;
}
.ta-chip:hover { background:rgba(255,255,255,.13); color:#fff; transform:translateY(-2px); }

/* ── CATÉGORIES ── */
.ta-cat-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
@media(max-width:768px){ .ta-cat-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px){ .ta-cat-grid{ grid-template-columns:1fr; } }
.ta-cat {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-top:3px solid var(--cc,#fff);
  border-radius:16px; padding:22px 18px;
  transition:all .3s;
}
.ta-cat:hover {
  background:rgba(255,255,255,.09);
  transform:translateY(-5px);
  box-shadow:0 16px 48px rgba(0,0,0,.3);
  border-color:var(--cc);
}
.ta-cat-top { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.ta-cat-emoji { font-size:1.8rem; }
.ta-cat h3 { font-size:.95rem; font-weight:800; color:#fff; margin:0; }
.ta-cat p { font-size:.8rem; color:rgba(255,255,255,.55); line-height:1.65; margin-bottom:12px; }
.ta-cat-tags { display:flex; flex-wrap:wrap; gap:5px; }
.ta-cat-tags span {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  border-radius:20px; padding:2px 9px; font-size:.68rem;
  color:var(--cc,#fff); font-weight:700;
}

/* ── TIMELINE ── */
.ta-tl { max-width:680px; position:relative; }
.ta-tl::before {
  content:''; position:absolute; left:20px; top:20px; bottom:20px;
  width:2px; background:linear-gradient(to bottom,#2E75B6,#fbbf24);
  border-radius:2px;
}
.ta-tl-step { display:flex; gap:20px; align-items:flex-start; margin-bottom:36px; }
.ta-tl-step:last-child { margin-bottom:0; }
.ta-tl-marker { flex-shrink:0; width:40px; display:flex; justify-content:center; }
.ta-tl-dot {
  width:40px; height:40px; border-radius:50%;
  background:#1a1a3e; border:3px solid rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center;
  font-size:.9rem; position:relative; z-index:1;
  flex-shrink:0;
}
.ta-tl-dot-live {
  background:linear-gradient(135deg,#1F4E79,#2E75B6);
  border-color:#2E75B6;
  animation:ta-pulse-dot 2s ease-in-out infinite;
}
.ta-tl-dot-live::after {
  content:''; position:absolute; inset:-5px; border-radius:50%;
  border:2px solid rgba(46,117,182,.4);
  animation:ta-ring 2s ease-in-out infinite;
}
@keyframes ta-pulse-dot { 0%,100%{box-shadow:0 0 0 4px rgba(46,117,182,.2)} 50%{box-shadow:0 0 0 8px rgba(46,117,182,.08)} }
@keyframes ta-ring { 0%{transform:scale(1);opacity:.6} 100%{transform:scale(1.4);opacity:0} }
.ta-tl-dot-gold {
  background:linear-gradient(135deg,#d97706,#fbbf24);
  border-color:#fbbf24;
  font-size:1rem;
  box-shadow:0 0 20px rgba(251,191,36,.3);
}
.ta-tl-body { flex:1; padding-top:8px; }
.ta-tl-when {
  font-size:.68rem; font-weight:700; color:#2E75B6;
  text-transform:uppercase; letter-spacing:1px;
  background:rgba(46,117,182,.1); border-radius:20px;
  padding:2px 10px; display:inline-block; margin-bottom:6px;
}
.ta-tl-when-gold { color:#fbbf24; background:rgba(251,191,36,.12); }
.ta-tl-body h4 { font-size:1rem; font-weight:800; color:#fff; margin-bottom:6px; }
.ta-tl-star .ta-tl-body h4 { color:#fbbf24; font-size:1.05rem; }
.ta-tl-body p { font-size:.82rem; color:rgba(255,255,255,.5); line-height:1.65; }

/* ── LANGUES ── */
.ta-lang-rule {
  display:grid; grid-template-columns:1fr auto 1fr; gap:24px;
  align-items:center; max-width:860px;
}
@media(max-width:640px){ .ta-lang-rule{ grid-template-columns:1fr; } }
.ta-lang-obligatoire, .ta-lang-optionnel {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px; padding:24px 22px;
}
.ta-lang-obligatoire { border-top:3px solid #ef4444; }
.ta-lang-optionnel   { border-top:3px solid #fbbf24; }
.ta-lang-rule-label {
  font-size:.65rem; font-weight:800; letter-spacing:1.5px;
  text-transform:uppercase; margin-bottom:8px;
}
.ta-lang-obligatoire .ta-lang-rule-label { color:#f87171; }
.ta-lang-optionnel   .ta-lang-rule-label { color:#fbbf24; }
.ta-lang-rule-title { font-size:1rem; font-weight:800; color:#fff; margin-bottom:8px; }
.ta-lang-rule-detail { font-size:.82rem; color:rgba(255,255,255,.55); line-height:1.6; margin-bottom:14px; }
.ta-lang-flags { display:flex; flex-wrap:wrap; gap:8px; }
.ta-lang-flags span {
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  border-radius:50px; padding:5px 13px; font-size:.8rem;
  font-weight:600; color:rgba(255,255,255,.75);
}
.ta-lang-plus {
  font-size:2rem; font-weight:900; color:rgba(255,255,255,.2);
  text-align:center;
}

/* ── DOCUMENTS ── */
.ta-docs-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.ta-doc {
  display:flex; align-items:center; gap:14px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  border-radius:12px; padding:16px 18px; text-decoration:none;
  color:#fff; transition:all .25s;
}
.ta-doc:hover { background:rgba(255,255,255,.1); transform:translateY(-2px); border-color:rgba(251,191,36,.4); color:#fff; }
.ta-doc-icon { font-size:1.8rem; flex-shrink:0; }
.ta-doc-info { flex:1; }
.ta-doc-info strong { display:block; font-size:.88rem; font-weight:700; margin-bottom:2px; }
.ta-doc-info small { font-size:.73rem; color:rgba(255,255,255,.4); }
.ta-doc-arrow { color:rgba(255,255,255,.25); font-size:1.1rem; transition:all .2s; }
.ta-doc:hover .ta-doc-arrow { color:#fbbf24; transform:translateY(2px); }

/* ── FAB Modifier ── */
.ta-edit-fab {
  position:fixed; bottom:24px; right:24px; z-index:1000;
  background:rgba(31,78,121,.9); border:1px solid rgba(255,255,255,.2);
  border-radius:50px; padding:10px 18px; color:#fff;
  font-size:.78rem; font-weight:600; cursor:pointer;
  backdrop-filter:blur(10px); transition:all .25s; font-family:inherit;
}
.ta-edit-fab:hover { background:#1F4E79; transform:translateY(-2px); }
.ta-edit-modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.75);
  display:flex; align-items:center; justify-content:center;
  z-index:2000; padding:20px;
}
.ta-edit-modal {
  background:#0d0d22; border:1px solid rgba(255,255,255,.15);
  border-radius:18px; padding:28px; max-width:420px; width:100%;
  animation:ta-rise .3s ease;
}
.ta-edit-modal h3 { font-size:1.1rem; font-weight:800; margin-bottom:16px; color:#fff; }
.ta-edit-modal input {
  width:100%; background:rgba(255,255,255,.07);
  border:1.5px solid rgba(255,255,255,.15); border-radius:10px;
  padding:10px 14px; color:#fff; font-family:inherit; font-size:.87rem;
  margin-bottom:12px;
}
.ta-edit-modal input:focus { outline:none; border-color:#2E75B6; }
.ta-edit-modal-btns { display:flex; gap:10px; }
.ta-edit-modal-btns button {
  flex:1; padding:11px; border:none; border-radius:10px;
  font-weight:700; cursor:pointer; font-family:inherit; font-size:.87rem;
}
.ta-edit-ok     { background:linear-gradient(135deg,#1F4E79,#2E75B6); color:#fff; }
.ta-edit-cancel { background:rgba(255,255,255,.08); color:rgba(255,255,255,.7); }
.ta-edit-err    { color:#f87171; font-size:.78rem; margin-bottom:8px; }

/* Scroll animations */
.ta-cat,.ta-tl-step,.ta-doc,.ta-chip { transition:opacity .5s ease,transform .5s ease; }

/* ── BANDEAU ÉTAPE EN COURS ────────────────────────────── */
.ta-etape-banner {
  background:linear-gradient(135deg,#1a2744 0%,#1F4E79 100%);
  border-bottom:3px solid #fbbf24;
  padding:0; position:relative; z-index:10;
  overflow:hidden;
}
.ta-etape-banner::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 120% at 80% 50%,rgba(251,191,36,.08),transparent);
  pointer-events:none;
}
.ta-etape-inner {
  max-width:1060px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:18px 24px; flex-wrap:wrap;
}
.ta-etape-left { display:flex; align-items:center; gap:16px; }
.ta-etape-num {
  width:52px; height:52px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,#d97706,#fbbf24);
  color:#fff; font-size:1.5rem; font-weight:900;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 4px rgba(251,191,36,.25);
  animation:ta-etape-pulse 2s ease-in-out infinite;
}
@keyframes ta-etape-pulse {
  0%,100%{box-shadow:0 0 0 4px rgba(251,191,36,.25)}
  50%{box-shadow:0 0 0 10px rgba(251,191,36,.08)}
}
.ta-etape-surtitre {
  font-size:.62rem; font-weight:800; letter-spacing:2px;
  text-transform:uppercase; color:#fbbf24; margin-bottom:2px;
}
.ta-etape-titre {
  font-size:1rem; font-weight:800; color:#fff; margin-bottom:2px;
}
.ta-etape-desc { font-size:.78rem; color:rgba(255,255,255,.55); }

.ta-etape-btn {
  background:linear-gradient(135deg,#d97706,#fbbf24);
  color:#000; border:none; border-radius:50px;
  padding:12px 26px; font-weight:800; font-size:.9rem;
  cursor:pointer; white-space:nowrap; font-family:inherit;
  transition:all .25s; display:flex; align-items:center; gap:8px;
  box-shadow:0 4px 16px rgba(251,191,36,.35);
}
.ta-etape-btn:hover {
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(251,191,36,.5);
}
.ta-etape-arrow { transition:transform .2s; }
.ta-etape-btn:hover .ta-etape-arrow { transform:translateX(4px); }

.ta-etape-steps {
  background:rgba(0,0,0,.2); padding:10px 24px;
  display:flex; gap:0; align-items:center;
  border-top:1px solid rgba(255,255,255,.08);
}
.ta-etape-step {
  display:flex; align-items:center; gap:8px;
  padding:6px 16px; flex:1; position:relative;
}
.ta-etape-step+.ta-etape-step::before {
  content:'→'; position:absolute; left:0;
  color:rgba(255,255,255,.2); font-size:.9rem;
}
.ta-etape-step-n {
  width:22px; height:22px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:.72rem; font-weight:800;
}
.ta-etape-step-l { font-size:.72rem; font-weight:600; }

.ta-etape-step-active .ta-etape-step-n { background:#fbbf24; color:#000; }
.ta-etape-step-active .ta-etape-step-l { color:#fbbf24; font-weight:800; }
.ta-etape-step-done .ta-etape-step-n { background:#22c55e; color:#fff; }
.ta-etape-step-done .ta-etape-step-l { color:rgba(255,255,255,.5); text-decoration:line-through; }
.ta-etape-step-future .ta-etape-step-n { background:rgba(255,255,255,.1); color:rgba(255,255,255,.3); }
.ta-etape-step-future .ta-etape-step-l { color:rgba(255,255,255,.25); }

@media(max-width:640px) {
  .ta-etape-inner { flex-direction:column; align-items:flex-start; }
  .ta-etape-steps { flex-direction:column; gap:8px; }
  .ta-etape-step+.ta-etape-step::before { content:'↓'; top:-12px; left:10px; }
}