/* ==========================================================================
   Sedef Tarım — Projeye Özel Stiller
   --------------------------------------------------------------------------
   Bu dosya custom.css'ten SONRA yüklenir.
   Tema dosyaları (custom.css vb.) hiçbir zaman düzenlenmez; gerekli tüm
   düzeltme ve eklemeler bu dosyada yapılır.

   1) SEO Başlık Düzeltmeleri
      Tema CSS'i ".xxx h2{...}" gibi etiket seçicileri kullanıyor. Sayfa
      başına tek <h1> ve doğru başlık hiyerarşisi kurabilmek için bazı
      etiketler bir seviye aşağı alındı. Aşağıdaki kurallar, orijinal
      görünümün birebir korunması için aynı bildirimleri yeni etiketlere
      uygular.
   2) Yeni Bileşenler
      Temada karşılığı olmayan (belge kartı, referans logosu, künye kutusu
      gibi) bileşenlerin stilleri.
   ========================================================================== */


/* ==========================================================================
   1) SEO Başlık Düzeltmeleri
   ========================================================================== */

/* Hero bilgi kutusu — başlık gibi görünen ama başlık OLMAYAN metinler.
   Sayfanın <h1>'inden hemen sonra geldikleri için başlık etiketi kullanılmaz;
   böylece h1 -> h3 atlaması oluşmaz. Görünüm tema ile birebir aynıdır. */
.hero-info-item-content-metal .hero-info-title-metal {
	font-family: var(--accent-font);
	font-weight: 500;
	line-height: 1.2em;
	letter-spacing: -0.02em;
	font-size: 26px;
	color: var(--white-color);
	margin: 0;
}

.hero-info-item-content-metal .hero-info-lead-metal {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.78);
}

.hero-info-item-content-metal .hero-info-stats-metal {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.hero-info-item-content-metal .hero-info-stats-metal li {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin: 0;
	padding: 0 0 16px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
	width: 100%;
	color: var(--white-color);
}

.hero-info-item-content-metal .hero-info-stats-metal li:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

.hero-info-item-content-metal .hero-info-stat-value {
	flex: 0 0 auto;
	min-width: 5.5em;
	font-family: var(--default-font);
	font-weight: 600;
	font-size: 28px;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: white;
}

.hero-info-item-content-metal .hero-info-stat-text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding-top: 4px;
}

.hero-info-item-content-metal .hero-info-stat-label {
	font-weight: 600;
	font-size: 15px;
	line-height: 1.3;
	color: var(--white-color);
}

.hero-info-item-content-metal .hero-info-stat-detail {
	font-size: 13px;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.7);
}

.hero-info-item-rating-content-metal .hero-info-value-metal {
	display: inline-block;
	font-family: var(--default-font);
	font-weight: 500;
	font-size: 30px;
	line-height: normal;
	color: var(--white-color);
}

@media (max-width: 991px) {
	.hero-info-item-content-metal .hero-info-title-metal {
		font-size: 22px;
	}

	.hero-info-item-content-metal .hero-info-stat-value {
		font-size: 24px;
		min-width: 4.75em;
	}
}

/* Deneyim kutusu — büyük sayı h2 yerine h3, etiket h3 yerine h4 */
.about-us-experienc-box-metal h3.experience-value {
	font-size: 100px;
	line-height: 1em;
	margin: 0;
}

.about-us-experienc-box-metal h4 {
	font-size: 20px;
	margin: 5px 0 0;
}

/* Sayaç kutuları — h2 yerine h3 */
.story-counter-item-content-metal h3 {
	font-size: 52px;
	color: var(--white-color);
	margin: 0;
}

.why-choose-experience-box-metal h3 {
	font-size: 48px;
	line-height: normal;
	color: var(--white-color);
	margin: 0;
}

.about-us-counter-body h3 {
	display: flex;
	align-items: baseline;
	justify-content: center;
	flex-wrap: nowrap;
	white-space: nowrap;
	font-size: 48px;
	color: var(--white-color);
	margin: 0;
}

/* "m²" gibi çok karakterli son ekler rakamla aynı satırda kalsın diye
   daha küçük yazılır — aksi halde 48px'lik rakamla birlikte kutuya sığmayıp
   alt satıra taşıyordu. */
