/* ------------------------------------------------------------------
 * Grib - Custom CSS
 * Site-specific style overrides. Loaded last, after all theme styles.
 * ------------------------------------------------------------------ */

/* ==================================================================
 * FAZ 1 — LAYOUT: full-width shell
 * Content sits in a wider, fluid container; page-builder sections
 * marked "Full Width" already stretch edge-to-edge.
 * ================================================================== */

/* wider, fluid inner container (bounded sections stay readable) */
@media (min-width: 1200px) {
	.container,
	.fw-container,
	#footerTop.container,
	#page-body.container {
		width: auto !important;
		max-width: 1440px !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 24px;
		padding-right: 24px;
	}
}
@media (min-width: 1800px) {
	.container,
	.fw-container,
	#footerTop.container,
	#page-body.container { max-width: 1560px !important; }
}

/* page-builder pages: content clears the (now slimmer) fixed header */
.builder-page-content { margin-top: 74px !important; }
.builder-page-content.blank--header { margin-top: 0 !important; }

/* full-width page-builder sections stay truly edge-to-edge */
.fw-container-fluid { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.fw-container-fluid > .fw-row { margin-left: 0 !important; margin-right: 0 !important; }
.fw-container-fluid > .fw-row > .fw-col-xs-12 { padding-left: 0 !important; padding-right: 0 !important; }

/* the hero slider always breaks out to the full viewport width.
   overflow-x: clip (not hidden) doesn't create a scroll container, so the
   fixed admin bar / sticky header keep working. */
html, body { overflow-x: clip; }
.fw-main-row [id^='gri-owl-slider'] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* the old top white-fade overlay was there to read text under a transparent
   header; the header is solid now, so drop it (kills the big white band) */
.slider-bg > i,
[id^='gri-owl-slider'] .slider-bg > i { display: none !important; }

/* ==================================================================
 * FAZ 1 — HEADER: slimmer bar, smaller logo, room for more menu items
 * ================================================================== */

@media (min-width: 1081px) {
	#header #menu-bar { height: 74px !important; }
	#header #menu-bar:after { height: 74px !important; }

	/* logo sits flush inside the bar — no protruding slab */
	#header.logo-left #header-logo,
	#header.logo-center #header-logo { width: 168px; height: 74px !important; }
	#header #header-logo a { line-height: 74px; }
	#header #header-logo img { height: 36px !important; width: auto; vertical-align: middle; }

	#header.logo-left [id^='top-menu'] { width: calc(100% - 240px); }

	/* top-level links fill the full bar height — no dead strip below the
	   label, so the pointer never leaves a hover target on the way down */
	#header [id^='top-menu'] > div > ul > li > a {
		padding: 28px 15px !important;
		line-height: 18px;
	}
	#header [id^='top-menu'] ul li.menu-item-has-children > a { padding-right: 24px !important; }
	#header [id^='top-menu'] ul li.menu-item-has-children > a:after { line-height: 74px; }

	#header .search_button { line-height: 74px; }

	/* dropdowns open flush against the bar */
	#header [id^='top-menu'] ul li ul { top: 74px; }

	/* keep the dropdown open while the pointer is over the submenu itself,
	   and bridge any hairline gap with a transparent strip */
	#header [id^='top-menu'] ul li:hover > ul,
	#header [id^='top-menu'] ul li > ul:hover { display: block; opacity: 1; }
	#header [id^='top-menu'] > div > ul > li.menu-item-has-children:hover > a:before {
		content: "";
		position: absolute;
		left: 0; right: 0; bottom: -8px;
		height: 10px;
	}
}

/* ==================================================================
 * Header — modernised. Deeper, logo-aligned navy; tighter typography;
 * cleaner active/hover indicator. Keeps the corporate, uncluttered feel.
 * ================================================================== */

/* --- header travels with the page (fixed, not absolute) --- */
#header {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 120;
}
body.admin-bar #header { top: 32px; }
@media screen and (max-width: 782px) {
	body.admin-bar #header { top: 46px; }
}
/* the theme's separate scroll-clone bar is redundant now */
#sticky-menu { display: none !important; }

/* --- bar background: subtle depth instead of a flat block --- */
#header #menu-bar {
	background: linear-gradient(180deg, #1E5AA0 0%, #17406E 100%) !important;
	box-shadow: 0 6px 24px rgba(9, 26, 48, 0.18);
	border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}
#header #menu-bar:after {
	background: #17406E !important;
}

/* --- logo panel: keep it white (logo is dark blue) but make it feel
       intentional — a clean panel that lifts off the bar --- */
#header #header-logo {
	background-color: #ffffff !important;
	padding: 0 22px;
	box-shadow: 3px 0 14px rgba(9, 26, 48, 0.10);
	position: relative;
	z-index: 2;
}

/* --- navigation: modern tracking + weight, smooth transitions --- */
#header [id^='top-menu'] ul li a {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.2px;
	color: rgba(255, 255, 255, 0.86);
	transition: color 0.18s ease;
}
#header [id^='top-menu'] ul li a:hover {
	color: #ffffff;
}

/* --- active / hover indicator: a clean centred underline, no muddy wash --- */
#header [id^='top-menu'] > div > ul > li > a:after {
	content: "";
	position: absolute;
	left: 15px;
	right: 15px;
	bottom: 18px;
	height: 2px;
	background: #7fb2e6;
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 0.22s ease;
}
#header [id^='top-menu'] > div > ul > li:hover > a:after,
#header [id^='top-menu'] > div > ul > li.current_page_item > a:after,
#header [id^='top-menu'] > div > ul > li.current-menu-item > a:after,
#header [id^='top-menu'] > div > ul > li.current-menu-parent > a:after {
	transform: scaleX(1);
}
/* neutralise the theme's old full-width border + background tint
   (top-level items only — do NOT touch dropdown links) */
#header [id^='top-menu'] > div > ul > li.current_page_item,
#header [id^='top-menu'] > div > ul > li.current-menu-parent,
#header [id^='top-menu'] > div > ul > li.current-menu-item,
#header [id^='top-menu'] > div > ul > li > a:hover,
#header [id^='top-menu'] > div > ul > li.current_page_item > a,
#header [id^='top-menu'] > div > ul > li.current-menu-parent > a {
	border-bottom: 0 none !important;
	background: transparent !important;
}

/* dropdown links keep a solid single-colour background on hover */
#header [id^='top-menu'] ul li ul li a:hover {
	background-color: #1E5AA0 !important;
	color: #ffffff !important;
	border-bottom: 0 none !important;
}

/* --- search button: lighter, subtle interaction --- */
#header .search_button {
	color: rgba(255, 255, 255, 0.82);
	transition: color 0.18s ease, transform 0.18s ease;
}
#header .search_button:hover {
	color: #ffffff !important;
	transform: scale(1.08);
}

/* --- dropdown submenus: navy-tinted to match, softer edges --- */
#header [id^='top-menu'] ul li ul li a {
	background-color: rgba(18, 52, 87, 0.97) !important;
}
#header [id^='top-menu'] ul li ul {
	box-shadow: 0 12px 30px rgba(9, 26, 48, 0.22);
	border-radius: 0 0 4px 4px;
	overflow: hidden;
}

/* ==================================================================
 * Footer — same modernised navy language as the header.
 * ================================================================== */

body #footerContainer {
	background: linear-gradient(180deg, #1E5AA0 0%, #17406E 100%) !important;
}

/* bottom strip: one step deeper for separation */
body #footerContainer #footerBottom {
	background: #123457 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* widget headings: lighter hairline with a hint of the accent */
body #footerContainer #footerTop h4,
body #footerContainer #footerTop h1,
body #footerContainer #footerTop .widget-title {
	border-bottom: 1px solid rgba(127, 178, 230, 0.35) !important;
	color: #ffffff !important;
	letter-spacing: 0.2px;
}

/* body copy / links inside the footer */
body #footerContainer #footerTop a {
	transition: color 0.18s ease;
}
body #footerContainer #footerTop a:hover {
	color: #9fc6ef !important;
}

/* social icons: subtle outline, solid accent on hover */
body #footerContainer #footerTop .fo-socialmedia ul > li {
	border: 1px solid rgba(255, 255, 255, 0.28) !important;
	border-radius: 4px;
	transition: border-color 0.18s ease, background-color 0.18s ease;
}
body #footerContainer #footerTop .fo-socialmedia ul > li:hover {
	border-color: #7fb2e6 !important;
}
body #footerContainer #footerTop .fo-socialmedia ul > li a {
	transition: background-color 0.18s ease, color 0.18s ease;
}
body #footerContainer #footerTop .fo-socialmedia ul > li a:hover {
	background-color: #7fb2e6 !important;
	color: #123457 !important;
}

/* bottom menu links */
body #footerContainer #footerBottom .footer-info li a {
	color: rgba(255, 255, 255, 0.72);
	letter-spacing: 0.2px;
	transition: color 0.18s ease;
}
body #footerContainer #footerBottom .footer-info li a:hover,
body #footerContainer #footerBottom a:hover {
	color: #ffffff !important;
}
body #footerContainer #footerBottom .copyright,
body #footerContainer #footerBottom {
	color: rgba(255, 255, 255, 0.62);
}

/* scroll-to-top button: match the header accent */
#scrollToTop {
	background-color: #17406E !important;
	border: 1px solid rgba(255, 255, 255, 0.30) !important;
	box-shadow: 0 6px 18px rgba(9, 26, 48, 0.35);
	transition: background-color 0.18s ease, transform 0.18s ease;
}
#scrollToTop:hover {
	background-color: #1E5AA0 !important;
	transform: translateY(-2px);
}

/* ==================================================================
 * FAZ 2 — Content surfaces: white background, brand-blue headings,
 * modern equal-height service cards.
 * ================================================================== */

