/*
Theme Name: Kwiaty Lasu (Kadence Child)
Template: kadence
Description: Motyw potomny Kadence dla KWIATY LASU Pracownia Florystyczna – drobne style uzupełniające. Kolory i fonty ustawiasz w Wygląd → Dostosuj (paleta globalna Kadence).
Version: 1.0.0
Text Domain: kwiatylasu
*/

/* Kolory pochodzą z palety globalnej Kadence (Wygląd → Dostosuj → Kolory):
   1 butelkowa zieleń · 2 zgaszone złoto · 7 kremowy len · 8 jasny len · 11 mech · 12 szałwia */

/* --- Etykieta nad nagłówkiem ("eyebrow") – jak „PRACOWNIA FLORYSTYCZNA” w logo --- */
.kl-eyebrow {
	font-family: var(--global-body-font-family);
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--global-palette2);
	margin-bottom: 0.6rem;
}
.kl-eyebrow::after {
	content: "";
	display: block;
	width: 56px;
	height: 1px;
	margin: 0.9rem 0 0;
	background: currentColor;
	opacity: 0.7;
}
.has-text-align-center.kl-eyebrow::after { margin-inline: auto; }

/* --- Hero --- */
.kl-hero { min-height: min(92vh, 860px); }
.kl-hero .wp-block-cover__inner-container { max-width: 760px; }
.kl-hero-logo img { width: min(300px, 62vw); height: auto; }
.kl-hero h1 { color: var(--global-palette9); text-shadow: 0 2px 18px rgba(16, 32, 24, 0.45); }
.kl-hero .kl-eyebrow { color: var(--global-palette14); text-shadow: 0 1px 8px rgba(0,0,0,.6); }
.kl-hero p:not(.kl-eyebrow) { color: var(--global-palette7); text-shadow: 0 1px 10px rgba(16, 32, 24, 0.5); }

/* --- Przyciski: wariant obrysowany na ciemnym tle --- */
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link {
	color: var(--global-palette9);
	border-color: var(--global-palette9);
	background: transparent;
}
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:hover {
	background: var(--global-palette9);
	color: var(--global-palette1);
}

/* --- Karty oferty --- */
.kl-card {
	background: var(--global-palette9);
	border: 1px solid rgba(176, 141, 87, 0.35);
	border-radius: 4px;
	padding: 2.2rem 1.8rem;
	height: 100%;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.kl-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(31, 58, 46, 0.12); }
.kl-card .wp-block-image { margin-bottom: 1rem; }
.kl-card h3 { margin-top: 0; }
.wp-block-columns.kl-cards > .wp-block-column { display: flex; flex-direction: column; }
.wp-block-columns.kl-cards > .wp-block-column > .kl-card { flex: 1; }

/* --- Ozdobny separator z wieńcem --- */
.kl-wreath-divider img { width: 72px; height: auto; opacity: 0.9; }

/* --- Galeria: układ mozaikowy (masonry) – zdjęcia w całości, w swoich proporcjach, bez przycinania --- */
.kl-gallery.wp-block-gallery.has-nested-images { display: block !important; columns: 3 240px; column-gap: 16px; }
.kl-gallery.wp-block-gallery.has-nested-images figure.wp-block-image {
	display: block !important; width: 100% !important; height: auto !important; margin: 0 0 16px !important; break-inside: avoid;
	overflow: hidden; border-radius: 3px;
}
.kl-gallery.wp-block-gallery.has-nested-images figure.wp-block-image img {
	contain: none !important; contain-intrinsic-size: none !important; /* WP: img[sizes=auto] dostaje rezerwę 3000×1500 */
	flex: none !important; width: 100% !important; height: auto !important; object-fit: contain !important;
	transition: transform 0.5s ease, filter 0.5s ease;
}
.kl-gallery.wp-block-gallery figure.wp-block-image:hover img { transform: scale(1.03); filter: saturate(1.08); }

/* --- Godziny otwarcia --- */
.kl-hours table { border-collapse: collapse; width: 100%; }
.kl-hours td { padding: 0.45rem 0; border-bottom: 1px solid rgba(31, 58, 46, 0.12); }
.kl-hours td:last-child { text-align: right; font-weight: 500; }

/* --- Mapa --- */
.kl-map iframe { width: 100%; min-height: 360px; border: 0; border-radius: 4px; filter: saturate(0.85); }

/* --- Formularz Fluent Forms w barwach marki --- */
.fluentform .ff-el-form-control { border-color: rgba(31, 58, 46, 0.25); border-radius: 3px; background: var(--global-palette9); }
.fluentform .ff-el-form-control:focus { border-color: var(--global-palette1); box-shadow: 0 0 0 2px rgba(31, 58, 46, 0.12); }
.fluentform .ff-btn-submit { background: var(--global-palette1) !important; color: var(--global-palette9) !important; border-radius: 2px; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.85rem; padding: 0.9em 2em; }
.fluentform .ff-btn-submit:hover { background: var(--global-palette11) !important; }

