/*
 * Legacy preset bridge for Gutenberg content created before TT5 migration.
 * Keeps content editable while normalizing missing preset tokens/classes.
 */
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;500;700&display=swap");

:root {
	/* Spacing aliases used in older content. */
	--wp--preset--spacing--xs: var(--wp--preset--spacing--30, 0.75rem);
	--wp--preset--spacing--s: var(--wp--preset--spacing--40, 1rem);
	--wp--preset--spacing--m: var(--wp--preset--spacing--50, 1.5rem);
	--wp--preset--spacing--l: var(--wp--preset--spacing--60, 2rem);
	--wp--preset--spacing--xl: var(--wp--preset--spacing--70, 3rem);
	--wp--preset--spacing--content: var(--wp--preset--spacing--50, 1.5rem);

	/* Font-size aliases used in older content. */
	--wp--preset--font-size--s: var(--wp--preset--font-size--small, 0.9rem);
	--wp--preset--font-size--l: var(--wp--preset--font-size--large, 1.5rem);
	--wp--preset--font-size--xl: var(--wp--preset--font-size--x-large, 2rem);
	--wp--preset--font-size--big: clamp(2rem, 4vw, 3.5rem);
	--wp--preset--font-size--h-2: clamp(1.75rem, 3vw, 2.75rem);
}

/* Clean TT5 baseline (frontend + editor) while keeping blocks editable. */
body,
.editor-styles-wrapper {
	color: var(--wp--preset--color--contrast, #1f2937);
	font-size: 16px;
	line-height: 1.6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.2;
	letter-spacing: -0.01em;
}

a {
	text-underline-offset: 0.14em;
}

.wp-block-group.has-background,
.wp-block-cover {
	border-radius: 0;
}

/* Fallback styling for legacy Gutenberg buttons without explicit color classes. */
.wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline) {
	background-color: var(--wp--preset--color--contrast, #111827);
	color: var(--wp--preset--color--base, #ffffff);
	border: 1px solid var(--wp--preset--color--contrast, #111827);
	padding: 0.75em 1.4em;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):hover,
.wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):focus {
	background-color: #ffffff;
	color: var(--wp--preset--color--contrast, #111827);
	border-color: var(--wp--preset--color--contrast, #111827);
}

/* In dark sections (hero/cover), flip fallback button to light for contrast. */
.has-black-background-color .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline),
.wp-block-cover .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline) {
	background-color: #ffffff;
	color: #111827;
	border-color: #ffffff;
}

.has-black-background-color .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):hover,
.has-black-background-color .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):focus,
.wp-block-cover .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):hover,
.wp-block-cover .wp-block-button .wp-block-button__link.wp-element-button:not(.has-background):not(.is-style-outline):focus {
	background-color: transparent;
	color: #ffffff;
	border-color: #ffffff;
}

.has-s-font-size {
	font-size: var(--wp--preset--font-size--s) !important;
}

.has-l-font-size {
	font-size: var(--wp--preset--font-size--l) !important;
}

.has-xl-font-size {
	font-size: var(--wp--preset--font-size--xl) !important;
}

.has-big-font-size {
	font-size: var(--wp--preset--font-size--big) !important;
}

.has-h-2-font-size {
	font-size: var(--wp--preset--font-size--h-2) !important;
}

/* Gentle fallback for legacy cover style name. */
.wp-block-cover.is-style-zoom-out .wp-block-cover__video-background,
.wp-block-cover.is-style-zoom-out .wp-block-cover__image-background {
	transform: scale(1.05);
	transform-origin: center center;
}

/* Improve readability for old text clip style variant on light backgrounds. */
.is-style-text-background-clip {
	-webkit-text-fill-color: currentColor;
}

/* --------------------------------------------- */
/* Astra focused polish (home + pricing pages).  */
/* --------------------------------------------- */

