
/* étapes */
.psteps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
@media(max-width:760px){.psteps{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.psteps{grid-template-columns:1fr}}
.pstep{background:var(--bg);padding:clamp(24px,3vw,38px);min-height:190px;display:flex;flex-direction:column}
.pstep .sn{font-style:italic;color:var(--m1);font-size:clamp(28px,4vw,48px);line-height:1}
.pstep h3{font-family:var(--display);font-weight:400;font-size:clamp(18px,2vw,24px);margin:auto 0 10px;letter-spacing:-.01em}
.pstep p{font-size:13.5px;color:var(--m2);line-height:1.6}
/* produits */
.prods{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
@media(max-width:820px){.prods{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.prods{grid-template-columns:1fr}}
.prod{border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:transform .5s var(--eo),border-color .5s var(--eo)}
.prod:hover{transform:translateY(-4px);border-color:var(--ink)}
.prod .fig{aspect-ratio:4/3;background:var(--panel);overflow:hidden}
.prod .fig img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--eo)}
.prod:hover .fig img{transform:scale(1.05)}
.prod__b{padding:clamp(18px,2vw,24px)}
.prod__b h3{font-family:var(--display);font-weight:400;font-size:clamp(19px,2vw,24px);letter-spacing:-.01em}
.prod__b p{font-size:13.5px;color:var(--m2);margin-top:6px;line-height:1.5}

/* produits les plus demandés (rendus côté serveur) */
.ppop{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,24px)}
.ppop__it{display:flex;flex-direction:column;gap:8px;color:inherit}
.ppop__it .fig{display:block;aspect-ratio:1;border-radius:16px;overflow:hidden;background:var(--panel)}
.ppop__it .fig img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--eo)}
.ppop__it:hover .fig img{transform:scale(1.04)}
.ppop__it b{font-family:var(--display);font-weight:400;font-size:clamp(17px,1.5vw,21px);letter-spacing:-.01em;margin-top:6px}
.ppop__it .d{font-size:13px;line-height:1.5;color:var(--m2)}
.ppop__it .go{font-size:12.5px;color:var(--ink);margin-top:auto;padding-top:4px}
.ppop__it:hover .go{color:var(--accent)}
@media(max-width:980px){.ppop{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.ppop{grid-template-columns:repeat(2,1fr)}}
/* page « famille de produits » (page-print-famille.php) */
.pf-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;margin-top:clamp(24px,3vw,40px)}
.pf-intro{font-size:clamp(16px,1.4vw,19px);line-height:1.6;color:var(--m3);max-width:52ch}
.pf-bref{margin:clamp(18px,2vw,26px) 0 clamp(24px,3vw,34px);display:grid;gap:9px}
.pf-bref li{position:relative;padding-left:22px;font-size:14.5px;color:var(--ink)}
.pf-bref li::before{content:'';position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.pf-top__img{border-radius:20px;overflow:hidden;background:var(--panel);aspect-ratio:1}
.pf-top__img img{width:100%;height:100%;object-fit:cover}
.pf-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pf-opt{background:var(--bg);padding:clamp(24px,3vw,38px)}
.pf-opt h3{font-family:var(--display);font-weight:400;font-size:clamp(20px,2vw,26px);margin-bottom:14px}
.pf-opt ul{display:grid;gap:8px}
.pf-opt li{font-size:14px;line-height:1.5;color:var(--m2);padding-left:14px;position:relative}
.pf-opt li::before{content:'—';position:absolute;left:0;color:var(--m1)}
.pf-tip{display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(24px,5vw,80px);align-items:start}
.pf-tip .k{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--m1)}
.pf-tip h2{font-family:var(--display);font-weight:400;font-size:clamp(28px,4vw,54px);line-height:1.02;letter-spacing:-.03em;margin-top:14px}
.pf-tip p{font-size:16px;line-height:1.65;color:var(--m3);margin-bottom:14px;max-width:60ch}
.pf-tip a,.svd-other a{color:var(--ink);border-bottom:1px solid var(--line2)}
.pf-cfg .dv__prods{display:none}
@media(max-width:900px){.pf-top,.pf-tip{grid-template-columns:1fr}.pf-opts{grid-template-columns:1fr}}
/* page famille : pas de retour au catalogue dans le configurateur (le produit est fixé), texte d'intro en haut */
.pf-cfg .dv__back{display:none}
.pf-top{align-items:start}
.pf-top__img{aspect-ratio:4/3}
.pf-bref,.pf-opt ul{list-style:none;padding:0;margin-left:0}
