@font-face {
  font-family: 'Zariantz Grotesk';
  src: url('assets/ZariantzGrotesk-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Zariantz Grotesk';
  src: url('assets/ZariantzGrotesk-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

html,body{
margin:0;
background:#080808}
#tm-home-v4 button,#tm-home-v4 a{
-webkit-tap-highlight-color:transparent}
#tm-home-v4 button{
cursor:pointer}
#tm-home-v4 svg{
display:block;
width:24px;
height:24px}
#tm-home-v4{
--tm-black:#080808;
--tm-white:#ffffff;
--tm-gray:#b8b8b8;
--tm-accent:#fff;
--tm-radius:26px;
--tm-grow:1.14;
--tm-shrink:.86;
background:var(--tm-black);
color:var(--tm-white);
font:400 15px/1.65 'Manrope',Arial,sans-serif;
width:100%;
box-sizing:border-box;
color-scheme:dark;
isolation:isolate}
#tm-home-v4 *{
box-sizing:border-box}
#tm-home-v4 [hidden]{
display:none!important}
#tm-home-v4 a{
color:inherit;
text-decoration:none}
#tm-home-v4 button{
font:inherit;
color:inherit}
#tm-home-v4 button:focus-visible,#tm-home-v4 a:focus-visible{
outline:2px solid var(--tm-accent);
outline-offset:5px}
#tm-home-v4 h1,#tm-home-v4 h2{
font-family:'Zariantz Grotesk','Manrope',Arial,sans-serif;
font-weight:900;
font-style:normal;
font-synthesis:none;
text-transform:uppercase}
#tm-home-v4 h3{
font-family:'Zariantz Grotesk','Manrope',Arial,sans-serif;
font-weight:600;
font-synthesis:none;
text-transform:uppercase}
#tm-home-v4 .tm-hero{
height:610px;
position:relative;
isolation:isolate;
background:#242424;
overflow:hidden}
#tm-home-v4 .tm-film{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
z-index:-3}
#tm-home-v4 .tm-hero::after{
content:'';
position:absolute;
inset:0;
z-index:-2;
background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.02) 32%,rgba(0,0,0,.56) 78%,#080808)}
#tm-home-v4 .tm-header{
position:absolute;
top:0;
left:0;
right:0;
display:grid;
grid-template-columns:1fr 200px 1fr;
gap:30px;
align-items:center;
min-height:112px;
padding:0 7%;
z-index:3}
#tm-home-v4 .tm-nav-side{
display:flex;
gap:26px;
align-items:center;
justify-content:center;
font-size:13px;
font-weight:600}
#tm-home-v4 .tm-nav-side a{
padding:12px 0;
position:relative;
white-space:nowrap}
#tm-home-v4 .tm-nav-side a::after{
content:'';
position:absolute;
left:0;
bottom:6px;
width:100%;
height:2px;
background:var(--tm-accent);
transform:scaleX(0);
transform-origin:left;
transition:transform 180ms}
#tm-home-v4 .tm-nav-side a:hover::after,#tm-home-v4 .tm-nav-side a:focus-visible::after{
transform:scaleX(1)}
#tm-home-v4 .tm-brand{
display:block;
justify-self:center;
width:200px;
padding:6px}
#tm-home-v4 .tm-brand img{
width:100%;
height:auto;
display:block}
#tm-home-v4 .tm-hero-copy{
position:absolute;
left:8%;
right:8%;
bottom:92px}
#tm-home-v4 .tm-eyebrow{
margin:0 0 19px;
font-size:11px;
letter-spacing:2.2px;
text-transform:uppercase;
font-weight:600;
color:#d6d6d6}
#tm-home-v4 h1{
font-size:clamp(38px,6.7vw,76px);
line-height:1.03;
letter-spacing:-2.4px;
font-style:normal;
margin:0 0 28px;
max-width:850px}
#tm-home-v4 h1 em{
font-style:inherit;
color:var(--tm-accent)}
#tm-home-v4 .tm-main-action{
display:inline-flex;
align-items:center;
gap:13px;
padding:14px 20px;
border-radius:7px;
background:#ffffff;
color:#121212;
font-size:13px;
font-weight:700;
transition:background 180ms}
#tm-home-v4 .tm-main-action:hover{
background:var(--tm-accent)}
#tm-home-v4 .tm-main-action svg{
width:17px;
height:17px}
#tm-home-v4 .tm-down{
position:absolute;
bottom:21px;
left:calc(50% - 22px);
width:44px;
height:44px;
display:grid;
place-items:center}
#tm-home-v4 .tm-playback{
position:absolute;
right:6%;
bottom:24px;
width:44px;
height:44px;
border-radius:50%;
border:1px solid #a8a8a8;
background:rgba(0,0,0,.3);
display:grid;
place-items:center}
#tm-home-v4 .tm-playback svg{
width:16px;
height:16px}
#tm-home-v4 .tm-clients{
position:relative;
padding:35px 0 43px;
background:#080808}
#tm-home-v4 .tm-client-heading{
display:flex;
justify-content:center;
gap:20px;
align-items:center;
margin-bottom:24px}
#tm-home-v4 .tm-client-heading p{
margin:0;
font-size:11px;
letter-spacing:2px;
text-transform:uppercase;
color:var(--tm-gray)}
#tm-home-v4 .tm-marquee-button{
padding:4px;
border:0;
background:transparent;
width:32px;
height:32px;
display:grid;
place-items:center;
color:#b5b5b5}
#tm-home-v4 .tm-marquee-button svg{
width:14px;
height:14px}
#tm-home-v4 .tm-marquee-window{
overflow:hidden;
mask-image:linear-gradient(to right,transparent,#000000 8%,#000000 92%,transparent)}
#tm-home-v4 .tm-marquee-track{
display:flex;
width:max-content;
animation:tm-clients-slide 28s linear infinite}
#tm-home-v4 .tm-client-set{
display:flex;
align-items:center;
gap:60px;
padding:0 30px;
flex-shrink:0}
#tm-home-v4 .tm-client-logo{
width:145px;
height:62px;
display:flex;
align-items:center;
justify-content:center}
#tm-home-v4 .tm-client-logo img{
max-width:145px;
max-height:58px;
object-fit:contain;
filter:invert(1);
mix-blend-mode:screen;
opacity:.86}
#tm-home-v4 .tm-clients:hover .tm-marquee-track,#tm-home-v4 .tm-clients:focus-within .tm-marquee-track,#tm-home-v4 .tm-clients.tm-still .tm-marquee-track{
animation-play-state:paused}