/* Menu look inspired by dev branch main site + glass/blur header. */
body #masthead .ast-primary-header-bar {
	background: linear-gradient(180deg, rgba(7, 11, 22, 0.74), rgba(7, 11, 22, 0.16)) !important;
	border-bottom-color: rgba(24, 220, 255, 0.28) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

/* Non-home pages: use solid dark header background. */
body.page:not(.page-id-9) #masthead .ast-primary-header-bar {
	background: #070b16 !important;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

body #masthead .site-title a,
body #masthead .ast-mobile-menu-trigger-minimal {
	color: #ffffff !important;
}

body #masthead .custom-logo {
	filter: brightness(0) invert(1);
}

/*
 * Why this exists:
 * When the GTranslate floating widget is visually moved into Astra's header, default
 * stacking/overflow rules can block clicks or hide the language list behind header layers.
 * These rules keep the switcher interactive and visible on desktop and mobile.
 */
/* Docked GTranslate switcher inside header right section. */
#masthead .site-header-primary-section-right,
#masthead .site-header-primary-section-right .ast-builder-layout-element {
	overflow: visible !important;
}

#masthead #gt_float_wrapper.swp-gt-docked {
	position: relative !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	bottom: auto !important;
	transform: none !important;
	z-index: 1200 !important;
	display: inline-flex !important;
	align-items: center;
	pointer-events: auto !important;
	overflow: visible !important;
}

#masthead #gt_float_wrapper.swp-gt-docked * {
	pointer-events: auto !important;
}

#masthead #gt_float_wrapper.swp-gt-docked .gt_float_switcher {
	background: rgba(255, 255, 255, 0.08) !important;
	border: 1px solid rgba(255, 255, 255, 0.32) !important;
	border-radius: 10px !important;
	box-shadow: none !important;
}

#masthead #gt_float_wrapper.swp-gt-docked .gt-selected .gt-current-lang {
	color: #f8fafc !important;
	font-weight: 700 !important;
}

#masthead #gt_float_wrapper.swp-gt-docked .gt_options {
	background: #0b1324 !important;
	border: 1px solid rgba(255, 255, 255, 0.18) !important;
	z-index: 1201 !important;
}

#masthead #gt_float_wrapper.swp-gt-docked .gt_options a {
	color: #f8fafc !important;
}

#masthead #gt_float_wrapper.swp-gt-docked .gt_options a:hover {
	background: rgba(255, 216, 107, 0.12) !important;
	color: #ffe28c !important;
}

@media (max-width: 921px) {
	#masthead #gt_float_wrapper.swp-gt-docked {
		margin-left: 0.35rem !important;
	}

	#masthead #gt_float_wrapper.swp-gt-docked .gt_float_switcher {
		background: rgba(7, 11, 22, 0.76) !important;
		border-color: rgba(255, 255, 255, 0.35) !important;
	}
}

@media (min-width: 922px) {
	body #masthead .main-header-menu > .menu-item > .menu-link {
		color: #f8fafc !important;
		font-size: clamp(0.98rem, 1vw, 1.06rem) !important;
		font-weight: 700 !important;
		letter-spacing: 0.015em;
		text-transform: capitalize !important;
		line-height: 1.25;
		padding-top: 0.5rem !important;
		padding-bottom: 0.5rem !important;
		text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
		transition: color 0.2s ease, background-color 0.2s ease;
	}

	body #masthead .main-header-menu > .menu-item.current-menu-item > .menu-link {
		color: #ffd86b !important;
		box-shadow: inset 0 -2px 0 #ffd86b;
	}

	body #masthead .main-header-menu > .menu-item > .menu-link:hover {
		color: #ffe28c !important;
		background: rgba(255, 216, 107, 0.08);
		border-radius: 999px;
	}

	body #masthead .main-header-menu > .swp-social-menu-item > .menu-link {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding-left: 0.48rem !important;
		padding-right: 0.48rem !important;
	}

	body #masthead .main-header-menu > .swp-social-menu-item svg {
		width: 17px;
		height: 17px;
		fill: currentColor;
		display: block;
	}
}

