/* ==========================================================================
   BLF PRODUCTS INFINITE SWIPER
   ========================================================================== */

.blf-product-marquee{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:40px 0 35px;
  background:#f8f6ef;
  border-top:1px solid rgba(120,145,49,.14);
  border-bottom:1px solid rgba(120,145,49,.14);
}


/* مهم لمنع Swiper من التوقف بسبب قياسات الأب */
.blf-products-swiper{
  position:relative;
  width:100%;
  overflow:hidden;
}


/* الحركة الخطية المستمرة */
.blf-products-swiper .swiper-wrapper{
  display:flex;
  align-items:stretch;
  transition-timing-function:linear !important;
}


/* عرض ثابت لكل منتج */
.blf-products-swiper .swiper-slide{
  width:180px !important;
  height:auto;
  flex-shrink:0;

  display:flex;
  align-items:stretch;
  justify-content:center;
}


/* بطاقة المنتج */
.blf-marquee-item{
  width:100%;
  height:350px;
  padding:10px 10px 18px;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;

  text-align:center;
  text-decoration:none;

  background:transparent;
  border:1px solid transparent;
  border-radius:20px;

  transition:
    transform .35s ease,
    background-color .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}


/* حاوية موحدة لكل الصور */
.blf-product-image{
  width:100%;
  height:260px;
  margin-bottom:12px;

  display:flex;
  align-items:center;
  justify-content:center;
}


/* الصورة داخل المنتصف تماماً */
.blf-product-image img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:250px;
  object-fit:contain;
  object-position:center;

  filter:drop-shadow(0 12px 18px rgba(0,0,0,.13));

  transition:
    transform .35s ease,
    filter .35s ease;
}


/* Hover */
.blf-marquee-item:hover{
  transform:translateY(-12px);
  background:rgba(255,255,255,.72);
  border-color:rgba(169,205,46,.35);
  box-shadow:0 18px 35px rgba(0,0,0,.08);
}


.blf-marquee-item:hover img{
  transform:scale(1.06);
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.17));
}


/* Phoenician */
.blf-marquee-item .phoenician-name{
  display:block;
  min-height:20px;
  margin-bottom:6px;

  color:var(--blf-gold, #d4af37);

  font-size:17px;
  font-weight:400;
  line-height:1;
}


/* English name */
.blf-marquee-item strong{
  display:flex;
  align-items:flex-start;
  justify-content:center;

  width:100%;
  min-height:34px;

  color:var(--blf-dark, #25221d);

  font-size:12px;
  font-weight:900;
  line-height:1.25;
  text-transform:capitalize;
}


/* منع تحديد الصور أثناء السحب */
.blf-marquee-item,
.blf-marquee-item img{
  user-select:none;
  -webkit-user-drag:none;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media(max-width:991px){

  .blf-product-marquee{
    padding:32px 0;
  }

  .blf-products-swiper .swiper-slide{
    width:165px !important;
  }

  .blf-marquee-item{
    height:310px;
  }

  .blf-product-image{
    height:225px;
  }

  .blf-product-image img{
    max-height:215px;
  }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media(max-width:767px){

  .blf-product-marquee{
    padding:24px 0;
  }

  .blf-products-swiper .swiper-slide{
    width:145px !important;
  }

  .blf-marquee-item{
    height:245px;
    padding:8px 8px 12px;
    border-radius:16px;
  }

  .blf-product-image{
    height:170px;
    margin-bottom:8px;
  }

  .blf-product-image img{
    max-width:135px;
    max-height:165px;
  }

  .blf-marquee-item .phoenician-name{
    min-height:17px;
    margin-bottom:5px;
    font-size:15px;
  }

  .blf-marquee-item strong{
    min-height:28px;
    font-size:11px;
  }
}
.blf-products-swiper .swiper-wrapper{
  align-items:stretch;
  transition-timing-function:linear !important;
  will-change:transform;
}

.blf-products-swiper .swiper-slide{
  width:180px !important;
  flex-shrink:0;
  display:flex;
  justify-content:center;
}
/* =========================================================
   BEIRUT LEBANESE FOODS - HOMEPAGE CSS
   Organized Final Version
   ========================================================= */



*,
*::before,
*::after{
    box-sizing:border-box;
}

html,
body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
}

img,
video,
canvas,
svg{
    max-width:100%;
    height:auto;
}

/* =========================================================
   01. Global Utilities
   ========================================================= */

.container{
    width:100%;
    max-width:1400px;
    margin:0 auto;
    padding-left:15px;
    padding-right:15px;
    box-sizing:border-box;
}

.visually-hidden{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}





/* =========================================================
   Premium Multi Product Hero Slider
   ========================================================= */

.premium-hero-slider{
  position:relative;
  min-height:760px;
  overflow:hidden;
  background:
linear-gradient(
    to bottom,
    rgba(0,0,0,.80) 0px,
    rgba(0,0,0,.20) 130px,
    rgba(0,0,0,.12) 180px,
    rgba(0,0,0,.12) 100%
),
    url("../images/hero/hero-index.webp") center/cover no-repeat;
}

.premium-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .8s ease, visibility .8s ease;
}

.premium-slide.active{
  opacity:1;
  visibility:visible;
}

.premium-slide::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at center,rgba(169,205,46,.18),transparent 35%),
    rgba(0,0,0,.25);
  z-index:1;
}

