/* ============================================
   Expert public Profile (R11.2) — Léa Aurigny.
   Extracted verbatim from the canonical mockup
   (app/views/mockups/expert/profile.html.erb <style> block).
   Zero inline CSS. Carousels driven by the expert-profile Stimulus controller.
   ============================================ */

/* Reset le centrage du layout (main) pour que la cover remonte au-dessus du menu,
   comme le talent profile. Scopé à cette page pour ne pas fuir sur les autres
   .max-w-7xl (ex. la navbar publique). */
main:has(.tpc) { max-width: none; padding: 0; }

.tpc * { margin: 0; padding: 0; box-sizing: border-box; }
.tpc {
  --gold-1: #C4A559;
  --gold-2: #D4BC7A;
  --gold-3: #D4A832;
  --gold-4: #E5D4A0;
  --gold-5: #F8E27A;
  --gold-grad: linear-gradient(135deg, #C4A559 0%, #D4BC7A 40%, #E5D4A0 70%, #EFE2B8 100%);
  --beige-bg: #FFFFFF;
  --beige-soft: #FFFFFF;
  --beige-card: #F8F4ED;
  --beige-page: #FFFFFF;
  --ink: #1F1B14;
  --ink-2: #3A332A;
  --t1: #2C2620;
  --t2: #6B6055;
  --t3: #9A8E80;
  --t4: #BFB4A4;
  --bd: #E8E0CE;
  --bd2: #F0E9D7;
  --bd-soft: #EFE9DA;
  --green: #2D9B5E;
  --green-bg: #E7F6ED;
  --green-bd: #B7E0C5;
  --red: #E84B4B;
  --red-bg: #FDECEC;
  --red-bd: #F5BFBF;
  --purple: #7B5EA7;

  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  background: var(--beige-page);
  color: var(--t1);
  min-height: 100vh;
  position: relative;
}
.tpc::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .07;
  background: url("/images/design-system/patterns/pattern-voilages-cream.svg") center top / 520px auto repeat;
  z-index: 0;
}
.tpc > * { position: relative; z-index: 1; }

/* ===== COVER BANNER (break out of layout container) ===== */
.tpc-cover {
  width: 100vw;
  height: 429px;
  overflow: hidden;
  position: relative;
  margin-left: calc(-50vw + 50%);
}
.tpc-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  display: block;
}

/* ===== MAIN WRAPPER ===== */
.tpc-wrap {
  max-width: 1344px; /* 1280 contenu + 2*32 padding -> aligne sur le header (1280, comme le talent) */
  margin: 0 auto;
  padding: 24px 32px 0;
}

