/* Page « Le photobooth en bref » : même direction artistique que le site (chambre noire, planche contact).
   L'animation de la borne tourne en boucle sur 10 s ; elle s'arrête sur l'image finale si l'appareil demande moins d'animations. */

/* ---------- Ouverture ---------- */
.ipb-hero.hero{height:auto}
.ipb-hero{position:relative;background:var(--night);color:var(--on-night);overflow:hidden;padding-top:calc(96px + env(safe-area-inset-top,0px));padding-bottom:clamp(48px,7vw,104px)}
.ipb-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 70% at 78% 30%,rgba(138,58,44,.28),transparent 70%);pointer-events:none}
.ipb-hero__in{position:relative;display:grid;gap:clamp(40px,6vw,88px);align-items:center}
@media (min-width:900px){.ipb-hero__in{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.ipb-hero .crumbs{color:var(--on-night-2)}
.ipb-hero h1{font-family:var(--f-body);font-weight:400;font-size:15px;letter-spacing:.02em;color:var(--on-night-2);margin-top:18px}
.ipb-hero__title{font-family:var(--f-display);font-size:clamp(52px,8.6vw,148px);line-height:.88;letter-spacing:-.035em;margin:18px 0 0}
.ipb-hero__title span{display:block;animation:rise 1.1s var(--ease) .1s both}
.ipb-hero__title em{display:block;padding-left:clamp(0px,6vw,110px);animation:rise 1.1s var(--ease) .24s both}
.ipb-hero__sub{max-width:46ch;color:var(--on-night-2);margin:clamp(20px,2.6vw,32px) 0 clamp(24px,3vw,36px)}

/* ---------- La borne animée (d'après la vraie borne : façade en pin clair, coins noirs, deux lumières, objectif, écran, pied) ---------- */
.pbx{--w:min(250px,60vw);position:relative;justify-self:center;width:calc(var(--w) * 1.5);display:grid;justify-items:center;padding:4px 0 10px}
.pbx__borne{position:relative;z-index:1;width:100%;aspect-ratio:.78;border-radius:3px;
  background-color:#E9D1A2;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='320'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.09 0.006' numOctaves='3' seed='11'/%3E%3CfeColorMatrix values='0 0 0 0 0.6  0 0 0 0 0.4  0 0 0 0 0.18  2 0 0 0 -0.86'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E"),linear-gradient(100deg,#F1DDB3 0%,#E6CB98 38%,#EDD6A9 62%,#E2C48F 100%);
  background-size:100% 100%,cover;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),inset -2px -2px 0 rgba(120,84,40,.18),0 26px 50px rgba(0,0,0,.5)}
.pbx__cadre{position:relative;z-index:2;width:var(--w)}
.pbx__caisson{position:absolute;top:5%;bottom:6%;left:14%;right:-5%;background:linear-gradient(90deg,#141312,#2a2826);border-radius:2px;box-shadow:0 0 0 1px rgba(238,232,221,.06)}
.pbx__coin{position:absolute;width:12%;aspect-ratio:1;background:radial-gradient(circle at 34% 34%,#8d8a85 0 5%,#2a2826 6% 9%,transparent 10%),#121110}
.pbx__coin--hg{top:-1%;left:-1%;clip-path:polygon(0 0,100% 0,0 100%);border-top-left-radius:6px}
.pbx__coin--hd{top:-1%;right:-1%;clip-path:polygon(0 0,100% 0,100% 100%);border-top-right-radius:6px;background:radial-gradient(circle at 66% 34%,#8d8a85 0 5%,#2a2826 6% 9%,transparent 10%),#121110}
.pbx__coin--bg{bottom:-1%;left:-1%;clip-path:polygon(0 0,0 100%,100% 100%);border-bottom-left-radius:6px;background:radial-gradient(circle at 34% 66%,#8d8a85 0 5%,#2a2826 6% 9%,transparent 10%),#121110}
.pbx__coin--bd{bottom:-1%;right:-1%;clip-path:polygon(100% 0,100% 100%,0 100%);border-bottom-right-radius:6px;background:radial-gradient(circle at 66% 66%,#8d8a85 0 5%,#2a2826 6% 9%,transparent 10%),#121110}
.pbx__lum{position:absolute;top:13%;width:21%;aspect-ratio:1;border-radius:50%;box-sizing:border-box;border:calc(var(--w) * .028) solid #4A3A31;
  background:radial-gradient(circle at 45% 40%,#FFFFFF 0,#F1EFEA 55%,#DCD8D1 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.5),0 0 0 0 rgba(255,246,230,0);animation:pbxLum 10s linear infinite}
.pbx__lum--g{left:9%}.pbx__lum--d{right:9%}
@keyframes pbxLum{0%,29%{box-shadow:0 0 0 1px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.5),0 0 0 0 rgba(255,246,230,0)}30%{box-shadow:0 0 0 1px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.5),0 0 34px 16px rgba(255,246,230,.95)}38%,100%{box-shadow:0 0 0 1px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.5),0 0 0 0 rgba(255,246,230,0)}}
.pbx__fente{position:absolute;top:16%;left:39%;width:22%;height:8.5%;border-radius:999px;background:linear-gradient(180deg,#bdb8b1,#e3dfd8 55%,#a9a39b);box-shadow:0 0 0 3px #F3E2BE,inset 0 2px 4px rgba(0,0,0,.35)}
.pbx__objectif{position:absolute;top:30%;left:44%;width:12%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 36%,#4c5560 0 10%,#14171a 26%,#050505 60%);box-shadow:0 0 0 calc(var(--w) * .012) #1a1918,0 0 0 calc(var(--w) * .022) #D9BE8C,inset 0 0 0 2px #2b2a28}
.pbx__ecran{position:absolute;left:10%;right:10%;top:47%;bottom:14%;background:#0b0a09;display:grid;place-items:center;overflow:hidden;box-shadow:0 0 0 calc(var(--w) * .014) #F3E2BE,0 0 0 calc(var(--w) * .02) rgba(150,110,60,.35),inset 0 0 0 1px rgba(238,232,221,.06)}
.pbx__vue{position:absolute;inset:0;opacity:0;animation:pbxVue 10s linear infinite}
.pbx__vue .pbx__img{animation:pbxDev 10s linear infinite}
@keyframes pbxVue{0%,31%{opacity:0}33%,86%{opacity:1}92%,100%{opacity:0}}
.pbx__n,.pbx__smile{position:relative;grid-area:1/1;font-family:var(--f-display);color:var(--on-night);opacity:0}
.pbx__n{font-size:calc(var(--w) * .26);line-height:1}
.pbx__smile{font-style:italic;font-size:calc(var(--w) * .11)}
.pbx__n--3{animation:pbxN 10s linear infinite 0s}
.pbx__n--2{animation:pbxN 10s linear infinite .9s}
.pbx__n--1{animation:pbxN 10s linear infinite 1.8s}
.pbx__smile{animation:pbxSmile 10s linear infinite}
@keyframes pbxN{0%{opacity:0;transform:scale(1.25)}2%{opacity:1;transform:scale(1)}8%{opacity:1}9.5%{opacity:0;transform:scale(.92)}100%{opacity:0}}
@keyframes pbxSmile{0%,27%{opacity:0}28.5%,30.5%{opacity:1}32%,100%{opacity:0}}
.pbx__mat{position:relative;z-index:1;width:calc(var(--w) * .05);height:calc(var(--w) * .42);background:linear-gradient(90deg,#0d0c0b,#2b2927 50%,#0d0c0b);border-radius:0 0 3px 3px}
.pbx__mat::after{content:"";position:absolute;left:50%;bottom:0;width:calc(var(--w) * .5);height:calc(var(--w) * .05);transform:translateX(-50%);background:radial-gradient(50% 100% at 50% 100%,rgba(0,0,0,.55),transparent)}
.pbx__img{width:100%;height:100%}
.pbx__img img{width:100%;height:100%;object-fit:cover}
@keyframes pbxDev{0%,33%{filter:brightness(2.2) saturate(0) blur(2px)}52%,100%{filter:none}}
.pbx__tirage{position:absolute;z-index:3;right:0;bottom:6%;width:calc(var(--w) * .36);background:#F4EFE6;padding:5px 5px 0;display:grid;gap:4px;box-shadow:0 16px 34px rgba(0,0,0,.45);transform:translateY(30%) rotate(5deg);opacity:0;animation:pbxTirage 10s var(--ease) infinite}
@keyframes pbxTirage{0%,48%{transform:translateY(30%) rotate(10deg);opacity:0}58%{transform:translateY(0) rotate(5deg);opacity:1}88%{transform:translateY(0) rotate(5deg);opacity:1}95%,100%{transform:translateY(8%) rotate(5deg);opacity:0}}
.pbx__f{aspect-ratio:4/3;overflow:hidden;background:#1a1816}
.pbx__f .pbx__img{animation:pbxDevT 10s linear infinite}
.pbx__f--2 .pbx__img{animation-delay:.35s}.pbx__f--3 .pbx__img{animation-delay:.7s}
@keyframes pbxDevT{0%,52%{filter:brightness(2.2) saturate(0) blur(2px)}68%,100%{filter:none}}
.pbx__pied{margin:0;padding:6px 2px 7px;display:grid;justify-items:center;gap:0;color:#2a2623}
.pbx__pied b{font-family:var(--f-display);font-weight:400;font-size:calc(var(--w) * .056);line-height:1.1}
.pbx__pied .mono{font-size:7px;letter-spacing:.12em;text-transform:uppercase;color:#6A6358}
.pbx__flash{position:absolute;inset:-60vh -60vw;z-index:4;background:#fffaf2;opacity:0;pointer-events:none;animation:pbxFlash 10s linear infinite}
@keyframes pbxFlash{0%,29.6%{opacity:0}30%{opacity:.38}33%,100%{opacity:0}}

/* ---------- Les bornes, en vrai ---------- */
.ipb-borne{background:var(--paper)}
.ipb-borne__photo{aspect-ratio:4/5;overflow:hidden;border-radius:2px}
.ipb-borne__photo img{width:100%;height:100%;object-fit:cover}
.ipb-borne__txt{display:grid;gap:18px;align-content:center}
.ipb-borne__txt .mono{color:var(--safelight);text-transform:uppercase;letter-spacing:.08em;margin:0}
.ipb-borne__txt p:last-child{max-width:44ch;color:var(--ink-2);margin:0}

/* ---------- Sections ---------- */
.ipb-sec .head p{max-width:48ch}
.ipb-exp{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:rgba(238,232,221,.18);border:1px solid rgba(238,232,221,.18)}
@media (min-width:700px){.ipb-exp{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ipb-exp{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ipb-exp li{position:relative;background:var(--night);padding:clamp(24px,3vw,40px);display:grid;align-content:start;gap:10px;min-height:220px}
.ipb-exp .mono{color:var(--edge)}
.ipb-exp h3{font-size:clamp(28px,2.8vw,40px);line-height:1.02}
.ipb-exp p{color:var(--on-night-2);margin:0;max-width:40ch}
.ipb-tag--lien{text-decoration:none;transition:background-color .3s,color .3s}
.ipb-tag--lien:hover{background:var(--on-night);color:var(--ink)}
.ipb-tag{justify-self:start;margin-top:6px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;border:1px solid rgba(238,232,221,.4);border-radius:99px;padding:3px 10px;color:var(--on-night)}

.ipb-k{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:0 0 10px}
.ipb-tarifs{display:grid;gap:clamp(40px,6vw,96px)}
@media (min-width:900px){.ipb-tarifs{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.ipb-big{font-family:var(--f-display);font-size:clamp(64px,9vw,128px);line-height:.9;letter-spacing:-.03em;margin:0 0 clamp(32px,4vw,52px)}
.ipb-big small{display:block;font-family:var(--f-body);font-size:15px;letter-spacing:0;color:var(--mute);margin-top:10px}
.ipb-barres{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ipb-barres li{display:grid;grid-template-columns:100px minmax(0,1fr) 84px;gap:14px;align-items:center}
.ipb-barres__n{font-family:var(--f-mono);font-size:13px}
.ipb-barres__b{height:14px;background:var(--paper-2);border-radius:99px;overflow:hidden}
.ipb-barres__b i{display:block;height:100%;width:var(--w);background:var(--safelight);border-radius:99px;transform-origin:left;transform:scaleX(1);transition:transform 1.2s var(--ease) calc(var(--i) * .12s)}
.js .ipb-barres li:not(.is-in) .ipb-barres__b i{transform:scaleX(0)}
.ipb-barres b{font-family:var(--f-display);font-weight:400;font-size:30px;text-align:right;line-height:1}
.ipb-petit{font-size:14px;margin-top:16px}
.ipb-lignes{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ipb-lignes li{display:flex;justify-content:space-between;gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line)}
.ipb-lignes small{display:block;color:var(--mute);font-size:14px;margin-top:2px}
.ipb-lignes b{font-family:var(--f-display);font-weight:400;font-size:26px;white-space:nowrap;text-align:right}

.ipb-regle{font-family:var(--f-display);font-size:clamp(30px,3.6vw,52px);line-height:1.08;margin:24px 0 18px;max-width:18ch}
.ipb-regle .mono{display:block;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--safelight);margin-bottom:10px}
.ipb-regle b{font-weight:400;font-style:italic}
.ipb-calc{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:clamp(22px,3vw,40px);display:grid;gap:18px}
.ipb-calc__in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center}
.ipb-calc input[type=range]{width:100%;accent-color:var(--safelight);height:28px}
.ipb-calc output{font-family:var(--f-display);font-size:56px;line-height:1;min-width:3ch;text-align:right}
.ipb-calc__res{display:grid;gap:14px;border-top:1px solid var(--line);padding-top:18px}
.ipb-calc__res p{margin:0;display:grid;gap:2px}
.ipb-calc__res .mono{color:var(--mute);text-transform:uppercase;letter-spacing:.06em}
.ipb-calc__res b{font-family:var(--f-display);font-weight:400;font-size:clamp(30px,3.4vw,44px);line-height:1.05}
.ipb-calc__res .ipb-petit{margin:0}

.ipb-savoir{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ipb-savoir li{padding:20px 0 20px 34px;border-bottom:1px solid var(--line);position:relative;color:var(--ink-2)}
.ipb-savoir li::before{content:"";position:absolute;left:4px;top:30px;width:12px;height:12px;border-radius:50%;background:var(--safelight)}
.ipb-savoir b{color:var(--ink);font-weight:600}

.ipb-fin__title{font-family:var(--f-display);font-size:clamp(52px,8vw,136px);line-height:.9;letter-spacing:-.035em;margin:0 0 clamp(28px,4vw,48px)}
.ipb-fin__title span{display:block}.ipb-fin__title em{display:block;padding-left:clamp(0px,6vw,110px)}
.ipb-fin__row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.ipb-partager{background:transparent;border:0;color:var(--on-night-2);font:inherit;font-size:15px;text-decoration:underline;text-underline-offset:4px;cursor:pointer;padding:8px 0}
.ipb-partager:hover{color:var(--on-night)}
.ipb-partager__msg{color:var(--on-night-2)}

/* Apparition au défilement */
.rv{transition:opacity .9s var(--ease) calc(var(--i,0) * .08s),transform .9s var(--ease) calc(var(--i,0) * .08s)}
.js .rv:not(.is-in){opacity:0;transform:translateY(24px)}

@media (max-width:899px){
  .pbx{order:-1;--w:min(210px,54vw)}
  .ipb-hero__in{gap:28px}
}
@media (max-width:560px){
  .ipb-barres li{grid-template-columns:78px minmax(0,1fr) 68px;gap:10px}
  .ipb-barres b{font-size:24px}
  .ipb-calc output{font-size:44px}
}
@media (prefers-reduced-motion:reduce){
  .pbx *,.pbx{animation:none!important}
  .pbx__n,.pbx__flash{opacity:0}
  .pbx__smile{opacity:0}
  .pbx__vue{opacity:1}
  .pbx__tirage{opacity:1;transform:rotate(5deg)}
  .pbx__img{filter:none}
  .rv,.ipb-barres__b i{transition:none}
  .js .rv:not(.is-in){opacity:1;transform:none}
  .js .ipb-barres li:not(.is-in) .ipb-barres__b i{transform:none}
}