/* Center Text */

.hero-center-content{
  position:absolute;
  z-index:5;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:90%;
  max-width:850px;
  text-align:center;
  color:#fff;
}

.hero-center-content .hero-subtitle{
  display:inline-block;
  margin-bottom:20px;
  padding:9px 22px;
  border-radius:50px;
  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;
}

.hero-center-content h1{
  margin:0 0 22px;
  font-family:var(--font-heading);
  font-size:64px;
  line-height:1.08;
  color:#fff;
  text-shadow:0 22px 50px rgba(0,0,0,.4);
}

.hero-center-content p{
  max-width:680px;
  margin:0 auto 32px;
  color:#eef3e3;
  font-size:18px;
  line-height:1.8;
}

.hero-buttons{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
}

.hero-btn-primary,
.hero-btn-outline{
  min-height:28px;
  padding:13px 32px;
  border-radius:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.8px;
}

.hero-btn-primary{
  background:var(--blf-green);
  color:#fff;
}

.hero-btn-outline{
  border:1px solid rgba(255,255,255,.75);
  color:#fff;
}

/* Products */

.hero-products{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
}

.hero-product{
  position:absolute;
  max-height:330px;
  object-fit:contain;
  filter:drop-shadow(0 35px 60px rgba(0,0,0,.45));
  opacity:0;
}

/* Positions */

.hero-product.from-left{
  left:6%;
  bottom:110px;
}

.hero-product.from-right{
  right:6%;
  bottom:110px;
}

.hero-product.from-top{
  bottom:70px;
  left:30%;
  max-height:260px;
}

.hero-product.from-bottom{
  bottom:40px;
  left:70%;
  max-height:260px;
}

/* Active Animations */

.premium-slide.active .from-left{
  animation:enterFromLeft 1.2s ease forwards, floatingProduct 5s ease-in-out 1.2s infinite;
}

.premium-slide.active .from-right{
  animation:enterFromRight 1.2s ease .2s forwards, floatingProduct 5.5s ease-in-out 1.4s infinite;
}

.premium-slide.active .from-top{
  animation:enterFromTop 1.2s ease .4s forwards, floatingProduct 6s ease-in-out 1.6s infinite;
}

.premium-slide.active .from-bottom{
  animation:enterFromBottom 1.2s ease .6s forwards, floatingProduct 5.8s ease-in-out 1.8s infinite;
}

@keyframes enterFromLeft{
  from{
    opacity:0;
    transform:translateX(-160px) scale(.85) rotate(-8deg);
  }
  to{
    opacity:1;
    transform:translateX(0) scale(1) rotate(0);
  }
}

@keyframes enterFromRight{
  from{
    opacity:0;
    transform:translateX(160px) scale(.85) rotate(8deg);
  }
  to{
    opacity:1;
    transform:translateX(0) scale(1) rotate(0);
  }
}

@keyframes enterFromTop{
  from{
    opacity:0;
    transform:translate(-50%,-160px) scale(.85);
  }
  to{
    opacity:1;
    transform:translate(-50%,0) scale(1);
  }
}

