/*
 * Hanatech site styles.
 * Loaded after the theme bundle; everything site-specific lives here.
 */

/* Home hero (replaces the Revolution Slider) */
.hero {
	min-height: 70vh;
	display: flex;
	align-items: center;
	background-size: cover;
	background-position: center;
	padding: 200px 0 100px;
	text-align: center;
}
.hero .hero-kicker {
	font-size: 18px;
	letter-spacing: 3px;
	font-weight: 300;
	color: #0c0c0c;
	margin: 0 0 12px;
}
.hero h1 {
	font-size: 50px;
	line-height: 1.1;
	font-weight: 700;
	color: #0c0c0c;
	margin: 0;
}
@media (max-width: 991px) {
	.hero h1 { font-size: 38px; }
}
@media (max-width: 767px) {
	.hero { min-height: 60vh; padding: 140px 0 70px; }
	.hero .hero-kicker { font-size: 15px; letter-spacing: 1px; }
	.hero h1 { font-size: 30px; }
}

/* Responsive map embed */
.map-embed {
	position: relative;
	width: 100%;
	padding-top: 50%;
	overflow: hidden;
	background: #eee;
}
.map-embed iframe {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
@media (max-width: 767px) {
	.map-embed { padding-top: 80%; }
}

/* Contact form */
.contact-form .hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* LinkedIn follow line */
.linkedin-follow img {
	vertical-align: middle;
	margin-left: 12px;
	width: 32px;
	height: auto;
}

/* Footer */
#Footer {
	background: #3e4044;
	color: #cfd1d4;
	padding: 70px 0 0;
	margin-top: 40px;
}
#Footer p,
#Footer li,
#Footer a { color: #cfd1d4; }
#Footer a:hover { color: #e6a94a; }
#Footer .big {
	color: #fff;
	font-weight: 600;
	margin-bottom: 12px;
}
#Footer ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#Footer ul li { margin-bottom: 6px; }
#Footer .footer-logo {
	width: 145px;
	height: auto;
	margin-bottom: 18px;
}
#Footer .footer_copy {
	margin-top: 50px;
	padding: 20px 0;
	border-top: 1px solid rgba(255,255,255,.1);
	font-size: 13px;
	background: none;
}
#Footer .footer_copy .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}
#Footer .footer_copy .copyright {
	color: #9a9da2;
	float: none;
	margin: 0;
}
#Footer .social {
	display: flex;
	gap: 10px;
	margin: 0;
	float: none;
}
#Footer .social a {
	font-size: 18px;
	color: #cfd1d4;
}
#Footer .social a:hover { color: #e6a94a; }

/* Home lead: slogan + three link boxes (replaces the hero image) */
.lead {
	padding: 190px 0 60px;
	background: #f8f8f8;
	text-align: center;
}
.lead h1 {
	font-size: 46px;
	line-height: 1.1;
	font-weight: 700;
	color: #0c0c0c;
	margin: 0 0 10px;
}
.lead .lead-sub {
	font-size: 22px;
	font-weight: 300;
	color: #444;
	margin: 0 0 50px;
}
.lead-boxes { text-align: left; }
.lead-box {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-bottom: 3px solid #e6a94a;
	color: #444;
	text-decoration: none;
	overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}
.lead-box:hover {
	box-shadow: 0 12px 30px rgba(0,0,0,.08);
	transform: translateY(-3px);
	color: #444;
}
.lead-box img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}
.lead-box-body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 24px 24px 22px;
}
.lead-box-title {
	display: block;
	font-size: 21px;
	font-weight: 700;
	color: #0c0c0c;
	margin-bottom: 10px;
}
.lead-box-text {
	display: block;
	flex: 1;
	line-height: 1.6;
	margin-bottom: 18px;
}
.lead-box-link {
	display: block;
	color: #e6a94a;
	font-weight: 600;
}
@media (max-width: 991px) {
	.lead h1 { font-size: 36px; }
}
@media (max-width: 767px) {
	.lead { padding: 130px 0 40px; }
	.lead h1 { font-size: 28px; }
	.lead .lead-sub { font-size: 17px; margin-bottom: 30px; }
}

/* HEAT / AIR / NATURE / AQUA boxes: equal height */
.hana-grid > [class*="col-md-3"] { display: flex; }
.hana-grid > [class*="col-md-3"] > .column_attr { width: 100%; }