@keyframes tm-clients-slide{
to{
transform:translateX(-50%)}
}
#tm-home-v4 .tm-project-section{
position:relative;
padding:68px 6% 78px;
background:radial-gradient(ellipse 58% 420px at 103% 12%,rgba(78,78,78,.32),transparent 75%),#080808;
scroll-margin-top:20px}
#tm-home-v4 .tm-section-top{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:20px;
margin-bottom:45px}
#tm-home-v4 .tm-section-title{
font-size:clamp(30px,5.2vw,56px);
line-height:1.03;
letter-spacing:-1.6px;
margin:0}
#tm-home-v4 .tm-section-title em{
font-style:normal;
color:var(--tm-accent)}
#tm-home-v4 .tm-section-index{
font-size:11px;
letter-spacing:2px;
color:var(--tm-gray);
padding-bottom:4px;
white-space:nowrap}
#tm-home-v4 .tm-project::after{
content:'';
position:absolute;
inset:0;
z-index:-1;
background:linear-gradient(180deg,rgba(0,0,0,.07),transparent 35%,rgba(0,0,0,.08) 57%,rgba(0,0,0,.87) 93%,rgba(0,0,0,.96))}
#tm-home-v4 .tm-project-info{
position:absolute;
left:24px;
right:24px;
bottom:24px;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:13px}
#tm-home-v4 .tm-tag{
display:inline-block;
border-radius:30px;
background:rgba(59,59,59,.9);
padding:4px 11px;
font-size:11px;
margin-bottom:10px}
#tm-home-v4 .tm-project-name{
display:block;
font-size:20px;
font-weight:600;
line-height:1.2;
letter-spacing:-.5px}
#tm-home-v4 .tm-project-caption{
display:block;
font-size:12px;
color:#cfcfcf;
margin-top:6px}
#tm-home-v4 .tm-project-arrow{
width:42px;
height:42px;
flex:0 0 42px;
border-radius:50%;
background:rgba(255,255,255,.13);
display:grid;
place-items:center;
transition:background .2s,color .2s}
#tm-home-v4 .tm-project-arrow svg{
width:21px;
height:21px}

