/* Photographe : styles propres à la page (préfixe pho-) */

/* ---------- Héros : copie + éventail de photos qui se « développent » ---------- */
.pho-hero.page-hero.simple{padding-bottom:84px}
.pho-hero-in{display:grid;gap:44px;align-items:center}
@media (min-width:980px){.pho-hero-in{grid-template-columns:1.05fr .95fr;gap:48px}}
.pho-hero .ph-copy{padding-bottom:0}
.pho-hero .reassure{justify-content:flex-start;margin-top:24px}
@media (max-width:759px){.pho-hero .reassure{justify-content:center}}
.pho-fan{position:relative;width:100%;max-width:520px;aspect-ratio:520/450;margin:0 auto}
.pho-fan figure{position:absolute;margin:0;width:54%;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:#D8C6AE;border:6px solid #FFFAF3;box-shadow:0 30px 60px -28px rgba(60,30,10,.6);transform:rotate(var(--r))}
.pho-fan img{width:100%;height:100%;object-fit:cover;display:block}
.pho-fan .f1{--r:-8deg;left:0;top:12%}
.pho-fan .f2{--r:7deg;right:0;top:9%}
.pho-fan .f3{--r:-1.5deg;left:23%;top:0;z-index:2}
.pho-flash{position:absolute;inset:-4%;border-radius:30px;background:radial-gradient(closest-side,#FFFFFF,rgba(255,255,255,0));opacity:0;pointer-events:none;z-index:3}
.pho-chip{position:absolute;left:50%;bottom:0;z-index:4;display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:999px;background:#17414A;color:#F3EDE4;font-weight:600;font-size:14.5px;white-space:nowrap;box-shadow:0 18px 40px -18px rgba(15,49,56,.7);transform:translateX(-50%)}
.pho-chip i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#FFB020;color:#17414A;font-style:normal}
@media (prefers-reduced-motion:no-preference){
  .pho-fan figure{opacity:0;animation:phoIn .9s cubic-bezier(.34,1.4,.64,1) forwards}
  .pho-fan img{animation:phoDev 1.4s ease-out both}
  .pho-fan .f1,.pho-fan .f1 img{animation-delay:.5s}
  .pho-fan .f2,.pho-fan .f2 img{animation-delay:1.1s}
  .pho-fan .f3,.pho-fan .f3 img{animation-delay:1.7s}
  .pho-flash{animation:phoFlash 2.1s linear .45s 1 both}
  .pho-chip{opacity:0;animation:phoChip .7s cubic-bezier(.34,1.56,.64,1) 2.6s forwards}
  .pho-fan .f3{animation:phoIn .9s cubic-bezier(.34,1.4,.64,1) 1.7s forwards,phoBob 6s ease-in-out 3s infinite}
}
@keyframes phoIn{from{opacity:0;transform:translateY(40px) rotate(0) scale(.9)}to{opacity:1;transform:rotate(var(--r))}}
@keyframes phoDev{from{filter:brightness(2.3) saturate(0) blur(6px)}to{filter:none}}
@keyframes phoFlash{0%,100%{opacity:0}4%{opacity:.85}12%{opacity:0}30%{opacity:0}33%{opacity:.85}41%{opacity:0}58%{opacity:0}61%{opacity:.85}69%{opacity:0}}
@keyframes phoChip{from{opacity:0;transform:translate(-50%,16px) scale(.85)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes phoBob{0%,100%{translate:0 0}50%{translate:0 -8px}}

/* ---------- Le shooting : frise qui se remplit au défilement ---------- */
.pho-steps{background:var(--mist);border-top:0}
.pho-tw{position:relative;margin-top:56px;--p:1}
.pho-line{position:absolute;left:27px;top:28px;bottom:28px;width:3px;border-radius:3px;background:var(--mist-line)}
.pho-line i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(180deg,#FF6B2C,#FFB020);transform-origin:top;transform:scaleY(var(--p))}
.pho-track{list-style:none;margin:0;padding:0;display:grid;gap:30px;position:relative}
.pho-track li{display:grid;grid-template-columns:56px 1fr;gap:4px 18px}
.pho-dot{grid-row:span 3;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#FFFAF3;color:var(--pet-txt);border:2px solid var(--mist-line);transition:background .4s,color .4s,border-color .4s,transform .5s cubic-bezier(.34,1.56,.64,1)}
.pho-k{font-family:var(--f-m);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--pet-txt);padding-top:4px}
.pho-track b{font-family:var(--f-d);font-weight:600;font-size:21px;letter-spacing:-.025em;line-height:1.15}
.pho-track p{color:var(--t2);font-size:15px}
.pho-track li.on .pho-dot{background:#17414A;border-color:#17414A;color:#FFB020;transform:scale(1.08)}
@media (min-width:900px){
  .pho-line{left:28px;right:28px;top:27px;bottom:auto;width:auto;height:3px}
  .pho-line i{transform-origin:left;transform:scaleX(var(--p));background:linear-gradient(90deg,#FF6B2C,#FFB020)}
  .pho-track{grid-template-columns:repeat(4,1fr);gap:24px}
  .pho-track li{grid-template-columns:1fr;gap:0}
  .pho-dot{grid-row:auto;margin-bottom:22px}
  .pho-track b{margin:6px 0 8px}
}

/* ---------- Ce que vous recevez : bande pétrole ---------- */
.pho-band{background:var(--pet);border-top:0}
.pho-band h2,.pho-band h3{color:var(--pet-fg)}
.pho-band .mute,.pho-band .lead,.pho-band .label{color:var(--pet-mute)}
.pho-band .eyebrow i{background:#FFB020}
.pho-get{display:grid;gap:56px;align-items:center}
@media (min-width:980px){.pho-get{grid-template-columns:1.15fr .85fr;gap:72px}}
.pho-freq{display:grid;gap:14px;margin-top:40px}
@media (min-width:640px){.pho-freq{grid-template-columns:1fr 1fr}}
.pho-fc{border-radius:26px;padding:24px 22px 22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16)}
.pho-fc h3{font-family:var(--f-b);font-size:15px;font-weight:600;letter-spacing:0;color:var(--pet-mute)}
.pho-fc .nn{display:flex;align-items:baseline;gap:10px;margin-top:14px}
.pho-fc .n{display:inline-block;font-family:var(--f-d);font-weight:700;font-size:clamp(68px,7vw,96px);line-height:.9;letter-spacing:-.06em;color:#FFB020}
.pho-fc .u{font-size:19px;font-weight:600;color:var(--pet-fg)}
.pho-fc p{margin-top:12px;color:#E4ECEA;font-size:15px}
.pho-fc.hot{background:#F6EDE1;border-color:#F6EDE1}
.pho-fc.hot h3{color:#6A4A38}
.pho-fc.hot .n{color:#B4502C}
.pho-fc.hot .u{color:#2A1308}
.pho-fc.hot p{color:#4A3226}
.pho-ph{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.pho-ph .phone{max-width:310px;box-shadow:0 40px 90px -30px rgba(0,0,0,.6)}
.pho-ex{font-family:var(--f-m);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--pet-mute);border:1px dashed rgba(255,255,255,.3);border-radius:6px;padding:3px 8px}
.pho-th{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:7px}
.pho-th img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:7px;display:block}

/* ---------- Galerie par métier ---------- */
.pho-gal .gallery figure{will-change:transform}
.pho-gal .gallery .im{border-radius:16px}
.pho-trades{margin-top:44px;padding-top:28px;border-top:1px solid var(--line)}
.pho-trades h3{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.035em}
.pho-trades ul{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.pho-trades li{padding:9px 15px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:14.5px;font-weight:500;color:var(--t1)}
.pho-trades li.new{background:#17414A;border-color:#17414A;color:#F3EDE4;font-weight:600}

/* ---------- Prix ---------- */
.pho-plans.plans4{max-width:860px;margin-left:auto;margin-right:auto}
@media (min-width:1180px){.pho-plans.plans4{grid-template-columns:1fr 1fr}}
.pho-plans .p4-h{min-height:0}
.pho-plans .tagline{min-height:0}
.pho-price .sec-h{margin-left:auto;margin-right:auto;text-align:center}
.pho-price .faq{margin-left:auto;margin-right:auto}

@media (prefers-reduced-motion:reduce){.pho-fan figure,.pho-fan img,.pho-chip,.pho-flash{animation:none!important;opacity:1}.pho-flash{opacity:0}}
@media (max-width:759px){
  .pho-fan{max-width:320px}
  .pho-chip{font-size:13px;padding:8px 14px 8px 8px}
  .pho-chip i{width:26px;height:26px}
  #gal.pho-all figure:nth-child(n+9){display:none}
}
.pho-track li{align-content:start}
