/* ==========================================================
   Hackschnitzel von Schönfels — style.css
   Design sobre : fond blanc, texte noir, un seul accent couleur
   ========================================================== */

:root{
  --ink:#1A1A1A;
  --paper:#FFFFFF;
  --paper-2:#FAF8F4;
  --accent:#C1502E;
  --accent-light:#D97A54;
  --line:#E3DFD5;
  --muted:#6B675E;
  --radius:2px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  font-family:'Public Sans', system-ui, sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100vw;
}
h1,h2,h3,h4{
  font-family:'Bebas Neue','Public Sans',sans-serif;
  letter-spacing:0.02em;
  line-height:0.97;
  font-weight:400;
  color:var(--ink);
}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none;}

.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
section{padding:80px 0;}
.section-alt{background:var(--paper-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
@media(max-width:640px){ section{padding:52px 0;} .wrap{padding:0 20px;} }

/* ---------- stamp / badge ---------- */
.stamp{
  display:inline-flex; align-items:center; gap:8px;
  border:1.5px dashed currentColor;
  border-radius:999px;
  padding:6px 16px;
  font-family:'JetBrains Mono',monospace;
  font-size:11.5px;
  letter-spacing:0.13em;
  text-transform:uppercase;
  transform:rotate(-1.5deg);
}
.logs-icon{width:15px; height:15px; flex-shrink:0;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 28px;
  font-weight:700; font-size:14px;
  border-radius:var(--radius);
  border:1.5px solid transparent;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  font-family:'Public Sans';
}
.btn-accent{background:var(--accent); color:#fff;}
.btn-accent:hover{background:var(--accent-light); transform:translateY(-1px); box-shadow:0 8px 20px rgba(193,80,46,0.25);}
.btn-outline{border-color:var(--ink); color:var(--ink);}
.btn-outline:hover{background:var(--ink); color:#fff;}
.btn-sm{padding:9px 18px; font-size:12.5px;}

/* ---------- topbar ---------- */
.topbar{
  background:var(--ink); color:#C9C4B6;
  font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:0.05em;
}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding:9px 28px; flex-wrap:wrap; gap:6px 20px;}
.topbar strong{color:var(--accent-light);}

/* ---------- promo bar (Winter -15%, slide, sombre, sans tel/email) ---------- */
.promo-bar{background:var(--ink); color:#fff; overflow:hidden;}
.promo-bar .wrap{padding:0; text-align:center;}
.promo-slides{position:relative; height:38px; overflow:hidden;}
.promo-slide{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:12.5px; font-weight:600; padding:0 20px;
  opacity:0; transform:translateY(100%);
  animation: promoSlide 9s infinite;
}
.promo-slide strong{color:var(--accent-light); font-weight:800;}
.promo-slide:nth-child(1){animation-delay:0s;}
.promo-slide:nth-child(2){animation-delay:4.5s;}
@keyframes promoSlide{
  0%{opacity:0; transform:translateY(100%);}
  6%{opacity:1; transform:translateY(0);}
  45%{opacity:1; transform:translateY(0);}
  51%{opacity:0; transform:translateY(-100%);}
  100%{opacity:0; transform:translateY(-100%);}
}
@media(max-width:560px){ .promo-slide{font-size:11.5px; padding:0 44px;} }

/* ---------- prix : barre + promo -15% ---------- */
.price-block{display:flex; align-items:baseline; flex-wrap:wrap; gap:2px;}
.price-old{font-family:'JetBrains Mono'; font-size:14px; color:var(--muted); text-decoration:line-through; margin-right:8px;}
.price-new{font-family:'Bebas Neue'; font-size:32px; color:var(--accent);}
.promo-tag{display:inline-block; background:var(--accent); color:#fff; font-size:11px; font-weight:800; padding:3px 8px; border-radius:3px; margin-left:8px; vertical-align:middle;}
.price-old-sm{font-family:'JetBrains Mono'; font-size:11px; color:var(--muted); text-decoration:line-through; display:block;}
.price-new-sm{font-family:'Bebas Neue'; font-size:22px; color:var(--accent);}

/* ---------- header / nav ---------- */
header{background:var(--paper); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50;}
nav.wrap{display:flex; align-items:center; justify-content:space-between; padding:18px 28px; gap:20px;}
.logo{font-family:'Bebas Neue',sans-serif; font-size:25px; display:flex; align-items:center; gap:10px; line-height:0.85;}
.logo-badge{
  background:#F4EEE0; border-radius:50%;
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0; padding:4px;
}
.logo-img{height:36px; width:auto; display:block;}
header .logo-badge{background:transparent; width:auto; height:auto; padding:0;}
header .logo-img{height:44px;}
.logo-text{display:flex; flex-direction:column;}
.logo small{font-family:'JetBrains Mono'; font-size:9px; letter-spacing:0.2em; color:var(--accent); text-transform:uppercase; margin-top:5px;}
.nav-links{display:flex; gap:28px; font-size:14px; font-weight:600; align-items:center;}
.nav-links a{padding-bottom:4px; border-bottom:2px solid transparent; transition:border-color .2s ease, color .2s ease; color:var(--ink);}
.nav-links a:hover{border-color:var(--accent);}
.nav-links a.active{border-color:var(--accent); color:var(--accent);}
.nav-track{
  font-size:12.5px; font-weight:700; padding:9px 16px;
  border:1.5px solid var(--ink); border-radius:999px;
  display:inline-flex; align-items:center; gap:6px;
}
.nav-track:hover{background:var(--ink); color:#fff;}
.nav-cart{position:relative; font-size:19px; display:flex; align-items:center;}
.cart-count{
  position:absolute; top:-8px; right:-10px;
  background:var(--accent); color:#fff;
  font-family:'JetBrains Mono'; font-size:10px; font-weight:700;
  min-width:17px; height:17px; border-radius:999px;
  display:flex; align-items:center; justify-content:center; padding:0 3px;
}
.mobile-toggle{display:none; background:none; border:1px solid var(--line); border-radius:var(--radius); width:40px; height:40px; font-size:18px; cursor:pointer;}
#mobile-menu{display:none; flex-direction:column; gap:2px; border-top:1px solid var(--line); background:var(--paper);}
#mobile-menu.open{display:flex;}
#mobile-menu a{padding:14px 28px; border-bottom:1px solid var(--line); font-weight:600; font-size:14.5px;}
@media(max-width:900px){
  .nav-links{display:none;}
  .mobile-toggle{display:block;}
}

/* ---------- hero ---------- */
.hero .wrap{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; padding-top:70px; padding-bottom:60px;}
@media(max-width:900px){ .hero .wrap{grid-template-columns:1fr; padding-top:44px;} }
.hero-eyebrow{
  font-family:'JetBrains Mono'; font-size:12px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--accent); margin-bottom:16px; display:flex; align-items:center; gap:10px;
}
.hero-eyebrow::before{content:""; width:26px; height:1.5px; background:var(--accent); display:inline-block;}
.hero h1{font-size:clamp(38px,5.6vw,66px);}
.hero h1 em{font-style:normal; color:var(--accent);}
.hero p.lead{font-size:17.5px; color:var(--muted); max-width:48ch; margin:20px 0 30px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
.hero-stats{display:flex; gap:30px; margin-top:44px; flex-wrap:wrap;}
.hero-stats div{border-left:2px solid var(--ink); padding-left:14px;}
.hero-stats b{display:block; font-family:'Bebas Neue'; font-size:28px;}
.hero-stats span{font-size:12px; color:var(--muted);}

/* ---------- photo placeholder ---------- */
.photo-slot{
  border:1.5px dashed #B9B2A0;
  border-radius:var(--radius);
  background:var(--paper-2);
  aspect-ratio:4/3;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:9px; text-align:center; color:var(--muted); padding:22px;
}
.photo-slot svg{opacity:0.55;}
.photo-slot .ps-label{font-weight:700; font-size:13px; color:var(--ink);}
.photo-slot .ps-file{font-family:'JetBrains Mono'; font-size:10px; color:var(--accent); word-break:break-all;}
.hero .photo-slot{aspect-ratio:auto; min-height:360px;}
.hero img.real-photo{width:100%; min-height:360px; max-height:480px; object-fit:cover; object-position:center; border-radius:var(--radius); padding:0;}

/* ---------- gauge (signature element) ---------- */
.gauge{margin-top:32px; padding:18px 20px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper-2);}
.gauge-top{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:10px; flex-wrap:wrap; gap:4px;}
.gauge-top span{font-family:'JetBrains Mono'; font-size:11px; color:var(--muted); letter-spacing:0.07em; text-transform:uppercase;}
.gauge-top b{font-family:'Bebas Neue'; font-size:17px; color:var(--accent);}
.gauge-row{display:flex; gap:4px;}
.gauge-row .cell{flex:1; height:20px; border-radius:1px; background:#E9E3D3;}
.gauge-row .cell.fill{background:var(--accent);}
.gauge-caption{margin-top:8px; font-size:12px; color:var(--muted);}

/* ---------- trust strip ---------- */
.trust{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-2);}
.trust .wrap{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; padding:20px 28px;}
.trust .stamp{color:var(--ink);}

/* ---------- section head ---------- */
.sec-head{max-width:640px; margin-bottom:44px;}
.sec-eyebrow{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.15em; text-transform:uppercase; color:var(--accent); margin-bottom:12px; display:block;}
.sec-head h2{font-size:clamp(28px,3.6vw,42px);}
.sec-head p{color:var(--muted); margin-top:12px; font-size:15.5px; max-width:58ch;}
.sec-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------- tabs ---------- */
.tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px;}
.tab{
  padding:10px 20px; font-size:13px; font-weight:700;
  border:1.5px solid var(--line); border-radius:999px;
  background:transparent; color:var(--ink); cursor:pointer; font-family:'Public Sans';
  transition:all .2s ease;
}
.tab.active,.tab:hover{background:var(--ink); color:#fff; border-color:var(--ink);}

/* ---------- product grid / cards ---------- */
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media(max-width:940px){ .grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){ .grid{grid-template-columns:1fr;} }

.card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:0 14px 26px rgba(26,26,26,0.08);}
.card .photo-slot{border:none; border-bottom:1px solid var(--line); border-radius:0;}
.card-body{padding:18px 20px 20px; display:flex; flex-direction:column; gap:11px; flex:1;}
.card-cat{align-self:flex-start; font-size:10px; color:var(--accent);}
.card-body h3{font-family:'Public Sans'; font-size:16px; font-weight:700; letter-spacing:0; line-height:1.32;}
.specs{display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--muted);}
.specs li{display:flex; align-items:center; gap:7px;}
.specs li b{color:var(--ink); font-weight:600;}
.card-foot{margin-top:auto; padding-top:13px; border-top:1px dashed var(--line); display:flex; align-items:center; justify-content:space-between;}
.price{font-family:'Bebas Neue'; font-size:24px;}
.price .from{font-family:'JetBrains Mono'; font-size:10.5px; color:var(--muted); display:block; letter-spacing:0.06em; text-transform:uppercase; margin-bottom:-2px;}
.card-cta{
  font-size:12px; font-weight:700; padding:8px 14px;
  border:1.5px solid var(--ink); border-radius:var(--radius);
  background:none; cursor:pointer; transition:all .2s ease;
}
.card-cta:hover{background:var(--accent); border-color:var(--accent); color:#fff;}
.card-cta.added{background:#2E7D32; border-color:#2E7D32; color:#fff;}

/* ---------- certifications ---------- */
.cert-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media(max-width:860px){ .cert-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .cert-grid{grid-template-columns:1fr;} }
.cert-card{border:1px solid var(--line); padding:24px 20px; border-radius:var(--radius); background:var(--paper);}
.cert-card .stamp{color:var(--accent); margin-bottom:12px;}
.cert-card p{font-size:13px; color:var(--muted);}

/* ---------- process ---------- */
.process-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
@media(max-width:800px){ .process-grid{grid-template-columns:1fr;} }
.process-step{padding-top:16px; border-top:2px solid var(--ink);}
.process-step .n{font-family:'Bebas Neue'; font-size:40px; color:var(--accent); display:block; margin-bottom:6px;}
.process-step h4{font-family:'Public Sans'; font-size:17px; font-weight:700; margin-bottom:7px;}
.process-step p{font-size:14px; color:var(--muted);}

/* ---------- testimonials ---------- */
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media(max-width:900px){ .testi-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:600px){ .testi-grid{grid-template-columns:1fr;} }
.testi-card{border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px; background:var(--paper); display:flex; flex-direction:column; gap:12px;}
.testi-stars{color:var(--accent); font-size:13px; letter-spacing:2px;}
.testi-card p{font-size:14px; color:var(--ink);}
.testi-meta{display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:10px; border-top:1px dashed var(--line);}
.testi-name{font-weight:700; font-size:13.5px;}
.testi-loc{font-family:'JetBrains Mono'; font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em;}

/* ---------- company info table ---------- */
.info-table{width:100%; border-collapse:collapse; font-size:14px; margin-top:10px;}
.info-table tr{border-bottom:1px solid var(--line);}
.info-table td{padding:12px 4px; vertical-align:top;}
.info-table td:first-child{color:var(--muted); font-family:'JetBrains Mono'; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; width:42%;}
.info-table td:last-child{font-weight:600;}
.pending{color:var(--accent); font-style:italic; font-weight:500;}

/* ---------- legal text pages ---------- */
.legal h2{font-size:26px; margin:36px 0 12px;}
.legal h2:first-child{margin-top:0;}
.legal h3{font-family:'Public Sans'; font-size:16px; font-weight:700; margin:20px 0 8px;}
.legal p, .legal li{font-size:14.5px; color:var(--muted); margin-bottom:10px;}
.legal ul{list-style:disc; padding-left:20px;}
.legal .updated{font-family:'JetBrains Mono'; font-size:12px; color:var(--accent); margin-bottom:30px; display:block;}

/* ---------- forms ---------- */
form.request{display:flex; flex-direction:column; gap:14px; max-width:520px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media(max-width:560px){ .form-row{grid-template-columns:1fr;} }
form.request label{font-size:11.5px; color:var(--muted); letter-spacing:0.05em; text-transform:uppercase; font-family:'JetBrains Mono'; margin-bottom:-6px;}
form.request input, form.request select, form.request textarea{
  background:var(--paper); border:1.5px solid var(--line); color:var(--ink);
  padding:12px 14px; border-radius:var(--radius); font-family:'Public Sans'; font-size:14px;
}
form.request input:focus, form.request select:focus, form.request textarea:focus{outline:none; border-color:var(--accent);}
form.request textarea{resize:vertical; min-height:110px;}
form.request button{align-self:flex-start; margin-top:4px;}
.form-section{border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; display:flex; flex-direction:column; gap:14px;}
.form-section-label{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); margin-bottom:-2px;}
.form-note{font-size:12.5px; color:var(--muted); margin-top:8px;}
.form-success{background:var(--paper-2); border:1px solid var(--line); border-left:3px solid var(--accent); padding:16px 18px; font-size:14px; margin-bottom:20px; border-radius:var(--radius);}

/* ---------- tracking steps ---------- */
.track-steps{display:flex; justify-content:space-between; margin:40px 0; position:relative;}
.track-steps::before{content:""; position:absolute; top:11px; left:0; right:0; height:2px; background:var(--line); z-index:0;}
.track-step{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; text-align:center;}
.track-dot{width:24px; height:24px; border-radius:50%; background:var(--paper); border:2px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono'; font-size:11px;}
.track-step.done .track-dot{background:var(--accent); border-color:var(--accent); color:#fff;}
.track-step span{font-size:12px; color:var(--muted); max-width:11ch;}
.track-step.done span{color:var(--ink); font-weight:600;}
@media(max-width:640px){ .track-step span{display:none;} }

/* ---------- contact info list ---------- */
.contact-list{display:flex; flex-direction:column; gap:0;}
.contact-list div{display:flex; gap:12px; align-items:flex-start; padding:16px 0; border-bottom:1px solid var(--line);}
.contact-list b{display:block; font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); font-family:'JetBrains Mono'; margin-bottom:3px;}

/* ---------- why-us grid (2x3, style référence client) ---------- */
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line);}
@media(max-width:760px){ .why-grid{grid-template-columns:1fr;} }
.why-cell{padding:34px 26px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper); display:flex; flex-direction:column; align-items:center; text-align:center; gap:14px;}
.why-cell:nth-child(3n){border-right:none;}
.why-cell-alt{background:#EEF2E9;}
.why-icon{width:34px; height:34px; color:var(--ink); stroke-width:1.3;}
.why-cell p{font-size:14px; color:var(--muted); line-height:1.55;}
.why-cell p strong{color:var(--ink); display:block; margin-bottom:2px; font-size:14.5px;}

/* ---------- footer ---------- */
footer{background:var(--ink); color:#B7B2A2; padding:50px 0 24px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:36px;}
@media(max-width:800px){ .foot-grid{grid-template-columns:1fr 1fr;} }
footer h5{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent-light); margin-bottom:15px;}
footer .logo{color:#fff;}
footer ul{display:flex; flex-direction:column; gap:9px; font-size:13.5px;}
footer ul a:hover{color:#fff;}
footer p{font-size:13px; max-width:32ch;}
.foot-phone{display:inline-block; font-size:13.5px; font-weight:700; color:var(--accent-light);}
.foot-phone:hover{color:#fff;}
.foot-contact-row{display:flex; flex-direction:column; gap:8px; margin-top:12px;}

/* ---------- cookie consent ---------- */
#cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:998;
  background:var(--ink); color:#fff;
  transform:translateY(100%); transition:transform .35s ease;
  box-shadow:0 -8px 24px rgba(0,0,0,0.2);
}
#cookie-banner.visible{transform:translateY(0);}
.cookie-banner-inner{
  max-width:1180px; margin:0 auto; padding:20px 28px;
  display:flex; align-items:center; gap:24px; flex-wrap:wrap;
}
.cookie-banner-text{flex:1; min-width:240px; font-size:13px; color:#D8D4C8; line-height:1.55;}
.cookie-banner-text a{color:var(--accent-light); text-decoration:underline;}
.cookie-banner-actions{display:flex; gap:10px; flex-wrap:wrap;}
#cookie-banner .btn-outline{background:#fff; border-color:#fff; color:#1A1A1A;}
#cookie-banner .btn-outline:hover{background:#EFEAdd; color:#1A1A1A;}
@media(max-width:640px){ .cookie-banner-inner{padding:16px 20px;} .cookie-banner-actions{width:100%; justify-content:stretch;} .cookie-banner-actions .btn{flex:1;} }

#cookie-modal-overlay{
  position:fixed; inset:0; background:rgba(26,26,26,0.6); z-index:999;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; transition:opacity .25s ease;
}
#cookie-modal-overlay.visible{opacity:1;}
#cookie-modal{
  background:#fff; border-radius:6px; max-width:460px; width:100%;
  padding:28px 26px; max-height:85vh; overflow-y:auto;
}
#cookie-modal h3{font-family:'Public Sans'; font-size:18px; font-weight:800; margin-bottom:10px;}
.cookie-modal-intro{font-size:13px; color:var(--muted); margin-bottom:20px; line-height:1.5;}
.cookie-cat{border-top:1px solid var(--line); padding:14px 0;}
.cookie-cat-head{display:flex; justify-content:space-between; align-items:center; font-weight:700; font-size:14px; margin-bottom:6px;}
.cookie-cat p{font-size:12.5px; color:var(--muted); line-height:1.5;}
.cookie-switch{position:relative; display:inline-block; width:40px; height:22px; flex-shrink:0;}
.cookie-switch input{opacity:0; width:0; height:0;}
.cookie-slider{position:absolute; cursor:pointer; inset:0; background:#DDD5C0; border-radius:999px; transition:.2s;}
.cookie-slider::before{content:""; position:absolute; height:16px; width:16px; left:3px; top:3px; background:#fff; border-radius:50%; transition:.2s;}
.cookie-switch input:checked + .cookie-slider{background:var(--accent);}
.cookie-switch input:checked + .cookie-slider::before{transform:translateX(18px);}
.cookie-switch.disabled .cookie-slider{opacity:0.6; cursor:not-allowed;}
.cookie-modal-actions{display:flex; gap:10px; margin-top:22px; flex-wrap:wrap;}
.cookie-modal-actions .btn{flex:1; justify-content:center;}

/* ---------- chatbot ---------- */
#chat-bubble{
  position:fixed; bottom:24px; right:24px; z-index:900;
  width:58px; height:58px; border-radius:50%;
  background:var(--accent); color:#fff; border:none;
  font-size:26px; cursor:pointer;
  box-shadow:0 10px 26px rgba(193,80,46,0.4);
  transition:transform .2s ease;
}
#chat-bubble:hover{transform:scale(1.06);}
#chat-bubble.hidden-when-open{display:none;}

#chat-window{
  position:fixed; bottom:24px; right:24px; z-index:901;
  width:340px; max-width:calc(100vw - 32px);
  height:460px; max-height:calc(100vh - 48px);
  background:#fff; border-radius:12px;
  box-shadow:0 20px 50px rgba(0,0,0,0.25);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(16px) scale(0.97); opacity:0; pointer-events:none;
  transition:transform .2s ease, opacity .2s ease;
}
#chat-window.open{transform:translateY(0) scale(1); opacity:1; pointer-events:auto;}

#chat-header{
  background:var(--ink); color:#fff; padding:14px 16px;
  display:flex; align-items:center; gap:10px; flex-shrink:0;
}
#chat-header img{height:30px; width:30px; border-radius:50%; background:#fff; padding:3px;}
#chat-title{font-size:13.5px; font-weight:700;}
#chat-status{font-size:11px; color:#8FD19E;}
#chat-close{margin-left:auto; background:none; border:none; color:#fff; font-size:22px; cursor:pointer; line-height:1;}

#chat-messages{flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; background:var(--paper-2);}
.chat-msg{max-width:82%; padding:10px 13px; border-radius:12px; font-size:13.5px; line-height:1.45;}
.chat-msg a{color:inherit; text-decoration:underline;}
.chat-msg-bot{background:#fff; border:1px solid var(--line); align-self:flex-start; border-bottom-left-radius:3px;}
.chat-msg-user{background:var(--accent); color:#fff; align-self:flex-end; border-bottom-right-radius:3px;}
.chat-typing{display:flex; gap:4px; align-items:center; padding:12px 14px;}
.chat-typing span{width:6px; height:6px; border-radius:50%; background:#B9B2A0; display:inline-block; animation:chatTyping 1.1s infinite ease-in-out;}
.chat-typing span:nth-child(2){animation-delay:.15s;}
.chat-typing span:nth-child(3){animation-delay:.3s;}
@keyframes chatTyping{0%,60%,100%{transform:translateY(0); opacity:.5;} 30%{transform:translateY(-4px); opacity:1;}}

#chat-form{display:flex; gap:8px; padding:12px; border-top:1px solid var(--line); background:#fff; flex-shrink:0;}
#chat-input{flex:1; border:1.5px solid var(--line); border-radius:999px; padding:9px 14px; font-size:13.5px; font-family:'Public Sans';}
#chat-input:focus{outline:none; border-color:var(--accent);}
#chat-send{width:36px; height:36px; border-radius:50%; background:var(--accent); color:#fff; border:none; font-size:15px; cursor:pointer; flex-shrink:0;}
#chat-send:hover{background:var(--ink);}

@media(max-width:480px){
  #chat-window{right:16px; bottom:16px; width:calc(100vw - 32px);}
  #chat-bubble{right:16px; bottom:16px;}
}
.foot-certs{border-top:1px solid #3A3A3A; padding-top:28px; padding-bottom:28px;}
.foot-certs-label{display:block; font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent-light); margin-bottom:18px;}
.foot-certs-row{display:grid; grid-template-columns:repeat(6,1fr); gap:16px;}
@media(max-width:760px){
  .foot-certs-row{
    display:flex; overflow-x:auto; gap:14px; padding-bottom:8px;
    -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity;
  }
  .foot-certs-row .cert-box{flex:0 0 110px; scroll-snap-align:start;}
  .foot-certs-row::-webkit-scrollbar{height:5px;}
  .foot-certs-row::-webkit-scrollbar-thumb{background:#555; border-radius:3px;}
}
.cert-box{display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center;}
.cert-box-img{
  width:100%; height:76px;
  background:#fff; border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center;
  padding:10px; color:#8A8A8A;
}
.cert-box-img img{max-width:100%; max-height:100%; object-fit:contain;}
.cert-box-label{font-size:10.5px; line-height:1.3; color:#D8D4C8; font-weight:600;}
.foot-payment{border-top:1px solid #3A3A3A; padding:20px 0;}
.payment-icons-row{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:12px;}
.payment-icon-box{
  background:#fff; border-radius:var(--radius);
  height:34px; padding:7px 14px;
  display:flex; align-items:center; justify-content:center;
}
.payment-icon-box img{height:100%; width:auto; display:block;}
.foot-bottom{border-top:1px solid #3A3A3A; padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:12px;}

/* ---------- product detail page ---------- */
.product-detail{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media(max-width:860px){ .product-detail{grid-template-columns:1fr; gap:30px;} }
.pd-gallery .photo-slot, .pd-gallery img.real-photo{aspect-ratio:4/3; border-radius:var(--radius); border:1px solid var(--line);}
.pd-gallery img.real-photo{width:100%; object-fit:contain; background:transparent;}
.pd-thumbs{display:flex; gap:10px; margin-top:10px;}
.pd-thumb{width:88px; height:88px; flex-shrink:0;}
.pd-thumb{cursor:pointer; border-radius:var(--radius); transition:opacity .15s ease;}
.pd-thumb:not(.active){opacity:0.55;}
.pd-thumb:hover{opacity:1;}
.pd-thumb.active .photo-slot, .pd-thumb.active img.real-photo{outline:2px solid var(--accent); outline-offset:-2px;}

.pd-option-group{margin-bottom:20px;}
.pd-option-label{display:block; font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); margin-bottom:10px;}
.pd-option-choices{display:flex; flex-wrap:wrap; gap:8px;}
.pd-option-btn{
  padding:9px 16px; font-size:13px; font-weight:600;
  border:1.5px solid var(--line); border-radius:999px;
  background:#fff; color:var(--ink); cursor:pointer; font-family:'Public Sans';
  transition:all .15s ease;
}
.pd-option-btn:hover{border-color:var(--accent);}
.pd-option-btn.active{background:var(--ink); border-color:var(--ink); color:#fff;}
.pd-thumb .photo-slot, .pd-thumb img.real-photo{aspect-ratio:1/1; height:88px;}
.pd-thumb .photo-slot svg{width:16px; height:16px;}
.pd-thumb .photo-slot .ps-label, .pd-thumb .photo-slot .ps-file{display:none;}

.pd-why-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px 30px; margin-top:24px;}
@media(max-width:640px){ .pd-why-grid{grid-template-columns:1fr;} }
.pd-why-item{display:flex; gap:10px; font-size:14.5px; align-items:flex-start;}
.pd-why-check{color:var(--accent); font-weight:700; flex-shrink:0;}

.pd-discounts{margin-top:26px; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper-2);}
.pd-discount-row{display:grid; grid-template-columns:auto auto 1fr; gap:10px; align-items:baseline; padding:10px 0; border-bottom:1px dashed var(--line); font-size:13.5px;}
.pd-discount-row:last-of-type{border-bottom:none;}
.pd-discount-row.highlight{color:var(--ink); font-weight:700;}
.cost-row{display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:10px 0; border-bottom:1px dashed var(--line); font-size:13.5px;}
.cost-row:last-of-type{border-bottom:none;}
.cost-row.highlight{color:var(--ink); font-weight:700;}
.cost-row .cost-label{flex-shrink:0;}
.cost-row .cost-value{text-align:right; white-space:nowrap;}
.cost-row .cost-note{display:block; font-size:11px; color:var(--muted); font-weight:400; margin-top:2px; white-space:normal; text-align:right;}
.savings-banner{
  margin-top:14px; padding:14px 16px; text-align:center;
  background:#FBEEE7; border:1px solid var(--accent); border-radius:var(--radius);
  font-size:14px; color:var(--ink);
}
.savings-banner strong{color:var(--accent); font-family:'Bebas Neue'; font-size:17px;}

/* ---------- barre de progression livraison gratuite ---------- */
.shipping-progress{background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:24px;}
.shipping-progress-text{font-size:14px; margin-bottom:10px;}
.shipping-progress-text strong{color:var(--accent);}
.shipping-progress-track{height:8px; background:#E9E3D3; border-radius:999px; overflow:hidden;}
.shipping-progress-fill{height:100%; background:linear-gradient(90deg, var(--accent-light), var(--accent)); border-radius:999px; transition:width .4s ease;}

/* ---------- kasse / paiement ---------- */
.payment-box{border:1px solid var(--line); border-radius:var(--radius); padding:4px;}
.payment-method{border:1.5px solid var(--accent); border-radius:var(--radius); padding:18px; background:var(--paper-2);}
.payment-method-head{display:flex; align-items:center; gap:10px; margin-bottom:10px;}
.payment-radio{width:16px; height:16px; border-radius:50%; border:5px solid var(--accent); background:#fff; flex-shrink:0;}
.payment-method p{font-size:13.5px; color:var(--muted); margin-bottom:8px;}
.payment-method p:last-child{margin-bottom:0;}
.bank-preview{background:#fff; border:1px dashed var(--line); border-radius:var(--radius); padding:14px 16px; margin:12px 0;}
.bank-preview div{display:flex; justify-content:space-between; padding:5px 0; font-size:13px;}
.bank-preview span{color:var(--muted);}
.bank-preview strong{font-weight:700;}

/* ---------- popup promo 45s ---------- */
#promo-popup-overlay{
  position:fixed; inset:0; background:rgba(26,26,26,0.6); z-index:999;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; transition:opacity .3s ease;
}
#promo-popup-overlay.visible{opacity:1;}
#promo-popup{
  background:#fff; border-radius:4px; max-width:420px; width:100%;
  padding:36px 30px 30px; text-align:center; position:relative;
  transform:translateY(14px); transition:transform .3s ease;
  box-shadow:0 30px 60px rgba(0,0,0,0.3);
}
#promo-popup-overlay.visible #promo-popup{transform:translateY(0);}
#promo-popup-close{
  position:absolute; top:12px; right:14px; background:none; border:none;
  font-size:22px; color:var(--muted); cursor:pointer; line-height:1;
}
.promo-popup-badge{
  display:inline-block; background:var(--accent); color:#fff;
  font-family:'Bebas Neue'; font-size:26px; padding:6px 18px; border-radius:999px; margin-bottom:16px;
}
#promo-popup h3{font-family:'Public Sans'; font-size:20px; font-weight:800; margin-bottom:10px; letter-spacing:0;}
#promo-popup p{font-size:14px; color:var(--muted); margin-bottom:22px;}
.pd-discount-label{font-weight:600;}
.pd-discount-price{font-family:'Bebas Neue'; font-size:19px;}
.pd-discount-note{color:var(--muted); font-size:12px; grid-column:1/-1;}
@media(min-width:480px){ .pd-discount-note{grid-column:auto;} }

.pd-faq-item{border:1px solid var(--line); border-radius:var(--radius); padding:14px 18px; margin-bottom:10px; background:var(--paper);}
.pd-faq-item summary{font-weight:700; font-size:14.5px; cursor:pointer; list-style:none;}
.pd-faq-item summary::-webkit-details-marker{display:none;}
.pd-faq-item summary::before{content:"+ "; color:var(--accent);}
.pd-faq-item[open] summary::before{content:"– ";}
.pd-faq-item p{margin-top:10px; font-size:14px; color:var(--muted);}

/* generic real-photo used inside card / hero when a real file exists.
   object-fit:contain => l'image entiere reste toujours visible (jamais coupee),
   avec un padding interne uniforme pour que toutes les photos aient le meme "poids"
   visuel, quelle que soit la marge blanche presente dans la photo source. */
img.real-photo{width:100%; height:100%; object-fit:contain; background:transparent; border-radius:var(--radius); box-sizing:border-box; padding:16px;}
.card img.real-photo{aspect-ratio:4/3; border:none; border-bottom:1px solid var(--line); border-radius:0; background:transparent; padding:18px;}
.pd-thumb img.real-photo{padding:8px;}

::selection{background:var(--accent); color:#fff;}

/* ---------- garde-fou mobile : aucune grille ne doit forcer de scroll horizontal ---------- */
@media(max-width:760px){
  [style*="grid-template-columns"]{
    grid-template-columns: 1fr !important;
  }
  [style*="gap:50px"], [style*="gap:60px"], [style*="gap: 50px"], [style*="gap: 60px"]{
    gap: 24px !important;
  }
  .cost-row{ flex-wrap:wrap; }
  .cost-row .cost-value{ white-space:normal; text-align:right; }
  img, svg, iframe{ max-width:100%; }
}