/**
* Theme Name: Neotech Child
* Description: This is a child theme of Neotech, generated by Merlin SITE.
* Author: <a href="http://themelexus.com/">Themelexus</a>
* Template: neotech
* Version: 1.0.10
*/

/* Product/partner logo cards (homepage + products page) */
.service-image:has(.brand-logo-thumb) {
	background-color: #f4f6fb;
}
.service-image:has(.brand-logo-thumb):before {
	display: none;
}
.brand-logo-thumb {
	object-fit: contain !important;
	padding: 16% 14%;
	box-sizing: border-box;
}
li:has(.brand-logo-thumb) .service-loop-title a {
	color: #162339 !important;
}
li:has(.brand-logo-thumb) .service-loop-excerpt {
	color: #5C6672 !important;
}

/* CloudMon's published logo was white text on a transparent background
   (meant for a dark navbar), invisible on this site's light cards, so it
   needed a dark chip behind it. The logo file itself now has the
   wordmark recolored to the site's navy (#162339), matching every other
   brand logo, so it no longer needs special-case styling here. */

/* Homepage product carousel only: drop the small icon badge and the
   hover-reveal description, since the logo already identifies the
   product and the description lives on the Products/Services pages. */
[data-id="a0909d7"] li:has(.brand-logo-thumb) .service-image-icon {
	visibility: hidden !important;
}
[data-id="a0909d7"] li:has(.brand-logo-thumb) .service-content-box,
[data-id="a0909d7"] li:has(.brand-logo-thumb) .service-block:hover .service-content-box {
	visibility: hidden !important;
	opacity: 0 !important;
}

/* Homepage carousel + Products page grid: drop the product name text
   under the logo entirely -- the logo itself is already its own link
   (wrapped in <a> in the figure above), so it stays clickable without
   the name repeating it. */
[data-id="a0909d7"] li:has(.brand-logo-thumb) .service-loop-title,
[data-id="d1a4d66"] li:has(.brand-logo-thumb) .service-loop-title {
	display: none !important;
}

/* Products page grid only: on hover the card gets a solid blue gradient
   background (theme default), and the theme does turn the description
   white to match -- but our own fixed dark gray color above (set for
   the normal, non-hover state) carries !important, so it was winning
   over the theme's hover rule and leaving the text unreadable on the
   blue background. Restore white specifically for the hover state. */
li.service-style-2:has(.brand-logo-thumb) .service-block:hover .service-loop-excerpt {
	color: #FFFFFF !important;
}

/* "Tum Hizmetler" sidebar: same idea -- keep only the logo (already the
   clickable link) and drop the product name text next to it. The row's
   height used to come entirely from the name text's 2.875rem line-height;
   with the text hidden each row collapsed to the logo's own 1.375rem height,
   cramming the list together. Restore the original row rhythm with an
   explicit min-height on the link. */
.widget_service_list .service-list-name {
	display: none !important;
}
body.single-service #page .site-content .widget_service_list ul li a {
	min-height: 2.875rem;
}

/* "Tum Hizmetler" sidebar on product/service pages: show each product's
   own logo next to its name instead of the generic lynx image above the
   page content. */
body.single-service #page .site-content .single-content .post-thumbnail {
	display: none !important;
}
body.single-service #page .site-content .widget_service_list ul li a {
	justify-content: flex-start;
	gap: 0.75rem;
}
.widget_service_list .service-list-logo {
	height: 2.125rem;
	width: 5.25rem;
	object-fit: contain;
	object-position: left center;
	flex-shrink: 0;
}

/* Products page grid: real brand logos instead of the generic gradient
   icon; drop the small circular backdrop since logos vary in shape.
   Each source logo has different internal whitespace, so fixing only
   the <img> height still left visually taller/shorter marks and threw
   the titles below out of alignment. Giving the wrapper itself a fixed
   height and centering the logo inside it keeps every title starting
   at the same line regardless of the logo's own proportions. */
.service-image-icon:has(.service-icon-logo) {
	display: flex;
	align-items: center;
	height: 2.5rem;
}
.service-icon-logo {
	height: auto;
	max-height: 1.75rem;
	width: auto;
	max-width: 7.5rem;
	object-fit: contain;
}
.service-image-icon:has(.service-icon-logo):after {
	display: none;
}

/* Homepage hero slider (SR7): the slider's own JS throws an error while
   sizing itself on some page loads ("Cannot read properties of null,
   reading 'offsetWidth'"), which can leave it with a wrong, oversized
   inline height and make the hero photo bleed into the sections below
   it. This caps the module's visible height as a safety net regardless
   of whatever height value the slider script computed, so a bad
   calculation can no longer show through into later content. 65.625rem is
   comfortably above the slider's own largest intended breakpoint
   height (59.375rem on desktop/laptop). */
sr7-module#SR7_1_1 {
	max-height: 65.625rem !important;
	overflow: hidden !important;
}

/* Homepage 5-card feature row ("Full Stack Gozlemlenebilirlik",
   "AIOPS", "Veri Dayanikliligi", "Yonetilen Hizmetlerimiz",
   "Yazilim Tasima"): each card swaps in a full-bleed background photo
   on hover, but only the icon's color was switched to white on hover
   -- the title/description text stayed dark navy/gray, unreadable
   against the photo. A plain background-color did nothing here since
   CSS paints background-image ON TOP of background-color, so an
   opaque JPG fully hides any color set behind it -- the fix has to be
   a semi-transparent gradient stacked as an extra background-image
   LAYER above the photo (same property, first layer listed = on top),
   which does actually blend, plus white title/description text with
   a shadow for extra separation from busy photo content. */