body { background: #ffffff !important; }

/* --- section / special headings: brand primary, real presence --- */
.fw-heading .fw-special-title {
	color: #1B57A0 !important;
	font-weight: 700;
	font-size: 28px;
	line-height: 1.25;
	letter-spacing: -0.2px;
	margin-bottom: 6px;
}
.fw-heading .fw-special-subtitle,
.fw-heading p { color: #5b6b7c !important; }

/* --- service cards: one white card language, equal height --- */
.service-boxes .row,
.three-box .row { align-items: stretch; }

.single-service { margin-top: 12px !important; margin-bottom: 12px !important; }
.single-service > .item-col {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid #e9edf3;
	border-radius: 10px;
	box-shadow: 0 6px 22px rgba(18, 52, 87, 0.06);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.single-service > .item-col:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 34px rgba(18, 52, 87, 0.12);
	border-color: #cfe0f2;
}

/* icon cards ("Deniz Yapıları" …): compact, content vertically centred */
.single-service.icon-position-top > .item-col {
	padding: 24px 22px !important;
	text-align: center;
	justify-content: center;
}
/* icon in a small tinted circle instead of a tall empty box */
.single-service.icon-position-top > .item-col > .icon {
	width: 58px !important;
	height: 58px !important;
	line-height: 58px !important;
	border-radius: 50% !important;
	background: #eef4fb;
	margin: 0 auto 14px !important;
	flex: 0 0 auto;
}
.single-service > .item-col > .icon i {
	font-size: 26px;
	line-height: 58px;
	color: #1B57A0;
}
.single-service > .item-col .content { flex: 0 1 auto; }
.single-service > .item-col .content h4 {
	color: #1B57A0;
	font-size: 17px;
	font-weight: 600;
	margin: 0 0 8px;
}
.single-service > .item-col .content,
.single-service > .item-col .content p {
	font-size: 14px;
	line-height: 1.55;
	color: #5b6b7c;
	margin-bottom: 0;
}

/* image cards ("Sektörde 29. Yıl" …): flush image, left-aligned text */
.single-service-image > .item-col {
	padding: 0 !important;
	overflow: hidden;
}
.single-service-image .box-img img {
	width: 100%;
	height: auto;
	display: block;
}
.single-service-image .box-text {
	padding: 20px 22px 24px !important;
	text-align: left !important;
	flex: 1 1 auto;
}
.single-service-image .box-text .w-iconbox-title {
	text-align: left !important;
	color: #1B57A0;
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 8px;
}
.single-service-image .box-text p {
	text-align: left !important;
	font-size: 14px;
	line-height: 1.6;
	color: #5b6b7c;
	margin: 0;
}

/* ==================================================================
 * FAZ 3 — MEGA MENU
 * Panel-editable via Appearance → Menus: add the CSS class "mega" to a
 * top-level menu item (e.g. "Ürünler"); nest categories under it (one
 * or two levels). No plugin — pure WP menu + CSS.
 * ================================================================== */

@media (min-width: 1081px) {

	/* the mega item's dropdown escapes its <li> to span the whole bar
	   (selectors kept loose so a real nav-menu `ul.sub-menu` and the page
	   fallback `ul.children` both work) */
	#header [id^='top-menu'] ul li.mega { position: static !important; }

	#header [id^='top-menu'] li.mega > ul {
		left: 0 !important;
		right: 0 !important;
		top: 74px !important;
		width: 100% !important;
		min-width: 0 !important;
		display: grid !important;
		grid-template-columns: repeat(4, 1fr);
		align-content: start;
		gap: 4px 44px;
		/* center an ~1360px inner content area within the full-width panel */
		padding: 28px max(24px, calc(50% - 680px)) 34px !important;
		background: #ffffff !important;
		border-top: 1px solid #e9edf3;
		border-radius: 0 0 6px 6px;
		box-shadow: 0 26px 50px rgba(9, 26, 48, 0.16);
	}

	/* with a promo image: flex layout, image pinned as a left sidebar */
	#header [id^='top-menu'] li.mega.mega-has-promo > ul {
		display: flex !important;
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 6px 40px;
	}
	#header li.mega > ul > li.mega-promo {
		order: -1;
		flex: 0 0 236px;
		margin: 0;
		align-self: stretch;
	}
	#header [id^='top-menu'] li.mega.mega-has-promo > ul > li:not(.mega-promo) {
		flex: 1 1 180px;
		min-width: 160px;
		max-width: calc((100% - 236px - 120px) / 3);
	}
	#header li.mega > ul > li.mega-promo > a {
		display: block !important;
		position: relative;
		height: 100%;
		min-height: 220px;
		border-radius: 8px;
		overflow: hidden;
		padding: 0 !important;
	}
	#header li.mega > ul > li.mega-promo .mega-promo-img {
		display: block;
		width: 100%;
		height: 100%;
		min-height: 220px;
		object-fit: cover;
	}
	#header li.mega > ul > li.mega-promo .mega-promo-cap {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 24px 16px 14px;
		color: #fff;
		font-weight: 700;
		font-size: 14px;
		letter-spacing: 0.3px;
		background: linear-gradient(180deg, rgba(9, 26, 48, 0) 0%, rgba(9, 26, 48, 0.78) 100%);
	}

	/* "Tümünü İncele →" — bottom-right of the panel */
	#header li.mega > ul > li.mega-viewall {
		position: absolute !important;
		right: max(24px, calc(50% - 680px)) !important;
		bottom: 14px !important;
		margin: 0 !important;
		padding: 0 !important;
		width: auto !important;
		list-style: none;
	}
	#header [id^='top-menu'] li.mega > ul > li.mega-viewall > a {
		display: inline-flex !important;
		align-items: center;
		gap: 9px;
		padding: 8px 0 !important;
		background: none !important;
		color: #1B57A0 !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-transform: uppercase;
		letter-spacing: 0.6px;
	}
	#header [id^='top-menu'] li.mega > ul > li.mega-viewall > a:hover {
		background: none !important;
		color: #17406E !important;
	}
	#header li.mega > ul > li.mega-viewall .mega-viewall-arrow {
		flex: 0 0 auto;
		transition: transform 0.18s ease;
	}
	#header li.mega > ul > li.mega-viewall > a:hover .mega-viewall-arrow {
		transform: translateX(4px);
	}
	/* give the panel room so the "Tümünü İncele" link doesn't overlap the last
	   column. (The panel is already position:absolute — that's what lets it
	   span the full bar — so it's the containing block for .mega-viewall;
	   do NOT add position:relative here, it collapses the full-width panel.) */
	#header [id^='top-menu'] li.mega.mega-has-promo > ul { padding-bottom: 56px !important; }
	/* the mega parent's own inline thumbnail is now shown as the promo */
	#header li.mega > a .grib-menu-image { display: none !important; }
	/* click-driven: closed by default, opens only with .mega-open (added by JS) */
	#header [id^='top-menu'] li.mega:not(.mega-open) > ul { display: none !important; opacity: 0 !important; }
	#header [id^='top-menu'] li.mega.mega-open > ul { opacity: 1 !important; }
	#header [id^='top-menu'] li.mega.mega-open:not(.mega-has-promo) > ul { display: grid !important; }
	#header [id^='top-menu'] li.mega.mega-open.mega-has-promo > ul { display: flex !important; }

	/* dimmed backdrop behind an open panel */
	.grib-mega-backdrop {
		position: fixed;
		inset: 0;
		background: rgba(9, 26, 48, 0.40);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.2s ease, visibility 0.2s ease;
		z-index: 90;
	}
	.grib-mega-backdrop.is-active { opacity: 1; visibility: visible; }

	/* (mega panel closes via Escape / backdrop / outside click — no X button) */
	.mega-close { display: none !important; }

	/* the open top-level item gets a persistent underline */
	#header [id^='top-menu'] > div > ul > li.mega.mega-open > a:after { transform: scaleX(1); }

	#header li.mega > ul > li {
		float: none;
		display: block;
		margin: 0;
		position: static;
	}

	/* every mega link: no theme background/white text on hover, left aligned
	   (extra [id^='top-menu'] keeps this ahead of the navy dropdown tint) */
	#header [id^='top-menu'] li.mega > ul li a,
	#header [id^='top-menu'] li.mega > ul li a:hover,
	#header [id^='top-menu'] li.mega > ul li a:focus {
		background: none !important;
		background-color: transparent !important;
		text-align: left !important;
		white-space: normal !important;
		border: 0 !important;
	}
	#header [id^='top-menu'] li.mega > ul li a:hover,
	#header [id^='top-menu'] li.mega > ul li a:focus {
		color: #1B57A0 !important;
	}
	/* group headers now link to their own group page — feel clickable */
	#header [id^='top-menu'] li.mega > ul > li.menu-item-has-children > a,
	#header [id^='top-menu'] li.mega > ul > li.page_item_has_children > a {
		color: #1B57A0 !important;
	}
	#header [id^='top-menu'] li.mega > ul > li.menu-item-has-children > a:hover,
	#header [id^='top-menu'] li.mega > ul > li.page_item_has_children > a:hover {
		color: #17406E !important;
	}
	#header [id^='top-menu'] li.mega > ul li.menu-item-has-children > a {
		border-bottom: 1px solid #e9edf3 !important;
	}

	/* level-1 entries: plain links when flat, bold blue headers when they
	   have children */
	#header li.mega > ul > li > a {
		color: #33475b !important;
		font-weight: 500 !important;
		font-size: 14px !important;
		line-height: 1.4 !important;
		padding: 8px 0 !important;
		transition: color 0.15s ease;
	}
	#header li.mega > ul > li > a:hover { color: #1B57A0 !important; }

	#header li.mega > ul > li.menu-item-has-children > a,
	#header li.mega > ul > li.page_item_has_children > a {
		color: #1B57A0 !important;
		font-weight: 700 !important;
		font-size: 12.5px !important;
		line-height: 1.35 !important;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		cursor: pointer;
		margin: 4px 0 6px;
		padding-bottom: 8px !important;
		border-bottom: 1px solid #e9edf3 !important;
		/* keep 1-line and 2-line headers the same height so the link
		   columns below them all start on the same baseline */
		display: flex !important;
		align-items: flex-end;
		min-height: 40px;
	}
	#header li.mega > ul > li > a:after { display: none !important; }

	/* level-2 entries render inline under their header (not as a flyout) */
	#header li.mega > ul > li > ul {
		position: static !important;
		display: block !important;
		opacity: 1 !important;
		min-width: 0 !important;
		left: auto !important;
		top: auto !important;
		width: auto !important;
		background: transparent !important;
		box-shadow: none !important;
		padding: 0 !important;
		margin: 2px 0 10px;
	}
	#header li.mega > ul > li > ul > li > a {
		background: transparent !important;
		color: #33475b !important;
		font-weight: 500 !important;
		font-size: 13.5px !important;
		padding: 5px 0 !important;
		white-space: normal !important;
		line-height: 1.4 !important;
	}
	#header li.mega > ul > li > ul > li > a:hover { color: #1B57A0 !important; }
	#header li.mega > ul > li > ul > li > a:after { display: none !important; }

	/* per-item images (added via Görünüm → Menüler → "Görsel seç") */
	.grib-menu-image { display: none; }

	#header li.mega > ul li a {
		display: flex !important;
		align-items: center;
		gap: 10px;
	}
	#header li.mega > ul li a .grib-menu-image {
		display: block;
		flex: 0 0 auto;
		width: 34px;
		height: 34px;
		object-fit: cover;
		border-radius: 6px;
		background: #f2f6fb;
	}
	/* level-1 header images a touch larger */
	#header li.mega > ul > li > a .grib-menu-image {
		width: 40px;
		height: 40px;
	}
}

/* ==================================================================
 * FAZ 4 — WooCommerce CATALOG grid (category / shop archives)
 * Full-bleed image cards, no inner padding, larger title. Prices &
 * add-to-cart hidden (catalog mode).
 * ================================================================== */

.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px !important;
	margin: 0 0 40px !important;
	padding: 0 !important;
	list-style: none !important;
}
/* WooCommerce's clearfix pseudo-elements become stray grid items → kill them */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after { display: none !important; content: none !important; }

@media (max-width: 1200px) { .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px)  { .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: 1fr; } }

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	clear: none !important;
	background: #EDF1F5;
	border: 0 !important;
	border-radius: 14px;
	overflow: hidden;
	display: flex !important;
	flex-direction: column;
	text-align: left !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after { display: none !important; }
.woocommerce ul.products li.product:hover {
	transform: translateY(-4px);
	background: #E4EBF2;
	box-shadow: 0 18px 40px rgba(18, 50, 90, 0.10);
}

/* image: sits on the same single card colour, whole product visible */
.woocommerce ul.products li.product > a:first-child {
	display: flex !important;
	flex-direction: column;
	flex: 1 1 auto;
	line-height: 0;
}
.woocommerce ul.products li.product img,
.woocommerce ul.products li.product a img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: transparent;
	mix-blend-mode: multiply;
	border: 0 !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: 26px 26px 14px !important;
	display: block;
}

/* title: larger, roomy padding */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
	font-size: 17px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: #16324f !important;
	margin: 0 !important;
	padding: 4px 22px 18px !important;
	flex: 0 0 auto;
	/* fixed 2-line block so every card's button lands at the same height */
	min-height: calc(1.4em * 2 + 22px);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* catalog mode: hide price + add-to-cart entirely */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product a.added_to_cart,
.woocommerce ul.products li.product .woocommerce-loop-product__link + .price {
	display: none !important;
}

/* "İncele →" affordance at the foot of each card */
.woocommerce ul.products li.product > a:first-child::after {
	content: "İncele \2192";
	display: block;
	margin: auto 22px 22px;
	padding: 11px 18px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	text-align: center;
	color: #ffffff;
	background: #1B57A0;
	border-radius: 0;
	line-height: 1.2;
	transition: background 0.15s ease;
}
.woocommerce ul.products li.product:hover > a:first-child::after { background: #16324f; }

/* result count + ordering row */
.woocommerce .woocommerce-result-count { color: #5b6b7c; font-size: 14px; line-height: 44px; margin: 0; }
.woocommerce .woocommerce-ordering { margin: 0 0 24px; }
.woocommerce .woocommerce-ordering select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 44px;
	padding: 0 44px 0 16px;
	font-size: 14px;
	font-weight: 600;
	color: #16324f;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231c528d' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 15px center;
	border: 1px solid #d7dee6;
	border-radius: 0;
	cursor: pointer;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.woocommerce .woocommerce-ordering select:hover { border-color: #1B57A0; }
.woocommerce .woocommerce-ordering select:focus {
	outline: none;
	border-color: #1B57A0;
	box-shadow: 0 0 0 3px rgba(28, 82, 141, 0.14);
}
.woocommerce .woocommerce-ordering select::-ms-expand { display: none; }

/* --- product archive / single header: kill the dark banner, use a clean
       white, centred title (like inoksan) --- */
body.woocommerce-page #page-banner {
	background: #ffffff !important;
	min-height: 0 !important;
	height: auto !important;
	padding: 128px 20px 14px !important;
	border-bottom: 0 !important;
	display: flex !important;
	flex-direction: column !important;
}
body.woocommerce-page #page-banner * {
	background: transparent !important;
}
body.woocommerce-page #banner-container {
	height: auto !important;
	min-height: 0 !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
}
body.woocommerce-page #banner-container .breadcrumb-custom { order: -1; }
body.woocommerce-page #banner-container .page-title { order: 0; }
body.woocommerce-page #banner-container .slider-bg,
body.woocommerce-page #banner-container > i,
body.woocommerce-page #banner-container img { display: none !important; }