@media(hover:hover) and (pointer:fine){
}
#tm-home-v4 .tm-support{
--tm-accent:#111;
position:relative;
padding:70px 8%;
display:grid;
grid-template-columns:1.2fr 1fr;
gap:50px;
align-items:center;
background:#fff;
color:#111;
color-scheme:light;
scroll-margin-top:20px}
#tm-home-v4 .tm-support h2{
font-size:clamp(27px,3.5vw,38px);
line-height:1.12;
letter-spacing:-1px;
margin:0}
#tm-home-v4 .tm-support p{
color:inherit;
font-size:15px;
margin:0 0 24px}
#tm-home-v4 .tm-outline-action{
display:inline-block;
border:1px solid #9c9c9c;
border-radius:7px;
padding:12px 18px;
font-size:12px;
font-weight:600}
#tm-home-v4 .tm-footer{
padding:78px 8% 28px;
background:radial-gradient(ellipse 80% 400px at -20% 100%,rgba(56,56,56,.43),transparent 80%),#080808;
scroll-margin-top:20px}
#tm-home-v4 .tm-footer h2{
font-size:clamp(32px,5.2vw,60px);
line-height:1.03;
letter-spacing:-1.8px;
margin:0 0 30px}
#tm-home-v4 .tm-footer h2 em{
color:var(--tm-accent);
font-style:normal}
#tm-home-v4 .tm-contact-links{
display:flex;
gap:20px 30px;
flex-wrap:wrap;
font-size:15px}
#tm-home-v4 .tm-contact-links a{
border-bottom:1px solid #585858;
padding:6px 0}
#tm-home-v4 .tm-footer-base{
border-top:1px solid #333333;
padding-top:25px;
margin-top:55px;
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
flex-wrap:wrap;
font-size:11px;
color:var(--tm-gray)}
#tm-home-v4 .tm-socials{
display:flex;
align-items:center;
gap:12px}
#tm-home-v4 .tm-socials a{
display:grid;
place-items:center;
width:44px;
height:44px;
border-radius:50%;
color:#fff;
transition:background .2s}
#tm-home-v4 .tm-socials a:hover,
#tm-home-v4 .tm-socials a:focus-visible{
background:rgba(255,255,255,.1)}
#tm-home-v4 .tm-socials svg{
width:24px;
height:24px}
#tm-home-v4 .tm-detail{
padding:35px 6% 65px;
background:radial-gradient(ellipse at 105% 10%,#272727,transparent 60%),#080808}
#tm-home-v4 .tm-back{
display:flex;
align-items:center;
gap:10px;
padding:10px 0;
border:0;
background:transparent;
margin-bottom:20px;
font-size:13px}
#tm-home-v4 .tm-detail-picture{
height:420px;
background-size:cover;
background-position:center;
border-radius:var(--tm-radius)}
#tm-home-v4 .tm-detail-content{
padding-top:25px;
display:flex;
align-items:center;
justify-content:space-between;
gap:25px}
#tm-home-v4 .tm-detail h2{
font-size:30px;
line-height:1.1;
margin:0 0 12px;
letter-spacing:-.7px}
#tm-home-v4 .tm-detail p{
max-width:490px;
font-size:14px;
color:var(--tm-gray);
margin:0}
#tm-home-v4 .tm-detail-link{
display:inline-flex;
align-items:center;
gap:10px;
padding:13px 18px;
border-radius:7px;
background:var(--tm-accent);
color:#111111;
font-weight:700;
font-size:13px;
white-space:nowrap}

