/* =========================================================
   SELÇUK YEM V5.5 — ONAYLI HERO UYGULAMASI
   Referans: kullanıcı tarafından onaylanan hero görseli.
   Kritik kural: mavi bandın ALT sınırı da eğridir.
   ========================================================= */
:root{
  --selcuk-blue:#075ca8;
  --selcuk-blue-deep:#07539a;
  --selcuk-green:#39a80c;
  --selcuk-green-deep:#087a18;
  --selcuk-ink:#0b2745;
}

/* Eski hero kuralları yeni hero'ya etki etmez. */
.approved-hero{
  position:relative;
  background:#fff;
  overflow:hidden;
  isolation:isolate;
  margin:0;
  padding:0 0 8px;
}
.approved-hero-stage{
  position:relative;
  height:390px;
  overflow:hidden;
  background:#fff;
}
.approved-hero-inner{
  position:relative;
  z-index:4;
  height:100%;
}
.approved-hero-copy{
  position:relative;
  z-index:4;
  width:48%;
  padding-top:56px;
}
.approved-hero-copy h1{
  margin:0 0 22px;
  line-height:1.03;
  letter-spacing:-1.25px;
  text-transform:uppercase;
}
.approved-hero-copy h1 span,
.approved-hero-copy h1 strong{
  display:block;
  font-size:36px;
  font-weight:900;
}
.approved-hero-copy h1 span{color:#0c4f96;}
.approved-hero-copy h1 strong{color:#0b861a;margin-top:5px;}
.approved-hero-copy p{
  max-width:445px;
  margin:0 0 30px;
  color:#243d59;
  font-size:12.3px;
  line-height:1.72;
  font-weight:500;
}
.approved-hero-actions{display:flex;gap:19px;align-items:center;}
.approved-btn{
  height:46px;
  min-width:182px;
  padding:0 22px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-radius:5px;
  text-transform:uppercase;
  font-size:9.3px;
  font-weight:900;
  letter-spacing:.01em;
  transition:.18s ease;
}
.approved-btn b{font-size:18px;line-height:1;font-weight:500;}
.approved-btn-primary{background:#087f1b;color:#fff;border:2px solid #087f1b;box-shadow:0 5px 12px rgba(8,127,27,.12);}
.approved-btn-secondary{background:#fff;color:#17202a;border:2px solid #12862d;}
.approved-btn:hover{transform:translateY(-1px);}

.approved-hero-art{
  position:absolute;
  z-index:1;
  right:0;
  top:0;
  width:69%;
  height:100%;
  overflow:hidden;
}
.approved-hero-art img{
  position:absolute;
  right:-1%;
  bottom:-2px;
  width:108%;
  height:100%;
  object-fit:cover;
  object-position:right 58%;
}
/* Görselin sola doğru doğal biçimde beyaza karışması. */
.approved-hero-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.99) 8%,rgba(255,255,255,.94) 16%,rgba(255,255,255,.72) 27%,rgba(255,255,255,.28) 39%,rgba(255,255,255,0) 53%);
  pointer-events:none;
}

/* Dalga stage'in son 72px'iyle örtüşür. Görüntünün sınırı ilk yeşil eğridir. */
.approved-hero-wave{
  position:relative;
  z-index:5;
  display:block;
  width:100%;
  height:178px;
  margin-top:-72px;
  overflow:visible;
}
.approved-wave-mask{fill:#fff;}
.approved-wave-green{fill:var(--selcuk-green);}
.approved-wave-blue{fill:var(--selcuk-blue);}

/* Dalga sonrasında içerik referanstaki gibi temiz beyaz alandan başlar. */
.approved-hero + .category-section{padding-top:20px!important;}

@media(min-width:981px){
  /* Referans görseldeki geniş ve ferah header oranı. */
  body>.site-header,body>main,body>.footer{width:min(1140px,calc(100% - 72px));}
  .approved-hero .container{width:min(1018px,calc(100% - 70px));}
}

@media(max-width:980px){
  .approved-hero-stage{height:520px;}
  .approved-hero-inner{display:flex;align-items:flex-start;}
  .approved-hero-copy{width:100%;padding-top:35px;padding-right:15px;}
  .approved-hero-copy h1 span,.approved-hero-copy h1 strong{font-size:31px;}
  .approved-hero-copy p{font-size:12px;max-width:500px;}
  .approved-hero-art{top:205px;width:100%;height:315px;}
  .approved-hero-art img{width:100%;height:100%;object-position:center 52%;}
  .approved-hero-art::after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.75) 12%,rgba(255,255,255,0) 35%);}
  .approved-hero-wave{height:135px;margin-top:-54px;}
}
@media(max-width:560px){
  .approved-hero-stage{height:500px;}
  .approved-hero-copy{padding-top:25px;}
  .approved-hero-copy h1 span,.approved-hero-copy h1 strong{font-size:25px;letter-spacing:-.7px;}
  .approved-hero-copy p{font-size:10.5px;line-height:1.6;margin-bottom:18px;max-width:92%;}
  .approved-hero-actions{gap:9px;flex-wrap:wrap;}
  .approved-btn{height:39px;min-width:0;width:auto;font-size:7.9px;padding:0 14px;}
  .approved-hero-art{top:220px;height:280px;}
  .approved-hero-wave{height:102px;margin-top:-42px;}
}