/*
Theme Name: Meghirdetem
Theme URI: https://meghirdetem.hu/
Author: Meghirdetem.hu
Description: Egyedi, konnyu aprohirdetesi tema a Meghirdetem Listings pluginhoz.
Version: 0.2.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: meghirdetem
*/

:root {
	--mh-ink: #142b27;
	--mh-green: #0d6655;
	--mh-green-dark: #07483d;
	--mh-mint: #dcecdf;
	--mh-cream: #f7f1e6;
	--mh-paper: #fffdf8;
	--mh-orange: #cf6138;
	--mh-line: #d8e1db;
	--mh-muted: #63716b;
	--mh-shadow: 0 18px 50px rgba(20, 43, 39, .1);
	--mh-radius: 24px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	margin: 0;
	background:
		radial-gradient(circle at 8% 8%, rgba(207, 97, 56, .08), transparent 26rem),
		linear-gradient(180deg, var(--mh-paper), #f8faf7 65%, var(--mh-cream));
	color: var(--mh-ink);
	font-family: "Trebuchet MS", "Gill Sans", sans-serif;
	line-height: 1.65;
}

body::before {
	position: fixed;
	inset: 0;
	z-index: -1;
	background-image: radial-gradient(rgba(13, 102, 85, .09) 1px, transparent 1px);
	background-size: 28px 28px;
	content: "";
	mask-image: linear-gradient(to bottom, black, transparent 60%);
}

a { color: var(--mh-green); text-decoration: none; }
a:hover { color: var(--mh-orange); }
img { display: block; max-width: 100%; height: auto; }

h1, h2, h3 {
	margin: 0 0 .65em;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	letter-spacing: -.025em;
	line-height: 1.08;
}

h1 { font-size: clamp(2.5rem, 6vw, 5.4rem); }
h2 { font-size: clamp(2rem, 4vw, 3.5rem); }
h3 { font-size: 1.35rem; }

.mh-shell { width: min(1180px, calc(100% - 2rem)); margin-inline: auto; }
.mh-main { min-height: 65vh; }

.mh-topline {
	background: var(--mh-green-dark);
	color: #dff5e9;
	font-size: .82rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.mh-topline .mh-shell { display: flex; justify-content: space-between; gap: 1rem; padding-block: .5rem; }

.mh-site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid rgba(13, 102, 85, .12);
	background: rgba(255, 253, 248, .93);
	backdrop-filter: blur(14px);
}

.mh-header-inner { display: flex; align-items: center; min-height: 78px; gap: 2rem; }

.mh-brand {
	display: inline-flex;
	align-items: center;
	gap: .75rem;
	color: var(--mh-ink);
	font-family: Georgia, serif;
	font-size: 1.45rem;
	font-weight: 700;
}

.mh-brand-mark {
	display: grid;
	width: 40px;
	height: 40px;
	place-items: center;
	border-radius: 12px 12px 12px 3px;
	background: var(--mh-orange);
	color: white;
	font-family: "Trebuchet MS", sans-serif;
}

.custom-logo { max-height: 52px; width: auto; }

.mh-nav { margin-left: auto; }
.mh-nav ul { display: flex; align-items: center; gap: 1.4rem; margin: 0; padding: 0; list-style: none; }
.mh-nav a { color: var(--mh-ink); font-weight: 700; }

.mh-header-cta,
.mh-button-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: var(--mh-green);
	color: white;
	padding: .8rem 1.15rem;
	font-weight: 800;
	box-shadow: 0 10px 22px rgba(13, 102, 85, .2);
}

.mh-header-cta:hover,
.mh-button-link:hover { background: var(--mh-orange); color: white; transform: translateY(-1px); }
.mh-menu-toggle { display: none; border: 0; background: transparent; font: inherit; font-weight: 800; }

.mh-hero { overflow: hidden; padding: clamp(4rem, 10vw, 8rem) 0 4.5rem; }
.mh-hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); }

.mh-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	margin-bottom: 1rem;
	color: var(--mh-orange);
	font-size: .82rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.mh-eyebrow::before { width: 34px; height: 2px; background: currentColor; content: ""; }
.mh-hero h1 em { color: var(--mh-green); font-style: normal; }
.mh-hero-copy > p { max-width: 700px; color: var(--mh-muted); font-size: 1.15rem; }