@keyframes enterFromBottom{
  from{
    opacity:0;
    transform:translate(-50%,160px) scale(.85);
  }
  to{
    opacity:1;
    transform:translate(-50%,0) scale(1);
  }
}

@keyframes floatingProduct{
  0%,100%{
    margin-top:0;
  }
  50%{
    margin-top:-18px;
  }
}

/* Arrows */

.hero-arrow{
  position:absolute;
  z-index:8;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:48px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.12);
  color:#fff;
  cursor:pointer;
  font-size:22px;
}

.hero-prev{
  left:34px;
}

.hero-next{
  right:34px;
}

.hero-arrow:hover{
  background:var(--blf-green);
}

/* Dots */

.hero-dots{
  position:absolute;
  z-index:8;
  left:50%;
  bottom:34px;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
}

.hero-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  background:rgba(255,255,255,.45);
  cursor:pointer;
}

.hero-dot.active{
  background:var(--blf-green);
}

/* Responsive */

@media(max-width:991px){
  .premium-hero-slider{
    min-height:720px;
  }

  .hero-center-content h1{
    font-size:44px;
  }

  .hero-center-content p{
    font-size:16px;
  }

  .hero-product{
    max-height:220px;
  }

  .hero-product.from-left{
    left:-20px;
    bottom:90px;
  }
  .hero-btn-primary,
  .hero-btn-outline{
    max-width:120px; /* بدلاً من 160px */
    min-height:38px;
    padding:10px 14px;
    font-size:11px;
    
  }
  .hero-product.from-right{
    right:-20px;
    bottom:90px;
  }

  .hero-product.from-top{
    bottom:30px;
  }

  .hero-product.from-bottom{
    bottom:30px;
  }
}

@media(max-width:575px){
  .premium-hero-slider{
    min-height:680px;
  }

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

  .hero-buttons{
    flex-direction:column;
    align-items:center;
  }

  .hero-btn-primary,
  .hero-btn-outline{
    width:auto;
    min-width:118px;
    max-width:none;
    min-height:36px;
    height:auto;
    padding:9px 14px;
    font-size:10px;
    line-height:1;
    white-space:nowrap;
    display:inline-flex;
    border-radius:50px;
  }

  .hero-product{
    max-height:150px;
    opacity:.75;
  }

  .hero-arrow{
    display:none;
  }
}
/* =========================================================
   Hero Typing Animation - Fixed For All Slides
   ========================================================= */

.hero-title .typing-line{
    display:block;
    width:0;
    max-width:max-content;
    overflow:hidden;
    white-space:nowrap;
    opacity:0;
}

.slide.active .hero-title .typing-line{
    opacity:1;
    animation:typingText 2.6s steps(28,end) forwards;
}

.slide.active .hero-title .typing-line:nth-child(2){
    animation-delay:2.4s;
}

@keyframes typingText{
    from{
        width:0;
    }
    to{
        width:100%;
    }
}

.slide.active .hero-title .typing-line:last-child::after{
    content:"";
    display:inline-block;
    width:3px;
    height:.9em;
    margin-left:6px;
    background:var(--blf-green);
    animation:cursorBlink .8s infinite;
    vertical-align:-2px;
}

@keyframes cursorBlink{
    0%,45%{opacity:1;}
    46%,100%{opacity:0;}
}

/* Typing effect for hero title */
.slide.active .hero-title{
    overflow:hidden;
}

.slide.active .hero-title .typing-line{
    display:block;
    width:0;
    max-width:max-content;
    overflow:hidden;
    white-space:nowrap;
    animation:typingText 1.4s steps(24,end) forwards;
}

.slide.active .hero-title .typing-line:nth-child(2){
    animation-delay:1.35s;
}

@keyframes typingText{
    from{
        width:0;
    }
    to{
        width:100%;
    }
}

/* Blinking cursor */
.slide.active .hero-title .typing-line:last-child::after{
    content:"";
    display:inline-block;
    width:3px;
    height:.9em;
    margin-left:6px;
    background:var(--blf-green);
    animation:cursorBlink .75s infinite;
    vertical-align:-2px;
}