/* "Neler Yapıyoruz?" dark section */
.what-we-do p,
.what-we-do li { color: #fff; }
.what-we-do h4 {
	color: #e6a94a;
	margin: 25px 0 12px;
}
.what-we-do .list_check { margin-bottom: 25px; }
.what-we-do .list_check li { margin-bottom: 10px; }

/* ------------------------------------------------------------------
 * Product pages (customer brief, 2026-09): Ürünlerimiz landing, HoReCa,
 * Gaz Vanaları, Kat İstasyonları, HVAC Components.
 * ------------------------------------------------------------------ */

/* Compact lead variant for inner landing pages */
.lead.lead-compact { padding: 170px 0 30px; }
.lead.lead-compact h1 { font-size: 40px; }
.lead.lead-compact .lead-sub { margin-bottom: 40px; }
@media (max-width: 767px) {
	.lead.lead-compact { padding: 120px 0 20px; }
	.lead.lead-compact h1 { font-size: 27px; }
}

/* Kicker + breadcrumb */
.kicker {
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	font-weight: 600;
	color: #e6a94a;
	margin: 0 0 10px;
}
.crumbs {
	font-size: 13px;
	color: #888;
	margin: 0 0 22px;
}
.crumbs a { color: #666; }
.crumbs a:hover { color: #e6a94a; }
.crumbs i { font-size: 11px; color: #bbb; margin: 0 2px; }
.crumbs span { color: #0c0c0c; }
.page-title .crumbs { margin-bottom: 14px; }
.page-title .page-intro {
	max-width: 640px;
	margin: 14px auto 0;
	font-size: 17px;
	color: #555;
}

/* Two-column page hero: text left, photo right */
.page-hero {
	padding: 150px 0 60px;
	background: #f8f8f8;
}
.page-hero h1 {
	font-size: 46px;
	line-height: 1.1;
	font-weight: 700;
	color: #0c0c0c;
	margin: 0 0 18px;
}
.page-hero-lead {
	font-size: 17px;
	line-height: 1.65;
	color: #444;
	margin-bottom: 26px;
}
.page-hero-img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 4px;
	border-bottom: 3px solid #e6a94a;
}
.hero-feats {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 14px 28px;
}
.hero-feats li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 600;
	color: #0c0c0c;
}
.hero-feats i {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid #e6a94a;
	color: #e6a94a;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
}
@media (max-width: 991px) {
	.page-hero { padding: 130px 0 40px; }
	.page-hero h1 { font-size: 36px; }
	.page-hero-text { margin-bottom: 30px; }
}
@media (max-width: 767px) {
	.page-hero h1 { font-size: 28px; }
}

/* Generic section */
.sec { padding: 70px 0 40px; }
.sec-grey { background: #f8f8f8; }
.sec-head {
	text-align: center;
	max-width: 760px;
	margin: 0 auto 45px;
}
.sec-head h2 {
	font-size: 34px;
	font-weight: 700;
	color: #0c0c0c;
	margin: 0 0 12px;
}
.sec-head p { color: #555; margin: 0; }
.sec h2 { font-size: 34px; font-weight: 700; color: #0c0c0c; }
@media (max-width: 767px) {
	.sec { padding: 50px 0 20px; }
	.sec-head h2, .sec h2 { font-size: 26px; }
}

/* Icon boxes (Ürünlerimiz strip, Gaz Vanaları features) and Hakkımızda "Neden Biz?" */
.why-grid > [class*="col-md-3"], .why-grid > [class*="col-lg-3"] { display: flex; }
.why-grid .column_attr { width: 100%; display: flex; flex-direction: column; }
.why-box {
	width: 100%;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-bottom: 3px solid #e6a94a;
	padding: 30px 24px 24px;
	text-align: center;
}
.why-box i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #fdf3e3;
	color: #e6a94a;
	font-size: 26px;
	margin-bottom: 16px;
}
.why-box h4 { font-size: 17px; margin: 0 0 8px; color: #0c0c0c; }
.why-box p { margin: 0; color: #555; font-size: 14px; line-height: 1.6; }

/* Valve cards (HoReCa + Gaz Vanaları) */
.valve-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-bottom: 3px solid #e6a94a;
	overflow: hidden;
}
.valve-img {
	background: #0a0a0a;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
}
.valve-img img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}
.valve-body {
	padding: 22px 22px 24px;
	display: flex;
	flex-direction: column;
	flex: 1;
}
.valve-body h3 {
	font-size: 21px;
	font-weight: 700;
	color: #0c0c0c;
	margin: 0 0 10px;
}
.valve-body > p { color: #555; font-size: 14px; line-height: 1.6; flex: 1; margin-bottom: 18px; }
.valve-tech { margin-top: auto; }
.valve-btn { margin: 0 !important; align-self: flex-start; }
.tbl-note { font-size: 12px; color: #666; margin: 0 0 6px; line-height: 1.4; }

/* Spec tables */
.spec-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
	line-height: 1.3;
	margin: 0 0 14px;
}
.spec-table td, .spec-table th {
	border: 1px solid #ddd;
	padding: 6px 8px;
	text-align: left;
	vertical-align: middle;
}
.spec-table th { background: #f2f2f2; font-weight: 600; color: #0c0c0c; }
.spec-table td:first-child { font-weight: 600; color: #0c0c0c; }
.spec-table-wide { font-size: 15px; max-width: 420px; margin: 20px 0; }
.spec-table-wide td { padding: 12px 14px; }
.spec-table-wide td:last-child { color: #e6a94a; font-weight: 700; }
.flow-table td:first-child small { display: block; font-weight: 400; color: #777; font-size: 11px; }
.flow-table td:last-child { white-space: nowrap; color: #e6a94a; font-weight: 700; text-align: right; }
.flow-table + .tbl-note { margin-top: 14px; }

/* Package table image */
.paket-wrap {
	background: #fff;
	border: 1px solid #e1e1e1;
	padding: 20px;
	text-align: center;
}
.paket-wrap img { max-width: 1000px; width: 100%; height: auto; }

/* Flow steps (HoReCa "Nasıl çalışır?") */
.flow-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
	gap: 14px;
	counter-reset: step;
}
.flow-steps li {
	background: #f8f8f8;
	border: 1px solid #e1e1e1;
	border-bottom: 3px solid #e6a94a;
	padding: 22px 12px 18px;
	text-align: center;
	font-size: 13px;
	font-weight: 600;
	color: #0c0c0c;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.flow-steps li::before {
	counter-increment: step;
	content: counter(step);
	font-size: 11px;
	color: #999;
	letter-spacing: 1px;
}
.flow-steps i { font-size: 26px; color: #e6a94a; }

/* Feature cards with photo (Kat İstasyonları) */
.feat-card {
	height: 100%;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-bottom: 3px solid #e6a94a;
	display: flex;
	flex-direction: column;
}
.feat-card img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: #fff;
}
.feat-card-body { padding: 20px 20px 22px; }
.feat-card-body h4 {
	font-size: 16px;
	margin: 0 0 8px;
	color: #0c0c0c;
	display: flex;
	align-items: center;
	gap: 8px;
}
.feat-card-body h4 i { color: #e6a94a; font-size: 17px; }
.feat-card-body p { margin: 0; color: #555; font-size: 14px; line-height: 1.6; }

.kat-sema {
	width: 100%;
	max-width: 560px;
	height: auto;
	display: block;
	margin: 0 auto;
	background: #fff;
	border: 1px solid #e1e1e1;
	padding: 20px;
}
.kat-sema-note { color: #555; font-size: 14px; }

/* Feature strip: icon + label */
.feat-strip {
	list-style: none;
	margin: 26px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
}
.feat-strip li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 600;
	color: #0c0c0c;
}
.feat-strip i {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid #e6a94a;
	color: #e6a94a;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
}

/* CTA band with photo background */
.cta-band {
	position: relative;
	background-size: cover;
	background-position: center;
	padding: 90px 0;
	margin-top: 30px;
	color: #fff;
}
.cta-band::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(12, 12, 12, .72);
}
.cta-band .container { position: relative; }
.cta-band-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
}
.cta-band h2 {
	color: #fff;
	font-size: 30px;
	font-weight: 700;
	margin: 0 0 10px;
}
.cta-band p { color: #ddd; margin: 0; max-width: 620px; }
.cta-band .button { margin: 0; }
@media (max-width: 767px) {
	.cta-band { padding: 60px 0; }
	.cta-band h2 { font-size: 24px; }
}


/* HVAC Components listing — compact, tidier product rows (keeps original layout).
   Theme JS scatters the product .container blocks across the DOM, so these rules
   anchor on body.hvac-index, never on #Content. Footer is unaffected: it uses
   col-md-4 and its logo is not inside an .image_frame. */
.hvac-index .row:has(> .col-md-6 .image_frame) { align-items: center; }
.hvac-index .image_frame { margin: 0; }
.hvac-index .image_frame img { max-width: 240px !important; width: 100%; height: auto; }
.hvac-index .col-md-6 { padding-top: 24px !important; padding-bottom: 24px !important; }
.hvac-index .col-md-6 h3 { margin-top: 0; margin-bottom: 18px; }
.hvac-index hr.no_line { margin: 0 auto 20px !important; }
@media (max-width: 767px) {
	.hvac-index .image_frame img { max-width: 200px !important; }
	.hvac-index .col-md-6 { padding-top: 12px !important; padding-bottom: 12px !important; text-align: center; }
	.hvac-index .image_frame { text-align: center; }
}

/* Language toggle (TR | EN) — last item in the main menu */
#menu .menu-lang > a { font-weight: 700; letter-spacing: .04em; }
