/* =========================================================
   SELÇUK YEM V5.6 — ONAYLI HERO
   Referans: v56-approved-hero.png
   Kural: onaylanan görseldeki değişken kalınlıklı dalga formu korunur; iki paralel çizgi/bant gibi yapılmaz.
   ========================================================= */
:root{
  --v56-blue:#0048b0;
  --v56-green:#489400;
  --v56-ink:#152f4f;
}

/* Desktop shell: önceki sayfa yapısını bozma, yalnız hero oranını netleştir. */
@media (min-width:981px){
  .approved-hero .container{width:min(1040px,calc(100% - 64px));}
}

.approved-hero{
  position:relative;
  background:#fff;
  overflow:hidden;
  isolation:isolate;
  padding:0;
}
.approved-hero-stage{
  position:relative;
  height:420px;
  overflow:hidden;
  background:#fff;
}
.approved-hero-inner{
  position:relative;
  z-index:4;
  height:100%;
}
.approved-hero-copy{
  width:49%;
  padding-top:66px;
}
.approved-hero-copy h1{
  margin:0 0 24px;
  line-height:1.025;
  letter-spacing:-1.35px;
}
.approved-hero-copy h1 span,
.approved-hero-copy h1 strong{
  display:block;
  font-size:39px;
  font-weight:900;
  text-transform:uppercase;
}
.approved-hero-copy h1 span{color:#0b55aa;}
.approved-hero-copy h1 strong{color:#0c891d;margin-top:6px;}
.approved-hero-copy p{
  max-width:470px;
  margin:0 0 30px;
  color:#173557;
  font-size:13px;
  line-height:1.72;
  font-weight:500;
}
.approved-hero-actions{gap:20px;}
.approved-btn{
  height:47px;
  min-width:192px;
  padding:0 23px;
  border-radius:5px;
  font-size:9.6px;
}
.approved-btn-primary{background:#087f1b;border-color:#087f1b;}
.approved-btn-secondary{border-color:#168c2e;}

/* Fabrika, referans görseldeki sağ ağırlıklı kompozisyon. */
.approved-hero-art{
  position:absolute;
  z-index:1;
  right:0;
  top:0;
  width:70%;
  height:100%;
  overflow:hidden;
}
.approved-hero-art img{
  position:absolute;
  right:-2%;
  bottom:-1px;
  width:112%;
  height:100%;
  object-fit:cover;
  object-position:right 58%;
}
.approved-hero-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,
    #fff 0%,
    rgba(255,255,255,1) 10%,
    rgba(255,255,255,.96) 18%,
    rgba(255,255,255,.76) 28%,
    rgba(255,255,255,.34) 40%,
    rgba(255,255,255,0) 55%);
  pointer-events:none;
}

/*
  Dalga: stage'in altına oturur. Fotoğrafın sınırı yeşil eğridir.
  Mavi bandın üst ve alt sınırı iki ayrı Bezier eğrisidir; düz bitmez.
*/
.approved-hero-wave{
  position:relative;
  z-index:5;
  display:block;
  width:100%;
  height:132px;
  margin-top:-58px;
  overflow:visible;
}
.approved-wave-mask{fill:#fff;}
.approved-wave-green{fill:var(--v56-green);}
.approved-wave-blue{fill:var(--v56-blue);}

/* Dalga ile kartlar arasında referanstaki beyaz nefes alanı. */
.approved-hero + .category-section{padding-top:28px!important;}

/* Tablet */
@media (max-width:980px){
  .approved-hero-stage{height:525px;}
  .approved-hero-copy{width:100%;padding-top:34px;}
  .approved-hero-copy h1 span,
  .approved-hero-copy h1 strong{font-size:32px;}
  .approved-hero-copy p{font-size:12px;max-width:500px;}
  .approved-hero-art{top:205px;width:100%;height:320px;}
  .approved-hero-art img{right:0;width:100%;height:100%;object-position:center 57%;}
  .approved-hero-art::after{
    background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.82) 9%,rgba(255,255,255,.1) 35%,rgba(255,255,255,0) 49%);
  }
  .approved-hero-wave{height:105px;margin-top:-45px;}
  .approved-hero + .category-section{padding-top:22px!important;}
}

/* Telefon */
@media (max-width:560px){
  .approved-hero-stage{height:505px;}
  .approved-hero-copy{padding-top:24px;}
  .approved-hero-copy h1{margin-bottom:15px;letter-spacing:-.65px;}
  .approved-hero-copy h1 span,
  .approved-hero-copy h1 strong{font-size:25px;}
  .approved-hero-copy p{font-size:10.5px;line-height:1.58;margin-bottom:17px;max-width:94%;}
  .approved-hero-actions{gap:8px;flex-wrap:wrap;}
  .approved-btn{height:39px;min-width:0;padding:0 13px;font-size:7.8px;}
  .approved-hero-art{top:222px;height:283px;}
  .approved-hero-wave{height:82px;margin-top:-35px;}
  .approved-hero + .category-section{padding-top:17px!important;}
}