@keyframes cursorBlink{
    0%,45%{
        opacity:1;
    }
    46%,100%{
        opacity:0;
    }
}

/* =========================================================
   08. Logistics Ticker
   ========================================================= */

.logistics-ticker-bar{
    background:#101010;
    overflow:hidden;
    color:#fff;
    padding:14px 0;
}

.ticker-wrapper{
    display:flex;
    gap:40px;
    width:max-content;
    animation:tickerMove 25s linear infinite;
}

.ticker-item{
    font-size:13px;
    letter-spacing:1px;
    text-transform:uppercase;
}

.ticker-item strong{
    color:var(--blf-green);
}

@keyframes tickerMove{
    from{transform:translateX(100vw);}
    to{transform:translateX(-100%);}
}


/* =========================================================
   09. Shared Section Headers
   ========================================================= */

.home-section-header{
    max-width:800px;
    margin:0 auto 58px;
    text-align:center;
}

.home-section-header.split-header{
    max-width:none;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:30px;
    text-align:left;
}

.section-eyebrow{
    display:inline-block;
    color:var(--blf-green-dark);
    background:rgba(169,205,46,.15);
    padding:8px 18px;
    border-radius:50px;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;
    margin-bottom:16px;
}

.home-section-header h2,
.logistics-content h2,
.founder-content h3{
    font-family:var(--font-heading);
    color:var(--blf-dark);
    font-size:48px;
    line-height:1.15;
    font-weight:700;
    margin:0 0 16px;
}

.home-section-header p,
.logistics-content p{
    color:var(--blf-text);
    font-size:16px;
    line-height:1.85;
}


/* =========================================================
   10. New Standard Section
   ========================================================= */

.new-standard-section{
    padding:105px 0;
    background:var(--blf-cream);
}

.standards-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}

.standard-card{
    background:#fff;
    border-radius:12px;
    padding:30px;
    box-shadow:var(--blf-shadow);
}

.standard-card h3{
    font-family:var(--font-heading);
    font-size:32px;
    color:var(--blf-dark);
    margin-bottom:22px;
}

.status-list{
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    gap:16px;
}

.status-list li{
    display:flex;
    gap:10px;
    align-items:flex-start;
    font-weight:700;
    color:#555;
}

.legacy-card i{
    color:#c0392b;
}

