/* =========================================================
   MIHIDJAY FARMS — Styles principaux du site
   ========================================================= */
  :root{
    --green-deep:#274a3a;
    --green-deep-dark:#16301F;
    --green-fresh:#5B8C3E;
    --green-middle:#3b6451;
    --terracotta:#C97A3D;
    --terracotta-dark:#A9612C;
    --orange:#f5a623;
    --tomato:#B94A3D;
    --cream:#FAF8F2;
    --cream-2:#F1EBDD;
    --ink:#26241F;
    --ink-soft:#6b5f52;
    --white:#ffffff;
    --radius:18px;
    --header-h:68px;
    --filters-h:58px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--cream);
    color:var(--ink);
    font-family:'DM Sans', sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  .display{
    font-family:'Anton', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.3px;
    line-height:0.98;
  }
  a{text-decoration:none;color:inherit;}
  img{max-width:100%;display:block;}
  .wrap{max-width:1280px;margin:0 auto;padding:0 20px;}

  /* Désactive le double-tap zoom (et le délai de 300ms) sur tous les éléments cliquables :
     liens, boutons, miniatures de la galerie, filtres, boutons +/-, etc. */
  a, button{
    touch-action:manipulation;
  }

  /* ===== Tire-tread divider (signature) ===== */
  .tread{
    height:12px;
    background-image: repeating-linear-gradient(
      100deg,
      var(--terracotta) 0px, var(--terracotta) 8px,
      transparent 8px, transparent 16px
    );
    opacity:0.9;
  }

  /* ===== HEADER (full width, sticky, green) ===== */
  header{
    position:sticky; top:0; z-index:60;
    background:var(--green-deep);
    height:var(--header-h);
    display:flex; align-items:center;
    box-shadow:0 1px 3px rgba(0,0,0,.15);
  }
  header .wrap{
    display:flex; align-items:center; justify-content:space-between;
    width:100%;
  }
  .brand{display:flex;align-items:center;gap:10px;}
  .brand .logo-circle{
    width:44px;height:44px;border-radius:50%;
    overflow:hidden;border:2px solid rgba(255,255,255,.35);
    flex-shrink:0;
  }
  .brand .logo-circle img{width:100%;height:100%;object-fit:cover;}
  .brand .brand-name{
    font-family:'Anton',sans-serif;
    color:var(--cream);
    font-size:20px;
    letter-spacing:0.4px;
  }
  nav.main-nav{display:flex;gap:30px;}
  nav.main-nav a{
    color:var(--cream);
    font-size:17px;
    font-weight:400;
    opacity:0.9;
  }
  nav.main-nav a.active, nav.main-nav a:hover{opacity:1;font-weight:400;text-decoration: underline;text-underline-offset:5px;}
  .header-right{display:flex;align-items:center;gap:12px;}
  .cart-pill{
    display:flex;align-items:center;gap:8px;
    background:rgba(255,255,255,0.15);
    color:var(--cream);
    padding:8px 14px;
    border-radius:999px;
    font-size:15px;
    font-weight:500;
  }
  .cart-pill .count{
    background:var(--orange);
    color:black;
    width:20px;
    height:20px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:12px;
  }
  .menu-toggle{
    display:none;
    background:rgba(255,255,255,.15);
    border:none;color:var(--cream);
    width:38px;height:38px;border-radius:50%;
    cursor:pointer;
  }

  /* ===== HERO ===== */
  .hero{
    background:linear-gradient(135deg, var(--green-deep) 0%, #2A4E38 55%, var(--green-fresh) 140%);
    color:var(--cream);
    padding:56px 0 60px;
    text-align:center;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      radial-gradient(circle at 12% 20%, rgba(255,255,255,.08), transparent 40%),
      radial-gradient(circle at 88% 82%, rgba(201,122,61,.28), transparent 45%);
  }
  .hero::after{
    content:"";
    position:absolute; inset:0;
    z-index:1;
    background-image:url(../images/legumes.jpg);
    background-size:cover;
    background-position:top;
    background-repeat:no-repeat;
    opacity:0.05;
  }
  .hero .inner{position:relative;z-index:2;max-width:640px;margin:0 auto;padding:0 20px;}
  .hero-logo{
    width:200px;height:200px;border-radius:50%;
    border:2px solid rgba(255,255,255,.9);
    box-shadow:0 12px 30px rgba(0,0,0,.35);
    overflow:hidden;margin:0 auto 18px;
  }
  .hero-logo img{width:100%;height:100%;object-fit:cover;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:6px;
    background:var(--green-fresh);color:var(--cream);
    font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase;
    padding:6px 14px;border-radius:999px;margin-bottom:16px;
  }
  .hero h1{font-size:42px;margin:0 0 12px;line-height:1.3;}
  .hero p{font-size:18px;color:#DCE3CE;max-width:440px;margin:0 auto 26px;line-height:1.55;}
  .hero-ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:14px 24px;border-radius:999px;font-weight:700;font-size:16px;
    border:none;cursor:pointer;
  }
  .btn-primary{background:var(--terracotta);color:#fff;}
  .btn-primary:hover{background:var(--terracotta-dark);}
  .btn-ghost{background:transparent;color:var(--cream);border:1.5px solid rgba(250,248,242,.55);}
  .hero-ctas .btn{text-transform:uppercase;letter-spacing:.5px;}

  .btn-green{background:#549447;color:#fff;}
  .btn-green:hover{background:#497b3f;}

  /* ===== BOUTIQUE ===== */
  .boutique-section{padding:40px 0 10px;}
  .page-title{font-size:28px;color:var(--green-deep);margin:0 0 6px;}
  .page-subtitle{color:var(--ink-soft);font-size:13.5px;margin:0 0 20px;}

  .filters-bar{
    position:sticky;
    top:var(--header-h);
    z-index:50;
    background:rgba(250,248,242,.96);
    backdrop-filter:blur(8px);
    padding:12px 0;
    border-bottom:1px solid rgba(31,61,43,.09);
    margin-bottom:8px;
  }
  .filters-scroll{
    display:flex;gap:10px;overflow-x:auto;
    padding:2px 20px;
    max-width:1280px;margin:0 auto;
  }
  .filters-scroll::-webkit-scrollbar{display:none;}
  .filter-chip{
    flex:0 0 auto;
    display:inline-flex;align-items:center;gap:7px;
    padding:10px 16px;border-radius:999px;
    font-size:13px;font-weight:700;
    background:var(--white);
    border:1.5px solid var(--cream-2);
    color:var(--ink-soft);
    cursor:pointer;
    transition:all .15s;
    white-space:nowrap;
  }
  .filter-chip:hover{border-color:var(--green-deep);}
  .filter-chip.active{
    background:var(--green-deep);
    border-color:var(--green-deep);
    color:var(--cream);
  }

  .wa-banner{
    max-width:1280px;margin:20px auto 0;padding:0 20px;
  }
  .wa-banner-inner{
    background:linear-gradient(120deg, var(--green-fresh), #456b2e);
    border-radius:16px;padding:16px 20px;
    display:flex;align-items:center;gap:14px;color:#fff;
  }
  .wa-banner-inner .wa-icon{
    width:42px;height:42px;border-radius:50%;
    background:rgba(255,255,255,.16);
    display:flex;align-items:center;justify-content:center;
    font-size:19px;flex-shrink:0;
  }
  .wa-banner-inner .txt strong{display:block;font-size:13.5px;}
  .wa-banner-inner .txt span{font-size:11.5px;opacity:.85;}
  .wa-banner-inner .arrow{margin-left:auto;font-size:18px;}

  .cat-section{max-width:1280px;margin:34px auto 0;padding:0 20px;scroll-margin-top:calc(var(--header-h) + var(--filters-h) + 14px);}
  .cat-heading{
    display:flex;align-items:center;gap:10px;
    font-size:19px;color:var(--green-deep);
    margin:0 0 14px;
  }
  .cat-heading .cat-emoji{
    width:34px;height:34px;border-radius:50%;
    background:var(--cream-2);
    display:flex;align-items:center;justify-content:center;
    font-size:16px;flex-shrink:0;
  }

  .product-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
    gap:12px;
  }
  .product-card{
    background:var(--white);
    border-radius:14px;
    border:1px solid rgba(31,61,43,0.07);
    position:relative;
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px;
  }
  .product-card .stock-tag{
    position:absolute;top:-7px;left:8px;
    background:var(--green-deep);color:var(--cream);
    font-size:9px;font-weight:700;
    padding:3px 9px;border-radius:999px;z-index:2;letter-spacing:.3px;
  }
  .product-card .stock-tag.low{background:var(--tomato);}
  .product-photo{
    width:68px;height:68px;flex-shrink:0;
    border-radius:10px;background:var(--cream-2);
    display:flex;align-items:center;justify-content:center;
    font-size:30px;
  }
  .product-info{flex:1;min-width:0;display:flex;align-items:center;gap:10px;}
  .product-main{flex:1;min-width:0;}
  .product-main .pname{font-weight:700;font-size:14px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .product-main .punit{font-size:11.5px;color:var(--ink-soft);margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .product-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;}
  .price{font-family:'Anton',sans-serif;font-size:15px;color:var(--green-deep);flex-shrink:0;}
  .price span{font-size:9px;font-family:'DM Sans';font-weight:700;}
  .add-btn{
    background:var(--terracotta);color:#fff;border:none;
    font-size:12.5px;font-weight:700;
    padding:0 14px;height:30px;border-radius:999px;
    cursor:pointer;white-space:nowrap;
  }
  .add-btn:hover{background:var(--terracotta-dark);}
  .qty-control{
    display:flex;align-items:center;gap:6px;
    background:var(--cream-2);border-radius:999px;padding:3px;
  }
  .qty-control button{
    width:24px;height:24px;border-radius:50%;border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    font-size:14px;font-weight:800;line-height:0;
  }
  .qty-control .qminus{background:#fff;color:var(--green-deep);box-shadow:0 1px 2px rgba(0,0,0,.12);}
  .qty-control .qplus{background:var(--green-deep);color:#fff;}
  .qty-control .qval{min-width:16px;text-align:center;font-weight:800;font-size:13px;color:var(--green-deep);}

  /* ===== Récoltés avec passion ===== */
  .passion-section{max-width:1280px;margin:56px auto 0;padding:0 20px;}
  .passion-card{background:var(--white);border-radius:24px;overflow:hidden;border:1px solid rgba(31,61,43,.07);}
  .passion-grid{display:grid;grid-template-columns:1fr;}
  @media(min-width:800px){.passion-grid{grid-template-columns:4fr 8fr;}}
  .passion-text{background:var(--cream-2);padding:36px;display:flex;flex-direction:column;justify-content:center;}
  .passion-text .tag{font-weight:700;color:var(--terracotta);font-size:14px;letter-spacing:.5px;text-transform:uppercase;margin:0;}
  .passion-text h3{font-size:28px;margin:8px 0 14px;color:var(--green-deep);}
  .passion-text p{color:var(--ink-soft);font-size:17px;margin:0 0 20px;line-height:1.6;}
  .passion-text a{align-self:flex-start;background:var(--green-middle);color:#fff;padding:11px 18px;border-radius:8px;font-weight:700;font-size:16px;}
  .passion-images{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;min-height:320px;}
  .passion-images div{display:flex;align-items:center;justify-content:center;font-size:2.6rem;}
  .passion-images div:nth-child(1){background:var(--green-deep);background-image: url(../images/exploitation/01b.jpg);background-size: cover;background-position: center;}
  .passion-images div:nth-child(2){background:var(--green-fresh);background-image: url(../images/exploitation/02b.jpg);background-size: cover;background-position: center;}
  .passion-images div:nth-child(3){background:var(--terracotta);background-image: url(../images/exploitation/03b.jpg);background-size: cover;background-position: center;}

  .passion-images2{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;min-height:320px;}
  .passion-images2 div{display:flex;align-items:center;justify-content:center;font-size:2.6rem;}
  .passion-images2 div:nth-child(1){background:var(--green-deep);background-image: url(../images/exploitation/04b.png);background-size: cover;background-position: center;}
  .passion-images2 div:nth-child(2){background:var(--green-fresh);background-image: url(../images/exploitation/06b.png);background-size: cover;background-position: center;}
  .passion-images2 div:nth-child(3){background:var(--terracotta);background-image: url(../images/exploitation/05.jpg);background-size: cover;background-position: center;}

  /* ===== Why choose ===== */
  .why-section{max-width:1280px;margin:60px auto 0;padding:0 20px;}
  .why-section h3{font-size:28px;color:var(--green-deep);margin:30px;text-align:center;}
  .why-grid{display:grid;grid-template-columns:1fr;gap:14px;}
  @media(min-width:800px){.why-grid{grid-template-columns:repeat(3,1fr);}}
  .why-card{display:flex;gap:14px;align-items:flex-start;background: var(--green-middle);padding:20px;border-radius:16px;}
  .why-icon{width:46px;height:46px;border-radius:50%;background:var(--cream-2);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
  .why-card h4{margin:0;font-size:18px;color:var(--white);}
  .why-card p{font-size:17px;color:var(--white);margin:5px 0 0;line-height:1.5;}

  /* ===== Delivery ===== */
  .delivery-section{max-width:1280px;margin:80px auto 0;padding:0 20px;}
  .delivery-section h3{font-size:28px;color:var(--green-deep);margin:30px;text-align:center;}
  .delivery-grid{display:grid;grid-template-columns:1fr;gap:14px;}
  @media(min-width:800px){.delivery-grid{grid-template-columns:repeat(3,1fr);}}
  .delivery-card{background:var(--white);border-radius:16px;padding:20px;border:1px solid rgba(31,61,43,.07);}
  .delivery-card .dicon{width:44px;height:44px;border-radius:12px;background:var(--cream-2);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:12px;}
  .delivery-card strong{display:block;font-size:16px;}
  .delivery-card span{font-size:16px;color:var(--ink-soft);}
  .delivery-card .dprice{display:block;margin-top:10px;font-weight:800;color:var(--terracotta);font-size:17px;}

  /* ===== News ===== */
  .news-section{max-width:1280px;margin:52px auto 0;padding:0 20px;}
  .news-section h3{font-size:23px;color:var(--green-deep);margin:0 0 18px;}
  .news-grid{display:grid;grid-template-columns:1fr;gap:14px;}
  @media(min-width:800px){.news-grid{grid-template-columns:repeat(2,1fr);}}
  .news-card{display:flex;gap:14px;background:var(--white);border-radius:16px;padding:16px;border:1px solid rgba(31,61,43,.07);}
  .news-card .thumb{width:60px;height:60px;border-radius:12px;background:var(--green-deep);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;}
  .news-card strong{display:block;font-size:14px;line-height:1.35;}
  .news-card span{font-size:12px;color:var(--ink-soft);}

  /* ===== Partner CTA ===== */
  .partner-cta{
    max-width:1280px;margin:52px auto 0;padding:0 20px;
  }
  .partner-cta-inner{
    background:var(--terracotta);border-radius:22px;padding:34px;color:#fff;
  }
  .partner-cta-inner h3{font-size:24px;margin:0 0 10px;}
  .partner-cta-inner p{font-size:16px;opacity:.92;margin:0 0 18px;max-width:460px;line-height:1.55;}
  .partner-cta-inner .btn{background:#fff;color:var(--terracotta-dark);}

  /* ===== Footer ===== */
  footer{background:var(--green-deep);color:var(--cream);margin-top:60px;padding:44px 0 0;}
  .footer-grid{display:grid;grid-template-columns:1fr;gap:28px;}
  @media(min-width:800px){.footer-grid{grid-template-columns:repeat(3,1fr);}}
  .footer-col h4{color:#fff;font-size:13px;font-weight:700;margin:0 0 12px;text-transform:uppercase;letter-spacing:.4px;}
  .footer-col ul{list-style:none;padding:0;margin:0;}
  .footer-col li,.footer-col a{font-size:16px;color:#C8D2B4;padding:4px 0;display:flex;align-items:center;gap:8px;}
  .footer-brand-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
  .footer-brand-row .logo-circle{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.35);}
  .footer-brand-row .logo-circle img{width:100%;height:100%;object-fit:cover;}
  .footer-brand-row strong{font-family:'Anton',sans-serif;font-size:16px;letter-spacing:.3px;}
  .footer-col p{font-size:16px;color:#C8D2B4;line-height:1.6;margin:0 0 14px;}
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,.12);
    margin-top:36px;padding:18px 0;
    font-size:14px;color:#96A382;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  }

  /* ===== Responsive ===== */
  @media(max-width:860px){
    nav.main-nav{display:none;}
    nav.main-nav.open{
      display:flex;flex-direction:column;gap:22px;
      align-items:center;
      text-align:center;
      position:absolute;top:100%;left:0;right:0;
      background:var(--green-deep);padding:20px 20px;
      box-shadow:0 8px 16px rgba(0,0,0,.15);
    }
    nav.main-nav.open a{padding:0px 24px;}
    .menu-toggle{display:flex;align-items:center;justify-content:center;}
    .brand .brand-name{display:none;}
    .hero h1{font-size:28px;}
    .filters-bar{top:var(--header-h);}
    .product-grid{grid-template-columns:1fr;}
  }

/* =========================================================
   MIHIDJAY FARMS — Galerie Photos
   Grille de miniatures + visionneuse (lightbox) plein écran
   ========================================================= */

.gallery-section{
  max-width:1280px;
  margin:52px auto 0;
  padding:0 20px;
}
.gallery-section h3{
  font-size:23px;
  color:var(--green-deep);
  margin:0 0 18px;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}
@media(min-width:600px){
  .gallery-grid{grid-template-columns:repeat(4, 1fr);}
}
@media(min-width:900px){
  .gallery-grid{grid-template-columns:repeat(6, 1fr);}
}

.gallery-thumb{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:1/1;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(31,61,43,.09);
  cursor:pointer;
  padding:0;
  background:var(--cream-2);
}
.gallery-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .25s ease;
}
.gallery-thumb:hover img{
  transform:scale(1.06);
}
.gallery-thumb:focus-visible{
  outline:2px solid var(--green-fresh);
  outline-offset:2px;
}

/* ===== Lightbox ===== */
.lightbox{
  position:fixed;
  inset:0;
  z-index:999;
  background:rgba(20,18,14,.94);
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.lightbox.open{
  display:flex;
}
.lightbox-content{
  position:relative;
  max-width:1100px;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.lightbox-img-wrap{
  position:relative;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:200px;
}
.lightbox-img-wrap img{
  max-width:100%;
  max-height:80vh;
  border-radius:10px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  display:block;
}
.lightbox-spinner{
  position:absolute;
  width:34px;height:34px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.25);
  border-top-color:var(--cream);
  animation:lightbox-spin .8s linear infinite;
}
@keyframes lightbox-spin{
  to{transform:rotate(360deg);}
}

.lightbox-close,
.lightbox-prev,
.lightbox-next{
  position:fixed;
  z-index:1001;
  background:rgba(255,255,255,.12);
  border:1.5px solid rgba(255,255,255,.35);
  color:var(--cream);
  width:44px;height:44px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;
  cursor:pointer;
  transition:background .15s;
}
.lightbox-close:hover,
.lightbox-prev:hover,
.lightbox-next:hover{
  background:rgba(255,255,255,.25);
}

/* Toujours ancrés aux bords de la fenêtre, à 20px, quelle que soit la taille de la photo */
.lightbox-close{
  top:20px;
  right:20px;
}
.lightbox-prev{
  left:20px;
  top:50%;
  transform:translateY(-50%);
}
.lightbox-next{
  right:20px;
  top:50%;
  transform:translateY(-50%);
}
@media(max-width:700px){
  .lightbox-close,
  .lightbox-prev,
  .lightbox-next{
    width:38px;height:38px;
    font-size:17px;
  }
  .lightbox-close{top:20px;right:20px;}
  .lightbox-prev{left:20px;}
  .lightbox-next{right:20px;}
}

.lightbox-counter{
  position:fixed;
  z-index:1001;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  color:var(--cream);
  font-size:13px;
  opacity:.8;
}
