/* ============================================================
   AQUALIS — Fiches produit (refonte octobre 2026)
   Mise en page par blocs : héros, bénéfices en images,
   présentation, caractéristiques essentielles, installation,
   réassurance. Chargé uniquement par les 4 fiches produit.
   ============================================================ */

.pp-hero-kicker{ font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--cyan-2); font-weight:600; margin-bottom:10px; }
.pp-hero-title{ font-size:clamp(2rem,4.4vw,3.1rem); line-height:1.05; letter-spacing:-.025em; font-weight:600; color:var(--ink); }
.pp-hero-title span{ display:block; font-size:.5em; font-weight:500; letter-spacing:-.01em; color:var(--muted); margin-top:10px; line-height:1.3; }
.pp-promise{ font-size:clamp(1.05rem,1.6vw,1.22rem); line-height:1.55; color:var(--ink); margin:20px 0 6px; max-width:34em; }
.pp-keys{ display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 22px; padding:0; list-style:none; }
.pp-keys li{ font-size:.82rem; padding:7px 13px; border-radius:999px; background:var(--panel); border:1px solid var(--stroke); color:var(--ink); }
.pp-ctas{ display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 4px; }
.pp-ctas .btn{ flex:0 1 auto; }
.pp-pro{ font-size:.86rem; color:var(--muted); margin-top:10px; }
.pp-pro a{ color:var(--cyan-2); }

/* --- Bénéfices : une image, un message --- */
.pp-benefits{ display:grid; gap:clamp(28px,4vw,44px); margin-top:40px; }
.pp-benefit{ display:grid; gap:22px; align-items:center; grid-template-columns:1fr; }
@media(min-width:860px){
  .pp-benefit{ grid-template-columns:1fr 1fr; gap:56px; }
  .pp-benefit:nth-child(even) .pp-benefit-media{ order:2; }
}
.pp-benefit-media{ border-radius:22px; overflow:hidden; background:var(--l-bg-2); aspect-ratio:1/1; }
.pp-benefit-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.pp-benefit h3{ font-size:clamp(1.4rem,2.6vw,2rem); line-height:1.15; letter-spacing:-.02em; font-weight:600; margin-bottom:12px; }
.pp-benefit p{ font-size:1.02rem; line-height:1.7; color:var(--l-muted); max-width:30em; }
.pp-benefit .pp-num{ display:inline-block; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan-deep); font-weight:600; margin-bottom:10px; }

/* --- Présentation --- */
.pp-statement{ font-size:clamp(1.35rem,2.8vw,2.1rem); line-height:1.35; letter-spacing:-.015em; font-weight:500; max-width:26em; }
.pp-statement em{ font-style:normal; color:var(--cyan-2); }
.pp-text{ margin-top:22px; max-width:44em; color:var(--muted); line-height:1.75; font-size:1rem; }
.pp-text p + p{ margin-top:14px; }

/* --- Caractéristiques essentielles --- */
.pp-specs{ display:grid; gap:1px; grid-template-columns:1fr; margin-top:30px; background:var(--stroke); border:1px solid var(--stroke); border-radius:18px; overflow:hidden; }
@media(min-width:700px){ .pp-specs{ grid-template-columns:1fr 1fr; } }
.pp-spec{ background:var(--bg); padding:18px 20px; }
.pp-spec dt{ font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.pp-spec dd{ font-size:1.05rem; color:var(--ink); font-weight:500; }
.pp-spec-note{ margin-top:16px; font-size:.84rem; color:var(--muted); }
.pp-docs{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }

/* --- Installation --- */
.pp-steps{ display:grid; gap:16px; grid-template-columns:1fr; margin-top:34px; counter-reset:pp; list-style:none; padding:0; }
@media(min-width:700px){ .pp-steps{ grid-template-columns:1fr 1fr; } }
@media(min-width:1100px){ .pp-steps{ grid-template-columns:repeat(4,1fr); } }
.pp-steps li{ counter-increment:pp; background:var(--l-bg-2); border-radius:18px; padding:24px 22px; }
.pp-steps li::before{ content:counter(pp); display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%;
  background:var(--cyan-deep); color:#fff; font-weight:600; font-size:.95rem; margin-bottom:14px; }
.pp-steps h3{ font-size:1.02rem; font-weight:600; margin-bottom:8px; color:var(--l-ink); }
.pp-steps p{ font-size:.92rem; line-height:1.6; color:var(--l-muted); }
.pp-install-note{ margin-top:20px; font-size:.86rem; color:var(--l-muted); }

/* --- Réassurance --- */
.pp-assure{ display:grid; gap:14px; grid-template-columns:1fr 1fr; margin-top:30px; }
@media(min-width:900px){ .pp-assure{ grid-template-columns:repeat(4,1fr); } }
.pp-assure div{ background:var(--panel); border:1px solid var(--stroke); border-radius:16px; padding:20px 18px; }
.pp-assure b{ display:block; color:var(--ink); font-size:.98rem; margin-bottom:6px; }
.pp-assure span{ color:var(--muted); font-size:.86rem; line-height:1.5; }

/* --- Barre d'achat collante --- */
.pp-buybar{ position:fixed; left:0; right:0; bottom:0; z-index:60; background:rgba(11,32,51,.94); backdrop-filter:saturate(1.6) blur(14px);
  -webkit-backdrop-filter:saturate(1.6) blur(14px); border-top:1px solid var(--stroke); transform:translateY(110%); transition:transform .35s var(--ease); }
.pp-buybar.on{ transform:translateY(0); }
.pp-buybar .container{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:10px; padding-bottom:10px; }
.pp-buybar p{ color:var(--ink); font-size:.92rem; line-height:1.3; }
.pp-buybar p small{ display:block; color:var(--muted); font-size:.78rem; }
@media(max-width:520px){ .pp-buybar p small{ display:none; } }
@media print{ .pp-buybar{ display:none; } }