body.woocommerce-page #page-banner .page-title h1,
body.woocommerce-page #page-banner .page-title {
	position: static !important;
	text-align: center !important;
	color: #16324f !important;
	text-shadow: none !important;
}
body.woocommerce-page #page-banner .page-title h1 {
	font-size: 34px !important;
	font-weight: 700 !important;
	letter-spacing: -0.4px;
	margin: 0 !important;
}

/* breadcrumb: small, centred, above the title */
body.woocommerce-page #page-banner .breadcrumb-custom {
	position: static !important;
	display: block !important;
	text-align: center !important;
	background: transparent !important;
	color: #8a99a8 !important;
	font-size: 12.5px !important;
	padding: 0 0 10px !important;
	order: -1;
}
body.woocommerce-page #page-banner .breadcrumb-custom,
body.woocommerce-page #page-banner .breadcrumb-custom ul li,
body.woocommerce-page #page-banner .breadcrumb-custom ul li strong { color: #8a99a8 !important; }
body.woocommerce-page #page-banner .breadcrumb-custom ul li a { color: #5b6b7c !important; }
body.woocommerce-page #page-banner .breadcrumb-custom ul li a:hover { color: #1B57A0 !important; }
/* readable separator (theme uses a FontAwesome glyph that isn't loaded) */
body.woocommerce-page #page-banner .breadcrumb-custom ul li:after {
	content: "/" !important;
	font-family: inherit !important;
	color: #c2ccd6 !important;
	right: -3px !important;
}
body.woocommerce-page #page-banner .breadcrumb-custom ul li:last-child:after { display: none !important; }

/* category description → a distinct bordered info panel above the results.
   On this theme the WC taxonomy archive renders `.term-description` as a direct
   child of `.standart-page-content` (no `tax-product_cat` body class), and the
   shop page renders it inside `.woocommerce-products-header`. */
.woocommerce .term-description,
body.woocommerce-page .standart-page-content > .term-description,
body.post-type-archive-product .woocommerce-products-header .term-description {
	max-width: none;
	margin: 0 0 30px;
	padding: 18px 22px;
	text-align: left;
	background: var(--bgz-surface);
	border: 1px solid var(--bgz-line);
	border-left: 3px solid var(--bgz-blue);
	border-radius: 8px;
	color: var(--bgz-text);
	font-size: 15px;
	line-height: 1.65;
}
.woocommerce .term-description > *:first-child { margin-top: 0; }
.woocommerce .term-description > *:last-child { margin-bottom: 0; }

/* single product: banner title is redundant (shown in the summary) */



/* =====================================================================
 * FAZ 5 — Site-wide form controls (same language as the ordering select:
 *          sharp corners, calm borders, blue focus ring, custom chevron)
 * ===================================================================== */
.grib-form-reset,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="week"],
input[type="month"],
input[type="datetime-local"],
textarea,
select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row .select2-container .select2-selection,
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 textarea,
.wpcf7 select,
.search-form input[type="search"],
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"],
#commentform textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 100%;
	max-width: 100%;
	min-height: 44px;
	padding: 0 16px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
	color: #16324f;
	background-color: #fff;
	border: 1px solid #d7dee6;
	border-radius: 0;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

textarea,
.woocommerce form .form-row textarea,
.wpcf7 textarea,
#commentform textarea {
	min-height: 128px;
	padding: 12px 16px;
	resize: vertical;
}

/* native selects get the custom chevron */
select,
.wpcf7 select,
.woocommerce .woocommerce-ordering select {
	padding-right: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231c528d' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 15px center;
	cursor: pointer;
}
select::-ms-expand { display: none; }

/* placeholder */
input::placeholder,
textarea::placeholder { color: #97a4b2; opacity: 1; }

/* hover + focus */
.grib-form-reset:hover,
input[type="text"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="url"]:hover,
input[type="search"]:hover,
input[type="password"]:hover,
input[type="number"]:hover,
input[type="date"]:hover,
textarea:hover,
select:hover,
.woocommerce form .form-row input.input-text:hover,
.wpcf7 input:hover,
.wpcf7 textarea:hover,
.wpcf7 select:hover {
	border-color: #1B57A0;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
textarea:focus,
select:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus,
.search-form input[type="search"]:focus,
#commentform input:focus,
#commentform textarea:focus {
	outline: none;
	border-color: #1B57A0;
	box-shadow: 0 0 0 3px rgba(28, 82, 141, 0.14);
}

/* WooCommerce Select2 single control alignment */
.woocommerce .select2-container--default .select2-selection--single {
	height: 44px;
	border: 1px solid #d7dee6;
	border-radius: 0;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 42px;
	padding-left: 16px;
	color: #16324f;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
.woocommerce .select2-container--default.select2-container--focus .select2-selection--single {
	border-color: #1B57A0;
	box-shadow: 0 0 0 3px rgba(28, 82, 141, 0.14);
}

/* checkbox / radio accent */
input[type="checkbox"],
input[type="radio"] { accent-color: #1B57A0; }

/* keep the header search-toggle input untouched by the width/height rules */
#header #search-box input,
#header .searchform input,
.top-search input {
	min-height: 0;
	width: auto;
}


/* =====================================================================
 * FAZ 6 — PALETTE: aligned to the homepage slider art.
 *   Single blue system (#1B57A0), cool high-key neutrals, no warm tones,
 *   no leftover green accent. Site-UI controls stay square (slider CTAs
 *   keep their pill shape in the artwork itself).
 * ===================================================================== */

:root {
	--bgz-blue:       #1B57A0;  /* primary — matches slide headline / button */
	--bgz-blue-dark:  #16497F;  /* pressed / borders / depth */
	--bgz-blue-tint:  #7FB2E6;  /* light accent — underlines, focus */
	--bgz-ink:        #16324F;  /* headings — dark steel blue */
	--bgz-text:       #3A4A5A;  /* body copy — cool grey */
	--bgz-muted:      #6B7C8C;  /* secondary text */
	--bgz-bg:         #F4F6F9;  /* page ground — faint cool grey */
	--bgz-surface:    #EDF1F5;  /* cards / wells */
	--bgz-line:       #D7DEE6;  /* hairlines */
}

/* page ground: faint cool grey so white sections and cards lift */
body { background-color: var(--bgz-bg); }

/* typography colour: cool, single-hue — scoped to content areas so it
   never bleeds into the header / footer / slider (white-on-dark) */
.standart-page-content h1, .standart-page-content h2, .standart-page-content h3,
.standart-page-content h4, .standart-page-content h5, .standart-page-content h6,
.builder-page-content h1, .builder-page-content h2, .builder-page-content h3,
.builder-page-content h4, .builder-page-content h5, .builder-page-content h6,
#single-page-content h1, #single-page-content h2, #single-page-content h3,
.woocommerce div.product .product_title,
article h1, article h2, article h3, article h4 { color: var(--bgz-ink); }

.standart-page-content p, .standart-page-content li,
.builder-page-content p, .builder-page-content li,
#single-page-content p, #single-page-content li,
.woocommerce div.product .woocommerce-product-details__short-description,
article p, article li { color: var(--bgz-text); }

.standart-page-content a, .builder-page-content a,
#single-page-content a, article p a { color: var(--bgz-blue); }
.standart-page-content a:hover, .builder-page-content a:hover,
#single-page-content a:hover, article p a:hover { color: var(--bgz-blue-dark); }

/* theme buttons / submit controls → the new blue, square */
body .btn,
body .btn.btn-default,
body .btn.btn-info,
body .btn.btn-darkblue,
body input[type='submit']:not([class]),
body button[type='submit'],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background-color: var(--bgz-blue) !important;
	border-color: var(--bgz-blue) !important;
	border-radius: 0 !important;
	color: #ffffff !important;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}
body .btn span { color: #ffffff !important; }
body .btn:hover, body .btn:focus, body .btn:active,
body input[type='submit']:not([class]):hover,
body button[type='submit']:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background-color: var(--bgz-blue-dark) !important;
	border-color: var(--bgz-blue-dark) !important;
}

/* pagination, badges, misc accents that blue.css paints */
body .pagination li .page-link,
body .pagination li .page-link.current { background-color: var(--bgz-blue); border-color: #ffffff; }

/* form focus ring picks up the token */
input:focus, textarea:focus, select:focus,
.woocommerce form .form-row input.input-text:focus {
	border-color: var(--bgz-blue) !important;
	box-shadow: 0 0 0 3px rgba(27, 87, 160, 0.15) !important;
}

/* section wells / info boxes that used a warm or flat grey */
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
blockquote {
	background: var(--bgz-surface);
	border-top-color: var(--bgz-blue);
}


/* =====================================================================
 * FAZ 7 — CLEAN HEADINGS + SIDEBAR-PAGE READING LAYOUT
 *
 *   (a) Clean white heading (title + breadcrumbs, no photo banner).
 *       Panel-driven only: page "Başlık Stili" → "Sadece Başlık"
 *       (adds #page-banner.header-style-title via the theme template).
 *
 *   (b) Reading layout for pages that use a left/right sidebar layout
 *       (page.php emits .page-left-sidebar / .page-right-sidebar on the
 *       content wrapper): slim sub-nav on the LEFT, single content column.
 *       No custom body class / plugin hook — pure theme markup.
 * ===================================================================== */

/* ---------- (a) clean white heading — "Sadece Başlık" ---------- */
#page-banner.header-style-title {
	background: #ffffff !important;
	min-height: 0 !important;
	height: auto !important;
	padding: 118px 0 6px !important;
	border-bottom: 0 !important;
	display: block !important;
}
#page-banner.header-style-title #banner-container {
	height: auto !important;
	min-height: 0 !important;
	padding: 0 !important;
	background-image: none !important;
	background-color: transparent !important;
}
#page-banner.header-style-title .slider-bg,
#page-banner.header-style-title > #banner-container > i,
#page-banner.header-style-title .header-image-curatin,
#page-banner.header-style-title img { display: none !important; }

#page-banner.header-style-title .page-title {
	position: static !important;
	bottom: auto !important;
	padding: 0 !important;
	margin: 0 !important;
}
/* kill the bootstrap column padding so the title's left edge lines up
   exactly with the sub-nav / content column */
#page-banner.header-style-title .page-title .col-md-12,
#page-banner.header-style-title .page-title [class*="col-"] {
	padding-left: 0 !important;
	padding-right: 0 !important;
	float: none !important;
	width: 100% !important;
}
#page-banner.header-style-title .page-title .container {
	max-width: 1100px !important;
	width: auto !important;
	margin: 0 auto !important;
	padding-left: 24px !important;
	padding-right: 24px !important;
}
#page-banner.header-style-title .page-title h1 {
	position: static !important;
	text-align: left !important;
	color: var(--bgz-ink) !important;
	text-shadow: none !important;
	font-size: 40px !important;
	font-weight: 700 !important;
	letter-spacing: -0.5px;
	margin: 0 !important;
}
#page-banner.header-style-title .breadcrumb-custom {
	position: static !important;
	display: block !important;
	background: transparent !important;
	text-align: left !important;
	/* breadcrumb sits inside .page-title .container already — flush-left with
	   the H1, no extra indent */
	margin: 0 !important;
	padding: 0 0 8px !important;
}
#page-banner.header-style-title .breadcrumb-custom ul { text-align: left !important; }
#page-banner.header-style-title .breadcrumb-custom,
#page-banner.header-style-title .breadcrumb-custom ul li,
#page-banner.header-style-title .breadcrumb-custom ul li strong { color: #8a99a8 !important; }
#page-banner.header-style-title .breadcrumb-custom ul li a { color: #5b6b7c !important; }
#page-banner.header-style-title .breadcrumb-custom ul li a:hover { color: var(--bgz-blue) !important; }
#page-banner.header-style-title .breadcrumb-custom ul li:after {
	content: "/" !important;
	font-family: inherit !important;
	color: #c2ccd6 !important;
	right: -3px !important;
}
#page-banner.header-style-title .breadcrumb-custom ul li:last-child:after { display: none !important; }

