/* =========================================================
   EPHARO – HOME HERO CARD
   Homepage tractor hero card
   AWS-ready frontend module

   Scope:
   - homepage hero visual card
   - hero category CTA button
   - hero text block

   Connected systems:
   - #eph-nav-btn opens product drawer
   - hero-copy.js updates hero text by language

   This module must not contain:
   - product drawer logic
   - header logic
   - backend/API logic
   ========================================================= */

.eph-hero-wrap{
  max-width:1180px;
  margin:0 auto 40px;
  padding:0 16px;
}

.eph-hero-card{
  width:100%;
  border-radius:26px;
  overflow:hidden;
  background:#ffffff;
  box-shadow:0 30px 70px rgba(15,23,42,.20);
}

.eph-hero-media img{
  display:block;
  width:100%;
  height:340px;
  object-fit:cover;
  object-position:center center;
}

.eph-hero-body{
  display:flex;
  align-items:center;
  gap:22px;
  padding:14px 26px 16px;
}

.eph-hero-cta{
  flex:0 0 auto;
}

.eph-hero-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 26px;
  border-radius:999px;
  border:none;
  background:#145c33;
  color:#ffffff;
  font-weight:700;
  font-size:1rem;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:
    filter .15s ease,
    transform .15s ease,
    box-shadow .15s ease;
}

.eph-hero-btn svg{
  width:20px;
  height:20px;
  flex:0 0 auto;
}

.eph-hero-btn:hover{
  filter:brightness(1.06);
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}

.eph-hero-text{
  flex:1 1 auto;
}

.eph-hero-title{
  margin:0 0 4px;
  font-size:1.5rem;
  font-weight:800;
  color:#145c33;
}

.eph-hero-lead{
  margin:0 0 3px;
  font-size:0.9375rem;
  color:#111827;
}

.eph-hero-lead strong{
  font-weight:800;
}

.eph-hero-desc{
  margin:0;
  font-size:0.875rem;
  line-height:1.5;
  color:#4b5563;
}

@media (max-width:1024px){
  .eph-hero-media img{
    height:240px;
  }
}

@media (max-width:768px){
  .eph-hero-body{
    flex-direction:column;
    align-items:flex-start;
    padding:14px 18px 16px;
  }

  .eph-hero-btn{
    width:100%;
    justify-content:center;
  }
}