.about-us-counter-body h3 .counter-suffix {
	font-size: 22px;
}

/* Blog kartı başlığı — h2 yerine h3 (sayfanın h1'i page-header, bölüm
   başlığı h2 olduğu için kart başlıkları bir seviye altında kalır). */
.post-item-content h3 {
	font-size: 26px;
	line-height: 1.3em;
	margin-bottom: 8px;
}

.post-item-content h3 a {
	color: inherit;
}

/* Faaliyet kartı sektör etiketi — tıklanabilir olmadığı için <a> yerine <span>.
   Tema stilinin birebir aynısı span için tanımlanır. */
.project-item-content ul li span {
	position: relative;
	display: block;
	line-height: normal;
	font-size: 14px;
	font-weight: 500;
	color: var(--primary-color);
	border: 1px solid var(--divider-color);
	border-radius: 100px;
	padding: 5px 16px 5px 32px;
}

.project-item-content ul li span::before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 16px;
	height: 6px;
	width: 6px;
	background-color: var(--primary-color);
	border-radius: 50%;
}

@media only screen and (max-width: 767px) {
	.project-item-content ul li span::before {
		left: 12px;
	}
}

/* Kart başlıkları — h2 yerine h3 */
.service-item-content-metal h3 {
	font-size: 26px;
	line-height: 1.4em;
	color: var(--white-color);
}

.project-item-content h3 {
	font-size: 26px;
	line-height: 1.4em;
}

.project-item-content h3 a {
	color: inherit;
}

/* Yorum kartı — kişi adı h2 yerine h3, sayaç h2 yerine h4 */
.testimonial-author-content h3 {
	font-size: 20px;
	margin: 0;
}

.testimonial-item-counter h4 {
	min-width: 95px;
	font-size: 52px;
	margin: 0;
}


.main-menu ul li a.active {
	color: var(--accent-color) !important;
}

.main-menu ul ul li a.active,
.slicknav_nav a.active {
	color: var(--primary-color) !important;
}

/* --- Footer ------------------------------------------------------------ */
.footer-tagline-metal {
	font-family: var(--accent-font);
	font-size: 26px;
	line-height: 1.3em;
	color: var(--white-color);
	margin: 0;
}

.footer-address-metal {
	font-style: normal;
	margin: 0;
}

/* --- Faaliyet alanı: dış site kutusu ----------------------------------- */
.visit-site-box {
	background-color: var(--primary-color);
	border-radius: 20px;
	padding: 40px;
	margin-bottom: 30px;
}

.visit-site-box h2 {
	font-size: 26px;
	color: var(--white-color);
	margin-bottom: 15px;
}

.visit-site-box p {
	color: var(--white-color);
	opacity: 0.7;
	margin-bottom: 25px;
}

.visit-site-url {
	display: block;
	font-size: 14px;
	color: var(--white-color);
	opacity: 0.6;
	margin-top: 15px;
	word-break: break-all;
}

/* --- Faaliyet alanı: künye kutusu -------------------------------------- */
.facts-box {
	background-color: var(--bg-color);
	border-radius: 20px;
	padding: 40px;
	margin-bottom: 30px;
}

.facts-box h2 {
	font-size: 26px;
	margin-bottom: 25px;
}

.facts-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.facts-list li {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 15px;
	justify-content: space-between;
	padding: 14px 0;
	border-bottom: 1px solid var(--divider-color);
}

.facts-list li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.facts-list li span {
	color: var(--text-color);
}

.facts-list li strong {
	font-weight: 500;
	color: var(--primary-color);
	text-align: right;
}

/* --- Faaliyet alanı: ürün / hizmet listesi ----------------------------- */
.product-list {
	list-style: none;
	padding: 0;
	margin: 0 0 30px;
}

.product-list li {
	position: relative;
	padding: 0 0 0 32px;
	margin-bottom: 14px;
	color: var(--text-color);
}

.product-list li:last-child {
	margin-bottom: 0;
}

.product-list li::before {
	content: "\f00c";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	position: absolute;
	top: 2px;
	left: 0;
	font-size: 13px;
	color: var(--accent-color);
}

