/* Preview carte-blister.com au format cbs-emballages.com (v8) — 27/10 — LOCAL, noindex */
@font-face{font-family:"Inter";src:url(/assets/fonts/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--navy:#003366;--green:#1C8048;--foot:#092142;--ink:#0f1f33;--muted:#5a6b7d;--line:#e2e8f0;--bg:#f5f5f5;--ph:#e6e9ed;--r-panel:32px;--r-card:24px;--r-pill:999px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--navy)}
img{max-width:100%;height:auto}
.wrap{max-width:1320px;margin:0 auto;padding:0 clamp(16px,3vw,32px)}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:999}
/* bandeau preview */
.pv-flag{background:#fff7d6;color:#5c4a00;font-size:12.5px;text-align:center;padding:6px 12px;border-bottom:1px solid #eadc9a}
/* barre groupe */
.cbs-top{background:var(--foot);color:rgba(255,255,255,.8);font-size:13px}
.cbs-top .in{max-width:1320px;margin:0 auto;padding:10px 32px;display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap}
.cbs-top .lab{color:rgba(255,255,255,.55);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.cbs-top a{color:rgba(255,255,255,.88);text-decoration:none}.cbs-top a:hover{color:#5BC889}
.cbs-top .all{padding-left:22px;border-left:1px solid rgba(255,255,255,.2);color:#5BC889}
/* header pilule */
.hd{position:sticky;top:12px;z-index:100;padding:12px clamp(16px,2vw,32px) 0}
.hd-in{max-width:1320px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--r-pill);display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 12px 10px 26px}
.brand{display:flex;flex-direction:column;line-height:1;text-decoration:none}
.brand .wm{font-weight:800;letter-spacing:.02em;color:var(--navy);font-size:19px}
.brand .dom{color:var(--green);font-size:12px;font-weight:600;margin-top:4px}
.nav{display:flex;align-items:center;gap:20px}
.nav a{color:var(--navy);font-size:13.5px;font-weight:500;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-color:var(--green)}
.hd-act{display:flex;align-items:center;gap:10px}
.lang{position:relative;font-size:13px}
.lang summary{list-style:none;cursor:pointer;color:var(--navy);font-weight:600;padding:8px 10px}
.lang summary::-webkit-details-marker{display:none}
.lang ul{position:absolute;right:0;top:100%;background:#fff;border:1px solid var(--line);border-radius:16px;list-style:none;margin:6px 0 0;padding:8px;min-width:150px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.lang li a{display:block;padding:5px 10px;text-decoration:none;color:var(--ink)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;color:var(--navy);font:600 13px Inter,sans-serif}
/* boutons */
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:var(--r-pill);border:1.5px solid transparent;padding:12px 22px;font-weight:600;font-size:15px;text-decoration:none;line-height:1.2;cursor:pointer}
.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:#166a3b}
.btn-out{border-color:var(--navy);color:var(--navy);background:transparent}.btn-out:hover{background:var(--navy);color:#fff}
.btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}
.btn-sm{padding:10px 18px;font-size:13.5px}
/* overline */
.eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin:0}
.eyebrow::before{content:"";width:18px;height:6px;border-radius:var(--r-pill);background:var(--green);flex:none}
/* hero */
.hero{padding:28px 0 40px}
.hero-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-panel);display:grid;grid-template-columns:5fr 6fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(24px,4vw,56px)}
.hero-panel.short{min-height:0}
.hero-home .hero-panel{min-height:min(78vh,680px)}
.hero h1{color:var(--navy);font-size:clamp(34px,4.2vw,52px);font-weight:700;letter-spacing:-.025em;line-height:1.08;margin:18px 0 0;text-wrap:balance}
.hero .lead{font-size:17px;color:#33475b;margin:18px 0 0;max-width:56ch}
.hero .lead strong{color:var(--ink)}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero .hc{margin:22px 0 0;font-size:14px;font-weight:600}
.hero .hc a{text-decoration:none}
.crumbs ol{list-style:none;display:flex;gap:6px;padding:0;margin:0 0 16px;font-size:13px;color:var(--muted)}
.crumbs li+li::before{content:"›";margin-right:6px}
.crumbs a{color:var(--navy);text-decoration:none;font-weight:600}
.infobox{background:var(--navy);color:rgba(255,255,255,.88);border-radius:var(--r-card);padding:32px 36px;font-size:15.5px}
.infobox p{margin:0 0 12px}.infobox a{color:#fff;font-weight:600;text-decoration:none}
/* emplacement photo neutre */
.ph{background:var(--ph);border-radius:var(--r-card);display:flex;align-items:center;justify-content:center;text-align:center;color:#6b7785;font-size:13.5px;font-weight:500;padding:20px;aspect-ratio:4/3;width:100%}
.ph span{max-width:32ch}
.stage{position:relative}
.stage .ph{aspect-ratio:4/3}
.chips{position:absolute;left:14px;right:14px;bottom:14px;background:#fff;border-radius:var(--r-pill);display:flex;align-items:center;gap:4px;padding:6px;flex-wrap:wrap}
.chips a{font-size:13px;font-weight:600;color:var(--navy);text-decoration:none;padding:8px 14px;border-radius:var(--r-pill)}
.chips a:first-child{background:var(--navy);color:#fff}
.chips .go{margin-left:auto;color:var(--green)}
/* sections */
.sec{padding:72px 0}
.sec.white{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec.grey{background:var(--bg)}
.sec h2,.sec .h2{color:var(--navy);font-size:clamp(28px,3.2vw,44px);font-weight:700;letter-spacing:-.02em;line-height:1.12;margin:14px 0 22px;text-wrap:balance}
.sec .h3,.sec h3{color:var(--navy);font-size:19px;font-weight:700;margin:22px 0 10px;line-height:1.3}
.sec p{margin:0 0 14px;max-width:72ch}
.prose{max-width:none}
/* gabarit page intérieure : grand titre à gauche, contenu à droite (comme v8-sm) — sans limite de hauteur */
.cnt{display:grid;grid-template-columns:4fr 8fr;gap:clamp(24px,5vw,72px)}
.cnt .side{position:sticky;top:110px;align-self:start}
.cnt .side .num{font-size:13px;font-weight:700;color:var(--green);letter-spacing:.1em}
.cnt .body{min-width:0}
.cnt .body > *:first-child{margin-top:0}
.ed-list{list-style:none;padding:0;margin:0;display:grid;gap:0}
.ed-list.two{grid-template-columns:1fr 1fr;column-gap:40px}
.ed-list li{border-top:1px solid var(--line);padding:12px 0 12px 22px;position:relative}
.ed-list li::before{content:"";position:absolute;left:0;top:22px;width:10px;height:2px;background:var(--green)}
table.spec,table{width:100%;border-collapse:collapse;font-size:15.5px;margin:6px 0 18px}
table th,table td{text-align:left;vertical-align:top;padding:13px 0;border-top:1px solid var(--line)}
table th{width:42%;color:var(--navy);font-weight:600;padding-right:24px}
.ed-row{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,56px);align-items:start}
.ed-row.rev .ed-fig{order:0}
.ed-fig{margin:0}
.cbsx-box{background:var(--bg);border-radius:var(--r-card);padding:26px;margin-bottom:22px}
.cbsx-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cbsx-tag{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.cbsx-uses,.cbsx-opt ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.cbsx-uses li,.cbsx-opt li{border-left:3px solid var(--green);padding:2px 0 2px 12px}
/* étapes numérotées (accueil) */
.sm{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,5vw,72px)}
.sm-title{color:var(--navy);font-size:clamp(30px,3.6vw,50px);font-weight:700;letter-spacing:-.02em;line-height:1.12;margin:16px 0 0;max-width:16ch}
.sm-intro{color:#33475b;margin-top:22px}
.steps{list-style:none;margin:0;padding:0}
.steps li{display:grid;grid-template-columns:56px 1fr;gap:14px;padding:22px 0;border-top:1px solid #d9dee5}
.steps .n{font-size:13px;font-weight:700;color:var(--green);letter-spacing:.08em;padding-top:4px}
.steps h3{margin:0 0 6px;font-size:19px;color:var(--navy)}
.steps p{margin:0;color:#33475b}
/* produits (accueil) : index en lignes, pas de grille de cartes identiques */
.prods-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}
.prod{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding:36px 0;border-top:1px solid var(--line)}
.prod:nth-child(even) .ph{order:2}
.prod h3{font-size:clamp(24px,2.4vw,32px);color:var(--navy);margin:8px 0 12px;letter-spacing:-.015em}
.prod .more{font-weight:600;color:var(--green);text-decoration:none}
.also{display:flex;flex-wrap:wrap;gap:10px 26px;padding-top:26px;border-top:1px solid var(--line);font-size:15px}
.also b{color:var(--muted);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.also a{color:var(--navy);font-weight:600;text-decoration:none}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;padding:0;list-style:none}
.tags li{border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 16px;font-size:14px;font-weight:600;color:var(--navy);background:#fff}
/* emplacement textes à restaurer — extensible, aucune hauteur fixe */
.restore{border:1.5px dashed #b9c3cf;border-radius:var(--r-card);padding:22px 26px;margin:28px 0 0;color:var(--muted);font-size:14px;background:rgba(255,255,255,.6)}
.restore b{color:var(--navy)}
/* bandeau CTA navy */
.band{background:var(--navy);color:#fff;padding:64px 0}
.band .in{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.band h2{font-size:clamp(26px,3vw,40px);margin:0 0 8px;letter-spacing:-.02em;color:#fff}
.band p{margin:0;color:rgba(255,255,255,.8)}
.band .ctas{display:flex;gap:12px;flex-wrap:wrap}
/* contact / devis */
.cpanel{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,56px);background:#fff;border:1px solid var(--line);border-radius:var(--r-panel);padding:clamp(24px,4vw,56px)}
.nap{font-style:normal;font-size:15.5px}
.nap dt{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:16px}
.nap dd{margin:4px 0 0}
form.devis label,form label{display:block;font-size:13.5px;font-weight:600;color:var(--navy);margin:14px 0 6px}
form input,form textarea,form select{width:100%;border:1px solid #cfd7e1;border-radius:14px;padding:12px 14px;font:inherit;background:#fff}
form textarea{min-height:130px}
form .row2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
form .note{font-size:12.5px;color:var(--muted);margin-top:12px}
form button{margin-top:18px}
/* pages légales / longues : colonne lisible, longueur illimitée */
.legal{max-width:860px}
.legal h2,.legal .h2{font-size:24px;margin-top:34px}
/* pied de page */
.foot{background:var(--foot);color:rgba(255,255,255,.75);font-size:15px;line-height:1.8;padding:64px 0 0}
.foot a{color:rgba(255,255,255,.8);text-decoration:none}.foot a:hover{color:#fff}
.foot-main{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:48px}
.foot .name{color:#fff;font-weight:800;font-size:19px;letter-spacing:.02em}
.foot .dom{color:#5BC889;font-size:12.5px;font-weight:600}
.foot .desc{font-size:14px;margin-top:16px;max-width:34ch}
.foot h3{color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px;font-weight:700}
.foot h3::after{content:"";display:block;width:22px;height:2px;background:var(--green);margin-top:8px}
.foot ul{list-style:none;margin:0;padding:0}
.foot address{font-style:normal;font-size:14.5px}
.group{border-top:1px solid rgba(255,255,255,.1);padding:40px 0 44px;text-align:center}
.group .label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);font-weight:700;margin-bottom:20px}
.group ul{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 34px;max-width:980px;margin:0 auto}
.group a{font-size:17px;color:#fff;padding:4px 0}
.group a:hover{text-decoration:underline;text-underline-offset:5px}
.legalbar{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;font-size:13px;color:rgba(255,255,255,.55);display:flex;gap:14px;flex-wrap:wrap}
.legalbar a{color:rgba(255,255,255,.65)}
/* responsive */
@media (max-width:1100px){.nav{display:none}.burger{display:inline-block}.hd.open .nav{display:flex;flex-direction:column;align-items:flex-start;position:absolute;left:16px;right:16px;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:16px 22px}}
@media (max-width:860px){
 .hero-panel,.cnt,.sm,.prod,.ed-row,.cpanel,.cbsx-grid{grid-template-columns:1fr}
 .cnt .side{position:static}
 .prod:nth-child(even) .ph{order:0}
 .ed-list.two{grid-template-columns:1fr}
 .foot-main{grid-template-columns:1fr 1fr}
 .hero-home .hero-panel{min-height:0}
 .hd-act .hdr-cta{display:none}
 .sec{padding:52px 0}
 table th{width:auto;display:block;border-top:1px solid var(--line);padding-bottom:2px}
 table td{display:block;border-top:0;padding-top:2px}
 form .row2{grid-template-columns:1fr}
 .chips{position:static;margin-top:10px;border:1px solid var(--line)}
 .cbs-top .all{border:0;padding-left:0}
}
@media (max-width:520px){.foot-main{grid-template-columns:1fr}.group ul{gap:12px 22px}.group a{font-size:16px}.brand .wm{font-size:16px}.hd-in{padding-left:18px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* ajustements gabarit intérieur 27/10 */
.cnt{grid-template-columns:1fr 9fr}
.cnt .ed-row{grid-template-columns:1fr}
.cnt .ed-row .ph{aspect-ratio:16/7}
.cnt .cbsx-grid{grid-template-columns:1fr 1fr}
.sec .body h2,.sec .body .h2{max-width:24ch}
@media (max-width:860px){.cnt{grid-template-columns:1fr;gap:8px}.cnt .cbsx-grid{grid-template-columns:1fr}.cnt .ed-row .ph{aspect-ratio:4/3}}
/* restauration 27/10 : sous-titres accueil, Pour qui, légendes photo */
.fin3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.fin3.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.fin3>div{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:24px 24px 22px}
.sec.white .fin3>div{background:#f5f5f5;border-color:transparent}
.fin3 h3{font-size:18px;color:var(--navy);margin:0 0 10px}
.fin3 p{margin:0 0 12px;line-height:1.6}
.capgrid{display:grid;gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}
.capgrid.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.capgrid.n1{grid-template-columns:minmax(0,640px)}
.capfig{margin:0}
.capfig .ph{aspect-ratio:4/3}
.capfig figcaption{font-size:14px;color:#4b5563;margin-top:10px;line-height:1.45}
.prose .capfig{margin:18px 0 24px;max-width:640px}
.sig{font-size:14px;color:#4b5563}
@media (max-width:860px){.fin3,.fin3.two,.capgrid,.capgrid.n2{grid-template-columns:1fr}}

/* photos libres (27/10) : mêmes proportions que les cadres */
.ph-img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-card);background:var(--ph)}
.cnt .ed-row .ph-img{aspect-ratio:16/7}
@media (max-width:860px){.cnt .ed-row .ph-img{aspect-ratio:4/3}}
.cnt{grid-template-columns:minmax(170px,1.6fr) 9fr}
.legal .spec th,.legal .spec td{padding-right:28px;vertical-align:top}

/* v7 bas de page (27/10, validée par Fred sur cbs-emballages.com, adaptée à carte-blister.com) */
.foot h3::after{content:none;display:none}
.foot .foot-brand{align-self:center}
.foot .foot-brand .name{text-decoration:underline;text-decoration-color:#5BC889;text-decoration-thickness:2px;text-underline-offset:8px}

/* Achille 28/10 ~15h22 : RDV défaut = fond blanc + texte bleu logo + hover bleu plein. Footer RDV = BLANC (pas vert), même sur fond footer bleu. VERT uniquement section/bloc bleu hors footer. */
.rdv-cta{margin:24px 0 0}
.btn-rdv{background:#fff;color:var(--navy);border:1.5px solid var(--navy);min-height:48px;padding:0 26px;justify-content:center;transition:background .22s ease,color .22s ease,border-color .22s ease}
.btn-rdv:hover,.btn-rdv:focus-visible{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-rdv:focus-visible{outline:2px solid var(--navy);outline-offset:3px}

.foot .contact ul{list-style:none;margin:0;padding:0}
.foot .contact li{margin-bottom:8px;white-space:nowrap}
.foot .contact .rdv{margin-top:18px}
.foot a.btn-rdv{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 22px;background:transparent;color:#fff;border:2px solid #fff;border-radius:5px;font-weight:600;font-size:15px;text-decoration:none;line-height:1.2;transition:background .22s ease,color .22s ease,border-color .22s ease}
.foot a.btn-rdv:hover,.foot a.btn-rdv:focus-visible{background:rgba(255,255,255,.12);color:#fff;border-color:#fff}
.foot a.btn-rdv:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (max-width:640px){.foot .contact .rdv{display:flex;justify-content:center}}
/* Fred 27/10 20h01 : colonne Contact mesurée sur la référence (getComputedStyle) : 15px / 27px / mb 8px / 400, couleur rgba(255,255,255,.75), CBS Emballages non gras */
.foot .contact li{font-size:15px;line-height:27px;margin-bottom:8px;font-weight:400;color:rgba(255,255,255,.75)}
.foot .contact li a:not(.btn-rdv){color:inherit}
.foot .contact li.rdv{margin-top:18px}

/* Achille 14h50 */
.hero .eyebrow::before{display:none;content:none;width:0}
.lang summary{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.lang summary .cb-globe{flex:none;opacity:.85}

/* PREVIEW Achille 2810 — Nos domaines : une seule rangée (pas multi-lignes) */
.dom-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px;align-items:stretch}
.dom-card{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:#fff;border:1px solid rgba(9,33,66,.08);text-decoration:none;color:inherit;box-shadow:0 8px 24px rgba(9,33,66,.06)}
.dom-card .ph-img{width:100%;height:180px;object-fit:cover;display:block;background:#f3f5f8}
.dom-label{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px}
.dom-label .eyebrow{margin:0;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#5a6b7d}
.dom-label strong{font-size:16px;color:#092142}
@media (max-width:720px){
  .dom-row{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding-bottom:6px}
  .dom-card{flex:0 0 78%;scroll-snap-align:start}
  .dom-card .ph-img{height:150px}
}
/* desk: force single row even on mid widths */
@media (min-width:721px){
  .dom-row{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}

/* Achille voix 28/10 15h08 — RDV haut : texte bleu logo, fond blanc, hover bleu plein */
.hd-act .btn-rdv-top{background:#fff;color:var(--navy);border:1.5px solid var(--navy);transition:background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}
.hd-act .btn-rdv-top:hover,.hd-act .btn-rdv-top:focus-visible{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 4px 14px rgba(0,51,102,.18)}
.nav a.nav-rdv{font-weight:600;color:var(--navy)}
@media (max-width:860px){.hd-act .hdr-rdv{display:none}}
