.product{background-color:var(--color-white);padding:var(--space-4xl) 0}
.product__container{max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-lg)}
.product__header{max-width:760px;margin:0 auto var(--space-3xl);text-align:center}
.product__eyebrow{font-family:var(--font-body);font-size:var(--text-paragraph);font-weight:600;color:var(--color-bleu-fonce);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:var(--space-md)}
.product__title{font-size:clamp(1.875rem,4vw,2.75rem);line-height:var(--leading-tight);color:var(--color-jaune);margin-bottom:var(--space-md)}
.product__subtitle{font-size:clamp(1rem,1.5vw,1.125rem);line-height:var(--leading-relaxed);color:var(--color-gray-500)}
.product__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-3xl);align-items:center}
.product__visual{position:relative;background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-xl);padding:var(--space-2xl);box-shadow:var(--shadow-03);overflow:hidden}
.product__image{display:block;width:100%;height:auto;max-width:560px;margin:0 auto;object-fit:contain;position:relative;z-index:1}
.product__features{display:grid;grid-template-columns:1fr;gap:var(--space-lg);list-style:none;padding:0;margin:0}
.product__feature{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-md);background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease}
.product__feature:hover{transform:translateX(4px);box-shadow:var(--shadow-02);border-color:var(--color-jaune)}
.product__feature-icon{flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background-color:rgba(22,149,181,0.12);color:var(--color-bleu-fonce);border-radius:var(--radius-md);line-height:1}
.product__feature-icon svg{width:24px;height:24px}
.product__feature-text{flex:1;min-width:0}
.product__feature-title{font-family:var(--font-heading);font-size:1rem;font-weight:700;color:var(--color-bleu-fonce);margin:0 0 4px;line-height:var(--leading-tight)}
.product__feature-desc{font-family:var(--font-body);font-size:var(--text-paragraph);line-height:var(--leading-normal);color:var(--color-gray-500);margin:0}

.product__lightbox-trigger{display:block;width:100%;padding:0;margin:0;background:none;border:none;cursor:zoom-in;position:relative;z-index:1;border-radius:var(--radius-lg);transition:transform 0.25s ease}
.product__lightbox-trigger:hover{transform:scale(1.02)}
.product__lightbox-trigger:focus-visible{outline:2px solid var(--color-jaune);outline-offset:4px}
.product__lightbox-trigger .product__image{transition:filter 0.25s ease,opacity 0.25s ease}
.product__lightbox-trigger:hover .product__image{filter:brightness(1.05)}
.product__image.is-fading{opacity:0}

.product__lightbox-icon{position:absolute;top:var(--space-md);right:var(--space-md);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:rgba(22,149,181,0.92);color:var(--color-white);border-radius:50%;box-shadow:var(--shadow-02);opacity:0;transform:translateY(-6px);transition:opacity 0.25s ease,transform 0.25s ease;pointer-events:none;z-index:3}
.product__lightbox-icon svg{width:18px;height:18px;flex-shrink:0}
.product__lightbox-trigger:hover .product__lightbox-icon,
.product__lightbox-trigger:focus-visible .product__lightbox-icon{opacity:1;transform:translateY(0)}

.product__gallery-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;display:flex;align-items:center;justify-content:center;background-color:var(--color-white);color:var(--color-bleu-fonce);border:none;border-radius:50%;cursor:pointer;box-shadow:var(--shadow-02);z-index:4;opacity:0.85;transition:opacity 0.2s ease,transform 0.2s ease,background-color 0.2s ease}
.product__gallery-nav:hover{opacity:1;background-color:var(--color-jaune);color:var(--color-white);transform:translateY(-50%) scale(1.08)}
.product__gallery-nav:focus-visible{outline:2px solid var(--color-jaune);outline-offset:3px;opacity:1}
.product__gallery-nav svg{width:20px;height:20px;flex-shrink:0}
.product__gallery-nav--prev{left:var(--space-md)}
.product__gallery-nav--next{right:var(--space-md)}

.product__gallery-thumbs{display:flex;gap:var(--space-sm);margin-top:var(--space-lg);overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px;scrollbar-width:thin;scrollbar-color:var(--color-gray-300) transparent;position:relative;z-index:2}
.product__gallery-thumbs::-webkit-scrollbar{height:6px}
.product__gallery-thumbs::-webkit-scrollbar-track{background:transparent}
.product__gallery-thumbs::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}
.product__gallery-thumb{flex:0 0 80px;height:80px;padding:0;background:none;border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;overflow:hidden;scroll-snap-align:start;transition:border-color 0.2s ease,transform 0.2s ease;opacity:0.7}
.product__gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.product__gallery-thumb:hover{opacity:1;transform:translateY(-2px)}
.product__gallery-thumb.is-active{border-color:var(--color-jaune);opacity:1}
.product__gallery-thumb:focus-visible{outline:2px solid var(--color-jaune);outline-offset:2px;opacity:1}

@media (max-width:960px){
  .product__grid{grid-template-columns:1fr;gap:var(--space-2xl)}
  .product__visual{max-width:560px;margin-inline:auto}
}
@media (max-width:640px){
  .product{padding:var(--space-3xl) 0}
  .product__visual{padding:var(--space-lg)}
  .product__feature{padding:var(--space-sm) var(--space-md)}
  .product__feature-icon{width:40px;height:40px}
  .product__feature-icon svg{width:20px;height:20px}
  .product__gallery-nav{width:36px;height:36px}
  .product__gallery-nav svg{width:16px;height:16px}
  .product__gallery-thumb{flex:0 0 64px;height:64px}
}