/* ---------- (b) sidebar-page reading layout ---------- */
body:has(.page-left-sidebar),
body:has(.page-right-sidebar) { background: #ffffff; }

.page-left-sidebar,
.page-right-sidebar { margin-top: 0 !important; }

.page-left-sidebar #content-and-sidebar,
.page-right-sidebar #content-and-sidebar {
	display: flex;
	gap: 60px;
	align-items: flex-start;
	max-width: 1100px !important;
	margin: 0 auto !important;
	padding: 30px 24px 90px !important;
}
.page-left-sidebar #page-sidebar,
.page-right-sidebar #page-sidebar {
	order: -1;
	flex: 0 0 190px;
	width: 190px;
	margin: 0;
	padding: 0;
	position: sticky;
	top: 100px;
}
.page-left-sidebar #single-page-content,
.page-right-sidebar #single-page-content {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 760px;
}

/* --- slim sub-navigation --- */
.page-left-sidebar #page-sidebar .widget,
.page-right-sidebar #page-sidebar .widget {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}
.page-left-sidebar #page-sidebar .widget-title,
.page-right-sidebar #page-sidebar .widget-title {
	margin: 0 0 14px;
	padding: 0;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #97a4b2;
}
.page-left-sidebar #page-sidebar ul,
.page-right-sidebar #page-sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}
.page-left-sidebar #page-sidebar ul li,
.page-right-sidebar #page-sidebar ul li {
	margin: 0;
	padding: 0;
	border: 0;
}
.page-left-sidebar #page-sidebar ul li a,
.page-right-sidebar #page-sidebar ul li a {
	display: block;
	padding: 9px 0 9px 16px;
	border-left: 2px solid #e4e9ef;
	color: #5b6b7c;
	font-size: 14.5px;
	line-height: 1.4;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.page-left-sidebar #page-sidebar ul li a:hover,
.page-right-sidebar #page-sidebar ul li a:hover {
	color: var(--bgz-blue);
	border-left-color: #b9cde4;
	background: none;
}
.page-left-sidebar #page-sidebar ul li.current-menu-item > a,
.page-left-sidebar #page-sidebar ul li.current_page_item > a,
.page-right-sidebar #page-sidebar ul li.current-menu-item > a,
.page-right-sidebar #page-sidebar ul li.current_page_item > a {
	color: var(--bgz-ink);
	font-weight: 600;
	border-left-color: var(--bgz-blue);
}

/* --- content typography: comfortable measure, airy --- */
.page-left-sidebar #single-page-content .fw-container,
.page-right-sidebar #single-page-content .fw-container { width: auto !important; padding: 0 !important; }
.page-left-sidebar #single-page-content .fw-row,
.page-right-sidebar #single-page-content .fw-row { margin: 0 !important; }
.page-left-sidebar #single-page-content .fw-col-xs-12,
.page-right-sidebar #single-page-content .fw-col-xs-12 { padding: 0 !important; }
.page-left-sidebar #single-page-content .fw-main-row,
.page-right-sidebar #single-page-content .fw-main-row { padding: 0 !important; }
.page-left-sidebar #single-page-content p,
.page-right-sidebar #single-page-content p {
	font-size: 17px;
	line-height: 1.75;
	color: #3a4a5a;
	margin: 0 0 1.35em;
}
.page-left-sidebar #single-page-content h2,
.page-right-sidebar #single-page-content h2 {
	font-size: 26px;
	font-weight: 700;
	color: var(--bgz-ink);
	margin: 1.7em 0 0.5em;
}
.page-left-sidebar #single-page-content h3,
.page-right-sidebar #single-page-content h3 {
	font-size: 20px;
	font-weight: 600;
	color: var(--bgz-ink);
	margin: 1.5em 0 0.4em;
}
.page-left-sidebar #single-page-content ul li,
.page-left-sidebar #single-page-content ol li,
.page-right-sidebar #single-page-content ul li,
.page-right-sidebar #single-page-content ol li {
	font-size: 17px;
	line-height: 1.7;
	color: #3a4a5a;
	margin: 0 0 0.5em;
}
.page-left-sidebar #single-page-content hr,
.page-left-sidebar #single-page-content .fw-divider-line,
.page-right-sidebar #single-page-content hr,
.page-right-sidebar #single-page-content .fw-divider-line {
	border: 0;
	border-top: 1px solid #e9edf3;
	margin: 2.4em 0;
	height: 0;
}
.page-left-sidebar #single-page-content .fw-divider-space,
.page-right-sidebar #single-page-content .fw-divider-space { height: 12px !important; min-height: 0 !important; }
.page-left-sidebar #single-page-content img,
.page-right-sidebar #single-page-content img { border-radius: 4px; }

/* --- responsive: stack, nav becomes a horizontal strip --- */
@media (max-width: 860px) {
	.page-left-sidebar #content-and-sidebar,
	.page-right-sidebar #content-and-sidebar {
		display: block;
		padding: 22px 20px 64px !important;
	}
	.page-left-sidebar #page-sidebar,
	.page-right-sidebar #page-sidebar {
		position: static;
		width: auto;
		float: none;
		margin: 0 0 30px;
	}
	.page-left-sidebar #page-sidebar ul,
	.page-right-sidebar #page-sidebar ul { display: flex; flex-wrap: wrap; }
	.page-left-sidebar #page-sidebar ul li a,
	.page-right-sidebar #page-sidebar ul li a { padding: 7px 14px; border-left: 0; border-bottom: 2px solid #e4e9ef; }
	#page-banner.header-style-title { padding-top: 104px !important; }
	#page-banner.header-style-title .page-title h1 { font-size: 30px !important; }
}


/* =====================================================================
 * FAZ 8 — HERO SLIDER: fill the opening screen exactly.
 *   Full-viewport height so the slide sits perfectly on load, the image
 *   covers the area without distortion, and the dots overlay the photo
 *   (visible, no extra height / no scroll jump).
 * ===================================================================== */

.fw-main-row [id^='gri-owl-slider'],
.fw-main-row [id^='gri-owl-slider'] .owl-carousel,
.fw-main-row [id^='gri-owl-slider'] .owl-stage-outer,
.fw-main-row [id^='gri-owl-slider'] .owl-stage-outer.owl-height,
.fw-main-row [id^='gri-owl-slider'] .owl-stage,
.fw-main-row [id^='gri-owl-slider'] .owl-item,
.fw-main-row [id^='gri-owl-slider'] .owl-item > .item {
	height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)) !important;
	min-height: 460px !important;
}
/* owl sets an inline pixel height on .owl-height via JS on every slide —
   neutralise its transition so there is no resize flicker */
.fw-main-row [id^='gri-owl-slider'] .owl-height { transition: none !important; }

/* the slide image covers the whole area, centred, no stretching */
.fw-main-row [id^='gri-owl-slider'] .owl-item > .item > img,
.fw-main-row [id^='gri-owl-slider'] .item img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
	display: block !important;
	max-width: none !important;
}

/* dots: overlaid on the photo, transparent strip, primary-colour bars */
.fw-main-row [id^='gri-owl-slider'] .owl-dots,
body div[id^='gri-owl-slider'] .owl-dots {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 44px !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	text-align: center !important;
	line-height: 0 !important;
	z-index: 20 !important;
}
.fw-main-row [id^='gri-owl-slider'] .owl-dots .owl-dot { outline: none !important; }
.fw-main-row [id^='gri-owl-slider'] .owl-dots .owl-dot span {
	display: block !important;
	width: 22px !important;
	height: 6px !important;
	margin: 0 4px !important;
	background: rgba(27, 87, 160, 0.45) !important;
	border: 0 !important;
	border-radius: 2px !important;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18) !important;
	transition: width 0.2s ease, background 0.2s ease !important;
}
.fw-main-row [id^='gri-owl-slider'] .owl-dots .owl-dot:hover span {
	background: rgba(27, 87, 160, 0.75) !important;
}
.fw-main-row [id^='gri-owl-slider'] .owl-dots .owl-dot.active span {
	width: 40px !important;
	background: var(--bgz-blue) !important;
}

/* per-slide link: full-cover anchor, kept below the caption/buttons so those
   stay independently clickable */
.fw-main-row [id^='gri-owl-slider'] .item { position: relative; }
.fw-main-row [id^='gri-owl-slider'] .item .slide-cover-link {
	position: absolute;
	inset: 0;
	z-index: 4;
	display: block;
}
.fw-main-row [id^='gri-owl-slider'] .item .slide--text { z-index: 6; }
.fw-main-row [id^='gri-owl-slider'] .item:has(.slide-cover-link) { cursor: pointer; }

/* mobile / short landscape: don't crop the wide slide art — show it whole */
@media (max-width: 820px) {
	.fw-main-row [id^='gri-owl-slider'],
	.fw-main-row [id^='gri-owl-slider'] .owl-carousel,
	.fw-main-row [id^='gri-owl-slider'] .owl-stage-outer,
	.fw-main-row [id^='gri-owl-slider'] .owl-stage-outer.owl-height,
	.fw-main-row [id^='gri-owl-slider'] .owl-stage,
	.fw-main-row [id^='gri-owl-slider'] .owl-item,
	.fw-main-row [id^='gri-owl-slider'] .owl-item > .item {
		height: auto !important;
		min-height: 0 !important;
	}
	.fw-main-row [id^='gri-owl-slider'] .owl-item > .item > img,
	.fw-main-row [id^='gri-owl-slider'] .item img {
		height: auto !important;
		aspect-ratio: 1838 / 1024;
		object-fit: cover !important;
	}
}

/* homepage: the slider is the first thing — no gap above it, header overlays */
body.home .builder-page-content,
body.page-template-default.home .builder-page-content { margin-top: 0 !important; }
body.home #page-body { padding-top: 0 !important; }

/* collapse the builder spacer/divider row that sits right above the hero
   slider on the homepage, so the slider truly starts at the top */
body.home .fw-main-row .fw-row:has(+ .fw-row [id^='gri-owl-slider']) {
	display: none !important;
}
body.home .fw-main-row .fw-row:has(+ .fw-row [id^='gri-owl-slider']) .fw-divider-space {
	height: 0 !important;
	min-height: 0 !important;
}


/* =====================================================================
 * FAZ 9 — HOMEPAGE PROMO ROWS  ([bgz_promo] / [bgz_promo_item])
 *   Full-width zig-zag: square image (40%) + title / text / button (60%).
 * ===================================================================== */

.bgz-promo {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: #ffffff;
}

.bgz-promo__row {
	display: flex;
	align-items: stretch;
}
.bgz-promo__row--imgright { flex-direction: row-reverse; }
.bgz-promo__row:nth-of-type(even) { background: var(--bgz-bg); }

.bgz-promo__media {
	flex: 0 0 50%;
	max-width: 50%;
	align-self: stretch;
	position: relative;
	aspect-ratio: 1 / 1;
	max-height: 640px;
	background: var(--bgz-surface);
	overflow: hidden;
}
.bgz-promo__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.bgz-promo__body {
	flex: 1 1 50%;
	min-width: 0;
	display: flex;
	align-items: center;
	padding: clamp(28px, 4.5vw, 80px);
}
.bgz-promo__row--imgright .bgz-promo__body { justify-content: flex-end; }
.bgz-promo__inner { max-width: 620px; }

.bgz-promo__title {
	margin: 0 0 16px;
	color: var(--bgz-ink);
	font-size: clamp(23px, 2.6vw, 34px);
	font-weight: 700;
	letter-spacing: -0.4px;
	line-height: 1.2;
}
.bgz-promo__desc { color: var(--bgz-text); }
.bgz-promo__desc p {
	margin: 0 0 1em;
	font-size: 16px;
	line-height: 1.75;
	color: var(--bgz-text);
}
.bgz-promo__desc p:last-child { margin-bottom: 0; }