/* --- Stopka: logo w negatywie --- */
.site-footer .kl-footer-logo img { width: 240px; height: auto; }
.site-footer a { text-decoration: none; }

/* Mniej „pudełkowe” strony pełnej szerokości */
.entry-content > .alignfull:first-child { margin-top: 0; }

@media (max-width: 781px) {
	.kl-hero { min-height: 78vh; }
	.kl-card { padding: 1.8rem 1.4rem; }
}
@media (prefers-reduced-motion: reduce) {
	.kl-card, .kl-gallery img { transition: none !important; }
}

/* ===== Poprawki po pierwszym podglądzie ===== */

/* Sekcje: rytm pionowy i marginesy boczne */
.kl-section { padding-top: clamp(3.5rem, 8vw, 6.5rem); padding-bottom: clamp(3.5rem, 8vw, 6.5rem); padding-left: var(--global-content-edge-padding, 1.5rem); padding-right: var(--global-content-edge-padding, 1.5rem); }
.kl-section .wp-block-group__inner-container > * + .wp-block-columns, .kl-section .wp-block-group__inner-container > * + .wp-block-gallery { margin-top: 2.5rem; }

/* Złoty przycisk (na ciemnym tle) */
.wp-block-button.kl-btn-gold > .wp-block-button__link { background: var(--global-palette2); color: var(--global-palette3); }
.wp-block-button.kl-btn-gold > .wp-block-button__link:hover { background: var(--global-palette14); color: var(--global-palette3); }

/* Ikony w kartach i w ofercie */
.kl-card .kl-card-icon img { width: 64px; height: auto; }
.kl-offer-icon img { width: min(180px, 60%); height: auto; }
.kl-offer-icon .wp-block-image { margin: 0; }
.kl-offer-icon figure { background: var(--global-palette9); border: 1px solid rgba(176, 141, 87, 0.35); border-radius: 50%; padding: 2.4rem; aspect-ratio: 1; display: grid !important; place-items: center; max-width: 280px; margin-inline: auto !important; }
.kl-offer.has-theme-palette-9-background-color .kl-offer-icon figure { background: var(--global-palette8); }
.kl-list { padding-left: 1.1em; }
.kl-list li { margin-bottom: 0.35em; }
.kl-list li::marker { color: var(--global-palette2); }

/* Link „Więcej” w kartach */
.kl-more { margin-top: auto; margin-bottom: 0; }
.kl-more a { font-size: 0.8rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; text-decoration: none; color: var(--global-palette1); }
.kl-more a::after { content: " →"; color: var(--global-palette2); }
.kl-card { display: flex; flex-direction: column; }

/* Zdjęcie pionowe */
.kl-photo img { width: 100%; height: auto; border-radius: 3px; }

/* CTA na zieleni */
.kl-cta h2, .kl-cta h3 { color: var(--global-palette9); }
.kl-cta p { color: var(--global-palette7); }
.kl-cta .kl-eyebrow { color: var(--global-palette14); }

/* Nagłówek podstron – leśny baner */
.entry-hero.page-hero-section .entry-hero-container-inner {
	background: linear-gradient(rgba(24, 38, 31, 0.6), rgba(24, 38, 31, 0.6)), url("assets/baner-kompozycja.webp") center 55% / cover no-repeat;
}
.entry-hero.page-hero-section .entry-title { color: var(--global-palette9); text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35); }

/* Stopka */
.site-footer .widget h3, .site-footer .wp-block-heading { color: var(--global-palette14); font-size: 1.45rem; margin-top: 0; }
.site-footer .widget p { color: var(--global-palette7); }
.site-footer .widget a { color: var(--global-palette7); }
.site-footer .widget a:hover { color: var(--global-palette14); }
.site-footer .kl-footer-logo { margin-bottom: 1rem; }

/* Nawigacja – złote podkreślenie */
.header-navigation .header-menu-container ul ul a { text-transform: none; letter-spacing: 0; }

/* Mapa */
.kl-map-section { line-height: 0; }
.kl-map iframe { min-height: 420px; border-radius: 0; display: block; }
.kl-map-note { line-height: 1.5; text-align: center; font-size: 0.85rem; padding: 0.6rem 1rem; margin: 0; background: var(--global-palette7); }

/* Social links w kontakcie */
.kl-social { margin-top: 0.5rem; }

/* Szerokie bloki w sekcjach: nigdy szersze niż sekcja (Kadence: wide = treść + 230px) */
.kl-section > .alignwide, .kl-section > .wp-block-group__inner-container > .alignwide { width: auto !important; max-width: min(1320px, 100%) !important; margin-left: auto !important; margin-right: auto !important; }

