/*
Theme Name: Chustą związani — Child (Hello Elementor)
Theme URI: https://chustazwiazani.pl
Description: Motyw potomny Hello Elementor dla chustazwiazani.pl. Layout edytowany w darmowym Elementorze (import gotowych szablonów). Tu trzymamy kolory marki, fonty, sticky header i drobne dopieszczenia CSS.
Author: Cyfrowa Pomoc
Author URI: https://cyfrowapomoc.pl
Template: hello-elementor
Version: 1.1.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chustazwiazani-child
*/

/* =========================================================
   Zmienne marki — używaj ich też w Elementorze (Global Colors)
   ========================================================= */
:root {
	--cz-clay:   #C08661; /* główny akcent — terakota / glina */
	--cz-clay-d: #A66E4C; /* akcent ciemniejszy (hover) */
	--cz-sage:   #9CAF88; /* drugi akcent — szałwia */
	--cz-cream:  #FBF7F2; /* tło sekcji */
	--cz-muslin: #EADFD3; /* karty / delikatne bloki */
	--cz-text:   #44382E; /* tekst główny */
	--cz-muted:  #7A6E62; /* tekst drugorzędny */
	--cz-dark:   #3A322B; /* stopka / sekcje ciemne */
}

/* Typografia bazowa */
body {
	color: var(--cz-text);
	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "Lora", Georgia, "Times New Roman", serif;
	color: var(--cz-text);
}

/* Linki poza Elementorem (np. polityka prywatności) */
a { color: var(--cz-clay); text-decoration: none; }
a:hover { color: var(--cz-clay-d); }

/* Miękkie zaokrąglenia obrazków, jeśli gdzieś brakuje */
img { border-radius: inherit; max-width: 100%; height: auto; }

/* =========================================================
   Kotwice + sticky header
   Płynne przewijanie do #oferta, #kontakt itd. z offsetem,
   żeby sekcja nie chowała się pod przyklejonym nagłówkiem.
   ========================================================= */
html { scroll-behavior: smooth; scroll-padding-top: 96px; }

/* Nagłówek z wtyczki „Header & Footer Elementor" — przyklejony na górze.
   ehf = elementor header/footer wrapper. */
#ehf-template-header,
.ehf-header #masthead {
	position: sticky;
	top: 0;
	z-index: 999;
	backdrop-filter: saturate(180%) blur(8px);
	box-shadow: 0 1px 0 rgba(68, 56, 46, 0.06);
	transition: box-shadow .2s ease;
}

/* Menu w nagłówku — podkreślenie pod kursorem */
.cz-nav a { position: relative; transition: color .15s ease; }
.cz-nav a:hover { color: var(--cz-clay); }
.cz-nav a::after {
	content: ""; position: absolute; left: 0; bottom: -4px;
	width: 0; height: 2px; background: var(--cz-clay); transition: width .2s ease;
}
.cz-nav a:hover::after { width: 100%; }

/* =========================================================
   Pływający przycisk WhatsApp (wstrzykiwany w functions.php)
   ========================================================= */
.cz-wa-float {
	position: fixed; right: 20px; bottom: 20px; z-index: 9998;
	display: inline-flex; align-items: center; justify-content: center;
	width: 58px; height: 58px; border-radius: 50%;
	background: #25D366; color: #fff !important;
	box-shadow: 0 8px 24px rgba(37, 211, 102, .35);
	transition: transform .15s ease, box-shadow .15s ease;
}
.cz-wa-float:hover { transform: translateY(-2px) scale(1.04); color: #fff !important; }
.cz-wa-float svg { width: 30px; height: 30px; fill: currentColor; }

/* =========================================================
   Drobne dopieszczenia responsywne
   ========================================================= */
@media (max-width: 767px) {
	html { scroll-padding-top: 76px; }
	.cz-nav { display: none !important; } /* na mobile zwykłe menu z hamburgerem */
}