/* ===== Multi-brand skins (additive; only active under html[data-skin]) ===== */
html[data-skin]{--fontHead:inherit;--fontBody:inherit}
html[data-skin] body{font-family:var(--fontBody)}
html[data-skin] h1,html[data-skin] h2,html[data-skin] h3{font-family:var(--fontHead)}

/* ---------- Peptide Pen: clinical-precision blue, slate, glass ---------- */
html[data-skin=pp]{--red:#046bd2;--red2:#045cb4;--heroDark:#1e293b;--ink:#0f172a;--ink2:#1e293b;--mut:#64748b;--line:#e2e8f0;--bg:#f5f8fc;--r:18px;
  --ppGrad:linear-gradient(135deg,#046bd2 0%,#045cb4 45%,#1e293b 100%);--sh:0 1px 2px rgba(15,23,42,.04),0 10px 30px -10px rgba(4,92,180,.18)}
html[data-skin=pp] body{background:radial-gradient(1200px 500px at 85% -10%,rgba(4,107,210,.08),transparent 60%),var(--bg);letter-spacing:-.005em}
html[data-skin=pp] h1,html[data-skin=pp] h2{letter-spacing:-.03em;font-weight:800}
html[data-skin=pp] .ann{background:#1e293b;color:#cbd5e1;letter-spacing:.04em;font-size:12px}
html[data-skin=pp] .top{background:rgba(255,255,255,.82);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid rgba(226,232,240,.8)}
html[data-skin=pp] .top .brand img,html[data-skin=pp] .foot .brand img,html[data-skin=pp] .chd img{width:auto;height:34px;border-radius:0;object-fit:contain;background:none}
html[data-skin=pp] .top .brand span,html[data-skin=pp] .foot .brand span{display:none}
html[data-skin=pp] .foot .brand img{filter:brightness(0) invert(1);height:30px}
html[data-skin=pp] .hero{background:var(--ppGrad)!important;position:relative;overflow:hidden;color:#fff}
html[data-skin=pp] .hero::before{content:"";position:absolute;inset:0;background:
  repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 28px),
  radial-gradient(600px 300px at 90% 120%,rgba(56,189,248,.35),transparent 70%);pointer-events:none}
html[data-skin=pp] .hero::after{content:"";position:absolute;right:-40px;top:50%;width:420px;height:46px;transform:translateY(-50%) rotate(-18deg);border-radius:24px;
  background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(226,232,240,.75) 70%,#94a3b8 71%,#cbd5e1);box-shadow:0 30px 60px rgba(2,6,23,.45);opacity:.9;pointer-events:none}
html[data-skin=pp] .hero h1{font-size:clamp(30px,5vw,54px);max-width:640px;position:relative}
html[data-skin=pp] .hero p,html[data-skin=pp] .hero .btn,html[data-skin=pp] .hero .pill{position:relative}
html[data-skin=pp] .hero .btn{background:#fff;color:#045cb4;box-shadow:0 10px 30px rgba(2,6,23,.25)}
html[data-skin=pp] .btn.red,html[data-skin=pp] .add,html[data-skin=pp] .satc .btn{background:linear-gradient(180deg,#0a78e6,#045cb4);box-shadow:0 6px 18px -6px rgba(4,107,210,.6)}
html[data-skin=pp] .pill.red{background:rgba(4,107,210,.1);color:#045cb4}
html[data-skin=pp] .card,html[data-skin=pp] .pc{border:1px solid var(--line);border-radius:var(--r);transition:transform .25s,box-shadow .25s,border-color .25s}
html[data-skin=pp] .pc:hover{transform:translateY(-3px);border-color:rgba(4,107,210,.35);box-shadow:0 18px 40px -16px rgba(4,92,180,.35)}
html[data-skin=pp] .trust>div{border-radius:14px}
html[data-skin=pp] .trust svg{color:#046bd2}
html[data-skin=pp] .gcard{--g:linear-gradient(135deg,#046bd2,#1e293b)!important}
html[data-skin=pp] .foot{background:#1e293b;color:#cbd5e1}
html[data-skin=pp] .cbub{background:var(--ppGrad)}
html[data-skin=pp] .price{color:#045cb4}
/* PP info panel on product pages */
.ppx{margin:18px 0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ppx .tile{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;position:relative;overflow:hidden}
.ppx .tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(#046bd2,#045cb4)}
.ppx h4{margin:0 0 8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#045cb4;display:flex;gap:8px;align-items:center}
.ppx ul{margin:0;padding-left:18px;font-size:14px;line-height:1.6;color:#1e293b}
.ppx .src{grid-column:1/-1;font-size:12px;color:#64748b}
.ppx .disc{grid-column:1/-1;font-size:12px;color:#64748b;background:#f1f5f9;border-radius:12px;padding:10px 14px}
html[data-skin=pp] .ppx ~ .infogrid .how{display:none}