*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
:root{
  --nuit:#0B1628;
  --or:#E8712A;
  --bn:#2B52C9;
  --gd:#FFD470;
  --cr:#F5F0E8;
}
body{font-family:'Nunito',system-ui,sans-serif;background:var(--nuit);color:var(--cr);overflow-x:hidden;-webkit-font-smoothing:antialiased}

/* ---------- LOGO BICOLORE (Bible v4) ---------- */
.logo-pp{font-family:'Baloo 2',cursive;font-weight:800;letter-spacing:.5px;white-space:nowrap}
.logo-pp .lp-1{color:var(--or)}
.logo-pp .lp-a{color:var(--or);margin:0 .12em}
.logo-pp .lp-2{color:var(--bn)}
/* variante lisible sur fond photo sombre : le bleu marque manque de contraste,
   on l'eclaircit UNIQUEMENT ici via un halo, pas en changeant la teinte */
.hero .logo-pp{text-shadow:0 2px 24px rgba(0,0,0,.9),0 0 40px rgba(0,0,0,.7)}

/* ---------- NAV ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;
    padding:14px 28px;transition:background .35s,backdrop-filter .35s,box-shadow .35s}
nav.scrolled{background:rgba(11,22,40,.92);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(245,240,232,.08)}
nav .brand{font-size:23px;text-decoration:none;display:flex;align-items:center}
nav ul{list-style:none;display:flex;gap:26px;align-items:center}
nav a.nl{color:rgba(245,240,232,.82);text-decoration:none;font-weight:700;font-size:15px;transition:color .2s;position:relative}
nav a.nl:hover{color:var(--or)}
nav a.nl::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--or);transition:width .25s}
nav a.nl:hover::after{width:100%}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;flex-direction:column;gap:5px}
.burger span{display:block;width:26px;height:2.5px;background:var(--cr);border-radius:2px;transition:.3s}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;isolation:isolate}
.hero picture,.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(11,22,40,.94) 0%,rgba(11,22,40,.80) 34%,rgba(11,22,40,.25) 62%,rgba(11,22,40,.15) 100%)}
.hero-in{max-width:1240px;margin:0 auto;padding:120px 28px 96px;width:100%}
.hero-txt{max-width:540px}
.hero .logo-pp{font-size:clamp(38px,6.6vw,68px);line-height:1.05;display:block;margin-bottom:6px}
.hero .kicker{font-size:clamp(15px,2vw,18px);font-weight:800;letter-spacing:3px;text-transform:uppercase;color:rgba(245,240,232,.62);margin-bottom:22px}
.hero h1{font-family:'Baloo 2',cursive;font-weight:700;font-size:clamp(24px,3.5vw,34px);line-height:1.25;margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--gd)}
.hero p.lede{font-size:clamp(16px,2.1vw,19px);line-height:1.65;color:rgba(245,240,232,.78);margin-bottom:30px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

.btn{display:inline-flex;align-items:center;gap:9px;border:none;cursor:pointer;text-decoration:none;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:16px;padding:15px 30px;border-radius:999px;transition:transform .18s,box-shadow .18s,background .2s}
.btn-1{background:var(--or);color:#fff;box-shadow:0 8px 30px rgba(232,113,42,.34)}
.btn-1:hover{transform:translateY(-2px);box-shadow:0 12px 38px rgba(232,113,42,.46)}
.btn-2{background:rgba(245,240,232,.07);color:var(--cr);border:1.5px solid rgba(245,240,232,.28)}
.btn-2:hover{background:rgba(245,240,232,.13);transform:translateY(-2px)}
.btn-3{background:var(--bn);color:#fff;box-shadow:0 8px 30px rgba(43,82,201,.36)}
.btn-3:hover{transform:translateY(-2px)}
.btn[disabled]{opacity:.5;cursor:default;transform:none!important;box-shadow:none}

.scrollcue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;text-align:center;
  color:rgba(245,240,232,.5);font-size:12px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase}
.scrollcue i{display:block;width:1.5px;height:34px;background:linear-gradient(rgba(245,240,232,0),rgba(245,240,232,.6));margin:10px auto 0;animation:cue 2s ease-in-out infinite}
@keyframes cue{0%,100%{opacity:.3;transform:scaleY(.7)}50%{opacity:1;transform:scaleY(1)}}

/* ---------- SECTIONS ---------- */
section{padding:96px 28px;position:relative}
.wrap{max-width:1080px;margin:0 auto}
.narrow{max-width:720px;margin:0 auto}
.lb{font-size:13px;font-weight:900;letter-spacing:3px;text-transform:uppercase;color:var(--or);margin-bottom:14px}
.lb.bl{color:var(--bn)}
h2{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(30px,5vw,46px);line-height:1.15;margin-bottom:20px}
h3{font-family:'Baloo 2',cursive;font-weight:700;font-size:clamp(21px,3vw,26px);margin-bottom:12px}
p{font-size:17px;line-height:1.72;color:rgba(245,240,232,.76)}
p+p{margin-top:16px}
.gd{color:var(--gd);font-weight:700}
.center{text-align:center}