.elementor-17 .elementor-element.elementor-element-26dd774:hover {
	background-image: linear-gradient(rgba(16, 21, 43, 0.78), rgba(16, 21, 43, 0.78)), url("/assets/media/2024/10/h1-banner1.jpg?v=2") !important;
}
.elementor-17 .elementor-element.elementor-element-291a3de:hover {
	background-image: linear-gradient(rgba(16, 21, 43, 0.78), rgba(16, 21, 43, 0.78)), url("/assets/media/2024/10/h1-banner2.jpg?v=2") !important;
}
.elementor-17 .elementor-element.elementor-element-9c61176:hover {
	background-image: linear-gradient(rgba(16, 21, 43, 0.78), rgba(16, 21, 43, 0.78)), url("/assets/media/2024/10/h1-banner3.jpg?v=2") !important;
}
.elementor-17 .elementor-element.elementor-element-6c58bc6:hover {
	background-image: linear-gradient(rgba(16, 21, 43, 0.78), rgba(16, 21, 43, 0.78)), url("/assets/media/2024/10/h1-banner4.jpg?v=2") !important;
}
.elementor-17 .elementor-element.elementor-element-b14da33:hover {
	background-image: linear-gradient(rgba(16, 21, 43, 0.78), rgba(16, 21, 43, 0.78)), url("/assets/media/2024/10/h1-banner5.jpg?v=2") !important;
}
.elementor-17 .elementor-element.elementor-element-26dd774:hover .elementor-icon-box-title,
.elementor-17 .elementor-element.elementor-element-291a3de:hover .elementor-icon-box-title,
.elementor-17 .elementor-element.elementor-element-9c61176:hover .elementor-icon-box-title,
.elementor-17 .elementor-element.elementor-element-6c58bc6:hover .elementor-icon-box-title,
.elementor-17 .elementor-element.elementor-element-b14da33:hover .elementor-icon-box-title,
.elementor-17 .elementor-element.elementor-element-26dd774:hover .elementor-icon-box-title a,
.elementor-17 .elementor-element.elementor-element-291a3de:hover .elementor-icon-box-title a,
.elementor-17 .elementor-element.elementor-element-9c61176:hover .elementor-icon-box-title a,
.elementor-17 .elementor-element.elementor-element-6c58bc6:hover .elementor-icon-box-title a,
.elementor-17 .elementor-element.elementor-element-b14da33:hover .elementor-icon-box-title a {
	color: #FFFFFF !important;
	text-shadow: 0 0.0625rem 0.25rem rgba(0, 0, 0, 0.85) !important;
}
.elementor-17 .elementor-element.elementor-element-26dd774:hover .elementor-icon-box-description,
.elementor-17 .elementor-element.elementor-element-291a3de:hover .elementor-icon-box-description,
.elementor-17 .elementor-element.elementor-element-9c61176:hover .elementor-icon-box-description,
.elementor-17 .elementor-element.elementor-element-6c58bc6:hover .elementor-icon-box-description,
.elementor-17 .elementor-element.elementor-element-b14da33:hover .elementor-icon-box-description {
	color: #F0F2F7 !important;
	text-shadow: 0 0.0625rem 0.25rem rgba(0, 0, 0, 0.85) !important;
}

/* Footer bottom bar: legal links (Gizlilik/Cerez Politikasi, Privacy/
   Cookie Policy) added next to the copyright line. */
.footer-legal-links {
	display: inline-block;
	margin-left: 0.625rem;
}
.footer-legal-links a {
	text-decoration: underline;
	text-underline-offset: 0.125rem;
}

/* KVKK consent checkbox on the contact and appointment forms. */
.wc-kvkk-consent {
	margin: 0.25rem 0 0.875rem 0 !important;
}
.wc-kvkk-consent label {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	cursor: pointer;
}
.wc-kvkk-consent input[type="checkbox"] {
	margin-top: 0.1875rem;
	flex-shrink: 0;
	width: 1rem;
	height: 1rem;
	cursor: pointer;
}
.wc-kvkk-consent a {
	text-decoration: underline;
}

/* Cookie consent banner (consent.js): Accept / Reject for Google Consent
   Mode v2. Both buttons are the same size so rejecting is as easy as
   accepting; the choice is kept in the wc_consent cookie. */
#wc-cookie-notice {
	position: fixed;
	left: 1.25rem;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 9999;
	max-width: 45rem;
	margin: 0 auto;
	background: #162339;
	color: #F0F2F7;
	border-radius: 0.875rem;
	padding: 1.125rem 1.375rem;
	box-shadow: 0 0.625rem 1.875rem rgba(0, 0, 0, 0.25);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.875rem 1.25rem;
	font-size: 0.875rem;
	line-height: 1.375rem;
}
#wc-cookie-notice p {
	margin: 0;
	flex: 1 1 20rem;
}
#wc-cookie-notice a {
	color: #8AB4FF;
	text-decoration: underline;
}
#wc-cookie-notice .wc-cookie-notice-actions {
	display: flex;
	flex-shrink: 0;
	gap: 0.625rem;
}
#wc-cookie-notice button {
	border: none;
	border-radius: 0.5rem;
	padding: 0.625rem 1.125rem;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	background: var(--e-global-color-primary, #2457F5);
	color: #FFFFFF;
}
#wc-cookie-notice button.wc-consent-reject {
	background: transparent;
	color: #F0F2F7;
	box-shadow: inset 0 0 0 1px rgba(240, 242, 247, 0.55);
}
#wc-cookie-notice button.wc-consent-reject:hover {
	background: rgba(240, 242, 247, 0.1);
}
#wc-cookie-notice button:focus-visible {
	outline: 2px solid #8AB4FF;
	outline-offset: 2px;
}
@media (max-width: 37.5rem) {
	#wc-cookie-notice {
		left: 0.75rem;
		right: 0.75rem;
		bottom: 0.75rem;
		padding: 1rem;
	}
	#wc-cookie-notice .wc-cookie-notice-actions {
		width: 100%;
	}
	#wc-cookie-notice button {
		flex: 1 1 0;
	}
}

/* Footer "call us" block: phone + email as real tel:/mailto: links with
   a matching icon, instead of two bare lines of unstyled text (the
   theme's gradient-text effect on the phone number was also meant for
   light backgrounds and read as a faint, disconnected gray here). */
.elementor-element-007bbbe,
.elementor-element-007bbbe p,
.elementor-element-b99c8da p {
	background: none !important;
	-webkit-text-fill-color: initial !important;
	margin: 0 !important;
}
.elementor-element-007bbbe {
	margin-top: 0.875rem !important;
	margin-bottom: 0.625rem !important;
}
.footer-contact-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5625rem;
	color: #FFFFFF !important;
	-webkit-text-fill-color: #FFFFFF !important;
	text-decoration: none;
	transition: color 0.2s ease;
}
.footer-contact-link:hover {
	color: #7CA6FF !important;
	-webkit-text-fill-color: #7CA6FF !important;
}
.footer-contact-link--muted {
	font-weight: 400;
	font-size: 0.9375rem;
	color: #C3CADA !important;
	-webkit-text-fill-color: #C3CADA !important;
}
.footer-contact-link--muted:hover {
	color: #7CA6FF !important;
	-webkit-text-fill-color: #7CA6FF !important;
}
.footer-contact-icon {
	width: 1rem;
	height: 1rem;
	flex-shrink: 0;
	stroke: #7CA6FF;
}