@media(max-width:760px){
#tm-home-v4 .tm-header{
grid-template-columns:1fr 160px 1fr;
gap:18px;
padding:0 5%}
#tm-home-v4 .tm-brand{
width:160px}
#tm-home-v4 .tm-nav-side{
gap:16px;
font-size:11px}
#tm-home-v4 h1{
font-size:56px}
#tm-home-v4 .tm-support{
grid-template-columns:1fr;
gap:28px}
}

@media(max-width:600px){
#tm-home-v4 .tm-hero{
height:570px}
#tm-home-v4 .tm-header{
grid-template-columns:1fr 115px 1fr;
gap:10px;
padding:10px 5%;
min-height:108px}
#tm-home-v4 .tm-brand{
width:115px;
padding:0}
#tm-home-v4 .tm-nav-side{
flex-direction:column;
gap:0;
font-size:11px}
#tm-home-v4 .tm-nav-side a{
padding:10px 0;
min-height:40px}
#tm-home-v4 .tm-hero-copy{
left:7%;
right:7%;
bottom:90px}
#tm-home-v4 h1{
font-size:clamp(32px,8.7vw,50px);
letter-spacing:-1.3px;
line-height:1.08}
#tm-home-v4 .tm-eyebrow{
font-size:10px;
letter-spacing:1.2px}
#tm-home-v4 .tm-client-set{
gap:35px;
padding:0 18px}
#tm-home-v4 .tm-client-logo{
width:118px}
#tm-home-v4 .tm-client-logo img{
max-width:118px;
max-height:48px}
#tm-home-v4 .tm-project-section{
padding:40px 6% 48px}
#tm-home-v4 .tm-section-top{
margin-bottom:30px}
#tm-home-v4 .tm-section-title{
font-size:34px;
letter-spacing:-1px}
#tm-home-v4 .tm-section-index{
display:none}
#tm-home-v4 .tm-project-info{
left:21px;
right:21px;
bottom:22px}
#tm-home-v4 .tm-footer{
padding:58px 7% 24px}
#tm-home-v4 .tm-footer h2{
font-size:36px}
#tm-home-v4 .tm-contact-links{
flex-direction:column;
align-items:flex-start;
font-size:13px;
gap:12px}
#tm-home-v4 .tm-footer-base{
align-items:flex-start;
flex-direction:column}
#tm-home-v4 .tm-detail-picture{
height:320px}
#tm-home-v4 .tm-detail-content{
flex-direction:column;
align-items:flex-start}
#tm-home-v4 .tm-detail h2{
font-size:26px}
}

@media(max-width:380px){
#tm-home-v4 .tm-header{
grid-template-columns:minmax(0,1fr) 96px minmax(0,1fr);
gap:6px;
padding-left:4%;
padding-right:4%}
#tm-home-v4 .tm-brand{
width:96px}
#tm-home-v4 .tm-section-title,#tm-home-v4 .tm-footer h2{
font-size:30px}
}

@media(prefers-reduced-motion:reduce){
#tm-home-v4 .tm-marquee-track{
animation:none}
#tm-home-v4 .tm-marquee-window{
overflow:visible;
mask-image:none}
#tm-home-v4 .tm-marquee-track{
width:100%}
#tm-home-v4 .tm-client-set{
width:100%;
justify-content:center;
flex-wrap:wrap}
#tm-home-v4 .tm-client-set[aria-hidden="true"]{
display:none}
}
#tm-home-v4 .tm-porsche{
background-image:url("assets/porsche.webp")}
#tm-home-v4 .tm-endroit{
background-image:url("assets/endroit.webp")}
#tm-home-v4 .tm-bor{
background-image:url("assets/bor.webp")}
#tm-home-v4 .tm-crystal{
background-image:url("assets/crystal.webp")}

