/* ==========================================================================
   Kairos Portfolio — réalisations
   Reprend les jetons du thème Kairos Digital quand il est actif (sinon valeurs de secours).
   ========================================================================== */

.kpf{
	--k-nuit:var(--nuit,#0B1F3A); --k-abysse:var(--abysse,#06142A); --k-nuit2:var(--nuit-2,#12305A);
	--k-or:var(--or,#C9A24B); --k-or-p:var(--or-pale,#E9D6A0);
	--k-papier:var(--papier,#FBFAF7); --k-brume:var(--brume,#E9EEF5);
	--k-encre:var(--encre,#0F1B2E); --k-gris:var(--gris,#56627A); --k-ligne:var(--ligne,rgba(11,31,58,.12));
	--k-fd:var(--f-display,"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif);
	--k-ft:var(--f-text,"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif);
	--k-ease:cubic-bezier(.16,1,.3,1);
	--kpf-c:var(--k-or);
	font-family:var(--k-ft); color:var(--k-encre);
}
.kpf *,.kpf *::before,.kpf *::after{box-sizing:border-box}
.kpf img{max-width:100%;height:auto;display:block}
.kpf a{color:inherit;text-decoration:none}
.kpf h1,.kpf h2,.kpf h3{font-family:var(--k-fd);color:var(--k-nuit);margin:0;letter-spacing:-.025em;line-height:1.04}
.kpf p,.kpf dl,.kpf dd,.kpf figure,.kpf blockquote{margin:0}
.kpf ul,.kpf ol{margin:0;padding:0;list-style:none}
.kpf-wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 clamp(18px,4vw,40px)}
.kpf-narrow{max-width:780px}
.kpf-pt{color:var(--k-or)}
.kpf-i{width:18px;height:18px;flex:0 0 auto}
.kpf-section{padding:clamp(72px,9vw,128px) 0}

/* ---------- Boutons ---------- */
.kpf-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font-weight:600;font-size:16px;transition:transform .5s var(--k-ease),box-shadow .5s var(--k-ease),background .3s,color .3s,border-color .3s;will-change:transform}
.kpf-btn .kpf-i{transition:transform .5s var(--k-ease)}
.kpf-btn:hover .kpf-i{transform:translateX(4px)}
.kpf-btn-or{background:var(--k-or);color:var(--k-abysse)!important;box-shadow:0 14px 34px -12px rgba(201,162,75,.65)}
.kpf-btn-or:hover{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(201,162,75,.8)}
.kpf-btn-ghost{border:1px solid rgba(233,214,160,.35);color:#fff!important}
.kpf-btn-ghost:hover{border-color:var(--k-or);background:rgba(201,162,75,.08)}
.kpf-btn-line{border:1px solid var(--k-ligne);color:var(--k-nuit)!important;background:#fff}
.kpf-btn-line:hover{border-color:var(--k-nuit);transform:translateY(-2px)}
.kpf-btn:focus-visible,.kpf-filters button:focus-visible,.kpf-card-link:focus-visible,.kpf-gal-item:focus-visible{outline:2px solid var(--k-or);outline-offset:4px}

/* ---------- En-tête sombre ---------- */
.kpf-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--k-abysse);color:#C9D3E2;padding:calc(88px + clamp(48px,7vw,96px)) 0 clamp(64px,8vw,112px)}
.kpf-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(70% 90% at 88% 0%,#173a6b 0%,rgba(23,58,107,0) 62%),radial-gradient(50% 60% at 0% 100%,rgba(201,162,75,.10) 0%,rgba(201,162,75,0) 70%)}
.kpf-hero-grid{position:absolute;inset:0;z-index:-1;opacity:.5;background-image:linear-gradient(rgba(233,214,160,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(233,214,160,.07) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 20%,transparent 75%)}
.kpf-hero-orb{position:absolute;z-index:-1;right:-140px;top:-160px;width:560px;height:560px;border-radius:50%;border:1px solid rgba(233,214,160,.16);animation:kpf-spin 60s linear infinite}
.kpf-hero-orb::after{content:"";position:absolute;top:58px;left:92px;width:12px;height:12px;border-radius:50%;background:var(--kpf-c);box-shadow:0 0 0 8px rgba(201,162,75,.12),0 0 30px var(--kpf-c)}
@keyframes kpf-spin{to{transform:rotate(360deg)}}
.kpf-crumbs{display:flex;flex-wrap:wrap;gap:10px;font-size:14px;color:#8C97AA;margin-bottom:clamp(28px,4vw,48px)}
.kpf-crumbs a:hover{color:var(--k-or-p)}
.kpf-crumbs b{color:#DCE3EE;font-weight:500}
.kpf-kicker{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--k-or)}
.kpf-kicker::before{content:"";width:28px;height:1px;background:currentColor}
.kpf-hero .kpf-kicker{color:var(--k-or-p)}
.kpf-h1{color:#fff!important;font-size:clamp(44px,7vw,104px);line-height:.95!important;letter-spacing:-.045em!important;max-width:15ch;margin:20px 0 0!important;font-weight:700}
.kpf-h1 .kpf-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.kpf-h1 .kpf-w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--k-ease);transition-delay:calc(var(--i) * 55ms)}
.kpf-h1.is-in .kpf-w>span{transform:none}
.kpf-lead{font-size:clamp(18px,1.6vw,21px);line-height:1.6;max-width:58ch;color:#B9C4D6;margin-top:24px!important}
.kpf-counters{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,72px);margin-top:clamp(40px,6vw,72px)!important;padding-top:28px;border-top:1px solid rgba(233,214,160,.16)}
.kpf-counters div{display:flex;flex-direction:column-reverse;gap:6px}
.kpf-counters dd{font-family:var(--k-fd);font-size:clamp(40px,5vw,64px);font-weight:700;color:#fff;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.kpf-counters dt{font-size:14px;color:#8C97AA}
.kpf-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.kpf-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;margin-top:clamp(40px,6vw,64px)!important;border-top:1px solid rgba(233,214,160,.16)}
.kpf-facts div{padding:20px 20px 0 0}
.kpf-facts div+div{padding-left:20px;border-left:1px solid rgba(233,214,160,.12)}
.kpf-facts dt{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8C97AA}
.kpf-facts dd{margin-top:6px!important;color:#fff;font-weight:500;font-size:17px}
.kpf-hero-single{padding-bottom:clamp(140px,16vw,220px)}

/* ---------- Étiquettes ---------- */
.kpf-tags{display:flex;flex-wrap:wrap;gap:6px}
.kpf-tags span,.kpf-tags a{font-size:12.5px;font-weight:600;padding:5px 11px;border-radius:999px;background:rgba(11,31,58,.06);color:var(--k-nuit)}
.kpf-tags .is-soft{background:transparent;box-shadow:inset 0 0 0 1px var(--k-ligne);color:var(--k-gris);font-weight:500}
.kpf-tags-hero{margin-bottom:-6px}
.kpf-tags-hero a{background:rgba(233,214,160,.1);color:var(--k-or-p);box-shadow:inset 0 0 0 1px rgba(233,214,160,.2);transition:background .3s}
.kpf-tags-hero a:hover{background:rgba(233,214,160,.2)}

/* ---------- Filtres ---------- */
.kpf-filters{position:relative;display:flex;flex-wrap:wrap;gap:4px;padding:5px;margin:0 0 clamp(32px,4vw,48px);background:#fff;border-radius:999px;box-shadow:0 0 0 1px var(--k-ligne),0 10px 30px -18px rgba(6,20,42,.25);width:max-content;max-width:100%}
.kpf-filters button{position:relative;z-index:1;border:0;background:none;font:inherit;font-size:15px;font-weight:500;color:var(--k-gris);padding:10px 18px;border-radius:999px;cursor:pointer;transition:color .3s}
.kpf-filters button sup{font-size:11px;opacity:.6;margin-left:2px}
.kpf-filters button:hover{color:var(--k-nuit)}
.kpf-filters button.is-on{color:#fff}
.kpf-filters-ink{position:absolute;z-index:0;top:5px;left:0;height:calc(100% - 10px);width:0;border-radius:999px;background:var(--k-nuit);transition:transform .55s var(--k-ease),width .55s var(--k-ease)}

/* ---------- Grille et cartes ---------- */
.kpf-grid{display:grid;gap:clamp(20px,2.4vw,32px);grid-template-columns:repeat(3,minmax(0,1fr))}
.kpf-cols-1{grid-template-columns:minmax(0,1fr)}
.kpf-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kpf-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpf-card{transition:opacity .45s,transform .6s var(--k-ease)}
.kpf-card.is-featured{grid-column:span 2}
.kpf-cols-1 .kpf-card.is-featured{grid-column:auto}
.kpf-card.is-out{opacity:0;transform:scale(.96)}
.kpf-card[hidden]{display:none}
.kpf-card-link{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:22px;padding:10px;box-shadow:0 0 0 1px var(--k-ligne),0 1px 2px rgba(6,20,42,.04);transition:box-shadow .6s var(--k-ease),transform .6s var(--k-ease)}
.kpf-card-link:hover{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(11,31,58,.14),0 34px 60px -30px rgba(6,20,42,.42)}
.kpf-shot{position:relative;border-radius:14px;overflow:hidden;background:var(--k-brume);transform-style:preserve-3d;transition:transform .5s var(--k-ease)}
.kpf-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#F1F3F7;border-bottom:1px solid rgba(11,31,58,.07)}
.kpf-bar i{width:9px;height:9px;border-radius:50%;background:#D5DAE3}
.kpf-bar i:first-child{background:var(--kpf-c)}
.kpf-bar span{margin-left:10px;flex:1;min-width:0;height:20px;line-height:20px;padding:0 12px;border-radius:999px;background:#fff;font-size:11.5px;color:#8C97AA;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpf-shot-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.kpf-card.is-featured .kpf-shot-img{aspect-ratio:16/8.4}
.kpf-shot-img img{width:100%;height:100%;object-fit:cover;object-position:50% 0;transition:object-position 5s cubic-bezier(.45,0,.2,1),transform 1s var(--k-ease)}
.kpf-card-link:hover .kpf-shot-img img{object-position:50% 100%}
.kpf-ph{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--k-fd);font-size:72px;font-weight:700;color:rgba(11,31,58,.18);background:linear-gradient(135deg,var(--k-brume),#fff)}
.kpf-mini-phone{position:absolute;right:4%;bottom:7%;width:19%;aspect-ratio:9/19;border-radius:18px;padding:5px;background:#0B1220;box-shadow:0 24px 40px -16px rgba(6,20,42,.6);overflow:hidden;transition:transform .8s var(--k-ease)}
.kpf-mini-phone img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:13px}
.kpf-card-link:hover .kpf-mini-phone{transform:translateY(-6%) rotate(-2deg)}
.kpf-card-body{display:flex;flex-direction:column;gap:12px;padding:20px 14px 14px;flex:1}
.kpf-card-title{font-size:clamp(21px,1.8vw,25px);font-weight:700}
.kpf-card.is-featured .kpf-card-title{font-size:clamp(26px,2.6vw,36px)}
.kpf-card-body p{color:var(--k-gris);font-size:15.5px;line-height:1.55}
.kpf-more{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:6px;font-weight:600;font-size:15px;color:var(--k-nuit)}
.kpf-more .kpf-i{transition:transform .5s var(--k-ease)}
.kpf-card-link:hover .kpf-more .kpf-i{transform:translateX(5px)}
.kpf-more::after{content:"";height:1px;flex:0 0 0;background:var(--k-or);transition:flex-basis .6s var(--k-ease)}
.kpf-card-link:hover .kpf-more::after{flex-basis:32px}
.kpf-empty,.kpf-none{color:var(--k-gris);font-size:18px;padding:40px 0;text-align:center}
.kpf-pagination{margin-top:48px}
.kpf-pagination .nav-links{display:flex;gap:8px;justify-content:center}
.kpf-pagination .page-numbers{padding:10px 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--k-ligne)}
.kpf-pagination .current{background:var(--k-nuit);color:#fff}
.kpf-embed{padding:8px 0}
.kpf-embed-title{font-size:clamp(32px,4vw,52px);margin-bottom:32px!important}
.kpf-embed-more{margin-top:40px!important;text-align:center}

/* ---------- Page projet : scène ordinateur + téléphone ---------- */
.kpf-stage{position:relative;margin-top:calc(-1 * clamp(110px,13vw,180px));padding-bottom:clamp(40px,6vw,80px)}
.kpf-stage-inner{position:relative}
.kpf-stage.has-phone .kpf-stage-inner{padding-right:clamp(0px,9vw,130px)}
.kpf-browser{position:relative;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(11,31,58,.08),0 60px 120px -50px rgba(6,20,42,.55),0 30px 60px -40px rgba(6,20,42,.35)}
.kpf-browser .kpf-bar{height:42px;padding:0 18px}
.kpf-browser .kpf-bar i{width:11px;height:11px}
.kpf-browser .kpf-bar span{max-width:420px;margin:0 auto;text-align:center;font-size:12.5px;height:24px;line-height:24px}
.kpf-screen{height:clamp(320px,50vw,640px);overflow:hidden;position:relative}
.kpf-screen img{width:100%;height:auto;transition:transform 9s cubic-bezier(.45,0,.2,1)}
.kpf-screen:hover img,.kpf-screen:focus img{transition-duration:7s}
.kpf-screen::after{content:"Survolez pour faire défiler";position:absolute;left:16px;bottom:16px;font-size:12px;font-weight:600;color:#fff;background:rgba(6,20,42,.72);padding:7px 12px;border-radius:999px;backdrop-filter:blur(6px);transition:opacity .4s}
.kpf-screen.is-scrolled::after{opacity:0}
.kpf-phone{position:absolute;right:0;bottom:-6%;width:clamp(150px,19vw,250px);aspect-ratio:9/19.2;border-radius:clamp(26px,3vw,40px);padding:clamp(7px,.8vw,10px);background:linear-gradient(145deg,#1b2333,#05080f);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.08),0 50px 80px -30px rgba(6,20,42,.7)}
.kpf-notch{position:absolute;z-index:2;top:clamp(12px,1.4vw,16px);left:50%;transform:translateX(-50%);width:30%;height:clamp(14px,1.6vw,20px);border-radius:999px;background:#05080f}
.kpf-phone-screen{width:100%;height:100%;border-radius:clamp(20px,2.4vw,31px);overflow:hidden;background:#fff}
.kpf-phone-screen img{width:100%;height:auto;transition:transform 8s cubic-bezier(.45,0,.2,1)}

/* ---------- Chiffres clés ---------- */
.kpf-figures{padding:clamp(24px,4vw,48px) 0 0}
.kpf-figs{display:grid;gap:0;border-radius:28px;overflow:hidden;background:var(--k-nuit);box-shadow:0 30px 60px -36px rgba(6,20,42,.6)}
.kpf-figs-1{grid-template-columns:1fr}.kpf-figs-2{grid-template-columns:repeat(2,1fr)}.kpf-figs-3{grid-template-columns:repeat(3,1fr)}
.kpf-figs div{position:relative;padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:10px}
.kpf-figs div+div{border-left:1px solid rgba(233,214,160,.12)}
.kpf-figs dd{font-family:var(--k-fd);font-size:clamp(44px,6vw,80px);font-weight:700;line-height:.95;letter-spacing:-.045em;color:#fff;font-variant-numeric:tabular-nums}
.kpf-figs dd::first-letter{color:var(--kpf-c)}
.kpf-figs dt{color:#B9C4D6;font-size:16px;max-width:22ch}

/* ---------- Récit ---------- */
.kpf-h2{font-size:clamp(34px,4.6vw,60px);font-weight:700;margin-top:16px!important;max-width:18ch}
.kpf-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);margin-top:clamp(40px,5vw,64px)!important;counter-reset:s}
.kpf-steps>li{position:relative;background:#fff;border-radius:22px;padding:clamp(24px,2.6vw,36px);box-shadow:0 0 0 1px var(--k-ligne);overflow:hidden}
.kpf-steps>li::before{content:"";position:absolute;left:0;top:0;height:3px;width:0;background:var(--kpf-c);transition:width 1.2s var(--k-ease) .3s}
.kpf-steps>li.is-in::before{width:100%}
.kpf-steps>li.is-result{background:var(--k-nuit);color:#DCE3EE;box-shadow:none}
.kpf-steps>li.is-result h3{color:#fff}
.kpf-step-n{display:block;font-family:var(--k-fd);font-size:15px;font-weight:600;color:var(--k-or);margin-bottom:28px;letter-spacing:.06em}
.kpf-steps h3{font-size:26px;margin-bottom:14px!important}
.kpf-steps p{color:var(--k-gris);line-height:1.65}
.kpf-checks{display:grid;gap:12px}
.kpf-checks li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.kpf-checks .kpf-i{width:22px;height:22px;padding:4px;border-radius:50%;background:rgba(201,162,75,.18);color:var(--k-or-p);margin-top:1px}
.kpf-features{margin-top:clamp(40px,5vw,56px);display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.kpf-features h3{font-size:18px;font-family:var(--k-ft);font-weight:600;letter-spacing:0}
.kpf-features ul{display:flex;flex-wrap:wrap;gap:8px}
.kpf-features li{padding:10px 16px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--k-ligne);font-size:15px;font-weight:500;transition:transform .4s var(--k-ease),box-shadow .4s}
.kpf-features li:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--kpf-c),0 10px 20px -12px rgba(6,20,42,.3)}

/* ---------- Galerie ---------- */
.kpf-gallery-wrap{background:var(--k-brume)}
.kpf-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:clamp(170px,19vw,270px);grid-auto-flow:dense;gap:clamp(12px,1.6vw,20px);margin-top:clamp(36px,4vw,56px)}
.kpf-gal-item{position:relative;display:block;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--k-ligne)}
.kpf-gal-item:nth-child(5n+1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.kpf-gal-item img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 1.2s var(--k-ease)}
.kpf-gal-item:hover img{transform:scale(1.04)}
.kpf-zoom{position:absolute;right:14px;bottom:14px;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:rgba(6,20,42,.75);color:#fff;opacity:0;transform:scale(.8);transition:opacity .35s,transform .5s var(--k-ease)}
.kpf-gal-item:hover .kpf-zoom,.kpf-gal-item:focus-visible .kpf-zoom{opacity:1;transform:none}

/* ---------- Avis client ---------- */
.kpf-quote-wrap{padding:clamp(72px,9vw,128px) 0}
.kpf-quote{position:relative;max-width:980px;margin:0 auto;text-align:center}
.kpf-quote-mark{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--kpf-c);color:#fff;margin-bottom:28px}
.kpf-quote-mark .kpf-i{width:28px;height:28px}
.kpf-quote blockquote p{font-family:var(--k-fd);font-size:clamp(26px,3.4vw,44px);line-height:1.2;letter-spacing:-.02em;color:var(--k-nuit);font-weight:500}
.kpf-quote figcaption{margin-top:28px;display:flex;flex-direction:column;gap:4px}
.kpf-quote figcaption strong{font-size:17px}
.kpf-quote figcaption span{color:var(--k-gris)}

/* ---------- Texte libre ---------- */
.kpf-prose{font-size:18px;line-height:1.75;color:var(--k-encre)}
.kpf-prose>*+*{margin-top:1.1em}
.kpf-prose h2{font-size:32px;margin-top:1.6em}
.kpf-prose h3{font-size:24px;margin-top:1.4em}
.kpf-prose ul{list-style:disc;padding-left:1.2em}
.kpf-prose a{color:var(--k-nuit);text-decoration:underline;text-decoration-color:var(--k-or);text-underline-offset:3px}

/* ---------- Autres projets ---------- */
.kpf-more-projects{padding-top:0}
.kpf-row-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(32px,4vw,48px)}
.kpf-row-head .kpf-h2{margin:0!important}

/* ---------- Bandeau final (sans le thème) ---------- */
.kpf-cta{background:var(--k-abysse);color:#B9C4D6;padding:clamp(80px,10vw,140px) 0;text-align:center}
.kpf-cta h2{color:#fff;font-size:clamp(34px,5vw,64px);max-width:18ch;margin:0 auto 20px}
.kpf-cta p{max-width:52ch;margin:0 auto 32px}

.kpf-admin-note{position:relative;z-index:5;background:#FFF4D6;color:#5c4400;padding:12px clamp(18px,4vw,40px);text-align:center;font-size:15px;margin-top:88px}
.kpf-admin-note a{text-decoration:underline}

/* ---------- Visionneuse ---------- */
.kpf-lb{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;background:rgba(4,12,26,.94);opacity:0;transition:opacity .35s;padding:60px 70px}
.kpf-lb.is-open{opacity:1}
.kpf-lb img{max-width:100%;max-height:calc(100vh - 120px);width:auto;border-radius:12px;box-shadow:0 40px 80px -30px rgba(0,0,0,.6);transform:scale(.97);transition:transform .5s var(--k-ease)}
.kpf-lb.is-open img{transform:none}
.kpf-lb button{position:absolute;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .3s}
.kpf-lb button:hover{background:rgba(255,255,255,.16)}
.kpf-lb button .kpf-i{width:22px;height:22px}
.kpf-lb-x{top:18px;right:18px}.kpf-lb-p{left:14px;top:50%;margin-top:-26px}.kpf-lb-n{right:14px;top:50%;margin-top:-26px}
.kpf-lb-c{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:#8C97AA;font-size:14px}

/* ---------- Apparition au défilement ---------- */
.kpf-js [data-kpf-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s var(--k-ease),transform 1.1s var(--k-ease);transition-delay:var(--d,0ms)}
.kpf-js [data-kpf-reveal="scale"]{transform:translateY(40px) scale(.97)}
.kpf-js [data-kpf-reveal].is-in{opacity:1;transform:none}
.kpf-js .kpf-card.is-in.is-out{opacity:0;transform:scale(.96)}

/* ---------- Écrans moyens et petits ---------- */
@media (max-width:1024px){
	.kpf-grid,.kpf-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
	.kpf-steps{grid-template-columns:1fr}
	.kpf-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
	.kpf-grid,.kpf-cols-2,.kpf-cols-3,.kpf-cols-4{grid-template-columns:minmax(0,1fr)}
	.kpf-card.is-featured{grid-column:auto}
	.kpf-card.is-featured .kpf-shot-img{aspect-ratio:16/10}
	.kpf-filters{border-radius:18px;width:100%}
	.kpf-filters button{padding:9px 14px;font-size:14px}
	.kpf-figs-2,.kpf-figs-3{grid-template-columns:1fr}
	.kpf-figs div+div{border-left:0;border-top:1px solid rgba(233,214,160,.12)}
	.kpf-facts{grid-template-columns:1fr 1fr}
	.kpf-facts div+div{border-left:0;padding-left:0}
	.kpf-facts div{padding-right:12px}
	.kpf-stage.has-phone .kpf-stage-inner{padding-right:0;padding-bottom:28%}
	.kpf-phone{right:4%;bottom:-4%;width:34%}
	.kpf-screen{height:auto;aspect-ratio:4/5}
	.kpf-screen::after{content:"Touchez pour faire défiler"}
	.kpf-gallery{grid-template-columns:1fr;grid-auto-rows:auto}
	.kpf-gal-item{aspect-ratio:4/3}
	.kpf-gal-item:nth-child(5n+1){grid-column:auto;grid-row:auto;aspect-ratio:4/3}
	.kpf-lb{padding:60px 10px}
	.kpf-lb-p,.kpf-lb-n{top:auto;bottom:14px;margin:0}
}
@media (prefers-reduced-motion:reduce){
	.kpf *,.kpf *::before,.kpf *::after{animation:none!important;transition-duration:.01ms!important;transition-delay:0ms!important}
	.kpf-js [data-kpf-reveal]{opacity:1;transform:none}
	.kpf-h1 .kpf-w>span{transform:none}
}