/* ===== HEADER PROFIL (full-width white bar, talent-aligned) ===== */
.tpc-headerbar {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  background: #fff;
  border-bottom: 1px solid #E5E5E5;
  position: relative;
  z-index: 10;
  padding: 24px;
}
@media (min-width: 768px) { .tpc-headerbar { padding: 24px 64px; } }
@media (min-width: 1024px) { .tpc-headerbar { padding: 24px 80px; } }
.tpc-headerbar-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
.tpc-header-l {
  display: flex;
  align-items: center;
  gap: 24px;
  flex: 1;
  min-width: 0;
}
.tpc-header-info { flex: 1; min-width: 0; }
/* Avatar overlaps up into the cover (talent: -mt-90), 175x175 gold ring */
.tpc-avatar {
  margin-top: -90px;
  width: 175px;
  height: 175px;
  border-radius: 50%;
  padding: 2.3px;
  box-shadow: 0 2px 11px rgba(0,0,0,0.15);
  overflow: visible; /* le cercle est clippé par .tpc-avatar-inner ; laisse voir le bouton d'édition */
  position: relative;
  flex-shrink: 0;
  background: linear-gradient(135deg, #8B7355, #6B5940);
}
.tpc-avatar-inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
}
.tpc-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Placeholder initiales (pas de photo d'inconnu) — doré sur fond noir */
.tpc-avatar-initials { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#1a1a1a,#2C2A26); color:#DAA520; font-family:'Geist',system-ui,sans-serif; font-size:58px; font-weight:700; letter-spacing:.02em; }

/* ===== Édition cover + avatar (aligné talent) ===== */
.tpc-cover-edit { position:absolute; bottom:16px; right:16px; z-index:5; display:flex; gap:8px; }
.tpc-cover-edit-btn { padding:8px 14px; border-radius:100px; background:rgba(0,0,0,.55); backdrop-filter:blur(8px); color:#fff; font-size:11px; font-weight:600; border:1px solid rgba(255,255,255,.15); cursor:pointer; transition:all .15s; display:inline-flex; align-items:center; gap:6px; font-family:inherit; }
.tpc-cover-edit-btn:hover { background:rgba(0,0,0,.75); }
.tpc-avatar-edit-btn { position:absolute; bottom:6px; right:6px; width:34px; height:34px; border-radius:50%; border:2px solid #fff; background:#1a1a1a; color:#E5D4A0; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.2); transition:all .15s; z-index:3; }
.tpc-avatar-edit-btn:hover { background:#000; }

/* ===== Dialog upload (repris du profil talent) ===== */
.tpc-dialog { border:none; border-radius:16px; padding:0; max-width:560px; width:90vw; position:fixed; inset:auto; top:50%; left:50%; transform:translate(-50%,-50%); margin:0; box-shadow:0 24px 80px rgba(0,0,0,.2); overflow:hidden; font-family:'Geist',system-ui,sans-serif; }
.tpc-dialog::backdrop { background:rgba(20,18,14,.5); backdrop-filter:blur(4px); }
.tpc-dialog-head { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid rgba(0,0,0,.06); }
.tpc-dialog-title { font-family:'Playfair Display',serif; font-size:20px; font-weight:600; font-style:italic; color:#1A1A1A; }
.tpc-dialog-close { width:32px; height:32px; border-radius:50%; border:1px solid rgba(0,0,0,.08); background:#fff; color:#666; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .15s; padding:0; font-size:18px; line-height:1; }
.tpc-dialog-close:hover { background:#1a1a1a; color:#E5D4A0; border-color:#1a1a1a; }
.tpc-dialog-body { padding:24px; }
.tpc-dialog-body label { display:block; font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:#888; margin-bottom:5px; }
.tpc-dialog-body input { width:100%; padding:10px 12px; border-radius:9px; border:1.5px solid rgba(0,0,0,.06); font-size:13px; outline:none; box-sizing:border-box; font-family:inherit; }
.tpc-dialog-foot { padding:16px 24px; border-top:1px solid rgba(0,0,0,.06); display:flex; justify-content:flex-end; gap:10px; }
.tpc-btn-cancel { padding:10px 18px; border-radius:9px; font-size:12px; font-weight:600; color:#1a1a1a; background:#fff; border:1.5px solid rgba(0,0,0,.1); cursor:pointer; font-family:inherit; }
.tpc-btn-save { padding:10px 20px; border-radius:9px; font-size:12px; font-weight:700; color:#fff; background:linear-gradient(135deg,#C4A559 0%,#D4BC7A 40%,#E5D4A0 70%,#EFE2B8 100%); border:none; cursor:pointer; font-family:inherit; }

/* Édition profil (champs réels) — modale large multi-champs */
.tpc-dialog-lg { max-width:620px; }
.tpc-dialog-scroll { max-height:min(70vh,640px); overflow-y:auto; }
.tpc-dialog-body .tpc-fg { margin-bottom:16px; }
.tpc-dialog-body .tpc-fg:last-child { margin-bottom:0; }
.tpc-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tpc-dialog-body textarea,
.tpc-dialog-body select { width:100%; padding:10px 12px; border-radius:9px; border:1.5px solid rgba(0,0,0,.06); font-size:13px; outline:none; box-sizing:border-box; font-family:inherit; background:#fff; color:#1a1a1a; }
.tpc-dialog-body textarea { resize:vertical; line-height:1.5; }
.tpc-dialog-body input:focus,
.tpc-dialog-body textarea:focus,
.tpc-dialog-body select:focus { border-color:#C4A559; }
.tpc-fg-hint { display:block; font-size:11px; color:#999; margin-top:5px; text-transform:none; letter-spacing:0; font-weight:400; }
@media (max-width:540px){ .tpc-row { grid-template-columns:1fr; } }

/* Bouton « Modifier mon profil » (owner) — icône seule, aligné sur le profil
   talent et sur le bouton réglages (la maquette ne montre pas d'édition). */
.tpc-edit-profile-btn { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#fff; border:1px solid rgba(0,0,0,.08); color:#888; cursor:pointer; flex-shrink:0; font-family:inherit; transition:all .15s; }
.tpc-edit-profile-btn:hover { border-color:#C4A559; color:#A38543; background:#FAF5EB; }
.tpc-edit-profile-btn svg { width:15px; height:15px; }

/* « Contacter » présent comme la maquette mais indisponible (Brique 3) : grisé. */
.tpc .tpc-contact-soon { filter:grayscale(.7); opacity:.5; cursor:not-allowed; box-shadow:none; }
.tpc .tpc-contact-soon:hover { filter:grayscale(.7); }

/* Sections présentationnelles (sans modèle Brique 1) — grisées « à venir ».
   On dim tout sauf le titre, qui porte le badge. */
.tpc-soon > :not(.tpc-section-title):not(.tpc-side-title) { opacity:.4; filter:grayscale(.55); pointer-events:none; user-select:none; }
.tpc-soon-badge { display:inline-flex; align-items:center; margin-left:9px; padding:2px 9px; border-radius:999px; font-size:9px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#9A8338; background:rgba(196,165,89,.13); border:1px solid rgba(196,165,89,.32); vertical-align:middle; white-space:nowrap; line-height:1.5; }

/* Name + verified badge aligned (talent: Geist 32px) */
.tpc-name-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 0; }
.tpc-name {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.68px;
  color: #242424;
  line-height: 1.1;
}
.tpc-verified-inline { height: 26px; width: auto; display: block; }
.tpc-subtitle {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 16px;
  font-weight: 500;
  color: rgba(36,36,36,0.8);
  margin-top: 4px;
}
.tpc-loc {
  font-family: 'Geist', system-ui, sans-serif;
  font-style: normal;
  font-size: 14px;
  font-weight: 500;
  color: #949494;
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 4px;
}
.tpc-flag { font-size: 13px; }
/* Pills row (talent-aligned) */
.tpc-badges { margin-top: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tpc-avail-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f0ffe3;
  color: #4a9f00;
  border: 1px solid #4a9f00;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.8px;
  padding: 7px 15px;
  border-radius: 100px;
  text-transform: uppercase;
}
.tpc-avail-dot {
  width: 6px; height: 6px;
  background: #4a9f00;
  border-radius: 2px;
}
.tpc-gold-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(229,212,160,0.28);
  color: #8B7355;
  border: 1px solid #E5D4A0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.6px;
  padding: 7px 13px;
  border-radius: 100px;
  text-transform: uppercase;
}

.tpc-header-r {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-shrink: 0;
}
.tpc-video-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gold-grad);
  border: none;
  border-radius: 999px;
  padding: 5px 14px 5px 5px;
  cursor: pointer;
  font-family: inherit;
  box-shadow: 0 2px 8px rgba(184,145,42,0.22);
  transition: all .2s;
}
.tpc-video-cta:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(184,145,42,0.32); }
.tpc-video-thumb {
  width: 30px; height: 30px;
  border-radius: 8px;
  background-size: cover; background-position: center;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.tpc-video-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
}
.tpc-play-tri {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-40%, -50%);
  width: 0; height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 9px solid #fff;
  z-index: 2;
}
.tpc-video-txt { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.tpc-video-t1 { font-size: 12px; font-weight: 700; color: #fff; }
.tpc-video-t2 { font-size: 9px; color: rgba(255,255,255,0.85); font-weight: 500; }
.tpc-video-arrow {
  background: rgba(0,0,0,0.18);
  border-radius: 50%;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: 11px;
}

.tpc-contact-btn {
  background: var(--gold-grad);
  color: #1a1208;
  border: none;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 14px 22px;
  border-radius: 10px;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(184,145,42,.25);
  transition: all .2s;
}
.tpc-contact-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(184,145,42,.35); }

/* ===== LAYOUT 2 COL ===== */
.tpc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 302px;
  gap: 24px;
  margin-top: 24px;
  padding-bottom: 40px;
  align-items: start;
}
.tpc-main { min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.tpc-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 80px; }

/* ===== CARDS génériques ===== */
.tpc-card {
  background: #fff;
  border: 1px solid var(--bd2);
  border-radius: 14px;
  padding: 22px 26px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.03);
}
.tpc-section-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 18px;
  font-weight: 700;
  color: var(--gold-1);
  margin-bottom: 14px;
  position: relative;
  display: inline-block;
}
.tpc-section-title::after {
  content: '';
  display: block;
  width: 60px;
  height: 2px;
  background: var(--gold-2);
  margin-top: 4px;
}

/* ===== ABOUT (aligned on talent: plain paragraphs, dark 24px title) ===== */
.tpc-about-text {
  font-size: 14px;
  line-height: 22px;
  color: #555;
}
.tpc-about-text p + p { margin-top: 12px; }
/* About title aligned on talent (24px dark, gold underline kept) — scoped to About only */
.tpc-about-card .tpc-section-title { font-size: 24px; color: #1A1A1A; }

/* ===== EDUCATION ===== */
.tpc-edu-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px dashed var(--bd2);
}
.tpc-edu-item:last-child { border-bottom: none; padding-bottom: 0; }
.tpc-edu-item:first-child { padding-top: 0; }
.tpc-edu-ico {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: linear-gradient(135deg, #FFF5D6, #FFE9A0);
  border: 1px solid rgba(212,168,50,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
  color: var(--gold-1);
}
.tpc-edu-name {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 2px;
}
.tpc-edu-deg {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 11.5px;
  color: var(--t2);
}

/* ===== RÉFÉRENCES ===== */
.tpc-ref-item {
  padding: 16px 0;
  border-bottom: 1px dashed var(--bd2);
}
.tpc-ref-item:last-child { border-bottom: none; padding-bottom: 0; }
.tpc-ref-item:first-of-type { padding-top: 0; }
.tpc-ref-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.tpc-ref-av {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--ink-2);
  color: var(--gold-4);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
.tpc-ref-info { flex: 1; min-width: 0; }
.tpc-ref-name {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 2px;
}
.tpc-ref-role {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 11px;
  color: var(--t2);
}
.tpc-ref-status {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 100px;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}
.tpc-ref-status.verified {
  background: var(--green-bg);
  color: var(--green);
  border: 1px solid var(--green-bd);
}
.tpc-ref-status.approved {
  background: #F0F0F0;
  color: var(--t1);
  border: 1px solid var(--bd);
}
.tpc-ref-quote {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 12px;
  color: var(--t2);
  line-height: 1.65;
  margin-bottom: 10px;
}
.tpc-ref-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.tpc-ref-tag {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 5px;
  background: var(--beige-page);
  border: 1px solid var(--bd2);
  color: var(--t2);
  text-transform: uppercase;
}
.tpc-ref-readmore {
  font-size: 10.5px;
  color: var(--gold-1);
  font-weight: 600;
  cursor: pointer;
  text-align: right;
  display: block;
}
.tpc-ref-readmore:hover { text-decoration: underline; }
.tpc-ref-av-img { padding:0 !important; overflow:hidden; background:none !important; }
.tpc-ref-av-img img { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }

/* ===== SIDEBAR ===== */
.tpc-side-card {
  background: hsl(var(--background-cream));
  border: 1px solid hsl(var(--brand-gold-100));
  border-radius: 12px;
  padding: 18px 20px;
}
.tpc-side-card.insight { border-color: hsl(var(--brand-gold-200)); }
.tpc-side-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 16px;
  font-weight: 600;
  color: hsl(var(--brand-gold-main));
  margin-bottom: 10px;
  line-height: 24px;
}
.tpc-side-title::after {
  content: '';
  display: block;
  width: 30px;
  height: 1.5px;
  background: var(--gold-2);
  margin-top: 3px;
}
.tpc-side-text {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--t2);
  line-height: 1.65;
}
.tpc-side-text strong { color: var(--ink); font-weight: 700; }

.tpc-goal-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 12px;
}

/* .tpc-side-cta est ici un simple wrapper autour du bouton .ds-btn-gold.
   On neutralise le style "bouton sombre" herite de lovable/talent-profile-chef.css */
.tpc .tpc-side-cta {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  text-align: center;
  background: transparent;
  padding: 0;
  border-radius: 0;
}
.tpc .tpc-side-cta:hover { background: transparent; }

.tpc-side-actions {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
}
.tpc-side-actions .ds-btn-outline-gold,
.tpc-side-actions .ds-btn-outline {
  flex: 1;
  text-align: center;
  justify-content: center;
}

.tpc-side-active {
  font-size: 12px;
  color: hsl(var(--brand-gold-main));
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
  margin-top: 10px;
}
.tpc-side-active-dot {
  width: 6px; height: 6px;
  background: var(--green);
  border-radius: 50%;
}

.tpc-permits {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.tpc-langs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

/* ===== BOTTOM BAND ===== */
.tpc-bottom-band {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gold-grad);
  padding: 10px 28px;
  text-align: center;
  border-radius: 999px;
  margin: 24px auto 50px;
  cursor: pointer;
  transition: all .2s;
  box-shadow: 0 3px 12px rgba(184,145,42,0.25);
}
.tpc-bottom-band-wrap { display: flex; justify-content: center; }
.tpc-bottom-band:hover { transform: translateY(-1px); box-shadow: 0 5px 18px rgba(184,145,42,0.35); }
.tpc-bottom-band-text {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}

/* ===== Léa Aurigny — Price pill in header ===== */
.tpc-price-pill { display:inline-flex; align-items:center; gap:5px; margin-left:12px; padding:7px 18px; border-radius:10px; background:linear-gradient(135deg,#C4A559 0%,#D4BC7A 40%,#E5D4A0 70%,#EFE2B8 100%); color:#0a0a0a; font-size:15px; font-weight:800; letter-spacing:.2px; box-shadow:0 1px 0 rgba(255,255,255,.6) inset, 0 4px 14px rgba(150,120,62,.28); }
.tpc-price-pill small { font-size:12px; font-weight:700; color:rgba(0,0,0,.6); margin-left:3px; }

/* ===== Missions & Achievements ===== */
.tpc-mission-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:6px; }
.tpc-mission-card { position:relative; background:linear-gradient(135deg,#fff 0%,#faf9f7 50%,#f5f2ed 100%); border:1px solid rgba(200,195,180,.5); border-radius:14px; padding:20px 18px 16px; box-shadow:0 1px 3px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.9); transition:transform .25s, box-shadow .25s; overflow:hidden; }
.tpc-mission-card:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,.08); }
.tpc-mission-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,#9E7E3F,#D4BC7A,#E5D4A0,#D4BC7A,#9E7E3F); }
.tpc-mission-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.tpc-mission-badge { font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:1.2px; padding:4px 10px; border-radius:7px; }
.tpc-mission-badge.t1 { background:#f0e8d8; color:#9E7E3F; }
.tpc-mission-badge.t2 { background:#f0e0ec; color:#8c5a7a; }
.tpc-mission-badge.t3 { background:#e8f0e4; color:#5a8c4a; }
.tpc-mission-badge.t4 { background:#f0e4e0; color:#8c5a4a; }
.tpc-mission-duration { font-size:11px; font-weight:600; color:#7a8594; }
.tpc-mission-est { font-family:'Playfair Display',serif; font-size:17px; font-weight:700; color:#0a0a0a; margin-bottom:2px; }
.tpc-mission-loc { font-size:12px; color:rgba(0,0,0,.4); margin-bottom:10px; }
.tpc-mission-desc { font-size:13px; line-height:1.6; color:#0a0a0a; margin-bottom:12px; }
.tpc-mission-result { padding-top:10px; border-top:1px solid rgba(0,0,0,.06); font-size:12px; font-weight:700; color:#9E7E3F; }

/* ===== Signature Gallery ===== */
.tpc-gallery { position:relative; border-radius:14px; overflow:hidden; height:340px; background:#1a1510; margin-bottom:20px; }
.tpc-gallery-track { display:flex; height:100%; transition:transform .5s cubic-bezier(.4,0,.2,1); }
.tpc-gallery-slide { min-width:100%; height:100%; background-size:cover; background-position:center; position:relative; }
.tpc-gallery-overlay { position:absolute; bottom:0; left:0; right:0; padding:36px 32px 26px; background:linear-gradient(transparent, rgba(0,0,0,.75)); }
.tpc-gallery-title { font-family:'Playfair Display',serif; font-style:italic; font-size:22px; color:#fff; font-weight:600; }
.tpc-gallery-sub { font-size:12px; color:rgba(255,255,255,.65); margin-top:4px; }
.tpc-gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.18); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.22); color:#fff; font-size:20px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.tpc-gallery-arrow:hover { background:rgba(255,255,255,.32); }
.tpc-gallery-arrow.left { left:14px; } .tpc-gallery-arrow.right { right:14px; }
.tpc-gallery-dots { position:absolute; bottom:14px; right:32px; display:flex; gap:7px; }
.tpc-gallery-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.32); border:none; cursor:pointer; transition:all .3s; padding:0; }
.tpc-gallery-dot.active { background:#E5D4A0; width:22px; border-radius:4px; }
.tpc-gallery-collections-label { font-family:'Playfair Display',serif; font-size:15px; font-weight:600; color:#0a0a0a; margin:6px 0 12px; }
.tpc-gallery-collections-label em { font-style:italic; background:linear-gradient(135deg,#C4A559,#EDCA50,#C4A559); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.tpc-gallery-collections { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.tpc-gallery-col { background:linear-gradient(135deg,#fff,#faf9f7,#f5f2ed); border:1px solid rgba(200,195,180,.4); border-radius:12px; padding:10px; cursor:pointer; transition:transform .2s, box-shadow .2s; }
.tpc-gallery-col:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.06); }
.tpc-gallery-col-thumb { aspect-ratio:16/9; background-size:cover; background-position:center; border-radius:8px; margin-bottom:8px; }
.tpc-gallery-col-bottom { display:flex; justify-content:space-between; align-items:center; }
.tpc-gallery-col-name { font-size:12px; font-weight:600; color:#0a0a0a; }
.tpc-gallery-col-count { font-size:10px; font-weight:700; background:rgba(158,126,63,.1); color:#9E7E3F; padding:2px 7px; border-radius:5px; }

/* ===== Modalities ===== */
.tpc-modalities { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.tpc-modality { position:relative; background:linear-gradient(135deg,#fff,#faf9f7,#f5f2ed); border:1px solid rgba(200,195,180,.5); border-radius:14px; padding:22px 16px 18px; text-align:center; box-shadow:0 1px 3px rgba(0,0,0,.04); transition:transform .2s; overflow:hidden; }
.tpc-modality:hover { transform:translateY(-3px); }
.tpc-modality::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,#9E7E3F,#D4BC7A,#E5D4A0,#D4BC7A,#9E7E3F); }
.tpc-modality-icon { width:44px; height:44px; margin:0 auto 12px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:20px; }
.tpc-modality-icon.geo { background:rgba(90,140,90,.1); }
.tpc-modality-icon.dur { background:rgba(90,107,140,.1); }
.tpc-modality-icon.fmt { background:rgba(107,91,140,.1); }
.tpc-modality-icon.pri { background:rgba(158,126,63,.12); }
.tpc-modality-icon.lng { background:rgba(140,90,74,.1); }
.tpc-modality-icon.dsp { background:rgba(90,107,140,.1); }
.tpc-modality-label { font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:1.4px; color:#8494a7; margin-bottom:6px; }
.tpc-modality-value { font-family:'Playfair Display',serif; font-size:15px; font-weight:700; color:#0a0a0a; line-height:1.4; }
.tpc-modality-value.highlight { background:linear-gradient(135deg,#C4A559,#EDCA50,#C4A559); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-size:17px; }

/* ===== Posts carousel ===== */
.tpc-posts-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  background: var(--gold-grad);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  margin-left: 8px;
  vertical-align: middle;
}
.tpc-posts { margin-top: 4px; }
.tpc-posts-viewport {
  position: relative;
  overflow: hidden;
  padding: 4px 2px;
}
.tpc-posts-track {
  display: flex;
  gap: 14px;
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
.tpc-post {
  flex: 0 0 calc(50% - 7px);
  background: #fff;
  border: 1px solid #e9e2d2;
  border-radius: 14px;
  padding: 16px 16px 14px;
  box-shadow: 0 2px 10px rgba(40, 30, 10, 0.04);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tpc-post-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tpc-post-av {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--gold-grad);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  font-family: 'Inter', sans-serif;
  letter-spacing: 0.3px;
  flex-shrink: 0;
}
.tpc-post-meta { flex: 1; min-width: 0; }
.tpc-post-name {
  font-weight: 700;
  font-size: 14px;
  color: #1a1a1a;
  font-family: 'Inter', sans-serif;
}
.tpc-post-date {
  font-size: 12px;
  color: #9a9182;
  margin-top: 1px;
}
.tpc-post-more {
  background: none;
  border: 0;
  color: #9a9182;
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
}
.tpc-post-text {
  font-size: 13.5px;
  line-height: 1.55;
  color: #2a2a2a;
  margin: 0;
}
.tpc-post-tag {
  color: var(--gold-1);
  font-weight: 600;
}
.tpc-post-img {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: #f3eee2;
}
.tpc-post-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.tpc-posts-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid #e9e2d2;
  background: #fff;
  color: #5a5040;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(40, 30, 10, 0.12);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}
.tpc-posts-arrow:hover {
  color: var(--gold-1);
  border-color: var(--gold-3);
  transform: translateY(-50%) scale(1.05);
}
.tpc-posts-arrow.prev { left: -8px; }
.tpc-posts-arrow.next { right: -8px; }
.tpc-posts-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
}
.tpc-posts-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d9d2c2;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tpc-posts-dot.active {
  background: var(--gold-2);
  width: 22px;
  border-radius: 4px;
}

.tpc-post-clickable { cursor: pointer; transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease; }
.tpc-post-clickable:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(40, 30, 10, 0.10);
  border-color: var(--gold-3);
}

/* ===== Network card (sidebar) ===== */
.tpc-network-card { background: hsl(var(--background-cream)); border: 1px solid hsl(var(--brand-gold-100)); border-radius: 12px; padding: 18px 20px; }
.tpc-network-avatars { display: flex; margin-bottom: 8px; }
.tpc-network-av { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff; margin-left: -8px; overflow: hidden; }
.tpc-network-av:first-child { margin-left: 0; }
.tpc-network-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tpc-network-stats { font-size: 11px; color: var(--t2); margin-bottom: 4px; }
.tpc-network-stats strong { color: var(--ink); }
.tpc-network-mutual { font-size: 10px; color: var(--t3); }

/* ===== Goal tags (Career Goal sidebar — from Lovable) ===== */
/* Goal tags — unified on the talent gold-pill system (soft, uniform) */
.tpc .tpc-goal-tag,
.tpc .tpc-goal-tag.dark,
.tpc .tpc-goal-tag.outline {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 9999px;
  background: rgba(229,212,160,0.3);
  color: #8B7355;
  border: 1px solid #E5D4A0;
  box-shadow: none;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ===== Sidebar cards (hardcoded, no DS vars dependency) ===== */
.tpc .tpc-side-card {
  background: #fffdfa;
  border: 1px solid #f8f4ed;
  border-radius: 16px;
  padding: 24px;
}
.tpc .tpc-side-card.insight {
  background: #fdf4e2;
  border-color: rgba(163,133,67,.3);
}
/* Pattern languette (voilages) en arrière-plan — Insight + Career Goal (cohérence talent) */
.tpc .tpc-side-card.insight,
.tpc .tpc-side-card.careergoal { position: relative; overflow: hidden; }
.tpc .tpc-side-card.insight::before,
.tpc .tpc-side-card.careergoal::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: url("/images/design-system/patterns/pattern-voilages-cream.svg") center / cover no-repeat;
  opacity: .5;
}
.tpc .tpc-side-card.insight > *,
.tpc .tpc-side-card.careergoal > * { position: relative; z-index: 1; }
/* Insight title aligned on talent (24px dark, non-italic, no underline) */
.tpc .tpc-side-card.insight .tpc-side-title,
.tpc .tpc-side-card.careergoal .tpc-side-title {
  font-size: 24px;
  font-style: normal;
  color: #131313;
  letter-spacing: -0.96px;
}
.tpc .tpc-side-card.insight .tpc-side-title::after,
.tpc .tpc-side-card.careergoal .tpc-side-title::after { display: none; }
.tpc .tpc-side-card.insight .tpc-side-text { color: #4c4c4c; }
.tpc .tpc-side-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: normal;
  font-size: 24px;
  font-weight: 400;
  color: #131313;
  letter-spacing: -0.96px;
  margin-bottom: 12px;
  line-height: 1.2;
}
.tpc .tpc-side-title::after { display: none; }
.tpc .tpc-side-text {
  font-size: 14px;
  color: #4c4c4c;
  line-height: 1.45;
}
.tpc .tpc-side-text strong { color: var(--ink); font-weight: 700; }

/* ===== Network card sidebar ===== */
.tpc .tpc-network-card {
  background: #fffdfa;
  border: 1px solid #f8f4ed;
  border-radius: 16px;
  padding: 24px;
}

/* ===== Visa / Language chips (neutral style) ===== */
.tpc .tpc-permits .ds-chip,
.tpc .tpc-langs .ds-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  background: rgba(229,212,160,0.3);
  color: #8B7355;
  border: 1px solid #E5D4A0;
}

/* ===== Languages list (flag + level + dots) ===== */
.tpc .tpc-lang-list { display: flex; flex-direction: column; gap: 13px; }
.tpc .tpc-lang-row { display: flex; align-items: center; gap: 10px; }
.tpc .tpc-lang-flag { flex-shrink: 0; border-radius: 3px; object-fit: cover; display: block; }
.tpc .tpc-lang-info { flex: 1; min-width: 0; }
.tpc .tpc-lang-name { font-size: 13px; font-weight: 700; color: var(--t1); line-height: 1.2; }
.tpc .tpc-lang-level { font-size: 11px; color: var(--t3); line-height: 1.3; }
.tpc .tpc-lang-dots { display: flex; gap: 3px; flex-shrink: 0; }
.tpc .tpc-lang-dots i { width: 6px; height: 6px; border-radius: 50%; background: #E7DEC6; }
.tpc .tpc-lang-dots i.on { background: linear-gradient(135deg,#CDB563,#B19136); }

.tpc .tpc-discover-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 20px;
  background: var(--gold-grad);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  border-radius: 9999px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(184,145,42,.22);
  transition: all .2s;
}
.tpc .tpc-discover-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(184,145,42,.32); }

/* ===== Profile completion card (aligned on talent: white card, gold bar) ===== */
.tpc .tpc-completion-card {
  background: #fff;
  border: 1px solid #E5E5E5;
  border-radius: 16px;
  padding: 24px;
}
.tpc .tpc-completion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.tpc .tpc-completion-label { font-size: 13px; font-weight: 600; color: #1A1A1A; }
.tpc .tpc-completion-pct { font-size: 18px; font-weight: 700; color: #A38543; }
.tpc .tpc-completion-bar { width: 100%; height: 6px; border-radius: 100px; overflow: hidden; background: rgba(0,0,0,.04); }
.tpc .tpc-completion-bar > i { display: block; height: 100%; border-radius: 100px; background: linear-gradient(90deg,#C4A559,#E5D4A0); }
.tpc .tpc-completion-hint { font-size: 11px; color: #999; margin-top: 8px; }

/* ===== Owner preview actions (header) — aligned on talent tp-add-btn / tp-edit-btn ===== */
.tpc-owner-actions { display: flex; align-items: center; gap: 12px; }
.tpc-preview-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 100px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  color: #888;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
  transition: all .15s;
}
.tpc-preview-btn:hover { border-color: #C4A559; color: #A38543; background: #FAF5EB; }
.tpc-preview-btn svg { width: 14px; height: 14px; }
.tpc-settings-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  color: #888;
  cursor: pointer;
  text-decoration: none;
  flex-shrink: 0;
  transition: all .15s;
}
.tpc-settings-btn:hover { border-color: #C4A559; color: #A38543; background: #FAF5EB; }
.tpc-settings-btn svg { width: 15px; height: 15px; }

/* ===== Future-brick (contact réel = Brique 3, messagerie = Brique 4) ===== */
.tpc-future { position: relative; }
.tpc-future-badge {
  display: inline-block; margin-top: 8px;
  font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 100px;
  background: #1C1A17; color: #E8D49A; border: 1px solid rgba(196,165,89,.35);
}

/* ===== Specialties chips (real ExpertProfile.specialties) ===== */
.tpc-spec-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }

/* ===== Misc inline-migrated helpers ===== */
.tpc-loc-flag { display:inline-block; vertical-align:-1px; margin-left:6px; border-radius:2px; }
.tpc .tpc-contact-cta { padding:9px 16px; font-size:12px; display:inline-flex; align-items:center; gap:6px; }
.tpc .tpc-contact-cta-full { width:100%; justify-content:center; gap:8px; padding-top:13px; padding-bottom:13px; }
.tpc-icon-inline { vertical-align:-2px; margin-right:5px; }

/* Signature gallery — fixed presentational images (was inline background-image in mockup). */
.tpc-gallery-slide.g1 { background-image: url(https://images.unsplash.com/photo-1550966871-3ed3cdb5ed0c?w=1400&q=90&fit=crop&crop=center); }
.tpc-gallery-slide.g2 { background-image: url(https://images.unsplash.com/photo-1559329007-40df8a9345d8?w=1400&q=90&fit=crop&crop=center); }
.tpc-gallery-slide.g3 { background-image: url(https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=1400&q=90&fit=crop&crop=center); }
.tpc-gallery-slide.g4 { background-image: url(https://images.unsplash.com/photo-1544148103-0773bf10d330?w=1400&q=90&fit=crop&crop=center); }
.tpc-gallery-slide.g5 { background-image: url(https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1400&q=90&fit=crop&crop=center); }
.tpc-gallery-col-thumb.c1 { background-image: url(https://images.unsplash.com/photo-1550966871-3ed3cdb5ed0c?w=400&q=85&fit=crop&crop=center); }
.tpc-gallery-col-thumb.c2 { background-image: url(https://images.unsplash.com/photo-1559329007-40df8a9345d8?w=400&q=85&fit=crop&crop=center); }
.tpc-gallery-col-thumb.c3 { background-image: url(https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=400&q=85&fit=crop&crop=center); }
.tpc-gallery-col-thumb.c4 { background-image: url(https://images.unsplash.com/photo-1414235077428-338989a2e8c0?w=400&q=85&fit=crop&crop=center); }

/* ===== RESPONSIVE ===== */
@media (max-width: 960px) {
  .tpc-grid { grid-template-columns: 1fr; }
  .tpc-side { position: static; }
}
@media (max-width: 768px) {
  .tpc-mission-grid, .tpc-modalities, .tpc-gallery-collections { grid-template-columns:1fr 1fr; }
  .tpc-gallery { height:240px; }
}
@media (max-width: 600px) {
  .tpc-wrap { padding: 0 16px; }
  .tpc-headerbar { padding: 16px; }
  .tpc-headerbar-inner { flex-direction: column; align-items: flex-start; }
  .tpc-header-r { width: 100%; flex-direction: column; align-items: stretch; }
  .tpc-avatar { margin-top: -60px; }
  .tpc-cover { height: 200px; }
  .tpc-name { font-size: 22px; }
  .tpc-section-title { font-size: 16px; }
}
@media (max-width: 720px) {
  .tpc-post { flex: 0 0 100%; }
}

/* ── Modale pitch vidéo (Mux) — lecture + upload propriétaire ── */
.tpc-pitch-dialog { max-width: 860px; width: 92vw; }
.tpc-pitch-tools { display: flex; align-items: center; gap: 8px; }
.tpc-pitch-fs { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid rgba(196,165,89,.35); background: transparent; color: #5A4A25; cursor: pointer; }
.tpc-pitch-fs:hover { background: rgba(196,165,89,.10); }
.tpc-pitch-video { position: relative; width: 100%; aspect-ratio: 16 / 9; margin: 4px 0 10px; background: #14110C; border-radius: 12px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.tpc-pitch-video mux-player { width: 100%; height: 100%; }
.tpc-pitch-ph-icon { width: 54px; height: 54px; color: rgba(232,212,154,.55); }
.tpc-pitch-spinner { display: none; position: absolute; width: 38px; height: 38px; border-radius: 50%; border: 3px solid rgba(232,212,154,.25); border-top-color: #E8D49A; animation: tpc-pitch-spin .8s linear infinite; }
.tpc-pitch-video.is-loading .tpc-pitch-spinner { display: block; }
.tpc-pitch-video.is-loading mux-player,
.tpc-pitch-video.is-loading .tpc-pitch-ph-icon { opacity: .25; }
@keyframes tpc-pitch-spin { to { transform: rotate(360deg); } }
.tpc-pitch-status { font-size: 12px; color: #9a8f7a; margin-right: auto; }