@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
  --forest:#143d2b;
  --deep:#0d281e;
  --lime:#b5dc54;
  --paper:#f7f8f4;
  --muted:#63736b
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  color:#18352a;
  background:white;
  font-family:'DM Sans',Arial,sans-serif
}
h1,h2,h3,h4 {
  font-family:Manrope,Arial,sans-serif;
  letter-spacing:-.045em;
  line-height:1.13
}
h1 {
  font-size:clamp(2.8rem,6vw,6.5rem);
  margin:20px 0
}
h2 {
  font-size:clamp(2.1rem,4vw,4rem);
  margin:14px 0 26px
}
h3 {
  font-size:1.35rem
}
p {
  line-height:1.7
}
a {
  text-decoration:none;
  color:inherit
}
button,input,textarea {
  font:inherit
}
button {
  cursor:pointer
}
.container {
  width:min(1260px,calc(100% - 56px));
  margin:auto
}
.eyebrow {
  font-size:.73rem;
  text-transform:uppercase;
  letter-spacing:.2em;
  font-weight:800;
  color:#679343
}
.topbar {
  background:var(--deep);
  color:#d6e8d9;
  padding:9px 0;
  font-size:.72rem;
  letter-spacing:.08em
}
.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:87px;
  gap:24px
}
.brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-family:Manrope;
  font-size:1.32rem;
  font-weight:800;
  letter-spacing:-.055em
}
.brand-mark {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:14px 4px 14px 4px;
  background:var(--forest);
  color:var(--lime);
  font-size:28px
}
.brand small {
  display:block;
  font-size:.52rem;
  letter-spacing:.17em;
  color:#6c8377
}
.navlinks {
  display:flex;
  align-items:center;
  gap:28px;
  font-size:.84rem;
  font-weight:700
}
.navlinks a:hover,.foot a:hover {
  color:#84b93b
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  background:var(--lime);
  color:#173523;
  padding:16px 24px;
  border-radius:5px;
  font-size:.82rem;
  font-weight:800;
  border:1px solid transparent;
  transition:transform .2s,background .2s
}
.btn:hover {
  transform:translateY(-3px);
  background:#c7ec70
}
.btn.dark {
  background:var(--forest);
  color:white
}
.btn.outline {
  background:transparent;
  color:white;
  border-color:#ffffff88
}
.btn.outline:hover {
  background:#ffffff20
}
.hero {
  position:relative;
  min-height:640px;
  background:var(--deep);
  color:white;
  display:flex;
  align-items:center;
  overflow:hidden
}
.hero img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:brightness(.67)
}
.hero:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,31,20,.94) 0%,rgba(7,31,20,.63) 45%,transparent 100%)
}
.hero-content {
  position:relative;
  z-index:2;
  padding:110px 0;
  max-width:1260px
}
.hero-content>div {
  max-width:760px
}
.hero .eyebrow {
  color:var(--lime)
}
.hero p {
  font-size:1.12rem;
  max-width:520px;
  color:#e4eae4
}
.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:30px
}
.hero-bottom {
  position:absolute;
  bottom:30px;
  left:0;
  right:0;
  z-index:3;
  display:flex;
  justify-content:space-between;
  font-size:.75rem;
  letter-spacing:.13em;
  color:#dbe7df
}
.section {
  padding:100px 0
}
.section.tint {
  background:var(--paper)
}
.sectionhead {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:20px;
  margin-bottom:35px
}
.sectionhead p {
  max-width:430px;
  color:var(--muted)
}
.category-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px
}
.category-card {
  min-height:330px;
  background:#153b2b;
  position:relative;
  overflow:hidden;
  color:white;
  border-radius:5px;
  display:flex;
  align-items:end;
  padding:22px
}
.category-card img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:brightness(.72);
  transition:transform .5s
}
.category-card:hover img {
  transform:scale(1.09)
}
.category-card:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(transparent 28%,#071b12e8)
}
.category-card>div {
  position:relative;
  z-index:1
}
.category-card small {
  color:var(--lime);
  letter-spacing:.1em
}
.category-card h3 {
  margin:10px 0;
  font-size:1.25rem
}
.category-card span {
  font-size:.8rem
}
.product-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px
}
.product-card {
  border:1px solid #e3e9e2;
  border-radius:8px;
  overflow:hidden;
  background:white;
  transition:box-shadow .2s,transform .2s
}
.product-card:hover {
  transform:translateY(-5px);
  box-shadow:0 16px 40px #153d2b1a
}
.product-card img {
  width:100%;
  height:260px;
  object-fit:contain;
  background:#f2f5f0;
  padding:14px
}
.product-card .details {
  padding:25px
}
.product-card h3 {
  min-height:52px;
  margin:10px 0
}
.product-card p {
  color:var(--muted);
  font-size:.9rem;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden
}
.product-card .arrow {
  font-weight:800;
  font-size:.8rem;
  color:#447b32
}
.features {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px
}
.feature {
  border-top:2px solid #c5d7c5;
  padding-top:22px
}
.feature b {
  font-size:1.05rem
}
.feature p {
  color:var(--muted);
  font-size:.88rem
}
.feature-icon {
  font-size:2rem;
  color:#60943c;
  margin-bottom:15px
}
.editorial {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center
}
.editorial img {
  width:100%;
  height:460px;
  object-fit:cover;
  border-radius:7px
}
.editorial p {
  color:var(--muted)
}
.cta {
  background:var(--forest);
  color:white;
  padding:65px 0
}
.cta .container {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}
.cta h2 {
  margin:0 0 10px
}
.cta p {
  margin:0;
  color:#c7dccb
}
.foot {
  background:var(--deep);
  color:#c7d7cc;
  padding:65px 0 25px
}
.footgrid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:50px
}
.foot h4 {
  color:white
}
.foot a {
  display:block;
  margin:12px 0;
  font-size:.87rem
}
.copyright {
  border-top:1px solid #ffffff26;
  margin-top:45px;
  padding-top:20px;
  font-size:.76rem
}
.pagehero {
  background:var(--deep);
  color:white;
  padding:88px 0;
  background-image:radial-gradient(circle at 85% 15%,#426a40 0%,transparent 40%)
}
.pagehero h1 {
  font-size:clamp(2.5rem,5vw,4.5rem)
}
.pagehero p {
  max-width:620px;
  color:#c9d9cc
}
.filters {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:24px 0 36px
}
.filter {
  border:1px solid #dbe5da;
  background:white;
  padding:12px 17px;
  border-radius:50px;
  font-size:.8rem;
  font-weight:700
}
.filter.active,.filter:hover {
  background:var(--forest);
  color:white
}
.search {
  padding:15px;
  border:1px solid #dbe5da;
  border-radius:5px;
  max-width:370px;
  width:100%
}
.catalogue-tools {
  display:flex;
  justify-content:space-between;
  gap:15px;
  flex-wrap:wrap;
  align-items:center
}
.product-layout {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:65px;
  align-items:start
}
.product-layout h1 {
  font-size:clamp(2.3rem,4vw,4rem)
}
.main-photo {
  height:480px;
  background:var(--paper);
  border-radius:8px;
  display:grid;
  place-items:center;
  cursor:zoom-in;
  overflow:hidden
}
.main-photo img {
  width:100%;
  height:100%;
  object-fit:contain
}
.thumbs {
  display:flex;
  gap:10px;
  overflow-x:auto;
  margin-top:12px
}
.thumbs button {
  border:2px solid transparent;
  background:#f1f4ee;
  padding:4px;
  flex:0 0 90px;
  height:78px;
  border-radius:5px
}
.thumbs button.active {
  border-color:#77a73d
}
.thumbs img {
  width:100%;
  height:100%;
  object-fit:contain
}
.product-info .description {
  color:#5c7064;
  white-space:pre-line
}
.product-info .badge {
  display:inline-block;
  background:#e9f1e2;
  padding:8px 12px;
  border-radius:4px;
  color:#47783a;
  font-size:.75rem;
  font-weight:800
}
.notice {
  padding:20px;
  background:#f0f4eb;
  border-left:3px solid #86b54d;
  font-size:.9rem;
  color:#536a57
}
.lightbox {
  position:fixed;
  inset:0;
  z-index:1000;
  background:#06120feb;
  display:none;
  align-items:center;
  justify-content:center;
  padding:60px
}
.lightbox.open {
  display:flex
}
.lightbox img {
  max-width:90vw;
  max-height:85vh;
  object-fit:contain
}
.lightbox button {
  position:absolute;
  background:#ffffff22;
  color:white;
  border:0;
  font-size:32px;
  padding:10px 18px
}
.lightbox .close {
  right:25px;
  top:20px
}
.lightbox .prev {
  left:20px
}
.lightbox .next {
  right:20px
}
.menu-toggle {
  display:none
}
.empty {
  padding:50px;
  text-align:center;
  color:var(--muted)
}
@media(max-width:1000px) {
  .category-grid {
    grid-template-columns:repeat(3,1fr)
  }
  .navlinks {
    gap:13px
  }
  .product-grid {
    grid-template-columns:repeat(2,1fr)
  }
  
}
@media(max-width:720px) {
  .container {
    width:min(100% - 32px,1260px)
  }
  .topbar {
    display:none
  }
  .nav {
    min-height:72px
  }
  .navlinks {
    display:none;
    position:absolute;
    z-index:20;
    top:72px;
    left:0;
    right:0;
    background:white;
    padding:24px;
    box-shadow:0 15px 25px #0002;
    flex-direction:column;
    align-items:stretch
  }
  .navlinks.open {
    display:flex
  }
  .menu-toggle {
    display:block;
    background:none;
    border:0;
    font-size:1.5rem
  }
  .hero {
    min-height:580px
  }
  .hero-content {
    padding:90px 0
  }
  .hero-bottom {
    display:none
  }
  .section {
    padding:65px 0
  }
  .sectionhead {
    display:block
  }
  .category-grid,.product-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .category-card {
    min-height:245px;
    padding:15px
  }
  .category-card h3 {
    font-size:1rem
  }
  .features {
    grid-template-columns:repeat(2,1fr)
  }
  .editorial,.product-layout {
    grid-template-columns:1fr;
    gap:30px
  }
  .editorial img {
    height:290px
  }
  .cta .container {
    display:block
  }
  .cta .btn {
    margin-top:22px
  }
  .footgrid {
    grid-template-columns:1fr 1fr
  }
  .main-photo {
    height:330px
  }
  
}
@media(max-width:430px) {
  .category-grid,.product-grid {
    grid-template-columns:1fr
  }
  .category-card {
    min-height:240px
  }
  .footgrid {
    grid-template-columns:1fr
  }
  .hero h1 {
    font-size:2.7rem
  }
  
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }
  
}