.beirut-card{
    background:linear-gradient(135deg,#25221d,#3d4f1d);
}

.beirut-card h3,
.beirut-card li{
    color:#fff;
}

.beirut-card i{
    color:var(--blf-green);
}


/* =========================================================
   11. Industrial Intelligence
   ========================================================= */

.industrial-intelligence{
    padding:105px 0;
    background:#fff;
}

.link-btn{
    color:var(--blf-green-dark);
    font-weight:800;
    text-decoration:none;
}

.intelligence-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.info-card{
    background:#fff;
    border:1px solid var(--blf-border);
    border-radius:12px;
    padding:40px 32px;
    box-shadow:0 16px 45px rgba(0,0,0,.06);
    transition:.35s ease;
}

.info-card:hover{
    transform:translateY(-8px);
    box-shadow:0 25px 65px rgba(0,0,0,.11);
}

.card-icon{
    width:72px;
    height:72px;
    border-radius:18px;
    background:linear-gradient(135deg,var(--blf-green-dark),var(--blf-green));
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:24px;
}

.info-card h3{
    font-family:var(--font-heading);
    font-size:28px;
    color:var(--blf-dark);
    margin-bottom:14px;
}

.info-card p{
    line-height:1.8;
}

.info-card a{
    color:var(--blf-green-dark);
    font-weight:800;
    text-decoration:none;
}


/* =========================================================
   12. Founder Section
   ========================================================= */

.founder-section{
    position:relative;
    padding:120px 0;
    background:
        linear-gradient(135deg, rgba(37,34,29,.95), rgba(61,79,29,.94)),
        url("../img/hero/hero-about.png") center/cover no-repeat;
    overflow:hidden;
}

.founder-watermark{
    position:absolute;
    right:4%;
    top:25px;
    font-size:110px;
    line-height:1;
    font-weight:900;
    color:rgba(255,255,255,.06);
    text-transform:uppercase;
}

.founder-content{
    max-width:820px;
    color:#fff;
}

.founder-label{
    display:inline-block;
    color:#fff;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    border-radius:50px;
    padding:8px 18px;
    text-transform:uppercase;
    font-weight:800;
    letter-spacing:1.5px;
    margin-bottom:22px;
}

.founder-content h3{
    color:#fff;
    font-size:54px;
}

.founder-content > p{
    color:#eef3e3;
    font-size:18px;
    line-height:1.9;
}

.founder-meta{
    display:flex;
    align-items:center;
    gap:30px;
    margin-top:32px;
}

.founder-info h5{
    color:#fff;
    margin:0 0 5px;
    font-size:20px;
    font-weight:800;
}

.founder-info p{
    margin:0;
    color:#dce8c4;
}


/* =========================================================
   13. Export Lines Gallery
   ========================================================= */

.section-export-lines{
    padding:105px 0;
    background:var(--blf-cream);
}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.gallery-item{
    position:relative;
    min-height:280px;
    border-radius:14px;
    overflow:hidden;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    box-shadow:0 18px 50px rgba(0,0,0,.10);
}

.line-tahini{
    background-image:url("../images/categories/beirut-tahini-halawa-categories.png") !important;
}

.line-olive{
    background-image:url("../images/categories/beirut-olive-oil-categories.png") !important;
}

.line-syrups{
    background-image:url("../images/categories/beirut-molasses-categories.png") !important;
}

.line-dips{
    background-image:url("../images/categories/beirut-beans-dips-categories.png") !important;
}

.line-pickles{
    background-image:url("../images/categories/beirut-pickles-categories.png") !important;
}

.line-jams{
    background-image:url("../images/categories/beirut-jams-categories.png") !important;
}
.line-spices{
    background-image:url("../images/categories/beirut-spices-categories.png") !important;
}
.line-tomato{
    background-image:url("../images/categories/beirut-Tomato-categories.png") !important;
}
.line-flower{
    background-image:url("../images/categories/beirut-flower-water-categories.png") !important;
}

.gallery-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    min-height:280px;
    padding:32px;
    color:#fff;
    text-decoration:none;
    background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,.15));
    transition:.35s ease;
}

.gallery-item:hover .gallery-overlay{
    background:rgba(120,145,49,.72);
}

.gallery-overlay span{
    color:#dce8c4;
    text-transform:uppercase;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.4px;
    margin-bottom:8px;
}

.gallery-overlay h3{
    font-family:var(--font-heading);
    color:#fff;
    font-size:30px;
    margin:0 0 10px;
}

.gallery-overlay p{
    color:#f3f7ea;
    margin:0;
}

.export-footer{
    margin-top:44px;
}

.home-dark-btn{
    display:inline-flex;
    min-height:48px;
    align-items:center;
    justify-content:center;
    padding:0 30px;
    border-radius:50px;
    background:#101010;
    color:#fff;
    text-decoration:none;
    font-weight:800;
    text-transform:uppercase;
}


/* =========================================================
   14. Logistics Section
   ========================================================= */

.section-logistics{
    padding:105px 0;
    background:#fff;
}

.logistics-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.logistics-card{
    margin-top:32px;
    display:grid;
    gap:18px;
}

.logistics-feature{
    display:flex;
    gap:18px;
    background:var(--blf-cream);
    padding:24px;
    border-radius:14px;
    border:1px solid var(--blf-border);
}