@media (max-width: 921px) {
	/* Mobile menu open trigger button. */
	body #masthead .ast-mobile-menu-trigger-minimal {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 42px;
		min-height: 42px;
		padding: 0.35rem !important;
		border: 1px solid rgba(255, 255, 255, 0.35);
		border-radius: 10px;
		background: rgba(7, 11, 22, 0.7);
		color: #ffffff !important;
	}

	/* Mobile popup panel and close button. */
	body .ast-mobile-popup-drawer .ast-mobile-popup-inner {
		background: #070b16 !important;
	}

	body .ast-mobile-popup-drawer .menu-toggle-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 42px;
		min-height: 42px;
		border: 1px solid rgba(255, 255, 255, 0.32);
		border-radius: 10px;
		background: rgba(255, 255, 255, 0.06);
		color: #ffffff !important;
	}

	/* Mobile menu list colors and readability. */
	body .ast-mobile-popup-drawer .main-header-menu,
	body .ast-mobile-popup-drawer .main-header-menu .sub-menu {
		background: #070b16 !important;
	}

	body .ast-mobile-popup-drawer .main-header-menu .menu-link,
	body .ast-mobile-popup-drawer .main-header-menu .ast-menu-toggle {
		color: #f8fafc !important;
		font-size: 1.02rem !important;
		font-weight: 700 !important;
		text-transform: capitalize !important;
	}

	body .ast-mobile-popup-drawer .main-header-menu .menu-link:hover,
	body .ast-mobile-popup-drawer .main-header-menu .menu-item.current-menu-item > .menu-link,
	body .ast-mobile-popup-drawer .main-header-menu .menu-item.current-menu-ancestor > .menu-link {
		color: #ffd86b !important;
		background: rgba(255, 216, 107, 0.1) !important;
	}
}

/* Keep home hero header as overlay, but with same dev-inspired style language. */
body.page-id-9 #masthead {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 40;
}

/* Footer social icons added next to copyright text. */
#colophon,
#colophon .site-primary-footer-wrap,
#colophon .site-below-footer-wrap,
#colophon .ast-builder-grid-row-container {
	background: #070b16 !important;
}

#colophon,
#colophon p,
#colophon .ast-footer-copyright,
#colophon a {
	color: #e5edf8 !important;
}

.ast-footer-copyright .swp-footer-social {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	margin: 0.35rem 0 0;
}

.ast-footer-copyright .swp-footer-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #18dcff;
	transition: color 0.2s ease;
}

.ast-footer-copyright .swp-footer-social a:hover {
	color: #88efff;
}

.ast-footer-copyright .swp-footer-social svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
	display: block;
}

/* 2) Remove duplicated page title generated by Astra on static pages. */
body.page .site-main article > .entry-header {
	display: none;
}

/* Keep first hero section flush with overlay header. */
@media (min-width: 1200px) {
	body.page-id-9.ast-plain-container.ast-no-sidebar #primary {
		margin-top: 0 !important;
	}
}

/* 3) Improve section hierarchy: hide redundant "Main" and tune "Process explained". */
body.page-id-9 #post-9 .wp-block-post-title {
	display: none !important;
}

body.page-id-9 #post-9 h2.has-l-font-size {
	font-size: clamp(1.7rem, 2.8vw, 2.5rem) !important;
	letter-spacing: 0.02em;
	text-transform: uppercase !important;
	font-weight: 700 !important;
	color: #0f172a;
	text-align: left !important;
	margin-left: 0 !important;
	margin-right: auto !important;
}

body.page-id-9 #post-9 .has-h-2-font-size {
	font-size: clamp(1.3rem, 2.1vw, 2rem) !important;
	line-height: 1.2 !important;
	color: #0f172a;
	text-align: left !important;
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* Match dev branch hero typography for the main headline line. */
body.page-id-9 #post-9 p.is-style-text-background-clip.has-big-font-size {
	font-family: "Roboto Condensed", "Arial Narrow", sans-serif !important;
	font-weight: 500 !important;
	letter-spacing: 0.01em !important;
	line-height: 1.02 !important;
}

