
/* intro + photos autour */
.sintro{display:grid;grid-template-columns:.9fr 1.5fr .9fr;gap:clamp(18px,2.6vw,44px);align-items:center}
.sintro__txt{text-align:center;padding:clamp(6px,1.5vw,18px) 0}
.sintro__txt .k{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--m1);margin-bottom:18px;display:inline-block}
.sintro__txt h2{font-family:var(--display);font-weight:400;font-size:clamp(28px,4vw,54px);line-height:1.02;letter-spacing:-.03em;margin-bottom:20px}
.sintro__txt p{font-size:clamp(15px,1.6vw,18px);line-height:1.65;color:var(--m2);max-width:44ch;margin:0 auto 14px}
.sintro .col{display:flex;flex-direction:column;gap:clamp(14px,2vw,22px)}
.sintro .ph{border-radius:18px;overflow:hidden;background:var(--panel)}
.sintro .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--eo)}
.sintro .ph:hover img{transform:scale(1.05)}
.sintro .ph--tall{aspect-ratio:3/4}
.sintro .ph--sq{aspect-ratio:1}
@media(max-width:820px){
  .sintro{grid-template-columns:1fr 1fr;gap:14px}
  .sintro__txt{grid-column:1/-1;order:-1;text-align:left;margin-bottom:8px}
  .sintro__txt p{margin-left:0}
}
/* équipe : 3 colonnes desktop, empilé en mobile (spécificité renforcée) */
.team.team--3{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.team.team--3{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.team.team--3{grid-template-columns:1fr}.team.team--3 .tm .ph{aspect-ratio:4/5}}
/* contact équipe */
.teamcontact{margin-top:clamp(30px,4vw,50px);display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
/* listing générique (awards + clients) */
.rlist{border-top:1px solid var(--line)}
.rlist .row{display:grid;grid-template-columns:1.1fr 1.5fr auto;gap:clamp(16px,3vw,44px);align-items:baseline;padding:clamp(15px,1.7vw,22px) 0;border-bottom:1px solid var(--line);transition:padding-left .4s var(--eo),opacity .3s}
a.row{color:inherit}
a.row:hover{padding-left:12px}
.rlist .rn{font-family:var(--display);font-weight:400;font-size:clamp(18px,2.1vw,27px);letter-spacing:-.01em;text-transform:none}
.rlist .rt{font-size:14px;line-height:1.5;color:var(--m2)}
.rlist .ry{font-size:14px;color:var(--m1);text-align:right;justify-self:end;white-space:nowrap;font-variant-numeric:tabular-nums}
/* listing clients/projets : version compacte (juste un listing) */
.rlist.clients .row{padding:clamp(8px,.9vw,12px) 0}
.rlist.clients .rn{font-size:clamp(14px,1.35vw,17px);letter-spacing:0}
.rlist.clients .rt{font-size:13px}
.rlist.clients .ry{font-size:13px}
.rlist.clients a.row:hover{padding-left:8px}
.rlist .idx{font-size:13px;color:var(--m1)}
.awards .row{grid-template-columns:1.5fr .8fr 1.2fr auto;align-items:baseline}
.awards .rcat{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--m1)}
.awards .rcli{font-size:15px;color:var(--m2)}
.awards .row[data-img]{cursor:pointer}
.award-preview{position:fixed;top:0;left:0;width:clamp(170px,19vw,260px);aspect-ratio:4/3;border-radius:14px;overflow:hidden;pointer-events:none;z-index:120;opacity:0;transform:translate(-50%,-50%) scale(.9) rotate(-3deg);transition:opacity .3s var(--eo),transform .45s var(--eo);box-shadow:0 26px 60px rgba(0,0,0,.28);background:var(--panel)}
.award-preview.show{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-2deg)}
.award-preview img{width:100%;height:100%;object-fit:cover;display:block}
@media(hover:none){.award-preview{display:none!important}}
@media(max-width:680px){
  .rlist .row{grid-template-columns:1fr auto;row-gap:6px}
  .rlist .rt{grid-column:1/-1}
  .awards .row{grid-template-columns:1fr auto;row-gap:5px}
  .awards .rcat,.awards .rcli{grid-column:1/-1}
}