.logistics-feature i{
    width:56px;
    height:56px;
    border-radius:50%;
    background:var(--blf-green);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.logistics-feature h3{
    font-family:var(--font-heading);
    color:var(--blf-dark);
    margin:0 0 7px;
    font-size:24px;
}

.logistics-feature p{
    margin:0;
}

.logistics-visual{
    text-align:center;
}

.pallet-box{
    background:linear-gradient(135deg,#25221d,#3d4f1d);
    border-radius:18px;
    padding:46px;
    color:#fff;
    box-shadow:var(--blf-shadow);
}

.pallet-badge{
    display:inline-block;
    background:rgba(255,255,255,.12);
    border-radius:50px;
    padding:7px 16px;
    text-transform:uppercase;
    letter-spacing:1.2px;
    font-size:12px;
    font-weight:800;
    margin-bottom:28px;
}

.pallet-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    max-width:300px;
    margin:0 auto 24px;
}

.pallet-grid div{
    height:70px;
    background:var(--blf-green);
    border-radius:8px;
    box-shadow:inset 0 0 0 2px rgba(255,255,255,.18);
}

.pallet-grid .pallet-empty{
    background:rgba(255,255,255,.18);
}

.logistics-note{
    margin-top:20px;
    color:#777;
    font-style:italic;
}


/* =========================================================
   15. Bottom CTA
   ========================================================= */

/* ==========================================================
   PREMIUM EXPORT CTA
========================================================== */

/* ==========================================================
   SIMPLE HOME CTA SECTION
========================================================== */

.home-cta-section{
  padding:80px 0;
  background:var(--blf-cream);
  color:#fff;
  text-align:center;
}

.cta-small-title{
  display:inline-block;
  margin-bottom:14px;
  color:var(--blf-green);
  font-size:12px;
  font-weight:800;
  letter-spacing:1.8px;
  text-transform:uppercase;
}

.home-cta-section h2{
    max-width:760px;
    margin:0 auto 18px;
    color:var(--blf-dark);
    font-family:var(--font-heading);
    font-size:46px;
    font-weight:900;      /* أعرض */
    line-height:1.15;
    letter-spacing:-0.5px;
}

.home-cta-section p{
  max-width:620px;
  margin:0 auto 30px;
  color:var(--blf-dark);
  font-size:16px;
  line-height:1.7;
}

.cta-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
}
.cta-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:14px;
}

.home-cta-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-width:155px;
  height:48px;
  padding:0 24px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  text-decoration:none !important;
}

.home-cta-btn.primary{
  background:#fff;
  color:var(--blf-green-dark);
  border:2px solid #fff;
}

.home-cta-btn.secondary{
  background:transparent;
  color:var(--blf-green-dark);
  border:2px solid rgba(255,255,255,.75);
}

.home-cta-btn:hover{
  transform:translateY(-2px);
}

.home-cta-btn.secondary:hover{
  background:#fff;
  color:var(--blf-green-dark);
}
@media(max-width:768px){
  .home-cta-section{
    padding:60px 0;
  }

  .home-cta-section h2{
    font-size:30px;
  }

  .home-cta-section p{
    font-size:15px;
  }
}


/* =========================================================
   16. Floating Buttons
   ========================================================= */

.quote-cart-floating-btn,
.back-to-top{
    position:fixed;
    right:24px;
    width:46px;
    height:46px;
    border-radius:50%;
    z-index:9990;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    border:0;
    cursor:pointer;
}

.quote-cart-floating-btn{
    bottom:82px;
    background:#101010;
    color:#fff;
}

.quote-cart-floating-btn.is-hidden{
    display:none;
}

.back-to-top{
    bottom:24px;
    background:var(--blf-green);
    color:#fff;
    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
    transition:.3s ease;
}

.back-to-top.is-visible{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}


/* =========================================================
   17. Responsive Layout - Tablet
   ========================================================= */

@media(max-width:1199px){

    .nav-menu{
        gap:18px;
    }

    .hero-title{
        font-size:56px;
    }

    .gallery-grid,
    .intelligence-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .footer-content{
        grid-template-columns:1fr 1fr;
    }
}


/* =========================================================
   18. Responsive Layout - Mobile
   ========================================================= */

