/* megarolety: style motywu (wartości z prototypów .dc.html, tokeny z tokens.css) */

:root {
  --mr-primary: #0b6fb8;
  --mr-primary-hover: #08527f;
  --mr-primary-bright: #1183d4;
  --mr-accent-on-dark: #8fd0ff;
  --mr-accent-footer: #5fb2e8;
  --mr-ink: #14181d;
  --mr-text: #3c4652;
  --mr-text-body: #454e59;
  --mr-muted: #5b6572;
  --mr-muted-2: #69737e;
  --mr-label: #232a32;
  --mr-bg: #ffffff;
  --mr-bg-soft: #f4f8fb;
  --mr-bg-icon: #eef5fb;
  --mr-bg-switch: #eef3f7;
  --mr-bg-image: #eef2f5;
  --mr-dark: #111a21;
  --mr-border: #e9edf1;
  --mr-border-input: #c9d3dc;
  --mr-border-btn: #cfd8e0;
  --mr-border-soft: #dde6ed;
  --mr-border-dark: #22303a;
  --mr-border-dark-2: #2a343d;
  --mr-footer-text: #c6ced7;
  --mr-footer-muted: #8f9aa6;
  --mr-error: #b42318;
  --mr-focus-ring: 0 0 0 4px rgba(11, 111, 184, 0.12);
  --mr-font: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --mr-radius-pill: 999px;
  --mr-radius-section: 32px;
  --mr-radius-image: 24px;
  --mr-radius-card: 20px;
  --mr-radius-sm: 12px;
  --mr-shadow-strip: 0 24px 54px rgba(17, 26, 33, 0.08);
  --mr-shadow-card-hover: 0 22px 44px rgba(17, 26, 33, 0.14);
  --mr-shadow-menu: 0 30px 60px rgba(17, 26, 33, 0.14);
  --mr-shadow-btn-hover: 0 12px 26px rgba(11, 111, 184, 0.32);
  --mr-shadow-header: 0 8px 30px rgba(17, 26, 33, 0.07);
  --mr-container: 1240px;
  --mr-section-y: clamp(80px, 10vw, 136px);
  --mr-gap-grid: clamp(14px, 2vw, 24px);
  --mr-ease: cubic-bezier(.2, .7, .2, 1);
  --mr-top: var(--wp-admin--admin-bar--height, 0px);
}

/* ---------- baza ---------- */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--mr-font);
  font-size: 16px;
  line-height: 1.55;
  color: var(--mr-ink);
  background: var(--mr-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-wrap: pretty;
}
a { color: var(--mr-primary); text-decoration: none; transition: color 250ms; }
a:hover { color: var(--mr-primary-hover); }
h1, h2, h3, h4, p { margin: 0; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font-family: inherit; }
:focus-visible { outline: 2px solid var(--mr-primary); outline-offset: 3px; }
[hidden] { display: none !important; }