.bgz-promo__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 26px;
	padding: 13px 26px;
	background: var(--bgz-blue);
	color: #ffffff !important;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	text-decoration: none !important;
	border-radius: 0;
	transition: background 0.15s ease;
}
.bgz-promo__btn:hover { background: var(--bgz-blue-dark); color: #ffffff !important; }
.bgz-promo__btn span {
	color: #ffffff !important; /* beat blue.css `body span` colouring the arrow dark */
	transition: transform 0.15s ease;
}
.bgz-promo__btn:hover span { transform: translateX(3px); }

@media (max-width: 900px) {
	.bgz-promo__row,
	.bgz-promo__row--imgright { flex-direction: column; }
	.bgz-promo__media {
		flex-basis: auto;
		max-width: 100%;
		width: 100%;
		aspect-ratio: 16 / 10;
		max-height: none;
	}
	.bgz-promo__body { padding: clamp(24px, 7vw, 44px); }
	.bgz-promo__row--imgright .bgz-promo__body { justify-content: flex-start; }
	.bgz-promo__inner { max-width: none; }
}


/* =====================================================================
 * FAZ 10 — COUNTER: "Transparent on Dark Background" theme
 *   (Sayaç Teması → "Koyu Arkaplan Üzeri") — no background, pure white
 *   icon / number / label, for use over the primary-blue sections.
 * ===================================================================== */

.counter_box_one.counter_on_dark {
	background: transparent !important;
	box-shadow: none !important;
	padding: 15px 0;
}
.counter_box_one.counter_on_dark i,
.counter_box_one.counter_on_dark .counter,
.counter_box_one.counter_on_dark h5,
.counter_box_one.counter_on_dark .perfix {
	color: #ffffff !important;
}
.counter_box_one.counter_on_dark .counter {
	font-size: 40px;
	font-weight: 800;
	letter-spacing: -0.5px;
}
.counter_box_one.counter_on_dark h5 {
	color: rgba(255, 255, 255, 0.82) !important;
	font-weight: 500;
	letter-spacing: 0.3px;
}
.counter_box_one.counter_on_dark i {
	opacity: 0.92;
	font-size: 42px;
	margin-bottom: 14px;
}


/* =====================================================================
 * FAZ 11 — SINGLE PRODUCT PAGE  (template: single-product.php)
 *   Clean, full-width, catalog-style: big gallery left, summary right
 *   (title + short desc + spec table + "Teklif İste"), tabs + related
 *   below. No blog byline / no news sidebar.
 * ===================================================================== */

/* empty banner title on product pages — keep only the breadcrumb */
#page-banner.header-style-title .page-title h1:empty { display: none !important; }

body.single-product #page-body.bgz-single-product {
	background: #ffffff;
	padding: 102px 0 80px;   /* sabit header (74px) + nefes payı; foto banner yok */
}
@media (max-width: 1080px) {
	body.single-product #page-body.bgz-single-product { padding-top: 88px; }
}
/* mobilde (<=768) #header gizli, #mobile-header normal akışta → sayfa
   üstündeki fixed-header payını her yerde kaldır */
@media (max-width: 768px) {
	body.single-product #page-body.bgz-single-product { padding-top: 14px; }
	#page-banner.header-style-title { padding-top: 20px !important; }
	body.woocommerce-page #page-banner { padding-top: 18px !important; }
	body.error404 #page-body.bgz-404 { padding-top: 40px; min-height: 0; }
}

/* breadcrumb — ürün başlığının hemen altında */
body.single-product .summary .bgz-product-breadcrumb {
	margin: 0 0 18px;
	padding: 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--bgz-muted);
	background: none;
}
body.single-product .summary .bgz-product-breadcrumb a {
	color: var(--bgz-muted);
	text-decoration: none;
}
body.single-product .summary .bgz-product-breadcrumb a:hover { color: var(--bgz-blue); }
body.single-product .summary .bgz-product-breadcrumb .bgz-crumb-sep {
	margin: 0 7px;
	color: #c2ccd6;
}
body.single-product .bgz-single-product .container { max-width: 1200px !important; }
body.single-product .bgz-single-product .woocommerce,
body.single-product .bgz-single-product .woocommerce .single-product { width: 100%; }

/* --- top: gallery | summary --- */
body.single-product div.product {
	display: flex !important;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 40px;
	margin: 0 !important;
}
body.single-product div.product > * { float: none !important; }

body.single-product div.product .woocommerce-product-gallery {
	flex: 0 0 46%;
	max-width: 46%;
	width: 46% !important;
	margin: 0 !important;
	position: relative !important;
	top: 0 !important;
}
body.single-product div.product .woocommerce-product-gallery__wrapper { margin: 0; }
body.single-product div.product .woocommerce-product-gallery__image {
	border: 0 !important;
	border-radius: 0 !important;
	overflow: hidden;
	background: #fff;
}
body.single-product div.product .woocommerce-product-gallery__image a { display: block; }
body.single-product div.product .woocommerce-product-gallery__image img { display: block; width: 100%; height: auto; }
body.single-product div.product .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}
body.single-product div.product .flex-control-thumbs li { width: auto; margin: 0; }
body.single-product div.product .flex-control-thumbs img {
	width: 74px;
	height: 74px;
	object-fit: cover;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	opacity: 0.7;
	transition: opacity 0.15s ease, border-color 0.15s ease;
}
body.single-product div.product .flex-control-thumbs img.flex-active,
body.single-product div.product .flex-control-thumbs img:hover { opacity: 1; border-color: var(--bgz-blue); }
body.single-product div.product .woocommerce-product-gallery__trigger { top: 14px; right: 14px; }

body.single-product div.product .summary.entry-summary {
	flex: 1 1 0;
	min-width: 0;
	margin: 0 !important;
	padding: 6px 0 0;
}
body.single-product div.product .summary.entry-summary > * { max-width: 580px; }

/* category badge above the title */
.bgz-product-cat {
	display: inline-block;
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--bgz-blue) !important;
	text-decoration: none !important;
}
.bgz-product-cat:hover { color: var(--bgz-blue-dark) !important; }

body.single-product .summary .product_title {
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.4px;
	color: var(--bgz-ink);
	margin: 0 0 9px;
}
body.single-product .summary .woocommerce-product-details__short-description {
	color: var(--bgz-text);
	font-size: 15.5px;
	line-height: 1.7;
	margin: 0 0 8px;
}
body.single-product .summary .woocommerce-product-details__short-description p { margin: 0 0 0.7em; }

/* --- spec table (product attributes) — a tight, light "quick specs" panel --- */
.bgz-spec {
	margin: 18px 0 4px;
	padding: 10px 14px;
	background: var(--bgz-surface);
	border: 1px solid var(--bgz-line);
	border-radius: 8px;
}
.bgz-spec__title {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #8a99a8;
	margin: 0 0 3px;
}
.bgz-spec table.woocommerce-product-attributes,
.bgz-spec .shop_attributes,
.bgz-spec .woocommerce-product-attributes {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	border: 0;
}
.bgz-spec table tr,
.bgz-spec .shop_attributes tr { border-bottom: 1px solid rgba(215,222,230,.6); background: none !important; }
.bgz-spec table tr:last-child { border-bottom: 0; }
/* WC sometimes emits an empty weight/dimensions row — hide any blank row */
.bgz-spec table tr:empty { display: none; }
.bgz-spec table th,
.bgz-spec table td,
.bgz-spec .shop_attributes th,
.bgz-spec .shop_attributes td,
.bgz-spec .woocommerce-product-attributes-item__label,
.bgz-spec .woocommerce-product-attributes-item__value {
	padding: 4px 2px !important;
	font-size: 12.5px;
	line-height: 1.4 !important;
	text-align: left;
	border: 0 !important;
	font-style: normal !important;
	vertical-align: top;
}
/* the theme puts padding:8px + line-height:32px on the value <p> — flatten it */
.bgz-spec table td p,
.bgz-spec .shop_attributes td p,
.bgz-spec .woocommerce-product-attributes-item__value p {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
}
.bgz-spec table th,
.bgz-spec .shop_attributes th,
.bgz-spec .woocommerce-product-attributes-item__label {
	width: 40%;
	color: #5b6b7c;
	font-weight: 600;
	padding-right: 14px !important;
}
.bgz-spec table td,
.bgz-spec .shop_attributes td,
.bgz-spec .woocommerce-product-attributes-item__value {
	color: var(--bgz-ink);
	font-weight: 500;
}

/* --- ölçü / model table (product tab) --- */
.bgz-size-table {
	width: 100%;
	border-collapse: collapse;
	margin: 4px 0 0;
	font-size: 14px;
}
.bgz-size-table th,
.bgz-size-table td {
	padding: 11px 16px;
	text-align: left;
	border: 1px solid var(--bgz-line);
}
.bgz-size-table thead th {
	background: var(--bgz-surface);
	color: var(--bgz-ink);
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.6px;
}
.bgz-size-table tbody tr:nth-child(even) { background: #fafbfc; }
.bgz-size-table tbody td { color: var(--bgz-text); }
.bgz-size-table tbody td:first-child { font-weight: 700; color: var(--bgz-ink); }

/* --- fixed trust/feature list (from Tema Ayarları → Ürün Sayfası) --- */
.bgz-product-features {
	list-style: none;
	margin: 24px 0 4px;
	padding: 18px 0 4px;
	border-top: 1px solid #eef1f5;
}
.bgz-product-features li {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	margin: 0 0 11px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--bgz-text);
}
.bgz-product-features li:last-child { margin-bottom: 0; }
.bgz-product-features li i {
	flex: 0 0 auto;
	margin-top: 2px;
	font-size: 15px;
	color: var(--bgz-blue);
}

