/*
Theme Name: Esse Güzellik
Theme URI: https://www.byesseguzellik.com
Author: Esse Güzellik
Description: Esse Güzellik – Kuaför & Güzellik Salonu için tek sayfalık, siyah ve altın tonlarda özel blok teması. Hizmet listesi, galeri, WhatsApp ile randevu ve Google Haritalar konumu içerir. Tüm metinler ve fotoğraflar WordPress editöründen, iletişim bilgileri Görünüm › Salon Bilgileri sayfasından değiştirilebilir.
Version: 1.0.2
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: esse-guzellik
*/

/* Genel */
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 96px; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-block-post-content > .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.wp-block-post-content > .alignfull + .alignfull { margin-block-start: 0 !important; }
body { -webkit-font-smoothing: antialiased; }

/* Sabit üst menü */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
}
.esse-header {
	position: relative;
	background: transparent;
	border-bottom: 1px solid rgba(201, 162, 74, 0.25);
}
/* Bulanık zemin ayrı katmanda: doğrudan başlığa verilince mobil menü başlığın içine hapsoluyordu */
.esse-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(246, 240, 231, 0.94);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.esse-header .wp-block-navigation a { text-decoration: none; }
.esse-header .wp-block-navigation a:hover { color: var(--wp--preset--color--gold-light); }
.esse-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--dark) !important;
	color: var(--wp--preset--color--ink) !important;
	padding: 32px;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 28px;
	font-size: 20px;
}

/* Küçük üst etiketler */
.esse-eyebrow {
	letter-spacing: 0.3em;
	text-transform: uppercase;
}

/* Başlıklardaki altın italik vurgu */
.esse-accent em,
h1 em, h2 em {
	font-style: italic;
	color: var(--wp--preset--color--gold-light);
}
.has-cream-background-color h2 em,
.has-white-background-color h2 em { color: var(--wp--preset--color--gold-dark); }

/* Ayırıcı çizgi */
.esse-rule {
	width: 96px;
	height: 1px;
	background: var(--wp--preset--color--gold);
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Hizmet kartları ve fiyat satırları */
.esse-card { height: 100%; box-sizing: border-box; }
.esse-price-row {
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding-top: 16px;
	padding-bottom: 16px;
}
.esse-price-row p { margin: 0; }
.esse-price-row .esse-price { white-space: nowrap; }

/* Butonlar */
.wp-block-button__link { transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--gold);
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--ink);
}
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover {
	background: var(--wp--preset--color--gold-light);
}

/* Fotoğraf alanları (boşken) */
.esse-photo .wp-block-cover__inner-container p { opacity: .75; }
.esse-photo { overflow: hidden; }
.esse-photo { border: 1px solid rgba(201, 162, 74, 0.3); }

/* Harita */
.esse-map { min-height: 420px; padding: 0 !important; }
.esse-map iframe { display: block; width: 100%; height: 420px; border: 0; filter: grayscale(0.35) contrast(1.05); }

/* İletişim listesi */
.esse-info-item p { margin: 0; }

