/* RÉTRO — site vitrine. Charte v4 : bleu nuit #213650, corail #FF8A7E, Archivo + Satoshi. */
body{margin:0;background:#213650;color:#FFFAF3;font-family:'Satoshi','Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
a{color:#FFFAF3}a:hover{color:#FFA79D}
.rt-page{background:radial-gradient(1200px 700px at 78% -10%,rgba(255,138,126,.10),transparent 62%),radial-gradient(900px 600px at 8% 4%,rgba(175,199,226,.12),transparent 60%),linear-gradient(180deg,#2A4463,#213650 75%);background-color:#213650}
.rt-disp{font-family:'Archivo',Helvetica,Arial,sans-serif;font-weight:800;font-stretch:112%;letter-spacing:-.01em}
.rt-arch{font-family:'Archivo',Helvetica,Arial,sans-serif}
.rt-btn{transition:background .25s cubic-bezier(.2,.7,.2,1),transform .25s cubic-bezier(.2,.7,.2,1)}
.rt-btn:hover{background:#FFA79D !important}
.rt-ghost:hover{background:#324A67 !important}
.rt-btn:focus-visible,.rt-ghost:focus-visible,.rt-nav:focus-visible,.rt-tog:focus-visible{outline:2px solid #FFFAF3;outline-offset:2px}
.rt-nav{text-decoration:none;color:#DDD3C6}.rt-nav:hover{color:#FFFAF3}
.rt-band{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:start}
.rt-loop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.rt-ring{-webkit-mask:radial-gradient(closest-side,transparent 84%,#000 85%);mask:radial-gradient(closest-side,transparent 84%,#000 85%)}
.rt-step{transition:background .25s cubic-bezier(.2,.7,.2,1),border-color .25s cubic-bezier(.2,.7,.2,1),transform .25s cubic-bezier(.2,.7,.2,1)}
.rt-step:hover{background:#3D597C !important;border-color:rgba(255,250,243,.4) !important;transform:translateY(-2px)}
@media (max-width:860px){.rt-band,.rt-loop{grid-template-columns:1fr}}
@keyframes rt-in{from{opacity:0;transform:translateY(16px);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
.rt-in{animation:rt-in .9s cubic-bezier(.2,.7,.2,1) both}
.rt-d1{animation-delay:.18s}.rt-d2{animation-delay:.36s}.rt-d3{animation-delay:.54s}.rt-d4{animation-delay:.72s}
@media (prefers-reduced-motion:reduce){.rt-in{animation:none}}
/* --- site --- */
html{scroll-behavior:smooth}
[hidden]{display:none !important}
.lang-group{display:flex;border:1px solid rgba(255,250,243,.26);border-radius:6px;overflow:hidden}
.lang-btn{all:unset;cursor:pointer;min-height:40px;padding:0 14px;font-size:13px;font-weight:600;background:transparent;color:#DDD3C6}
.lang-btn.is-active{background:#FFFAF3;color:#213650}
.modal-backdrop{animation:rt-fade .25s cubic-bezier(.2,.7,.2,1) both}
@keyframes rt-fade{from{opacity:0}to{opacity:1}}
body.modal-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.modal-backdrop{animation:none}}

/* --- mobile --- */
@media (max-width:860px){.rt-head{position:static !important}}
@media (max-width:640px){
  .rt-bead{width:36% !important}
  .rt-bead-top{top:19% !important}.rt-bead-bottom{top:81% !important}
  .rt-bead-left{left:19% !important}.rt-bead-right{left:81% !important}
  .rt-bead .rt-disp{font-size:15px !important}
  .rt-loopcenter p{display:none}
  .rt-arrow{display:none !important}
}

/* ===== carte d'équipe (hero) : flip 3D + matières ===== */
/* ---- colonne droite ---- */
.tc-right{display:flex;flex-direction:column;gap:18px;align-items:center;justify-self:center;width:100%;max-width:560px;min-width:0}
.stage{display:grid;grid-template-columns:auto minmax(0,1fr);gap:26px;align-items:center;width:100%}
@media (max-width:560px){.stage{grid-template-columns:1fr;justify-items:center}}

/* carte : flip 3D, recto matière / verso RÉTRO */
.flip{perspective:1400px;width:236px;aspect-ratio:5/7;cursor:pointer;-webkit-tap-highlight-color:transparent}
.card3d{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.7,.2,1);will-change:transform}
.face{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.face.back{transform:rotateY(180deg);background:
  repeating-linear-gradient(135deg,rgba(255,250,243,.05) 0 1px,transparent 1px 8px),
  linear-gradient(160deg,#243A58,#1A2C42 60%,#13213A);border:2px solid #7C9BC5;box-sizing:border-box;
  box-shadow:0 24px 48px -22px rgba(6,13,24,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#AFC7E2}
.face.back::before{content:"";position:absolute;inset:7px;border:1px solid rgba(175,199,226,.35);border-radius:9px}
.face.back img{width:92px;height:92px;display:block;filter:drop-shadow(0 8px 16px rgba(0,0,0,.45))}
.face.back .bk{font-family:"Archivo",system-ui,sans-serif;font-weight:600;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#AFC7E2}
.card{
  --m-bg:#1c1c1c; --m-ink:#FFFAF3; --m-acc:#9a9a9a; --m-line:rgba(255,255,255,.06);
  box-sizing:border-box;padding:16px;
  background:linear-gradient(160deg,color-mix(in oklab,var(--m-bg),white 7%),var(--m-bg) 55%,color-mix(in oklab,var(--m-bg),black 18%));
  border:2px solid var(--m-acc);isolation:isolate;
  box-shadow:0 0 0 1px rgba(0,0,0,.4) inset,0 24px 48px -22px rgba(6,13,24,.9),0 0 36px -10px color-mix(in oklab,var(--m-acc),transparent 55%);
  color:var(--m-ink);display:flex;flex-direction:column;justify-content:space-between;
  transition:background 1s cubic-bezier(.2,.7,.2,1),border-color 1s cubic-bezier(.2,.7,.2,1),box-shadow 1s cubic-bezier(.2,.7,.2,1),color 1s cubic-bezier(.2,.7,.2,1);
}
.card::before{content:"";position:absolute;inset:7px;border:1px solid color-mix(in oklab,var(--m-acc),transparent 55%);border-radius:9px;pointer-events:none}
.card .glare{position:absolute;inset:0;z-index:3;background:radial-gradient(260px 200px at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.14),transparent 60%);pointer-events:none;opacity:0;transition:opacity .4s cubic-bezier(.2,.7,.2,1)}
.flip:hover .card .glare{opacity:1}
.card .top{display:flex;justify-content:space-between;font-family:"Archivo",system-ui,sans-serif;font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--m-acc)}
.card .emb{align-self:center;width:112px;height:112px;border-radius:50%;border:1px dashed color-mix(in oklab,var(--m-acc),transparent 30%);display:grid;place-items:center}
.card .emb svg{width:84px;height:84px;display:block;filter:drop-shadow(0 6px 14px rgba(0,0,0,.45))}
.card .name{font-family:"Archivo",system-ui,sans-serif;font-stretch:112%;font-weight:800;font-size:28px;line-height:1;color:var(--m-ink);letter-spacing:-.01em}
.card .mat{font-family:"Archivo",system-ui,sans-serif;font-weight:600;font-size:12.5px;margin-top:4px;color:var(--m-acc)}

/* ===== matières v2 : lumière croissante, édition alpha ===== */
.card .tex,.card .lux{position:absolute;inset:0;pointer-events:none;border-radius:inherit}
.card .tex{z-index:1}.card .lux{z-index:2}
.card .top,.card .emb,.card .name,.card .mat{position:relative;z-index:4}
.card .badge{display:inline-flex;align-items:center;gap:5px;padding:2px 7px 2px 3px;border-radius:999px;border:1px solid var(--m-acc);background:rgba(255,255,255,.08);color:var(--m-ink);font-size:9px;letter-spacing:.12em}
.card .badge img{width:14px;height:14px;display:block;border-radius:50%}
/* couleurs */
.papier{--m-bg:#1c1c1c;--m-ink:#FFFAF3;--m-acc:#9a9a9a}
.cuir{--m-bg:#3a2418;--m-ink:#FFF3E6;--m-acc:#C9955F}
.laiton{--m-bg:#2e2710;--m-ink:#FFF8DC;--m-acc:#E3B93C}
.acier{--m-bg:#22323f;--m-ink:#F4F8FB;--m-acc:#B7C6D3}
.email{--m-bg:#12226B;--m-ink:#F6F7FF;--m-acc:#E6C35A}
.alpha{--m-bg:#2A1B4F;--m-ink:#F7F2FF;--m-acc:#C9A8FF}
/* textures */
.papier .tex{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)}
.cuir .tex{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.45' numOctaves='3' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .85 0 0 0 0 .7 0 0 0 .28 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.cuir::after{content:"";position:absolute;inset:11px;border:1.5px dashed color-mix(in oklab,var(--m-acc),transparent 20%);border-radius:7px;z-index:3;pointer-events:none}
.cuir::before{display:none}
.laiton .tex{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.02 .9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .9 0 0 0 0 .5 0 0 0 .32 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.acier .tex{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.03 1.2' numOctaves='2' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .85 0 0 0 0 .92 0 0 0 0 1 0 0 0 .3 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.email .tex{background:radial-gradient(120% 80% at 30% -5%,rgba(255,255,255,.16),transparent 50%),linear-gradient(170deg,rgba(255,255,255,.10),transparent 35%,rgba(0,0,0,.28))}
.email{border-width:3px;box-shadow:0 0 0 1px rgba(0,0,0,.45) inset,0 1px 0 rgba(255,255,255,.4) inset,0 22px 44px -22px rgba(6,13,24,.9),0 0 42px -6px rgba(230,195,90,.45)}
.email::before{border-color:color-mix(in oklab,var(--m-acc),transparent 25%)}

.alpha .tex{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .9 0 0 0 0 1 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(170deg,rgba(255,255,255,.08),transparent 40%,rgba(0,0,0,.22))}
.alpha{box-shadow:0 0 0 1px rgba(0,0,0,.45) inset,0 22px 44px -22px rgba(6,13,24,.9),0 0 42px -6px rgba(201,168,255,.45)}
/* lumière : d'un papier mat à un émail qui éclate */
.papier .lux{background:radial-gradient(140% 90% at 50% -20%,rgba(255,255,255,.08),transparent 55%)}
.cuir .lux{background:radial-gradient(70% 50% at var(--x,30%) 20%,rgba(255,205,160,.20),transparent 65%);animation:drift 8s ease-in-out infinite alternate}
.laiton .lux{background:linear-gradient(100deg,transparent 38%,rgba(255,240,170,.32) 48%,rgba(255,255,255,.42) 50%,rgba(255,240,170,.32) 52%,transparent 62%);background-size:260% 100%;animation:sweep 6s cubic-bezier(.2,.7,.2,1) infinite;mix-blend-mode:screen}
.acier .lux{background:linear-gradient(160deg,rgba(90,140,220,.22),rgba(230,200,120,.12) 45%,rgba(150,90,200,.18) 80%),linear-gradient(100deg,transparent 42%,rgba(255,255,255,.34) 50%,transparent 58%);background-size:100% 100%,300% 100%;animation:hue 9s ease-in-out infinite alternate,sweep2 5.2s cubic-bezier(.2,.7,.2,1) infinite;mix-blend-mode:screen}
.email .lux{background:
  radial-gradient(55% 38% at var(--x,25%) 12%,rgba(255,255,255,.62),rgba(255,255,255,.10) 42%,transparent 68%),
  linear-gradient(100deg,transparent 40%,rgba(255,255,255,.5) 49%,rgba(255,240,180,.6) 50%,rgba(255,255,255,.5) 51%,transparent 60%),
  radial-gradient(2px 2px at 20% 70%,#fff 50%,transparent 60%),radial-gradient(2px 2px at 72% 34%,#fff 50%,transparent 60%),radial-gradient(1.5px 1.5px at 56% 82%,#fff 50%,transparent 60%),radial-gradient(1.5px 1.5px at 82% 62%,#fff 50%,transparent 60%);
  background-size:100% 100%,320% 100%,100% 100%,100% 100%,100% 100%,100% 100%;
  animation:drift 5s ease-in-out infinite alternate,sweep3 4.4s cubic-bezier(.2,.7,.2,1) infinite,twinkle 2.6s ease-in-out infinite;mix-blend-mode:screen}
.alpha .lux{background:
  conic-gradient(from var(--a,0deg) at 50% 50%,rgba(255,120,220,.18),rgba(120,200,255,.18) 25%,rgba(170,255,190,.12) 50%,rgba(255,220,120,.14) 75%,rgba(255,120,220,.18)),
  linear-gradient(100deg,transparent 40%,rgba(255,255,255,.45) 50%,transparent 60%);
  background-size:100% 100%,300% 100%;animation:spin 14s linear infinite,sweep2 6s cubic-bezier(.2,.7,.2,1) infinite;mix-blend-mode:screen}
/* ambre : résine translucide, inclusions, lueur interne */
.ambre{--m-bg:#8A4210;--m-ink:#FFF4E0;--m-acc:#FFC46B;box-shadow:0 0 0 1px rgba(0,0,0,.45) inset,0 1px 0 rgba(255,255,255,.35) inset,0 22px 44px -22px rgba(6,13,24,.9),0 0 52px -4px rgba(255,160,60,.6)}
.ambre .tex{background:
  radial-gradient(3px 3px at 28% 64%,rgba(60,20,0,.9) 50%,transparent 62%),radial-gradient(2px 2px at 70% 30%,rgba(60,20,0,.9) 50%,transparent 62%),radial-gradient(2.5px 2.5px at 58% 78%,rgba(60,20,0,.85) 50%,transparent 62%),radial-gradient(1.5px 1.5px at 40% 22%,rgba(60,20,0,.8) 50%,transparent 62%),radial-gradient(2px 2px at 78% 70%,rgba(60,20,0,.8) 50%,transparent 62%),
  radial-gradient(85% 75% at 50% 45%,rgba(255,190,90,.38),rgba(120,50,10,0) 72%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.25' numOctaves='3' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .8 0 0 0 0 .4 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
  linear-gradient(170deg,rgba(255,255,255,.12),transparent 35%,rgba(0,0,0,.32))}
.ambre .lux{background:
  radial-gradient(50% 42% at 50% 52%,rgba(255,225,150,.5),transparent 72%),
  radial-gradient(38% 26% at var(--x,25%) 16%,rgba(255,255,255,.55),transparent 66%),
  linear-gradient(100deg,transparent 42%,rgba(255,245,210,.55) 50%,transparent 58%);
  background-size:100% 100%,100% 100%,300% 100%;
  animation:glow 3.4s ease-in-out infinite,drift 6s ease-in-out infinite alternate,sweep4 5s cubic-bezier(.2,.7,.2,1) infinite;mix-blend-mode:screen}
@keyframes glow{0%,100%{filter:brightness(.85)}50%{filter:brightness(1.3)}}
@keyframes sweep4{0%{background-position:0 0,0 0,140% 0}55%,100%{background-position:0 0,0 0,-140% 0}}
@keyframes sweep{0%{background-position:120% 0}60%,100%{background-position:-120% 0}}
@keyframes sweep2{0%{background-position:0 0,140% 0}55%,100%{background-position:0 0,-140% 0}}
@keyframes sweep3{0%{background-position:0 0,150% 0,0 0,0 0,0 0,0 0}50%,100%{background-position:0 0,-150% 0,0 0,0 0,0 0,0 0}}
@keyframes twinkle{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes drift{from{--x:18%}to{--x:78%}}
@keyframes hue{from{filter:hue-rotate(0deg)}to{filter:hue-rotate(40deg)}}
@keyframes spin{to{--a:360deg}}
@property --x{syntax:"<percentage>";inherits:false;initial-value:30%}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@media (prefers-reduced-motion:reduce){.card .lux{animation:none}}

.card.email{border-width:2px}
/* échelle de matières */
.ladder{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;min-width:0}
.ladder li{cursor:pointer;display:grid;border-radius:6px;grid-template-columns:14px minmax(0,1fr);gap:12px;align-items:start;padding:8px 0;border-bottom:1px solid rgba(255,250,243,.12);transition:opacity .6s cubic-bezier(.2,.7,.2,1)}
.ladder li:last-child{border-bottom:0}
.ladder li:hover,.ladder li:focus-visible{background:rgba(255,250,243,.06);outline:none}
.ladder li:hover .lbl{color:#FFFAF3}
.ladder .dot{width:12px;height:12px;border-radius:3px;margin-top:3px;background:#1A2C42;border:1px solid rgba(255,250,243,.22);transition:background .6s cubic-bezier(.2,.7,.2,1),border-color .6s cubic-bezier(.2,.7,.2,1)}
.ladder .lbl{font-family:"Archivo",system-ui,sans-serif;font-weight:600;font-size:14px;color:#FFFAF3;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ladder .thr{font-size:12.5px;color:#D6CCC0;font-family:"Satoshi","Figtree",system-ui,sans-serif;font-weight:400}
.ladder li.done .dot{background:#AFC7E2;border-color:#AFC7E2}
.ladder li.now .dot{background:#FF8A7E;border-color:#FF8A7E;box-shadow:0 0 0 4px rgba(255,138,126,.18)}
.ladder li.now .lbl{color:#FFFAF3}
.ladder li.todo{opacity:.45}
.ladder li.alpha-row{border-top:1px dashed rgba(255,250,243,.22);margin-top:4px;padding-top:12px}
.ladder li.alpha-row.now .dot{background:#C9A8FF;border-color:#C9A8FF;box-shadow:0 0 0 4px rgba(201,168,255,.2)}
.ladder .tick{font-size:12px;color:#AFC7E2;font-family:"Satoshi","Figtree",system-ui,sans-serif}

.caption{margin:4px 0 0;font-size:16.5px;line-height:1.45;font-weight:600;color:#FFFAF3;text-align:center;width:100%;text-wrap:balance}
@media (min-width:1240px){.caption{width:620px;font-size:16px}}
.meter{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 16px;border-radius:10px;background:#324A67;border:1px solid rgba(255,250,243,.12);box-sizing:border-box}
.meter b{font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:22px;color:#FFFAF3;font-variant-numeric:tabular-nums}
.meter span{font-size:12.5px;color:#D6CCC0}
.meter .used{font-family:"Archivo",system-ui,sans-serif;font-weight:600;font-size:12.5px;color:#AFC7E2;font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion:reduce){.card3d,.ladder li,.ladder .dot{transition:none}}

@media (max-width:640px){.rt-question{flex-direction:column;align-items:flex-start}.rt-question svg{transform:rotate(90deg);margin-left:-12px}}
.rt-tag{display:inline-flex !important;align-items:center;gap:8px !important;width:fit-content;max-width:100%;box-sizing:border-box;background:#FF8A7E;color:#213650 !important;padding:6px 12px !important;border-radius:6px;font-size:13.5px !important;font-weight:700 !important;line-height:1.3}
@media (min-width:861px){.rt-band-text{margin-left:clamp(24px,5vw,80px)}}