/* --- catalog CTA --- */
.bgz-product-cta { margin: 26px 0 4px; }
.bgz-product-cta__row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 12px;
}
.bgz-product-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 15px 32px;
	background: var(--bgz-blue);
	color: #ffffff !important;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	text-decoration: none !important;
	border: 1px solid var(--bgz-blue);
	border-radius: 0;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.bgz-product-cta__btn:hover { background: var(--bgz-blue-dark); border-color: var(--bgz-blue-dark); color: #fff !important; }
.bgz-product-cta__btn span { color: #ffffff !important; transition: transform 0.15s ease; }
.bgz-product-cta__btn:hover span { transform: translateX(3px); }
.bgz-product-cta__phone {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 15px 26px;
	background: none;
	color: var(--bgz-ink) !important;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.2px;
	text-decoration: none !important;
	border: 1px solid var(--bgz-line);
	border-radius: 0;
	transition: border-color 0.15s ease, color 0.15s ease;
}
.bgz-product-cta__phone i { color: var(--bgz-blue); font-size: 13px; }
.bgz-product-cta__phone:hover { border-color: var(--bgz-blue); color: var(--bgz-blue) !important; }
.bgz-product-cta__phone:hover i { color: var(--bgz-blue); }

/* WhatsApp */
.bgz-product-cta__wa {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 15px 24px;
	background: #25D366;
	color: #ffffff !important;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	text-decoration: none !important;
	border: 1px solid #25D366;
	border-radius: 0;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.bgz-product-cta__wa:hover { background: #1EB855; border-color: #1EB855; color: #fff !important; }
.bgz-product-cta__wa .bgz-icon,
.bgz-product-cta__wa i { width: 19px; height: 19px; color: #ffffff; flex: 0 0 auto; }
.bgz-product-cta__wa span { color: #ffffff !important; }
.bgz-product-cta__note {
	display: block;
	margin-top: 12px;
	font-size: 13px;
	color: #8a99a8;
}

/* --- SKU / category line (if left visible anywhere) --- */
body.single-product .product_meta { font-size: 13px; color: #8a99a8; margin-top: 20px; }
body.single-product .product_meta > span { display: block; margin: 3px 0; }
body.single-product .product_meta a { color: #5b6b7c; }

/* --- tabs: a firm, squared "menu bar" + bordered panel (not underline tabs).
       Selectors carry `.woocommerce div.product` to outrank the theme's own
       tab rules; layout-critical props forced. --- */
body.single-product .woocommerce-tabs {
	flex-basis: 100%;
	width: 100%;
	margin-top: 46px;
	padding-top: 0;
	border-top: 0;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs {
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--bgz-line) !important;
	border-bottom: 0 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: stretch !important;
	gap: 0 !important;
	background: #fff !important;
	list-style: none !important;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs::before,
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs::after {
	display: none !important;
	content: none !important;
	width: 0 !important;
	border: 0 !important;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
	border-right: 1px solid var(--bgz-line) !important;
	border-radius: 0 !important;
	display: flex !important;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li:last-child { border-right: 0 !important; }
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li::before,
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; content: none !important; }
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: flex !important;
	align-items: center;
	padding: 14px 26px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 0.9px;
	color: var(--bgz-muted) !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none;
	transition: background 0.12s ease, color 0.12s ease;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	background: var(--bgz-surface) !important;
	color: var(--bgz-ink) !important;
}
body.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	background: var(--bgz-ink) !important;
	color: #fff !important;
}
body.single-product .woocommerce div.product .woocommerce-tabs .panel,
body.single-product .woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
	margin: -1px 0 0 !important;
	padding: 30px 32px !important;
	max-width: none !important;
	border: 1px solid var(--bgz-line) !important;
	background: #fff !important;
}
/* WC prepends an <h2> that just repeats the tab label — drop it */
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel > h2:first-child,
body.single-product .woocommerce-tabs .panel > h2:first-child { display: none !important; }
body.single-product .woocommerce-tabs .panel p {
	color: var(--bgz-text);
	font-size: 15px;
	line-height: 1.75;
	margin: 0 0 1em;
	max-width: 900px;
}
body.single-product .woocommerce-tabs .panel > *:last-child { margin-bottom: 0; }

/* --- related products --- */
body.single-product .related.products,
body.single-product .upsells.products {
	flex-basis: 100%;
	width: 100%;
	margin-top: 64px;
	padding-top: 40px;
	border-top: 1px solid #e9edf3;
}
body.single-product .related.products > h2,
body.single-product .upsells.products > h2 {
	font-size: 22px;
	font-weight: 700;
	color: var(--bgz-ink);
	margin: 0 0 24px;
}
body.single-product .related.products ul.products {
	grid-template-columns: repeat(3, 1fr) !important;
}

/* --- responsive --- */
@media (max-width: 900px) {
	body.single-product div.product { gap: 28px; }
	body.single-product div.product .woocommerce-product-gallery,
	body.single-product div.product .summary.entry-summary {
		flex-basis: 100%;
		max-width: 100%;
		width: 100% !important;
		position: static;
	}
	body.single-product .related.products ul.products {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}


/* =====================================================================
 * FAZ 12 — İLETİŞİM SAYFASI
 *   Form kaldırıldı; büyük, net iletişim bilgileri + harita.
 * ===================================================================== */

/* the section still has an (empty) 1/2 column — drop it, let the content
   column span full width */
body.page-id-107 .fw-main-row .fw-row > [class*="fw-col"] {
	width: 100% !important;
	flex: 0 0 100% !important;
	max-width: 100% !important;
}
body.page-id-107 .fw-main-row .fw-row > [class*="fw-col"]:not(:has(.bgz-contact)) {
	display: none !important;
}
/* trim the big empty gap: leading divider + builder top margin + row padding */
body.page-id-107 .builder-page-content { margin-top: 0 !important; }
body.page-id-107 .fw-main-row { padding-top: 30px !important; }
body.page-id-107 .fw-main-row .fw-divider-space { height: 0 !important; min-height: 0 !important; }

/* info panel + map, side by side, equal height */
.bgz-contact {
	max-width: 1180px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 0.92fr 1.08fr;
	align-items: stretch;
	gap: 28px;
}
.bgz-contact__grid {
	display: flex;
	flex-direction: column;
	gap: 30px;
	padding: 44px 46px;
	background: var(--bgz-surface);
	border-radius: 16px;
}
.bgz-contact__item h3 {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #97a4b2;
}
.bgz-contact__item p {
	margin: 0;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6;
	color: var(--bgz-ink);
}
.bgz-contact__item a { color: var(--bgz-ink); text-decoration: none; }
.bgz-contact__item a:hover { color: var(--bgz-blue); }

.bgz-contact__map {
	position: relative;
	border: 1px solid var(--bgz-line);
	border-radius: 16px;
	overflow: hidden;
	line-height: 0;
	min-height: 420px;
	box-shadow: 0 20px 44px rgba(18, 50, 90, 0.10);
}
.bgz-contact__map iframe {
	position: absolute;
	inset: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
	border: 0;
	filter: grayscale(0.25);
}
.bgz-contact__maplink {
	display: inline-block;
	margin-top: 14px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--bgz-blue);
	text-decoration: none;
}
.bgz-contact__maplink:hover { color: var(--bgz-blue-dark); }

@media (max-width: 900px) {
	.bgz-contact { grid-template-columns: 1fr; gap: 20px; }
	.bgz-contact__grid { padding: 34px 28px; gap: 26px; }
	.bgz-contact__map { min-height: 320px; }
	.bgz-contact__item p { font-size: 17px; }
}


/* =====================================================================
 * FAZ 13 — ÜRÜNLER KATALOG SAYFASI  ([bgz_category_catalog])
 *   4 ana grup → alt kategori kartları (görsel + ad + kısa açıklama).
 * ===================================================================== */

.bgz-catalog { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

.bgz-catalog__title {
	margin: 0 0 44px;
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 700;
	letter-spacing: -0.4px;
	color: var(--bgz-ink);
}

.bgz-catalog__group { margin: 0 0 64px; }
.bgz-catalog__group:last-child { margin-bottom: 0; }

.bgz-catalog__grouptitle {
	margin: 0 0 6px;
	font-size: clamp(20px, 2.2vw, 26px);
	font-weight: 700;
	letter-spacing: -0.3px;
	color: var(--bgz-ink);
}
.bgz-catalog__groupdesc {
	margin: 0 0 26px;
	max-width: 760px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--bgz-text);
}

.bgz-catalog__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
}
.bgz-catalog--cols-3 .bgz-catalog__grid { grid-template-columns: repeat(3, 1fr); }
.bgz-catalog--cols-2 .bgz-catalog__grid { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1100px) { .bgz-catalog__grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 760px)  { .bgz-catalog__grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 460px)  { .bgz-catalog__grid { grid-template-columns: 1fr !important; } }

.bgz-catalog__card {
	display: flex;
	flex-direction: column;
	background: var(--bgz-surface);
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none !important;
	transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.bgz-catalog__card:hover {
	transform: translateY(-4px);
	background: #e6edf4;
	box-shadow: 0 16px 36px rgba(18, 50, 90, 0.10);
}

.bgz-catalog__media {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.bgz-catalog__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 20px;
	mix-blend-mode: multiply;
}
.bgz-catalog__ph {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 44px;
	font-weight: 800;
	color: #c2ccd6;
	background:
		radial-gradient(circle at 50% 40%, #ffffff 0%, var(--bgz-surface) 70%);
}

.bgz-catalog__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 16px 18px 20px;
	flex: 1 1 auto;
}
.bgz-catalog__name {
	font-size: 15.5px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--bgz-ink);
}
.bgz-catalog__desc {
	font-size: 13px;
	line-height: 1.55;
	color: var(--bgz-muted, #6b7c8c);
}

/* the catalog lives on a text page — give it room, no side gutters fighting.
   Generalised to ANY page that renders the element (the "Ürünlerimiz" hub +
   the four group sub-pages), so header + content share one 1200 / 24px box
   and the page title lines up with the cards. */
body:has(.bgz-catalog) .bgz-catalog { margin-top: 8px; }
body:has(.bgz-catalog) #page-banner.header-style-title .page-title .container {
	max-width: 1200px !important;
}
body:has(.bgz-catalog) .standart-page-content.container {
	max-width: 1200px !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* single-group sub-page: title hidden, the group description reads as a lead
   paragraph under the H1 */
body:has(.standart-page-content .bgz-catalog) .bgz-catalog__group { margin-bottom: 0; }
body:has(.standart-page-content .bgz-catalog) .bgz-catalog__groupdesc {
	margin: 0 0 34px;
	font-size: 16px;
	max-width: 820px;
}


/* =====================================================================
 * FAZ 14 — MOBİL
 *   Mobil menü (mmenu) teması, mobil logo, sayaç kartları 2x2, arama kutusu.
 * ===================================================================== */

/* ---------- mobil üst bar + logo ---------- */
@media (max-width: 1200px) {
	#mobile-header {
		display: flex;
		align-items: center;
		gap: 10px;
		min-height: 60px;
		padding: 0 14px;
		background: #ffffff;
		border-bottom: 1px solid var(--bgz-line);
	}
	#mobile-header #mobile-menu-trigger { order: 1; flex: 0 0 auto; }
	#mobile-header .logo { order: 2; flex: 1 1 auto; text-align: center; line-height: 0; }
	#mobile-header #mobile-search { order: 3; flex: 0 0 auto; }

	#mobile-header .logo img {
		max-height: 34px !important;
		width: auto !important;
		max-width: 150px;
		display: inline-block;
	}
	#mobile-header .hamburger { padding: 8px; transform: scale(.9); }
	#mobile-header #mobile-search .search_button {
		background: none;
		border: 0;
		color: var(--bgz-ink);
		font-size: 18px;
		padding: 8px;
	}
	/* fixed header'ın altında içerik boşluğu (mobil) */
	body:not(.home) .builder-page-content,
	body:not(.home) .standart-page-content { }
}

/* ---------- mmenu off-canvas — marka teması ----------
   theme-dark eklentisi renkleri sabit #333 olarak basıyor; !important ile
   marka lacivertine çeviriyoruz. */
.mm-menu,
.mm-menu.mm-menu_theme-dark {
	--mm-color-background: #143A63;
	--mm-color-background-emphasis: rgba(255,255,255,.07);
	--mm-color-background-highlight: rgba(255,255,255,.05);
	--mm-color-text: #e9f1f9;
	--mm-color-text-dimmed: rgba(233,241,249,.55);
	--mm-color-border: rgba(255,255,255,.10);
	--mm-color-button: #7FB2E6;
	--mm-listitem-size: 50px;
}
.mm-menu.mm-menu_theme-dark,
.mm-menu.mm-menu_theme-dark .mm-panels,
.mm-menu.mm-menu_theme-dark .mm-panels > .mm-panel,
.mm-menu.mm-menu_theme-dark .mm-navbar {
	background-color: #143A63 !important;
	color: #e9f1f9 !important;
}
.mm-menu.mm-menu_theme-dark .mm-navbar {
	height: 58px;
	border-bottom: 1px solid rgba(255,255,255,.10);
}
.mm-menu.mm-menu_theme-dark .mm-navbar__title,
.mm-menu.mm-menu_theme-dark .mm-navbar a {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffffff !important;
}
/* bu mmenu derlemesi linkleri SINIFSIZ <a> olarak basıyor (.mm-listitem__text
   yok) — koyu zemin üstünde okunur renk için doğrudan <a>'yı hedefle */
.mm-menu.mm-menu_theme-dark .mm-panels a,
.mm-menu.mm-menu_theme-dark .mm-listview a,
.mm-menu.mm-menu_theme-dark .mm-listitem > a,
.mm-menu.mm-menu_theme-dark .mm-listitem > span,
.mm-menu.mm-menu_theme-dark .mm-listitem__text,
.mm-menu.mm-menu_theme-dark .mm-listitem__btn {
	color: #eaf1f8 !important;
}
.mm-menu.mm-menu_theme-dark .mm-listview a,
.mm-menu.mm-menu_theme-dark .mm-listitem > a:not(.mm-btn),
.mm-menu.mm-menu_theme-dark .mm-listitem__text {
	padding: 14px 50px 14px 20px !important;   /* sağda >'a yer bırak */
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.35 !important;
}
/* dokunma parlaması + parçalı satır görünümü ("taşıyor") — temizle */
.mm-menu a,
.mm-menu .mm-listitem,
.mm-menu .mm-btn { -webkit-tap-highlight-color: transparent !important; }
.mm-menu.mm-menu_theme-dark .mm-listitem,
.mm-menu.mm-menu_theme-dark .mm-listview > li,
.mm-menu.mm-menu_theme-dark .mm-listitem > a,
.mm-menu.mm-menu_theme-dark .mm-listitem__text { background: transparent !important; }
/* > oku: solundaki DİKEY AYIRICI ÇİZGİYİ kaldır (satırlar "taşıyor" gibi
   görünüyordu). Çizgi .mm-btn_next::before (1px genişlik + border-left). */
.mm-menu .mm-btn_next::before,
.mm-menu .mm-listitem__btn::before {
	display: none !important;
	border: 0 !important;
	content: none !important;
}
.mm-menu.mm-menu_theme-dark .mm-btn_next,
.mm-menu.mm-menu_theme-dark .mm-listitem__btn {
	border-left: 0 !important;
	background: transparent !important;
}
.mm-menu.mm-menu_theme-dark .mm-btn_next::after {
	border-color: rgba(233,241,249,.7) !important;
}
/* vurgu/aktif durum TÜM satırı (ok dahil) kapsasın — <li>'ye ver */
.mm-menu.mm-menu_theme-dark .mm-listitem:hover,
.mm-menu.mm-menu_theme-dark .mm-listitem:active {
	background: rgba(255,255,255,.06) !important;
}
.mm-menu.mm-menu_theme-dark .mm-listitem:after {
	left: 20px !important;
	right: 0 !important;
	border-color: rgba(255,255,255,.09) !important;
}
/* mobil menüde mega-menü promo görseli olmasın — sadece metin */
.mm-menu .grib-menu-image,
#mobile-menu .grib-menu-image { display: none !important; }
.mm-menu.mm-menu_theme-dark .mm-listitem_selected > a,
.mm-menu.mm-menu_theme-dark .mm-listitem_selected > .mm-listitem__text,
.mm-menu.mm-menu_theme-dark .mm-listitem.current-menu-item > a,
.mm-menu.mm-menu_theme-dark .mm-listitem.current-menu-item > .mm-listitem__text {
	background: rgba(127,178,230,.16) !important;
	box-shadow: inset 3px 0 0 #7FB2E6;
	color: #ffffff !important;
}
.mm-menu.mm-menu_theme-dark .mm-btn:before,
.mm-menu.mm-menu_theme-dark .mm-btn:after {
	border-color: rgba(233,241,249,.65) !important;
}
.mm-menu.mm-menu_theme-dark .mm-listitem__btn {
	border-color: rgba(255,255,255,.10) !important;
}
.mm-wrapper__blocker,
.mm-wrapper__blocker.mm-slideout { background: rgba(9,26,48,.55) !important; }

/* ---------- sayaç kartları: mobilde 2x2, daha küçük ---------- */
@media (max-width: 767px) {
	.row:has(> [class*="col-"] > .counter_box_one) > [class*="col-"] {
		flex: 0 0 50% !important;
		max-width: 50% !important;
	}
	.counter_box_one {
		padding: 22px 10px !important;
	}
	.counter_box_one i {
		font-size: 24px !important;
		margin-bottom: 8px !important;
	}
	.counter_box_one .counter,
	.counter_box_one .counter + * .counter {
		font-size: 30px !important;
	}
	.counter_box_one h5 {
		font-size: 12px !important;
		letter-spacing: .3px;
		margin-top: 4px !important;
	}
}
@media (max-width: 400px) {
	.counter_box_one .counter { font-size: 26px !important; }
}

/* ---------- arama kutusu — tam ekran, sade ---------- */
body .search-popup {
	position: fixed !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	z-index: 99999 !important;
	background: rgba(11,29,50,.97) !important;
	opacity: 0;
	visibility: hidden;
	transform: none !important;
	transition: opacity .28s ease, visibility .28s ease !important;
	display: block !important;
}
body.search-opened .search-popup { opacity: 1 !important; visibility: visible !important; }

body .search-popup > .container {
	max-width: 680px !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding: 16vh 24px 0 !important;
}
body .search-popup .search-popup__inner { max-width: none; }
body .search-popup .input-holder {
	display: flex !important;
	align-items: center;
	gap: 10px;
	border: 0;
	border-bottom: 2px solid rgba(255,255,255,.32);
	background: none;
}
body .search-popup .input-holder input,
body .search-popup #search-input {
	flex: 1 1 auto;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #ffffff !important;
	font-size: clamp(20px, 5vw, 28px) !important;
	font-weight: 400;
	padding: 16px 2px !important;
	outline: none !important;
	height: auto !important;
}
body .search-popup .input-holder input::placeholder { color: rgba(255,255,255,.45) !important; }
body .search-popup .input-holder button,
body .search-popup .input-holder .btn {
	background: none !important;
	border: 0 !important;
	color: #ffffff !important;
	font-size: 20px !important;
	padding: 6px 8px !important;
	cursor: pointer;
	box-shadow: none !important;
}
body .search-popup .input-holder button:hover { color: var(--bgz-blue-tint, #7FB2E6) !important; }

body .search-popup .search-popup__close {
	position: fixed !important;
	top: 22px;
	right: 26px;
	width: 40px;
	height: 40px;
	display: block !important;
	font-size: 0 !important;
	opacity: .7;
	transition: opacity .15s ease, transform .2s ease;
	background: none !important;
	border: 0 !important;
}
body .search-popup .search-popup__close i,
body .search-popup .search-popup__close .fa { display: none !important; }
body .search-popup .search-popup__close::before,
body .search-popup .search-popup__close::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 26px;
	height: 1.5px;
	background: #ffffff;
	border-radius: 2px;
}
body .search-popup .search-popup__close::before { transform: translate(-50%, -50%) rotate(45deg); }
body .search-popup .search-popup__close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
body .search-popup .search-popup__close:hover { opacity: 1; transform: rotate(90deg); }

/* canlı sonuç listesi */
body .search-popup .search-popup__list-wrapper { margin-top: 10px; }
body .search-popup .search-popup__list {
	background: #ffffff;
	border-radius: 8px;
	overflow: hidden;
	max-height: 52vh;
	overflow-y: auto;
}
body .search-popup .search-popup__list.active { margin-top: 12px; }
body .search-popup #search-list ul { margin: 0; padding: 0; list-style: none; }
body .search-popup #search-list li a {
	display: block;
	padding: 12px 16px;
	color: var(--bgz-ink);
	border-bottom: 1px solid var(--bgz-line);
	text-decoration: none;
}
body .search-popup #search-list li a:hover { background: var(--bgz-surface); color: var(--bgz-blue); }


/* =====================================================================
 * FAZ 15 — ARAMA
 *   (a) canlı arama açılır listesi — kompakt, tek çerçeve, ayrık buton
 *   (b) WordPress arama sonuçları sayfası (search.php) — sade, büyük liste
 * ===================================================================== */

/* ---------- (a) canlı arama açılır listesi ---------- */
body .search-popup .search-popup__list-wrapper { margin-top: 14px; }
body .search-popup .search-popup__list {
	padding: 6px 0 !important;
	top: 0 !important;
	height: auto !important;
	max-height: 58vh;
	overflow-y: auto;
	background: #ffffff;
	border-radius: 10px;
	box-shadow: 0 24px 60px rgba(0,0,0,.28);
	text-align: left !important;
}
body .search-popup .search-popup__list > div { height: auto !important; }
body .search-popup #search-list ul,
body .search-popup .search-popup__list .ui-autocomplete {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	max-height: none !important;
}
body .search-popup #search-list li,
body .search-popup .search-popup__list li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: inherit !important;
	list-style: none !important;
}
body .search-popup #search-list li a {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 11px 20px !important;
	font-size: 14.5px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	color: var(--bgz-ink) !important;
	text-decoration: none !important;
	border: 0 !important;
	border-bottom: 1px solid var(--bgz-line) !important;
	background: none !important;
	white-space: normal;
}
body .search-popup #search-list li:last-child a { border-bottom: 0 !important; }
body .search-popup #search-list li a:hover,
body .search-popup #search-list li a:focus {
	background: var(--bgz-surface) !important;
	color: var(--bgz-blue) !important;
}
/* tema, satırlara sağ ok / chevron ekliyor — kaldır (kompaktlık) */
body .search-popup #search-list li a::before,
body .search-popup #search-list li a::after,
body .search-popup #search-list li::before,
body .search-popup #search-list li::after,
body .search-popup #search-list li a i,
body .search-popup #search-list li a .fa { display: none !important; content: none !important; }