/* --- content-box: Misyon, Vizyon ve Değerlerimiz kartları --------------- */
.content-box {
	height: calc(100% - 30px);
	margin-bottom: 30px;
	background-color: var(--bg-color);
	border-radius: 20px;
	padding: 50px 40px;
}

.content-box .icon-box {
	width: 70px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--accent-color);
	border-radius: 50%;
	margin-bottom: 25px;
}

.content-box .icon-box img {
	max-width: 34px;
	filter: brightness(0) invert(1);
}

.content-eyebrow {
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent-color);
	margin-bottom: 12px;
}

.content-box h2 {
	font-size: 30px;
	line-height: 1.3em;
	margin-bottom: 18px;
}

.content-box h3 {
	font-size: 24px;
	line-height: 1.3em;
	margin-bottom: 15px;
}

/* Sayı kutularının sütun içinde ortalanması */
.stat-box-wrapper {
	display: flex;
	justify-content: center;
	margin-bottom: 30px;
}

.content-list {
	list-style: none;
	padding: 0;
	margin: 25px 0 0;
}

.content-list li {
	position: relative;
	padding: 0 0 0 30px;
	margin-bottom: 14px;
	color: var(--text-color);
}

.content-list li:last-child {
	margin-bottom: 0;
}

.content-list li::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 10px;
	height: 10px;
	background-color: var(--accent-color);
	border-radius: 50%;
}

/* --- Belgelerimiz ------------------------------------------------------- */
.certificate-category {
	margin-bottom: 60px;
}

.certificate-category:last-child {
	margin-bottom: 0;
}

.certificate-category-title {
	font-size: 30px;
	padding-bottom: 20px;
	margin-bottom: 40px;
	border-bottom: 1px solid var(--divider-color);
}

.certificate-item {
	height: 100%;
	display: flex;
	flex-direction: column;
	background-color: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 30px;
	transition: all 0.3s ease-in-out;
}

.certificate-item:hover {
	box-shadow: 0 20px 40px rgba(2, 22, 35, 0.08);
	transform: translateY(-5px);
}

.certificate-item-image {
	position: relative;
	display: block;
	background-color: var(--bg-color);
	overflow: hidden;
}

.certificate-item-image img {
	width: 100%;
	height: 320px;
	object-fit: contain;
	object-position: center;
	padding: 20px;
	transition: transform 0.4s ease-in-out;
}

.certificate-item:hover .certificate-item-image img {
	transform: scale(1.04);
}

.certificate-item-body {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	padding: 30px;
}

.certificate-item-body h3 {
	font-size: 22px;
	line-height: 1.35em;
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
}

.certificate-item-body p {
	flex-grow: 1;
	margin-bottom: 20px;
}

.certificate-item-year {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--accent-color);
	margin-bottom: 10px;
}

.certificate-item-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.certificate-item-pdf {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background-color: var(--bg-color);
	color: var(--accent-color);
	font-size: 18px;
	line-height: 1;
	transition: all 0.25s ease-in-out;
}

.certificate-item-pdf:hover {
	background-color: var(--accent-color);
	color: var(--white-color);
}

.certificate-item-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
}

/* --- Referans logoları -------------------------------------------------- */
.reference-logo-item {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 140px;
	background-color: var(--white-color);
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	padding: 25px;
	margin-bottom: 30px;
	transition: all 0.3s ease-in-out;
}

.reference-logo-item:hover {
	border-color: var(--accent-color);
	box-shadow: 0 15px 30px rgba(2, 22, 35, 0.07);
}

.reference-logo-item img {
	max-width: 100%;
	max-height: 70px;
	object-fit: contain;
}

.reference-logo-item:hover img {
	opacity: 1;
}

/* --- Yorum kartı: görsel yerine baş harfler ----------------------------- */
.testimonial-initials {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-family: var(--accent-font);
	font-size: 22px;
	color: var(--white-color);
	background-color: var(--accent-color);
	border-radius: 50%;
}

/* --- İletişim kartları --------------------------------------------------- */
.contact-card {
	height: 100%;
	background-color: var(--bg-color);
	border-radius: 20px;
	padding: 40px 35px;
	margin-bottom: 30px;
}

.contact-card .icon-box {
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--accent-color);
	border-radius: 50%;
	margin-bottom: 22px;
}

