/* =========================================================
   AF Mobilier — produit.css
   Propre à la fiche produit (produit.php) : barre de retour,
   carrousel photo, fiche technique, bloc prix, produits liés.
   ========================================================= */

.detail-subbar{background:var(--paper);border-bottom:1px solid var(--line);}
.detail-subbar-inner{max-width:1280px;margin:0 auto;padding:12px 32px;display:flex;justify-content:space-between;align-items:center;}
.back-btn{display:flex;align-items:center;gap:10px;font-size:12px;font-family:'IBM Plex Mono',monospace;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-soft);}
.back-btn:hover{color:var(--ink);}
.back-btn .arrow{font-size:16px;}
.detail-ref{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--accent);}

.detail-body{max-width:1280px;margin:0 auto;padding:48px 32px 80px;display:grid;grid-template-columns:1.15fr 0.85fr;gap:70px;align-items:start;}

.carousel{position:relative;aspect-ratio:4/3.2;border-radius:3px;overflow:hidden;background:var(--line);box-shadow:0 22px 50px -20px rgba(34,29,24,0.3);outline:1px solid var(--line);outline-offset:6px;}
.photo-disclaimer{font-size:12px;color:var(--ink-soft);font-style:italic;line-height:1.6;margin-top:22px;max-width:480px;}
.car-track{display:flex;height:100%;transition:transform .4s cubic-bezier(.2,.8,.2,1);}
.car-track img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;}
.car-arrow{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;background:rgba(247,244,238,0.85);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--ink);}
.car-arrow.left{left:14px;}
.car-arrow.right{right:14px;}
.car-arrow:hover{background:var(--paper);}
.car-dots{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:8px;}
.car-dot{width:7px;height:7px;border-radius:50%;background:rgba(247,244,238,0.55);}
.car-dot.active{background:var(--paper);}

.detail-info .cat-tag{color:var(--sage);font-size:12px;margin-bottom:16px;display:inline-block;}
.detail-info h1{font-size:clamp(30px,4vw,48px);line-height:1.08;margin-bottom:8px;}
.detail-info .sub{color:var(--ink-soft);font-size:15px;font-weight:300;margin-bottom:28px;}
.detail-info .desc{font-size:16px;line-height:1.85;color:var(--ink);font-weight:300;margin-bottom:32px;max-width:520px;}

.spec-list{border-top:1px solid var(--line);margin-bottom:32px;}
.spec-row{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.spec-row .k{color:var(--ink-soft);font-family:'IBM Plex Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.05em;}
.spec-row .v{color:var(--ink);text-align:right;max-width:60%;}

.price-block{background:var(--paper);border:1px solid var(--line);border-radius:2px;padding:24px 26px;margin-bottom:14px;}
.price-block .label{font-size:11px;color:var(--ink-soft);font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:6px;}
.price-block .price{font-family:'Fraunces',serif;font-size:28px;margin-bottom:4px;}
.price-block .price-note{font-size:11.5px;color:var(--ink-soft);margin-bottom:18px;}
.detail-cta{display:inline-block;width:100%;text-align:center;background:var(--ink);color:var(--paper);padding:16px 28px;border-radius:2px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:0.06em;text-transform:uppercase;transition:all .25s ease;}
.detail-cta:hover{background:var(--accent);}

.related{max-width:1280px;margin:0 auto;padding:0 32px 100px;}
.related h3{font-size:13px;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-soft);margin-bottom:24px;}
.related-grid{display:flex;flex-wrap:wrap;gap:2px;background:transparent;}
.related-grid .card{flex:0 0 calc(25% - 1.5px);}

@media (max-width:900px){
  .detail-body{grid-template-columns:1fr;gap:36px;padding:36px 20px 60px;}
  .related-grid .card{flex:0 0 calc(50% - 1px);}
}
@media (max-width:560px){
  .detail-subbar-inner{padding:10px 20px;}
  .related-grid .card{flex:0 0 100%;}
}