/* Odbiory Mieszkań Wrocław — wspólne elementy (header, menu, stopka, blog). Prefiks wr-. 2026-10 */
:root {
	--wr-violet: #5B3E96;
	--wr-violet-2: #8A70B8;
	--wr-coral: #E77B5B;
	--wr-lilac: #E4DDF2;
	--wr-mist: #F8F6FC;
	--wr-deep: #3E2A69;
	--wr-ink: #231A38;
	--wr-ink-2: #4B4360;
	--wr-line: #D9D0EC;
	--wr-hd-h: 99px;
	--wr-font-h: "Sora", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--wr-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
html { scroll-padding-top: calc(var(--wr-hd-h) + 12px); }
body { background: #fff; }

/* skip link */
.wr-skip { position: absolute; left: 12px; top: -60px; z-index: 2000; background: var(--wr-ink); color: #fff !important; font: 600 15px/1 var(--wr-font); padding: 12px 16px; border-radius: 10px; text-decoration: none; }
.wr-skip:focus { top: 12px; outline: 3px solid var(--wr-coral); outline-offset: 2px; }
.wr-main-anchor { display: block; height: 0; outline: none; }

/* przyciski */
.wr-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 44px; padding: .65em 1.25em; border-radius: 12px; border: 2px solid transparent; font: 600 15px/1.2 var(--wr-font); text-decoration: none !important; cursor: pointer; transition: background-color .18s, color .18s, border-color .18s, box-shadow .18s; white-space: nowrap; }
.wr-btn svg { width: 18px; height: 18px; flex: none; }
.wr-btn--coral { background: var(--wr-coral); color: var(--wr-ink) !important; border-color: var(--wr-coral); }
.wr-btn--coral:hover { background: #F0947A; border-color: #F0947A; color: var(--wr-ink) !important; }
.wr-btn--coral:active { background: #D9694A; border-color: #D9694A; }
.wr-btn--violet { background: var(--wr-violet); color: #fff !important; border-color: var(--wr-violet); }
.wr-btn--violet:hover { background: var(--wr-deep); border-color: var(--wr-deep); color: #fff !important; }
.wr-btn--line { background: #fff; color: var(--wr-violet) !important; border-color: var(--wr-violet); }
.wr-btn--line:hover { background: var(--wr-lilac); color: var(--wr-deep) !important; }
.wr-btn--line:active, .wr-btn--violet:active { transform: translateY(1px); }
.wr-btn:focus-visible, .wr-hd a:focus-visible, .wr-hd button:focus-visible, .wr-ft a:focus-visible { outline: 3px solid var(--wr-coral); outline-offset: 3px; box-shadow: 0 0 0 6px rgba(231,123,91,.18); }

/* ---------- HEADER ---------- */
.wr-hd { position: sticky; top: 0; z-index: 1030; background: rgba(255,255,255,.97); border-bottom: 1px solid var(--wr-line); font-family: var(--wr-font); }
.wr-hd::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: linear-gradient(90deg, var(--wr-violet) 0 62%, var(--wr-violet-2) 62% 86%, var(--wr-coral) 86% 100%); }
.wr-hd__bar { max-width: 1320px; margin: 0 auto; padding: 9px 24px; display: flex; align-items: center; gap: 20px; min-height: 98px; }
.wr-hd__logo { display: inline-flex; align-items: center; flex: 0 0 auto; border-radius: 8px; }
.wr-hd__logo img { display: block; height: 80px; width: auto; max-width: none; }
.wr-nav { display: flex; align-items: center; gap: 20px; margin-left: auto; }
.wr-nav__list { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.wr-nav__list li { margin: 0; padding: 0; font-size: 15px; }
.wr-hd .wr-nav__link { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; font: 500 15px/1 var(--wr-font); color: var(--wr-ink); text-decoration: none; border-radius: 10px; }
.wr-hd .wr-nav__link::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 8px; height: 2px; background: var(--wr-coral); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.wr-hd .wr-nav__link:hover { color: var(--wr-violet); text-decoration: none; }
.wr-hd .wr-nav__link:hover::after, .wr-hd .wr-nav__link[aria-current="page"]::after { transform: scaleX(1); }
.wr-nav__cta { display: flex; align-items: center; gap: 10px; }
.wr-nav__tel { display: none; }
.wr-hd__tel { display: none; }
.wr-hd__toggle { display: none; }

@media (max-width: 1179px) {
	:root { --wr-hd-h: 68px; }
	.wr-hd__bar { min-height: 68px; padding: 8px 16px; gap: 10px; }
	.wr-hd__logo img { height: 50px; }
	.wr-hd__tel { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; min-height: 44px; padding: 0 12px; border-radius: 12px; background: var(--wr-lilac); color: var(--wr-deep); font: 600 14px/1 var(--wr-font); text-decoration: none; white-space: nowrap; }
	.wr-hd__tel svg { width: 16px; height: 16px; flex: none; }
	.wr-hd__tel:hover { color: var(--wr-violet); text-decoration: none; background: #D8CEEE; }
	.wr-hd__toggle { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; flex: 0 0 46px; padding: 0; border: 2px solid var(--wr-violet); border-radius: 12px; background: #fff; color: var(--wr-violet); cursor: pointer; }
	.wr-hd__toggle svg { width: 22px; height: 22px; }
	.wr-hd__toggle .wr-ico-close { display: none; }
	.wr-hd.is-open .wr-hd__toggle { background: var(--wr-violet); color: #fff; }
	.wr-hd.is-open .wr-hd__toggle .wr-ico-open { display: none; }
	.wr-hd.is-open .wr-hd__toggle .wr-ico-close { display: block; }
	.wr-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; margin: 0; padding: 14px 16px 104px; background: #fff; border-bottom: 3px solid var(--wr-violet); box-shadow: 0 18px 40px rgba(35,26,56,.18); max-height: calc(100vh - var(--wr-hd-h)); max-height: calc(100dvh - var(--wr-hd-h)); overflow-y: auto; flex-direction: column; align-items: stretch; gap: 14px; }
	.wr-hd.is-open .wr-nav { display: flex; }
	.wr-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.wr-nav__list li { border-bottom: 1px solid var(--wr-lilac); }
	.wr-hd .wr-nav__link { display: flex; min-height: 50px; padding: 0 6px; font-size: 17px; }
	.wr-hd .wr-nav__link::after { display: none; }
	.wr-nav__cta { flex-direction: column; align-items: stretch; }
	.wr-nav__tel { display: inline-flex; }
	.wr-nav__dc { display: none; }
	.wr-nav__cta .wr-btn { width: auto; min-height: 50px; font-size: 16px; }
}
@media (max-width: 359px) {
	.wr-hd__bar { padding: 8px 12px; gap: 8px; }
	.wr-hd__logo img { height: 46px; }
	.wr-hd__tel { padding: 0 10px; font-size: 13px; }
}

/* ---------- FOOTER ---------- */
.wr-ft { background: var(--wr-deep); color: #fff; font-family: var(--wr-font); position: relative; overflow: hidden; }
.wr-ft::before { content: ""; position: absolute; right: -120px; top: -140px; width: 520px; height: 520px; background: linear-gradient(135deg, rgba(138,112,184,.35), rgba(138,112,184,0) 70%); transform: rotate(45deg) skew(-8deg, -8deg); border-radius: 32px; pointer-events: none; }
.wr-ft__inner { position: relative; max-width: 1200px; margin: 0 auto; padding: 56px 24px 40px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.wr-ft__plate { display: inline-flex; background: #fff; border-radius: 18px; padding: 14px 18px; box-shadow: 0 0 0 4px rgba(231,123,91,.9); }
.wr-ft__plate img { display: block; height: 84px; width: auto; max-width: none; }
.wr-ft__nav { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.wr-ft .wr-ft__nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; color: #fff; font: 500 14px/1 var(--wr-font); text-decoration: none; }
.wr-ft .wr-ft__nav a:hover { background: rgba(255,255,255,.1); border-color: var(--wr-coral); text-decoration: none; }
.wr-ft h3.wr-ft__h { margin: 0 0 18px; font: 700 13px/1.2 var(--wr-font-h); letter-spacing: .16em; text-transform: uppercase; color: #fff; display: flex; align-items: center; gap: 10px; }
.wr-ft h3.wr-ft__h::before { content: ""; width: 22px; height: 3px; background: var(--wr-coral); border-radius: 2px; }
.wr-ft__rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.wr-ft__rows li { display: flex; align-items: center; gap: 16px; padding: 14px 16px; border-radius: 16px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); font: 500 18px/1.35 var(--wr-font); color: #fff; min-width: 0; }
.wr-ft__ico { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; background: var(--wr-coral); color: var(--wr-ink); display: inline-flex; align-items: center; justify-content: center; }
.wr-ft__ico svg { width: 20px; height: 20px; }
.wr-ft .wr-ft__rows a, .wr-ft .wr-ft__rows span.wr-ft__val { color: #fff; font: 600 18px/1.35 var(--wr-font); text-decoration: none; overflow-wrap: anywhere; min-width: 0; }
.wr-ft .wr-ft__rows a:hover { text-decoration: underline; text-decoration-color: var(--wr-coral); text-underline-offset: 4px; }
.wr-ft__legal { position: relative; border-top: 1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.14); }
.wr-ft__legal p { max-width: 1200px; margin: 0 auto; padding: 18px 24px 22px; font: 400 14px/1.6 var(--wr-font); color: rgba(255,255,255,.86); text-align: left; }
.wr-ft .wr-ft__legal a { color: #fff; font: 600 14px/1.6 var(--wr-font); text-decoration: underline; text-underline-offset: 3px; }
.wr-ft .wr-ft__legal a:hover { text-decoration-color: var(--wr-coral); }
@media (max-width: 900px) {
	.wr-ft__inner { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 40px 16px 32px; }
	.wr-ft__legal p { padding: 16px 16px 96px; }
	.wr-ft__rows li, .wr-ft .wr-ft__rows a, .wr-ft .wr-ft__rows span.wr-ft__val { font-size: 16px; }
	.wr-ft__plate img { height: 72px; }
}

/* ---------- BLOG ---------- */
.wr-blog { background: var(--wr-mist); font-family: var(--wr-font); padding: 48px 0 88px; min-height: 50vh; }
.wr-blog__wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.wr-blog__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 20px; padding-bottom: 22px; margin-bottom: 30px; border-bottom: 2px solid var(--wr-lilac); position: relative; }
.wr-blog__head::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 72px; height: 2px; background: var(--wr-coral); }
.wr-blog h1.wr-blog__h1 { margin: 0; font: 700 clamp(2.2rem, 5vw, 3.4rem)/1.05 var(--wr-font-h); color: var(--wr-ink); letter-spacing: -.02em; }
.wr-blog p.wr-blog__lead { margin: 0; font: 400 1.05rem/1.5 var(--wr-font); color: var(--wr-ink-2); }
.wr-blog__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.wr-blog__grid > li { margin: 0; padding: 0; font-size: 1rem; }
.wr-card { display: grid; grid-template-columns: 200px minmax(0, 1fr); height: 100%; background: #fff; border: 1px solid var(--wr-line); border-radius: 18px; overflow: hidden; color: var(--wr-ink) !important; text-decoration: none !important; position: relative; transition: border-color .18s, box-shadow .18s, transform .18s; }
.wr-card:hover { border-color: var(--wr-violet-2); box-shadow: 0 14px 30px rgba(91,62,150,.14); }
.wr-card:focus-visible { outline: 3px solid var(--wr-coral); outline-offset: 3px; }
.wr-card__img { position: relative; background: var(--wr-lilac); min-height: 170px; }
.wr-card__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wr-card__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.wr-card__title { margin: 0; font: 600 1.12rem/1.35 var(--wr-font-h); color: var(--wr-ink); }
.wr-card__desc { margin: 0; font: 400 .95rem/1.55 var(--wr-font); color: var(--wr-ink-2); }
.wr-card__go { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; font: 600 .9rem/1 var(--wr-font); color: var(--wr-violet); }
.wr-card__go::before { content: ""; width: 18px; height: 2px; background: var(--wr-coral); transition: width .18s; }
.wr-card:hover .wr-card__go::before { width: 30px; }
.wr-blog__empty { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px; align-items: center; max-width: 760px; padding: 26px 28px; background: #fff; border: 1px dashed var(--wr-violet-2); border-radius: 18px; }
.wr-blog__empty svg { width: 54px; height: 54px; }
.wr-blog__empty p { margin: 0; font: 400 1.02rem/1.6 var(--wr-font); color: var(--wr-ink-2); }
.wr-blog__empty p strong { font-weight: 600; color: var(--wr-ink); }
.wr-blog__empty a { color: var(--wr-violet); font: 600 1.02rem/1.6 var(--wr-font); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 860px) {
	.wr-blog__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
	.wr-blog { padding: 32px 0 64px; }
	.wr-blog__wrap { padding: 0 16px; }
	.wr-card { grid-template-columns: minmax(0, 1fr); }
	.wr-card__img { min-height: 0; aspect-ratio: 16 / 9; }
	.wr-blog__empty { grid-template-columns: minmax(0, 1fr); padding: 22px 18px; }
}
@media (prefers-reduced-motion: reduce) {
	.wr-btn, .wr-card, .wr-card__go::before, .wr-hd .wr-nav__link::after { transition: none !important; }
}