.mr-page { width: 100%; overflow-x: hidden; overflow-x: clip; }
.mr-skip { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 12px; background: var(--mr-primary); color: #fff; }
.mr-skip:focus { top: 16px; color: #fff; }
.mr-wrap { max-width: var(--mr-container); margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; }

@keyframes mr-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes mr-pop { 0% { opacity: 0; transform: scale(.4); } 70% { transform: scale(1.12); } 100% { opacity: 1; transform: none; } }
@keyframes mr-draw { from { stroke-dashoffset: 30; } to { stroke-dashoffset: 0; } }
@keyframes mr-ring { 0% { transform: scale(.8); opacity: .5; } 100% { transform: scale(1.8); opacity: 0; } }
@keyframes mr-hero-zoom { from { transform: scale(1.02); } to { transform: scale(1.12); } }
@keyframes mr-cat-zoom { from { transform: scale(1.02); } to { transform: scale(1.1); } }
@keyframes mr-drop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes mr-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.mr-anim { animation: mr-rise 800ms var(--mr-ease) both; animation-delay: var(--d, 0ms); }

/* reveal przy scrollu (stany początkowe tylko z JS) */
.mr-js [data-reveal]:not([data-reveal="blind"]):not(.is-in) { opacity: 0; transform: translateY(24px); }
.mr-js [data-reveal].is-in { opacity: 1; transform: none; transition: opacity 800ms var(--mr-ease), transform 800ms var(--mr-ease); transition-delay: var(--rd, 0ms); }
.mr-js [data-reveal="blind"] { clip-path: inset(0 0 100% 0 round 28px); transition: clip-path 1300ms var(--mr-ease); }
.mr-js [data-reveal="blind"].is-in { clip-path: inset(0 0 0% 0 round 28px); transition-delay: var(--rd, 0ms); }

/* ---------- typografia ---------- */

.mr-eyebrow { font-size: 15px; font-weight: 600; color: var(--mr-primary); }
.mr-h1 { font-size: clamp(38px, 5vw, 64px); line-height: 1.03; font-weight: 600; letter-spacing: -0.028em; text-wrap: balance; }
.mr-h1--62 { font-size: clamp(38px, 5vw, 62px); }
.mr-h1--60 { font-size: clamp(38px, 5vw, 60px); line-height: 1.04; }
.mr-h1--product { font-size: clamp(36px, 4.4vw, 56px); line-height: 1.04; letter-spacing: -0.026em; }
.mr-h2 { font-size: clamp(30px, 3.8vw, 48px); line-height: 1.08; font-weight: 600; letter-spacing: -0.022em; text-wrap: balance; }
.mr-h2--42 { font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; letter-spacing: -0.02em; }
.mr-h3x { font-size: clamp(26px, 3vw, 38px); line-height: 1.1; font-weight: 600; letter-spacing: -0.02em; }
.mr-lead { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; color: var(--mr-text-body); max-width: 30em; }
.mr-lead--18 { font-size: 18px; line-height: 1.65; max-width: 32em; }

/* ---------- przyciski ---------- */

.mr-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 26px; border: 1px solid transparent; border-radius: var(--mr-radius-pill);
  font-size: 16px; font-weight: 600; line-height: 1.25; text-align: center; cursor: pointer;
  -webkit-appearance: none; appearance: none;
  transition: background 250ms, color 250ms, border-color 250ms, transform 250ms var(--mr-ease), box-shadow 250ms, gap 300ms var(--mr-ease);
}
.mr-btn:active { transform: scale(.98); }
.mr-btn--sm { padding: 12px 22px; font-size: 15px; }
.mr-btn--lg { padding: 16px 28px; }
.mr-btn--xl { min-height: 56px; padding: 0 24px; font-size: 17px; }
.mr-btn--block { display: flex; width: 100%; }
.mr-btn--grow { flex: 1 1 220px; }
.mr-btn--primary { background: var(--mr-primary); color: #fff; }
.mr-btn--primary:hover { background: var(--mr-primary-hover); color: #fff; transform: translateY(-2px); box-shadow: var(--mr-shadow-btn-hover); }
.mr-btn--primary.mr-btn--on-dark:hover { background: var(--mr-primary-bright); box-shadow: 0 14px 30px rgba(11, 111, 184, 0.45); }
.mr-btn--outline { background: #fff; border-color: var(--mr-border-btn); color: var(--mr-ink); }
.mr-btn--outline:hover { border-color: var(--mr-primary); color: var(--mr-primary); }
.mr-btn--xl.mr-btn--outline { font-size: 16px; border-color: var(--mr-border-input); }
.mr-btn--ghost { border-color: rgba(255, 255, 255, 0.5); color: #fff; background: transparent; }
.mr-btn--ghost:hover { background: rgba(255, 255, 255, 0.14); border-color: #fff; color: #fff; }
.mr-btn--icon { gap: 12px; padding: 14px 18px 14px 26px; }
.mr-btn--icon:hover { gap: 18px; }
.mr-btn__dot { display: flex; width: 30px; height: 30px; border-radius: 999px; background: var(--mr-primary); color: #fff; align-items: center; justify-content: center; }
.mr-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.mr-btns--center { justify-content: center; }

.mr-arrow-link { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 600; color: var(--mr-primary); transition: gap 300ms var(--mr-ease), color 250ms; }
.mr-arrow-link:hover { gap: 14px; color: var(--mr-primary-hover); }

/* ---------- nagłówek ---------- */

.mr-header {
  position: sticky; top: var(--mr-top); z-index: 50; isolation: isolate;
  border-bottom: 1px solid var(--mr-border);
  transition: box-shadow 400ms ease, border-color 400ms ease;
}
.mr-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); pointer-events: none; }
.mr-header.is-scrolled { border-bottom-color: transparent; box-shadow: var(--mr-shadow-header); }
.mr-header__bar { max-width: var(--mr-container); margin: 0 auto; padding: 18px 24px; display: flex; align-items: center; gap: 32px; transition: padding 400ms var(--mr-ease); }
.mr-header.is-scrolled .mr-header__bar { padding-top: 10px; padding-bottom: 10px; }
.mr-header__logo { display: flex; align-items: center; flex: 0 0 auto; }
.mr-header__logo img { height: 34px; width: auto; }
.mr-header__name { font-size: 22px; font-weight: 700; color: var(--mr-ink); }

.mr-nav { display: none; align-items: center; gap: 30px; flex: 1 1 auto; }
.mr-nav__item { display: flex; }
.mr-nav__link {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 0;
  font-size: 16px; font-weight: 500; color: var(--mr-text);
  background: linear-gradient(var(--mr-primary), var(--mr-primary)) left bottom / 0% 2px no-repeat;
  transition: background-size 350ms var(--mr-ease), color 250ms;
}
.mr-nav__link:hover { background-size: 100% 2px; color: var(--mr-ink); }
.mr-nav__link.is-active { color: var(--mr-primary); background-size: 100% 2px; }
.mr-nav__chev { color: #8ea6b8; transition: transform 300ms ease; }
.mr-nav__link[aria-expanded="true"] .mr-nav__chev { transform: rotate(180deg); }

.mr-header__cta { display: none; align-items: center; gap: 22px; flex: 0 0 auto; margin-left: auto; }
.mr-header__phone { display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; color: var(--mr-ink); }
.mr-header__phone:hover { color: var(--mr-primary); }
.mr-header__phone-ico { display: inline-flex; width: 36px; height: 36px; border-radius: 999px; background: var(--mr-bg-icon); color: var(--mr-primary); align-items: center; justify-content: center; }

.mr-burger { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-left: auto; padding: 0; border: 1px solid #e1e7ec; border-radius: 12px; background: #fff; color: var(--mr-ink); cursor: pointer; }
.mr-burger__close, .mr-burger[aria-expanded="true"] .mr-burger__open { display: none; }
.mr-burger[aria-expanded="true"] .mr-burger__close { display: block; }

.mr-mega-shade { position: fixed; inset: 0; z-index: -1; background: rgba(8, 17, 24, 0.28); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 300ms ease, visibility 0s 300ms; }
.mr-header.is-mega .mr-mega-shade { opacity: 1; visibility: visible; transition: opacity 300ms ease; }
.mr-mega { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-top: 1px solid var(--mr-border); box-shadow: var(--mr-shadow-menu); animation: mr-drop 320ms var(--mr-ease) both; }
.mr-mega__inner { max-width: var(--mr-container); margin: 0 auto; padding: 32px 24px 36px; display: grid; grid-template-columns: 240px minmax(0, 1fr) 280px; gap: 40px; }
.mr-mega__intro { display: flex; flex-direction: column; gap: 14px; padding-top: 4px; }
.mr-mega__title { font-size: 24px; line-height: 1.15; font-weight: 600; letter-spacing: -0.015em; color: var(--mr-ink); }
.mr-mega__desc { font-size: 15px; line-height: 1.55; color: var(--mr-muted); }
.mr-mega__all { margin-top: 6px; font-size: 15px; align-self: flex-start; }
.mr-mega__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; align-content: start; }
.mr-mega__list li { animation: mr-rise 450ms var(--mr-ease) both; animation-delay: var(--d, 0ms); }
.mr-mega__prod { display: flex; align-items: center; gap: 14px; padding: 8px; border-radius: 12px; color: var(--mr-ink); transition: background 200ms, color 200ms; }
.mr-mega__prod:hover { background: #f2f7fb; color: var(--mr-primary); }
.mr-mega__thumb { flex: 0 0 auto; width: 72px; height: 54px; border-radius: 12px; overflow: hidden; background: var(--mr-bg-image); }
.mr-mega__thumb img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); }
.mr-mega__name { font-size: 16px; font-weight: 600; }
.mr-mega__promo { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 240px; border-radius: 20px; overflow: hidden; color: #fff; background: var(--mr-primary); transition: transform 300ms var(--mr-ease); }
.mr-mega__promo:hover { transform: translateY(-3px); color: #fff; }
.mr-mega__promo-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mr-mega__promo-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 17, 24, 0.05) 20%, rgba(8, 30, 50, 0.85) 100%); }
.mr-mega__promo-body { position: relative; padding: 22px; display: flex; flex-direction: column; gap: 6px; }
.mr-mega__promo-eyebrow { font-size: 13px; font-weight: 600; color: var(--mr-accent-on-dark); }
.mr-mega__promo-title { font-size: 20px; font-weight: 600; line-height: 1.2; }
.mr-mega__promo-cta { margin-top: 8px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }

.mr-mobile { position: absolute; top: 100%; left: 0; right: 0; z-index: 60; background: #fff; border-top: 1px solid var(--mr-border); box-shadow: 0 26px 50px rgba(17, 26, 33, 0.16); padding: 8px 20px 22px; max-height: calc(100vh - 74px); max-height: calc(100dvh - 74px); overflow-y: auto; animation: mr-drop 280ms var(--mr-ease) both; }
.mr-mobile__nav { display: flex; flex-direction: column; }
.mr-mobile__link { padding: 15px 4px; font-size: 17px; font-weight: 600; color: var(--mr-ink); border-bottom: 1px solid #f0f3f6; }
.mr-mobile__link:last-child { border-bottom: 0; }
.mr-mobile__btn { margin-top: 10px; padding: 16px 22px; font-size: 17px; }
.mr-mobile__btn.mr-btn--outline { margin-top: 14px; padding: 15px 22px; border-color: #d5dde4; }

.mr-mbar { position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 70; transition: transform 450ms var(--mr-ease), opacity 300ms ease; }
.mr-mbar.is-hidden { transform: translateY(140%); opacity: 0; pointer-events: none; }
.mr-mbar__btn { display: flex; align-items: center; justify-content: center; gap: 10px; height: 56px; border-radius: 999px; background: var(--mr-primary); color: #fff; font-size: 17px; font-weight: 600; box-shadow: 0 14px 34px rgba(11, 111, 184, 0.38); }
.mr-mbar__btn:hover { color: #fff; }
.mr-mbar__btn:active { transform: scale(.98); }

@media (min-width: 940px) {
  .mr-nav { display: flex; }
  .mr-header__cta { display: flex; }
  .mr-burger, .mr-mobile, .mr-mbar { display: none !important; }
}
@media (max-width: 939.98px) {
  .mr-mega, .mr-mega-shade { display: none !important; }
  /* telefon: nagłówek przewija się ze stroną, CTA daje pływający przycisk */
  .mr-header { position: relative; top: 0; }
}

/* ---------- hero ---------- */

.mr-hero__stage { position: relative; width: 100%; height: 86svh; min-height: 560px; overflow: hidden; background: #0f1418; }
.mr-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1200ms ease; }
.mr-hero__slide.is-active { opacity: 1; }
.mr-hero__media { position: absolute; inset: 0; }
.mr-hero__media img { width: 100%; height: 100%; object-fit: cover; animation: mr-hero-zoom 28s ease-in-out infinite alternate; }
.mr-hero__media--rev img { animation-direction: alternate-reverse; }
.mr-hero__shade { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(8, 17, 24, 0.86) 0%, rgba(8, 17, 24, 0.62) 42%, rgba(8, 17, 24, 0.18) 75%, rgba(8, 17, 24, 0.04) 100%); }
@media (max-width: 939.98px) {
  /* tekst na całą szerokość: równomierne przyciemnienie zamiast gradientu od lewej */
  .mr-hero__shade { background: linear-gradient(180deg, rgba(8, 17, 24, 0.62) 0%, rgba(8, 17, 24, 0.7) 45%, rgba(8, 17, 24, 0.82) 100%); }
  .mr-hero__lead { color: #eef2f6; }
  .mr-hero__title, .mr-hero__lead, .mr-hero__eyebrow { text-shadow: 0 1px 18px rgba(8, 17, 24, 0.35); }
}
.mr-hero__content { position: absolute; inset: 0; display: flex; align-items: center; }
.mr-hero__text { width: 100%; max-width: var(--mr-container); margin: 0 auto; padding: 40px 20px 110px; display: flex; flex-direction: column; gap: 22px; }
.mr-hero__text > * { max-width: 42rem; }
.mr-hero__eyebrow { font-size: 15px; font-weight: 600; letter-spacing: 0.02em; color: var(--mr-accent-on-dark); animation: mr-rise 800ms var(--mr-ease) both; }
.mr-hero__title { font-size: clamp(36px, 4.8vw, 64px); line-height: 1.03; font-weight: 600; letter-spacing: -0.028em; color: #fff; text-wrap: balance; animation: mr-rise 900ms 90ms var(--mr-ease) both; }
.mr-hero__lead { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: #e2e8ee; max-width: 32em; animation: mr-rise 900ms 180ms var(--mr-ease) both; }
.mr-hero__btns { margin-top: 10px; display: flex; gap: 12px; flex-wrap: wrap; animation: mr-rise 900ms 270ms var(--mr-ease) both; }
.mr-hero__ctrl { position: absolute; left: 0; right: 0; bottom: 24px; pointer-events: none; }
.mr-hero__ctrl-box { max-width: var(--mr-container); margin: 0 auto; padding: 0 24px; display: flex; justify-content: center; }
.mr-hero__ctrl-inner { display: flex; align-items: center; gap: 16px; padding: 8px 18px; border-radius: 999px; background: rgba(8, 17, 24, 0.42); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); pointer-events: auto; }
.mr-hero__dots { display: flex; align-items: center; gap: 8px; }
.mr-hero__dot { position: relative; overflow: hidden; width: 14px; height: 6px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.35); cursor: pointer; transition: width 450ms var(--mr-ease); }
.mr-hero__dot::after { content: ""; position: absolute; inset: -10px -4px; }
.mr-hero__dot.is-active { width: 44px; }
.mr-hero__fill { position: absolute; inset: 0; background: #fff; transform-origin: left center; transform: scaleX(0); }
.mr-hero__dot.is-active .mr-hero__fill { animation: mr-fill var(--hero-time, 6500ms) linear both; }
.mr-hero.is-paused .mr-hero__dot.is-active .mr-hero__fill { animation-play-state: paused; }
.mr-hero[data-autoplay="0"] .mr-hero__dot.is-active .mr-hero__fill { animation: none; transform: scaleX(1); }
.mr-hero__arrows { display: none; gap: 6px; }
.mr-hero__arrow { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.14); color: #fff; cursor: pointer; transition: background 200ms; }
.mr-hero__arrow:hover { background: rgba(255, 255, 255, 0.3); }

@media (min-width: 940px) {
  .mr-hero__stage { height: min(82vh, 800px); }
  .mr-hero__text { padding: 0 24px 40px; }
  .mr-hero__ctrl { bottom: 72px; }
  .mr-hero__ctrl-box { justify-content: flex-end; }
  .mr-hero__arrows { display: flex; }
  .mr-hero__ctrl-inner { padding: 8px 10px 8px 18px; }
}

/* ---------- pasek faktów ---------- */

.mr-facts { position: relative; z-index: 2; max-width: var(--mr-container); margin: 24px auto 0; padding: 0 24px; }
.mr-facts__card { background: #fff; border: 1px solid var(--mr-border); box-shadow: var(--mr-shadow-strip); border-radius: 24px; padding: clamp(18px, 2.2vw, 26px) clamp(20px, 2.6vw, 32px); display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px 28px; }
@media (min-width: 940px) {
  .mr-hero + .mr-facts { margin-top: -40px; }
}
.mr-feature { display: flex; gap: 14px; align-items: center; padding: 6px 4px; }
.mr-feature__icon { flex: 0 0 auto; display: flex; width: 44px; height: 44px; border-radius: 12px; background: var(--mr-bg-icon); color: var(--mr-primary); align-items: center; justify-content: center; }
.mr-feature__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mr-feature__text strong { font-size: 17px; font-weight: 600; }
.mr-feature__text span { font-size: 14px; color: var(--mr-muted); }
.mr-feature--md { gap: 12px; padding: 0; }
.mr-feature--md .mr-feature__icon { width: 40px; height: 40px; }
.mr-feature--md .mr-feature__text strong { font-size: 16px; }
.mr-feature--md .mr-feature__text span { line-height: 1.35; }

/* ---------- sekcje ---------- */

.mr-section { max-width: var(--mr-container); margin: 0 auto; padding: var(--mr-section-y) 24px; }

/* oferta (zakładki) */
.mr-offer__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.mr-switch { position: relative; display: flex; width: 100%; max-width: 420px; margin: 0 auto; padding: 6px; background: var(--mr-bg-switch); border-radius: 999px; }
.mr-switch__pill { position: absolute; top: 6px; bottom: 6px; left: calc(6px + (100% - 12px) / var(--n, 2) * var(--i, 0)); width: calc((100% - 12px) / var(--n, 2)); background: #fff; border-radius: 999px; box-shadow: 0 6px 16px rgba(17, 26, 33, 0.1); transition: left 450ms var(--mr-ease); }
.mr-switch__btn { position: relative; flex: 1 1 0; min-width: 0; padding: 12px 20px; border: 0; background: none; border-radius: 999px; font-size: 15px; font-weight: 600; color: var(--mr-muted); cursor: pointer; transition: color 300ms; }
.mr-switch__btn.is-active { color: var(--mr-ink); }
.mr-switch__count { color: #8ea6b8; font-weight: 500; }
@media (min-width: 940px) {
  .mr-switch { width: auto; margin: 0; }
  .mr-switch__btn { min-width: 160px; }
}
.mr-offer__bar { margin-top: 20px; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }
.mr-offer__desc { font-size: 17px; line-height: 1.6; color: var(--mr-muted); max-width: 36em; }
.mr-offer__panel > .mr-grid { margin-top: 40px; }

/* siatki kart */
.mr-grid { display: grid; }
.mr-grid--mini { grid-template-columns: repeat(auto-fill, minmax(min(46%, 250px), 1fr)); gap: var(--mr-gap-grid); }
.mr-grid--full { grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); gap: clamp(18px, 2.4vw, 28px); }
.mr-grid--small { margin-top: 32px; grid-template-columns: repeat(auto-fill, minmax(min(46%, 220px), 1fr)); gap: clamp(14px, 2vw, 22px); }

.mr-card { display: flex; flex-direction: column; gap: 14px; color: var(--mr-ink); }
.mr-card__media { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: var(--mr-bg-image); transition: box-shadow 450ms ease; }
.mr-card__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: transform 800ms var(--mr-ease); }
.mr-card__title { font-size: 18px; font-weight: 600; letter-spacing: -0.01em; transition: color 300ms; }
.mr-card:hover { color: var(--mr-ink); }
.mr-card:hover .mr-card__title { color: var(--mr-primary); }
.mr-card--mini, .mr-card--full { animation: mr-rise 650ms var(--mr-ease) both; animation-delay: var(--d, 0ms); }
.mr-card--mini:hover .mr-card__media img, .mr-card--full:hover .mr-card__media img { transform: scale(1.14); }
.mr-card--mini:hover .mr-card__media, .mr-card--full:hover .mr-card__media { box-shadow: var(--mr-shadow-card-hover); }
.mr-card__arrow { position: absolute; top: 14px; right: 14px; display: flex; width: 40px; height: 40px; border-radius: 999px; background: #fff; color: var(--mr-primary); align-items: center; justify-content: center; opacity: 0; transform: translate(-6px, 6px) scale(.8); transition: opacity 350ms ease, transform 450ms var(--mr-ease); }
.mr-card--mini:hover .mr-card__arrow { opacity: 1; transform: none; }
.mr-card--full { gap: 16px; animation-duration: 700ms; }
.mr-card__body { display: flex; flex-direction: column; gap: 8px; }
.mr-card--full .mr-card__title { font-size: 20px; }
.mr-card__lead { font-size: 15px; line-height: 1.55; color: var(--mr-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mr-card__more { margin-top: 4px; display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--mr-primary); transition: gap 300ms var(--mr-ease); }
.mr-card--full:hover .mr-card__more { gap: 14px; }
.mr-card--small { gap: 12px; }
.mr-card--small .mr-card__media { background: #e6edf2; }
.mr-card--small .mr-card__media img { transition-duration: 700ms; }
.mr-card--small:hover .mr-card__media img { transform: scale(1.12); }
.mr-card--small .mr-card__title { font-size: 17px; }

/* O nas */
.mr-about__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: clamp(40px, 6vw, 88px); align-items: center; }
.mr-about__media { position: relative; }
.mr-about__img { border-radius: 24px; overflow: hidden; background: var(--mr-bg-image); aspect-ratio: 4 / 5; max-height: 640px; }
.mr-about__img img { width: 100%; height: 100%; object-fit: cover; }
.mr-about__text { display: flex; flex-direction: column; gap: 22px; }
.mr-about__body { display: flex; flex-direction: column; gap: 22px; }
.mr-about__body p { font-size: 18px; line-height: 1.65; color: var(--mr-text-body); max-width: 34em; }
.mr-about__cta { margin-top: 10px; }
@media (min-width: 840px) {
  .mr-about--right .mr-about__media { order: 2; }
}

/* Jak działamy */
.mr-process-wrap { padding: 0 24px; }
.mr-process { max-width: var(--mr-container); margin: 0 auto; background: var(--mr-bg-soft); border-radius: 32px; padding: clamp(52px, 7vw, 92px) clamp(24px, 5vw, 68px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: clamp(40px, 6vw, 96px); align-items: start; }
.mr-process__intro { display: flex; flex-direction: column; gap: 20px; }
.mr-process__desc { font-size: 17px; line-height: 1.6; color: var(--mr-muted); max-width: 26em; }
.mr-process__cta { margin-top: 8px; }
@media (min-width: 900px) {
  .mr-process__intro { position: sticky; top: calc(110px + var(--mr-top)); }
}
.mr-steps { position: relative; }
.mr-steps__track, .mr-steps__line { position: absolute; left: 27px; top: 28px; bottom: 28px; width: 2px; background: #dbe6ee; }
.mr-steps__line { background: var(--mr-primary); transform-origin: center top; transform: scaleY(0); }
.mr-steps__list { position: relative; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.mr-step { display: flex; gap: 22px; align-items: flex-start; }
.mr-step__no { flex: 0 0 auto; display: flex; width: 56px; height: 56px; border-radius: 999px; background: #fff; border: 2px solid var(--mr-primary); color: var(--mr-primary); font-size: 19px; font-weight: 700; align-items: center; justify-content: center; box-shadow: 0 0 0 6px var(--mr-bg-soft); }
.mr-step__card { flex: 1 1 auto; background: #fff; border-radius: 20px; padding: 22px 24px; display: flex; flex-direction: column; gap: 6px; transition: transform 350ms var(--mr-ease), box-shadow 350ms; }
.mr-step__card:hover { transform: translateX(6px); box-shadow: 0 16px 36px rgba(17, 26, 33, 0.08); }
.mr-step__title { font-size: 19px; font-weight: 600; line-height: 1.3; }
.mr-step__text { font-size: 16px; line-height: 1.55; color: var(--mr-muted); }

/* CTA pomiar */
.mr-cta-wrap { padding: var(--mr-section-y) 24px; }
.mr-process-wrap + .mr-cta-wrap { padding-top: clamp(24px, 3vw, 32px); }
.mr-cta { position: relative; max-width: var(--mr-container); margin: 0 auto; border-radius: 32px; overflow: hidden; background: var(--mr-primary); }
.mr-cta__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.15); will-change: transform; }
.mr-cta__shade { position: absolute; inset: 0; background: linear-gradient(110deg, rgba(11, 111, 184, 0.95) 0%, rgba(11, 111, 184, 0.88) 55%, rgba(8, 82, 127, 0.8) 100%); }
.mr-cta__inner { position: relative; padding: clamp(52px, 6vw, 84px) clamp(28px, 5vw, 68px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: clamp(32px, 5vw, 64px); align-items: center; }
.mr-cta__text { display: flex; flex-direction: column; gap: 18px; }
.mr-cta .mr-h2 { color: #fff; }
.mr-cta__desc { font-size: 18px; line-height: 1.6; color: #fff; max-width: 30em; }
.mr-cta__btns { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
@media (min-width: 940px) {
  .mr-cta__btns { align-items: flex-end; }
}
.mr-pillbtn { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: min(100%, 340px); padding: 10px 10px 10px 26px; border: 1px solid transparent; border-radius: 999px; font-size: 18px; font-weight: 600; transition: transform 250ms var(--mr-ease), box-shadow 250ms, background 250ms, border-color 250ms, color 250ms; }
.mr-pillbtn:active { transform: scale(.98); }
.mr-pillbtn__dot { flex: 0 0 auto; display: flex; width: 44px; height: 44px; border-radius: 999px; align-items: center; justify-content: center; color: #fff; }
.mr-pillbtn--white { background: #fff; color: var(--mr-primary); }
.mr-pillbtn--white .mr-pillbtn__dot { background: var(--mr-primary); }
.mr-pillbtn--white:hover { color: var(--mr-primary-hover); transform: translateY(-2px); box-shadow: 0 16px 34px rgba(4, 30, 52, 0.3); }
.mr-pillbtn--line { border-color: rgba(255, 255, 255, 0.55); color: #fff; }
.mr-pillbtn--line .mr-pillbtn__dot { background: rgba(255, 255, 255, 0.16); }
.mr-pillbtn--line:hover { background: rgba(255, 255, 255, 0.12); border-color: #fff; color: #fff; }

/* ---------- stopka ---------- */

.mr-footer { background: var(--mr-dark); color: var(--mr-footer-text); border-radius: 32px 32px 0 0; }
.mr-footer__grid { max-width: var(--mr-container); margin: 0 auto; padding: clamp(56px, 7vw, 88px) 24px 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 44px; }
.mr-footer__brand { display: flex; flex-direction: column; gap: 22px; }
.mr-footer__logo { align-self: flex-start; color: #fff; font-size: 22px; font-weight: 700; }
.mr-footer__logo img { height: 34px; width: auto; }
.mr-footer__desc { font-size: 16px; line-height: 1.6; color: var(--mr-footer-muted); max-width: 22em; }
.mr-footer__social { display: flex; gap: 10px; }
.mr-footer__social a { display: flex; width: 42px; height: 42px; border: 1px solid var(--mr-border-dark-2); border-radius: 999px; align-items: center; justify-content: center; color: var(--mr-footer-text); transition: background 250ms, border-color 250ms, transform 250ms, color 250ms; }
.mr-footer__social a:hover { background: var(--mr-primary); border-color: var(--mr-primary); color: #fff; transform: translateY(-2px); }
.mr-footer__col { display: flex; flex-direction: column; gap: 18px; }
.mr-footer__head { font-size: 15px; font-weight: 600; color: var(--mr-accent-footer); align-self: flex-start; }
.mr-footer__head:hover { color: var(--mr-accent-on-dark); }
.mr-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.mr-footer__list a { display: inline-block; font-size: 15px; color: var(--mr-footer-text); transition: color 200ms, transform 250ms; }
.mr-footer__list a:hover { color: #fff; transform: translateX(4px); }
.mr-footer__contact { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.mr-footer__phone { font-size: 20px; font-weight: 600; color: #fff; }
.mr-footer__phone:hover { color: var(--mr-accent-footer); }
.mr-footer__mail { font-size: 16px; color: var(--mr-footer-text); }
.mr-footer__mail:hover { color: #fff; }
.mr-footer__btn { margin-top: 10px; padding: 13px 24px; }
.mr-footer__btn:hover { background: var(--mr-primary-bright); box-shadow: none; }
.mr-footer__bottom { max-width: var(--mr-container); margin: 0 auto; padding: 24px 24px 28px; border-top: 1px solid var(--mr-border-dark); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.mr-footer__bottom p { font-size: 14px; color: var(--mr-footer-muted); }
.mr-footer__bottom a { color: var(--mr-footer-muted); }
.mr-footer__bottom a:hover { color: #fff; }
.mr-footer__bottom .mr-footer__credit { color: var(--mr-footer-text); font-weight: 600; }

/* ---------- podstrony ---------- */

.mr-pagehead { padding-top: clamp(28px, 4vw, 48px); }
.mr-crumbs { font-size: 14px; color: var(--mr-muted-2); animation: mr-rise 600ms var(--mr-ease) both; }
.mr-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mr-crumbs li { display: flex; gap: 8px; align-items: center; }
.mr-crumbs a { color: var(--mr-muted); }
.mr-crumbs a:hover { color: var(--mr-primary); }
.mr-crumbs [aria-current] { color: var(--mr-ink); font-weight: 500; }

/* kategoria */
.mr-cathead { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: clamp(32px, 5vw, 72px); align-items: center; }
.mr-cathead__text { display: flex; flex-direction: column; gap: 22px; }
.mr-cathead__media { border-radius: 24px; overflow: hidden; aspect-ratio: 16 / 11; background: var(--mr-bg-image); animation-duration: 900ms; }
.mr-cathead__media img { width: 100%; height: 100%; object-fit: cover; animation: mr-cat-zoom 24s ease-in-out infinite alternate; }
.mr-catgrid { padding-top: clamp(64px, 8vw, 104px); padding-bottom: clamp(64px, 8vw, 104px); }

.mr-band-wrap { padding: 0 24px clamp(80px, 10vw, 128px); }
.mr-band { max-width: var(--mr-container); margin: 0 auto; border-radius: 32px; background: var(--mr-bg-soft); padding: clamp(40px, 5vw, 64px) clamp(28px, 5vw, 64px); display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.mr-band__text { display: flex; flex-direction: column; gap: 12px; max-width: 36em; }
.mr-band__text p { font-size: 17px; line-height: 1.6; color: var(--mr-muted); }

/* produkt */
.mr-product { padding-bottom: clamp(72px, 9vw, 120px); }
.mr-product__grid { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: clamp(32px, 5vw, 72px); align-items: start; }
.mr-gallery { display: flex; flex-direction: column; gap: 14px; min-width: 0; animation-duration: 900ms; }
.mr-gallery__main { position: relative; border-radius: 24px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--mr-bg-image); touch-action: pan-y; }
.mr-gallery__slide { position: absolute; inset: 0; opacity: 0; transform: scale(1.1); transition: opacity 600ms ease, transform 1200ms var(--mr-ease); }
.mr-gallery__slide.is-active { opacity: 1; transform: scale(1.04); }
.mr-gallery__slide img { width: 100%; height: 100%; object-fit: cover; }
.mr-gallery__nav { position: absolute; left: 16px; right: 16px; top: 50%; transform: translateY(-50%); display: flex; justify-content: space-between; pointer-events: none; }
.mr-gallery__arrow { pointer-events: auto; display: flex; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.92); box-shadow: 0 6px 18px rgba(17, 26, 33, 0.16); color: var(--mr-ink); align-items: center; justify-content: center; cursor: pointer; transition: background 200ms, transform 250ms var(--mr-ease); }
.mr-gallery__arrow:hover { background: #fff; transform: scale(1.06); }
.mr-gallery__arrow:active { transform: scale(.94); }
.mr-gallery__count { position: absolute; right: 16px; bottom: 16px; padding: 6px 12px; border-radius: 999px; background: rgba(8, 17, 24, 0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.mr-gallery__strip { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: 2px; }
.mr-gallery__strip::-webkit-scrollbar { display: none; }
.mr-gallery__thumb { flex: 0 0 calc((100% - 40px) / 5); min-width: 84px; aspect-ratio: 4 / 3; padding: 0; border: 0; border-radius: 12px; overflow: hidden; background: var(--mr-bg-image); cursor: pointer; scroll-snap-align: start; outline: 2px solid transparent; outline-offset: 2px; opacity: .6; transition: opacity 250ms, outline-color 250ms; }
.mr-gallery__thumb:hover, .mr-gallery__thumb.is-active { opacity: 1; }
.mr-gallery__thumb.is-active { outline-color: var(--mr-primary); }
.mr-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.mr-product__info { display: flex; flex-direction: column; gap: 22px; }
@media (min-width: 900px) {
  .mr-product__info { position: sticky; top: calc(110px + var(--mr-top)); }
}
.mr-product__cat { align-self: flex-start; animation-duration: 700ms; }
.mr-product__cat:hover { color: var(--mr-primary-hover); }
.mr-perks { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.mr-perks li { display: flex; gap: 14px; align-items: center; font-size: 17px; color: var(--mr-label); animation-duration: 700ms; }
.mr-perks__ico { flex: 0 0 auto; display: flex; width: 28px; height: 28px; border-radius: 999px; background: var(--mr-primary); color: #fff; align-items: center; justify-content: center; animation: mr-pop 600ms var(--mr-ease) both; animation-delay: var(--d); }
.mr-product__btns { margin-top: 10px; }
.mr-product__feats { margin-top: 12px; padding-top: 22px; border-top: 1px solid var(--mr-border); display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 16px 20px; }
.mr-related-wrap { padding: 0 24px clamp(80px, 10vw, 128px); }
.mr-related { max-width: var(--mr-container); margin: 0 auto; background: var(--mr-bg-soft); border-radius: 32px; padding: clamp(44px, 6vw, 72px) clamp(24px, 5vw, 56px); }
.mr-related__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }

/* zamów pomiar */
.mr-pomiar { padding-bottom: clamp(80px, 10vw, 128px); }
.mr-pomiar__grid { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: clamp(36px, 6vw, 88px); align-items: start; }
.mr-pomiar__intro { display: flex; flex-direction: column; gap: 22px; }
.mr-pomiar__intro .mr-lead { max-width: 30em; }
.mr-numlist { list-style: none; margin: 10px 0 0; padding: 0; }
.mr-numlist li { display: flex; gap: 18px; padding: 18px 0; border-top: 1px solid var(--mr-border); animation-duration: 700ms; }
.mr-numlist li:last-child { border-bottom: 1px solid var(--mr-border); }
.mr-numlist__no { flex: 0 0 auto; display: flex; width: 40px; height: 40px; border-radius: 999px; background: var(--mr-bg-icon); color: var(--mr-primary); font-weight: 700; align-items: center; justify-content: center; }
.mr-numlist div { display: flex; flex-direction: column; gap: 2px; }
.mr-numlist strong { font-size: 17px; }
.mr-numlist span { font-size: 15px; color: var(--mr-muted); }
.mr-callbox { margin-top: 6px; display: flex; flex-direction: column; gap: 6px; animation-duration: 700ms; }
.mr-callbox span { font-size: 15px; color: var(--mr-muted); }
.mr-callbox a { font-size: 26px; font-weight: 600; color: var(--mr-ink); }
.mr-callbox a:hover { color: var(--mr-primary); }
.mr-formbox { background: var(--mr-bg-soft); border-radius: 32px; padding: clamp(24px, 3.5vw, 44px); min-width: 0; animation-duration: 900ms; }

/* kontakt */
.mr-contact { padding-bottom: clamp(64px, 8vw, 96px); }
.mr-contact__head { margin-top: 28px; display: flex; flex-direction: column; gap: 20px; max-width: 44rem; }
.mr-contact__map-wrap { margin-top: 48px; position: relative; animation-duration: 900ms; }
.mr-contact__map { position: relative; border-radius: 32px; overflow: hidden; height: clamp(360px, 40vw, 480px); background: #e9eef2; }
.mr-contact__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: saturate(0.85); }
.mr-contact__tiles { position: relative; z-index: 2; margin: -72px clamp(12px, 3vw, 48px) 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 18px; }
.mr-contact__map-wrap--nomap .mr-contact__tiles { margin: 0; }
.mr-tile { display: flex; flex-direction: column; gap: 18px; padding: 28px; border-radius: 24px; background: #fff; box-shadow: 0 18px 44px rgba(17, 26, 33, 0.08); color: var(--mr-ink); transition: transform 350ms var(--mr-ease), box-shadow 350ms; }
a.mr-tile:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgba(17, 26, 33, 0.08); color: var(--mr-ink); }
.mr-tile--primary { background: var(--mr-primary); color: #fff; }
a.mr-tile--primary:hover { color: #fff; box-shadow: 0 20px 40px rgba(11, 111, 184, 0.3); }
.mr-tile__ico { display: flex; width: 48px; height: 48px; border-radius: 12px; background: #fff; color: var(--mr-primary); align-items: center; justify-content: center; }
.mr-tile--primary .mr-tile__ico { background: rgba(255, 255, 255, 0.16); color: #fff; }
.mr-tile__body { display: flex; flex-direction: column; gap: 4px; }
.mr-tile__label { font-size: 15px; color: var(--mr-muted); }
.mr-tile--primary .mr-tile__label { color: #cbe6f9; }
.mr-tile__value { font-size: 22px; font-weight: 600; overflow-wrap: anywhere; }
.mr-tile__value--24 { font-size: 24px; }
.mr-tile__extra { margin-top: 2px; font-size: 14px; line-height: 1.55; color: var(--mr-muted); }
.mr-contact-form-wrap { padding: 0 24px clamp(80px, 10vw, 128px); }
.mr-contact-form { max-width: var(--mr-container); margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: clamp(32px, 5vw, 64px); align-items: stretch; }
.mr-contact-form__media { position: relative; border-radius: 32px; overflow: hidden; min-height: 420px; background: var(--mr-bg-image); }
.mr-contact-form__media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mr-contact-form__over { position: absolute; left: 20px; right: 20px; bottom: 20px; background: #fff; border-radius: 20px; padding: 20px 22px; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.mr-contact-form__over div { display: flex; flex-direction: column; gap: 2px; }
.mr-contact-form__over strong { font-size: 17px; }
.mr-contact-form__over span { font-size: 14px; color: var(--mr-muted); }
.mr-contact-form__over .mr-btn { padding: 12px 20px; }
.mr-contact-form__body { display: flex; flex-direction: column; gap: 24px; justify-content: center; min-width: 0; }

/* dziękujemy / 404 */
.mr-thanks { padding-top: clamp(56px, 8vw, 112px); padding-bottom: clamp(80px, 10vw, 128px); }
.mr-thanks__head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; max-width: 44rem; margin: 0 auto; }
.mr-thanks__head .mr-lead { max-width: 34em; }
.mr-thanks__head .mr-h1 { margin-top: 10px; }
.mr-thanks__badge { position: relative; width: 96px; height: 96px; }
.mr-thanks__ring { position: absolute; inset: 0; border-radius: 999px; background: var(--mr-primary); animation: mr-ring 1600ms 700ms ease-out both; }
.mr-thanks__check { position: relative; display: flex; width: 96px; height: 96px; border-radius: 999px; background: var(--mr-primary); align-items: center; justify-content: center; box-shadow: 0 18px 40px rgba(11, 111, 184, 0.35); animation: mr-pop 700ms var(--mr-ease) both; }
.mr-thanks__check svg { stroke-dasharray: 30; animation: mr-draw 500ms 450ms ease-out both; }
.mr-thanks__steps { margin: clamp(40px, 5vw, 64px) auto 0; max-width: 980px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 18px; }
.mr-thanks__step { display: flex; flex-direction: column; gap: 14px; padding: 28px; border-radius: 24px; background: var(--mr-bg-soft); animation-duration: 700ms; }
.mr-thanks__no { display: flex; width: 44px; height: 44px; border-radius: 999px; background: #fff; border: 2px solid var(--mr-primary); color: var(--mr-primary); font-weight: 700; font-size: 17px; align-items: center; justify-content: center; }
.mr-thanks__no.is-first { background: var(--mr-primary); color: #fff; }
.mr-thanks__step strong { font-size: 18px; font-weight: 600; }
.mr-thanks__step span:not(.mr-thanks__no) { font-size: 15px; line-height: 1.55; color: var(--mr-muted); }
.mr-thanks__btns { margin-top: clamp(36px, 4vw, 52px); }
.mr-thanks__urgent { margin-top: 28px; text-align: center; font-size: 15px; color: var(--mr-muted); }
.mr-thanks__urgent a { font-weight: 600; white-space: nowrap; }

/* strona tekstowa */
.mr-textpage { padding-bottom: clamp(80px, 10vw, 128px); }
.mr-textpage__head { margin-top: 28px; display: flex; flex-direction: column; gap: 16px; }
.mr-textpage__date { font-size: 15px; color: var(--mr-muted); }
.mr-prose { margin-top: clamp(40px, 5vw, 64px); min-width: 0; }
.mr-prose > * + * { margin-top: 16px; }
.mr-prose > :first-child { margin-top: 0; }
.mr-prose h2 { margin-top: 48px; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; font-weight: 600; letter-spacing: -0.015em; }
.mr-prose h3 { margin-top: 32px; font-size: 20px; line-height: 1.3; font-weight: 600; }
.mr-prose p { font-size: 17px; line-height: 1.75; color: var(--mr-text); }
.mr-prose ul, .mr-prose ol { margin-bottom: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.mr-prose li { font-size: 17px; line-height: 1.65; color: var(--mr-text); }
.mr-prose a { text-decoration: underline; text-underline-offset: 2px; }
.mr-infobox { margin-top: 48px !important; padding: 24px; border-radius: 20px; background: var(--mr-bg-soft); display: flex; flex-direction: column; gap: 8px; }
.mr-infobox strong { font-size: 17px; }
.mr-infobox p { font-size: 16px; line-height: 1.6; color: var(--mr-muted); }
.mr-infobox a { font-weight: 600; text-decoration: none; }

/* ---------- formularze (CF7) ---------- */

.wpcf7 .screen-reader-response { position: absolute; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; word-wrap: normal !important; }
.wpcf7 .hidden-fields-container { display: none; border: 0; margin: 0; padding: 0; }
.wpcf7-form-control-wrap { position: relative; display: block; }
.mr-cf7 .wpcf7-form { display: flex; flex-direction: column; gap: 16px; }
.mr-cf7--steps .wpcf7-form { gap: 28px; }
.mr-field { display: flex; flex-direction: column; gap: 8px; font-size: 14px; font-weight: 600; color: var(--mr-label); }
.mr-field__label span, .mr-flabel span { font-weight: 400; color: var(--mr-muted-2); }
.mr-flabel { font-size: 14px; font-weight: 600; color: var(--mr-label); }
.mr-fgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.mr-fgrid--220 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.mr-form input[type="text"], .mr-form input[type="email"], .mr-form input[type="tel"], .mr-form input[type="date"], .mr-form input[type="url"], .mr-form input[type="number"], .mr-form select, .mr-form textarea {
  display: block; width: 100%; height: 52px; margin: 0; padding: 0 16px;
  border: 1px solid var(--mr-border-input); border-radius: 12px; background: #fff; color: var(--mr-ink);
  font-size: 16px; font-weight: 400; line-height: 1.4; outline: none;
  transition: border-color 200ms, box-shadow 200ms;
}
.mr-form textarea { height: auto; min-height: 120px; padding: 14px 16px; resize: vertical; }
.mr-form select { -webkit-appearance: none; appearance: none; padding-right: 44px; cursor: pointer; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6572' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center; }
.mr-form input::placeholder, .mr-form textarea::placeholder { color: #8a949f; }
.mr-form input:focus, .mr-form select:focus, .mr-form textarea:focus { border-color: var(--mr-primary); box-shadow: var(--mr-focus-ring); }
.mr-form .wpcf7-not-valid:not(.mr-gtiles) { border-color: var(--mr-error); }
.wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: 13px; font-weight: 500; color: var(--mr-error); }
.mr-consent .wpcf7-list-item { display: block; margin: 0; }
.mr-consent label { display: flex; gap: 12px; align-items: flex-start; font-size: 13px; line-height: 1.55; color: var(--mr-muted); cursor: pointer; }
.mr-consent input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--mr-primary); }
.mr-form input[type="submit"] { -webkit-appearance: none; appearance: none; font-family: inherit; }
.mr-form .wpcf7-spinner { display: none; }
.mr-form.submitting input[type="submit"] { opacity: .7; cursor: progress; }
.mr-form .wpcf7-response-output { margin: 0; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--mr-border-soft); background: #fff; font-size: 14px; line-height: 1.5; }
.mr-form .wpcf7-response-output:empty { display: none; }
.mr-form.invalid .wpcf7-response-output, .mr-form.failed .wpcf7-response-output, .mr-form.unaccepted .wpcf7-response-output, .mr-form.spam .wpcf7-response-output, .mr-form.aborted .wpcf7-response-output { border-color: #f1c4bf; background: #fef3f2; color: var(--mr-error); }
.mr-form.sent .wpcf7-response-output { border-color: #b7dcc4; background: #f0faf3; color: #1c6b3a; }

/* kroki formularza pomiaru */
.mr-fhead { display: flex; flex-direction: column; gap: 14px; }
.mr-fhead__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.mr-fhead__no { font-size: 14px; font-weight: 600; color: var(--mr-primary); }
.mr-fhead__next { font-size: 14px; color: var(--mr-muted); }
.mr-fhead__bar { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mr-fhead__bar > span { position: relative; height: 4px; border-radius: 999px; background: var(--mr-border-soft); overflow: hidden; }
.mr-fhead__bar > span:first-child { background: var(--mr-primary); }
.mr-fhead__bar i { position: absolute; inset: 0; background: var(--mr-primary); transform-origin: left center; transform: scaleX(0); transition: transform 600ms var(--mr-ease); }
.mr-fhead.is-step2 .mr-fhead__bar i { transform: scaleX(1); }
.mr-fhead__title { margin-top: 6px; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; }
.mr-fstep { display: flex; flex-direction: column; gap: 28px; animation: mr-rise 500ms var(--mr-ease) both; }
.mr-fgroup { display: flex; flex-direction: column; gap: 12px; }
.mr-fgroup--line { padding-top: 24px; margin-top: -4px; border-top: 1px solid var(--mr-border-soft); }
.mr-ferror { font-size: 14px; font-weight: 500; color: var(--mr-error); animation: mr-rise 300ms ease both; }
.mr-fsum { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border-radius: 12px; background: #fff; border: 1px solid var(--mr-border-soft); }
.mr-fsum > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mr-fsum span { font-size: 13px; color: var(--mr-muted); }
.mr-fsum strong { font-size: 15px; font-weight: 600; color: var(--mr-ink); }
.mr-fsum__btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--mr-border-input); border-radius: 999px; background: #fff; font-size: 14px; font-weight: 600; color: var(--mr-ink); cursor: pointer; transition: border-color 200ms, color 200ms; }
.mr-fsum__btn:hover { border-color: var(--mr-primary); color: var(--mr-primary); }
.mr-factions { display: flex; gap: 12px; flex-wrap: wrap-reverse; }
.mr-factions .mr-btn--outline { flex: 0 0 auto; }
.mr-factions input[type="submit"] { flex: 1 1 220px; }

.mr-gtiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mr-gtile { position: relative; display: flex; flex-direction: column; border: 2px solid var(--mr-border-soft); border-radius: 20px; background: #fff; overflow: hidden; cursor: pointer; transition: border-color 250ms, box-shadow 300ms, transform 250ms var(--mr-ease); }
.mr-gtile:hover { transform: translateY(-2px); }
.mr-gtile:active { transform: scale(.98); }
.mr-gtile input, .mr-ptile input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.mr-gtile:focus-within, .mr-ptile:focus-within { outline: 2px solid var(--mr-primary); outline-offset: 2px; }
.mr-gtile__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--mr-bg-image); }
.mr-gtile__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--mr-ease); }
.mr-gtile__body { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px 16px; }
.mr-gtile__body strong { font-size: 17px; font-weight: 600; color: var(--mr-ink); }
.mr-gtile__body span { font-size: 14px; font-weight: 400; color: var(--mr-muted); }
.mr-gtile.is-on { border-color: var(--mr-primary); box-shadow: 0 14px 30px rgba(11, 111, 184, 0.16); }
.mr-gtile.is-on .mr-gtile__media img { transform: scale(1.06); }
.mr-tick { position: absolute; top: 14px; right: 14px; display: flex; width: 22px; height: 22px; border-radius: 999px; background: #d5dde4; border: 2px solid #fff; box-shadow: 0 2px 6px rgba(17, 26, 33, 0.2); color: #fff; align-items: center; justify-content: center; transition: background 200ms; }
.mr-tick svg { opacity: 0; stroke-dasharray: 30; }
.mr-tick--lg { top: 12px; right: 12px; width: 30px; height: 30px; background: rgba(255, 255, 255, 0.85); box-shadow: 0 4px 10px rgba(17, 26, 33, 0.18); transition: background 250ms; }
.is-on > .mr-tick { background: var(--mr-primary); }
.is-on > .mr-tick svg { opacity: 1; animation: mr-draw 300ms ease-out both; }
.mr-gpanel { display: flex; flex-direction: column; gap: 12px; animation: mr-rise 450ms var(--mr-ease) both; }
.mr-ptiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 10px; }
.mr-ptile { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 8px 8px 12px; border: 1.5px solid var(--mr-border-soft); border-radius: 12px; background: #fff; cursor: pointer; animation: mr-rise 400ms var(--mr-ease) both; animation-delay: var(--d, 0ms); transition: border-color 200ms, background 200ms; }
.mr-ptile:active { transform: scale(.98); }
.mr-ptile.is-on { border-color: var(--mr-primary); background: #f2f7fb; }
.mr-ptile__media { display: block; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; background: var(--mr-bg-image); }
.mr-ptile__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); }
.mr-ptile__name { font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--mr-ink); padding: 0 4px; }
@media (max-width: 419.98px) {
  .mr-gtiles { gap: 10px; }
  .mr-gtile__body { padding: 12px; }
  .mr-gtile__body strong { font-size: 15px; }
}

/* ---------- ruch ograniczony ---------- */

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

/* ---------- 404 ---------- */

.mr-404 { padding-top: clamp(48px, 7vw, 96px); padding-bottom: clamp(80px, 10vw, 128px); }
.mr-404__head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; max-width: 44rem; margin: 0 auto; }
.mr-404__head .mr-lead { max-width: 34em; }
.mr-404__head .mr-btns { margin-top: 10px; }
.mr-404__head .mr-thanks__urgent { margin-top: 4px; }
.mr-404__art { display: flex; align-items: center; justify-content: center; gap: clamp(10px, 2vw, 18px); margin-bottom: 6px; }
.mr-404__digit { font-size: clamp(96px, 16vw, 168px); line-height: .9; font-weight: 700; letter-spacing: -0.04em; color: var(--mr-primary); }
.mr-404__window { position: relative; width: clamp(78px, 12vw, 124px); aspect-ratio: 3 / 4; border: clamp(5px, .8vw, 8px) solid var(--mr-ink); border-radius: 14px; background: var(--mr-bg-icon); overflow: hidden; }
.mr-404__glass { position: absolute; inset: 0; background: linear-gradient(160deg, #dff0fc 0%, #b9dcf5 55%, #8fc6ec 100%); }
.mr-404__glass::after { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: clamp(4px, .6vw, 6px); margin-left: calc(clamp(4px, .6vw, 6px) / -2); background: var(--mr-ink); }
.mr-404__box { position: absolute; left: 0; right: 0; top: 0; height: 14%; background: var(--mr-ink); z-index: 2; }
.mr-404__blind { position: absolute; left: 0; right: 0; top: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; gap: 3px; padding: 0 0 6px; background: #fff; transform-origin: top center; z-index: 1; box-shadow: 0 6px 12px rgba(17, 26, 33, 0.15); animation: mr-blind 5.5s var(--mr-ease) 600ms infinite; }
.mr-404__blind i { display: block; height: 3px; margin: 0 10%; border-radius: 3px; background: #dbe6ee; }
.mr-404__cord { position: absolute; right: 16%; top: 14%; width: 2px; height: 46%; background: var(--mr-primary); z-index: 3; }
.mr-404__cord::after { content: ""; position: absolute; left: -3px; bottom: -6px; width: 8px; height: 8px; border-radius: 999px; background: var(--mr-primary); }
@keyframes mr-blind {
  0% { transform: scaleY(.15); }
  35%, 55% { transform: scaleY(.72); }
  90%, 100% { transform: scaleY(.15); }
}
.mr-404__cats { max-width: 880px; margin: clamp(48px, 6vw, 72px) auto 0; display: flex; flex-direction: column; gap: 14px; }
.mr-404__hint { text-align: center; }
.mr-404__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; }
.mr-catcard { display: flex; flex-direction: column; border: 1px solid var(--mr-border); border-radius: 20px; overflow: hidden; background: #fff; color: var(--mr-ink); transition: transform 300ms var(--mr-ease), box-shadow 350ms, border-color 300ms; }
.mr-catcard:hover { transform: translateY(-3px); box-shadow: var(--mr-shadow-card-hover); border-color: transparent; color: var(--mr-ink); }
.mr-catcard__media { display: block; aspect-ratio: 16 / 8; overflow: hidden; background: var(--mr-bg-image); }
.mr-catcard__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 800ms var(--mr-ease); }
.mr-catcard:hover .mr-catcard__media img { transform: scale(1.1); }
.mr-catcard__body { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; text-align: left; }
.mr-catcard__body > span:first-child { display: flex; flex-direction: column; gap: 2px; }
.mr-catcard strong { font-size: 18px; font-weight: 600; }
.mr-catcard em { font-style: normal; font-size: 14px; color: var(--mr-muted); }
.mr-catcard__arrow { flex: 0 0 auto; display: flex; width: 40px; height: 40px; border-radius: 999px; background: var(--mr-bg-icon); color: var(--mr-primary); align-items: center; justify-content: center; transition: background 250ms, color 250ms; }
.mr-catcard:hover .mr-catcard__arrow { background: var(--mr-primary); color: #fff; }

/* ---------- menu na węższych ekranach desktop ---------- */

.mr-nav__link, .mr-header__phone { white-space: nowrap; }
@media (min-width: 940px) and (max-width: 1179.98px) {
  .mr-header__bar { gap: 24px; }
  .mr-nav { gap: 20px; }
  .mr-nav__link { font-size: 15px; }
  .mr-header__cta { gap: 14px; }
  .mr-header__phone-num { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }
}