/*
Theme Name: Rayane
Theme URI: https://rayane-abdedou.fr
Description: Thème enfant de Twenty Twenty-Five pour le portfolio de Rayane Abdedou : fond sombre, Clash Display et Figtree, accent #ff1900, compositions prêtes pour chaque page.
Author: Rayane Abdedou
Template: twentytwentyfive
Version: 1.0.10
Requires at least: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: rayane
*/

/* ===== Styles repris du canvas ===== */
html{color-scheme:dark}
html{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}
body{margin:0;background:#0D0D0D;font-feature-settings:"kern" 1;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
a{color:#FFFFFF;text-decoration:none}
a:hover{color:var(--accent, #ff1900)}
a:focus-visible{outline:2px solid #FFFFFF;outline-offset:4px}
h1,h2{text-wrap:balance}
p{text-wrap:pretty}
section{scroll-margin-top:24px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.grid-2{grid-template-columns:minmax(0,1fr)}}
.lien-trait{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .5s cubic-bezier(.16,1,.3,1),color .25s ease}
.lien-trait:hover,.lien-trait:focus-visible{background-size:100% 1px}
.carte .cadre{isolation:isolate;transform:translateZ(0)}
.carte .zoom{transition:transform 1s cubic-bezier(.16,1,.3,1)}
.carte .zoom{transition:transform 1s cubic-bezier(.16,1,.3,1),filter .6s cubic-bezier(.16,1,.3,1)}
.carte-survol{display:none}
.anim-on{--marge:40px}
@media (max-width:760px){.anim-on{--marge:16px}}
.grille-projets{gap:24px}
@media (hover:hover) and (min-width:761px){.grille-projets{row-gap:48px} .carte-survol{display:flex;position:absolute;inset:0;z-index:2;align-items:center;justify-content:space-between;gap:24px;padding:0 clamp(20px,2.4vw,40px);background:rgba(13,13,13,0);transition:background .6s ease} .carte-survol>span{opacity:0;transition:opacity .5s ease,transform .7s cubic-bezier(.16,1,.3,1)} .carte-survol>span:first-child{transform:translateX(-14px)} .carte-survol>span:last-child{transform:translateX(14px)} .carte:hover .zoom,.carte:focus-visible .zoom{transform:scale(1.08);filter:blur(14px)} .carte:hover .carte-survol,.carte:focus-visible .carte-survol{background:rgba(13,13,13,.28)} .carte:hover .carte-survol>span,.carte:focus-visible .carte-survol>span{opacity:1;transform:none}}
@media (max-width:760px),(hover:none){.grille-projets{row-gap:40px}}
.px-img{will-change:transform}
.carte:nth-child(even){--d:.14s}
.anim-on .carte{transform:translateY(56px);transition:transform 1.3s cubic-bezier(.16,1,.3,1) var(--d,0s)}
.anim-on .carte .cadre{clip-path:inset(100% 0 0 0);transition:clip-path 1.25s cubic-bezier(.16,1,.3,1) var(--d,0s)}
.anim-on .carte .rev-zoom{transform:scale(1.3);transition:transform 1.8s cubic-bezier(.16,1,.3,1) var(--d,0s)}
.anim-on .carte .carte-texte{opacity:0;transform:translateY(14px);transition:opacity .9s ease calc(var(--d,0s) + .45s),transform .9s cubic-bezier(.16,1,.3,1) calc(var(--d,0s) + .45s)}
.anim-on .carte[data-vu="1"]{transform:none}
.anim-on .carte[data-vu="1"] .cadre{clip-path:inset(0 0 0 0)}
.anim-on .carte[data-vu="1"] .rev-zoom{transform:none}
.anim-on .carte[data-vu="1"] .carte-texte{opacity:1;transform:none}
.verre{background:linear-gradient(180deg,rgba(40,40,40,.42) 0%,rgba(14,14,14,.32) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 16px rgba(255,255,255,.025),0 10px 30px rgba(0,0,0,.30)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.verre{background:rgba(22,22,22,.9)}}
a.verre{transition:background .3s ease,border-color .3s ease,color .25s ease}
a.verre:hover,a.verre:focus-visible{background:linear-gradient(180deg,rgba(60,60,60,.5) 0%,rgba(24,24,24,.4) 100%);border-color:rgba(255,255,255,.2);color:#FFFFFF}
.barre{left:50%;transform:translate(-50%,-160%);opacity:0;transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .5s ease}
.barre[data-visible="1"]{transform:translate(-50%,0);opacity:1}
.barre a{color:#FFFFFF}
a.btn-primaire{transition:background .3s ease,color .3s ease}
a.btn-primaire:hover,a.btn-primaire:focus-visible{background:var(--accent, #ff1900)!important;color:#FFFFFF!important}
.carte-etiquette{display:none!important}
@media (hover:hover) and (min-width:761px){.carte-etiquette{display:block;position:absolute;left:16px;bottom:16px;z-index:2;padding:6px 10px;border-radius:0;
    font-family:'Figtree',sans-serif;font-size:.667rem;letter-spacing:.06em;text-transform:uppercase;color:#FFFFFF;
    background:rgba(13,13,13,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);
    transition:opacity .4s ease} .carte:hover .carte-etiquette,.carte:focus-visible .carte-etiquette{opacity:0}}
.dispo-point{position:relative;width:8px;height:8px;border-radius:50%;background:#3DDC84;flex:none}
.dispo-point::after{content:"";position:absolute;inset:0;border-radius:50%;background:#3DDC84;animation:dispo 2s cubic-bezier(.16,1,.3,1) infinite}
@keyframes dispo{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(3);opacity:0}}
@media (max-width:600px){.barre-liens{display:none!important}}
@keyframes ouv-image{from{transform:scale(1.14);filter:brightness(.4)}to{transform:scale(1);filter:brightness(1)}}
@keyframes ouv-ligne{from{transform:translateY(105%)}to{transform:translateY(0)}}
@keyframes ouv-fondu{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.ouv-image{animation:ouv-image 1.8s cubic-bezier(.16,1,.3,1) both}
@keyframes ouv-logo{from{clip-path:inset(0 100% 0 0);transform:translateX(-24px)}to{clip-path:inset(0 0 0 0);transform:none}}
.ouv-fondu{animation:ouv-fondu .9s cubic-bezier(.16,1,.3,1) .55s both}
.ouv-nav{animation:ouv-fondu .9s cubic-bezier(.16,1,.3,1) .8s both}
@keyframes px-hero{from{transform:translateY(0)}to{transform:translateY(30%)}}
@keyframes px-hero-texte{from{transform:translateY(0);opacity:1}to{transform:translateY(-14vh);opacity:0}}
@keyframes rev-cadre{from{clip-path:inset(14% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes rev-texte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.px-on .px-hero{animation:px-hero linear both;animation-timeline:scroll();animation-range:0 100vh} .px-on .px-hero-texte{animation:px-hero-texte linear both;animation-timeline:scroll();animation-range:0 80vh} .px-on .rev-cadre{animation:rev-cadre linear both;animation-timeline:view();animation-range:entry 0% entry 70%} .px-on .rev-texte{animation:rev-texte linear both;animation-timeline:view();animation-range:entry 10% entry 90%}}
@media (prefers-reduced-motion: reduce){.ouv-image,.ouv-fondu,.ouv-nav,.px-hero,.px-hero-texte,.rev-cadre,.rev-texte{animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important;filter:none!important} .anim-on .carte,.anim-on .carte .rev-zoom,.anim-on .carte .carte-texte,.px-img{transform:none!important;opacity:1!important;transition:none!important} .anim-on .carte .cadre{clip-path:inset(0 0 0 0)!important;transition:none!important} .carte .zoom,.lien-trait,.barre,.carte-survol,.carte-survol>span,.carte-etiquette,a.btn-primaire{transition:none}}
.defiler-trait{position:relative;display:block;width:1px;height:40px;overflow:hidden;background:rgba(255,255,255,.18)}
.defiler-trait::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:#FFFFFF;animation:defiler 2.2s cubic-bezier(.16,1,.3,1) infinite}
@keyframes defiler{from{top:-40%}to{top:100%}}
@keyframes bandeau{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.competences{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;margin:0;padding:0;list-style:none}
@media (prefers-reduced-motion: reduce){.defiler-trait::after{animation:none}}
.menu-panneau{display:none}
@media (max-width:600px){.menu-panneau{display:flex;flex-direction:column;gap:4px;position:fixed;top:72px;left:16px;right:16px;z-index:69;padding:16px 20px 20px;border-radius:6px;box-sizing:border-box;
    opacity:0;transform:translateY(-12px);visibility:hidden;transition:opacity .4s ease,transform .6s cubic-bezier(.16,1,.3,1),visibility 0s linear .6s} .menu-panneau[data-ouvert="1"]{opacity:1;transform:none;visibility:visible;transition:opacity .4s ease,transform .6s cubic-bezier(.16,1,.3,1),visibility 0s} .menu-panneau a.menu-lien{display:block;padding:12px 0;font-family:'Clash Display',sans-serif;font-weight:500;font-size:1.5rem;color:#FFFFFF;border-bottom:1px solid rgba(255,255,255,.08)}}
@media (prefers-reduced-motion: reduce){.menu-panneau{transition:none!important}}
.pj-grille{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px}
.apropos-colle{align-self:stretch}
.apropos-colle::before{content:"";display:block;padding-top:125%}
.apropos-flux{display:flex;flex-direction:column;justify-content:space-between;gap:32px;align-self:stretch}
@media (max-width:900px){.apropos-flux{justify-content:flex-start}}
@media (max-width:900px){.pj-grille>*{grid-column:1 / -1!important} .pj-texte{font-size:1rem!important}}
.fd{position:relative}
.fd-grille{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:40px}
.fd-logo{grid-column:1 / span 3}
.fd-c1{grid-column:4 / span 3}
.fd-c2{grid-column:7 / span 3}
.fd-c3{grid-column:10 / span 3}
.fd-c a{color:#A3A3A3;transition:color .25s ease}
.fd-c a:hover,.fd-c a:focus-visible{color:#FFFFFF}
.fd-ct{display:inline-flex;align-items:center;gap:10px}
.fd-ico{width:28px;height:28px;border-radius:7px;flex:none;display:inline-flex;align-items:center;justify-content:center;color:#FFFFFF;background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(255,255,255,.14);transition:background .4s ease,border-color .4s ease}
.fd-ct:hover .fd-ico,.fd-ct:focus-visible .fd-ico{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.26)}
.fd-bas{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
@media (max-width:900px){.fd-logo{grid-column:1 / -1} .fd-c1,.fd-c2,.fd-c3{grid-column:span 4}}
@media (max-width:560px){.fd-c1,.fd-c2{grid-column:span 6} .fd-c3{grid-column:1 / -1} .fd-bas{flex-direction:column;align-items:flex-start}}
.fd-filet{position:absolute;top:0;left:var(--marge,40px);right:var(--marge,40px);height:1px;background:#262626;transform-origin:0 50%}
@keyframes fd-trace{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fd-monte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.fd-filet{animation:fd-trace linear both;animation-timeline:view();animation-range:entry 0% entry 90%} .fd-anim{animation:fd-monte linear both;animation-timeline:view();animation-range:entry calc(var(--i,0) * 12%) entry calc(70% + var(--i,0) * 12%)}}}
.barre-liens a{font-weight:300;display:inline-flex;flex-direction:column;align-items:center;transition:background-size .5s cubic-bezier(.16,1,.3,1)}
.barre-liens a::after{content:attr(data-texte);font-weight:500;height:0;visibility:hidden;overflow:hidden;pointer-events:none;user-select:none}
.barre-liens a:hover,.barre-liens a:focus-visible,.barre-liens a[aria-current="page"]{font-weight:500}
.btn-cv{display:inline-flex;align-items:center;gap:8px;margin-left:12px;padding:8px 14px 8px 10px;border-radius:0;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#FFFFFF;font-family:'Clash Display',sans-serif;font-weight:500;font-size:.9375rem;line-height:1;transition:background .4s ease,border-color .4s ease}
.btn-cv:hover,.btn-cv:focus-visible{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#FFFFFF}
.btn-cv svg{display:block;flex:none}
nav.barre.verre{background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);
  -webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  border:1px solid rgba(255,255,255,.14);box-shadow:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){nav.barre.verre{background:rgba(28,28,28,.92)}}
nav.barre{width:min(775px,calc(100% - 32px));display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center}
nav.barre > a:first-child{justify-self:start}
nav.barre .barre-liens{justify-self:center}
nav.barre .btn-cv{justify-self:end;margin-left:0;padding:9px 16px;border-radius:4px;gap:0}
@media (max-width:600px){nav.barre{grid-template-columns:1fr auto}}
.verre,.fd-ico,.carte-etiquette{background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);
  -webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  border:.3px solid rgba(255,255,255,.14);box-shadow:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.verre,.fd-ico,.carte-etiquette{background:rgba(28,28,28,.92)}}
a.verre:hover,a.verre:focus-visible,.fd-ct:hover .fd-ico,.fd-ct:focus-visible .fd-ico{background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.06) 55%,rgba(255,255,255,.09) 100%);border-color:rgba(255,255,255,.26)}
a.verre,a.btn-primaire{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;line-height:1;box-sizing:border-box;vertical-align:middle}
.barre-liens a.lien-trait{background-image:none}
.menu-bas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:20px}
.menu-bas a{min-height:48px}
@media (max-width:560px){.fd-grille{grid-template-columns:minmax(0,1fr)!important;row-gap:32px} .fd-logo{grid-column:1 / -1!important;justify-self:start} .fd-c1,.fd-c2,.fd-c3{grid-column:1 / -1!important} .fd-c>p{margin:0 0 12px!important} .fd-c ul{align-items:flex-start;text-align:left} .fd-bas>p{flex-wrap:nowrap!important;white-space:nowrap;gap:6px!important;justify-content:space-between!important;font-size:min(.656rem,2.9vw)!important;letter-spacing:0!important;text-transform:none!important}}
.barre-burger{display:none}
@media (max-width:600px){nav.barre .btn-cv{display:none!important} .barre-burger{display:flex;justify-self:end;position:relative;width:44px;height:44px;padding:0;border:0;background:transparent;color:#FFFFFF;cursor:pointer;align-items:center;justify-content:center} .barre-burger span{position:absolute;left:13px;width:18px;height:1.5px;background:currentColor;border-radius:1px;transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .3s ease} .barre-burger span:nth-child(1){transform:translateY(-6px)} .barre-burger span:nth-child(3){transform:translateY(6px)} .barre-burger[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)} .barre-burger[aria-expanded="true"] span:nth-child(2){opacity:0} .barre-burger[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg)} .menu-panneau{top:84px!important;z-index:59!important;border-radius:5px!important} .hero-ligne{flex-direction:column!important;flex-wrap:nowrap!important;justify-content:center!important;align-items:center!important;gap:16px!important;text-align:center} .hero-ligne svg{height:clamp(56px,17vw,84px)!important;transform:translateX(1.5%)} .hero-ligne>span:last-child{font-size:clamp(10px,3vw,13px)!important;letter-spacing:.05em;margin-right:-.05em} #top .px-hero-texte{align-items:flex-start!important;padding-top:7vh} header#top{min-height:min(100svh,167vw)!important} header#top .px-hero{object-position:49% center}}
@media (prefers-reduced-motion: reduce){.barre-burger span{transition:none!important}}
@keyframes px-hero-texte-m{from{transform:translateY(0);opacity:1}to{transform:translateY(-18vh);opacity:0}}
@supports (animation-timeline: scroll()){@media (max-width:600px) and (prefers-reduced-motion:no-preference){.px-on .px-hero{animation-range:0 min(100svh,167vw)} .px-on .px-hero-texte{animation-name:px-hero-texte-m;animation-range:0 calc(min(100svh,167vw) * .8)}}}
html,body{overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
.transition-voile{will-change:opacity}
.transition-voile.tv-off{display:none}
@media (prefers-reduced-motion: reduce){.transition-voile{display:none}}
@media (hover:hover) and (min-width:761px) and (prefers-reduced-motion:no-preference){.carte .zoom{transition:transform 1.6s cubic-bezier(.22,1,.36,1),filter 1.1s cubic-bezier(.4,0,.2,1)} .carte:hover .zoom,.carte:focus-visible .zoom{transform:scale(1.05);filter:blur(10px) brightness(.72)} .carte-survol{background:transparent!important} .carte-survol::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at center,rgba(13,13,13,.1) 0%,rgba(13,13,13,.5) 100%);opacity:0;transition:opacity 1.1s cubic-bezier(.4,0,.2,1)} .carte:hover .carte-survol::before,.carte:focus-visible .carte-survol::before{opacity:1} .carte-survol>span{transition:opacity .6s ease,transform .9s cubic-bezier(.22,1,.36,1)} .carte-survol>span:first-child{transform:translateX(-24px)} .carte-survol>span:last-child{transform:translateX(24px)} .carte:hover .carte-survol>span,.carte:focus-visible .carte-survol>span{transition:opacity 1s ease,transform 1.2s cubic-bezier(.22,1,.36,1)} .carte:hover .carte-survol>span:first-child,.carte:focus-visible .carte-survol>span:first-child{transition-delay:.12s} .carte:hover .carte-survol>span:last-child,.carte:focus-visible .carte-survol>span:last-child{transition-delay:.24s} .carte-etiquette{transition:opacity .7s ease}}
@media (max-width:760px),(pointer:coarse){.fd-c ul{gap:0!important} .fd-c a{display:inline-flex;align-items:center;min-height:44px} .fd-bas a{display:inline-flex;align-items:center;min-height:44px}}
@supports (animation-timeline: view()){.px-on .rev-texte{animation:rev-texte linear both;animation-timeline:view();animation-range:entry 10% entry 90%}}
@media (prefers-reduced-motion: reduce){.rev-texte{animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important;filter:none!important} .anim-on .carte,.anim-on .carte .rev-zoom,.anim-on .carte .carte-texte,.px-img{transform:none!important;opacity:1!important;transition:none!important} .anim-on .carte .cadre{clip-path:inset(0 0 0 0)!important;transition:none!important} .carte .zoom,.lien-trait,.barre,.carte-survol,.carte-survol>span,.carte-etiquette,a.btn-primaire{transition:none}}
@media (max-width:900px){.pj-titre{font-size:3.375rem!important}}
.barre-liens a[aria-current="page"]{background-size:100% 1px}
.barre-burger,.menu-panneau{display:none}
@media (max-width:600px){nav.barre .btn-cv{display:none!important} .barre-burger{display:flex;justify-self:end;position:relative;width:44px;height:44px;padding:0;border:0;background:transparent;color:#FFFFFF;cursor:pointer;align-items:center;justify-content:center} .barre-burger span{position:absolute;left:13px;width:18px;height:1.5px;background:currentColor;border-radius:1px;transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .3s ease} .barre-burger span:nth-child(1){transform:translateY(-6px)} .barre-burger span:nth-child(3){transform:translateY(6px)} .barre-burger[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)} .barre-burger[aria-expanded="true"] span:nth-child(2){opacity:0} .barre-burger[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg)} .menu-panneau{display:flex;flex-direction:column;gap:4px;position:fixed;top:84px;left:16px;right:16px;z-index:59;padding:16px 20px 20px;border-radius:5px;box-sizing:border-box;
    opacity:0;transform:translateY(-12px);visibility:hidden;transition:opacity .4s ease,transform .6s cubic-bezier(.16,1,.3,1),visibility 0s linear .6s} .menu-panneau[data-ouvert="1"]{opacity:1;transform:none;visibility:visible;transition:opacity .4s ease,transform .6s cubic-bezier(.16,1,.3,1),visibility 0s} .menu-panneau a.menu-lien{display:block;padding:12px 0;font-family:'Clash Display',sans-serif;font-weight:500;font-size:1.5rem;color:#FFFFFF;border-bottom:1px solid rgba(255,255,255,.08)}}
@media (prefers-reduced-motion: reduce){.barre-burger span,.menu-panneau{transition:none!important}}
@media (max-width:900px){.pj-titre{font-size:clamp(2.25rem,11vw,3.375rem)!important;overflow-wrap:anywhere}}
.carte.carte-attente .carte-survol{display:none!important}
.carte.carte-attente .carte-texte{display:flex!important}
.carte.carte-attente:hover .zoom{transform:none!important;filter:none!important}
.carte.carte-attente .px-img{filter:brightness(.35) grayscale(.4)}
.carte-encours{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;padding:10px 18px;border-radius:4px;font-family:'Figtree',sans-serif;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:#FFFFFF;white-space:nowrap}
@supports (animation-timeline: view()){.px-on .rev-cadre{animation:rev-cadre linear both;animation-timeline:view();animation-range:entry 0% entry 70%} .px-on .rev-texte{animation:rev-texte linear both;animation-timeline:view();animation-range:entry 10% entry 90%}}
@media (prefers-reduced-motion: reduce){.rev-cadre,.rev-texte{animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important;filter:none!important} .px-img{transform:none!important;opacity:1!important;transition:none!important} .lien-trait,.barre,a.btn-primaire{transition:none}}
.yt-lien img{transition:transform 1.2s cubic-bezier(.22,1,.36,1),filter .8s ease}
.yt-lien:hover img,.yt-lien:focus-visible img{transform:scale(1.04);filter:brightness(.8)}
.yt-lecture{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.yt-lien:hover .yt-lecture,.yt-lien:focus-visible .yt-lecture{transform:scale(1.08)}
.yt-etiquette{position:absolute;left:16px;bottom:16px;padding:6px 12px;border-radius:4px;font-family:'Figtree',sans-serif;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}
.pj-figure{margin:0;display:flex;flex-direction:column;gap:12px}
.pj-figure .pj-legende{font-size:1rem;line-height:1.6;color:#A3A3A3}
.pj-suivant .pj-suivant-img{transition:transform 1s cubic-bezier(.16,1,.3,1)}
.pj-suivant:hover .pj-suivant-img,.pj-suivant:focus-visible .pj-suivant-img{transform:scale(1.04)}
.pj-suivant .pj-suivant-titre{transition:color .3s ease}
.pj-suivant:hover .pj-suivant-titre{color:var(--accent,#ff1900)}
@media (max-width:900px){.pj-grille>*{grid-column:1 / -1!important} .pj-titre{font-size:3.375rem!important} .pj-texte{font-size:1rem!important} .pj-citation{font-size:1.5rem!important}}
@media (prefers-reduced-motion: reduce){.pj-suivant .pj-suivant-img,.pj-suivant .pj-suivant-titre{transition:none}}
.media{position:relative;overflow:hidden;background:#1A1A1A}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.iphone{position:relative;width:calc(100% - 16px);max-width:290px;margin:8px auto 0;padding:1.1%;box-sizing:border-box;border-radius:14% / 6.5%;background:#050505;
  box-shadow:0 0 0 1.5px #D3D6DB,0 0 0 3px #8B8F95,0 0 0 4px #2B2D30,inset 0 0 0 1px #1C1C1C,0 32px 64px rgba(0,0,0,.5)}
.iphone-ecran{position:relative;overflow:hidden;aspect-ratio:1320 / 2868;border-radius:13.2% / 6.1%;
  background:linear-gradient(165deg,#2C6BE0 0%,#1446B8 38%,#0A2C82 72%,#061B57 100%)}
.iphone-ecran video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.iphone-ilot{position:absolute;z-index:2;top:1.3%;left:50%;transform:translateX(-50%);width:29%;height:3.9%;border-radius:999px;background:#000}
.iphone-btn{position:absolute;width:3px;background:linear-gradient(90deg,#9A9DA2,#D3D6DB);border-radius:2px}
.iphone-btn.g{left:-6px}
.iphone-btn.d{right:-6px}
.tel-fig{perspective:1400px;perspective-origin:50% 30%}
@keyframes tel-arrive{
  0%{opacity:0;transform:translateY(180px) rotateX(28deg) rotateY(-32deg) rotateZ(7deg)}
  35%{opacity:1}
  100%{opacity:1;transform:none}
}
@keyframes tel-legende{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.tel-fig .iphone{transform-origin:50% 90%;will-change:transform;animation:tel-arrive both cubic-bezier(.2,.75,.25,1);animation-timeline:view();animation-range:entry calc(45% + var(--i,0) * 12%) cover calc(58% + var(--i,0) * 6%)} .tel-fig .pj-legende{animation:tel-legende both ease-out;animation-timeline:view();animation-range:cover calc(40% + var(--i,0) * 6%) cover calc(60% + var(--i,0) * 6%)}}}
.tel-son{position:absolute;z-index:3;right:6%;bottom:3.5%;min-height:36px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(13,13,13,.45);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#FFFFFF;font-family:'Figtree',sans-serif;font-size:.75rem;letter-spacing:.04em;cursor:pointer;transition:background .3s ease}
.tel-son:hover{background:rgba(13,13,13,.65)}
.tel-son:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
@keyframes page-titre{from{clip-path:inset(0 0 100% 0);transform:translateY(48px)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes page-monte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes page-cover{from{clip-path:inset(14% 9% 14% 9%);transform:scale(1.18);filter:brightness(.55)}to{clip-path:inset(0 0 0 0);transform:none;filter:none}}
html.intro-on header#top .pj-titre{animation:page-titre 1.15s cubic-bezier(.16,1,.3,1) .1s both}
html.intro-on header#top .pj-texte{animation:page-monte 1s cubic-bezier(.16,1,.3,1) .3s both}
html.intro-on header#top .pj-infos > *{animation:page-monte .9s cubic-bezier(.16,1,.3,1) both}
html.intro-on header#top .pj-infos > *:nth-child(1){animation-delay:.4s}
html.intro-on header#top .pj-infos > *:nth-child(2){animation-delay:.47s}
html.intro-on header#top .pj-infos > *:nth-child(3){animation-delay:.54s}
html.intro-on header#top .pj-infos > *:nth-child(4){animation-delay:.61s}
html.intro-on header#top .pj-cover > *{animation:page-cover 1.8s cubic-bezier(.16,1,.3,1) .25s backwards}
@media (max-width:900px){.mini-rail{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--marge,16px);margin:0 calc(-1 * var(--marge,16px));padding:0 var(--marge,16px) 12px;scrollbar-width:none} .mini-rail::-webkit-scrollbar{display:none} .mini-rail>.mini-fig{flex:0 0 78%;scroll-snap-align:start;margin:0;animation:none} .mini-rail>.mini-fig:last-child{margin-right:var(--marge,16px)}}
@keyframes mini-monte{from{opacity:0;transform:translateY(90px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.mini-fig{animation:mini-monte both cubic-bezier(.2,.75,.25,1);animation-timeline:view();animation-range:entry calc(25% + var(--i,0) * 14%) entry calc(95% + var(--i,0) * 14%)}}}
.distrib{position:relative;width:calc(100% - 16px);max-width:300px;margin:8px auto 0;aspect-ratio:3253 / 7703}
.distrib-img{position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;pointer-events:none;user-select:none}
.distrib-vitre{position:absolute;z-index:0;left:9.2%;top:18.6%;width:65.8%;height:54.8%;overflow:hidden;background:#050505}
.distrib-vitre video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.distrib-vitre::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,0) 32%)}
.distrib .tel-son{z-index:2;bottom:3%;right:5%}
@keyframes distrib-glisse{
  0%{opacity:0;transform:translateX(calc(var(--dir,1) * 140%)) rotate(calc(var(--dir,1) * 4deg))}
  40%{opacity:1}
  100%{opacity:1;transform:none}
}
.distrib-zone{overflow-x:clip}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.tel-fig .distrib{will-change:transform;animation:distrib-glisse both cubic-bezier(.2,.75,.25,1);animation-timeline:view();animation-range:entry 30% cover 50%}}}
.verre,.fd-ico,.tel-son{background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);
  -webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  border:.3px solid rgba(255,255,255,.14);box-shadow:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.verre,.fd-ico,.tel-son{background:rgba(28,28,28,.92)}}
a.verre:hover,a.verre:focus-visible,.fd-ct:hover .fd-ico,.fd-ct:focus-visible .fd-ico,.tel-son:hover,.tel-son:focus-visible{background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.06) 55%,rgba(255,255,255,.09) 100%);border-color:rgba(255,255,255,.26)}
@media (prefers-reduced-motion: reduce){.rev-cadre,.rev-texte{animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important;filter:none!important} .lien-trait,.barre,a.btn-primaire{transition:none}}
.ph{position:relative;display:flex;align-items:flex-end;justify-content:flex-start;padding:16px;box-sizing:border-box;overflow:hidden;background:#262626}
@media (max-width:900px){.pj-grille>*{grid-column:1 / -1!important} .pj-titre{font-size:3.375rem!important} .pj-texte{font-size:1rem!important}}
.comp{position:relative;overflow:hidden;aspect-ratio:16 / 9;background:#262626;--pos:50%;touch-action:pan-y}
.comp-calque{position:absolute;inset:0}
.comp-calque .ph{width:100%;height:100%}
.comp-calque img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.comp-tag{position:absolute;top:16px;z-index:2;padding:6px 10px;font-family:'Figtree',sans-serif;font-size:.667rem;letter-spacing:.08em;text-transform:uppercase;color:#FFFFFF;background:rgba(13,13,13,.55);pointer-events:none}
.comp-tag-avant{left:16px}
.comp-tag-apres{right:16px}
.comp-apres{clip-path:inset(0 0 0 var(--pos))}
.comp-apres .ph{background:#333333;justify-content:flex-end}
.comp-ligne{position:absolute;top:0;bottom:0;left:var(--pos);width:1px;background:#FFFFFF;pointer-events:none;z-index:2}
.comp-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4}
.comp-poignee{position:absolute;top:50%;left:var(--pos);width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:4px;pointer-events:none;z-index:3}
.comp-range:focus-visible ~ .comp-poignee{outline:2px solid #FFFFFF;outline-offset:4px}
.verre,.fd-ico{background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);
  -webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  border:.3px solid rgba(255,255,255,.14);box-shadow:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.verre,.fd-ico{background:rgba(28,28,28,.92)}}
.lbl{margin:0;font-family:'Figtree',sans-serif;font-size:.667rem;letter-spacing:.08em;text-transform:uppercase;color:#A3A3A3}
@media (prefers-reduced-motion: reduce){.rev-texte{animation:none!important;transform:none!important;opacity:1!important;clip-path:none!important;filter:none!important} .lien-trait,.barre,a.btn-primaire{transition:none}}
.pm-grille{--g:16px;container-type:inline-size;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--g);grid-auto-rows:calc((100cqw - 5 * var(--g)) / 6 * 1.25)}
.pm-tuile{position:relative;margin:0;overflow:hidden;background:#1A1A1A}
.pm-tuile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.pm-grande{grid-column:span 2;grid-row:span 2}
.pm-large{grid-column:span 2}
.pm-xl{grid-column:span 4;grid-row:span 2}
@media (min-width:761px) and (max-width:1100px){.pm-xl{grid-column:span 3}}
@media (max-width:760px){.pm-xl{grid-column:span 2;grid-row:span 1}}
@media (hover:hover){.pm-tuile:hover img{transform:scale(1.04)}}
@media (min-width:761px) and (max-width:1100px){.pm-grille{grid-auto-flow:dense;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:calc((100cqw - 2 * var(--g)) / 3 * 1.25)}}
@media (max-width:760px){.pm-grille{--g:8px;grid-auto-flow:dense;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:calc((100cqw - var(--g)) / 2 * 1.25)} .pm-tete .pm-annee{text-align:left!important}}
@keyframes pm-monte{from{opacity:0;transform:translateY(64px);clip-path:inset(18% 0 0 0)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}}
@keyframes pm-zoom{from{transform:scale(1.18)}to{transform:scale(1)}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.pm-tuile{animation:pm-monte both cubic-bezier(.2,.75,.25,1);animation-timeline:view();animation-range:entry calc(5% + var(--i,0) * 9%) entry calc(60% + var(--i,0) * 9%)} .pm-tuile img{animation:pm-zoom both cubic-bezier(.2,.75,.25,1);animation-timeline:view();animation-range:entry calc(5% + var(--i,0) * 9%) cover 50%}}}
@media (prefers-reduced-motion:reduce){.pm-tuile img{transition:none}}
.btn-rangee{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.reco-pile{display:grid}
.reco-pile>.reco{grid-area:1 / 1;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .6s ease,transform .8s cubic-bezier(.16,1,.3,1),visibility 0s linear .6s}
.reco-pile>.reco[data-actif="1"]{opacity:1;visibility:visible;transform:none;transition:opacity .6s ease .1s,transform .8s cubic-bezier(.16,1,.3,1) .1s,visibility 0s}
.reco-nav{display:flex;align-items:center;gap:16px}
.reco-points{display:flex;gap:8px}
.reco-points span{width:24px;height:2px;background:rgba(255,255,255,.18);transition:background .4s ease}
.reco-points span[data-actif="1"]{background:#FFFFFF}
.reco-fleche{width:44px;height:44px;display:grid;place-items:center;color:#A3A3A3;background:none;border:0;cursor:pointer;padding:0;font:inherit;transition:color .3s ease}
.reco-fleche:hover{color:#FFFFFF}
.reco-fleche:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.reco-pile>.reco{transition:none!important;transform:none!important}}
.ap-portrait{display:flex;flex-direction:column;gap:24px}
@media (max-width:900px){.ap-portrait{position:static!important}}
.ap-liste{font-family:'Figtree',sans-serif;font-size:.8125rem;line-height:1.5;letter-spacing:.02em;text-transform:uppercase;color:#BDBDBD}
.ap-liste{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.ap-lignes{gap:12px}
.ap-lignes li{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.ap-lignes li>span:first-child{display:flex;flex-direction:column;gap:2px;color:#FFFFFF}
.ap-lignes small{font-size:inherit;color:#8A8A8A;text-transform:none;letter-spacing:0}
.ap-date{flex:none;color:#8A8A8A}
.ap-fixe{position:sticky;top:112px;align-self:start}
.ap-flux{display:flex;flex-direction:column}
.ap-chapitre{min-height:min(80vh,880px);display:flex;align-items:flex-start;padding:clamp(48px,6vw,96px) 0;box-sizing:border-box;border-top:1px solid #262626;scroll-margin-top:96px}
.ap-chapitre:first-child{border-top:0;padding-top:0;padding-bottom:clamp(40px,4vw,64px);min-height:0}
.ap-photo{height:clamp(320px,calc(100vh - 220px),880px)}
.ap-deux{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
.ap-deux li:last-child{border-bottom:0}
.ap-deux li:nth-last-child(-n+2){border-bottom:1px solid #262626}
.ap-grille-outils{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.ap-outil{display:flex;align-items:center;gap:16px}
.ap-icone{flex:none;width:56px;height:56px;border-radius:14px;display:grid;place-items:center;color:#FFFFFF}
.ap-logo-img{display:block;height:28px;width:auto;max-width:36px}
.ap-outil-txt{display:flex;flex-direction:column;gap:2px;font-size:1rem;color:#FFFFFF}
.ap-outil-txt small{font-size:.8125rem;color:#8A8A8A}
@media (max-width:560px){.ap-grille-outils{grid-template-columns:minmax(0,1fr)}}
.ap-contenu{width:100%;display:flex;flex-direction:column;gap:32px}
.ap-grand{font-size:1rem;letter-spacing:.01em}
.ap-grand.ap-lignes{gap:0}
.ap-grand.ap-lignes li{padding:18px 0;border-top:1px solid #262626}
.ap-grand.ap-lignes li:last-child{border-bottom:1px solid #262626}
.ap-grand.ap-lignes li>span:first-child{gap:4px}
.ap-index{display:flex;flex-wrap:wrap;gap:8px 20px;padding-top:4px}
.ap-index a{font-family:'Figtree',sans-serif;font-size:.8125rem;letter-spacing:.02em;text-transform:uppercase;color:#8C8C8C;transition:color .4s ease}
.ap-index a:hover,.ap-index a[data-actif="1"]{color:#FFFFFF}
@keyframes ap-entree{from{opacity:0;transform:translateY(64px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes ap-sortie{from{opacity:1;transform:none;filter:none}to{opacity:0;transform:translateY(-48px);filter:blur(6px)}}
@supports (animation-timeline: view()){.px-on .ap-chapitre>.ap-contenu{animation:ap-entree linear both,ap-sortie linear forwards;animation-timeline:view(),view();animation-range:entry 0% entry 45%,exit 10% exit 90%}}
@media (max-width:900px){.ap-fixe{position:static} .ap-index{display:none} .ap-chapitre,.ap-chapitre:first-child{min-height:0} .ap-photo{height:auto;aspect-ratio:4 / 5}}
@media (max-width:560px){.ap-deux{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion: reduce){.ap-chapitre>.ap-contenu{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}}
.ct-lien-gros{font-family:'Clash Display',sans-serif;font-weight:300;font-size:clamp(1.5rem,2.4vw,2.25rem);letter-spacing:-0.02em;line-height:1.2;color:#FFFFFF;align-self:flex-start;overflow-wrap:anywhere}

/* =========================================================
   Adaptations WordPress : base, blocs Gutenberg, composants
   ========================================================= */

/* ---------- Base ---------- */
body{margin:0;background:#0D0D0D;color:#FFFFFF;font-family:'Figtree',sans-serif;font-size:1rem;line-height:1.6;font-feature-settings:"kern" 1;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--gris:#3A3A3A;--accent:#ff1900}
.wp-site-blocks{padding:0!important}
.wp-site-blocks>*,.wp-block-post-content>*{margin-block:0!important}
.wp-block-post-content{position:relative}
a{color:#FFFFFF;text-decoration:none}
a:hover{color:var(--accent,#ff1900)}
a:focus-visible{outline:2px solid #FFFFFF;outline-offset:4px}
h1,h2{text-wrap:balance}
p{text-wrap:pretty}
section{scroll-margin-top:24px}
.wp-block-group{box-sizing:border-box}
:where(.wp-block-post-content) .wp-block-image{margin:0}
:where(.wp-block-post-content) .wp-block-image img{display:block;width:100%;height:auto}
:where(.wp-block-post-content) .wp-block-video{margin:0}
:where(.wp-block-post-content) .wp-block-video video{display:block;width:100%}
.wp-element-caption,.pj-legende{margin:0!important;font-size:1rem;line-height:1.6;color:#A3A3A3;text-align:left}
.pj-figure .wp-element-caption{margin-top:12px}
.tel-fig .pj-legende{text-align:center}
:where(.wp-block-post-content) p{margin:0}

/* Lien souligné qui se dessine, posé sur le lien d’un paragraphe */
.lien-trait-wrap a{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .5s cubic-bezier(.16,1,.3,1),color .25s ease}
.lien-trait-wrap a:hover,.lien-trait-wrap a:focus-visible{background-size:100% 1px}

/* Images qui remplissent leur cadre (portraits) */
.img-remplit img{width:100%!important;height:100%!important;object-fit:cover;display:block}
.img-remplit{overflow:hidden}

/* ---------- Boutons (styles « Plein » et « Verre ») ---------- */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px}
.wp-block-button .wp-block-button__link{font-family:'Clash Display',sans-serif;font-size:1rem;line-height:1.4;padding:12px 24px;border-radius:4px;text-decoration:none;transition:background .3s ease,color .3s ease,border-color .3s ease}
.wp-block-button.is-style-plein .wp-block-button__link{background:#FFFFFF;color:#0D0D0D;font-weight:500;border:0}
.wp-block-button.is-style-plein .wp-block-button__link:hover,.wp-block-button.is-style-plein .wp-block-button__link:focus-visible{background:var(--accent,#ff1900);color:#FFFFFF}
.wp-block-button.is-style-verre .wp-block-button__link{color:#FFFFFF;font-weight:300;background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border:.5px solid rgba(255,255,255,.16)}
.wp-block-button.is-style-verre .wp-block-button__link:hover{border-color:rgba(255,255,255,.32);color:#FFFFFF}
@media (max-width:760px),(pointer:coarse){.wp-block-button .wp-block-button__link{min-height:44px;display:inline-flex;align-items:center}}

/* ---------- Cartes projets ---------- */
.carte{display:flex;flex-direction:column;gap:16px;color:#FFFFFF;position:relative}
.carte .cadre{position:relative;overflow:hidden;aspect-ratio:4 / 3;background:var(--gris,#3A3A3A)}
.carte .cadre>a{position:absolute;inset:0;display:block;color:#FFFFFF}
.carte .cadre .rev-zoom,.carte .cadre .zoom{position:absolute;inset:0}
.carte .cadre img{position:absolute;left:0;top:-8%;width:100%!important;height:116%!important;aspect-ratio:auto!important;object-fit:cover!important;display:block}
.carte-contenir .cadre img{object-fit:contain!important}
.carte-texte{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.titre-projet{font-family:'Clash Display',sans-serif;font-weight:600;font-size:1.5rem;line-height:1.2}
.titre-projet a{color:#FFFFFF}
.carte-disc{font-size:1rem;font-weight:300;color:#A3A3A3;text-align:right}
.carte-survol-titre{font-family:'Clash Display',sans-serif;font-weight:500;font-size:1.5rem;line-height:1.15;letter-spacing:-.022em;color:#FFFFFF}
.carte-survol-disc{font-size:1rem;font-weight:300;color:#FFFFFF;text-align:right;max-width:22ch}
.carte.carte-attente .cadre img{filter:brightness(.35) grayscale(.4)}
.carte.carte-attente .carte-survol{display:none!important}
.carte-encours{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;padding:10px 18px;border-radius:4px;font-family:'Figtree',sans-serif;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:#FFFFFF;white-space:nowrap;background:linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 55%,rgba(255,255,255,.05) 100%);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:.5px solid rgba(255,255,255,.16)}

/* ---------- Pages projet : en-tête, grille, figures ---------- */
.pj-cover{position:relative;overflow:hidden;background:#262626}
.pj-cover img{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover}
html.intro-on header#top .pj-cover img{animation:page-cover 1.8s cubic-bezier(.16,1,.3,1) .25s backwards}
.pj-temoignage .pj-auteur .wp-block-image img{width:56px;height:56px;border-radius:50%;object-fit:cover;filter:grayscale(1)}
.yt a{position:relative;display:block}

/* ---------- Projet suivant ---------- */
.pj-suivant{cursor:pointer}
.pj-suivant-texte{grid-column:1 / span 7;display:flex;flex-direction:column;gap:16px}
.pj-suivant-label{font-family:'Figtree',sans-serif;font-size:.667rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent,#ff1900)}
.pj-suivant .pj-suivant-titre{font-family:'Clash Display',sans-serif;font-weight:500;font-size:7.594rem;line-height:1;letter-spacing:-.03em}
.pj-suivant .pj-suivant-titre a{color:inherit}
.pj-suivant figure.pj-suivant-img{grid-column:8 / span 5;position:relative;overflow:hidden;aspect-ratio:4 / 3;background:#262626}
.pj-suivant figure.pj-suivant-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.pj-suivant:hover figure.pj-suivant-img img{transform:scale(1.04)}
.pj-suivant:hover .pj-suivant-titre{color:var(--accent,#ff1900)}

/* ---------- Barre de navigation : liens actifs ---------- */
.barre-liens a[aria-current="page"]{font-weight:500}

/* ---------- Éditeur : rien n’est caché pendant l’édition ---------- */
.editor-styles-wrapper .rev-cadre,.editor-styles-wrapper .rev-texte,.editor-styles-wrapper .carte,.editor-styles-wrapper .carte .cadre,.editor-styles-wrapper .fd-anim{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}

/* Sigles des outils (À propos) : remplaçables par les logos */
.ap-sigle{font-family:'Figtree',sans-serif;font-weight:600;font-size:1.125rem;color:#FFFFFF}
.ap-icone>span:not(.ap-sigle){font-family:'Figtree',sans-serif;font-weight:600;font-size:1.125rem}
/* Légendes en deux lignes (titre puis description) */
.pj-figure .wp-element-caption>span{display:block}
.pj-figure .wp-element-caption>span:first-child{color:#FFFFFF}
/* Portrait de l'Accueil : la photo remplit le cadre */
.apropos-colle{position:relative}
.apropos-colle img{position:absolute;inset:0}

/* ---------- Pages simples (mentions légales, confidentialité, 404) ---------- */
.page-simple{padding:clamp(140px,12vw,200px) var(--marge,40px) clamp(72px,8vw,128px);box-sizing:border-box;max-width:calc(820px + 2 * var(--marge,40px))}
.page-simple h1{margin:0 0 48px;font-family:'Clash Display',sans-serif;font-weight:500;font-size:clamp(2.25rem,7vw,5rem);line-height:1;letter-spacing:-.03em}
.page-simple h2{margin:48px 0 12px;font-family:'Clash Display',sans-serif;font-weight:500;font-size:1.5rem;line-height:1.2;letter-spacing:-.015em}
.page-simple p,.page-simple li{color:#D9D9D9;font-size:1rem;line-height:1.6}
.page-simple p+p{margin-top:12px}
.page-simple a{text-decoration:underline;text-underline-offset:3px}


/* ===== Styles des blocs (anciens styles en ligne du canvas) ===== */
html body .s-1443e2{position: absolute; inset: 0; overflow: hidden; z-index: 0}
html body .s-c57fae{position: absolute; left: 0; right: 0; bottom: 0; height: min(45vh, 480px); z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(13,13,13,0) 0%, rgba(13,13,13,0.55) 55%, #0D0D0D 100%)}
html body .s-0a31bc{margin: 0; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 16px 32px; width: 100%; font-weight: 400; font-size: 1.5rem; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.15}
html body .s-c03c28{display: block; flex: none}
html body .s-0b1d5d{font-family: 'Clash Display', sans-serif; color: #EDEDED; white-space: nowrap; font-weight: 400; font-style: normal; font-size: 18px}
html body .s-9e4445{position: relative; z-index: 1; flex-grow: 1; display: flex; align-items: center; justify-content: center; mix-blend-mode: difference}
html body .s-06395e{margin: 0; display: flex; align-items: center; gap: 10px; font-family: 'Clash Display', sans-serif; font-size: 0.667rem; letter-spacing: 0.04em; text-transform: uppercase; color: #FFFFFF}
html body .s-7ab08e{display: flex; flex-direction: column; align-items: center; gap: 11px; padding-top: 0px; font-family: "Figtree"; font-size: 0.667rem; letter-spacing: 0.1em; text-transform: lowercase; color: #A3A3A3}
html body .s-b26cae{position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 0px; text-align: center; padding-bottom: 8px; padding-top: 44px}
html body .s-c1636c{position: relative; overflow: hidden; min-height: min(100vh, 1080px); display: flex; flex-direction: column; box-sizing: border-box; padding: 24px var(--marge, 40px)}
html body .s-082eaf{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF}
html body .s-3e7f6a{display: flex; flex-direction: column; gap: 14px}
html body .s-819ebd{display: flex; justify-content: space-between; align-items: baseline; gap: 24px; flex-wrap: wrap}
html body .s-98a939{display: flex; justify-content: flex-end}
html body .s-2ccb30{padding: clamp(140px, 14vw, 240px) var(--marge, 40px) clamp(40px, 4vw, 64px); box-sizing: border-box; display: flex; flex-direction: column; gap: 40px}
html body .s-001a02{grid-column: 1 / span 5; margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF}
html body .s-c36d2f{row-gap: 24px; align-items: start; padding-top: 24px; border-top: 1px solid #262626}
html body .s-00778d{grid-column: 1 / span 5}
html body .s-703d66{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.2; letter-spacing: -0.01em; color: #EDEDED}
html body .s-c60705{width: 100%; font-size: 1rem}
html body .s-833869{font-size: 1rem}
html body .s-906ae7{margin: 0; font-size: 1rem; color: #D9D9D9}
html body .s-1346fd{padding: 14px 0; border-top: 1px solid #262626; font-size: 20px}
html body .s-ee02b4{margin: 0; padding: 0; list-style: none; font-size: 1.5rem; line-height: 1.4; color: #D9D9D9}
html body .s-32b211{grid-column: 7 / span 6}
html body .s-60496a{display: flex; flex-direction: column; gap: 8px}
html body .s-7d1ce0{display: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding-top: 24px; border-top: 1px solid #262626}
html body .s-eb2b00{display: flex; gap: 12px; flex-wrap: wrap}
html body .s-bae0df{margin: 0; font-size: 0.875rem; font-weight: 300; color: #A3A3A3}
html body .s-0d7ef3{display: flex; flex-direction: column; gap: 32px}
html body .s-0dc6f3{row-gap: 48px; align-items: start}
html body .s-9e6dad{row-gap: 24px; align-items: start}
html body .s-4960f7{padding: clamp(80px, 8vw, 144px) var(--marge, 40px) clamp(72px, 8vw, 128px); box-sizing: border-box; display: flex; flex-direction: column; gap: clamp(64px, 6vw, 112px)}
html body .s-d06169{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF; white-space: pre-line}
html body .s-c51646{font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; letter-spacing: -0.02em; color: #FFFFFF; margin: 8px 0}
html body .s-fab814{margin: 0; font-size: 1rem; font-weight: 300; color: #A3A3A3}
html body .s-d7fef9{display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; padding-top: 8px}
html body .s-a4624c{padding: clamp(72px, 8vw, 128px) var(--marge, 40px); box-sizing: border-box; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px}
html body .s-7097e7{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 7.594rem; line-height: 1; letter-spacing: -0.03em; color: #FFFFFF}
html body .s-a8720a{margin: 0; max-width: 52ch; font-size: 1rem; font-weight: 300; line-height: 1.6; color: #A3A3A3}
html body .s-9926c0{display: flex; flex-direction: column; gap: 20px}
html body .s-fabcfd{padding: clamp(104px, 7vw, 128px) var(--marge, 40px) clamp(80px, 8vw, 128px); box-sizing: border-box; display: flex; flex-direction: column; gap: clamp(40px, 4vw, 64px)}
html body .s-678677{grid-column: 1 / -1; margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 7.594rem; line-height: 1; letter-spacing: -0.03em; color: #FFFFFF}
html body .s-2107f9{row-gap: 16px}
html body .s-8cd0f6{padding: clamp(140px, 12vw, 200px) var(--marge, 40px) 0; box-sizing: border-box; display: flex; flex-direction: column; gap: 48px}
html body .s-fbb7af{margin: 0 0 24px; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.2; letter-spacing: -0.01em; color: #EDEDED}
html body .s-68a554{margin: 0; font-size: 1rem; line-height: 1.6; color: #D9D9D9}
html body .s-4cd82e{gap: 24px}
html body .s-9c59ad{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.25; letter-spacing: -0.01em; color: #EDEDED}
html body .s-5b7c5d{font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 1.125rem; color: #FFFFFF}
html body .s-86a1ef{font-size: 0.9375rem; color: #A3A3A3}
html body .s-80ebd5{display: flex; flex-direction: column; gap: 2px}
html body .s-e58941{display: flex; align-items: center; gap: 16px}
html body .s-e5b69a{margin: 0; display: flex; flex-direction: column; gap: 32px}
html body .s-3084e1{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF; padding-top: clamp(24px, 3vw, 48px)}
html body .s-b49ffb{row-gap: 40px; align-items: start}
html body .s-725af5{padding: clamp(48px, 5vw, 80px) var(--marge, 40px) 0; box-sizing: border-box}
html body .s-223d18{padding-top: 8px}
html body .s-bfb37c{padding: clamp(96px, 10vw, 160px) var(--marge, 40px); box-sizing: border-box; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 24px}
html body .s-e6ed08{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: clamp(2.75rem, 7vw, 6.5rem); line-height: 1; letter-spacing: -0.03em; color: #FFFFFF; text-wrap: balance}
html body .s-12ce5f{margin: 0; max-width: 46ch; font-size: 1.125rem; font-weight: 300; line-height: 1.6; color: #A3A3A3}
html body .s-ac7ba9{align-self: center; margin-top: 12px}
html body .s-a16348{min-height: 100vh; padding: clamp(120px, 12vw, 180px) var(--marge, 40px) clamp(80px, 8vw, 128px); box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 28px}
html body .s-af3ed7{grid-column: 1 / span 7; margin: 8px 0 0; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.2; letter-spacing: -0.01em; color: #EDEDED}
html body .s-3d98d6{margin: 0; font-family: 'Figtree', sans-serif; font-size: 0.667rem; letter-spacing: 0.08em; text-transform: uppercase; color: #A3A3A3}
html body .s-7c15a1{margin: 0; font-size: 1rem; line-height: 1.6; color: #FFFFFF}
html body .s-594ca9{grid-column: 1 / span 3; display: flex; flex-direction: column; gap: 8px}
html body .s-ec346f{grid-column: 4 / span 3; display: flex; flex-direction: column; gap: 8px}
html body .s-9b7feb{grid-column: 7 / span 3; display: flex; flex-direction: column; gap: 8px}
html body .s-504316{grid-column: 10 / span 3; display: flex; flex-direction: column; gap: 8px}
html body .s-407525{row-gap: 24px; padding-top: 24px; border-top: 1px solid #262626}
html body .s-6d9f15{grid-column: 7 / span 6; display: flex; flex-direction: column; gap: 24px}
html body .s-e42caa{padding: clamp(80px, 8vw, 144px) var(--marge, 40px) 0; box-sizing: border-box}
html body .s-32442f{margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 3.375rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF}
html body .s-b15ecf{grid-column: 1 / span 10; margin: 0}
html body .s-f59092{font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 1rem; color: #FFFFFF}
html body .s-83ce23{font-size: 1rem; color: #A3A3A3}
html body .s-ad67f1{display: flex; flex-direction: column}
html body .s-0e91e3{grid-column: 1 / span 6; display: flex; align-items: center; gap: 16px}
html body .s-43879b{margin: 0; row-gap: 32px}
html body .s-047f14{grid-column: 7 / span 6; margin: 0; font-size: 1rem; line-height: 1.6; color: #D9D9D9}
html body .s-29701c{grid-column: 1 / span 6}
html body .s-bddd0b{grid-column: span 4; --i: 0}
html body .s-4a79ab{grid-column: span 4; --i: 1}
html body .s-135837{grid-column: span 4; --i: 2}
html body .s-f7b635{gap: 48px 24px; align-items: start}
html body .s-aea82d{padding: clamp(80px, 8vw, 144px) var(--marge, 40px) 0; box-sizing: border-box; display: flex; flex-direction: column; gap: 48px}
html body .s-be70d9{width: 100%}
html body .s-feb4ae{margin: 8px 0 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 1.5rem; line-height: 1.15; color: #FFFFFF}
html body .s-6066a2{margin: 0; font-size: 1rem; line-height: 1.6; color: #A3A3A3}
html body .s-5c35a3{grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 16px}
html body .s-4e305b{grid-column: 7 / span 6; display: flex; flex-direction: column; gap: 16px}
html body .s-69d78d{grid-column: 1 / span 4; --i: 0}
html body .s-6e99ba{grid-column: 5 / span 4; --i: 1}
html body .s-f3544b{grid-column: 9 / span 4; --i: 2}
html body .s-5ba9b5{gap: 24px; align-items: start}
html body .s-493b1c{grid-column: 1 / -1}
html body .s-68e24b{grid-column: 3 / span 4; --i: 0; --dir: -1}
html body .s-fcbfec{grid-column: 7 / span 4; --i: 1; --dir: 1}
html body .s-5a3306{color: #FFFFFF}
html body .s-c605c5{font-size: 1rem; line-height: 1.6; color: #A3A3A3}
html body .s-aca1a1{grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 48px}
html body .s-fdb99c{grid-column: 8 / span 5; --i: 0}
html body .s-7d1e31{gap: 48px 24px; align-items: center}
html body .s-6dce5b{row-gap: 24px; align-items: end; padding-top: 32px; border-top: 1px solid #262626; color: #FFFFFF}
html body .s-b8a5b1{padding: clamp(96px, 10vw, 176px) var(--marge, 40px) clamp(64px, 6vw, 112px); box-sizing: border-box}
html body .s-936a2a{aspect-ratio: 3 / 4}
html body .s-b106b5{aspect-ratio: 4 / 3}
html body .s-a91615{grid-column: 1 / span 8; margin: 8px 0 0; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.2; letter-spacing: -0.01em; color: #EDEDED}
html body .s-98fa0c{grid-column: 1 / span 4; display: flex; flex-direction: column; gap: 8px}
html body .s-caf654{grid-column: 5 / span 4; display: flex; flex-direction: column; gap: 8px}
html body .s-65d42f{grid-column: 9 / span 4; display: flex; flex-direction: column; gap: 8px}
html body .s-0503c7{grid-column: 7 / span 6; display: flex; flex-direction: column; gap: 20px}
html body .s-8a65bf{grid-column: 1 / span 7}
html body .s-188c8c{grid-column: 8 / span 5}
html body .s-eea960{grid-column: 1 / span 4}
html body .s-927f80{grid-column: 5 / span 4}
html body .s-bc7c17{grid-column: 9 / span 4}
html body .s-689624{grid-column: 1 / span 8; margin: 0; font-family: 'Clash Display', sans-serif; font-weight: 500; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #FFFFFF}
html body .s-62e69b{grid-column: 9 / span 4; margin: 0; text-align: right; font-family: 'Clash Display', sans-serif; font-weight: 300; font-size: 2.25rem; line-height: 1.15; letter-spacing: -0.022em; color: #5C5C5C}
html body .s-6cb99a{row-gap: 8px; align-items: end; padding-top: 24px; border-top: 1px solid #262626}
html body .s-2b5e46{--i: 0}
html body .s-9218c6{--i: 1}
html body .s-e01f12{--i: 2}
html body .s-d3f99e{--i: 3}
html body .s-d77e4a{--i: 4}
html body .s-cd55af{--i: 5}
html body .s-dc2a8d{padding: clamp(80px, 8vw, 144px) var(--marge, 40px) 0; box-sizing: border-box; display: flex; flex-direction: column; gap: 32px}
html body .s-0a28d4{grid-column: 1 / span 12}
html body .s-bbaaec{padding: clamp(96px, 10vw, 176px) var(--marge, 40px) clamp(72px, 8vw, 128px); box-sizing: border-box}
html body .i-ad583f img{position: absolute; left: 0; top: -6%; width: 100%; height: 112%; object-fit: cover; display: block}
html body .i-1f6b76 img{width: 56px; height: 56px; border-radius: 50%; object-fit: cover; display: block; filter: grayscale(1)}
html body .i-d4bf81 img{width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none}

/* Adresse e-mail en grand : réduite sur mobile pour ne pas déborder */
@media (max-width: 600px){
	html body .lien-trait-wrap.s-c51646{font-size:clamp(1.125rem,6.4vw,2.25rem);overflow-wrap:anywhere}
}

/* Politique de cookies (Complianz) : encadrés contenus dans la largeur de l’écran */
.cmplz-document .cmplz-service-description,.cmplz-document .cmplz-sharing-data,.cmplz-document details{box-sizing:border-box;max-width:100%}

/* Politique de cookies (Complianz) : tableau des cookies lisible sur fond sombre */
.cmplz-document .cookies-per-purpose,
.cmplz-document .cookies-per-purpose > div{background-color:transparent!important;color:inherit}
.cmplz-document .cookies-per-purpose{border:1px solid rgba(255,255,255,.14)!important}
.cmplz-document .cookies-per-purpose > div:nth-child(4n+2),
.cmplz-document .cookies-per-purpose > div:nth-child(4n+3){background-color:rgba(255,255,255,.04)!important}
.cmplz-document .cookies-per-purpose h4,.cmplz-document .cookies-per-purpose h5{color:#fff}

/* Image d’accueil : le cadre occupe tout le hero (l’animation de parallaxe en fait le repère de l’image) */
header#top .px-hero{position:absolute;inset:0;margin:0;width:100%;height:100%}
header#top .px-hero img{object-position:49% center}

/* Couvertures de projet en mode « media » (image en absolu) : le cadre garde le format 16:9 */
.pj-cover.media{aspect-ratio:16/9;height:auto}

/* Trait « scroller pour découvrir » centré sous le texte */
.defiler-trait{margin:11px auto 0}

/* Mobile : hauteur plein écran réservée au hero de l’accueil (les autres pages réutilisent header#top) */
@media (max-width:600px){body:not(.home) header#top{min-height:0!important}}

/* Textes d’accroche en mobile/tablette : gardent leur rôle de titre au lieu d’être ramenés à 16 px */
@media (max-width:900px){
	html body .pj-texte.s-703d66,
	html body .pj-texte.s-fbb7af,
	html body .pj-texte.s-af3ed7,
	html body .pj-texte.s-a91615{font-size:clamp(1.375rem,6vw,2.25rem)!important;line-height:1.2}
}
/* Boutons centrés sur mobile */
@media (max-width:600px){
	.wp-site-blocks .wp-block-buttons{justify-content:center!important}
}