.promesse{background:linear-gradient(180deg,var(--nuit),#0d1a2f)}
.promesse blockquote{font-family:'Baloo 2',cursive;font-weight:700;font-size:clamp(24px,4.2vw,38px);line-height:1.32;text-align:center;color:var(--cr)}
.promesse cite{display:block;margin-top:22px;font-style:normal;font-size:16px;font-weight:700;color:rgba(245,240,232,.5)}

/* extrait */
.extrait{background:rgba(245,240,232,.03);border:1px solid rgba(245,240,232,.10);border-radius:22px;padding:clamp(26px,4vw,42px)}
.extrait .chap{font-size:14px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:var(--bn);margin-bottom:8px}
.extrait .titre{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(26px,4vw,36px);color:var(--or);margin-bottom:26px}
.extrait p{font-size:clamp(17px,2.2vw,19px);line-height:1.8}
.extrait .dial{font-style:italic;font-weight:600;color:var(--cr)}
.extrait .punch{font-family:'Baloo 2',cursive;font-weight:700;color:var(--or);font-size:clamp(21px,3vw,26px);margin-top:22px;display:block}
.extrait .sfx{font-family:'Baloo 2',cursive;font-weight:800;color:var(--or);font-size:clamp(44px,9vw,86px);line-height:1;margin:26px 0;display:block}
.extrait .soupir{font-style:italic;font-weight:600;color:rgba(245,240,232,.55)}

/* univers */
.persos{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;margin-top:38px}
.perso{background:rgba(245,240,232,.04);border:1px solid rgba(245,240,232,.10);border-radius:18px;padding:26px 22px}
.perso .pip{width:34px;height:34px;border-radius:50%;margin-bottom:14px}
.perso h3{margin-bottom:8px;font-size:22px}
.perso p{font-size:15.5px;line-height:1.6}

/* gammes */
.gamme{border-radius:26px;padding:clamp(28px,4vw,48px);margin-top:26px;border:1px solid}
.gamme.livre{background:linear-gradient(160deg,rgba(232,113,42,.10),rgba(232,113,42,.02));border-color:rgba(232,113,42,.28)}
.gamme.bd{background:linear-gradient(160deg,rgba(43,82,201,.14),rgba(43,82,201,.03));border-color:rgba(43,82,201,.34)}
.gamme-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,48px);align-items:center}
.gamme-grid.rev>div:first-child{order:2}
.couv{width:100%;border-radius:12px;box-shadow:0 26px 60px rgba(0,0,0,.62);display:block}
.ph{aspect-ratio:3/4;border-radius:12px;border:2px dashed rgba(245,240,232,.22);display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;font-size:14px;font-weight:700;color:rgba(245,240,232,.42);line-height:1.6}
ul.pts{list-style:none;margin:20px 0 26px}
ul.pts li{font-size:16.5px;line-height:1.6;padding:8px 0 8px 30px;position:relative;color:rgba(245,240,232,.8)}
ul.pts li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:9px;border-radius:50%;background:var(--or)}
.gamme.bd ul.pts li::before{background:var(--bn)}
.tagp{display:inline-block;font-size:12.5px;font-weight:900;letter-spacing:2px;text-transform:uppercase;padding:7px 15px;border-radius:999px;margin-bottom:16px}
.gamme.livre .tagp{background:rgba(232,113,42,.17);color:var(--or)}
.gamme.bd .tagp{background:rgba(43,82,201,.22);color:#7d9df0}

/* comparatif */
table.cmp{width:100%;border-collapse:collapse;margin-top:34px;font-size:16px}
table.cmp th,table.cmp td{padding:16px 14px;text-align:left;border-bottom:1px solid rgba(245,240,232,.10);vertical-align:top}
table.cmp thead th{font-family:'Baloo 2',cursive;font-size:20px;font-weight:800}
table.cmp thead th:nth-child(2){color:var(--or)}
table.cmp thead th:nth-child(3){color:#7d9df0}
table.cmp td:first-child{font-weight:800;color:rgba(245,240,232,.62);font-size:15px}
table.cmp td{color:rgba(245,240,232,.8)}

/* boutique */
.shop{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:36px}
.prod{background:rgba(245,240,232,.04);border:1px solid rgba(245,240,232,.11);border-radius:20px;padding:26px 22px;display:flex;flex-direction:column}
.prod .tagp{align-self:flex-start}
.prod h3{font-size:21px;margin-bottom:6px}
.prod .sub{font-size:14.5px;color:rgba(245,240,232,.55);line-height:1.55;margin-bottom:16px}
.prod .px{font-family:'Baloo 2',cursive;font-size:26px;font-weight:800;color:var(--cr);margin-bottom:16px}
.prod .px small{font-size:14px;font-weight:600;color:rgba(245,240,232,.45);font-family:'Nunito'}
.prod .btn{margin-top:auto;justify-content:center;font-size:15px;padding:13px 22px}
.soon{font-size:13px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--gd);text-align:center;padding:13px}

/* auteur */
.auteur{background:linear-gradient(180deg,#0d1a2f,var(--nuit))}
.sig{font-family:'Baloo 2',cursive;font-size:23px;font-weight:700;color:var(--or);margin-top:24px}

/* news */
.news{background:linear-gradient(150deg,rgba(232,113,42,.13),rgba(43,82,201,.10));border:1px solid rgba(245,240,232,.14);border-radius:26px;padding:clamp(30px,5vw,52px);text-align:center}

footer{padding:56px 28px 40px;border-top:1px solid rgba(245,240,232,.09);text-align:center}
footer .brand{font-size:26px;display:inline-block;margin-bottom:18px}
footer nav{position:static;padding:0;display:block}
.flinks{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}
.flinks a{color:rgba(245,240,232,.55);text-decoration:none;font-size:14.5px;font-weight:600}
.flinks a:hover{color:var(--or)}
.rs{display:flex;gap:12px;justify-content:center;margin-bottom:24px}
.rs a{width:42px;height:42px;border-radius:50%;background:rgba(245,240,232,.07);display:flex;align-items:center;justify-content:center;transition:.22s}
.rs a:hover{background:var(--or);transform:translateY(-2px)}
.rs svg{width:19px;height:19px;fill:var(--cr)}
.cop{font-size:13.5px;color:rgba(245,240,232,.38);line-height:1.7}

/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}

@media(max-width:860px){
  .gamme-grid{grid-template-columns:1fr}
  .gamme-grid.rev>div:first-child{order:0}
  .hero::after{background:linear-gradient(180deg,rgba(11,22,40,.86) 0%,rgba(11,22,40,.55) 42%,rgba(11,22,40,.30) 68%,rgba(11,22,40,.92) 100%)}
  .hero-in{padding:104px 22px 90px;display:flex;align-items:flex-start}
  .hero-txt{max-width:none}
  nav ul{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);background:rgba(11,22,40,.985);backdrop-filter:blur(18px);
    flex-direction:column;justify-content:center;gap:30px;transform:translateX(100%);transition:transform .34s cubic-bezier(.4,0,.2,1)}
  nav ul.open{transform:none}
  nav a.nl{font-size:19px}
  .burger{display:flex;z-index:120}
  .burger.x span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .burger.x span:nth-child(2){opacity:0}
  .burger.x span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  table.cmp{font-size:14.5px}
  table.cmp th,table.cmp td{padding:12px 8px}
  section{padding:74px 22px}
}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.scrollcue i{animation:none}}