/* Fiches : une paire conserve sa largeur et sa hauteur pendant le survol. */
#tm-home-v4 .tm-project-grid { display: grid; grid-template-columns: 1fr; gap: 26px; }
#tm-home-v4 .tm-project-row { display: flex; gap: 26px; aspect-ratio: 2 / 1.02; min-width: 0; }
#tm-home-v4 .tm-project {
  display: block; flex: 1 1 0; width: 0; min-width: 0; padding: 0; border: 0;
  position: relative; isolation: isolate; text-align: left; aspect-ratio: auto;
  border-radius: var(--tm-radius); background: #202020; color: #fff; overflow: hidden;
  transition: flex-grow .6s cubic-bezier(0,0,.2,1);
}
#tm-home-v4 .tm-project-photo { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; }
#tm-home-v4 .tm-project-arrow { transition: background .3s,color .3s; }
#tm-home-v4 .tm-project-more { display: flex; justify-content: center; margin-top: 38px; }
#tm-home-v4 .tm-discover { display: inline-flex; align-items: center; gap: 38px; border: 1px solid #777; border-radius: 7px; padding: 14px 23px; font-size: 13px; font-weight: 600; transition: background .2s,color .2s; }
#tm-home-v4 .tm-discover:hover { background: #fff; color: #111; }
#tm-home-v4 .tm-discover svg { width: 19px; height: 19px; }
@media (min-width:601px) and (hover:hover) and (pointer:fine) {
  #tm-home-v4 .tm-project-row:has(.tm-project:hover) .tm-project { flex-grow: var(--tm-shrink); }
  #tm-home-v4 .tm-project-row:has(.tm-project:hover) .tm-project:hover { flex-grow: var(--tm-grow); }
  #tm-home-v4 .tm-project:hover .tm-project-arrow { background: #fff; color: #111; }
}
@media (min-width:601px) {
  #tm-home-v4 .tm-project-row:has(.tm-project:focus-visible):not(:has(.tm-project:hover)) .tm-project { flex-grow: var(--tm-shrink); }
  #tm-home-v4 .tm-project-row:has(.tm-project:focus-visible):not(:has(.tm-project:hover)) .tm-project:focus-visible { flex-grow: var(--tm-grow); }
}

/* Process : boîtes alternées et illustrations façon autocollants. */
#tm-home-v4 .tm-process { position: relative; padding: 80px 8% 90px; background: radial-gradient(ellipse 70% 500px at 95% 45%,#191919,transparent 85%),#080808; }
#tm-home-v4 .tm-process-heading { margin-bottom: 65px; }
#tm-home-v4 .tm-process-heading .tm-eyebrow { margin: 22px 0 0; }
#tm-home-v4 .tm-timeline { position: relative; --tm-line-x: 50%; }
#tm-home-v4 .tm-timeline::before, #tm-home-v4 .tm-timeline-progress { content: ''; position: absolute; left: var(--tm-line-x); top: 0; bottom: 0; width: 1px; background: #303030; transform: translateX(-50%); }
#tm-home-v4 .tm-timeline-progress { background: #eee; transform-origin: top; transform: translateX(-50%) scaleY(var(--tm-progress,0)); }
#tm-home-v4 .tm-timeline-marker {
  position: absolute;
  z-index: 2;
  left: var(--tm-line-x);
  top: -6px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 5px rgba(255,255,255,.1),0 0 20px rgba(255,255,255,.55);
  transform: translate3d(-50%,var(--tm-marker-y,0px),0);
  pointer-events: none;
  visibility: hidden;
}
#tm-home-v4 .tm-timeline.is-scroll-ready .tm-timeline-marker { visibility: visible; }
#tm-home-v4 .tm-step { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 72px minmax(0,1fr); align-items: center; padding: 30px 0; }
#tm-home-v4 .tm-step-card { grid-column: 1; grid-row: 1; position: relative; min-width: 0; padding: 54px 28px 32px; border: 1px solid #383838; border-radius: 22px; background: #0d0d0d; transition: opacity .5s ease,transform .6s cubic-bezier(.22,1,.36,1),border-color .5s ease,box-shadow .5s ease; }
#tm-home-v4 .tm-step:nth-of-type(even) .tm-step-card { grid-column: 3; }
#tm-home-v4 .tm-step-illustration { position: absolute; top: -26px; left: 25px; width: 68px; height: 68px; display: grid; place-items: center; background: #f4f4f4; color: #111; border-radius: 43% 49% 40% 46%; transform: rotate(-9deg); border: 4px solid #080808; }
#tm-home-v4 .tm-step:nth-of-type(even) .tm-step-illustration { transform: rotate(8deg); }
#tm-home-v4 .tm-step-illustration img, #tm-home-v4 .tm-step-illustration svg { width: 37px; height: 37px; }
#tm-home-v4 .tm-step-number { display: block; font-family: 'Manrope',Arial,sans-serif; font-size: 12px; letter-spacing: 2px; color: #aaa; margin-bottom: 10px; }
#tm-home-v4 .tm-step h3 { font-size: clamp(23px,2.7vw,31px); line-height: 1.12; letter-spacing: -.015em; margin: 0; }
#tm-home-v4 .tm-step p { border-top: 1px solid #383838; padding-top: 19px; font-size: 13px; line-height: 1.75; color: #bdbdbd; margin: 22px 0 0; }
#tm-home-v4 .tm-timeline.is-scroll-ready .tm-step-card { opacity: .65; transform: translateY(12px) scale(.975); }
#tm-home-v4 .tm-timeline.is-scroll-ready .tm-step.is-passed .tm-step-card { opacity: .88; transform: none; border-color: #666; }
#tm-home-v4 .tm-timeline.is-scroll-ready .tm-step.is-active .tm-step-card {
  opacity: 1;
  transform: none;
  border-color: #e0e0e0;
  box-shadow: 0 0 0 1px rgba(255,255,255,.1),0 0 34px rgba(255,255,255,.11);
}
#tm-home-v4 .tm-step.is-active .tm-step-number { color: #fff; }
#tm-home-v4 .tm-project-section, #tm-home-v4 .tm-footer, #tm-home-v4 .tm-detail { background: #080808; }
#tm-home-v4 .tm-main-action:hover { background: #ddd; }
#tm-home-v4 h1 { font-style: normal; font-size: clamp(38px,6.6vw,78px); line-height: 1.06; letter-spacing: -.025em; }
#tm-home-v4 .tm-section-title { font-size: clamp(34px,5.3vw,62px); line-height: 1.08; letter-spacing: -.025em; }
#tm-home-v4 .tm-marquee-button { width: 44px; height: 44px; }
#tm-home-v4 .tm-project-info > span:first-child { min-width: 0; }
#tm-home-v4 .tm-eyebrow { font-size: 11px; }