/* Détails des fiches techniques, migration depuis les onglets WooCommerce */
.technical-section{max-width:1160px;margin:48px auto;padding:0 24px 60px;color:#17342b}
.technical-section h2{font-size:clamp(1.5rem,3vw,2.2rem);margin:30px 0 15px}
.technical-section h3{font-size:1.2rem;margin:22px 0 12px}
.technical-section .technical-card{background:#f5f8f4;border:1px solid #e0e9df;border-radius:16px;padding:clamp(18px,3vw,32px);margin:18px 0;line-height:1.7;overflow-wrap:anywhere}
.technical-section .technical-card ul{padding-left:22px}.technical-section .technical-card li{margin:6px 0}
.technical-section table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.technical-section th,.technical-section td{padding:12px 14px;text-align:left;border-bottom:1px solid #d6e2d5;min-width:120px}
.technical-section .video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,350px),1fr));gap:22px}
.technical-section .video-frame{aspect-ratio:16/9;border:0;width:100%;border-radius:12px;background:#10251c}
.technical-section .video-link{display:inline-block;margin-top:12px;color:#176c42}
.technical-section .source-note{font-size:.85rem;color:#637268}
.technical-section img{max-width:100%;height:auto}

/* V5 : fiches techniques historiques */
.technical-section{max-width:100%;margin:58px auto 20px;padding:0;color:#17342b}.technical-section h2{font-size:clamp(1.6rem,3vw,2.6rem);margin:38px 0 18px}.technical-section h3{font-size:1.3rem;margin:25px 0 12px}.technical-card{padding:clamp(18px,3vw,30px);background:#f5f8f4;border:1px solid #dfe9dc;border-radius:13px;margin:12px 0 28px;line-height:1.7;overflow-wrap:anywhere}.technical-card p{margin:10px 0}.technical-card ul,.technical-card ol{padding-left:24px}.technical-card li{margin:5px 0}.technical-card table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}.technical-card th,.technical-card td{border-bottom:1px solid #d5e2d4;padding:11px 15px;text-align:left;min-width:120px}.technical-card img{max-width:100%;height:auto;display:block;margin:16px auto}.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:18px}.video-frame{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:9px}.video-link{display:inline-block;margin-top:12px;color:#226d45;font-weight:700}.source-note{font-size:.82rem;color:#6d796f;margin:30px 0}.product-long-description iframe{display:none}

.pi21-whatsapp-footer{display:inline-flex;align-items:center;gap:.3em;color:inherit;text-decoration:none;opacity:.85;margin-left:12px}.pi21-whatsapp-footer:hover{opacity:1;text-decoration:underline}