/* PROSTALIO sales — reproduction du design VSL ProstaVive (logo centre, hero navy +
   3 pots, sections bleu clair + pot/ingredients, offer boxes 1/3/6, garantie, avis, FAQ).
   Copy = NOS mots (mecanisme "detartrage / calcaire prostatique"). CTA -> /order.html */
:root{--blue:#3a5fd0;--blue-d:#2a47ab;--navy:#101c4a;--lb:#eceffb;--ink:#1a2430;--soft:#41505f;--gold:#d9a441;--ok:#2f8f5a;--line:#dbe6ef;}
*{box-sizing:border-box;}
body{margin:0;background:#fff;color:var(--ink);font-family:'Segoe UI',-apple-system,Arial,sans-serif;font-size:18px;line-height:1.6;}
img{max-width:100%;display:block;}
.wrap{width:min(100% - 32px,880px);margin-inline:auto;}
.logo{text-align:center;padding:18px 0;font-size:28px;font-weight:800;letter-spacing:-.01em;}
.logo b{color:var(--blue);} .logo span{color:var(--navy);}
.hero{background:var(--navy);color:#fff;text-align:center;padding:34px 0 0;position:relative;}
.hero h1{width:min(100% - 32px,860px);margin:0 auto;font-size:clamp(28px,5vw,44px);font-weight:800;line-height:1.14;}
.hero h1 b{color:var(--blue);}
.hero .jars{margin:24px auto 0;max-width:620px;}
.hero::after{content:"";display:block;height:60px;background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0;margin-top:-30px;position:relative;}
.sec{padding:20px 0;}
.sec.lb{background:var(--lb);}
.lede{font-size:19px;}
.two{display:grid;grid-template-columns:1fr 320px;gap:26px;align-items:center;} @media(max-width:720px){.two{grid-template-columns:1fr;}}
.h2{font-size:clamp(24px,4vw,34px);font-weight:800;text-align:center;margin:6px 0 18px;line-height:1.15;}
.h2 b{color:var(--blue);}
.prod{max-width:420px;margin:14px auto;}
.badge-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:16px 0;color:var(--soft);font-size:14px;}
.badge-row span{display:flex;align-items:center;gap:6px;}
/* offres */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0;} @media(max-width:720px){.offers{grid-template-columns:1fr;}}
.ob{border:2px solid var(--line);border-radius:16px;background:#fff;padding:18px;text-align:center;position:relative;display:flex;flex-direction:column;}
.ob.pop{border-color:var(--blue);box-shadow:0 12px 30px -12px rgba(26,155,224,.5);}
.ob .pill{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;font-size:12px;font-weight:800;padding:4px 14px;border-radius:999px;white-space:nowrap;}
.ob .q{font-weight:800;font-size:20px;color:var(--navy);} .ob .jar{height:150px;object-fit:contain;margin:6px auto;}
.ob .pr{font-size:34px;font-weight:800;color:var(--navy);} .ob .cmp{text-decoration:line-through;color:#9aa;font-size:15px;} .ob .pu{color:var(--blue-d);font-weight:700;font-size:14px;margin-bottom:12px;}
.ob .cta{margin-top:auto;display:block;background:linear-gradient(180deg,#2fb24a,#1f8f39);color:#fff;font-weight:800;font-size:16px;padding:13px;border-radius:12px;text-decoration:none;box-shadow:0 8px 18px -8px rgba(31,143,57,.7);}
.cta-wide{display:block;width:min(100%,480px);margin:18px auto;background:linear-gradient(180deg,#2fb24a,#1f8f39);color:#fff;text-align:center;font-weight:800;font-size:20px;padding:17px;border-radius:14px;text-decoration:none;}
.guar{display:flex;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;margin:22px 0;}
.seal{flex:0 0 84px;width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f0d18a,var(--gold));color:#4a3400;display:grid;place-items:center;font-weight:800;text-align:center;font-size:13px;line-height:1;}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;} @media(max-width:720px){.reviews{grid-template-columns:1fr;}}
.rv{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;} .rv .stars{color:var(--gold);} .rv .who{font-weight:700;font-size:14px;margin-top:8px;color:var(--soft);}
.faq details{background:var(--lb);border:1px solid var(--line);border-radius:10px;padding:2px 18px;margin:10px 0;} .faq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style:none;} .faq summary::after{content:"+";float:right;color:var(--blue);font-weight:800;} .faq details[open] summary::after{content:"–";} .faq p{color:var(--soft);margin:0 0 14px;}
.foot{background:#0b1a30;color:#8fa0b8;font-size:12.5px;padding:28px 0;margin-top:20px;text-align:center;} .foot a{color:#b7c4d6;text-decoration:none;margin:0 8px;} .foot .disc{max-width:760px;margin:14px auto 0;line-height:1.6;}
.center{text-align:center;}

/* --- sections long-form supplementaires --- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0;} @media(max-width:720px){.steps{grid-template-columns:1fr;}}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center;}
.step .n{width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;display:grid;place-items:center;margin:0 auto 10px;font-size:20px;}
.step h4{margin:0 0 6px;color:var(--navy);}
.ings{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:18px 0;} @media(max-width:640px){.ings{grid-template-columns:1fr;}}
.ing{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;}
.ing .ic{flex:0 0 52px;width:52px;height:52px;border-radius:12px;background:var(--lb);display:grid;place-items:center;font-size:26px;}
.ing h4{margin:0 0 4px;color:var(--navy);} .ing p{margin:0;font-size:14.5px;color:var(--soft);}
.bonus{display:flex;gap:16px;align-items:center;background:#fff;border:2px dashed var(--blue);border-radius:14px;padding:16px;margin:12px 0;}
.bonus .tag{flex:0 0 auto;background:var(--blue);color:#fff;font-weight:800;font-size:13px;padding:6px 12px;border-radius:8px;}
.bonus .val{margin-left:auto;color:var(--ok);font-weight:800;white-space:nowrap;}
.cmpt{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px;background:#fff;}
.cmpt th,.cmpt td{border:1px solid var(--line);padding:11px;text-align:center;} .cmpt thead th{background:var(--navy);color:#fff;} .cmpt td.y{color:var(--ok);font-weight:800;} .cmpt td.n{color:#c0392b;} .cmpt tbody th{text-align:left;background:var(--lb);font-weight:600;}
.big{font-size:clamp(22px,3.6vw,30px);font-weight:800;text-align:center;color:var(--navy);margin:8px 0 16px;line-height:1.2;}
.note{background:var(--lb);border-left:4px solid var(--blue);border-radius:0 8px 8px 0;padding:14px 18px;margin:16px 0;color:var(--soft);}
.stars-big{text-align:center;color:var(--gold);font-size:26px;} .rate{text-align:center;color:var(--soft);font-size:14px;margin-bottom:10px;}

/* --- sections VSL completes (cartes ingredients hexagone, valeurs nutri, benefices, sceau or) --- */
.ingreveal{display:flex;flex-direction:column;gap:14px;margin:20px 0;}
.ir{display:flex;gap:20px;align-items:center;background:#fff;border-radius:14px;padding:14px 18px;box-shadow:0 6px 18px -10px rgba(14,42,79,.25);}
.ir .hex{flex:0 0 130px;width:130px;height:150px;object-fit:cover;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--lb);}
.ir h4{margin:0 0 6px;color:var(--navy);font-size:20px;} .ir h4 sup{color:var(--blue);font-size:12px;} .ir p{margin:0;color:var(--soft);font-size:15px;}
@media(max-width:560px){.ir{flex-direction:column;text-align:center;} .ir .hex{flex-basis:auto;}}
.supfacts{background:#fff;border:2px solid #111;border-radius:6px;padding:16px 18px;max-width:520px;margin:18px auto;font-family:Arial,sans-serif;}
.supfacts h3{margin:0;font-size:30px;font-weight:900;border-bottom:8px solid #111;padding-bottom:4px;}
.supfacts .meta{font-size:13px;color:#222;margin:4px 0;} .supfacts table{width:100%;border-collapse:collapse;font-size:14px;} .supfacts th,.supfacts td{border-top:1px solid #111;padding:4px 0;text-align:left;} .supfacts td.r{text-align:right;} .supfacts .thick{border-top:4px solid #111;} .supfacts .small{font-size:12px;color:#444;border:0;padding-top:8px;}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;text-align:center;margin:22px 0;} @media(max-width:640px){.benefits{grid-template-columns:repeat(2,1fr);}}
.benefits .bi{font-size:38px;} .benefits .bl{font-weight:800;color:var(--navy);margin-top:6px;}
.sealgold{width:150px;height:150px;margin:0 auto 14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f6e3a8,#c99a2e);border:6px solid #b3862a;color:#4a3400;display:grid;place-items:center;text-align:center;font-weight:900;line-height:1.1;box-shadow:0 10px 26px -10px rgba(150,110,20,.7);}
.sealgold small{display:block;font-size:11px;font-weight:700;letter-spacing:.05em;}
.gbox{background:#fffdf5;border:2px solid var(--gold);border-radius:16px;padding:26px 22px;text-align:center;margin:16px 0;}

/* --- sections miroir ProstaVive (structure 1:1) --- */
.sec.navy{background:linear-gradient(180deg,#101c4a,#0a2140);color:#fff;}
.sec.navy .h2{color:#fff;} .sec.navy p{color:#d5e2f2;}
.banner100{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(90deg,#101c4a,#134a7c);border-radius:10px;padding:18px 26px;margin:26px 0;}
.banner100 .t{color:#fff;font-size:clamp(19px,3vw,26px);font-weight:800;line-height:1.25;} .banner100 .t b{color:var(--blue);}
.banner100 .badge{flex:0 0 auto;width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#7ec87e,#2f8f3f);color:#fff;display:grid;place-items:center;font-weight:900;text-align:center;font-size:15px;line-height:1.05;box-shadow:0 8px 20px -8px rgba(30,120,50,.7);}
.leads{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start;margin:16px 0;} @media(max-width:720px){.leads{grid-template-columns:1fr;}}
.checklist{list-style:none;padding:0;margin:0;} .checklist li{padding:7px 0 7px 34px;position:relative;font-weight:700;color:var(--ink);font-size:18px;}
.checklist li::before{content:"✔";position:absolute;left:0;top:6px;color:#2f8f3f;font-size:19px;}
.collage{display:grid;grid-template-columns:1fr 1fr;gap:10px;} .collage img{width:100%;border-radius:6px;box-shadow:0 8px 18px -10px rgba(20,40,70,.4);}
.bonuscard{display:flex;gap:22px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin:16px 0;box-shadow:0 8px 24px -14px rgba(14,42,79,.3);}
.bonuscard .bk{flex:0 0 150px;} .bonuscard h3{margin:0 0 10px;color:#d21c1c;font-size:22px;} .bonuscard p{margin:0 0 12px;color:var(--soft);font-size:16px;}
@media(max-width:600px){.bonuscard{flex-direction:column;}}
.pricing{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:16px;align-items:stretch;margin:26px 0;} @media(max-width:760px){.pricing{grid-template-columns:1fr;}}
.pc{background:var(--lb);border-radius:12px;padding:0 18px 22px;text-align:center;display:flex;flex-direction:column;}
.pc .tag{margin:0 -18px 12px;background:transparent;color:var(--navy);font-weight:800;font-size:15px;letter-spacing:.04em;padding:13px;}
.pc.pop{background:var(--navy);color:#fff;box-shadow:0 16px 40px -16px rgba(14,42,79,.7);}
.pc.pop .tag{background:#ffe714;color:#1c2430;border-radius:12px 12px 0 0;}
.pc .qty{font-size:32px;font-weight:900;} .pc .supply{color:var(--blue);font-weight:800;margin:2px 0 12px;} .pc.pop .supply{color:#7fc6f4;}
.pc .jarimg{height:150px;object-fit:contain;margin:0 auto 10px;}
.pc .per{font-size:46px;font-weight:900;line-height:1;} .pc .per small{font-size:17px;font-weight:700;} .pc .ship{font-size:13.5px;margin:10px 0;color:#41505f;} .pc.pop .ship{color:#c9dcf0;}
.pc .perks{font-size:14px;font-weight:800;margin:4px 0;} .pc .perks .g{color:#2fb24a;} .pc .perks .r{color:#ff5a4a;}
.pc .buy{display:block;background:linear-gradient(180deg,#2fb24a,#1f8f39);color:#fff;font-weight:800;font-size:19px;padding:14px;border-radius:8px;text-decoration:none;margin-top:auto;}
.pc .cards{margin-top:10px;font-size:11px;letter-spacing:.06em;color:#6a7686;} .pc.pop .cards{color:#a9bdd4;}
.pc .tot{margin-top:10px;font-weight:800;font-size:18px;}
.buynow{display:block;width:min(100%,340px);margin:20px auto;background:linear-gradient(180deg,#2fb24a,#1f8f39);color:#fff;text-align:center;font-weight:800;font-size:21px;padding:16px;border-radius:8px;text-decoration:none;}
.creamguar{background:#fdf8e8;border:3px solid var(--navy);outline:6px solid #fdf8e8;box-shadow:0 0 0 9px var(--gold);border-radius:4px;padding:30px 26px;text-align:center;margin:30px 6px;}
.creamguar h2{margin:0 0 12px;font-size:clamp(24px,4vw,32px);}
.foot.black{background:#0a0a0c;}

/* fix overflow: les items grid/flex ne doivent pas depasser leur colonne */
.two > *{min-width:0;}
.bonuscard > div{min-width:0;}
.prod{max-width:min(100%,420px);}
.leads > *{min-width:0;}
html,body{overflow-x:hidden;}
.pricing > .pc{min-width:0;}
.pc .jarimg{max-width:100%;width:auto;}
.two .prod{width:100%;height:auto;}