/* içerik yukarıdan doğal aksın — tema `height:100%` ile butonu ekranın en
   altına itiyordu. Not: .input-holder position:absolute (form'un tepesinde),
   o yüzden form'a padding-top bırakıp sonuçları inputun altından başlat. */
body .search-popup .search-popup__list-wrapper,
body .search-popup .search-popup__list,
body .search-popup .search-popup__list > div,
body .search-popup .search-popup__inner,
body .search-popup .search-popup__inner form { height: auto !important; }
body .search-popup__inner form { padding-top: 108px !important; padding-bottom: 24px !important; }
body .search-popup .input-holder { height: auto !important; padding-bottom: 0 !important; }

/* "Tümünü Listele" — listenin hemen sağ altında, buton değil bağlantı.
   NOT: `display` important DEĞİL — görünürlüğü tema JS'i yönetiyor
   (yalnızca sonuç sayısı > 5 iken .show(); aksi halde gizli). */
body .search-popup #show-allsearch-btn,
body .search-popup .search-popup__inner #show-allsearch-btn {
	display: block;
	float: none !important;
	position: static !important;
	width: auto !important;
	margin: 12px 2px 0 !important;
	padding: 2px 0 !important;
	background: none !important;
	color: rgba(255,255,255,.82) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .2px;
	text-transform: none !important;
	text-align: right !important;
	text-decoration: none !important;
	box-shadow: none !important;
}
body .search-popup #show-allsearch-btn span,
body .search-popup #show-allsearch-btn i {
	color: inherit !important;
	transition: color .12s ease;
}
body .search-popup #show-allsearch-btn i { display: inline-block !important; margin-left: 6px; font-size: 11px; }
body .search-popup #show-allsearch-btn:hover,
body .search-popup #show-allsearch-btn:hover span,
body .search-popup #show-allsearch-btn:hover i { color: var(--bgz-blue-tint, #7FB2E6) !important; }

/* ---------- (b) arama sonuçları sayfası (search.php) ---------- */
body.search #page-body.bgz-search {
	background: #ffffff;
	max-width: 900px !important;
	padding-top: 8px;
	padding-bottom: 80px;
}
.bgz-search__count {
	margin: 4px 0 26px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--bgz-line);
	font-size: 15px;
	color: var(--bgz-muted);
}
.bgz-search__count strong { color: var(--bgz-ink); font-weight: 700; }

.bgz-search__list { margin: 0; padding: 0; list-style: none; }
.bgz-search__item { border-bottom: 1px solid var(--bgz-line); }
.bgz-search__link {
	display: block;
	padding: 22px 0;
	text-decoration: none !important;
}
.bgz-search__badge {
	display: inline-block;
	margin-bottom: 8px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--bgz-blue);
}
.bgz-search__title {
	margin: 0 0 5px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--bgz-ink);
	transition: color .12s ease;
}
.bgz-search__link:hover .bgz-search__title { color: var(--bgz-blue); }
.bgz-search__url {
	display: block;
	margin-bottom: 8px;
	font-size: 12.5px;
	color: #9aa7b4;
	word-break: break-all;
}
.bgz-search__excerpt {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--bgz-text);
}

.bgz-search .pagination,
.bgz-search .navigation.pagination { margin-top: 36px; }
.bgz-search .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 8px;
	margin: 0 3px;
	border: 1px solid var(--bgz-line);
	color: var(--bgz-text);
	font-size: 14px;
	text-decoration: none;
}
.bgz-search .page-numbers.current { background: var(--bgz-blue); border-color: var(--bgz-blue); color: #fff; }
.bgz-search .page-numbers:hover:not(.current) { border-color: var(--bgz-blue); color: var(--bgz-blue); }

.bgz-search__empty { padding: 30px 0 10px; }
.bgz-search__empty p { font-size: 17px; color: var(--bgz-text); margin: 0 0 18px; }
.bgz-search__form { display: flex; max-width: 420px; border: 1px solid var(--bgz-line); }
.bgz-search__form input {
	flex: 1 1 auto;
	border: 0 !important;
	padding: 12px 14px !important;
	font-size: 15px !important;
	outline: none !important;
	background: #fff !important;
}
.bgz-search__form button {
	flex: 0 0 auto;
	border: 0;
	background: var(--bgz-blue);
	color: #fff;
	padding: 0 18px;
	cursor: pointer;
}
.bgz-search__form button:hover { background: var(--bgz-blue-dark); }

@media (max-width: 600px) {
	.bgz-search__title { font-size: 18px; }
	.bgz-search__link { padding: 18px 0; }
}


/* =====================================================================
 * FAZ 16 — GRAFİK DİL
 *   SVG ikon seti, güven rozetleri, ölçü diyagramı, tel-örgü (mesh) doku.
 *   Yardımcı: bogazici-edition/includes/icons.php  (bgz_icon / [bgz_badges])
 * ===================================================================== */

/* ---------- ikonlar ---------- */
.bgz-icon {
	width: 1.15em;
	height: 1.15em;
	display: inline-block;
	vertical-align: -0.18em;
	flex: 0 0 auto;
}

/* ürün "sabit güven alanı" — FontAwesome yerine SVG */
.bgz-product-features li .bgz-icon {
	width: 18px;
	height: 18px;
	margin-top: 1px;
	color: var(--bgz-blue);
}

/* ---------- güven rozetleri şeridi ([bgz_badges]) ---------- */
.bgz-badges {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 14px 22px;
}
.bgz-badges li {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--bgz-surface);
	border: 1px solid var(--bgz-line);
	border-radius: 10px;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--bgz-ink);
}
.bgz-badges li .bgz-icon {
	width: 22px;
	height: 22px;
	color: var(--bgz-blue);
}
/* koyu zemin üstünde */
.bgz-mesh-panel .bgz-badges li,
[data-dark] .bgz-badges li {
	background: rgba(255,255,255,.06);
	border-color: rgba(255,255,255,.14);
	color: #eaf1f8;
}
[data-dark] .bgz-badges li .bgz-icon { color: var(--bgz-blue-tint, #7FB2E6); }

/* ---------- ölçü diyagramı (Ölçü Tablosu sekmesi) ---------- */
.bgz-size-diagram {
	margin: 0 0 22px;
	padding: 18px 20px 12px;
	background: var(--bgz-surface);
	border: 1px solid var(--bgz-line);
	border-radius: 10px;
	max-width: 460px;
}
.bgz-size-diagram svg { display: block; width: 100%; height: auto; }
.bgz-size-diagram figcaption {
	margin-top: 8px;
	font-size: 12px;
	color: var(--bgz-muted);
}

/* ---------- tel-örgü (mesh) doku ---------- */
:root {
	--bgz-mesh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M-6 6 6 -6M0 24 24 0M18 30 30 18' stroke='%23ffffff' stroke-width='1' fill='none'/%3E%3Cpath d='M6 -6-6 6M24 0 0 24M30 18 18 30' stroke='%23ffffff' stroke-width='1' fill='none' opacity='.5'/%3E%3C/svg%3E");
}

/* koyu bölümlerin üzerine ince mesh — sayaç ("46 yıl") bölümü */
section:has(> .container .counter_on_dark),
section:has(> .container .counter_box_one) {
	position: relative;
	isolation: isolate;
}
section:has(> .container .counter_on_dark)::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--bgz-mesh);
	background-size: 26px 26px;
	opacity: .06;
	z-index: -1;
	pointer-events: none;
}

