/* =====================================================================
   CBS ATELIER — Pages produits. Préfixe .cbs-pp- (product page).
   Conçu pour les 5 pages produits : étiquettes, signalétique, PLV,
   objets pub, impression. Sections riches, SEO + conversion.
   ===================================================================== */

/* ---- Hero produit ------------------------------------------------- */
.cbs-pp-hero{position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(135deg,var(--navy-deep) 0%,var(--navy) 50%,var(--navy-2) 100%)}
.cbs-pp-hero::before{content:"";position:absolute;inset:0;opacity:.45;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.10) 1.4px,transparent 1.4px);background-size:26px 26px;
  -webkit-mask:radial-gradient(120% 100% at 85% 0%,#000,transparent 70%);
  mask:radial-gradient(120% 100% at 85% 0%,#000,transparent 70%)}
.cbs-pp-hero__in{position:relative;display:grid;grid-template-columns:1.32fr .82fr;
  gap:clamp(34px,4.5vw,68px);align-items:center;
  padding-top:clamp(56px,6vw,90px);padding-bottom:clamp(56px,6vw,88px)}
.cbs-pp-hero__title{font-size:clamp(2.1rem,1.4rem + 2.6vw,3.4rem);font-weight:800;color:#fff;
  margin:.3em 0 .6em;max-width:18ch;letter-spacing:-.025em;line-height:1.05}
.cbs-pp-hero__lead{font-size:clamp(1.05rem,.95rem + .4vw,1.2rem);color:#c6d2e6;
  max-width:54ch;margin-bottom:1.8rem;line-height:1.55}
.cbs-pp-hero__chips{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 1.9rem}
.cbs-pp-hero__chips li{font-size:.84rem;font-weight:600;padding:7px 14px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);
  border-radius:999px;color:#eaf0fa;backdrop-filter:blur(6px)}
.cbs-pp-hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:2.2rem}
.cbs-pp-hero__proof{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  font-size:.88rem;color:#aebed9;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.12)}
.cbs-pp-hero__proof strong{color:#fff;font-weight:600;letter-spacing:.02em}

/* ---- Generic photo placeholder, vide, discret -------------------- */
.cbs-pp-ph{display:grid;place-items:center;background:var(--tint);
  border:1px dashed var(--line);border-radius:var(--r-lg);position:relative;
  color:var(--muted);font-size:.78rem;font-style:italic;text-align:center;padding:18px}
.cbs-pp-ph::after{content:attr(data-label);max-width:80%;line-height:1.4;opacity:.7}
.cbs-pp-ph:has(img){padding:0;border:0;background:transparent}
.cbs-pp-ph:has(img)::after{display:none}
.cbs-pp-ph img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-lg);display:block}
.cbs-pp-ph--hero{aspect-ratio:4/5;background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.20);color:#aebed9}
.cbs-pp-ph--16x10{aspect-ratio:16/10}
.cbs-pp-ph--4x3{aspect-ratio:4/3}
.cbs-pp-ph--1x1{aspect-ratio:1/1}
.cbs-pp-ph--macro{aspect-ratio:5/4}

/* ---- Section : Anatomie d'une étiquette --------------------------- */
.cbs-pp-anatomy{padding:clamp(64px,8.5vw,116px) 0;background:#fff}
.cbs-pp-anatomy__in{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,5vw,80px);align-items:center}
.cbs-pp-anatomy__intro p{color:var(--body);font-size:1.05rem;max-width:48ch}
.cbs-pp-stack{display:flex;flex-direction:column;gap:14px;padding:clamp(28px,4vw,44px);
  background:linear-gradient(150deg,var(--navy-deep),var(--navy-2));border-radius:var(--r-lg);
  box-shadow:var(--sh);position:relative}
.cbs-pp-stack::before,.cbs-pp-stack::after{content:"";position:absolute;width:18px;height:18px;
  border:1.5px solid rgba(255,255,255,.4);border-radius:2px}
.cbs-pp-stack::before{top:14px;left:14px;border-right:0;border-bottom:0}
.cbs-pp-stack::after{bottom:14px;right:14px;border-left:0;border-top:0}
.cbs-pp-stack__layer{display:flex;align-items:center;gap:16px;padding:14px 20px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r);color:#fff;transition:transform .25s var(--ease),background .25s}
.cbs-pp-stack__layer:hover{transform:translateX(6px);background:rgba(255,255,255,.13)}
.cbs-pp-stack__n{flex:0 0 30px;height:30px;border-radius:50%;background:var(--accent);
  display:grid;place-items:center;font-weight:800;font-size:.92rem;color:#fff}
.cbs-pp-stack__name{font-weight:700;font-size:1.02rem;margin-bottom:2px}
.cbs-pp-stack__desc{font-size:.88rem;color:#b9c6dd;line-height:1.4}
.cbs-pp-stack__layer--adh .cbs-pp-stack__n{background:#19a7c5}
.cbs-pp-stack__layer--front .cbs-pp-stack__n{background:#f0b429;color:#16223d}

/* ---- Section : Matériauthèque ------------------------------------ */
.cbs-pp-mat{padding:clamp(64px,8.5vw,116px) 0;background:var(--tint)}
.cbs-pp-mat__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:48px}
.cbs-pp-mat__nav a{padding:9px 18px;background:#fff;border:1px solid var(--line);
  border-radius:999px;font-size:.88rem;font-weight:600;color:var(--ink);
  transition:background .2s,color .2s,border-color .2s}
.cbs-pp-mat__nav a:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.cbs-pp-mat__group{margin-bottom:60px;scroll-margin-top:90px}
.cbs-pp-mat__group:last-child{margin-bottom:0}
.cbs-pp-mat__grouph{display:flex;align-items:baseline;gap:14px;margin-bottom:24px;
  padding-bottom:14px;border-bottom:1px solid var(--line)}
.cbs-pp-mat__grouph h3{font-size:1.5rem;margin:0;color:var(--navy)}
.cbs-pp-mat__grouph small{color:var(--muted);font-size:.92rem;font-weight:500}
.cbs-pp-mat__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cbs-pp-matcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.cbs-pp-matcard:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:transparent}
.cbs-pp-matcard__ph{aspect-ratio:5/4;background:var(--tint-2);border-bottom:1px solid var(--line);
  display:grid;place-items:center;color:var(--muted);font-size:.74rem;font-style:italic;padding:12px;text-align:center;overflow:hidden}
.cbs-pp-matcard__ph:has(img),.cbs-pp-fincard__ph:has(img){padding:0}
.cbs-pp-matcard__ph img,.cbs-pp-fincard__ph img{width:100%;height:100%;object-fit:cover;display:block}
.cbs-pp-matcard__body{padding:22px 22px 24px}
.cbs-pp-matcard__name{font-family:var(--ff-display);font-weight:700;font-size:1.15rem;
  color:var(--navy);margin:0 0 8px}
.cbs-pp-matcard__desc{color:var(--body);font-size:.94rem;margin:0 0 14px;line-height:1.5}
.cbs-pp-matcard__tags{display:flex;flex-wrap:wrap;gap:6px}
.cbs-pp-matcard__tags li{font-size:.74rem;font-weight:600;padding:4px 10px;
  background:var(--tint);color:var(--navy);border-radius:999px;letter-spacing:.02em}
.cbs-pp-matcard__tags li.is-accent{background:#fdebe7;color:var(--accent-700)}

.cbs-pp-sample{margin-top:40px;background:#fff;border:1.5px dashed var(--accent);
  border-radius:var(--r-lg);padding:clamp(24px,4vw,38px);display:grid;
  grid-template-columns:auto 1fr auto;gap:clamp(20px,3vw,38px);align-items:center}
.cbs-pp-sample__ico{width:54px;height:54px;border-radius:14px;background:var(--accent);
  color:#fff;display:grid;place-items:center;flex:0 0 54px}
.cbs-pp-sample h3{margin:0 0 4px;font-size:1.25rem;color:var(--navy)}
.cbs-pp-sample p{margin:0;color:var(--muted);font-size:.96rem}

/* ---- Section : Adhésifs & résistances ----------------------------- */
.cbs-pp-adh{padding:clamp(64px,8.5vw,116px) 0;background:#fff}
.cbs-pp-adh__table{width:100%;border-collapse:collapse;margin-top:34px;
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.cbs-pp-adh__table thead{background:var(--navy);color:#fff}
.cbs-pp-adh__table th{padding:18px 20px;text-align:left;font-weight:700;font-size:.9rem;
  letter-spacing:.04em;text-transform:uppercase}
.cbs-pp-adh__table td{padding:18px 20px;border-top:1px solid var(--line-soft);
  vertical-align:top;font-size:.96rem;color:var(--body)}
.cbs-pp-adh__table tr:hover td{background:var(--tint)}
.cbs-pp-adh__table strong{color:var(--navy)}
.cbs-pp-adh__badge{display:inline-block;font-size:.74rem;font-weight:700;padding:3px 9px;
  border-radius:999px;background:var(--tint);color:var(--navy);letter-spacing:.02em}
.cbs-pp-adh__badge--cold{background:#dff2f9;color:#0e6177}
.cbs-pp-adh__badge--food{background:#e7f5ec;color:#1d6b35}
.cbs-pp-adh__badge--hot{background:#fdebe7;color:var(--accent-700)}

/* ---- Section : Finitions ----------------------------------------- */
.cbs-pp-fin{padding:clamp(64px,8.5vw,116px) 0;background:var(--tint)}
.cbs-pp-fin__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px}
.cbs-pp-fincard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.cbs-pp-fincard:hover{transform:translateY(-5px);box-shadow:var(--sh)}
.cbs-pp-fincard__ph{aspect-ratio:5/4;background:var(--tint-2);
  display:grid;place-items:center;color:var(--muted);font-size:.78rem;font-style:italic;padding:14px;text-align:center;overflow:hidden}
.cbs-pp-fincard__body{padding:24px 26px 26px}
.cbs-pp-fincard h3{font-size:1.2rem;color:var(--navy);margin:0 0 .5rem}
.cbs-pp-fincard p{color:var(--body);font-size:.95rem;margin:0 0 .8rem}
.cbs-pp-fincard__use{font-size:.84rem;color:var(--muted);font-style:italic}
.cbs-pp-fin__combo{margin-top:32px;background:var(--navy);color:#fff;border-radius:var(--r-lg);
  padding:clamp(26px,3.5vw,40px);display:flex;align-items:center;gap:22px}
.cbs-pp-fin__combo svg{width:36px;height:36px;color:var(--accent);flex:0 0 36px}
.cbs-pp-fin__combo p{margin:0;font-size:1.05rem;line-height:1.5}

/* ---- Section : Procédés ----------------------------------------- */
.cbs-pp-proc{padding:clamp(64px,8.5vw,116px) 0;background:#fff}
.cbs-pp-proc__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:8px}
.cbs-pp-proccard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 26px 28px;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s}
.cbs-pp-proccard:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:transparent}
.cbs-pp-proccard h3{font-size:1.18rem;color:var(--navy);margin:0 0 .35rem}
.cbs-pp-proccard__sub{font-size:.82rem;color:var(--accent);font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;margin-bottom:1rem}
.cbs-pp-proccard__specs{margin:0 0 1rem;font-size:.9rem}
.cbs-pp-proccard__specs li{padding:7px 0;border-bottom:1px solid var(--line-soft);
  color:var(--body);display:flex;justify-content:space-between;gap:10px}
.cbs-pp-proccard__specs li:last-child{border-bottom:0}
.cbs-pp-proccard__specs strong{color:var(--navy);font-weight:600}
.cbs-pp-proccard__when{margin-top:auto;padding:14px 16px;background:var(--tint);
  border-radius:var(--r);font-size:.88rem;color:var(--body);line-height:1.5}

/* ---- Section : Secteurs / cas d'usage --------------------------- */
.cbs-pp-sec{padding:clamp(64px,8.5vw,116px) 0;background:var(--tint)}
.cbs-pp-sec__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cbs-pp-seccard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 28px 28px;transition:transform .3s,box-shadow .3s,border-color .3s;
  display:flex;flex-direction:column}
.cbs-pp-seccard:hover{transform:translateY(-5px);box-shadow:var(--sh);border-color:transparent}
.cbs-pp-seccard__ico{display:inline-flex;width:54px;height:54px;border-radius:14px;
  align-items:center;justify-content:center;background:var(--tint);color:var(--navy);
  margin-bottom:18px;transition:background .3s,color .3s}
.cbs-pp-seccard:hover .cbs-pp-seccard__ico{background:var(--navy);color:#fff}
.cbs-pp-seccard h3{font-size:1.22rem;color:var(--navy);margin:0 0 .55rem}
.cbs-pp-seccard p{color:var(--body);font-size:.95rem;margin:0 0 1rem}
.cbs-pp-seccard__list{font-size:.88rem;color:var(--body);margin:0 0 1.2rem;line-height:1.55}
.cbs-pp-seccard__list li{padding-left:18px;position:relative;margin-bottom:5px}
.cbs-pp-seccard__list li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:2px;
  background:var(--accent);border-radius:2px}

/* ---- Section : Process en 5 étapes ------------------------------- */
.cbs-pp-flow{padding:clamp(64px,8.5vw,116px) 0;background:var(--navy);color:#e7ecf6}
.cbs-pp-flow .cbs-sechead--light .cbs-h2{color:#fff}
.cbs-pp-flow__steps{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;
  margin-top:1rem;counter-reset:cbsflow}
.cbs-pp-flow__step{position:relative;padding-top:30px;border-top:2px solid rgba(255,255,255,.18);
  counter-increment:cbsflow}
.cbs-pp-flow__step::before{content:counter(cbsflow,decimal-leading-zero);
  font-family:var(--ff-display);font-size:2.4rem;font-weight:800;color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.5);display:block;line-height:1;margin-bottom:.6rem}
.cbs-pp-flow__step h3{font-size:1.16rem;color:#fff;margin:0 0 .4rem}
.cbs-pp-flow__step p{color:#aeb9d2;font-size:.92rem;margin:0;line-height:1.55}
.cbs-pp-flow__step time{display:inline-block;margin-top:8px;font-size:.78rem;font-weight:700;
  color:var(--accent);text-transform:uppercase;letter-spacing:.1em}

/* ---- Section : Fichiers techniques ------------------------------- */
.cbs-pp-files{padding:clamp(64px,8.5vw,116px) 0;background:#fff}
.cbs-pp-files__card{background:var(--tint);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(34px,4.5vw,56px);display:grid;grid-template-columns:1.2fr 1fr;
  gap:clamp(34px,4.5vw,60px);align-items:start}
.cbs-pp-files__card h2{font-size:clamp(1.7rem,1.2rem + 1.6vw,2.3rem);color:var(--navy);margin:0 0 .8rem}
.cbs-pp-files__card>div>p{color:var(--body);margin:0 0 1.2rem}
.cbs-pp-files__specs{display:grid;gap:14px}
.cbs-pp-files__specs li{display:flex;align-items:flex-start;gap:14px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r);padding:14px 18px}
.cbs-pp-files__specs strong{display:block;color:var(--navy);font-weight:700;font-size:.97rem;margin-bottom:3px}
.cbs-pp-files__specs em{font-style:normal;color:var(--muted);font-size:.88rem;line-height:1.45}
.cbs-pp-files__specs svg{width:22px;height:22px;color:var(--accent);flex:0 0 22px;margin-top:1px}
.cbs-pp-files__note{margin-top:18px;padding:14px 18px;background:#fff;border-left:3px solid var(--accent);
  font-size:.92rem;color:var(--body)}

/* ---- Section : FAQ produit (variation cbs-acc, plus large) ------- */
.cbs-pp-faq{padding:clamp(64px,8.5vw,116px) 0;background:var(--tint)}
.cbs-pp-faq__in{max-width:920px;margin:0 auto}

/* ---- Section : Réalisations preview ------------------------------- */
.cbs-pp-real{padding:clamp(64px,8.5vw,116px) 0;background:#fff}
.cbs-pp-real__featured{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(28px,4vw,56px);
  margin-bottom:28px;align-items:center}
.cbs-pp-real__featured .cbs-pp-ph{aspect-ratio:4/3}
.cbs-pp-real__featured h3{font-size:1.6rem;color:var(--navy);margin:0 0 .6rem}
.cbs-pp-real__featured p{color:var(--body)}
.cbs-pp-real__featured .cbs-pp-real__meta{margin:1rem 0 1.4rem;display:flex;flex-wrap:wrap;gap:8px}
.cbs-pp-real__featured .cbs-pp-real__meta li{font-size:.78rem;font-weight:600;padding:5px 11px;
  background:var(--tint);color:var(--navy);border-radius:999px}
.cbs-pp-real__mini{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cbs-pp-real__mini .cbs-pp-ph{aspect-ratio:1/1}
.cbs-pp-real__cta{text-align:center;margin-top:38px}

/* ---- Section : CTA final ----------------------------------------- */
.cbs-pp-ctaband{padding:clamp(60px,7vw,100px) 0;background:#fff}

/* ====================================================================
   RESPONSIVE
   ==================================================================== */
@media (max-width:1080px){
  .cbs-pp-hero__in{grid-template-columns:1fr;gap:36px;
    padding-top:clamp(46px,6vw,70px);padding-bottom:clamp(48px,6vw,72px)}
  .cbs-pp-hero__art{order:-1;max-width:380px;margin-inline:auto;width:100%}
  .cbs-pp-anatomy__in,.cbs-pp-files__card{grid-template-columns:1fr;gap:34px}
}
@media (max-width:1024px){
  .cbs-pp-flow__steps{grid-template-columns:repeat(3,1fr);gap:24px}
  .cbs-pp-proc__grid{grid-template-columns:repeat(2,1fr)}
  .cbs-pp-mat__grid,.cbs-pp-fin__grid,.cbs-pp-sec__grid{grid-template-columns:repeat(2,1fr)}
  .cbs-pp-real__featured{grid-template-columns:1fr;gap:24px}
  .cbs-pp-sample{grid-template-columns:auto 1fr;gap:18px}
  .cbs-pp-sample .cbs-btn{grid-column:1/-1;justify-self:start}
}
@media (max-width:720px){
  .cbs-pp-mat__grid,.cbs-pp-fin__grid,.cbs-pp-sec__grid,.cbs-pp-proc__grid{grid-template-columns:1fr}
  .cbs-pp-flow__steps{grid-template-columns:1fr;gap:18px}
  .cbs-pp-real__mini{grid-template-columns:repeat(2,1fr)}
  .cbs-pp-adh__table{font-size:.86rem}
  .cbs-pp-adh__table th,.cbs-pp-adh__table td{padding:13px 14px}
  .cbs-pp-fin__combo{flex-direction:column;text-align:center;gap:14px}
}