/* Sabit WhatsApp butonu */
.esse-wa-float {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 60;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #25D366;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
	transition: transform .2s ease;
}
.esse-wa-float:hover { transform: scale(1.06); color: #fff; }
.esse-wa-float svg { width: 32px; height: 32px; }

/* Mobil */
@media (max-width: 781px) {
	.esse-header .wp-block-button__link { padding: 10px 14px !important; font-size: 12px; letter-spacing: 0.1em; }
	.esse-header .wp-block-site-logo img { width: 84px !important; }
	.esse-hero h1 { font-size: 46px !important; }
	.esse-section { padding-top: 72px !important; padding-bottom: 72px !important; }
	.esse-card { padding: 32px 24px !important; }
	.esse-photo .wp-block-cover { min-height: 320px !important; }
	footer .wp-block-navigation { justify-content: flex-start !important; }
}

/* ---------------------------------------------------------------
 * Açık (soft) renk düzeni
 * "cream" rengi hem zemin hem yazı olarak kullanılıyor:
 * yazıda koyu kahve, zeminde sıcak beyaz olarak gösterilir.
 * ------------------------------------------------------------- */
.has-cream-color, .has-cream-color.has-text-color, :root .has-cream-color { color: #2A231C !important; }
.has-cream-background-color, .has-cream-background-color.has-background, :root .has-cream-background-color { background-color: #FCF9F4 !important; }
.wp-block-button.is-style-outline > .wp-block-button__link.has-cream-color { border-color: #2A231C; }
.esse-header .wp-block-navigation a:hover { color: var(--wp--preset--color--gold-dark); }
.esse-card.has-dark-background-color { background-color: #FCF9F4 !important; }
.esse-photo { border-color: rgba(142, 110, 39, 0.28); }
footer.wp-block-template-part > .has-dark-background-color { background-color: #EFE4D5 !important; }

/* Temanın hazır görselleri */
.esse-theme-img { margin: 0; }
.esse-theme-img img { display: block; width: 100%; height: auto; }
.esse-arch { max-width: 480px; margin-inline: auto; }
.esse-square img { aspect-ratio: 1 / 1; object-fit: cover; transition: transform .6s ease; }
.esse-square { overflow: hidden; }
.esse-square:hover img { transform: scale(1.04); }

/* Hizmet listeleri (fiyatsız) */
.esse-service-card { display: flex; flex-direction: column; }
.esse-service-card > .wp-block-buttons { margin-top: auto !important; padding-top: 36px; }
.esse-illus img { display: block; margin-inline: auto; }
.esse-service-list { list-style: none; padding: 0; margin: 0; }
.esse-service-list li {
	position: relative;
	padding: 13px 0 13px 26px;
	border-bottom: 1px solid var(--wp--preset--color--line);
	font-size: 17px;
	break-inside: avoid;
}
.esse-service-list li::before {
	content: "";
	position: absolute; left: 4px; top: 50%;
	width: 7px; height: 7px;
	border: 1px solid var(--wp--preset--color--gold);
	transform: translateY(-50%) rotate(45deg);
}
.esse-two-col { column-count: 2; column-gap: 40px; }
@media (max-width: 600px) { .esse-two-col { column-count: 1; } }

/* Okunabilirlik (1.7.0): daha dolgun ve koyu yazılar */
.esse-eyebrow { font-weight: 600; }
h1, h2 { font-weight: 500; }
h1 em, h2 em { font-weight: 500; }
.esse-hero h1 { font-weight: 600; letter-spacing: -0.01em; }
.esse-hero h1 em { font-weight: 500; }
.esse-hero p:not(.esse-eyebrow) { font-weight: 400; }
.esse-service-list li { font-weight: 400; color: #2A231C; }
.has-muted-color, .has-muted-dark-color { font-weight: 400; }
.wp-block-button__link { font-weight: 600; }

/* Ekip imzası */
.esse-team-sign .esse-rule-left { margin-left: 0 !important; margin-right: auto !important; width: 64px; }
.esse-team-sign p { margin: 0; }
.esse-team-sign .esse-eyebrow { margin-top: 10px !important; }
.esse-team-sign .has-x-large-font-size { line-height: 1.25; }

/* 1.7.3: Altın dolgulu hizmet çizimleri biraz daha büyük */
.esse-service-card .esse-illus img { width: 300px !important; max-width: 100%; height: auto; }

/* 1.7.5: Mobil menü tam ekran ve ortalı */
.esse-header .wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	inset: 0 !important;
	width: 100% !important; height: 100dvh;
	box-sizing: border-box;
	background: #F7F2EB !important;
	padding: 24px 28px !important;
	z-index: 100000;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 0 !important;
	height: 100%;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: center !important;
	gap: 30px !important;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 34px;
	letter-spacing: 0.02em;
	text-transform: none;
	font-weight: 500;
	color: #2A231C !important;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--gold-dark) !important; }
.esse-header .wp-block-navigation__responsive-container-close {
	top: 22px !important; right: 22px !important;
	width: 44px; height: 44px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid rgba(142, 110, 39, 0.4); border-radius: 50%;
	color: #2A231C;
}
.esse-header .wp-block-navigation__responsive-container-open { color: #2A231C; padding: 8px; }
.esse-header .wp-block-navigation__responsive-container-open svg,
.esse-header .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::after {
	content: "";
	display: block; width: 64px; height: 1px; margin-top: 8px;
	background: var(--wp--preset--color--gold);
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	height: 100%; max-width: none; margin: 0; position: static;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { position: fixed !important; }
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { justify-content: center; }
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	min-height: calc(100dvh - 48px);
	justify-content: center !important;
}
.esse-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex: 0 0 auto !important;
	justify-content: center !important;
}
.has-modal-open .esse-wa-float { display: none; }

/* 1.7.7: Kendi fotoğraflarınız için kemer ve kare çerçeve */
.esse-photo.esse-user-arch {
	max-width: 480px;
	margin-inline: auto;
	aspect-ratio: 4 / 5;
	border: 0;
	background: transparent !important;
	border-radius: 50% 50% 0 0 / 40% 40% 0 0;
	overflow: hidden;
	box-shadow: 0 0 0 14px #EFE4D5, 0 0 0 15px #C9A24A;
	margin-top: 16px; margin-bottom: 16px;
}
.esse-photo.esse-user-square { aspect-ratio: 1 / 1; border: 0; overflow: hidden; }
.esse-user-arch > *, .esse-user-square > * { height: 100%; min-height: 0 !important; margin: 0 !important; padding: 0 !important; }
.esse-user-arch .wp-block-cover, .esse-user-square .wp-block-cover { height: 100%; min-height: 0 !important; }
.esse-user-arch figure, .esse-user-square figure { height: 100%; width: 100%; }
.esse-user-arch img, .esse-user-square img {
	display: block; width: 100% !important; height: 100% !important;
	object-fit: cover; max-width: none;
}
.esse-user-square img { transition: transform .6s ease; }
.esse-user-square:hover img { transform: scale(1.04); }
.esse-user-arch .wp-block-cover__inner-container, .esse-user-square .wp-block-cover__inner-container { display: none; }
/* Hakkımızda'ya fotoğraf doğrudan görsel bloğu olarak eklendiyse de kemer şekli */
#hakkimizda .wp-block-column:first-child > .wp-block-image:not(.esse-theme-img) {
	max-width: 480px; margin: 16px auto;
	aspect-ratio: 4 / 5;
	border-radius: 50% 50% 0 0 / 40% 40% 0 0;
	overflow: hidden;
	box-shadow: 0 0 0 14px #EFE4D5, 0 0 0 15px #C9A24A;
}
#hakkimizda .wp-block-column:first-child > .wp-block-image:not(.esse-theme-img) img {
	width: 100% !important; height: 100% !important; object-fit: cover; display: block;
}

/* Tablet: üst menü tek satırda kalsın */
@media (min-width: 600px) and (max-width: 1100px) {
	.esse-header .wp-block-navigation { gap: 20px !important; }
	.esse-header .wp-block-navigation .wp-block-navigation__container { gap: 20px !important; flex-wrap: nowrap; }
	.esse-header .wp-block-navigation a { font-size: 12px; letter-spacing: 0.12em; white-space: nowrap; }
	.esse-header .wp-block-button__link { white-space: nowrap; padding: 10px 16px !important; font-size: 12px; }
	.esse-header > .wp-block-group > .wp-block-group { gap: 20px !important; }
}

/* Hakkımızda kemer görseli (görsel bloğu olarak) */
.esse-theme-img.esse-arch img { width: 100%; height: auto; }

/* ---------------------------------------------------------------
 * 1.9.0: Hizmet kartları – alt başlıklı listeler
 * ------------------------------------------------------------- */
.esse-service-card .esse-eyebrow.has-small-font-size { font-size: 14px !important; letter-spacing: 0.32em; }
.esse-service-tagline {
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(24px, 2.2vw, 30px) !important;
	font-weight: 500;
	line-height: 1.3;
	color: #2A231C;
}
.esse-service-tagline em { color: var(--wp--preset--color--gold-dark); }
.esse-service-groups { gap: 28px 36px !important; align-items: start; }
.esse-service-group > * { margin-top: 0; }
.esse-subhead {
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	margin-bottom: 4px !important;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(201, 162, 74, 0.55);
}
.esse-service-group .esse-service-list li { padding: 8px 0 8px 22px; font-size: 16px; border-bottom: 0; }
.esse-service-group .esse-service-list li::before { width: 6px; height: 6px; left: 3px; }
.esse-service-card > .esse-cta-link { margin-top: auto !important; padding-top: 40px; }
.esse-cta-link a {
	display: inline-block;
	font-size: 13px; font-weight: 600;
	letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--wp--preset--color--gold-dark);
	padding: 14px 24px;
	border: 1px solid var(--wp--preset--color--gold);
	transition: background-color .2s ease, color .2s ease;
}
.esse-cta-link a:hover { background: var(--wp--preset--color--gold); color: #2A231C; }
.esse-cta-link a span { margin-left: 6px; }
@media (max-width: 781px) { .esse-service-card { padding: 36px 24px !important; } }
.esse-service-tagline { font-size: clamp(22px, 1.85vw, 27px) !important; text-wrap: balance; }
@media (min-width: 782px) {
	.esse-service-tagline { min-height: 2.6em; display: flex; align-items: center; justify-content: center; }
}
.esse-service-group .esse-service-list li::before { top: 1.1em; transform: rotate(45deg); }

/* ===============================================================
 * ESSE GÜZELLİK – siyah & altın dokunuşlar (1.0.0)
 * Logodaki siyah-altın havayı açılış ve slogan bandında kullanır;
 * diğer bölümler açık krem tonlarda kalır.
 * ============================================================= */
:root {
	--esse-black: #0B0A08;
	--esse-ink: #14120E;
	--esse-gold-grad: linear-gradient(135deg, #F3DC9A 0%, #C9A24A 40%, #9A7426 65%, #E8CD86 100%);
	--esse-soft: #CDBF9F;
}

/* Üst menüdeki yuvarlak logo */
.esse-header .wp-block-site-logo img { border-radius: 50%; box-shadow: 0 0 0 1px rgba(201,162,74,.45); }
@media (max-width: 781px) { .esse-header .wp-block-site-logo img { width: 54px !important; } }

/* Açılış: siyah zemin, altın ışıltı ve halkalar */
.esse-hero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(ellipse 55% 50% at 50% 40%, rgba(201,162,74,.22), transparent 70%),
		radial-gradient(ellipse 90% 60% at 50% 115%, rgba(201,162,74,.12), transparent 60%),
		var(--esse-black) !important;
}
.esse-hero::before, .esse-hero::after {
	content: ""; position: absolute; left: 50%; top: 46%;
	aspect-ratio: 1; border-radius: 50%; pointer-events: none;
	transform: translate(-50%, -50%);
}
.esse-hero::before { width: min(820px, 140vw); border: 1px solid rgba(201,162,74,.26); }
.esse-hero::after  { width: min(660px, 112vw); border: 1px solid rgba(201,162,74,.14); }
.esse-hero .wp-block-cover__inner-container { position: relative; z-index: 2; }
.esse-hero .wp-block-site-logo img {
	width: clamp(170px, 20vw, 230px) !important; height: auto;
	border-radius: 50%;
	box-shadow: 0 0 70px rgba(201,162,74,.28), 0 0 0 1px rgba(201,162,74,.4);
}
.esse-hero .wp-block-site-logo { margin-bottom: 30px !important; }
.esse-hero .esse-hero-services { color: #C9A24A !important; letter-spacing: .22em; margin-bottom: 18px !important; }
.esse-hero h1 { color: #FFFFFF !important; line-height: 1.05; margin-top: 0; }
.esse-hero h1 em {
	background: var(--esse-gold-grad);
	-webkit-background-clip: text; background-clip: text;
	color: transparent !important;
	padding-right: .08em;
}
.esse-hero .esse-hero-lead {
	color: var(--esse-soft) !important;
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic; font-weight: 500 !important;
	max-width: 620px; margin-inline: auto !important;
}
.esse-hero .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
	background: var(--esse-gold-grad); border-color: transparent; color: #1A140A;
	box-shadow: 0 8px 26px rgba(201,162,74,.28);
}
.esse-hero .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover { filter: brightness(1.06); }
.esse-hero .wp-block-button.is-style-outline > .wp-block-button__link { border-color: #C9A24A; color: #F3E6C4 !important; }
.esse-hero .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(201,162,74,.15); color: #FFFFFF !important; }
@media (max-width: 781px) {
	.esse-hero { min-height: 0 !important; padding-top: 64px !important; padding-bottom: 72px !important; }
	.esse-hero .esse-hero-services { font-size: 11px !important; letter-spacing: .12em; }
	.esse-hero .wp-block-buttons { flex-direction: column; align-items: stretch; max-width: 340px; margin-inline: auto !important; }
	.esse-hero .wp-block-button__link { width: 100%; text-align: center; }
}

/* Slogan bandı */
.esse-quote {
	background:
		radial-gradient(ellipse 55% 80% at 50% 50%, rgba(201,162,74,.17), transparent 70%),
		var(--esse-ink) !important;
	text-align: center;
}
.esse-quote .esse-quote-mark {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 130px; line-height: .6; height: 48px; margin: 0 !important;
	color: #C9A24A; opacity: .55;
}
.esse-quote h2.esse-quote-text {
	color: #FFFFFF !important;
	font-size: clamp(34px, 5vw, 62px) !important;
	line-height: 1.15; font-weight: 500;
}
.esse-quote h2 em {
	background: var(--esse-gold-grad);
	-webkit-background-clip: text; background-clip: text;
	color: transparent !important; padding-right: .06em;
}
.esse-quote .esse-quote-lead { color: var(--esse-soft) !important; max-width: 580px; margin-inline: auto !important; }
.esse-quote .esse-quote-tags { color: #E8CD86 !important; letter-spacing: .24em; }
.esse-quote .wp-block-button__link { background: var(--esse-gold-grad); border-color: transparent; color: #1A140A; }

/* Hizmet çizimleri (kemer) */
.esse-service-card .esse-illus img { width: 230px !important; filter: drop-shadow(0 12px 24px rgba(20,18,14,.18)); }

/* Boş fotoğraf alanları: siyah zemin + soluk Esse logosu */
.esse-photo.esse-empty {
	background: radial-gradient(ellipse at 50% 45%, #2B2417 0%, #14120E 70%) !important;
	border: 1px solid rgba(201,162,74,.35);
	position: relative;
}
.esse-photo.esse-empty::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: url("assets/images/esse-icon.png") center 44% / 34% no-repeat;
	opacity: .32;
}
.esse-photo.esse-empty .wp-block-cover__inner-container { position: relative; z-index: 1; align-self: flex-end; padding-bottom: 22px; }
.esse-photo.esse-empty .wp-block-cover__inner-container p { color: #CDBF9F !important; opacity: .8; }
#galeri .esse-photo.esse-empty .wp-block-cover { aspect-ratio: 1 / 1; min-height: 0 !important; }
#galeri .esse-photo.esse-user-square { aspect-ratio: 1 / 1; }

/* Hakkımızda kemer görselinde altın çerçeve */
.esse-theme-img.esse-arch { filter: drop-shadow(0 18px 40px rgba(20,18,14,.22)); }