.contact-card .icon-box img {
	max-width: 26px;
}

.contact-card h3 {
	font-size: 22px;
	margin-bottom: 12px;
}

.contact-card p,
.contact-card address {
	font-style: normal;
	color: var(--text-color);
	margin: 0;
}

.contact-card a {
	color: var(--primary-color);
	font-weight: 500;
}

.contact-card a:hover {
	color: var(--accent-color);
}

.contact-hours-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.contact-hours-list li {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 12px;
	justify-content: space-between;
	padding: 8px 0;
	color: var(--text-color);
}

.contact-hours-list li span {
	color: var(--primary-color);
	font-weight: 500;
}

/* --- Ortalanmış bölüm butonu -------------------------------------------- */
.section-btn-center {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

/* --- Faaliyet detayı: içerik gövdesi ------------------------------------ */
.service-entry h3 {
	font-size: 34px;
	line-height: 1.2em;
	margin-bottom: 20px;
}

.service-entry .content-box {
	padding: 30px 25px;
	margin-bottom: 30px;
}

.service-entry .content-box h4 {
	font-size: 20px;
	line-height: 1.3em;
	margin-bottom: 12px;
}

.service-entry .section-sub-title {
	display: block;
	margin-bottom: 12px;
}

/* --- Boş liste bilgilendirmesi ------------------------------------------ */
.empty-message {
	text-align: center;
	padding: 60px 20px;
	color: var(--text-color);
}

/* --- Küçük ekran düzeltmeleri -------------------------------------------- */
@media only screen and (max-width: 767px) {
	.counters-title h2 {
		text-align: left!important;
	}
	.story-counter-row-minimal {
		justify-content: left!important;
	}
	.visit-site-box,
	.facts-box {
		padding: 30px 25px;
	}

	.content-box {
		padding: 35px 25px;
	}

	.certificate-item-image img {
		height: 260px;
	}

	.about-us-experienc-box-metal h3.experience-value {
		font-size: 70px;
	}
}


/* ==========================================================================
   3) Panelden Gelen Zengin Metin (rich_text / TinyMCE)
   --------------------------------------------------------------------------
   Panelde yazılan içerikte class bulunmayabilir; bu yüzden liste ve paragraf
   stilleri, kapsayıcıya göre de uygulanır. Böylece editörde class silinse
   bile görünüm bozulmaz.
   ========================================================================== */

.content-box .content-list-wrapper ul,
.service-entry .content-list-wrapper ul {
	list-style: none;
	padding: 0;
	margin: 25px 0 0;
}

.content-box .content-list-wrapper ul li,
.service-entry .content-list-wrapper ul li {
	position: relative;
	padding: 0 0 0 30px;
	margin-bottom: 14px;
	color: var(--text-color);
}

.content-box .content-list-wrapper ul li:last-child,
.service-entry .content-list-wrapper ul li:last-child {
	margin-bottom: 0;
}

.content-box .content-list-wrapper ul li::before,
.service-entry .content-list-wrapper ul li::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 10px;
	height: 10px;
	background-color: var(--accent-color);
	border-radius: 50%;
}

/* Zengin metin içindeki son paragrafın alt boşluğu kutuyu şişirmesin. */
.content-box p:last-child,
.about-us-body p:last-child {
	margin-bottom: 0;
}


/* ==========================================================================
   4) İletişim Formu (Gelen Kutusu modülüne yazar)
   ========================================================================== */

/* Bot tuzağı — ekran okuyucudan da, gözden de gizli ama "display:none"
   değil; bazı botlar display:none alanları atlar. */