@media (max-width:760px) {
  #tm-home-v4 .tm-step { grid-template-columns: minmax(0,1fr) 46px minmax(0,1fr); }
  #tm-home-v4 .tm-step-card { padding-left: 22px; padding-right: 22px; }
}
@media (max-width:600px) {
  #tm-home-v4 h1 { font-size: clamp(31px,8.1vw,49px); line-height: 1.12; }
  #tm-home-v4 .tm-section-title { font-size: clamp(29px,7.3vw,41px); }
  #tm-home-v4 .tm-project-grid { gap: 24px; }
  #tm-home-v4 .tm-project-row { display: grid; grid-template-columns: minmax(0,1fr); aspect-ratio: auto; gap: 24px; }
  #tm-home-v4 .tm-project { width: 100%; aspect-ratio: 1 / 1.02; }
  #tm-home-v4 .tm-process { padding: 60px 7%; }
  #tm-home-v4 .tm-process-heading { margin-bottom: 45px; }
  #tm-home-v4 .tm-timeline { --tm-line-x: 7px; }
  #tm-home-v4 .tm-step { grid-template-columns: 15px minmax(0,1fr); gap: 22px; padding: 25px 0; }
  #tm-home-v4 .tm-step-card, #tm-home-v4 .tm-step:nth-of-type(even) .tm-step-card { grid-column: 2; padding: 48px 23px 28px; }
  #tm-home-v4 .tm-step h3 { font-size: clamp(23px,6vw,29px); }
  #tm-home-v4 .tm-step-illustration { width: 62px; height: 62px; left: 20px; }
  #tm-home-v4 .tm-step-illustration img, #tm-home-v4 .tm-step-illustration svg { width: 33px; height: 33px; }
  #tm-home-v4 .tm-footer h2 { font-size: clamp(29px,7.6vw,42px); }
}
@media (max-width:380px) {
  #tm-home-v4 h1 { font-size: clamp(29px,8.1vw,31px); }
  #tm-home-v4 .tm-footer h2 { font-size: clamp(27px,7.6vw,29px); }
  #tm-home-v4 .tm-step { gap: 15px; }
  #tm-home-v4 .tm-step-card { padding-left: 19px; padding-right: 19px; }
}
@media (prefers-reduced-motion:reduce) {
  #tm-home-v4 *, #tm-home-v4 *::after { transition: none !important; }
  #tm-home-v4 .tm-project-row .tm-project { flex-grow: 1 !important; }
  #tm-home-v4 .tm-timeline.is-scroll-ready .tm-timeline-marker { visibility: hidden; }
  #tm-home-v4 .tm-timeline.is-scroll-ready .tm-step .tm-step-card { opacity: 1; transform: none; border-color: #666; box-shadow: none; }
}