/* Tabela godzin bez pionowych linii */
.kl-hours table, .kl-hours td { border: 0; }
.kl-hours td { border-bottom: 1px solid rgba(31, 58, 46, 0.12); padding-left: 0; padding-right: 0; }

/* Przycisk obrysowany na ciemnym tle – hover/focus: kremowe tło, zielony tekst (wygrywa z regułami Kadence :not(.has-background)) */
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:hover,
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:focus,
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:active {
	background: var(--global-palette7) !important;
	border-color: var(--global-palette7) !important;
	color: var(--global-palette1) !important;
}

/* Bez poziomego przewijania strony (zapas na wypadek braku JS) */
html, body { overflow-x: clip; }

/* Przycisk obrysowany na ciemnym tle – stan spoczynkowy jawnie (białe obramowanie i tekst) */
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link,
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:visited {
	background: transparent !important;
	border: 2px solid var(--global-palette9) !important;
	color: var(--global-palette9) !important;
}
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:hover,
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:focus-visible,
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:active {
	background: var(--global-palette7) !important;
	border-color: var(--global-palette7) !important;
	color: var(--global-palette1) !important;
}
/* po kliknięciu (focus myszą) nie zostawiamy „wciśniętego” stanu */
.wp-block-button.is-style-outline.kl-on-dark > .wp-block-button__link:focus:not(:focus-visible):not(:hover) {
	background: transparent !important;
	color: var(--global-palette9) !important;
}

/* Stopka: kolumny wyrównane do góry */
.site-footer .site-middle-footer-inner-wrap { align-items: start; }
.site-footer .kl-footer-logo img { max-width: 100%; }


/* ===== Rodzaje oferty (2026-10-17) ===== */
/* Kafelki na stronie głównej */
.kl-cat-grid { margin-top: 2.5rem; }
.kl-cat-grid > .wp-block-group__inner-container, .kl-cat-grid:not(:has(> .wp-block-group__inner-container)) { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.kl-cat-tile > .wp-block-group__inner-container { display: flex; flex-direction: column; height: 100%; }
.kl-cat-tile { background: var(--global-palette9); border: 1px solid rgba(176, 141, 87, 0.3); border-radius: 4px; overflow: hidden; display: flex; flex-direction: column; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.kl-cat-tile:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(31, 58, 46, 0.14); }
.kl-cat-tile .kl-cat-img { margin: 0; }
.kl-cat-tile .kl-cat-img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; transition: transform 0.5s ease; }
.kl-cat-tile:hover .kl-cat-img img { transform: scale(1.04); }
.kl-cat-tile .kl-cat-img a { display: block; overflow: hidden; }
.kl-cat-tile h3 { font-size: 1.35rem; margin: 1rem 1.1rem 0.3rem; }
.kl-cat-tile h3 a { color: var(--global-palette3); text-decoration: none; }
.kl-cat-tile h3 a:hover { color: var(--global-palette2); }
.kl-cat-tile p { margin: 0 1.1rem 1.2rem; font-size: 0.95rem; }
@media (max-width: 1024px) { .kl-cat-grid > .wp-block-group__inner-container, .kl-cat-grid:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .kl-cat-grid > .wp-block-group__inner-container, .kl-cat-grid:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .kl-cat-tile h3 { font-size: 1.15rem; margin: 0.8rem 0.8rem 0.2rem; } .kl-cat-tile p { margin: 0 0.8rem 0.9rem; font-size: 0.88rem; } }

/* Oferta: zdjęcie w całości (bez przycinania) */
.kl-photo-natural { margin: 0; }
.kl-photo-natural img { width: 100%; height: auto; border-radius: 4px; box-shadow: 0 16px 40px rgba(31, 58, 46, 0.18); }

/* Kotwice pod przyklejonym nagłówkiem */
.kl-offer[id], .kl-gal-section[id] { scroll-margin-top: 90px; }
html { scroll-behavior: smooth; }

/* Galeria: przyciski-skróty do rodzajów */
.kl-catnav { margin-top: 1.8rem; gap: 10px; }
.kl-catnav .wp-block-button__link { padding: 10px 18px; font-size: 12px; }
.kl-gal-section h2 { margin-bottom: 0.4rem; }
.kl-gal-section .kl-gallery { margin-top: 2rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .kl-cat-tile, .kl-cat-tile img { transition: none !important; } }
/* kafelki: bez odstępów blokowych WP między elementami siatki */
.kl-cat-grid > .wp-block-group__inner-container > .kl-cat-tile { margin: 0 !important; }
.kl-cat-tile > .wp-block-group__inner-container > * { margin-block-start: 0; }