/* Ensure the Process section subtitle never inherits centered/right alignment. */
body.page-id-9 #post-9 h2.has-l-font-size + p {
	text-align: left !important;
	margin-left: 0 !important;
	margin-right: auto !important;
	max-width: 100% !important;
}

/* 4) Better process cards styling. */
body.page-id-9 #post-9 .wp-block-column[style*="border-width:2px"] {
	box-sizing: border-box;
	min-width: 0 !important;
	width: 100% !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 18px;
	background: #ffffff;
	box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07);
	padding: 1.35rem !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Force equal-width 3-up rows for Process cards on desktop. */
@media (min-width: 922px) {
	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide,
	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide + .wp-block-columns.alignwide,
	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide + .wp-block-columns.alignwide + .wp-block-columns.alignwide {
		width: min(100% - 2rem, var(--wp--style--global--wide-size, 1200px)) !important;
		max-width: min(100% - 2rem, var(--wp--style--global--wide-size, 1200px)) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--wp--style--block-gap, 1.5rem);
	}

	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide > .wp-block-column[style*="border-width:2px"],
	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide + .wp-block-columns.alignwide > .wp-block-column[style*="border-width:2px"],
	body.page-id-9 #post-9 h2.has-l-font-size + p + .wp-block-columns.alignwide + .wp-block-columns.alignwide + .wp-block-columns.alignwide > .wp-block-column[style*="border-width:2px"] {
		max-width: none !important;
		margin: 0 !important;
		flex: none !important;
	}
}

body.page-id-9 #post-9 .wp-block-column[style*="border-width:2px"]:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 42px rgba(15, 23, 42, 0.12);
}

body.page-id-9 #post-9 .wp-block-column[style*="border-width:2px"] h3 {
	font-size: clamp(1.1rem, 1.7vw, 1.35rem) !important;
	line-height: 1.25 !important;
	margin-bottom: 0.55rem;
}

body.page-id-9 #post-9 .wp-block-column[style*="border-width:2px"] p {
	color: #475569;
	font-size: 0.98rem;
}

body.page-id-9 #post-9 .wp-block-column[style*="border-width:2px"] .has-base-alt-background-color {
	background: linear-gradient(145deg, #ffe28c 0%, #f4c64f 46%, #d79b2e 100%) !important;
	border: 1px solid #b6801f;
	box-shadow:
		0 8px 18px rgba(215, 155, 46, 0.3),
		inset 0 1px 0 rgba(255, 248, 220, 0.5);
}

/* 5) Better CTA buttons on home and pricing pages. */
body.page-id-9 .wp-block-button .wp-block-button__link,
body.page-id-340 .wp-block-button .wp-block-button__link {
	border-radius: 999px !important;
	padding: 0.82em 1.5em !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em;
	background: linear-gradient(145deg, #ffd86b 0%, #f4c64f 46%, #d79b2e 100%) !important;
	color: #2f1f00 !important;
	border: 1px solid #b6801f !important;
	box-shadow:
		0 10px 24px rgba(215, 155, 46, 0.42),
		inset 0 1px 0 rgba(255, 248, 220, 0.55);
}

body.page-id-9 .wp-block-button .wp-block-button__link:hover,
body.page-id-340 .wp-block-button .wp-block-button__link:hover {
	transform: translateY(-1px);
	background: linear-gradient(145deg, #ffe28c 0%, #f8d46a 48%, #dfaa3f 100%) !important;
	color: #241700 !important;
	border-color: #a86f17 !important;
}

/* Emphasize primary CTAs on main page. */
body.page-id-9 a.wp-block-button__link[href="https://app.wlasnasprawa.com/"],
body.page-id-9 a.wp-block-button__link[href="https://app.wlasnasprawa.com/signup"] {
	font-size: clamp(1.05rem, 1.4vw, 1.22rem) !important;
	font-weight: 800 !important;
	padding: 1em 2.05em !important;
	min-height: 54px;
}

/* Add visual breathing room after the hero CTA block on homepage. */
body.page-id-9 #post-9 .wp-block-cover .wp-block-buttons {
	margin-bottom: var(--wp--preset--spacing--content, 1.5rem);
}

/* 6) Premium-style Prices cards (Astra compatible, Gutenberg editable). */
body.page-id-340 #post-340 > .entry-header {
	display: none;
}