.mh-hero-card {
	position: relative;
	border: 1px solid rgba(13, 102, 85, .12);
	border-radius: 36px 36px 36px 8px;
	background: var(--mh-green-dark);
	color: white;
	padding: clamp(2rem, 4vw, 3.5rem);
	box-shadow: var(--mh-shadow);
	transform: rotate(1.5deg);
}

.mh-hero-card::after {
	position: absolute;
	right: -32px;
	bottom: -32px;
	width: 150px;
	height: 150px;
	border: 28px solid rgba(255,255,255,.08);
	border-radius: 50%;
	content: "";
}

.mh-hero-card h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.mh-hero-card p { color: #cce5dc; }
.mh-stat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; margin-top: 2rem; }
.mh-stat-row strong { display: block; color: #ffb28f; font-size: 1.45rem; }
.mh-stat-row span { font-size: .78rem; color: #cce5dc; }

.mh-search-panel {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr auto;
	gap: .75rem;
	margin-top: 2.2rem;
	border: 1px solid var(--mh-line);
	border-radius: 20px;
	background: white;
	padding: .75rem;
	box-shadow: var(--mh-shadow);
}

.mh-search-panel input,
.mh-search-panel select,
.mh-filter-grid input,
.mh-filter-grid select {
	width: 100%;
	border: 0;
	border-radius: 12px;
	background: #f3f6f3;
	padding: .9rem 1rem;
	font: inherit;
}

.mh-search-panel button,
.mh-filter-grid button {
	border: 0;
	border-radius: 12px;
	background: var(--mh-orange);
	color: white;
	padding: .9rem 1.25rem;
	font: inherit;
	font-weight: 900;
	cursor: pointer;
}

.mh-section { padding: clamp(3.5rem, 8vw, 7rem) 0; }
.mh-section-soft { background: rgba(220, 236, 223, .52); }
.mh-section-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 2.2rem; }
.mh-section-head p { max-width: 520px; color: var(--mh-muted); }

.mh-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.mh-category-card {
	position: relative;
	min-height: 170px;
	border: 1px solid var(--mh-line);
	border-radius: var(--mh-radius);
	background: var(--mh-paper);
	padding: 1.5rem;
	color: var(--mh-ink);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}
.mh-category-card::after { position: absolute; right: -25px; bottom: -35px; width: 110px; height: 110px; border-radius: 50%; background: var(--mh-mint); content: ""; }
.mh-category-card:hover { color: var(--mh-ink); transform: translateY(-5px); box-shadow: var(--mh-shadow); }
.mh-category-card span { color: var(--mh-muted); font-size: .9rem; }

.mh-listing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.mh-listing-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	border: 1px solid var(--mh-line);
	border-radius: var(--mh-radius);
	background: var(--mh-paper);
	overflow: hidden;
	box-shadow: 0 8px 25px rgba(20,43,39,.06);
	transition: transform .25s ease, box-shadow .25s ease;
}
.mh-listing-card:hover { transform: translateY(-5px); box-shadow: var(--mh-shadow); }
.mh-card-image { position: relative; aspect-ratio: 16 / 10; background: linear-gradient(135deg, var(--mh-mint), #f5d9c8); overflow: hidden; }
.mh-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.mh-listing-card:hover .mh-card-image img { transform: scale(1.04); }
.mh-card-placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: var(--mh-green); font-family: Georgia, serif; font-size: 2rem; }
.mh-card-badge { position: absolute; top: .8rem; left: .8rem; border-radius: 999px; background: rgba(255,255,255,.92); padding: .35rem .65rem; color: var(--mh-orange); font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.mh-card-body { display: flex; flex: 1; flex-direction: column; padding: 1.25rem; }
.mh-card-meta { display: flex; flex-wrap: wrap; gap: .4rem .8rem; margin-bottom: .75rem; color: var(--mh-muted); font-size: .8rem; }
.mh-card-body h3 { margin-bottom: .65rem; }
.mh-card-body h3 a { color: var(--mh-ink); }
.mh-card-excerpt { color: var(--mh-muted); font-size: .92rem; }
.mh-card-foot { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: 1rem; }
.mh-price { color: var(--mh-green); font-family: Georgia, serif; font-size: 1.2rem; font-weight: 700; }

.mh-archive-head { padding: 4rem 0 2rem; }
.mh-archive-head h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
.mh-filter-box { margin-bottom: 2rem; border: 1px solid var(--mh-line); border-radius: var(--mh-radius); background: white; padding: 1rem; box-shadow: var(--mh-shadow); }
.mh-filter-grid { display: grid; grid-template-columns: 1.3fr repeat(4, 1fr) auto; gap: .6rem; }
.mh-pagination { margin-top: 2.5rem; }
.mh-pagination .nav-links { display: flex; gap: .5rem; justify-content: center; }
.mh-pagination a, .mh-pagination span { display: grid; min-width: 42px; height: 42px; place-items: center; border-radius: 12px; background: white; }
.mh-pagination .current { background: var(--mh-green); color: white; }

.mh-single { padding: 3rem 0 6rem; }
.mh-single-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(310px, .65fr); gap: 2rem; align-items: start; }
.mh-single-main, .mh-contact-panel { border: 1px solid var(--mh-line); border-radius: var(--mh-radius); background: var(--mh-paper); box-shadow: var(--mh-shadow); }
.mh-gallery-main { aspect-ratio: 16 / 10; border-radius: var(--mh-radius) var(--mh-radius) 0 0; background: var(--mh-mint); overflow: hidden; }
.mh-gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.mh-gallery-thumbs { display: flex; gap: .5rem; overflow-x: auto; padding: .75rem; }
.mh-gallery-thumbs button { flex: 0 0 92px; height: 68px; border: 2px solid transparent; border-radius: 10px; padding: 0; overflow: hidden; cursor: pointer; }
.mh-gallery-thumbs button.is-active { border-color: var(--mh-orange); }
.mh-gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.mh-single-content { padding: clamp(1.4rem, 4vw, 3rem); }
.mh-single-content h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
.mh-single-meta { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.mh-pill { border-radius: 999px; background: var(--mh-mint); padding: .4rem .75rem; color: var(--mh-green-dark); font-size: .8rem; font-weight: 800; }
.mh-single-price { margin: 1.4rem 0; color: var(--mh-orange); font-family: Georgia, serif; font-size: 2rem; font-weight: 700; }
.mh-contact-panel { position: sticky; top: 110px; padding: 1.5rem; }
.mh-contact-panel h2 { font-size: 1.8rem; }
.mh-contact-name { font-weight: 900; }
.mh-contact-phone { display: block; margin: .8rem 0 1.2rem; font-size: 1.1rem; font-weight: 800; }

.mh-empty { border: 1px dashed var(--mh-line); border-radius: var(--mh-radius); background: white; padding: 3rem; text-align: center; }

.mh-site-footer { margin-top: 4rem; background: var(--mh-green-dark); color: #d8eee5; padding: 4rem 0 1.5rem; }
.mh-footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 3rem; }
.mh-site-footer h2, .mh-site-footer h3 { color: white; }
.mh-site-footer a { color: #d8eee5; }
.mh-site-footer ul { margin: 0; padding: 0; list-style: none; }
.mh-copyright { margin-top: 3rem; border-top: 1px solid rgba(255,255,255,.12); padding-top: 1rem; font-size: .82rem; }

@keyframes mh-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.mh-hero-copy, .mh-hero-card, .mh-listing-card { animation: mh-rise .55s ease both; }
.mh-listing-card:nth-child(2) { animation-delay: .06s; }
.mh-listing-card:nth-child(3) { animation-delay: .12s; }

@media (max-width: 980px) {
	.mh-hero-grid, .mh-single-grid { grid-template-columns: 1fr; }
	.mh-hero-card { transform: none; }
	.mh-category-grid { grid-template-columns: repeat(2, 1fr); }
	.mh-listing-grid { grid-template-columns: repeat(2, 1fr); }
	.mh-filter-grid { grid-template-columns: repeat(2, 1fr); }
	.mh-contact-panel { position: static; }
	.mh-nav { display: none; position: absolute; top: 78px; right: 1rem; left: 1rem; border: 1px solid var(--mh-line); border-radius: 18px; background: white; padding: 1rem; box-shadow: var(--mh-shadow); }
	.mh-nav.is-open { display: block; }
	.mh-nav ul { align-items: stretch; flex-direction: column; }
	.mh-menu-toggle { display: block; margin-left: auto; }
	.mh-header-cta { display: none; }
}

@media (max-width: 680px) {
	.mh-search-panel, .mh-listing-grid, .mh-category-grid, .mh-filter-grid, .mh-footer-grid { grid-template-columns: 1fr; }
	.mh-stat-row { grid-template-columns: 1fr; }
	.mh-section-head { align-items: start; flex-direction: column; }
	.mh-topline .mh-shell { justify-content: center; text-align: center; }
	.mh-topline span:last-child { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
