/* ============================================================
   WORKWITH TURITOTO — ww.css
   Complément au style.css du site principal (mêmes tokens).
   ============================================================ */

/* ---- Compteur de places ---- */
.slots{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--bg-alt);
  border-radius:980px;padding:8px 18px;
  font-size:14px;letter-spacing:-.01em;
  margin-top:26px;
}
[data-theme="dark"] .slots{background:#1d1d1f}
.slots b{font-weight:600;color:var(--ink)}
.slots .dot{
  width:7px;height:7px;border-radius:50%;background:#34c759;
  box-shadow:0 0 0 0 rgba(52,199,89,.5);animation:beat 2.4s infinite;
}
@keyframes beat{
  0%{box-shadow:0 0 0 0 rgba(52,199,89,.45)}
  70%{box-shadow:0 0 0 8px rgba(52,199,89,0)}
  100%{box-shadow:0 0 0 0 rgba(52,199,89,0)}
}

/* ---- Étapes ---- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:900px;margin:0 auto}
@media(max-width:820px){.steps{grid-template-columns:1fr}}
.step{background:var(--bg);border-radius:var(--radius);padding:32px 28px}
[data-theme="dark"] .step{background:var(--bg-alt)}
.step .num{
  font-size:13px;font-weight:600;color:var(--ink-2);
  letter-spacing:.02em;margin-bottom:12px;
}
.step h3{font-size:20px;font-weight:600;letter-spacing:-.015em;margin-bottom:6px}
.step p{font-size:15px;line-height:1.45;color:var(--ink-2);letter-spacing:-.01em}

/* ---- Liste des partenaires ---- */
.partners{max-width:740px;margin:0 auto}
.partner{
  display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;
  padding:24px 4px;border-top:1px solid var(--hairline);
}
.partner:last-child{border-bottom:1px solid var(--hairline)}
.partner h3{font-size:19px;font-weight:600;letter-spacing:-.015em}
.partner p{font-size:14px;color:var(--ink-2);margin-top:3px;letter-spacing:-.01em}
.partner .kind{
  font-size:12px;font-weight:600;color:var(--ink-2);
  white-space:nowrap;letter-spacing:-.005em;
}
.empty-note{
  text-align:center;color:var(--ink-2);font-size:15px;
  padding:38px 20px;background:var(--bg-alt);border-radius:var(--radius);
  max-width:740px;margin:0 auto;letter-spacing:-.01em;
}
[data-theme="dark"] .empty-note{background:var(--bg-alt)}

/* ---- Formulaire ---- */
.form-wrap{max-width:600px;margin:0 auto}
.field{margin-bottom:22px}
.field label{
  display:block;font-size:12px;font-weight:600;color:var(--ink-2);
  letter-spacing:-.005em;margin-bottom:7px;
}
.field .hint{display:block;font-weight:400;margin-top:3px;font-size:12px;color:var(--ink-2)}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:17px;letter-spacing:-.022em;
  color:var(--ink);background:var(--bg);
  border:1px solid var(--hairline);border-radius:12px;
  padding:13px 16px;outline:none;
  transition:border-color .2s,box-shadow .2s;
  -webkit-appearance:none;appearance:none;
}
[data-theme="dark"] .field input,[data-theme="dark"] .field select,[data-theme="dark"] .field textarea{background:#1d1d1f;border-color:#3a3a3c}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--blue);box-shadow:0 0 0 3.5px rgba(0,113,227,.18);
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M3 5l4 4 4-4' fill='none' stroke='%2386868b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;
  padding-right:42px;cursor:pointer;
}
.field textarea{min-height:150px;resize:vertical;line-height:1.5}
.field-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.field-2{grid-template-columns:1fr}}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.form-actions{text-align:center;margin-top:30px}
.form-actions .btn{border:none;cursor:pointer;font-family:inherit;width:100%;max-width:300px}
.btn[disabled]{opacity:.5;cursor:default}
.form-note{text-align:center;font-size:12px;color:var(--ink-2);margin-top:16px;letter-spacing:-.005em}
.form-status{display:none;text-align:center;font-size:15px;letter-spacing:-.01em;border-radius:12px;padding:16px 18px;margin-top:22px}
.form-status.ok{display:block;background:rgba(52,199,89,.12);color:#1a7f37}
[data-theme="dark"] .form-status.ok{color:#30d158}
.form-status.err{display:block;background:rgba(255,59,48,.1);color:#c0271d}
[data-theme="dark"] .form-status.err{color:#ff6961}
.form-status b{display:block;font-size:19px;font-weight:600;margin-top:6px;letter-spacing:-.015em}

/* ---- Suivi des tickets ---- */
.track-form{display:grid;grid-template-columns:1fr 150px auto;gap:12px;max-width:620px;margin:0 auto 26px;align-items:end}
@media(max-width:640px){.track-form{grid-template-columns:1fr}}
.track-form .btn{border:none;cursor:pointer;font-family:inherit;padding:13px 24px;font-size:15px}
.tickets{max-width:740px;margin:0 auto}
.ticket-card{
  background:var(--bg);border:1px solid var(--hairline);
  border-radius:var(--radius);padding:26px 28px;margin-bottom:14px;
}
[data-theme="dark"] .ticket-card{background:var(--bg-alt);border-color:#2c2c2e}
.ticket-card .top{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.ticket-card .ref{font-size:13px;font-weight:600;color:var(--ink-2);letter-spacing:.02em}
.ticket-card h3{font-size:21px;font-weight:600;letter-spacing:-.015em;margin-bottom:6px}
.ticket-card .desc{font-size:15px;line-height:1.5;color:var(--ink-2);letter-spacing:-.01em}
.ticket-card .facts{margin-top:16px;padding-top:14px;border-top:1px solid var(--hairline);font-size:13px;color:var(--ink-2);letter-spacing:-.005em}
.state{
  font-size:12px;font-weight:600;letter-spacing:.01em;
  padding:5px 12px;border-radius:980px;white-space:nowrap;
}
.state.recu{background:rgba(0,113,227,.12);color:#0071e3}
.state.etude{background:rgba(255,149,0,.14);color:#b64400}
[data-theme="dark"] .state.etude{color:#ff9f0a}
.state.accepte{background:rgba(52,199,89,.14);color:#1a7f37}
[data-theme="dark"] .state.accepte{color:#30d158}
.state.termine{background:var(--bg-alt);color:var(--ink-2)}
[data-theme="dark"] .state.termine{background:#2c2c2e}
.state.refuse{background:rgba(255,59,48,.1);color:#c0271d}
[data-theme="dark"] .state.refuse{color:#ff6961}

/* ---- Bandeau app ---- */
.appsoon{text-align:center;max-width:640px;margin:0 auto}
.appsoon .tagline{font-size:12px;font-weight:600;color:var(--tag);margin-bottom:12px;letter-spacing:.01em}
.appsoon h2{font-size:clamp(32px,5vw,52px);font-weight:700;letter-spacing:-.015em;line-height:1.06}
.appsoon p{font-size:clamp(17px,2.2vw,20px);color:var(--ink-2);margin-top:14px;letter-spacing:.004em}
.section-dark .appsoon p{color:#86868b}