@media(max-width:991px){

    .home-topbar,
    .home-socials,
    .home-brand-header,
    .nav-menu{
        display:none !important;
    }

    .home-main-nav{
        position:absolute !important;
        top:0 !important;
        left:0 !important;
        width:100% !important;
        min-height:86px;
        background:transparent !important;
        border-bottom:0 !important;
        box-shadow:none !important;
    }

    .home-main-nav.is-sticky{
        position:fixed !important;
        background:rgba(255,255,255,.96) !important;
        box-shadow:0 10px 30px rgba(0,0,0,.12) !important;
        border-bottom:1px solid rgba(0,0,0,.06) !important;
    }

    .nav-inner{
        min-height:86px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:10px !important;
    }

    .nav-logo img{
        height:64px !important;
    }

    .nav-right-group{
        display:flex !important;
        align-items:center !important;
        justify-content:flex-end !important;
        gap:10px !important;
        margin-left:auto !important;
    }

    .nav-search-bar{
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        border-radius:50% !important;
        background:#101010 !important;
        border:1px solid rgba(255,255,255,.22) !important;
        overflow:hidden !important;
    }

    .nav-search-bar input{
        position:absolute !important;
        inset:0 !important;
        width:100% !important;
        height:100% !important;
        opacity:0 !important;
        padding:0 !important;
        cursor:pointer !important;
    }

    .nav-search-btn{
        position:relative !important;
        width:44px !important;
        height:44px !important;
        color:#fff !important;
        pointer-events:none !important;
        font-size:16px !important;
    }

    .nav-cart,
    .mobile-menu-btn{
        display:flex !important;
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transform:none !important;
    }

    .nav-cart{
        background:#101010 !important;
        color:#fff !important;
        border:1px solid rgba(255,255,255,.22) !important;
    }

    .mobile-menu-btn{
        background:var(--blf-green) !important;
        color:#fff !important;
        border:1px solid var(--blf-green) !important;
    }
}


/* =========================================================
   19. Responsive Layout - Small Mobile
   ========================================================= */

@media(max-width:575px){

    .container{
        width:90%;
    }

    .home-main-nav{
        min-height:78px !important;
    }

    .nav-inner{
        min-height:78px !important;
        gap:8px !important;
    }

    .nav-logo img{
        height:56px !important;
    }

    .nav-right-group{
        gap:7px !important;
    }

    .nav-search-bar,
    .nav-cart,
    .mobile-menu-btn{
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
    }

    .nav-search-btn{
        width:40px !important;
        height:40px !important;
    }

    .cart-count{
        top:-4px;
        right:-4px;
        min-width:16px;
        height:16px;
        font-size:9px;
    }

    .blf-offcanvas{
        width:86%;
        padding:36px 22px;
    }

    .blf-offcanvas h3{
        font-size:28px;
    }
}


/* =========================================================
   20. Final Responsive Grid Fixes
   Keeps sections clean beside each other on tablet and stacked on phone
   ========================================================= */

/* Desktop / large screens */
.standards-grid,
.intelligence-grid,
.gallery-grid,
.logistics-grid{
    width:100%;
    min-width:0;
}

.standard-card,
.info-card,
.gallery-item,
.logistics-content,
.logistics-visual,
.logistics-feature,
.pallet-box{
    min-width:0;
}

/* Tablet: keep cards beside each other */
@media(max-width:1199px){

    .home-section-header h2,
    .logistics-content h2{
        font-size:42px;
    }

    .founder-content h3{
        font-size:46px;
    }

    .standards-grid,
    .logistics-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:24px;
    }

    .intelligence-grid,
    .gallery-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:22px;
    }
}

/* Mobile landscape / small tablet */
@media(max-width:991px){

    .container{
        width:100%;
        padding-left:18px;
        padding-right:18px;
    }

    .new-standard-section,
    .industrial-intelligence,
    .section-export-lines,
    .section-logistics{
        padding:72px 0;
    }

    .home-section-header,
    .home-section-header.split-header{
        max-width:760px;
        margin-bottom:38px;
        text-align:center;
    }

    .home-section-header.split-header{
        display:block;
    }

    .home-section-header h2,
    .logistics-content h2{
        font-size:36px;
    }

    .home-section-header p,
    .logistics-content p{
        font-size:15px;
        line-height:1.75;
    }

    .standards-grid,
    .intelligence-grid,
    .gallery-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:18px;
    }

    .logistics-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:26px;
        align-items:start;
    }

    .standard-card,
    .info-card{
        padding:24px 20px;
    }

    .standard-card h3,
    .info-card h3,
    .gallery-overlay h3{
        font-size:24px;
    }

    .gallery-item,
    .gallery-overlay{
        min-height:230px;
    }

    .gallery-overlay{
        padding:24px;
    }

    .logistics-feature{
        padding:18px;
        gap:14px;
    }

    .logistics-feature i{
        width:48px;
        height:48px;
    }

    .logistics-feature h3{
        font-size:20px;
    }

    .pallet-box{
        padding:28px 20px;
    }

    .pallet-grid div{
        height:56px;
    }

    .premium-hero-slider{
        min-height:650px;
    }

    .hero-product{
        max-width:34vw;
        max-height:190px;
        height:auto;
    }

    .hero-product.from-left{
        left:0 !important;
        bottom:95px;
    }

    .hero-product.from-right{
        right:0 !important;
        bottom:95px;
    }

    .hero-product.from-top{
        left:32%;
        bottom:40px;
    }

    .hero-product.from-bottom{
        left:68%;
        bottom:40px;
    }

    .hero-btn-primary,
    .hero-btn-outline{
        width:auto;
        max-width:none;
        min-width:135px;
        min-height:38px;
        height:auto;
        padding:10px 16px;
        font-size:11px;
        line-height:1;
        display:inline-flex;
        object-fit:initial;
        border-radius:50px;
        white-space:nowrap;
    }
}