/* Mobile menu panel: "account" and "cart" icons are leftovers from the
   original theme's WooCommerce demo (no shop/cart/account exists on this
   site, and their links pointed at the theme vendor's demo site). Hiding
   them instead of touching the shared header markup on every page. */
.elementor-element-d1b4840,
.elementor-element-1761ba7 {
	display: none !important;
}

/* Footer: drop the busy office-photo background behind the main footer
   columns (Urunler/Cozumler/Iletisim text was getting lost against it).
   The solid dark navy base color underneath is already the same color
   used by the bottom copyright bar, so removing the photo gives one
   clean, consistent dark footer instead of a photo-over-text section
   sitting on top of a plain-color section. */
.elementor-57 .elementor-element.elementor-element-ea285d8::before {
	background-image: none !important;
}
/* Homepage partner logo strip: drop the decorative world-map background
   behind the logos, it competes with the logos and the heading. */
.elementor-17 .elementor-element.elementor-element-e419b31:not(.elementor-motion-effects-element-type-background) {
	background-image: none !important;
}

/* Partner logo strip: arrows sit in their own gutters on the left and
   right of the logos instead of overlapping them. */
.elementor-brand-wrapper {
	position: relative;
	padding: 0 3.5rem;
}
.elementor-brand-wrapper .elementor-swiper-button {
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 2.5rem !important;
	height: 2.5rem !important;
	padding: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	border-radius: 50%;
	border: none;
	background: #3559BA;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 0.375rem 1rem rgba(53, 89, 186, 0.25);
}
.elementor-brand-wrapper .elementor-swiper-button-prev-7215e9d { left: 0 !important; right: auto !important; }
.elementor-brand-wrapper .elementor-swiper-button-next-7215e9d { right: 0 !important; left: auto !important; }
.elementor-brand-wrapper .elementor-swiper-button i { display: none; }
.elementor-brand-wrapper .elementor-swiper-button-prev-7215e9d {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 1.25rem 1.25rem;
}
.elementor-brand-wrapper .elementor-swiper-button-next-7215e9d {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 1.25rem 1.25rem;
}
.elementor-brand-wrapper .elementor-swiper-button:hover { background: #2a47a0; }

/* Homepage "technology index" block: the group photo was tiling (repeated
   side by side and stacked) because its background had no size set. Fill
   the box with one copy of the photo instead. */
.elementor-17 .elementor-element.elementor-element-d0dc2db:not(.elementor-motion-effects-element-type-background) {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
/* Faded world map behind the same section -- removed, like the one under the logo strip. */
.elementor-17 .elementor-element.elementor-element-9a1fcbb:not(.elementor-motion-effects-element-type-background) {
	background-image: none !important;
}

/* Page header: the small "Home / Page" path above each title is redundant
   with the title itself, so it is hidden on every page. */
.catalog-breadcrumb {
	display: none !important;
}

/* Footer brand block: left-align the logo so it lines up with the
   tagline text beneath it (it was centered inside its wider box). */
.elementor-57 .elementor-element.elementor-element-73f2aa6 .hfe-site-logo-container,
.elementor-57 .elementor-element.elementor-element-73f2aa6 .hfe-caption-width figcaption {
	text-align: left !important;
}

/* Footer polish (shared footer template, post 57). */
/* 2. Social icons: round, subtle chip, brand blue on hover. */
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon {
	width: 2.375rem;
	height: 2.375rem;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.08) !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.2s ease;
}
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon:hover {
	background-color: #3559BA !important;
}
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon i,
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon svg {
	color: #FFFFFF;
	fill: #FFFFFF;
}
/* Hover: the chip turns brand blue, so the glyph must stay white (Elementor's hover rule would paint it blue too). */
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon:hover i,
.elementor-57 .elementor-element.elementor-element-25a2daa .elementor-social-icon:hover svg {
	color: #FFFFFF !important;
	fill: #FFFFFF !important;
}
/* 3. Head-office address: drop the underline, separate it from the rest. */
.elementor-57 .elementor-element.elementor-element-d0219bb p:first-child {
	padding-bottom: 0.875rem;
	margin-bottom: 0.875rem;
	border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.12);
}
.elementor-57 .elementor-element.elementor-element-d0219bb span[style*="underline"] {
	text-decoration: none !important;
	font-weight: 600;
}
/* 4. Copyright bar: softer link color instead of bright blue. */
.elementor-57 .elementor-element.elementor-element-e9537b5 a,
.elementor-57 .elementor-element.elementor-element-e9537b5 .footer-legal-links a {
	color: #B8C2D6 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}
.elementor-57 .elementor-element.elementor-element-e9537b5 a:hover,
.elementor-57 .elementor-element.elementor-element-e9537b5 .footer-legal-links a:hover {
	color: #FFFFFF !important;
	text-decoration: underline;
}

/* Footer logo PNG has a 1rem transparent left margin; pull it back so the visible mark lines up with the text below. */
.elementor-57 .elementor-element.elementor-element-73f2aa6 img {
	margin-left: -1rem !important;
}

/* Desktop header dropdowns: clean panel with sentence-case items instead of the bare uppercase list. */
.primary-navigation ul.menu ul.sub-menu {
	min-width: 17.5rem;
	top: 100% !important;
	margin: 0;
	padding: 0.625rem 0;
	background: #fff;
	border: 0.0625rem solid #e6ebf3;
	border-top: 0.1875rem solid var(--e-global-color-primary, #2563eb);
	border-radius: 0 0 0.75rem 0.75rem;
	box-shadow: 0 1.125rem 2.5rem rgba(15, 23, 42, 0.14);
}
.primary-navigation ul.menu ul.sub-menu > li.menu-item > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0;
	padding: 0.6875rem 1.375rem;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: none;
	color: #1b2540;
	position: relative;
	transition: background-color .2s ease, color .2s ease, padding-left .2s ease;
}
.primary-navigation ul.menu ul.sub-menu > li.menu-item > a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 0.1875rem;
	height: 0;
	background: var(--e-global-color-primary, #2563eb);
	border-radius: 0 0.1875rem 0.1875rem 0;
	transform: translateY(-50%);
	transition: height .2s ease;
}
.primary-navigation ul.menu ul.sub-menu > li.menu-item > a:hover,
.primary-navigation ul.menu ul.sub-menu > li.menu-item:hover > a {
	background: #f3f6fd;
	color: var(--e-global-color-primary, #2563eb);
	padding-left: 1.625rem;
}
.primary-navigation ul.menu ul.sub-menu > li.menu-item > a:hover::before,
.primary-navigation ul.menu ul.sub-menu > li.menu-item:hover > a::before {
	height: 60%;
}
.primary-navigation ul.menu ul.sub-menu > li.menu-item + li.menu-item > a {
	border-top: 0.0625rem solid #f0f3f8;
}
/* Small pointer on the panel's top edge, aimed at the parent item, so the dropdown reads as part of that item. */
.primary-navigation ul.menu > li > ul.sub-menu {
	left: 0;
}
.primary-navigation ul.menu > li > ul.sub-menu::before {
	content: "";
	position: absolute;
	top: -0.5625rem;
	left: 0.875rem;
	width: 0;
	height: 0;
	border-left: 0.5625rem solid transparent;
	border-right: 0.5625rem solid transparent;
	border-bottom: 0.5625rem solid var(--e-global-color-primary, #2563eb);
	display: block;
}
/* Invisible bridge between a parent row and its side panel, so the pointer can cross to it without the panel closing. */
.primary-navigation ul.menu ul.sub-menu > li.menu-item-has-children::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: -1rem;
	width: 1rem;
}
/* Nested panel (e.g. Yönetilen Hizmetlerimiz) opens to the side with the same look. */
.primary-navigation ul.menu ul.sub-menu ul.sub-menu {
	top: -0.625rem !important;
	left: 100%;
	margin-left: 0.625rem;
	min-width: 18.75rem;
	border-top-width: 0.0625rem;
	border-radius: 0.75rem;
	box-shadow: 0 1.125rem 2.5rem rgba(15, 23, 42, 0.14);
}

/* Ekibimiz sayfasi: kart izgarasi, baş harfli avatarlar ve LinkedIn baglantilari. */
.team-page {
	max-width: 75rem;
	margin: 0 auto;
	padding: 4.5rem 1.25rem 5.5rem;
	color: #1b2540;
}
.team-intro {
	text-align: center;
	max-width: 42.5rem;
	margin: 0 auto 3.5rem;
}
.team-kicker {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.15rem;
	color: var(--e-global-color-primary, #2563eb);
	text-transform: uppercase;
}
.team-title {
	margin: 0 0 0.875rem;
	font-size: 2.5rem;
	line-height: 1.15;
	font-weight: 700;
	color: #0f172a;
}
.team-lead {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.65;
	color: #5b6478;
}
.team-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
	gap: 1.5rem;
}
.team-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 2rem 1.375rem 1.625rem;
	background: #fff;
	border: 0.0625rem solid #e6ebf3;
	border-radius: 1rem;
	box-shadow: 0 0.0625rem 0.125rem rgba(15, 23, 42, 0.04), 0 0.5rem 1.5rem rgba(15, 23, 42, 0.05);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.team-card:hover {
	transform: translateY(-0.25rem);
	border-color: hsl(var(--h, 220) 70% 80%);
	box-shadow: 0 0.125rem 0.25rem rgba(15, 23, 42, 0.06), 0 1.125rem 2.25rem rgba(15, 23, 42, 0.10);
}
.team-avatar {
	width: 5.25rem;
	height: 5.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.125rem;
	border-radius: 50%;
	font-size: 1.625rem;
	font-weight: 700;
	letter-spacing: 0.0625rem;
	color: #fff;
	background: linear-gradient(135deg, hsl(var(--h, 220) 85% 58%), hsl(calc(var(--h, 220) + 30) 80% 42%));
	box-shadow: 0 0.375rem 1rem hsla(var(--h, 220), 80%, 45%, .30);
}
.team-name {
	margin: 0 0 0.375rem;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
	color: #0f172a;
}
.team-role {
	margin: 0 0 0.75rem;
	min-height: 2.6em;
	font-size: 0.875rem;
	line-height: 1.45;
	color: #5b6478;
}
.team-bio {
	margin: 0 0 1.25rem;
	font-size: 0.875rem;
	line-height: 1.55;
	color: #3a4256;
}
.team-linkedin {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5625rem 1rem;
	border-radius: 62.4375rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: #0a66c2;
	background: #eef5fc;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}
.team-linkedin svg {
	width: 1rem;
	height: 1rem;
	fill: currentColor;
}
.team-linkedin:hover,
.team-linkedin:focus-visible {
	color: #fff;
	background: #0a66c2;
}
@media (max-width: 35.9375rem) {
	.team-title { font-size: 1.875rem; }
	.team-page { padding: 3rem 1rem 4rem; }
}

/* Header logo: a little larger on desktop. Targets only the two header variants (not the footer logo);
   phones keep the original size so the menu button stays on the same row. */
@media (min-width: 48rem) {
	.hfe-site-logo-img[src*="/2024/10/white-logo-icon-lg.png"],
	.hfe-site-logo-img[src*="/2025/07/logo-icon-lg.png"] {
		width: 16rem !important;
		height: auto !important;
		max-width: none !important;
	}
	.elementor-49 .elementor-element.elementor-element-1e10069,
	.elementor-712 .elementor-element.elementor-element-2a91646 {
		--width: 20% !important;
	}
}

/* Inner-page header: keep the logo level with the menu row instead of sitting below it. */
@media (min-width: 48rem) {
	.elementor-712 .elementor-element.elementor-element-2a91646 {
		align-self: flex-start;
		margin-top: 1.5rem;
	}
}

/* Desktop menu: tighter spacing between top-level items so the row stays on one line next to the larger logo. */
@media (min-width: 48rem) {
	.main-navigation ul.menu > li.menu-item > a {
		margin: 0 0.25rem !important;
	}
}

/* Narrower desktops: scale the enlarged header logo down a bit so it does not run into the menu. */
@media (min-width: 48rem) and (max-width: 90rem) {
	.hfe-site-logo-img[src*="/2024/10/white-logo-icon-lg.png"],
	.hfe-site-logo-img[src*="/2025/07/logo-icon-lg.png"] {
		width: 14.5rem !important;
	}
}

/* Around 1280px wide, the header logo needs one step smaller still to clear the first menu item. */
@media (min-width: 48rem) and (max-width: 81rem) {
	.hfe-site-logo-img[src*="/2024/10/white-logo-icon-lg.png"],
	.hfe-site-logo-img[src*="/2025/07/logo-icon-lg.png"] {
		width: 13rem !important;
	}
}

/* Phones and small tablets: fixed logo width (rem) so it does not grow with the viewport. */
@media (max-width: 47.9375rem) {
	.hfe-site-logo-img[src*="/2024/10/white-logo-icon-lg.png"],
	.hfe-site-logo-img[src*="/2025/07/logo-icon-lg.png"] {
		width: 12rem !important;
		height: auto !important;
		max-width: none !important;
	}
}

/* Language switcher in the top bar. There used to be two separate,
   contradictory style blocks here (an older "white card" closed-state
   look that set opaque white backgrounds on every inner element, plus
   a newer translucent-pill look that tried to override it back to
   transparent) fighting each other via !important/specificity. That's
   what produced the "two nested grey boxes" look some visitors saw:
   the outer pill from one rule and an inner box from the other,
   depending on exactly which rule won in their browser.
   Replaced with one single, unconditional, un-contradicted set of
   rules: closed = one light translucent pill (slightly darker on
   hover), open = one solid dark card. There is nothing left to fight
   over -- every state has exactly one surface. */
.trp-ls-dropdown.trp-floating-switcher {
	top: 0.3125rem !important;
	left: auto !important;
	right: 7.5rem !important;
	width: auto !important;
	padding: 0.375rem 0.625rem !important;
	background: rgba(255, 255, 255, 0.14) !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: 0.5rem !important;
}
.trp-ls-dropdown.trp-floating-switcher:not(.is-open):hover {
	background: rgba(255, 255, 255, 0.22) !important;
}
@media (min-width: 48rem) {
	.trp-ls-dropdown.trp-floating-switcher {
		right: 9.75rem !important;
	}
}
@media (max-width: 47.9375rem) {
	.trp-ls-dropdown.trp-floating-switcher {
		top: 0rem !important;
		right: 0.75rem !important;
	}
}
.trp-ls-dropdown.trp-floating-switcher,
.trp-ls-dropdown.trp-floating-switcher .trp-language-switcher-inner,
.trp-ls-dropdown.trp-floating-switcher .trp-language-item__current {
	color: inherit !important;
}
.trp-ls-dropdown.trp-floating-switcher .trp-language-item-name {
	color: inherit !important;
	font-size: 0.875rem;
	font-weight: 500;
}
/* Every inner wrapper stays fully transparent at all times -- the
   pill never has a background of its own, so there is only ever the
   one surface (the open dropdown card below) to look at. */
.trp-ls-dropdown.trp-floating-switcher .trp-language-switcher-inner,
.trp-ls-dropdown.trp-floating-switcher .trp-language-item {
	background: transparent !important;
}
/* Force every row to the exact same width as the card around it.
   Without this, each row only sizes to its own content (the "Türkçe"
   row and the "English" row are different text lengths), so their
   backgrounds end up different widths and the lower row's rounded
   corner pokes out past the row above it. */
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-switcher-inner,
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-switcher-dropdown-list,
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-item {
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Open state: the one and only solid surface, a dark navy card. The
   plugin's own CSS reads --bg/--bg-hover custom properties for its
   row hover colour, and the page sets those inline for the CLOSED,
   light pill (#ffffff33). Without overriding them here too, hovering
   a row while open showed that light colour poking through as a
   mismatched patch. Redefining them on the open nav makes every rule
   that reads var(--bg-hover) resolve to the same dark tone, so there
   is nothing left that can show a different-coloured box. */
.trp-ls-dropdown.trp-floating-switcher.is-open {
	--bg: transparent;
	--bg-hover: rgba(255, 255, 255, 0.08);
	width: 10.5rem !important;
	padding: 0.375rem !important;
	background: rgba(22, 35, 57, 0.96) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 0.75rem !important;
	box-shadow: 0 0.75rem 1.5rem rgba(15, 23, 42, 0.28) !important;
	backdrop-filter: blur(0.5rem);
}
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-item {
	color: #f0f2f7 !important;
	padding: 0.5rem 0.625rem !important;
	border-radius: 0.5rem !important;
}
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-item:hover {
	background: rgba(255, 255, 255, 0.08) !important;
}
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-item-name {
	color: #f0f2f7 !important;
	font-weight: 500;
}
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-language-item__current::after {
	color: #f0f2f7;
}
/* static-site.css has an older rule that pops the dropdown list out
   as its own separate, absolutely-positioned card (own background,
   border, shadow, offset below the pill) -- that is the second,
   independent box some visitors saw stacked under the first one.
   Cancel all of it so the list stays in normal flow as a plain
   continuation of the single open card above, with just a divider. */
.trp-ls-dropdown.trp-floating-switcher.is-open .trp-switcher-dropdown-list {
	position: static !important;
	inset: auto !important;
	top: auto !important;
	right: auto !important;
	min-width: 0 !important;
	margin: 0.25rem 0 0 0 !important;
	padding: 0.25rem 0 0 0 !important;
	background: transparent !important;
	border: 0 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Duyurular (Announcements) archive page: same card language as the team page.
   The page body sits inside an Elementor flex container (column
   direction); flex items default to min-width:auto, so without an
   explicit min-width:0 here, long titles push this block wider than
   the viewport instead of wrapping, and the overflow gets clipped on
   narrow phones. */
.announce-page {
	max-width: 50rem;
	margin: 0 auto;
	padding: 4.5rem 1.25rem 5.5rem;
	color: #1b2540;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.announce-intro {
	text-align: center;
	margin: 0 0 2.5rem;
}
.announce-title {
	margin: 0 0 0.75rem;
	font-size: 2.5rem;
	line-height: 1.15;
	font-weight: 700;
	color: #0f172a;
}
.announce-lead {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: #5b6478;
}
/* Vertical timeline: a connecting line down the left edge, each entry
   marked with a small target-style dot instead of a card. */
.announce-timeline {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.announce-timeline::before {
	content: '';
	position: absolute;
	left: 0.46875rem;
	top: 0.75rem;
	bottom: 1.75rem;
	width: 0.0625rem;
	background: #e2e8f5;
}
.announce-entry {
	position: relative;
	padding: 0 0 2.25rem 2.25rem;
}
.announce-entry:last-child {
	padding-bottom: 0;
}
.announce-dot {
	position: absolute;
	left: 0;
	top: 0.3rem;
	width: 0.9375rem;
	height: 0.9375rem;
	border-radius: 50%;
	border: 0.1875rem solid var(--e-global-color-primary, #2563eb);
	background: #fff;
	box-sizing: border-box;
}
.announce-dot::after {
	content: '';
	position: absolute;
	inset: 0.1875rem;
	border-radius: 50%;
	background: var(--e-global-color-primary, #2563eb);
}
.announce-date {
	display: block;
	margin: 0 0 0.375rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--e-global-color-primary, #2563eb);
}
.announce-entry-title {
	margin: 0 0 0.5rem;
	font-size: 1.1875rem;
	line-height: 1.3;
	font-weight: 700;
	color: #0f172a;
}
.announce-entry-text {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: #3a4256;
}
.announce-entry-text + .announce-cert-feature {
	margin-top: 1.25rem;
}

/* A richer timeline entry: who earned the certification, and the
   certificates themselves, inside one tinted card so it reads as a
   single unit distinct from the plain text entries around it. */
.announce-cert-feature {
	background: #f6f8fc;
	border: 1px solid #e6ebf3;
	border-radius: 1rem;
	padding: 1.25rem;
}
.announce-cert-person {
	display: flex;
	align-items: center;
	gap: 0.875rem;
	margin-bottom: 1.25rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid #e6ebf3;
}
.announce-cert-avatar {
	flex: none;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0 0.375rem 1rem rgba(15, 23, 42, .18);
}
.announce-cert-person-info {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
	margin-right: auto;
}
.announce-cert-person-info strong {
	font-size: 0.9375rem;
	color: #0f172a;
}
.announce-cert-person-info span {
	font-size: 0.8125rem;
	color: #5b6478;
}
.announce-cert-linkedin {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.4375rem 0.875rem;
	border-radius: 62.4375rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: #0a66c2;
	background: #eef5fc;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}
.announce-cert-linkedin svg {
	width: 0.875rem;
	height: 0.875rem;
	fill: currentColor;
}
.announce-cert-linkedin:hover,
.announce-cert-linkedin:focus-visible {
	color: #fff;
	background: #0a66c2;
}
.announce-cert-badges {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
.announce-cert-badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.5rem;
	padding: 1.25rem 1rem;
	background: #fff;
	border: 1px solid #e6ebf3;
	border-radius: 0.875rem;
}
.announce-cert-badge img {
	width: 5rem;
	height: 5rem;
	object-fit: contain;
}
.announce-cert-badge-name {
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.3;
	color: #0f172a;
}
.announce-cert-badge-date {
	font-size: 0.75rem;
	color: #5b6478;
}
/* Elastic partnership entry: the two logos side by side on a white
   panel topped with Elastic's brand colours, then the three areas the
   partnership covers and a link to the Elastic service page. */
.announce-entry-text + .announce-partner-feature {
	margin-top: 1.25rem;
}
.announce-partner-feature {
	background: #f6f8fc;
	border: 1px solid #e6ebf3;
	border-radius: 1rem;
	padding: 1.25rem;
}
.announce-partner-lockup {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 1rem 1.5rem;
	padding: 1.75rem 1.25rem 1.5rem;
	background: #fff;
	border: 1px solid #e6ebf3;
	border-radius: 0.875rem;
	overflow: hidden;
}
.announce-partner-lockup::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 0.25rem;
	background: linear-gradient(90deg, #fed10a 0%, #f04e98 35%, #00bfb3 68%, #1ba9f5 100%);
}
.announce-partner-logo {
	display: block;
	width: auto;
	max-width: 100%;
}
.announce-partner-logo.is-wildcats {
	height: 2.75rem;
}
.announce-partner-logo.is-elastic {
	height: 2.25rem;
}
.announce-partner-x {
	font-size: 1.5rem;
	line-height: 1;
	font-weight: 300;
	color: #9aa3b5;
}
.announce-partner-badge {
	flex-basis: 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.375rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #019b8f;
}
.announce-partner-badge svg {
	width: 1rem;
	height: 1rem;
	fill: #00bfb3;
}
.announce-partner-areas {
	list-style: none;
	margin: 1rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
}
.announce-partner-areas li {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin: 0;
	padding: 1rem;
	background: #fff;
	border: 1px solid #e6ebf3;
	border-radius: 0.75rem;
}
.announce-partner-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	margin-bottom: 0.375rem;
	border-radius: 0.625rem;
}
.announce-partner-icon svg {
	width: 1.125rem;
	height: 1.125rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.announce-partner-areas .is-search .announce-partner-icon { color: #0b7fc4; background: rgba(27, 169, 245, 0.12); }
.announce-partner-areas .is-obs .announce-partner-icon { color: #c4337a; background: rgba(240, 78, 152, 0.12); }
.announce-partner-areas .is-sec .announce-partner-icon { color: #019b8f; background: rgba(0, 191, 179, 0.14); }
.announce-partner-areas strong {
	font-size: 0.875rem;
	line-height: 1.3;
	color: #0f172a;
}
.announce-partner-areas li > span:last-child {
	font-size: 0.8125rem;
	line-height: 1.4;
	color: #5b6478;
}
.announce-partner-link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	margin-top: 1rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--e-global-color-primary, #2457F5);
	text-decoration: none;
}
.announce-partner-link svg {
	width: 1rem;
	height: 1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: transform .2s ease;
}
.announce-partner-link:hover svg,
.announce-partner-link:focus-visible svg {
	transform: translateX(0.25rem);
}
@media (max-width: 35.9375rem) {
	.announce-partner-areas { grid-template-columns: 1fr; }
	.announce-partner-lockup { gap: 0.75rem 1rem; padding: 1.5rem 1rem 1.25rem; }
	.announce-partner-logo.is-wildcats { height: 2.25rem; }
	.announce-partner-logo.is-elastic { height: 1.875rem; }
}
@media (max-width: 35.9375rem) {
	.announce-cert-badges { grid-template-columns: 1fr; }
	.announce-cert-person { flex-wrap: wrap; }
	.announce-cert-linkedin { margin-left: calc(3rem + 0.875rem); }
}
@media (max-width: 35.9375rem) {
	.announce-title { font-size: 1.875rem; }
	.announce-page { padding: 3rem 1rem 4rem; }
	.announce-entry { padding-left: 1.875rem; }
}

/* Site-wide (every page except Duyurular/Announcements itself): a small
   tab fixed to the right edge of the screen, vertically centered. It
   takes no layout space and sits in a different spot than the two other
   fixed widgets this theme already has (.scrollup at bottom-right, the
   cookie notice across the bottom), so it can't cover header text or
   collide with them on any page, regardless of that page's own height
   or the homepage hero's own layout math. static-site.js cross-fades
   between items every few seconds once there is more than one. */
.announce-chip {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: 9500;
	width: 13.5rem;
	padding: 0.75rem 1rem 0.75rem 0.875rem;
	border-radius: 0.75rem 0 0 0.75rem;
	background: linear-gradient(135deg, #7c3aed, #2563eb);
	box-shadow: -0.125rem 0.125rem 0.75rem rgba(15, 23, 42, 0.25);
	transition: padding-right 0.2s ease;
}
.announce-chip > a {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	width: 100%;
	min-width: 0;
	text-decoration: none;
}
.announce-chip-icon {
	flex-shrink: 0;
	font-size: 1rem;
	line-height: 1.3;
}
.announce-chip-items {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 2.2rem;
}
.announce-chip-item {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	color: #fff;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	white-space: normal;
	transition: opacity 0.4s ease;
}
.announce-chip-item.is-active {
	position: relative;
	opacity: 1;
	visibility: visible;
}
.announce-chip:hover {
	padding-right: 1.25rem;
}
@media (max-width: 47.9375rem) {
	.announce-chip {
		width: 10.5rem;
		padding: 0.625rem 0.75rem 0.625rem 0.75rem;
	}
	.announce-chip-item { font-size: 0.75rem; }
}

/* Header top-bar social icons: meant to be hidden on small screens (it
   duplicates the footer's icons and the switcher sits in the same spot),
   but the theme's own hidden-tablet/hidden-mobile_extra combo only
   covers 48rem-55rem, leaving real phone widths (e.g. 390px) visible and
   overlapping the language switcher. Hide it for the whole phone range. */
@media (max-width: 47.9375rem) {
	.elementor-element-3cb4555 {
		display: none !important;
	}
}

/* Homepage hero slider (SR7): its prev/next arrows and pagination dots
   are positioned by the plugin's own JS (inline styles, computed per
   slide), and on phones they land on top of the slide's own text/CTA
   button instead of below it. The plugin fails to initialize in this
   project's headless-Chrome tooling too, so its internal layout math
   can't be inspected or safely repositioned here. Hiding the controls
   on phones removes the overlap outright; swipe still changes slides. */
@media (max-width: 47.9375rem) {
	.sr7-arrows,
	.sr7-arrow,
	.sr7-bullets,
	.sr7-bullet,
	.tp-leftarrow,
	.tp-rightarrow,
	.tp-bullets {
		display: none !important;
	}
}

/* "WILDCATS'E GÜVENEN 500'DEN FAZLA ŞİRKETE KATILIN" heading above the
   brand logos: make it bigger and match the WildCats logo's blue
   instead of the default dark navy. */
.elementor-17 .elementor-element.elementor-element-3229d8a .elementor-heading-title {
	font-size: 1.375rem !important;
	color: var(--e-global-color-primary, #3559BA) !important;
}

/* The heading above grew taller when we enlarged its text, but the
   pill's fixed negative top-margin (tuned for the old, smaller text)
   no longer centers it on the divider line beneath -- the line now
   sits ~4px above the pill's middle. Nudge the margin to re-center. */
.elementor-17 .elementor-element.elementor-element-3229d8a {
	margin-top: -2.44rem !important;
}

/* Real client logos replacing the brand-carousel placeholders: each
   source file has a different native aspect ratio AND a different
   amount of built-in white padding around the actual mark (some are
   tightly cropped, some have lots of margin baked into the file).
   Force every <img> to the exact same box and let object-fit scale
   each logo's real content to fill it as much as its own aspect
   ratio allows -- this is what makes a padded logo (e.g. one from a
   square download with lots of surrounding whitespace) grow to the
   same visual weight as a tightly-cropped one, instead of just
   rendering at whatever size the file happens to be. */
.elementor-element-7215e9d .elementor-brand-image img {
	width: 9.375rem !important;
	height: 3.75rem !important;
	object-fit: contain !important;
}

/* Center every logo in its slot regardless of its own height, and
   keep each one in its real brand colors -- the theme's default
   brand-carousel style fades logos to 60% opacity and grayscales
   every other one whenever the carousel is hovered, which made real
   company logos look washed out/colorless. */
.elementor-element-7215e9d .elementor-brand-image {
	align-items: center !important;
	justify-content: center !important;
}
.elementor-element-7215e9d .elementor-brand-link {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100%;
	padding: 0.125rem;
}
.elementor-element-7215e9d .elementor-brand-image img,
.elementor-element-7215e9d .elementor-brand-image svg,
.elementor-element-7215e9d .elementor-brand-wrapper:hover img,
.elementor-element-7215e9d .elementor-brand-wrapper:hover svg {
	opacity: 1 !important;
	filter: none !important;
}

/* The dark page-title/breadcrumb banner at the top of every inner
   page (and its taller one-off variant on Hakkimizda/About Us) had so
   much top/bottom padding on desktop that real page content started
   below the fold, needing a scroll just to see anything. Shrink it on
   desktop only -- tablet/mobile already use much smaller padding and
   are left alone -- and bring About Us down to the same height as
   every other inner page instead of nearly double. */
@media (min-width: 64.0625rem) {
	.elementor-63 .elementor-element.elementor-element-5aeb283,
	.elementor-497 .elementor-element.elementor-element-dba7849,
	.elementor-513 .elementor-element.elementor-element-553be42,
	.elementor-519 .elementor-element.elementor-element-97762db {
		--padding-top: 5.5rem !important;
		--padding-bottom: 4rem !important;
	}
}

/* Referanslarımız / References page. Sections sit two levels deep
   inside Elementor's own container (.e-con-inner), not as direct
   children of .references-page, so each section carries its own
   explicit margin-top rather than relying on a ">" combinator from
   the page wrapper (which silently never matched anything). */
.references-page {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	color: #1b2540;
	padding: 4.5rem 1.25rem 5.5rem;
}
.references-page * {
	min-width: 0;
	overflow-wrap: break-word;
}

.ref-hero {
	max-width: 42rem;
	margin: 0 auto;
	text-align: center;
}
.ref-hero-title {
	margin: 0 0 1rem;
	font-size: 2.5rem;
	line-height: 1.15;
	font-weight: 700;
	color: #0f172a;
}
.ref-hero-lead {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: #5b6478;
}

.ref-stats {
	max-width: 46rem;
	margin: 3rem auto 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}
.ref-stat {
	text-align: center;
	padding: 1.5rem 1rem;
	background: #f6f8fc;
	border: 1px solid #e6ebf3;
	border-radius: 1rem;
}
.ref-stat-number {
	display: block;
	font-size: 2rem;
	line-height: 1.1;
	font-weight: 800;
	color: var(--e-global-color-primary, #3559ba);
}
.ref-stat-label {
	display: block;
	margin-top: 0.375rem;
	font-size: 0.875rem;
	color: #5b6478;
}

.ref-section {
	max-width: 70rem;
	margin: 5rem auto 0;
}
.ref-section-tint {
	max-width: 100%;
	margin: 5rem auto 0;
	background: #f6f8fc;
	padding: 4.5rem 1.25rem;
}
.ref-section-tint > * {
	max-width: 70rem;
	margin-left: auto;
	margin-right: auto;
}
.ref-section-title {
	margin: 0 0 2.5rem;
	font-size: 1.75rem;
	line-height: 1.25;
	font-weight: 700;
	color: #0f172a;
	text-align: center;
}

.ref-logo-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
	gap: 1rem;
}
.ref-logo-grid li {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 6rem;
	background: #fff;
	border: 1px solid #e6ebf3;
	border-radius: 0.875rem;
	padding: 1rem;
	box-shadow: 0 0.0625rem 0.125rem rgba(15, 23, 42, 0.03);
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.ref-logo-grid li:hover {
	box-shadow: 0 0.5rem 1.25rem rgba(15, 23, 42, 0.08);
	transform: translateY(-0.125rem);
}
.ref-logo-grid img {
	max-width: 100%;
	max-height: 2.75rem;
	width: auto;
	height: auto;
	object-fit: contain;
}

.ref-why-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
}
.ref-why-card {
	background: #fff;
	border: 1px solid #e6ebf3;
	border-radius: 1rem;
	padding: 1.75rem;
	box-shadow: 0 0.0625rem 0.125rem rgba(15, 23, 42, 0.03);
}
.ref-why-card h3 {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
	font-weight: 700;
	color: #0f172a;
}
.ref-why-card p {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: #3a4256;
}

@media (max-width: 47.9375rem) {
	.references-page { padding: 3rem 1rem 4rem; }
	.ref-hero-title { font-size: 1.875rem; }
	.ref-stats { grid-template-columns: 1fr; gap: 0.75rem; margin-top: 2.25rem; }
	.ref-section, .ref-section-tint { margin-top: 3.5rem; }
	.ref-why-grid { grid-template-columns: 1fr; }
	.ref-logo-grid { grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); }
	.ref-logo-grid li { height: 5rem; padding: 0.75rem; }
}

/* Main menu: adding "Referanslarımız" made the menu one item longer,
   and at common laptop/desktop widths the full row no longer fit
   next to the logo and the phone/Kariyer block on the right. The
   last item ("İletişim ve Randevu") wrapped onto its own line, and
   because the menu is centered, that lone wrapped item sat centered
   a few pixels below the row above -- cramped against it.
   The desktop menu only appears from 64rem (1024px) up (below that
   it's the hamburger menu instead), so the fix has to cover the
   whole 64rem-and-up range, not just the wider end of it. Below
   85.375rem (1366px) -- where the combined width of logo + 8 menu
   items + phone block + button is tightest -- the items need to run
   noticeably smaller/tighter to all fit on one line; from 1366px up
   there's enough room to relax back to a more comfortable size. */
@media (min-width: 64rem) and (max-width: 85.3125rem) {
	.elementor-element-705b70d .main-navigation ul.menu > li.menu-item > a {
		margin: 0.3rem 0.125rem !important;
		font-size: 0.8125rem !important;
	}
	/* The real constraint turned out not to be total header width but
	   each header column's own fixed percentage share of it: the nav's
	   column was only allotted 50% (logo 18%, phone/Kariyer column
	   32%), a split sized for the old 7-item menu. There was visibly
	   empty space to the right of the last item in screenshots -- that
	   space belonged to the phone/Kariyer column next door, not to the
	   nav, so no amount of shrinking the nav's own text could reach it.
	   Give the nav column more of the row and the phone/Kariyer column
	   less (phone number + button don't need 32% here). */
	.elementor-element-1e10069 {
		--width: 19% !important;
	}
	.elementor-element-1ac049e {
		--width: 60% !important;
		padding-left: 0.5rem !important;
	}
	.elementor-element-4314894 {
		--width: 21% !important;
	}
}
@media (min-width: 85.375rem) {
	.elementor-element-705b70d .main-navigation ul.menu > li.menu-item > a {
		margin: 0.3rem 0.25rem !important;
		font-size: 0.9375rem !important;
	}
}

/* Teşekkürler / Thank-you page (/tesekkurler/, /en/tesekkurler/): the
   post-submit landing page used as the Ads conversion URL. One centered
   card, no other forms or overlays. */
.thanks-page {
	width: 100%;
	box-sizing: border-box;
	padding: 4.5rem 1.25rem 5.5rem;
}
.thanks-card {
	max-width: 36rem;
	margin: 0 auto;
	padding: 3rem 2.5rem;
	text-align: center;
	background: #FFFFFF;
	border: 1px solid #E3E8F2;
	border-radius: 1.25rem;
	box-shadow: 0 1.25rem 3rem rgba(15, 23, 42, 0.08);
	box-sizing: border-box;
}
.thanks-icon {
	width: 4rem;
	height: 4rem;
	margin: 0 auto 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(36, 87, 245, 0.1);
	color: var(--e-global-color-primary, #2457F5);
}
.thanks-title {
	margin: 0 0 1rem;
	font-size: 2rem;
	line-height: 1.2;
	font-weight: 700;
	color: #0f172a;
}
.thanks-lead {
	margin: 0 0 1.25rem;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: #5b6478;
}
.thanks-urgent {
	margin: 0 0 2rem;
	font-size: 1rem;
	line-height: 1.6;
	color: #1b2540;
}
.thanks-urgent a {
	font-weight: 700;
	color: var(--e-global-color-primary, #2457F5);
	white-space: nowrap;
}
.thanks-home {
	display: inline-block;
	padding: 0.875rem 1.75rem;
	border-radius: 0.625rem;
	background: var(--e-global-color-primary, #2457F5);
	color: #FFFFFF !important;
	font-weight: 600;
	font-size: 0.9375rem;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.thanks-home:hover {
	background: #1a44c9;
}
@media (max-width: 47.9375rem) {
	.thanks-page { padding: 3rem 1rem 4rem; }
	.thanks-card { padding: 2.25rem 1.25rem; }
	.thanks-title { font-size: 1.625rem; }
}