/* Dessins détourés : la transparence suit la silhouette de l’illustration. */
#tm-home-v4 .tm-step-card { padding-top: 73px; }
#tm-home-v4 .tm-step-illustration {
  top: -43px;
  left: 19px;
  width: 114px;
  height: 104px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  transform: rotate(-7deg);
  filter: none;
}
#tm-home-v4 .tm-step:nth-of-type(even) .tm-step-illustration { transform: rotate(6deg); }
#tm-home-v4 .tm-step-illustration img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Verre transparent : fond visible, flou et reflets sur les bords. */
#tm-home-v4 {
  --tm-glass-opacity: .08;
  --tm-glass-blur: 18px;
  --tm-glass-fill: linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.025) 48%,rgba(255,255,255,.08)),rgba(255,255,255,var(--tm-glass-opacity));
}
#tm-home-v4 .tm-glass {
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.23);
  border-top-color: rgba(255,255,255,.42);
  border-bottom-color: rgba(255,255,255,.13);
  border-radius: 999px;
  background: var(--tm-glass-fill);
  color: #fff;
  -webkit-backdrop-filter: blur(var(--tm-glass-blur)) saturate(125%);
  backdrop-filter: blur(var(--tm-glass-blur)) saturate(125%);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.16),inset 0 -1px 2px rgba(0,0,0,.1),0 8px 24px rgba(0,0,0,.17);
  text-shadow: 0 1px 4px rgba(0,0,0,.22);
  transition: border-color .3s,box-shadow .3s,background .3s,transform .3s;
}
#tm-home-v4 .tm-main-action.tm-glass,
#tm-home-v4 .tm-discover.tm-glass,
#tm-home-v4 .tm-outline-action.tm-glass,
#tm-home-v4 .tm-detail-link.tm-glass,
#tm-home-v4 .tm-project-arrow.tm-glass { position: relative; }
#tm-home-v4 .tm-main-action.tm-glass,
#tm-home-v4 .tm-discover.tm-glass,
#tm-home-v4 .tm-outline-action.tm-glass,
#tm-home-v4 .tm-detail-link.tm-glass {
  padding: 15px 25px;
  min-height: 50px;
  font-family: 'Zariantz Grotesk','Manrope',Arial,sans-serif;
  font-weight: 600;
  font-synthesis: none;
  text-transform: uppercase;
  letter-spacing: .035em;
  max-width: 100%;
}
#tm-home-v4 .tm-back {
  font-family: 'Zariantz Grotesk','Manrope',Arial,sans-serif;
  font-weight: 600;
  font-synthesis: none;
  text-transform: uppercase;
  letter-spacing: .035em;
}
#tm-home-v4 .tm-glass::before {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(ellipse at 28% 0,rgba(255,255,255,.18),transparent 65%);
  opacity: .7;
  transition: opacity .3s;
}
#tm-home-v4 .tm-glass:hover,
#tm-home-v4 .tm-glass:focus-visible,
#tm-home-v4 .tm-project:hover .tm-project-arrow.tm-glass {
  background: var(--tm-glass-fill);
  color: #fff;
  border-color: rgba(255,255,255,.47);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.28),inset 0 -1px 2px rgba(0,0,0,.09),0 9px 26px rgba(0,0,0,.22);
}
#tm-home-v4 .tm-glass:hover::before { opacity: 1; }
#tm-home-v4 a.tm-glass:active { transform: translateY(1px); }

