/*
Theme Name:   Astra Child — Leasing360
Theme URI:    https://leasing360.pl
Description:  Motyw potomny Astry dla Leasing360. Zawiera tokeny kolorów, typografię (Sora + Inter) oraz korekty layoutu odwzorowujące prototyp.
Author:       Leasing360
Template:     astra
Version:      1.0.0
Text Domain:  astra-child-leasing360
*/

/* =========================================================================
   1. TOKENY — te same wartości co w kolorystyka/leasing360-tokens.css
   ========================================================================= */
:root {
	--l360-brand: #0C25EC;
	--l360-brand-600: #0A1FC4;
	--l360-brand-700: #08199E;
	--l360-brand-soft: #EAF6FF;
	--l360-accent: #DFF0FF;
	--l360-ink: #0A121F;
	--l360-muted: #545E6F;
	--l360-border: #DCE6F2;
	--l360-container: 1280px;

	--l360-font-display: 'Sora', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--l360-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* =========================================================================
   2. TYPOGRAFIA
   Prototyp: H1 Sora 700 / 60px / lh 1.05 / ls -1.2px ; body Inter 400 / 16px
   ========================================================================= */
body,
button, input, select, textarea {
	font-family: var(--l360-font-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--l360-muted);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
	font-family: var(--l360-font-display);
	color: var(--l360-ink);
	letter-spacing: -.02em;
}

h1, .entry-title {
	font-size: clamp(2.25rem, 1.4rem + 3.6vw, 3.75rem); /* 36px → 60px */
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.02em;
}

h2 {
	font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem);  /* 28px → 40px */
	font-weight: 700;
	line-height: 1.15;
}

h3 {
	font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem);  /* 18px → 22px */
	font-weight: 600;
	line-height: 1.35;
}

/* =========================================================================
   3. LINKI I PRZYCISKI
   ========================================================================= */
a { color: var(--l360-brand); text-decoration: none; }
a:hover, a:focus { color: var(--l360-brand-600); }

.ast-button,
.button,
button,
input[type="submit"],
.wp-block-button__link {
	border-radius: 14px;
	font-family: var(--l360-font-body);
	font-weight: 600;
	letter-spacing: 0;
	transition: background-color .2s cubic-bezier(.4,0,.2,1),
	            box-shadow .2s cubic-bezier(.4,0,.2,1),
	            transform .2s cubic-bezier(.4,0,.2,1);
}

/* =========================================================================
   4. LAYOUT — kontener 1280px jak max-w-7xl w prototypie
   ========================================================================= */
.ast-container,
.site-content .ast-container {
	max-width: var(--l360-container);
}

/* Strony budowane Elementorem nie potrzebują marginesu górnego Astry */
.elementor-page .site-content > .ast-container { padding-left: 0; padding-right: 0; max-width: 100%; }
.elementor-page .entry-content { margin-top: 0; }

/* =========================================================================
   5. NAGŁÓWEK — sticky + blur (odpowiednik `sticky top-0 backdrop-blur`)
   ========================================================================= */
.site-header,
.ast-main-header-wrap {
	position: sticky;
	top: 0;
	z-index: 999;
	background: rgba(255, 255, 255, .88);
	-webkit-backdrop-filter: blur(12px);
	        backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--l360-border);
	box-shadow: none;
}
.admin-bar .site-header,
.admin-bar .ast-main-header-wrap { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .site-header,
	.admin-bar .ast-main-header-wrap { top: 46px; }
}

/* Wysokość nagłówka: 64px mobile / 80px desktop */
.ast-primary-header-bar { min-height: 64px; }
@media (min-width: 922px) { .ast-primary-header-bar { min-height: 80px; } }

/* Menu: 14px / 500, kolor przygaszony, hover marka */
.main-header-menu > .menu-item > .menu-link {
	font-size: 14px;
	font-weight: 500;
	color: rgba(10, 18, 31, .8);
	transition: color .2s cubic-bezier(.4,0,.2,1);
}
.main-header-menu > .menu-item > .menu-link:hover,
.main-header-menu > .current-menu-item > .menu-link { color: var(--l360-brand); }

/* Animowane podkreślenie aktywnej / najechanej pozycji */
.main-header-menu > .menu-item > .menu-link { position: relative; }
.main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 0; bottom: 18px;
	width: 100%; height: 2px;
	border-radius: 2px;
	background: var(--l360-brand);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .2s cubic-bezier(.4,0,.2,1);
}
.main-header-menu > .menu-item > .menu-link:hover::after,
.main-header-menu > .current-menu-item > .menu-link::after,
.main-header-menu > .current-menu-ancestor > .menu-link::after { transform: scaleX(1); }

/* =========================================================================
   6. STOPKA
   ========================================================================= */
.site-footer,
.ast-small-footer,
.site-below-footer-wrap {
	background: var(--l360-brand-soft);
	border-top: 1px solid var(--l360-border);
	color: var(--l360-muted);
	font-size: 14px;
}
.site-footer a { color: var(--l360-muted); }
.site-footer a:hover { color: var(--l360-brand); }

/* =========================================================================
   7. BLOG (/wiedza) — karty wpisów w stylu prototypu
   ========================================================================= */
.blog .ast-article-post,
.archive .ast-article-post,
.search .ast-article-post {
	border: 1px solid var(--l360-border);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 4px 20px -8px rgba(17, 57, 215, .12);
	overflow: hidden;
	transition: transform .2s cubic-bezier(.4,0,.2,1),
	            box-shadow .2s cubic-bezier(.4,0,.2,1),
	            border-color .2s cubic-bezier(.4,0,.2,1);
}
.blog .ast-article-post:hover,
.archive .ast-article-post:hover {
	transform: translateY(-4px);
	border-color: var(--l360-brand);
	box-shadow: 0 10px 28px -12px rgba(12, 37, 236, .35);
}
.blog .ast-article-post .post-thumb img,
.archive .ast-article-post .post-thumb img { transition: transform .4s cubic-bezier(.4,0,.2,1); }
.blog .ast-article-post:hover .post-thumb img { transform: scale(1.04); }

.ast-blog-featured-section + .ast-blog-single-element .entry-title { font-size: 20px; }

/* Wpis pojedynczy — komfortowa szerokość czytania */
.single-post .entry-content > *:not(.alignwide):not(.alignfull) { max-width: 72ch; }
.single-post .entry-content { font-size: 17px; line-height: 1.75; }
.single-post .entry-content h2 { margin-top: 2em; }

/* =========================================================================
   8. DOSTĘPNOŚĆ
   ========================================================================= */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid rgba(12, 37, 236, .45);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}