/* Phone: stack only when screen is too narrow */
@media(max-width:767px){

    .standards-grid,
    .intelligence-grid,
    .gallery-grid,
    .logistics-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .home-section-header h2,
    .logistics-content h2{
        font-size:32px;
    }

    .founder-section{
        padding:82px 0;
    }

    .founder-watermark{
        font-size:58px;
        right:0;
    }

    .founder-content h3{
        font-size:36px;
    }

    .founder-meta{
        flex-direction:column;
        align-items:flex-start;
        gap:18px;
    }

    .gallery-item,
    .gallery-overlay{
        min-height:240px;
    }

    .logistics-feature{
        align-items:flex-start;
    }

    .home-cta-section{
        padding:72px 0;
    }

    .home-cta-section h2{
        font-size:34px;
    }
}

/* Small phone */
@media(max-width:575px){

    .container{
        width:100%;
        padding-left:14px;
        padding-right:14px;
    }

    .new-standard-section,
    .industrial-intelligence,
    .section-export-lines,
    .section-logistics{
        padding:58px 0;
    }

    .home-section-header{
        margin-bottom:30px;
    }

    .home-section-header h2,
    .logistics-content h2{
        font-size:28px;
    }

    .home-section-header p,
    .logistics-content p{
        font-size:14px;
    }

    .premium-hero-slider{
        min-height:610px;
    }

    .hero-center-content{
        width:92%;
        top:47%;
    }

    .hero-center-content h1{
        font-size:31px;
        line-height:1.15;
    }

    .hero-center-content p{
        font-size:14px;
        line-height:1.65;
        margin-bottom:22px;
    }

    .hero-buttons{
        flex-direction:row;
        justify-content:center;
        align-items:center;
        gap:8px;
    }

    .hero-btn-primary,
    .hero-btn-outline{
        min-width:112px;
        min-height:34px;
        padding:8px 12px;
        font-size:9px;
    }

    .hero-product{
        max-width:37vw;
        max-height:135px;
        opacity:.9;
    }

    .hero-product.from-left{
        left:2px !important;
        bottom:78px;
    }

    .hero-product.from-right{
        right:2px !important;
        bottom:78px;
    }

    .hero-product.from-top{
        left:30%;
        bottom:22px;
    }

    .hero-product.from-bottom{
        left:70%;
        bottom:22px;
    }

    .standard-card,
    .info-card{
        padding:22px 18px;
    }

    .gallery-overlay{
        padding:22px;
    }

    .pallet-box{
        padding:24px 16px;
    }
}

/* Very small phone */
@media(max-width:420px){

    .nav-logo img{
        height:50px !important;
    }

    .nav-right-group{
        gap:6px !important;
    }

    .nav-search-bar,
    .nav-cart,
    .mobile-menu-btn{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
    }

    .hero-center-content h1{
        font-size:28px;
    }

    .hero-buttons{
        gap:6px;
    }

    .hero-btn-primary,
    .hero-btn-outline{
        min-width:104px;
        padding:8px 10px;
        font-size:8.5px;
    }
}