/* ---------- EN-TETE DE PAGE INTERIEURE ---------- */
.ph-hero{padding:150px 28px 60px;background:linear-gradient(160deg,rgba(232,113,42,.13),rgba(11,22,40,0) 60%)}
.ph-hero.bd{background:linear-gradient(160deg,rgba(43,82,201,.16),rgba(11,22,40,0) 60%)}
.ph-hero h1{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(32px,6vw,54px);line-height:1.1;margin-bottom:16px}
.ph-hero .lede{font-size:clamp(17px,2.4vw,20px);line-height:1.65;color:rgba(245,240,232,.72);max-width:620px}
nav a.nl.on{color:var(--or)}
nav a.nl.on::after{width:100%}

/* ---------- FORMULAIRE NEWSLETTER INFOMANIAK ---------- */
.pp-form{text-align:left}
.pp-form-wrap{display:block}
.pp-content{display:flex;flex-direction:column;gap:14px}
.pp-email{width:100%;padding:16px 20px !important;background:rgba(255,255,255,.04) !important;border:1px solid rgba(232,113,42,.3) !important;border-radius:999px !important;color:var(--cr) !important;font-family:'Nunito',sans-serif !important;font-size:16px !important;height:auto !important;box-sizing:border-box;outline:none;transition:border-color .2s}
.pp-email::placeholder{color:rgba(245,240,232,.35)}
.pp-email:focus{border-color:var(--or) !important}
.pp-consent{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:rgba(245,240,232,.5);cursor:pointer;text-align:left}
.pp-consent input[type=checkbox]{margin-top:4px;flex-shrink:0;width:18px;height:18px;cursor:pointer;accent-color:var(--or)}
.pp-submit-wrap{text-align:center;margin-top:8px}
.pp-submit{background:linear-gradient(135deg,var(--or),#F5923E) !important;color:#fff !important;border:none !important;padding:16px 40px !important;border-radius:999px !important;font-family:'Nunito',sans-serif !important;font-weight:800 !important;font-size:17px !important;cursor:pointer !important;box-shadow:0 8px 24px rgba(232,113,42,.25);transition:transform .2s,box-shadow .2s;width:auto !important;height:auto !important}
.pp-submit:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(232,113,42,.35)}
.pp-submit.disabled{opacity:.4;cursor:not-allowed !important;transform:none !important}
.pp-email{border-color:#cc0033 !important}
.pp-block{max-width:480px;margin:28px auto 0}