.contact-form-honeypot {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Gönderim sonucu bildirimleri */
.contact-form-alert {
	border-radius: 10px;
	padding: 16px 20px;
	margin-bottom: 30px;
	font-weight: 500;
	line-height: 1.5em;
}

/* Önce düz renk (eski tarayıcılar), sonra color-mix (destekleyenler) */
.contact-form-alert-success {
	background: rgba(55, 145, 60, 0.1);
	border: 1px solid rgba(55, 145, 60, 0.4);
	background: color-mix(in srgb, var(--accent-color) 12%, transparent);
	border-color: color-mix(in srgb, var(--accent-color) 40%, transparent);
	color: var(--accent-color);
}

.contact-form-alert-error {
	background: rgba(230, 87, 87, 0.1);
	border: 1px solid rgba(230, 87, 87, 0.35);
	background: color-mix(in srgb, var(--error-color) 10%, transparent);
	border-color: color-mix(in srgb, var(--error-color) 35%, transparent);
	color: var(--error-color);
}

/* Sunucu tarafı hata mesajları — tema help-block stiliyle aynı görünür. */
.contact-form .help-block.with-errors ul {
	list-style: none;
	padding: 0;
	margin: 8px 0 0;
}

.contact-form .help-block.with-errors ul li {
	color: var(--error-color);
	font-weight: 500;
	font-size: 14px;
}

.contact-form textarea.form-control {
	resize: vertical;
	min-height: 140px;
}

/* Güvenlik kodu (captcha) — görsel + yenile butonu + giriş alanı tek satırda. */
.contact-form-captcha {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.contact-form-captcha img {
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, 0.08);
	display: block;
}

.contact-form-captcha-refresh {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.12);
	background: transparent;
	color: var(--accent-color);
	cursor: pointer;
	flex-shrink: 0;
	transition: background-color 0.2s ease;
}

.contact-form-captcha-refresh:hover,
.contact-form-captcha-refresh:focus-visible {
	background: rgba(0, 0, 0, 0.05);
}

.contact-form-captcha input {
	flex: 1 1 160px;
	min-width: 160px;
}

/* --- İletişim bilgi sütunu ---------------------------------------------- */

/* <address> etiketi tarayıcı varsayılanında italiktir; başlık görünümünü korur. */
.contact-info-item-content address {
	font-style: normal;
	margin: 0;
	font: inherit;
	color: inherit;
}

.contact-info-item-content .contact-hours-list {
	margin-top: 4px;
}

.contact-info-item-content .contact-hours-list li {
	padding: 4px 0;
	justify-content: flex-start;
	gap: 6px;
}

.contact-info-item-content .contact-hours-list li span::after {
	content: ":";
}


/* ==========================================================================
   5) "Sayılarla" Bölümü Arka Planı + Minimal Sayaç Satırı
   --------------------------------------------------------------------------
   .our-story-metal (Anasayfa "Sayılarla Sedef Tarım" bandı) temada sabit bir
   stok fotoğrafa (story-bg-image-metal.jpg) işaret ediyor. Kendi
   fotoğrafımızla değiştiriyoruz; içerik fotoğrafın alt kısmında olduğu için
   background-position alttan hizalanır.

   Temanın orijinal iki sütunlu kart tasarımı (büyük, boş görünen kartlar)
   yerine ortalanmış başlık + tek satır sade sayaç listesi kullanılıyor.
   ========================================================================== */
.our-story-metal {
	background-image: url('../images/sedef/saha-tanitim-gunu.jpg');
	background-position: bottom center;
}

.story-counter-row-minimal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 60px;
	margin-top: 50px;
}

.story-counter-minimal-item {
	display: flex;
	align-items: center;
	gap: 20px;
}

.story-counter-minimal-item .icon-box {
	width: 56px;
	height: 56px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--accent-color);
	border-radius: 50%;
}

.story-counter-minimal-item .icon-box img {
	max-width: 26px;
}

.story-counter-minimal-content h3 {
	margin: 0;
	font-size: 42px;
	line-height: 1;
	color: var(--white-color);
}

.story-counter-minimal-content p {
	margin: 6px 0 0;
	color: var(--white-color);
	opacity: 0.75;
}

@media (max-width: 767px) {
	.story-counter-row-minimal {
		gap: 30px;
	}

	.story-counter-minimal-content h3 {
		font-size: 32px;
	}
}


/* ==========================================================================
   6) Kurumsal Sayfa Kenar Çubuğu — Aktif Sayfa
   --------------------------------------------------------------------------
   .page-category-list temada sadece "diğer" öğeleri listelemek için
   kullanılıyordu (aktif/seçili durumu yok). Kurumsal sayfa listesinde
   bulunulan sayfayı vurgulamak için eklendi.
   ========================================================================== */
.page-category-list ul li a.active {
	color: var(--accent-color);
	font-weight: 700;
}