/* yeniden kullanılabilir yardımcı sınıf */
.bgz-mesh-panel {
	position: relative;
	isolation: isolate;
	background: linear-gradient(180deg, #1E5AA0 0%, #17406E 100%);
	color: #eaf1f8;
}
.bgz-mesh-panel::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--bgz-mesh);
	background-size: 24px 24px;
	opacity: .07;
	z-index: -1;
	pointer-events: none;
}

/* ürün teklif alanının üstünde çok ince ayraç dokusu */
.bgz-product-cta { position: relative; }


/* =====================================================================
 * FAZ 17 — SABİT WHATSAPP BUTONU
 *   Sağ altta, "yukarı çık" butonunun üzerinde. bogazici-edition/includes/
 *   whatsapp-float.php  (Tema Ayarları → Ürün Sayfası → Teklif Alanı).
 * ===================================================================== */
.bgz-wa-float {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 9990;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	padding: 0;
	background: #25D366;
	color: #ffffff !important;
	border-radius: 26px;
	box-shadow: 0 10px 26px rgba(37, 211, 102, 0.42);
	text-decoration: none !important;
	overflow: hidden;
	transition: width 0.28s ease, padding 0.28s ease, box-shadow 0.2s ease, background 0.15s ease;
}
.bgz-wa-float:hover { background: #1EB855; color: #fff !important; }
.bgz-wa-float__icon { width: 24px; height: 24px; flex: 0 0 auto; color: #ffffff; }
.bgz-wa-float__label {
	max-width: 0;
	opacity: 0;
	overflow: hidden;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.2px;
	transition: max-width 0.28s ease, opacity 0.2s ease, margin 0.28s ease;
}
@media (hover: hover) and (min-width: 901px) {
	.bgz-wa-float:hover {
		width: 214px;
		padding: 0 18px;
		justify-content: flex-start;
	}
	.bgz-wa-float:hover .bgz-wa-float__label {
		max-width: 160px;
		opacity: 1;
		margin-left: 10px;
	}
}
@media (max-width: 900px) {
	.bgz-wa-float { left: 16px; bottom: 16px; width: 48px; height: 48px; }
	.bgz-wa-float__icon { width: 22px; height: 22px; }
}
/* yazdırmada gizle */
@media print { .bgz-wa-float { display: none; } }


/* =====================================================================
 * FAZ 18 — 404 SAYFASI  (template: 404.php)
 * ===================================================================== */
body.error404 #page-body.bgz-404 {
	background: #ffffff;
	min-height: 62vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 130px 22px 90px;
}
.bgz-404__inner {
	width: 100%;
	max-width: 620px;
	text-align: center;
}
.bgz-404__code {
	font-size: clamp(88px, 17vw, 172px);
	font-weight: 800;
	line-height: 0.85;
	letter-spacing: -2px;
	color: var(--bgz-surface);
	margin: 0 0 6px;
	user-select: none;
}
.bgz-404__title {
	margin: 0 0 12px;
	font-size: clamp(21px, 3vw, 27px);
	font-weight: 700;
	letter-spacing: -0.3px;
	color: var(--bgz-ink);
}
.bgz-404__text {
	margin: 0 auto 28px;
	max-width: 460px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--bgz-text);
}
.bgz-404__search {
	display: flex;
	max-width: 400px;
	margin: 0 auto 26px;
	border: 1px solid var(--bgz-line);
}
.bgz-404__search input {
	flex: 1 1 auto;
	min-width: 0;
	border: 0 !important;
	background: #fff !important;
	padding: 13px 16px !important;
	font-size: 15px !important;
	outline: none !important;
	box-shadow: none !important;
}
.bgz-404__search button {
	flex: 0 0 auto;
	border: 0;
	background: var(--bgz-blue);
	color: #fff;
	padding: 0 20px;
	font-size: 15px;
	cursor: pointer;
	transition: background 0.15s ease;
}
.bgz-404__search button:hover { background: var(--bgz-blue-dark); }
.bgz-404__links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}
.bgz-404__links a {
	display: inline-block;
	padding: 9px 18px;
	border: 1px solid var(--bgz-line);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	color: var(--bgz-text) !important;
	text-decoration: none !important;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.bgz-404__links a:hover {
	border-color: var(--bgz-blue);
	color: var(--bgz-blue) !important;
	background: var(--bgz-surface);
}


/* =====================================================================
 * FAZ 19 — FOOTER "ÜRÜNLER" KATEGORİ LİSTESİ + sağ sütun düzeni
 * ===================================================================== */
.bgz-footer-cats {
	list-style: none;
	margin: 0;
	padding: 0;
}
.bgz-footer-cats li { margin: 0 0 10px; line-height: 1.4; }
.bgz-footer-cats a {
	color: rgba(255, 255, 255, 0.80);
	font-size: 14px;
	text-decoration: none;
	transition: color 0.15s ease, padding-left 0.15s ease;
}
.bgz-footer-cats a:hover { color: #ffffff; padding-left: 4px; }
.bgz-footer-cats li:last-child { margin: 14px 0 0; }
.bgz-footer-cats li:last-child a { font-weight: 700; color: var(--bgz-blue-tint, #7FB2E6); }
.bgz-footer-cats li:last-child a:hover { color: #ffffff; }
#footerTop .widget_custom_html .textwidget,
#footerTop .widget_custom_html .custom-html-widget { margin: 0; }

/* aynı sütunda birden fazla widget (İletişim + sosyal) arası boşluk */
#footerTop .widget + .widget { margin-top: 24px; }
/* boş widget başlığı (başlığı temizlenen sosyal widget) yer kaplamasın */
#footerTop .widget-title:empty { display: none; }


/* =====================================================================
 * FAZ 20 — TİPOGRAFİ / OKUNABİLİRLİK
 *   Tema gövde metnini Montserrat 300 (Light) ile basıyor → cılız duruyor.
 *   Paragraf / açıklama metinlerini 400'e çek, rengi biraz koyulaştır,
 *   uzun satırları sınırla. Büyük başlıklara (display) dokunma.
 * ===================================================================== */
.fw-page-builder-content p,
.fw-page-builder-content li,
.fw-page-builder-content td,
.fw-page-builder-content .fw-text p,
.standart-page-content p,
.standart-page-content li,
.bgz-catalog__groupdesc,
.term-description,
.woocommerce-product-details__short-description,
.woocommerce-product-details__short-description p,
body.single-product .woocommerce-tabs .panel p,
.bgz-contact__item p,
.bgz-search__excerpt {
	font-weight: 400 !important;
	color: #37475a !important;
}
.fw-page-builder-content p,
.fw-page-builder-content li {
	font-size: 16px !important;
	line-height: 1.75 !important;
}
/* okunur satır uzunluğu — tam genişlik sütunlarda paragraf ~760px */
.fw-page-builder-content .fw-col-xs-12 > p,
.fw-page-builder-content .fw-col-xs-12 > ul,
.fw-page-builder-content .fw-text,
.standart-page-content > p {
	max-width: 760px;
}
.page-left-sidebar .fw-page-builder-content .fw-text,
.page-right-sidebar .fw-page-builder-content .fw-text { max-width: none; }

/* içerik başlıkları (h2/h3) biraz daha belirgin ayrılsın */
.fw-page-builder-content h2,
.fw-page-builder-content h3,
.standart-page-content h2,
.standart-page-content h3 {
	color: var(--bgz-ink) !important;
	font-weight: 700 !important;
	margin-top: 1.6em;
}
.fw-page-builder-content h2:first-child,
.fw-page-builder-content h3:first-child { margin-top: 0; }

/* kategori sayfası: giriş paragrafı ile kart alt-metni ayrışsın */
.bgz-catalog__groupdesc {
	font-size: 16px !important;
	line-height: 1.7 !important;
	color: #37475a !important;
}
.bgz-catalog__desc {
	font-weight: 400 !important;
	color: #6b7c8c !important;   /* ikincil — kasıtlı daha soluk, ama net */
	font-size: 13px !important;
	line-height: 1.55 !important;
}

/* genel gövde rengi biraz koyulaşsın (#777 çok açıktı) */
body { color: #4a5a6a; }


/* =====================================================================
 * FAZ 21 — GALERİ (kurumsal sertifikalar) + kategori arşiv görseli
 * ===================================================================== */

/* WP [gallery] — çerçeveli, tutarlı ızgara (kurumsal sertifika bölümü) */
.fw-page-builder-content .gallery,
.standart-page-content .gallery {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
	gap: 14px !important;
	margin: 16px 0 0 !important;
	width: auto !important;
}
.fw-page-builder-content .gallery br,
.standart-page-content .gallery br { display: none !important; }
.fw-page-builder-content .gallery-item,
.standart-page-content .gallery-item {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}
.fw-page-builder-content .gallery-icon,
.standart-page-content .gallery-icon { margin: 0 !important; }
.fw-page-builder-content .gallery-icon a,
.standart-page-content .gallery-icon a {
	display: block;
	border: 1px solid var(--bgz-line);
	background: #ffffff;
	padding: 10px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.fw-page-builder-content .gallery-icon a:hover,
.standart-page-content .gallery-icon a:hover {
	border-color: var(--bgz-blue);
	box-shadow: 0 12px 28px rgba(18, 50, 90, 0.12);
}
.fw-page-builder-content .gallery-icon img,
.standart-page-content .gallery-icon img {
	width: 100% !important;
	height: 175px;
	object-fit: contain;
	display: block;
	border: 0 !important;
	max-width: none !important;
}
.fw-page-builder-content .gallery-caption,
.standart-page-content .gallery-caption {
	margin: 0 !important;
	padding-top: 6px;
	font-size: 12px;
	color: var(--bgz-muted);
	text-align: center;
}
@media (max-width: 600px) {
	.fw-page-builder-content .gallery,
	.standart-page-content .gallery { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important; }
	.fw-page-builder-content .gallery-icon img,
	.standart-page-content .gallery-icon img { height: 130px; }
}

/* kategori arşivi — görsel şerit (thumbnail atanınca görünür) */
.bgz-cat-hero {
	max-width: 1200px;
	margin: 4px auto 20px;
	border: 1px solid var(--bgz-line);
	border-radius: 10px;
	overflow: hidden;
	background: var(--bgz-surface);
}
.bgz-cat-hero__img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
}
@media (max-width: 700px) { .bgz-cat-hero__img { height: 150px; } }