/*
  SÜTTAD blog (blog.html list, blog-01..04.html articles)
  The list reuses the template's home page news rows (.blog-item); articles have no comments.
  Builds on style.css + suttad.css + urunler.css + tarifler.css (product cards).
*/

/* list rows: whole row is a link; hover tint in brand navy instead of black */
.blog-item-link {
position: absolute;
inset: 0;
z-index: 4;
}

.blog-item:hover {
background: var(--suttad-navy);
}

.blog-item:hover img {
opacity: .35;
}

.blog-item h2 {
color: var(--suttad-navy);
transition: color .3s linear;
}

.blog-item .blog-tag {
color: var(--suttad-royal);
letter-spacing: .12em;
transition: color .3s linear;
}

.blog-item:hover h2,
.blog-item:hover p,
.blog-item:hover .blog-tag {
color: #fff!important;
}

.blog-item p {
max-width: 620px;
margin: 0 auto;
padding: 0 20px;
}

.blog-item .blog-more {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 12px 22px;
border: 1px solid currentColor;
border-radius: 40px;
}

.suttad-blog-list .blog-item:last-child {
border-bottom: 1px solid var(--suttad-mist-line);
}

.suttad-blog-list .blog-item {
border-top-color: var(--suttad-mist-line);
}

/* rows grow with their text (long Turkish titles) instead of the template's fixed height */
.suttad-blog-list .blog-item .blog-content {
display: flex;
align-items: center;
height: auto;
min-height: 530px;
top: 0;
padding: 70px 0;
}

.suttad-blog-list .blog-item .blog-content .blog-wrapper {
position: relative;
top: auto;
-webkit-transform: none;
        transform: none;
}

@media only screen and (max-width: 880px) {
  .suttad-blog-list .blog-item .blog-content {
    min-height: 0;
    padding: 60px 0;
  }

  .blog-item h2 {
    font-size: 28px;
  }
}


/* article */
.yazi {
max-width: 760px;
margin: 0 auto;
}

.yazi-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px 22px;
margin-bottom: 16px;
}

.yazi-read {
display: inline-flex;
align-items: center;
gap: 6px;
font-family: 'Montserrat', sans-serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .1em;
text-transform: uppercase;
color: #8597a9;
}

.yazi-read span {
font-size: 16px;
color: var(--suttad-royal);
}

.yazi-title {
margin: 0 0 18px;
font-family: 'Montserrat', sans-serif;
font-size: 40px;
font-weight: 800;
line-height: 1.15;
letter-spacing: -.03em;
color: var(--suttad-navy);
}

.yazi-lead {
margin-bottom: 34px;
padding-bottom: 30px;
font-family: 'Montserrat', sans-serif;
font-size: 19px!important;
font-weight: 600!important;
line-height: 1.65!important;
color: var(--suttad-navy)!important;
border-bottom: 1px solid var(--suttad-mist-line);
}

.yazi h3 {
margin: 36px 0 14px;
font-family: 'Montserrat', sans-serif;
font-size: 22px;
font-weight: 800;
letter-spacing: -.02em;
color: var(--suttad-navy);
}

.yazi > p,
.yazi li {
font-size: 16px!important;
line-height: 1.9!important;
}

.yazi > p {
margin-bottom: 18px;
}

.yazi ul {
margin: 0 0 22px;
padding: 0;
list-style: none;
}

.yazi li {
position: relative;
padding: 6px 0 6px 28px;
color: var(--suttad-slate);
}

.yazi li::before {
content: "";
position: absolute;
left: 4px;
top: 17px;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--suttad-royal);
}

.yazi-quote {
position: relative;
margin: 34px 0;
padding: 26px 30px 26px 34px;
font-family: 'Montserrat', sans-serif;
font-size: 21px;
font-weight: 700;
line-height: 1.55;
letter-spacing: -.01em;
color: var(--suttad-navy);
background: var(--suttad-mist);
border-left: 4px solid var(--suttad-royal);
}

.yazi-products {
margin: 40px 0 10px;
}

.yazi-products .urun-filter-label {
display: block;
margin-bottom: 14px;
}

.yazi-footer {
display: flex;
flex-wrap: wrap;
gap: 14px;
margin-top: 44px;
padding-top: 30px;
border-top: 1px solid var(--suttad-mist-line);
}

.suttad-btn.is-outline,
.suttad-btn.is-outline:visited {
color: var(--suttad-navy);
background: transparent;
box-shadow: inset 0 0 0 1px var(--suttad-navy);
}

.suttad-btn.is-outline:hover,
.suttad-btn.is-outline:focus {
color: #fff;
background: var(--suttad-navy);
}

@media only screen and (max-width: 768px) {
  .yazi-title {
    font-size: 30px;
  }

  .yazi-lead {
    font-size: 17px!important;
  }

  .yazi-quote {
    font-size: 18px;
    padding: 20px 22px;
  }
}


/* blog banners use bright food photos: deepen the overlay so the white title stays readable */
.swiper-slide-inner-bg[style*="img/yazilar"] + .overlay::before {
background: linear-gradient(180deg, rgba(4, 22, 48, .55) 0%, rgba(4, 22, 48, .7) 100%);
}