/*
Theme Name: KRosik (Kadence Child)
Theme URI: https://krosik-jerzmanowa.pl
Description: Motyw potomny Kadence dla KRosik Jerzmanowa. Dogrywa samohostowane fonty Unbounded i Manrope (bez połączeń do Google Fonts) oraz globalne klasy efektu szkła (kr-glass, kr-glass-dark) używane w szablonach Elementor Pro, żeby działały na każdej nowej stronie bez wklejania CSS ręcznie.
Author: Tobiasz Silakowski
Template: kadence
Version: 1.0.0
Requires PHP: 7.4
Text Domain: krosik-kadence-child
*/
@import url('../kadence/style.css');


/* ---------------------------------------------------------
   Efekt szkła — te same klasy, które szablony Elementor Pro
   (nagłówek, strona główna, stopka) już mają wpisane we
   „Własnym CSS”. Trzymamy je też tutaj, globalnie, żeby każda
   NOWA strona/sekcja mogła użyć klasy kr-glass bez wklejania
   tego CSS od nowa.
   --------------------------------------------------------- */
.kr-glass {
	position: relative;
	-webkit-backdrop-filter: blur(22px) saturate(170%);
	backdrop-filter: blur(22px) saturate(170%);
}
.kr-glass::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	pointer-events: none;
	background: linear-gradient(145deg, #fff, rgba(255, 255, 255, .2) 30%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .08));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}
.kr-glass-dark::after {
	background: linear-gradient(145deg, rgba(255, 255, 255, .4), rgba(255, 255, 255, .05) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, .2));
}
.kr-btn-glass .elementor-button {
	-webkit-backdrop-filter: blur(14px) saturate(160%);
	backdrop-filter: blur(14px) saturate(160%);
}

/* Porządek typograficzny wewnątrz widżetów tekstowych. */
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.elementor-heading-title a { text-decoration: none; }

/* Widoczny fokus klawiatury — dostępność. */
.elementor-button:focus-visible,
.elementor-heading-title a:focus-visible,
.elementor-icon-list-item a:focus-visible {
	outline: 2px solid #000;
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.elementor-invisible { visibility: visible !important; }
	.animated { animation: none !important; }
}