body.page-id-340 #post-340 .wp-block-columns.is-style-mobile-reverse {
	gap: clamp(1rem, 2.2vw, 1.8rem) !important;
}

body.page-id-340 #post-340 .wp-block-columns.is-style-mobile-reverse > .wp-block-column {
	position: relative;
	border-radius: 22px !important;
	overflow: hidden;
	border: 1px solid #d7deec;
	background: linear-gradient(160deg, #ffffff 0%, #f8faff 100%);
	box-shadow:
		0 22px 46px rgba(15, 23, 42, 0.12),
		0 2px 8px rgba(15, 23, 42, 0.05);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.page-id-340 #post-340 .wp-block-cover {
	background-color: transparent !important;
}

body.page-id-340 #post-340 .wp-block-columns.is-style-mobile-reverse > .wp-block-column:hover {
	transform: translateY(-4px);
	box-shadow:
		0 28px 56px rgba(15, 23, 42, 0.16),
		0 4px 12px rgba(15, 23, 42, 0.07);
}

body.page-id-340 #post-340 .wp-block-cover__image-background.wp-image-53 {
	background-image: url("/wp-content/uploads/2026/05/geometric-pattern.gif") !important;
	background-size: cover !important;
	background-repeat: repeat !important;
	background-position: 50% 50% !important;
}

body.page-id-340 #post-340 .wp-block-cover__background.has-background-gradient {
	background: linear-gradient(90deg, #fcfcfc 60%, rgba(0, 0, 0, 0) 100%) !important;
}

body.page-id-340 #post-340 .wp-block-cover__inner-container {
	padding: clamp(1rem, 2vw, 1.4rem);
}

body.page-id-340 #post-340 .wp-image-7 {
	width: 88px !important;
	height: 88px !important;
	padding: 0;
	border-radius: 0;
	object-fit: contain;
	background: transparent;
	border: 0;
	box-shadow: none;
}

body.page-id-340 #post-340 h3.has-xl-font-size {
	font-size: clamp(1.4rem, 2.1vw, 1.95rem) !important;
	font-weight: 800 !important;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #10213f;
}

body.page-id-340 #post-340 .wp-block-list.is-style-list-checkmark {
	margin-top: 0.6rem;
	margin-bottom: 0.75rem;
	padding-left: 1.1rem;
}

body.page-id-340 #post-340 .wp-block-list.is-style-list-checkmark li {
	color: #334155;
	font-size: 0.99rem;
	line-height: 1.5;
	margin-bottom: 0.35rem;
}

body.page-id-340 #post-340 .has-h-2-font-size {
	font-size: clamp(2rem, 3.4vw, 2.65rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.015em;
	color: #111827;
}

body.page-id-340 #post-340 p.has-s-font-size {
	font-size: 0.9rem !important;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #6b7280;
}


/* Keep outline action in free plan visually intentional. */
body.page-id-340 #post-340 .wp-block-button.is-style-outline .wp-block-button__link {
	background: #ffffff !important;
	color: #8b5c12 !important;
	border: 1px solid #c89a3c !important;
	box-shadow: 0 6px 18px rgba(192, 139, 40, 0.16);
}

body.page-id-340 #post-340 .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #fff4cf !important;
	border-color: #ad761d !important;
	color: #5f3f09 !important;
}

body.page-id-340 #post-340 > .wp-block-group > p:last-child {
	max-width: 76ch;
	margin-inline: auto;
	color: #475569;
	font-size: 0.95rem;
}
