/* Photographe de France — blocs innovants v2 + responsive (27/10/2026) */
.pf-block{padding:clamp(56px,9vw,120px) 0;position:relative}
.pf-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.pf-round{width:52px;height:52px;border-radius:50%;border:2px solid #14110f;background:#fff;font:700 1.2rem/1 'DM Sans',sans-serif;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.pf-round:hover{background:#14110f;color:#ffc247;transform:scale(1.06)}
.pf-chips{display:flex;gap:8px;overflow-x:auto;padding:22px 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pf-chips::-webkit-scrollbar{display:none}
.pf-chip{flex:none;border:2px solid #14110f;background:transparent;border-radius:99px;padding:.55rem 1rem;font:700 .9rem 'DM Sans',sans-serif;cursor:pointer;transition:all .2s;white-space:nowrap}
.pf-chip.is-on,.pf-chip:hover{background:#14110f;color:#ffc247}

/* ---------- Planche contact ---------- */
.pf-planche{background:#14110f;color:#f5efe6;overflow:hidden}
.pf-planche .nf-h2,.pf-planche h2{color:#fff}
.pf-planche .nf-lead{color:rgba(245,239,230,.72)}
.pf-planche .pf-chip{border-color:rgba(245,239,230,.35);color:#f5efe6}
.pf-planche .pf-chip.is-on,.pf-planche .pf-chip:hover{background:#ff5b1f;border-color:#ff5b1f;color:#14110f}
.pf-planche .pf-round{background:transparent;border-color:rgba(245,239,230,.4);color:#f5efe6}
.pf-film{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:46px max(16px,calc((100vw - 1200px)/2)) 40px;position:relative;cursor:grab;scrollbar-width:none;
  background:linear-gradient(#211b17,#211b17) padding-box;}
.pf-film::-webkit-scrollbar{display:none}
.pf-film.is-drag{cursor:grabbing;scroll-snap-type:none}
.pf-film::before,.pf-film::after{content:"";position:sticky;flex:none}
.pf-frame{flex:0 0 clamp(200px,24vw,290px);scroll-snap-align:center;margin:0;position:relative;transition:opacity .35s,transform .35s,flex-basis .35s}
.pf-frame.is-off{opacity:.12;transform:scale(.92);filter:grayscale(1)}
.pf-frame-img{aspect-ratio:4/5;overflow:hidden;border-radius:4px;background:#2a221d;box-shadow:0 0 0 6px #2a221d}
.pf-frame-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.22,.75,.32,1)}
.pf-frame:hover .pf-frame-img img{transform:scale(1.12)}
.pf-frame-num{position:absolute;top:-30px;left:2px;font:700 .8rem 'DM Sans',monospace;color:#ffc247;letter-spacing:.1em}
.pf-frame figcaption{margin-top:12px;font-size:.88rem;color:rgba(245,239,230,.75)}
.pf-circle{position:absolute;inset:-14px -12px 30px -12px;width:calc(100% + 24px);height:calc(100% - 4px);pointer-events:none;overflow:visible}
.pf-circle path{fill:none;stroke:#ff3b2f;stroke-width:5;stroke-linecap:round;stroke-dasharray:820;stroke-dashoffset:820;transition:stroke-dashoffset .7s ease}
.pf-frame:hover .pf-circle path,.pf-frame.is-pick .pf-circle path{stroke-dashoffset:0}
.pf-film-holes{display:none}
.pf-planche .pf-film{border-top:16px solid #14110f;border-bottom:16px solid #14110f;
  background-image:repeating-linear-gradient(90deg,transparent 0 14px,#f5efe6 14px 26px),repeating-linear-gradient(90deg,transparent 0 14px,#f5efe6 14px 26px);
  background-size:100% 8px,100% 8px;background-position:0 12px,0 calc(100% - 12px);background-repeat:no-repeat;background-color:#211b17}
.pf-planche-cta{display:flex;justify-content:center;margin-top:28px}

/* ---------- Simulateur de budget ---------- */
.pf-budget{background:linear-gradient(180deg,#fbf3ea,#ffeadc)}
.pf-budget-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.9fr);gap:clamp(24px,5vw,64px);align-items:start}
.pf-field{border:0;padding:0;margin:26px 0 0}
.pf-field legend{font:800 1.05rem 'Bricolage Grotesque',sans-serif;margin-bottom:12px;color:#14110f}
.pf-field output{color:#e0480f}
.pf-seg{display:flex;flex-wrap:wrap;gap:8px}
.pf-seg label,.pf-opts label{cursor:pointer}
.pf-seg input,.pf-opts input{position:absolute;opacity:0;pointer-events:none}
.pf-seg span{display:inline-block;padding:.6rem 1rem;border-radius:99px;border:2px solid #14110f;font-weight:700;font-size:.92rem;transition:all .2s;background:#fff}
.pf-seg input:checked+span{background:#14110f;color:#ffc247;transform:translateY(-2px);box-shadow:0 6px 0 #ff5b1f}
.pf-seg input:focus-visible+span,.pf-opts input:focus-visible+span{outline:3px solid #2b59c3;outline-offset:2px}
.pf-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pf-opts span{display:flex;align-items:center;gap:10px;padding:.75rem .9rem;border-radius:14px;background:#fff;border:2px solid rgba(20,17,15,.12);font-weight:600;transition:all .2s}
.pf-opts span::before{content:"";flex:none;width:20px;height:20px;border-radius:6px;border:2px solid #14110f;background:#fff;transition:all .2s}
.pf-opts input:checked+span{border-color:#ff5b1f}
.pf-opts input:checked+span::before{background:#ff5b1f;box-shadow:inset 0 0 0 3px #fff}
.pf-select{display:flex;flex-direction:column;gap:6px;margin-top:14px;font-weight:700}
.pf-select select{padding:.75rem 1rem;border-radius:14px;border:2px solid rgba(20,17,15,.15);font:600 1rem 'DM Sans',sans-serif;background:#fff}
input[type=range][data-budget-range]{width:100%;accent-color:#ff5b1f;height:28px}
.pf-range-scale{display:flex;justify-content:space-between;font-size:.8rem;color:#6b5d52}
.pf-budget-result{position:sticky;top:100px}
.pf-ticket{background:#14110f;color:#f5efe6;border-radius:28px;padding:30px 26px;position:relative;overflow:hidden;
  -webkit-mask:radial-gradient(circle 14px at 0 62%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 14px at 100% 62%,transparent 98%,#000) right/51% 100% no-repeat;
          mask:radial-gradient(circle 14px at 0 62%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 14px at 100% 62%,transparent 98%,#000) right/51% 100% no-repeat}
.pf-ticket::before{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,91,31,.55),transparent)}
.pf-ticket-label{display:block;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:#ffc247;font-weight:700}
.pf-ticket-price{display:block;font:800 clamp(2rem,4.4vw,3rem)/1.05 'Bricolage Grotesque',sans-serif;margin:10px 0 18px;color:#fff;letter-spacing:-.03em}
.pf-gauge{height:12px;border-radius:99px;background:rgba(245,239,230,.12);overflow:hidden;margin-bottom:20px}
.pf-gauge span{display:block;height:100%;width:30%;border-radius:99px;background:linear-gradient(90deg,#ffc247,#ff5b1f);transition:width .6s cubic-bezier(.22,.75,.32,1),margin-left .6s cubic-bezier(.22,.75,.32,1)}
.pf-ticket-lines{list-style:none;margin:0 0 22px;padding:16px 0 0;border-top:2px dashed rgba(245,239,230,.2);display:grid;gap:8px;font-size:.92rem}
.pf-ticket-lines li{display:flex;justify-content:space-between;gap:12px;color:rgba(245,239,230,.82)}
.pf-ticket-lines li b{color:#fff;white-space:nowrap}
.pf-ticket small{display:block;margin-top:16px;color:rgba(245,239,230,.55);font-size:.78rem;line-height:1.5}
.pf-ticket .nf-btn{width:100%;justify-content:center}

/* ---------- Avant / après ---------- */
.pf-ab-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.pf-ab{position:relative;aspect-ratio:4/5;border-radius:28px;overflow:hidden;box-shadow:0 40px 70px -40px rgba(20,17,15,.6);user-select:none;touch-action:pan-y}
.pf-ab-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.pf-ab-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.pf-ab-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 0 1px rgba(20,17,15,.2)}
.pf-ab-handle span{position:absolute;top:50%;left:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#ff5b1f;color:#14110f;display:grid;place-items:center;font-size:1.4rem;font-weight:800;box-shadow:0 10px 24px rgba(20,17,15,.35)}
.pf-ab-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.pf-ab-tag{position:absolute;top:16px;padding:.4rem .8rem;border-radius:99px;font:800 .75rem 'DM Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;background:rgba(20,17,15,.75);color:#f5efe6;pointer-events:none}
.pf-ab-tag--l{left:16px}.pf-ab-tag--r{right:16px;background:#ff5b1f;color:#14110f}
.pf-ab-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.pf-ab-list li{padding-left:34px;position:relative;line-height:1.55}
.pf-ab-list li::before{content:"✦";position:absolute;left:0;top:-2px;color:#ff5b1f;font-size:1.3rem}

/* ---------- Réglages au défilement ---------- */
.pf-reglages{height:320vh;position:relative;background:#14110f}
.pf-reglages-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;grid-template-columns:1.2fr .8fr}
.pf-reglages-photo{grid-column:1/-1;grid-row:1;background-size:cover;background-position:center;filter:blur(var(--blur,10px)) brightness(var(--bright,.4)) saturate(var(--sat,.3));transform:scale(1.08);transition:filter .1s linear}
.pf-viewfinder{grid-column:1;grid-row:1;position:relative;margin:7vh 4vw;pointer-events:none}
.pf-vf-c{position:absolute;width:46px;height:46px;border:3px solid rgba(255,255,255,.9)}
.pf-vf-tl{top:0;left:0;border-right:0;border-bottom:0}.pf-vf-tr{top:0;right:0;border-left:0;border-bottom:0}
.pf-vf-bl{bottom:0;left:0;border-right:0;border-top:0}.pf-vf-br{bottom:0;right:0;border-left:0;border-top:0}
.pf-vf-focus{position:absolute;left:50%;top:44%;width:110px;height:84px;margin:-42px 0 0 -55px;border:2px solid var(--focus,#fff);border-radius:6px;transition:border-color .3s;box-shadow:0 0 0 9999px rgba(0,0,0,0)}
.pf-vf-rec{position:absolute;top:14px;right:62px;color:#ff3b2f;font:800 .85rem 'DM Sans',sans-serif;letter-spacing:.1em;animation:pf-rec 1.2s infinite}
.pf-vf-bar{position:absolute;left:0;right:0;bottom:-2px;display:flex;gap:clamp(12px,3vw,36px);align-items:center;justify-content:center;flex-wrap:wrap;padding:14px;color:#fff;font:600 clamp(.9rem,1.6vw,1.15rem) 'DM Sans',monospace;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.pf-vf-bar b{font-weight:800;color:#ffc247}
.pf-vf-meter{width:120px;height:6px;border-radius:99px;background:rgba(255,255,255,.25);overflow:hidden}
.pf-vf-meter i{display:block;height:100%;width:var(--meter,10%);background:linear-gradient(90deg,#ff3b2f,#ffc247,#7ee08a)}
.pf-reglages-copy{grid-column:2;grid-row:1;align-self:center;padding:0 5vw 0 0;color:#f5efe6;position:relative;z-index:2}
.pf-reglages-copy .nf-h2{color:#fff}
.pf-rg-steps{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:10px;counter-reset:rg}
.pf-rg-steps li{counter-increment:rg;padding:16px 18px 16px 58px;border-radius:16px;background:rgba(20,17,15,.55);backdrop-filter:blur(6px);position:relative;opacity:.38;transform:translateX(18px);transition:opacity .4s,transform .4s,background .4s}
.pf-rg-steps li::before{content:counter(rg);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;border:2px solid #ffc247;color:#ffc247;display:grid;place-items:center;font-weight:800;font-size:.85rem}
.pf-rg-steps li.is-on{opacity:1;transform:none;background:rgba(255,91,31,.88)}
.pf-rg-steps li.is-on::before{background:#14110f;border-color:#14110f}
.pf-rg-steps strong{display:block;font:800 1.08rem 'Bricolage Grotesque',sans-serif;color:#fff}
.pf-rg-steps span{font-size:.92rem;color:rgba(255,255,255,.88)}

/* ---------- Pile de polaroïds (avis) ---------- */
.pf-avis-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,72px);align-items:center}
.pf-pile{position:relative;height:440px;touch-action:pan-y}
.pf-polaroid{position:absolute;left:50%;top:50%;width:min(360px,86%);margin-left:max(-180px,-43%);transform:translateY(-50%) rotate(var(--r,0deg));background:#fff;padding:18px 18px 22px;border-radius:4px;
  box-shadow:0 22px 40px -20px rgba(20,17,15,.5);transition:transform .5s cubic-bezier(.3,1.2,.5,1),opacity .4s;cursor:grab;user-select:none}
.pf-polaroid-in{background:linear-gradient(135deg,#fff3e8,#ffe1c8);border-radius:2px;padding:22px 20px;min-height:200px}
.pf-stars{color:#ff5b1f;letter-spacing:3px;font-size:1.1rem;margin-bottom:10px}
.pf-polaroid p{margin:0;font:400 1.25rem/1.4 'Instrument Serif',Georgia,serif;font-style:italic;color:#14110f}
.pf-polaroid footer{margin-top:14px;font-size:.88rem;color:#4a4039}
.pf-polaroid footer a{color:#e0480f;font-weight:700}
.pf-polaroid.is-fly{transition:transform .55s cubic-bezier(.5,0,.8,.3),opacity .55s;opacity:0}

/* ---------- Responsive : correctifs mobile des blocs existants ---------- */
@media (max-width:980px){
  .pf-budget-grid,.pf-ab-grid,.pf-avis-grid{grid-template-columns:1fr}
  .pf-budget-result{position:static}
  .pf-reglages-sticky{grid-template-columns:1fr;grid-template-rows:1fr auto}
  .pf-viewfinder{grid-row:1;margin:12vh 6vw 2vh}
  .pf-reglages-copy{grid-column:1;grid-row:2;padding:0 16px 24px}
  .pf-reglages-copy .nf-h2{font-size:1.7rem}
  .pf-rg-steps li{display:none}
  .pf-rg-steps li.is-on{display:block}
  .pf-pile{height:400px}
}
@media (max-width:760px){
  .pf-opts{grid-template-columns:1fr}
  .pf-film{padding-left:16px;padding-right:16px}
  .pf-frame{flex-basis:72vw}
  .pf-planche-nav{display:none}
  .pf-reglages{height:260vh}
  .pf-vf-bar{font-size:.85rem;gap:12px}
  .pf-vf-meter{width:70px}
  /* hero */
  .nf-hero-visual{width:100%;margin-top:8px}
  .pf-hero3d{aspect-ratio:1/1;max-height:none;border-radius:24px}
  .nf-marquee--hero{position:relative!important;inset:auto!important;width:100%!important;max-width:none!important;transform:none!important;margin:28px 0 0!important;border-radius:0!important}
  .nf-marquee--hero .nf-marquee-track{width:max-content}
  /* spécialités et conseils en carrousel horizontal */
  .nf-specs,.nf-advice{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:18px!important;padding:22px 16px 26px;margin:0 -16px;scrollbar-width:none}
  .nf-specs::-webkit-scrollbar,.nf-advice::-webkit-scrollbar{display:none}
  .nf-spec,.nf-acard{flex:0 0 76%;scroll-snap-align:center}
  /* liste des départements repliée */
  .nf-department-list.is-collapsed .nf-department-row:nth-of-type(n+13){display:none}
  .pf-more{display:block;width:100%;margin-top:12px}
  .nf-geo-card{box-shadow:5px 5px 0 #14110f!important}
  .nf-steps .nf-step{padding:28px 18px 20px 84px}
  .nf-steps .nf-step::before{font-size:2.4rem;left:16px}
}
@media (min-width:761px){.pf-more{display:none}}
@media (prefers-reduced-motion:reduce){
  .pf-reglages{height:auto}.pf-reglages-sticky{position:relative;height:auto;min-height:100vh}
  .pf-reglages-photo{filter:none}.pf-rg-steps li{opacity:1;transform:none;display:block}
  .pf-polaroid,.pf-gauge span,.pf-circle path{transition:none}
}
.pf-rg-steps li[data-rg-step="0"]::before{content:"1"}.pf-rg-steps li[data-rg-step="1"]::before{content:"2"}.pf-rg-steps li[data-rg-step="2"]::before{content:"3"}.pf-rg-steps li[data-rg-step="3"]::before{content:"4"}