/* TIMELINE horizontale (scroll-hijack) */
.tl{position:relative;background:var(--bg);color:var(--ink);height:300vh;transition:background-color .6s var(--eo),color .6s var(--eo)}
.tl.lit{background:var(--dark);color:#fff}
.tl__head h2,.tl__item .yr,.tl__item h3,.tl__item p,.tl__track::before,.tl__item::before{transition:color .6s var(--eo),background .6s var(--eo)}
.tl:not(.lit) .tl__head h2,.tl:not(.lit) .tl__item .yr,.tl:not(.lit) .tl__item h3{color:var(--ink)}
.tl:not(.lit) .tl__item p{color:var(--m2)}
.tl:not(.lit) .tl__track::before{background:linear-gradient(90deg,rgba(0,0,0,.04),rgba(0,0,0,.16),rgba(0,0,0,.04))}
.tl:not(.lit) .tl__item::before{background:rgba(0,0,0,.16)}
.tl:not(.lit) .tl__item.alt .yr,.tl:not(.lit) .tl__item:hover .yr{color:var(--ink)}
.tl__sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center;padding-top:clamp(28px,6vh,72px)}
.tl__head{position:absolute;top:clamp(56px,9vh,104px);left:var(--gut);z-index:2;max-width:60vw}
.tl__head .k{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--m1);margin-bottom:16px;display:inline-flex;align-items:center;gap:10px}
.tl__head .k .hc{width:14px;height:7px;border-radius:14px 14px 0 0;background:var(--accent)}
.tl__head h2{font-family:var(--display);font-weight:400;font-size:clamp(28px,4.6vw,60px);line-height:1.0;letter-spacing:-.03em;color:#fff}
.tl__track{position:relative;display:flex;align-items:flex-start;gap:clamp(40px,6vw,120px);padding:0 var(--gut);will-change:transform}
.tl__track::before{content:'';position:absolute;left:0;right:0;top:7px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.28),rgba(255,255,255,.05))}
.tl__item{flex:0 0 auto;width:min(330px,80vw);position:relative;padding-top:var(--stem,60px)}
.tl__item::before{content:'';position:absolute;left:6.5px;top:15px;width:1px;height:calc(var(--stem,60px) - 20px);background:rgba(255,255,255,.22)}
.tl__item .dot{position:absolute;top:1px;left:0;width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(114,160,255,.16)}
.tl__item .yr{font-family:var(--display);font-weight:400;font-size:clamp(50px,6vw,104px);letter-spacing:-.04em;line-height:.9;color:#fff;transition:color .3s}
.tl__item.alt .yr{color:var(--accent)}
.tl__item:hover .yr{color:var(--accent)}
.tl__item h3{font-family:var(--display);font-weight:400;font-size:clamp(21px,2.4vw,28px);letter-spacing:-.01em;margin-top:12px;color:#fff}
.tl__item p{font-size:15px;line-height:1.6;color:var(--m1);margin-top:10px;max-width:32ch}
.tl__item.has-img{width:min(400px,84vw)}
.tl__media{margin-top:18px;border-radius:14px;overflow:hidden;background:#1a1a1a;box-shadow:0 22px 50px rgba(0,0,0,.35);transform:translateY(var(--rise,0)) rotate(var(--rot,0deg));transition:box-shadow .5s var(--eo)}
.tl__media img,.tl__media video{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:4/3}
.tl__item:hover .tl__media{--rot:0deg}
.tl__item.r1 .tl__media{--rot:-2deg}
.tl__item.r2 .tl__media{--rot:1.6deg}
.tl__item.tall .tl__media img,.tl__item.tall .tl__media video{aspect-ratio:3/4}
.tl__item.intro{width:min(440px,82vw);padding-top:0;align-self:center}
.tl__item.intro::before,.tl__item.intro .dot{display:none}
.tl__item.intro h3{font-size:clamp(26px,3.4vw,44px);margin-top:0;line-height:1.1}
.tl__item.intro p{margin-top:16px;color:var(--m2)}
@media(max-width:760px){
  /* timeline verticale sur mobile : ligne continue à gauche, cartes empilées */
  .tl{height:auto!important}
  .tl__sticky{position:static;height:auto;display:block;padding:clamp(52px,9vw,76px) 0;overflow:visible}
  .tl__head{position:static;padding:0 var(--gut);max-width:none;margin-bottom:30px}
  .tl__track{display:block;transform:none!important;padding:0 var(--gut)}
  .tl__track::before{display:none}
  .tl__item{width:100%!important;padding:0 0 0 30px!important;margin-bottom:38px;position:relative}
  .tl__item::before{display:block;left:6.5px;top:8px;height:calc(100% + 30px);width:1px}
  .tl__item:last-child{margin-bottom:0}
  .tl__item:last-child::before{height:calc(100% - 8px)}
  .tl__item .dot{top:8px}
  .tl__item .yr{font-size:42px}
  .tl__item.intro{padding-left:0!important;margin-bottom:44px}
  .tl__media{transform:none;max-width:420px}
  .tl__item.has-img{width:100%!important}
}
