/* FINAL HERO FIX - FULL WIDTH + PREMIUM POSITION */

html,
body{
    margin:0 !important;
    padding:0 !important;
    width:100%;
    overflow-x:hidden !important;
}

main{
    margin:0 !important;
    padding:0 !important;
}

/* =========================================================
   ABOUT HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   About Hero Section
   ========================= */
.about-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/bg-about.webp") center/cover no-repeat;
}

.about-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:aboutHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes aboutHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.about-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.about-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.about-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.about-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:50px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.about-hero-content h1 span{
  display:block;
  color:#dce8c4;
  margin-top:10px;
}

.about-line{
  width:200px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.about-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.about-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatAboutBtn 3s ease-in-out infinite;
}

.about-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatAboutBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */

@media(max-width:991px){

  .about-hero-template{
    min-height:500px;
  }

  .about-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .about-hero-content h1{
    font-size:40px;
  }

  .about-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .about-hero-template{
    min-height:460px;
  }

  .about-hero-content h1{
    font-size:34px;
  }

  .about-kicker{
    font-size:11px;
    padding:8px 16px;
  }

  .about-line{
    width:120px;
  }
}



/* =========================================================
   BLOG HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   Blog Hero Section
   ========================= */
.blog-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/blog-hero.png") center/cover no-repeat;
}

.blog-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:blogHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes blogHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.blog-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.blog-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.blog-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.blog-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.hero-line{
  width:160px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.blog-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.blog-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatBlogBtn 3s ease-in-out infinite;
}

.blog-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatBlogBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */
@media(max-width:991px){

  .blog-hero-template{
    min-height:500px;
  }

  .blog-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .blog-hero-content h1{
    font-size:40px;
  }

  .blog-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .blog-hero-template{
    min-height:460px;
  }

  .blog-hero-content h1{
    font-size:34px;
  }

  .blog-kicker{
    font-size:11px;
    padding:8px 16px;
  }
}

/* =========================================================
   products HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   products Hero Section
   ========================= */
.products-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/hero-index.webp") center/cover no-repeat;
}

.products-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:blogHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes blogHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.products-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.products-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.products-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.products-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.products-line{
  width:160px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.products-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.products-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatBlogBtn 3s ease-in-out infinite;
}

.products-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatBlogBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */
@media(max-width:991px){

  .products-hero-template{
    min-height:500px;
  }

  .products-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .products-hero-content h1{
    font-size:40px;
  }

  .products-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .products-hero-template{
    min-height:460px;
  }

  .products-hero-content h1{
    font-size:34px;
  }

  .products-kicker{
    font-size:11px;
    padding:8px 16px;
  }
}


/* =========================================================
   testimonials HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   testimonials Hero Section
   ========================= */
.testimonials-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/trade-hero.webp") center/cover no-repeat;
}

.testimonials-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:aboutHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes aboutHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.testimonials-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.testimonials-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.testimonials-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.testimonials-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.testimonials-hero-content h1 span{
  display:block;
  color:#dce8c4;
  margin-top:10px;
}

.testimonials-line{
  width:200px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.testimonials-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.testimonials-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatAboutBtn 3s ease-in-out infinite;
}

.testimonials-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatAboutBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */

@media(max-width:991px){

  .testimonials-hero-template{
    min-height:500px;
  }

  .testimonials-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .testimonials-hero-content h1{
    font-size:40px;
  }

  .testimonials-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .testimonials-hero-template{
    min-height:460px;
  }

  .testimonials-hero-content h1{
    font-size:34px;
  }

  .testimonials-kicker{
    font-size:11px;
    padding:8px 16px;
  }

  .testimonials-line{
    width:120px;
  }
}


/* =========================================================
   trade HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   trade Hero Section
   ========================= */
.trade-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/hero-about.png") center/cover no-repeat;
}

.trade-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:aboutHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes aboutHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.trade-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.trade-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.trade-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.trade-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.trade-hero-content h1 span{
  display:block;
  color:#dce8c4;
  margin-top:10px;
}

.trade-line{
  width:200px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.trade-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.trade-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatAboutBtn 3s ease-in-out infinite;
}

.trade-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatAboutBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */

@media(max-width:991px){

  .trade-hero-template{
    min-height:500px;
  }

  .trade-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .trade-hero-content h1{
    font-size:40px;
  }

  .trade-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .trade-hero-template{
    min-height:460px;
  }

  .trade-hero-content h1{
    font-size:34px;
  }

  .trade-kicker{
    font-size:11px;
    padding:8px 16px;
  }

  .trade-line{
    width:120px;
  }
}

/* =========================================================
   contact HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   contact Hero Section
   ========================= */
.contact-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.12)),
    url("../images/hero/contact-hero.webp") center/cover no-repeat;
}

.contact-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  /* تقليل القيم لجعل التداخلات أكثر خفة ونعومة */
  background:
    radial-gradient(circle at 25% 45%,rgba(169,205,46,.10),transparent 32%),
    linear-gradient(to bottom,rgba(0,0,0,.04),rgba(0,0,0,.20));
  animation:testimonialsHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes aboutHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.contact-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.contact-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.contact-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.contact-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.contact-hero-content h1 span{
  display:block;
  color:#dce8c4;
  margin-top:10px;
}

.contact-line{
  width:200px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.contact-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.contact-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatAboutBtn 3s ease-in-out infinite;
}

.contact-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatAboutBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */

@media(max-width:991px){

  .contact-hero-template{
    min-height:500px;
  }

  .contact-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .contact-hero-content h1{
    font-size:40px;
  }

  .contact-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .contact-hero-template{
    min-height:460px;
  }

  .contact-hero-content h1{
    font-size:34px;
  }

  .contact-kicker{
    font-size:11px;
    padding:8px 16px;
  }

  .contact-line{
    width:120px;
  }
}

/* =========================================================
   quote HERO SECTION ONLY
   ========================================================= */

:root{
  --blf-green:#a9cd2e;
  --font-heading:'Playfair Display', Georgia, serif;
}

/* =========================
   quote Hero Section
   ========================= */
.quote-hero-template{
  position:relative;
  min-height:580px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(120deg, rgba(18,18,16,.78), rgba(60,78,28,.62)),
    url("../images/hero/hero-about.png") center/cover no-repeat;
}

.quote-hero-template:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 25% 45%, rgba(169,205,46,.18), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.38));
  z-index:1;
  animation:aboutHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes aboutHeroZoom{
  from{
    transform:scale(1);
  }
  to{
    transform:scale(1.07);
  }
}

.quote-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.08);
}

.quote-hero-content{
  position:relative;
  z-index:2;
  max-width:860px;
  margin:0 auto;
  text-align:center;
  padding-top:120px;
  transform:translateY(40px);
}

.quote-kicker{
  display:inline-block;
  padding:8px 20px;
  border-radius:50px;
  color:#fff;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:20px;
}

.quote-hero-content h1{
  color:#fff;
  font-family:var(--font-heading);
  font-size:60px;
  line-height:1.08;
  font-weight:700;
  margin:0 0 20px;
  text-shadow:0 15px 40px rgba(0,0,0,.35);
}

.contact-hero-content h1 span{
  display:block;
  color:#dce8c4;
  margin-top:10px;
}

.quote-line{
  width:200px;
  height:3px;
  background:var(--blf-green);
  margin:0 auto 26px;
}

.quote-hero-content p{
  max-width:720px;
  margin:0 auto 30px;
  color:#eef3e3;
  font-size:17px;
  line-height:1.8;
}

.quote-hero-content .btn{
  min-height:48px;
  padding:13px 32px;
  border-radius:50px;
  background:var(--blf-green);
  color:#fff;
  font-weight:800;
  letter-spacing:1px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  animation:floatAboutBtn 3s ease-in-out infinite;
}

.quote-hero-content .btn:hover{
  background:#fff;
  color:#222;
}

@keyframes floatAboutBtn{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

/* =========================
   Responsive
   ========================= */

@media(max-width:991px){

  .quote-hero-template{
    min-height:500px;
  }

  .quote-hero-content{
    padding-top:80px;
    transform:translateY(25px);
  }

  .quote-hero-content h1{
    font-size:40px;
  }

  .quote-hero-content p{
    font-size:15px;
  }
}

@media(max-width:575px){

  .quote-hero-template{
    min-height:460px;
  }

  .quote-hero-content h1{
    font-size:34px;
  }

  .quote-kicker{
    font-size:11px;
    padding:8px 16px;
  }

  .quote-line{
    width:120px;
  }
}