/* Bande d’accompagnement claire et bouton en verre adapté au fond blanc. */
#tm-home-v4 .tm-support .tm-glass {
  color: #111;
  background: linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,255,255,.2) 48%,rgba(0,0,0,.025)),rgba(0,0,0,.035);
  border-color: rgba(0,0,0,.22);
  border-top-color: rgba(0,0,0,.12);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.9),inset 0 -1px 2px rgba(0,0,0,.04),0 5px 18px rgba(0,0,0,.07);
  text-shadow: none;
}
#tm-home-v4 .tm-support .tm-glass:hover,
#tm-home-v4 .tm-support .tm-glass:focus-visible {
  color: #111;
  background: linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,255,255,.3)),rgba(0,0,0,.09);
  border-color: rgba(0,0,0,.45);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.95),0 7px 20px rgba(0,0,0,.1);
}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  #tm-home-v4 .tm-glass { background: rgba(40,40,40,.88); }
  #tm-home-v4 .tm-glass:hover, #tm-home-v4 .tm-glass:focus-visible,
  #tm-home-v4 .tm-project:hover .tm-project-arrow.tm-glass { background: rgba(55,55,55,.92); }
}
@media (max-width:600px) {
  #tm-home-v4 .tm-step-card,
  #tm-home-v4 .tm-step:nth-of-type(even) .tm-step-card { padding-top: 65px; }
  #tm-home-v4 .tm-step-illustration { width: 100px; height: 92px; top: -37px; left: 14px; }
}
@media (prefers-reduced-motion:reduce) {
  #tm-home-v4 .tm-glass, #tm-home-v4 .tm-glass::before { transition: none; }
  #tm-home-v4 a.tm-glass:active { transform: none; }
}
@media (prefers-reduced-transparency:reduce) {
  #tm-home-v4 .tm-glass, #tm-home-v4 .tm-glass:hover, #tm-home-v4 .tm-glass:focus-visible,
  #tm-home-v4 .tm-project:hover .tm-project-arrow.tm-glass {
    background: #292929;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  #tm-home-v4 .tm-support .tm-glass,
  #tm-home-v4 .tm-support .tm-glass:hover,
  #tm-home-v4 .tm-support .tm-glass:focus-visible { background: #ededed; }
}

/* Titres grand format, avec une échelle adaptée à chaque écran. */
#tm-home-v4 .tm-hero { height: clamp(680px,64vw,860px); }
#tm-home-v4 .tm-hero-copy { bottom: 86px; }
#tm-home-v4 .tm-hero h1 {
  font-size: clamp(60px,9vw,128px);
  line-height: .96;
  letter-spacing: -.018em;
  max-width: none;
  margin-bottom: 32px;
}
#tm-home-v4 .tm-section-title {
  font-size: clamp(68px,10.5vw,140px);
  line-height: .98;
  letter-spacing: -.018em;
}
#tm-home-v4 .tm-support h2 {
  font-size: clamp(52px,6.5vw,100px);
  line-height: .99;
  letter-spacing: -.018em;
}
#tm-home-v4 .tm-footer h2 {
  font-size: clamp(68px,10.5vw,150px);
  line-height: .98;
  letter-spacing: -.018em;
}
#tm-home-v4 .tm-detail h2 {
  font-size: clamp(44px,6vw,84px);
  line-height: 1;
  letter-spacing: -.018em;
}
@media (max-width:600px) {
  #tm-home-v4 .tm-hero { height: 620px; }
  #tm-home-v4 .tm-hero-copy { bottom: 92px; }
  #tm-home-v4 .tm-hero h1 { font-size: clamp(36px,10.5vw,62px); }
  #tm-home-v4 .tm-section-title { font-size: clamp(42px,12.5vw,76px); }
  #tm-home-v4 .tm-support h2 { font-size: clamp(42px,11.5vw,68px); }
  #tm-home-v4 .tm-footer h2 { font-size: clamp(42px,12.5vw,76px); }
  #tm-home-v4 .tm-detail h2 { font-size: clamp(38px,10vw,60px); }
}