/* lifting.css: podrasowanie OBECNEGO wyglądu serwisu (makieta, listopad 2026).
   Ten sam HTML, te same kolory, fonty, zdjęcia i układ; jeden dodatkowy arkusz i mały skrypt.
   Strony mają style inline, dlatego reguły używają !important i selektorów atrybutów. */
:root { --l-krem: #F9F1E7; --l-bez: #E5D3C0; --l-kamel: #C3A489; --l-taupe: #6B5C54; --l-czern: #141414; --l-tekst: #453E38; --l-ease: cubic-bezier(.2, .7, .2, 1); }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }

/* 1. Czytelność bez zmiany charakteru: treść w Jost 400, drobne szarości w taupe */
main p, main li, main [data-lista="faq"] p { font-weight: 400 !important; }
main [style*="color:#8A7E70"], main [style*="color:#8a7e70"] { color: var(--l-taupe) !important; }
main [style*="flex:3 1"] p[data-cms] { line-height: 1.8 !important; }
main [style*="flex:3 1"] p a, main [style*="flex:3 1"] li a { text-decoration: underline !important; text-decoration-color: var(--l-kamel) !important; text-underline-offset: .22em; text-decoration-thickness: 1px; transition: text-decoration-thickness .25s var(--l-ease); }
main [style*="flex:3 1"] p a:hover { text-decoration-thickness: 2px; }

/* 2. Hero: czytelne okruszki i obszar na zdjęciu, spokojny ruch zdjęcia, cena przy przyciskach */
main [style*="position:relative;background:#141414"] nav[aria-label="Okruszki"], main [style*="position:relative;background:#141414"] nav[aria-label="Okruszki"] a { color: rgba(255, 255, 255, .85) !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .45); font-size: 13px !important; }
main [style*="position:relative;background:#141414"] [data-cms="t2"] { color: var(--l-krem) !important; opacity: .92; }
main [style*="position:relative;background:#141414"] img[data-cms="i1"] { animation: lift-oddech 18s var(--l-ease) both; transform-origin: 65% 45%; }
@keyframes lift-oddech { from { transform: scale(1.07); } to { transform: scale(1); } }
.lift-cena-hero { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 22px 0 0; color: var(--l-krem); font-size: 15px; }
.lift-cena-hero b { font: 500 30px/1 'Cormorant Garamond', serif; color: #fff; }
.lift-cena-hero a { color: var(--l-krem); text-decoration: underline; text-decoration-color: var(--l-kamel); text-underline-offset: .25em; }

/* 3. Nawigacja po sekcjach pod zdjęciem: lżejsze rozłożenie długiej strony */
.lift-spis { background: #fff; border-bottom: 1px solid var(--l-bez); }
.lift-spis ul { list-style: none; margin: 0 auto; max-width: 1120px; padding: 0 clamp(16px, 4vw, 40px); display: flex; gap: clamp(18px, 2.6vw, 34px); overflow-x: auto; scrollbar-width: none; }
.lift-spis ul::-webkit-scrollbar { display: none; }
.lift-spis a { display: inline-flex; align-items: center; min-height: 54px; white-space: nowrap; color: var(--l-tekst); text-decoration: none; font-size: 15px; letter-spacing: .01em; box-shadow: inset 0 -2px 0 transparent; transition: color .25s var(--l-ease), box-shadow .25s var(--l-ease); }
.lift-spis a:hover, .lift-spis a.aktywny { color: var(--l-czern); box-shadow: inset 0 -2px 0 var(--l-kamel); }

/* 4. Sekcje treści: wyraźniejszy rytm i oddech między nimi */
main [style*="flex:3 1"] h2[data-cms] { font-size: clamp(27px, 3vw, 36px) !important; line-height: 1.12 !important; margin-top: clamp(44px, 5.4vw, 68px) !important; margin-bottom: 16px !important; letter-spacing: -.005em; }
main [style*="flex:3 1"] div[style*="background:#F9F1E7"][style*="border-radius:6px"] { border: 0 !important; border-left: 2px solid var(--l-kamel) !important; border-radius: 0 6px 6px 0 !important; padding: clamp(22px, 3vw, 32px) !important; margin-top: 36px !important; }
main [data-s10="cera-i-linki"] { margin-top: 36px; padding: 20px 24px; background: var(--l-krem); border-radius: 6px; }
main [data-s10="cera-i-linki"] p { margin: 0 0 6px !important; font-size: 16px !important; }
main [data-s10="cera-i-linki"] p:last-child { margin: 0 !important; }

/* Przeciwwskazania: z czarnego bloku na spokojny krem, większy tekst */
main [style*="flex:3 1"] div[style*="background:#141414"][style*="border-radius:6px"] { background: var(--l-krem) !important; color: var(--l-tekst) !important; border-left: 2px solid var(--l-kamel); border-radius: 0 6px 6px 0 !important; margin-top: 36px !important; }
main [style*="flex:3 1"] div[style*="background:#141414"][style*="border-radius:6px"] li { color: var(--l-tekst) !important; font-size: 15.5px !important; }
main [style*="flex:3 1"] div[style*="background:#141414"][style*="border-radius:6px"] > div:first-of-type { color: var(--l-taupe) !important; }
main [style*="flex:3 1"] div[style*="background:#141414"][style*="border-radius:6px"] p { color: var(--l-taupe) !important; font-size: 14px !important; }

/* FAQ: bez pudełek, linie podziału, płynne otwieranie */
main [data-lista="faq"] { gap: 0 !important; border-top: 1px solid var(--l-bez); }
main [data-lista="faq"] > div { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--l-bez) !important; border-radius: 0 !important; }
main [data-lista="faq"] button { padding-left: 0 !important; padding-right: 0 !important; min-height: 64px; }
main [data-lista="faq"] button span { font-size: 17px !important; }
main [data-lista="faq"] .dcw > div { padding: 0 0 22px !important; animation: lift-wejscie .45s var(--l-ease) both; }

/* Kolumna boczna: cena bardziej wyrazista */
main aside > div > div:first-child [data-price] { font-size: 40px; }
main aside a, main aside button { transition: background-color .25s var(--l-ease), color .25s var(--l-ease), border-color .25s var(--l-ease); }

/* Podobne zabiegi: 3 kolumny, spokojny ruch przy najechaniu */
@media (min-width: 900px) { main div[style*="minmax(240px,1fr)"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; } }
main a.x7 { padding: 22px 22px 20px !important; border-color: var(--l-bez) !important; transition: transform .35s var(--l-ease), border-color .35s var(--l-ease) !important; }
main a.x7:hover { transform: translateY(-3px); border-color: var(--l-kamel) !important; }
main a.x7 > span:first-child { font: 500 21px/1.2 'Cormorant Garamond', serif !important; }
main a.x7 > span:nth-child(2) { color: var(--l-taupe) !important; font-size: 14px !important; line-height: 1.55 !important; }
main [style*="background:#FBF4EA"] { background: var(--l-krem) !important; }
main a.x8 { min-height: 44px; display: inline-flex !important; align-items: center; transition: background-color .25s var(--l-ease), border-color .25s var(--l-ease); }

/* Etykiety pól dokładane skryptem (poza polem akcji, które ma własne) */
.lift-etykieta { display: block; font-size: 13px; color: var(--l-bez); margin: 0 0 6px; }

/* 5. Przejścia sekcji: łagodne wejście treści przy przewijaniu (tylko gdy działa skrypt) */
@keyframes lift-wejscie { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.lift-js .lift-r { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--l-ease), transform .8s var(--l-ease); transition-delay: var(--lift-d, 0ms); }
.lift-js .lift-r.lift-in { opacity: 1; transform: none; }

/* 6. Telefon */
.lift-pasek { display: none; }
@media (max-width: 899px) {
  main [data-hero-cta] { display: grid !important; grid-template-columns: 1fr 1fr; }
  main [data-hero-cta] > a { justify-content: center; padding-left: 12px !important; padding-right: 12px !important; }
  .lift-cena-hero { display: none; }
  .lift-spis a { min-height: 50px; font-size: 15px; }
  main [style*="flex:3 1"] h2[data-cms] { margin-top: 44px !important; }
  main [data-lista="faq"] button span { font-size: 16px !important; }
  .lift-pasek { display: flex; position: fixed; z-index: 80; left: 0; right: 0; bottom: 0; align-items: center; gap: 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .98); border-top: 1px solid var(--l-bez); transform: translateY(110%); transition: transform .4s var(--l-ease); }
  .lift-pasek.widac { transform: none; }
  .lift-pasek .c { flex: 1; min-width: 0; line-height: 1.15; }
  .lift-pasek .c span { display: block; font-size: 13px; color: var(--l-taupe); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .lift-pasek .c b { font: 500 24px/1 'Cormorant Garamond', serif; color: var(--l-czern); }
  .lift-pasek a.r { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 18px; background: var(--l-kamel); color: var(--l-czern); font-size: 15px; font-weight: 500; text-decoration: none; border-radius: 2px; }
  .lift-pasek a.t { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 1px solid var(--l-czern); color: var(--l-czern); border-radius: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pa-panel, .pa-panel:not([hidden]) { animation: none !important; }
  .pa-tab, .pa-btn, .pa-kontakt a, .pa-pole input, .pa-pole select, .pa-pole textarea { transition: none !important; }
  main img[data-cms="i1"], main [data-lista="faq"] .dcw > div { animation: none !important; }
  .lift-js .lift-r { opacity: 1 !important; transform: none !important; transition: none !important; }
  .lift-pasek { transition: none; }
}

/* ===== Pole akcji (#rezerwacja): umów wizytę, zapłać online, zadaj pytanie + dane kliniki ===== */
.pa { margin: 0 auto; padding: clamp(38px, 6vw, 72px) clamp(16px, 4vw, 40px); background: linear-gradient(180deg, #fff 0, var(--l-krem) 26%, var(--l-krem) 74%, #fff 100%); }
.pa > .pa-karta { max-width: 1040px; margin: 0 auto; }
.pa-karta { position: relative; overflow: hidden; background: var(--l-czern); color: var(--l-krem); border-radius: 8px; box-shadow: 0 24px 60px -28px rgba(20, 20, 20, .55); display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-areas: "glowa kontakt" "glowny kontakt"; grid-template-rows: auto 1fr; }
.pa-znak { position: absolute; right: -24px; bottom: -44px; height: 300px; opacity: .06; filter: invert(1); pointer-events: none; z-index: 0; }
.pa-glowa, .pa-glowny, .pa-kontakt { position: relative; z-index: 1; }
.pa-glowa { grid-area: glowa; padding: clamp(26px, 4vw, 44px) clamp(22px, 4vw, 44px) 0; }
.pa-glowny { grid-area: glowny; padding: 22px clamp(22px, 4vw, 44px) clamp(26px, 4vw, 44px); }
.pa-kontakt { grid-area: kontakt; padding: clamp(26px, 4vw, 44px); background: rgba(249, 241, 231, .045); border-left: 1px solid rgba(249, 241, 231, .12); }
.pa-etykieta { font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: var(--l-kamel); margin-bottom: 14px; }
.pa-h2 { font: 500 clamp(27px, 3.4vw, 38px)/1.1 'Cormorant Garamond', serif; margin: 0 0 12px; color: var(--l-krem); }
.pa-lead { margin: 0; font-size: 15px; line-height: 1.65; color: rgba(249, 241, 231, .74); max-width: 46ch; }
.pa-mala { display: block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--l-kamel); margin-bottom: 4px; }

.pa-zakladki { display: flex; gap: 4px; padding: 4px; border: 1px solid rgba(249, 241, 231, .22); border-radius: 6px; margin-bottom: 22px; }
.pa-tab { flex: 1 1 0; min-width: 0; min-height: 48px; padding: 6px 8px; background: transparent; color: var(--l-krem); border: 0; border-radius: 3px; font: 400 15px/1.2 'Jost', sans-serif; cursor: pointer; text-align: center; transition: background-color .3s var(--l-ease), color .3s var(--l-ease); }
.pa-tab:hover { background: rgba(249, 241, 231, .09); }
.pa-tab[aria-selected="true"] { background: var(--l-kamel); color: var(--l-czern); font-weight: 500; }
.pa-tab:focus-visible, .pa-panel:focus-visible { outline: 2px solid var(--l-krem); outline-offset: 2px; }
.pa-panel { outline-offset: 6px; }
.pa-panel:not([hidden]) { animation: pa-wejscie .45s var(--l-ease) both; }
@keyframes pa-wejscie { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

.pa-form { display: flex; flex-direction: column; gap: 14px; }
.pa-rzad { display: flex; flex-wrap: wrap; gap: 14px; }
.pa-rzad > .pa-pole { flex: 1 1 150px; }
.pa-pole { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pa-pole label { font-size: 13px; color: var(--l-bez); }
.pa-pole input, .pa-pole select, .pa-pole textarea { width: 100%; box-sizing: border-box; min-height: 52px; padding: 0 16px; background: rgba(249, 241, 231, .06); color: var(--l-krem); border: 1px solid rgba(249, 241, 231, .26); border-radius: 3px; font: 400 16px/1.3 'Jost', sans-serif; color-scheme: dark; outline: none; transition: border-color .25s var(--l-ease), background-color .25s var(--l-ease); }
.pa-pole textarea { padding: 14px 16px; min-height: 120px; resize: vertical; }
.pa-pole select option { background: var(--l-czern); color: var(--l-krem); }
.pa-pole input:focus, .pa-pole select:focus, .pa-pole textarea:focus { border-color: var(--l-krem); background: rgba(249, 241, 231, .1); box-shadow: 0 0 0 2px rgba(195, 164, 137, .55); }
.pa-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 54px; margin-top: 6px; padding: 0 20px; background: var(--l-kamel); color: var(--l-czern); border: 0; border-radius: 2px; font: 500 16px/1 'Jost', sans-serif; cursor: pointer; transition: background-color .25s var(--l-ease), transform .25s var(--l-ease); }
.pa-btn:hover { background: var(--l-bez); }
.pa-btn:focus-visible { outline: 2px solid var(--l-krem); outline-offset: 3px; }
.pa-nota { margin: 12px 0 0; font-size: 14px; line-height: 1.6; color: rgba(249, 241, 231, .82); text-align: center; }
.pa-form .pa-nota { margin-top: 0; }
.pa-rodo { margin: 0; font-size: 12.5px; line-height: 1.6; color: rgba(249, 241, 231, .62); }
.pa-karta a { color: var(--l-krem); text-decoration: underline; text-decoration-color: var(--l-kamel); text-underline-offset: .22em; }
.pa-komunikat { margin: 0; min-height: 0; font-size: 14px; color: var(--l-bez); }
.pa-komunikat:empty { display: none; }

.pa-podsum { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; padding: 0 0 18px; border-bottom: 1px solid rgba(249, 241, 231, .16); }
.pa-nazwa { display: block; font: 500 26px/1.15 'Cormorant Garamond', serif; color: var(--l-krem); }
.pa-wariant { display: block; margin-top: 4px; font-size: 13px; line-height: 1.5; color: rgba(249, 241, 231, .68); }
.pa-wariant:empty { display: none; }
.pa-podsum-c { text-align: right; flex: 0 0 auto; }
.pa-cena { font: 500 34px/1 'Cormorant Garamond', serif; color: #fff; }
.pa-kroki { list-style: none; margin: 18px 0 20px; padding: 0; display: flex; flex-direction: column; gap: 14px; counter-reset: pa; }
.pa-kroki li { display: grid; grid-template-columns: 30px 1fr; column-gap: 12px; align-items: start; counter-increment: pa; font-size: 15px; line-height: 1.5; color: rgba(249, 241, 231, .78); }
.pa-kroki li::before { content: counter(pa); grid-row: 1 / 3; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--l-kamel); border-radius: 50%; color: var(--l-kamel); font: 500 18px/1 'Cormorant Garamond', serif; }
.pa-kroki li b { font-weight: 500; color: var(--l-krem); }

.pa-adres { font-style: normal; font: 400 20px/1.35 'Cormorant Garamond', serif; color: var(--l-krem); margin: 0 0 22px; }
.pa-adres span { display: block; margin-top: 8px; font: 400 14px/1.5 'Jost', sans-serif; color: rgba(249, 241, 231, .72); }
.pa-lista { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-direction: column; gap: 18px; font-size: 15px; }
.pa-lista a { display: flex; align-items: center; min-height: 44px; width: fit-content; font-size: 16px; }
.pa-lista li > a:nth-of-type(1) { margin-top: 0; }
.pa-godz { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.pa-godz > div { display: flex; justify-content: space-between; gap: 16px; max-width: 260px; }
.pa-godz dt, .pa-godz dd { margin: 0; color: rgba(249, 241, 231, .86); }
.pa-karta a.pa-trasa { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px; border: 1px solid rgba(249, 241, 231, .42); border-radius: 2px; text-decoration: none; font-size: 15px; transition: background-color .25s var(--l-ease), border-color .25s var(--l-ease); }
.pa-karta a.pa-trasa:hover { background: rgba(249, 241, 231, .1); border-color: var(--l-krem); }
.pa-karta a:focus-visible { outline: 2px solid var(--l-krem); outline-offset: 3px; border-radius: 2px; }
.pa-sukces { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 14px; }
.pa-ok { width: 56px; height: 56px; border-radius: 50%; background: var(--l-kamel); display: flex; align-items: center; justify-content: center; }
.pa-sukces-t { font: 500 26px/1.15 'Cormorant Garamond', serif; }
.pa-sukces p { margin: 0; font-size: 15px; max-width: 300px; color: rgba(249, 241, 231, .8); }

@media (max-width: 860px) {
  .pa-karta { grid-template-columns: minmax(0, 1fr); grid-template-areas: "glowa" "glowny" "kontakt"; grid-template-rows: none; }
  .pa-kontakt { border-left: 0; border-top: 1px solid rgba(249, 241, 231, .12); }
  .pa-glowa { padding: 28px 20px 0; } .pa-glowny { padding: 20px 20px 28px; } .pa-kontakt { padding: 28px 20px 32px; }
  .pa-tab { font-size: 14px; padding: 6px 4px; }
  .pa-rzad { gap: 12px; } .pa-rzad > .pa-pole { flex: 1 1 128px; }
  .pa-lista { gap: 14px; } .pa-lista a { min-height: 40px; }
  .pa-podsum-c { text-align: right; }
}

/* Ulepszenie 2: link do pytania w kafelku ceny */
.lift-pytanie-link { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 4px; font-size: 13.5px; color: var(--l-taupe); text-decoration: underline; text-decoration-color: var(--l-kamel); text-underline-offset: .25em; }
.lift-pytanie-link:hover { color: var(--l-czern); }
/* Ulepszenie 3: spis na telefonie, delikatne wygaszenie krawędzi sygnalizuje przewijanie */
@media (max-width: 899px) {
  .lift-spis { position: relative; }
  .lift-spis ul { -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 36px), transparent); scroll-behavior: smooth; padding-right: 40px; }
}

/* ===== Katalog zabiegów (/zabiegi/): klasa html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) dodawana tylko przez lifting.js na stronie katalogu ===== */
@keyframes lift-kart { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes lift-zmiana { from { opacity: .25; } to { opacity: 1; } }
html.lift-kat.lift-js [data-card].lift-r:not(.lift-in), html.lift-kat.lift-js [data-group] > div:first-child.lift-r:not(.lift-in) { opacity: 0; }
html.lift-kat.lift-js [data-card].lift-in, html.lift-kat.lift-js [data-group] > div:first-child.lift-in { animation: lift-kart .7s var(--l-ease) var(--lift-d, 0ms) backwards; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) .lift-zmiana [data-group] { animation: lift-zmiana .45s ease; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card].lift-skryta, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card][hidden] { display: none !important; }

/* Hero katalogu */
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main > div[style*="madaUp"] > div:first-child { padding-bottom: clamp(18px, 2.4vw, 30px) !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main [data-cms="t2"] { color: var(--l-czern) !important; opacity: 1 !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main nav[aria-label="Okruszki"], html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main nav[aria-label="Okruszki"] a { color: var(--l-taupe) !important; font-size: 13px !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main nav[aria-label="Okruszki"] > span { color: var(--l-czern) !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main [data-cms="t3"] { color: var(--l-tekst) !important; }

/* Grupa problemu: nagłówek */
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] { margin-top: clamp(44px, 5.2vw, 76px) !important; scroll-margin-top: 130px; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child { gap: 8px 18px !important; margin-bottom: 22px !important; align-items: baseline !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child > a { font-weight: 500 !important; font-size: clamp(27px, 3.1vw, 38px) !important; line-height: 1.1; letter-spacing: -.005em; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child > span:nth-child(2) { color: var(--l-taupe) !important; font-size: 12px !important; letter-spacing: .14em !important; font-weight: 500; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child > span:last-child { background: linear-gradient(90deg, var(--l-kamel), var(--l-bez) 40%, transparent) !important; opacity: .8; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="list"] > div:first-child { margin-bottom: 0; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-role="resultLabel"] { color: var(--l-taupe) !important; font-size: 14px !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-role="reset"] { color: var(--l-taupe) !important; }

/* Siatka i karta: równe wysokości, wyraźna cena, bez ikon w kółkach */
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div[style*="display:grid"] { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; gap: 16px !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] { gap: 7px !important; padding: 20px 20px 16px !important; border-radius: 6px !important; border-color: var(--l-bez) !important; transition: border-color .3s var(--l-ease), box-shadow .3s var(--l-ease), transform .3s var(--l-ease) !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card]:hover, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card]:focus-visible { transform: translateY(-3px) !important; border-color: var(--l-kamel) !important; box-shadow: 0 16px 30px -20px rgba(69, 62, 56, .4) !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:first-child { justify-content: flex-start !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:first-child > span:first-child { display: none !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:first-child > span:nth-child(2) { font-size: 11.5px !important; letter-spacing: .13em !important; color: var(--l-taupe) !important; font-weight: 500; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > span:nth-of-type(1) { font-family: 'Cormorant Garamond', serif !important; font-size: 23px !important; font-weight: 600 !important; line-height: 1.12 !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > span:nth-of-type(2) { font-size: 14px !important; line-height: 1.55 !important; color: var(--l-taupe) !important; display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child { border-top-color: #EFE3D3 !important; padding-top: 14px !important; align-items: center !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] [data-price] { font-family: 'Cormorant Garamond', serif !important; font-size: 25px !important; font-weight: 600 !important; line-height: 1.05; color: var(--l-czern) !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] [data-price].lift-cena-txt { font-size: 17px !important; line-height: 1.2; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] [data-price] ~ *, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child > span:first-child > span:first-child { font-size: 11px !important; color: var(--l-taupe) !important; letter-spacing: .12em !important; }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child > span:last-child { color: var(--l-taupe) !important; font-size: 13px !important; opacity: .9; transition: color .3s var(--l-ease); }
html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card]:hover > div:last-child > span:last-child { color: var(--l-czern) !important; }

/* Przycisk „Pokaż wszystkie” */
.lift-wiecej { display: flex; justify-content: center; margin-top: 24px; }
.lift-wiecej.lift-off { display: none; }
.lift-wiecej button { min-height: 48px; padding: 0 30px; background: transparent; color: var(--l-czern); border: 1px solid var(--l-kamel); border-radius: 2px; font: 500 15px 'Jost', sans-serif; letter-spacing: .02em; cursor: pointer; transition: background-color .3s var(--l-ease), color .3s var(--l-ease); }
.lift-wiecej button:hover { background: var(--l-kamel); }
.lift-wiecej button:focus-visible { outline: 2px solid var(--l-kamel); outline-offset: 3px; }

/* Pasek filtrów na desktopie: niższy, spokojniejszy; po przewinięciu zwija się do jednego wiersza (kategorie wracają po najechaniu) */
@media (min-width: 761px) and (min-height: 501px) {
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="wrap"] { background: rgba(20, 20, 20, .94) !important; box-shadow: 0 18px 34px -30px rgba(20, 20, 20, .8) !important; border-top-color: rgba(195, 164, 137, .18) !important; border-bottom: 0 !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="row"] { padding-top: 9px !important; padding-bottom: 9px !important; gap: 8px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="row"] input, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="row"] select { padding-top: 9px !important; padding-bottom: 9px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="chips"] { position: absolute; left: 0; right: 0; top: 100%; flex-wrap: nowrap !important; overflow-x: auto; padding-top: 0 !important; padding-bottom: 10px !important; background: rgba(20, 20, 20, .94); max-width: none !important; scrollbar-width: none; transition: opacity .35s var(--l-ease), transform .35s var(--l-ease); box-shadow: 0 18px 30px -26px rgba(20, 20, 20, .8); }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="chips"]::-webkit-scrollbar { display: none; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="chips"] > button { flex: 0 0 auto; padding: 6px 14px !important; font-size: 12.5px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="list"] { margin-top: 52px !important; }
  html.lift-kat.lift-zwin [data-fbar="chips"] { opacity: 0; transform: translateY(-8px); pointer-events: none; }
  html.lift-kat.lift-zwin [data-fbar="wrap"]:hover [data-fbar="chips"], html.lift-kat.lift-zwin [data-fbar="wrap"]:focus-within [data-fbar="chips"] { opacity: 1; transform: none; pointer-events: auto; }
}

/* Telefon: kompaktowa karta (nazwa i cena w jednym wierszu, opis do 2 linii) i hero do lewej */
@media (max-width: 760px) {
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main > div[style*="madaUp"] > div:first-child { text-align: left !important; padding-top: 26px !important; padding-bottom: 6px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main > div[style*="madaUp"] > div:first-child > div:first-child { justify-content: flex-start; margin-bottom: 10px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main > div[style*="madaUp"] > div:first-child > div:first-child > span[style*="width:26px"] { display: none !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main [data-cms="t2"] { font-size: 36px !important; margin-bottom: 10px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) main [data-cms="t3"] { font-size: 15.5px !important; line-height: 1.55 !important; margin: 0 !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="list"] { padding-top: 16px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] { margin-top: 36px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child { margin-bottom: 14px !important; gap: 4px 12px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child > a { font-size: 28px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div:first-child > span:last-child { flex-basis: 100%; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-group] > div[style*="display:grid"] { grid-template-columns: 1fr !important; gap: 10px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cat more" "name price" "desc desc"; column-gap: 12px; row-gap: 3px !important; padding: 14px 16px !important; align-items: baseline; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:first-child, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child { display: contents !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:first-child > span:nth-child(2) { grid-area: cat; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > span:nth-of-type(1) { grid-area: name; font-size: 21px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > span:nth-of-type(2) { grid-area: desc; font-size: 14px !important; line-height: 1.45 !important; margin-top: 2px; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child > span:first-child { grid-area: price; display: block !important; text-align: right; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child > span:first-child > span:first-child { display: none !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] [data-price] { font-size: 21px !important; white-space: nowrap; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] [data-price].lift-cena-txt { font-size: 15px !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card] > div:last-child > span:last-child { grid-area: more; justify-self: end; font-size: 12.5px !important; }
  .lift-wiecej { margin-top: 16px; }
  .lift-wiecej button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html.lift-kat.lift-js [data-card].lift-r:not(.lift-in), html.lift-kat.lift-js [data-group] > div:first-child.lift-r:not(.lift-in) { opacity: 1 !important; }
  html.lift-kat.lift-js [data-card].lift-in, html.lift-kat.lift-js [data-group] > div:first-child.lift-in, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) .lift-zmiana [data-group] { animation: none !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card], html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card]:hover, html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-fbar="chips"], .lift-wiecej button { transition: none !important; transform: none !important; }
  html:is(.lift-kat,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="/zabiegi/"]))) [data-card]:hover { transform: none !important; }
}


/* ===== Część: globalne (scalone 12.11.2026 z czesci/globalne.css) ===== */
/* globalne.css: lifting elementow wspolnych (naglowek z mega-menu, szuflada, stopka, baner cookies).
   Klasa na html: lift-glob (dodaje globalne.js). Bez zmiany tresci i linkow; nowe elementy dodaje JS. */
html.lift-glob { --g-ease: cubic-bezier(.2, .7, .2, 1); --g-krem: #F9F1E7; --g-bez: #E5D3C0; --g-kamel: #C3A489; --g-taupe: #6B5C54; --g-czern: #141414; --g-tekst: #453E38; }

/* ===== 1. Naglowek ===== */
.lift-glob header[data-nav] { transition: box-shadow .35s var(--g-ease), background-color .35s var(--g-ease); }
.lift-glob header[data-nav].g-przewiniety { box-shadow: 0 14px 30px -24px rgba(20, 20, 20, .45); }
.lift-glob header[data-nav] a.x1, .lift-glob header[data-nav] button.x1 { transition: color .25s var(--g-ease), border-color .25s var(--g-ease) !important; }
.lift-glob header[data-nav] [data-nv="d"] nav > a.x1:hover, .lift-glob header[data-nav] [data-nv="d"] nav > button.x1:hover { color: var(--g-czern) !important; border-bottom-color: var(--g-kamel) !important; }
.lift-glob header[data-nav] button.x1 svg { transition: transform .3s var(--g-ease); }
.lift-glob header[data-nav] a[href^="tel:"] { transition: background-color .3s var(--g-ease), color .3s var(--g-ease), border-color .3s var(--g-ease), transform .3s var(--g-ease) !important; }

/* przycisk Umow wizyte (desktop, dodany przez JS): kamel, ta sama waga co telefon */
.lift-glob .g-umow { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; padding: 10px 18px; border-radius: 2px; font-size: 13px; letter-spacing: .05em; margin-left: 4px; background: var(--g-kamel); color: var(--g-czern); border: 1px solid var(--g-kamel); text-decoration: none; transition: background-color .3s var(--g-ease), border-color .3s var(--g-ease), transform .3s var(--g-ease); }
.lift-glob .g-umow:hover { background: #D1B79F; border-color: #D1B79F; transform: translateY(-1px); }
.lift-glob .g-umow:focus-visible, .lift-glob .g-trasa:focus-visible, .lift-glob .g-acc:focus-visible { outline: 2px solid var(--g-kamel); outline-offset: 2px; }
.lift-glob header[data-nav] [data-nv="d"] nav .g-umow + a[href^="tel:"] { margin-left: 0; }
@media (min-width: 941px) and (max-width: 1180px) {
  .lift-glob .g-umow { padding: 10px 13px; letter-spacing: .02em; }
  .lift-glob header[data-nav] [data-nv="d"] nav { gap: clamp(6px, 1vw, 14px) !important; }
  .lift-glob header[data-nav] [data-nv="d"] nav > a[href^="tel:"] { padding: 10px 13px !important; letter-spacing: .02em !important; }
}

/* mega-menu: wejscie przez przezroczystosc i lekkie przesuniecie (panele przelaczane atrybutem hidden) */
@keyframes g-mega { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes g-szuflada { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes g-tlo { from { opacity: 0; } to { opacity: 1; } }
.lift-glob header[data-nav] [data-if^="show"]:not([hidden]) > div { animation: g-mega .3s var(--g-ease) both; }
.lift-glob header[data-nav] [data-if^="show"] a.x1 { transition: color .22s var(--g-ease), padding-left .28s var(--g-ease), border-color .22s var(--g-ease) !important; }
.lift-glob header[data-nav] [data-if^="show"] a.x1:hover { padding-left: 6px !important; color: var(--g-czern) !important; }

/* ===== 2. Szuflada na telefonie ===== */
.lift-glob header[data-nav] [data-if="drawerShown"]:not([hidden]) > div { animation: g-szuflada .32s var(--g-ease) both; padding-bottom: 0 !important; overscroll-behavior: contain; }
.lift-glob [data-menu-tlo]:not([hidden]) { animation: g-tlo .3s ease both; }
.lift-glob header[data-nav] [data-if="drawerShown"] a { min-height: 48px; box-sizing: border-box; }
.lift-glob header[data-nav] [data-if="drawerShown"] div[style*="flex-wrap:wrap"] a { display: inline-flex; align-items: center; padding: 10px 16px !important; }
.lift-glob header[data-nav] [data-if="drawerShown"] div[style*="flex-wrap:wrap"] { gap: 8px !important; }
.lift-glob header[data-nav] [data-act="toggleDrawer"] { width: 48px !important; height: 48px !important; }
.g-akcje { position: sticky; bottom: 0; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 calc(-1 * clamp(16px, 4vw, 40px)); padding: 14px clamp(16px, 4vw, 40px) calc(14px + env(safe-area-inset-bottom)); background: var(--g-krem); border-top: 1px solid var(--g-bez); box-shadow: 0 -16px 22px -18px rgba(20, 20, 20, .28); }
.lift-glob .g-akcje a { margin: 0 !important; display: flex !important; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 12px 10px !important; border-radius: 2px; font-size: 15px !important; text-decoration: none; white-space: nowrap; border: 1px solid var(--g-czern); box-sizing: border-box; }
.lift-glob .g-akcje .g-zadzwon { background: var(--g-czern) !important; color: var(--g-krem) !important; }
.lift-glob .g-akcje .g-umow { background: var(--g-kamel); color: var(--g-czern); border-color: var(--g-kamel); letter-spacing: .01em; }
@media (max-width: 360px) { .lift-glob .g-akcje a { font-size: 14px !important; gap: 6px; } .lift-glob .g-akcje a svg { display: none; } }

/* ===== 3. Stopka ===== */
.g-kontakt, .g-trasa-desk { display: none; }
.lift-glob footer a.x4, .lift-glob footer .g-acc { transition: color .25s var(--g-ease); }
.lift-glob footer a.x4:hover { color: #F9F1E7 !important; }
.lift-glob .g-trasa { display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
@media (min-width: 761px) {
  .lift-glob .g-trasa-desk { display: inline-flex; align-items: center; color: var(--g-kamel); font-size: 14px; text-decoration: underline; text-underline-offset: .25em; text-decoration-color: rgba(195, 164, 137, .5); }
  .lift-glob .g-trasa-desk:hover { color: #F9F1E7; }
}
@media (max-width: 760px) {
  .lift-glob footer > div { padding: 34px 18px 28px !important; }
  .lift-glob footer .g-siatka { gap: 0 !important; }
  .lift-glob .g-kontakt { display: block; padding: 4px 0 24px; }
  .lift-glob .g-kontakt .g-adres { margin: 0 0 14px; font-size: 14px; color: #C6BCA9; line-height: 1.5; }
  .lift-glob .g-kontakt .g-rzad { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .lift-glob .g-kontakt .g-rzad a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 10px 8px; border-radius: 2px; font-size: 14.5px; text-decoration: none; box-sizing: border-box; }
  .lift-glob .g-kontakt .g-tel { background: var(--g-kamel); color: var(--g-czern); border: 1px solid var(--g-kamel); }
  .lift-glob .g-kontakt .g-trasa { background: transparent; color: #F9F1E7; border: 1px solid #6B5C54; }
  .lift-glob .g-kontakt .g-godz { margin: 14px 0 0; font-size: 13.5px; line-height: 1.6; color: #A99C8B; display: flex; flex-wrap: wrap; gap: 0 16px; }
  .lift-glob .g-kontakt .g-godz span { white-space: nowrap; }
  .lift-glob footer .g-siatka > div:first-child { margin-bottom: 4px; }
  .lift-glob footer .g-siatka > div:first-child > div { margin-bottom: 0 !important; }
  .lift-glob footer .g-siatka > div:first-child > div img { height: 34px !important; }
  /* akordeony */
  .lift-glob footer .g-acc { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 56px; padding: 0; background: none; border: 0; border-top: 1px solid #2A2018; color: #C3A489; font: inherit; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; text-align: left; cursor: pointer; }
  .lift-glob footer .g-acc svg { flex: 0 0 auto; transition: transform .3s var(--g-ease); }
  .lift-glob footer .g-acc[aria-expanded="true"] svg { transform: rotate(180deg); }
  .lift-glob footer .g-acc-wrap { margin: 0 !important; padding: 0 !important; border: 0 !important; }
  .lift-glob footer .g-panel { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .38s var(--g-ease), visibility 0s linear .38s; }
  .lift-glob footer .g-panel.otwarty { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows .38s var(--g-ease), visibility 0s; }
  .lift-glob footer .g-panel > .g-in { min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
  .lift-glob footer .g-panel.otwarty > .g-in { padding-bottom: 12px; }
  .lift-glob footer .g-panel .g-in > address { margin: 0; }
  .lift-glob footer .g-panel .g-in > dl, .lift-glob footer .g-panel .g-in > p { margin-top: 10px !important; }
  .lift-glob footer > div > div:last-child { margin-top: 26px !important; padding-top: 18px !important; flex-direction: column; gap: 8px !important; font-size: 13px !important; }
  .lift-glob footer a.x4 { font-size: 14.5px !important; }
}

/* ===== 4. Baner cookies ===== */
@keyframes g-baner { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
html:not(.lift-awaria) .cc-baner .cc-karta { animation: g-baner .45s var(--g-ease) both; }
html:not(.lift-awaria) .cc-baner .cc-przycisk { transition: background-color .25s var(--g-ease), border-color .25s var(--g-ease); }
@media (max-width: 600px) {
  html:not(.lift-awaria) .cc-baner { padding: 6px; }
  html:not(.lift-awaria) .cc-baner .cc-karta { padding: 12px 14px 12px; gap: 8px; display: grid; grid-template-columns: 1fr auto; align-items: center; }
  html:not(.lift-awaria) .cc-baner .cc-tresc { grid-column: 1 / -1; display: contents; }
  html:not(.lift-awaria) .cc-baner .cc-tytul { grid-column: 1; grid-row: 1; font-size: 17px; margin: 0; }
  html:not(.lift-awaria) .cc-baner .cc-tekst { grid-column: 1 / -1; grid-row: 2; font-size: 12px; line-height: 1.42; }
  html:not(.lift-awaria) .cc-baner .cc-akcje { display: contents; }
  html:not(.lift-awaria) .cc-baner .cc-link { grid-column: 2; grid-row: 1; flex: none; min-height: 44px; margin: -8px -6px -8px 0; padding: 0 6px; font-size: 13px; }
  html:not(.lift-awaria) .cc-baner .cc-przycisk { grid-row: 3; min-height: 44px; padding: 8px 6px; font-size: 13px; }
  html:not(.lift-awaria) .cc-baner .cc-przycisk:nth-of-type(1) { grid-column: 1; }
  html:not(.lift-awaria) .cc-baner .cc-przycisk:nth-of-type(2) { grid-column: 2; }
}
@media (max-width: 600px) { html:not(.lift-awaria) .cc-baner .cc-karta { grid-template-columns: 1fr 1fr; } html:not(.lift-awaria) .cc-baner .cc-link { justify-self: end; } html:not(.lift-awaria) .cc-baner .cc-tytul { grid-column: 1; } }

/* ===== 5. Ruch wylaczony na zyczenie ===== */
@media (prefers-reduced-motion: reduce) {
  .lift-glob header[data-nav], .lift-glob header[data-nav] *, .lift-glob footer *, .lift-glob .g-akcje, .lift-glob .g-umow, .lift-glob [data-menu-tlo], html.lift-glob .cc-baner * { animation: none !important; transition: none !important; }
}


/* ===== Część: glowna (scalone 12.11.2026 z czesci/glowna.css) ===== */
/* glowna.css: lifting strony głównej (klasa html:is(.lift-glowna,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"])))). Paleta marki, bez nowych kolorów. */
html:is(.lift-glowna,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) { --g-ease: cubic-bezier(.2, .7, .2, 1); }

/* Pas wejść: biały panel unosi się nad dolną krawędzią hero */
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-pas { position: relative; z-index: 3; margin-top: -30px; padding: 0 clamp(16px, 4vw, 40px); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-pas-in { max-width: 1220px; margin: 0 auto; background: #fff; border: 1px solid #E5D3C0; border-radius: 4px; box-shadow: 0 22px 44px -26px rgba(20, 20, 20, .55); padding: 4px clamp(16px, 2.4vw, 32px) 0; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia { display: grid; grid-template-columns: repeat(4, 1fr); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 0 clamp(8px, 1.6vw, 22px); font: 500 clamp(21px, 1.9vw, 25px)/1.1 'Cormorant Garamond', serif; color: #141414; text-decoration: none; border-left: 1px solid #E5D3C0; transition: color .3s var(--g-ease), background-color .3s var(--g-ease); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:first-child { border-left: 0; padding-left: 0; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a::after { content: "\2192"; font: 400 17px/1 'Jost', system-ui, sans-serif; color: #C3A489; transition: transform .3s var(--g-ease); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:hover { color: #6B5C54; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:hover::after { transform: translateX(4px); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:focus-visible { outline: 2px solid #C3A489; outline-offset: -2px; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-info { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 13px 0 15px; border-top: 1px solid #E5D3C0; font-size: 14.5px; line-height: 1.5; color: #453E38; font-weight: 400; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-info span + span::before { content: ""; display: inline-block; width: 1px; height: 12px; margin: 0 16px; background: #C3A489; vertical-align: -1px; }

/* Wybór obszaru: z ciężkiej czerni na krem */
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary { background: #F9F1E7 !important; color: #141414 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary > img { filter: none !important; opacity: .05 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary > div { padding-top: clamp(56px, 7vw, 100px) !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary [style*="C6BCA9"] { color: #554D48 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary [style*="201A14"] { background: #fff !important; border-color: #E5D3C0 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary [style*="201A14"] [style*="color: #C3A489"] { color: #6B5C54 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[style*="E9DFCF"] { color: #453E38 !important; background: #F9F1E7 !important; border: 1px solid #E5D3C0 !important; transition: background-color .25s var(--g-ease), border-color .25s var(--g-ease), color .25s var(--g-ease); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[style*="E9DFCF"]:hover { background: #141414 !important; border-color: #141414 !important; color: #F9F1E7 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[data-cms="l3"] { background: #141414 !important; color: #F9F1E7 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[data-cms="l4"] { color: #141414 !important; border-color: #C3A489 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[data-cms="l4"]:hover { background: #E5D3C0 !important; }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) main > :is(#top, .lg-pas) + div { border-top: 1px solid #E5D3C0; }

/* Spokojny ruch zdjęcia sekcji o nas */
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #o-nas img { transition: transform 1.6s var(--g-ease); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-r img { transform: scale(1.035); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-in img { transform: none; }

/* Łagodne wejścia sekcji */
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-r { opacity: 0; transform: translateY(22px); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-r, :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-in { transition: opacity .9s var(--g-ease), transform .9s var(--g-ease); transition-delay: var(--lg-d, 0ms); }
:is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-r { opacity: 1 !important; transform: none !important; transition: none !important; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-r img { transform: none !important; }
}

/* Telefon */
@media (max-width: 700px) {
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top, :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top > div[style*="z-index: 2"] { min-height: clamp(480px, 78svh, 900px) !important; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top > div[style*="z-index: 2"] > div[style*="flex-wrap: wrap"] { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px !important; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top > div[style*="z-index: 2"] > div[style*="flex-wrap: wrap"] > span { display: none; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top a.x2, :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top a[href="#kontakt"] { justify-content: center; min-height: 52px; padding: 0 10px !important; gap: 8px !important; font-size: 15px !important; box-sizing: border-box; text-align: center; }
  /* Karuzela: dyskretne strzałki i punkty w jednym rzędzie, cele dotyku 44 px */
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top > div[style*="z-index: 2"] > div[style*="flex-wrap: wrap"] > div { grid-column: 1 / -1; justify-content: center; gap: 0 !important; margin-top: 2px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top button[data-act="prevSlide"], :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top button[data-act="nextSlide"] { width: 44px !important; height: 44px !important; border: 0 !important; background: transparent !important; opacity: .6; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top button[data-role="dot"] { position: relative; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top button[data-role="dot"]::before { content: ""; position: absolute; inset: -18px -8px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #top div:has(> button[data-role="dot"]) { gap: 16px !important; padding: 0 6px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-pas { margin-top: -22px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia { grid-template-columns: 1fr 1fr; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a { min-height: 56px; font-size: 21px; padding: 0 4px 0 0; border-left: 0; border-bottom: 1px solid #E5D3C0; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:nth-child(even) { border-left: 1px solid #E5D3C0; padding-left: 16px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-wejscia a:nth-child(n+3) { border-bottom: 0; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-info { flex-direction: column; font-size: 14px; padding: 12px 0 14px; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) .lg-info span + span::before { display: none; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary a[style*="E9DFCF"] { min-height: 44px; display: inline-flex !important; align-items: center; padding: 0 16px !important; }
  :is(.lift-glowna,:where(html:not(.lift-awaria):has(>head>link[rel=canonical][href$="klinikamada.pl/"]))) #obszary [style*="201A14"] > div:last-child { gap: 8px !important; }
}


/* ===== Część: huby (scalone 12.11.2026 z czesci/huby.css) ===== */
/* huby.css: lifting przewodników (problem-oznaki-starzenia, problem-cellulit, cera-wrazliwa, marka-mesoestetic).
   Klasa html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) dodawana tylko przez huby.js. Paleta i kroje marki bez zmian; ten sam język co lifting.css. */
@keyframes lift-hub-w { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* 1. Nagłówek: jedna rodzina (okruszki, nadtytuł, H1, lead, działanie), te same proporcje na czterech stronach */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main h1 { font-size: clamp(34px, 5vw, 58px) !important; line-height: 1.04 !important; letter-spacing: -.008em; margin-bottom: 0 !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main span[data-cms="t1"] { letter-spacing: .24em !important; font-weight: 500 !important; font-size: 12px !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main span[data-cms="t1"] ~ *, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main div > span[style*="width:26px"] { }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main div > span[style*="width:26px"] { width: 34px !important; }
html:is(.lift-huby:not(.lift-huby-marka),:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])))) main p[data-cms="t3"], html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main p[data-cms="t4"][style*="font-size:16.5px"]:first-of-type { font-size: 17px !important; line-height: 1.74 !important; max-width: 64ch !important; color: var(--l-tekst) !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main p[data-cms="t4"] { font-size: 17px !important; line-height: 1.74 !important; margin-bottom: 0 !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main p[style*="font-style:italic"]:empty { display: none; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [data-technologie] { margin-top: 12px !important; }
/* zdjęcie nagłówka (oznaki, cellulit): niższe, równe z resztą */
html:is(.lift-huby-foto,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):has(main img[data-cms="i1"]))) main div[style*="min-height:clamp(420px"] { min-height: clamp(300px, 30vw, 390px) !important; padding-bottom: clamp(26px, 3.4vw, 40px) !important; }
html:is(.lift-huby-foto,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):has(main img[data-cms="i1"]))) main div[style*="min-height:clamp(420px"] > div { padding-top: clamp(26px, 4vw, 48px) !important; }
/* nagłówek kremowy (cera, marka): bez pustego pasa pod spodem */
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main > div > div:first-child { padding-bottom: clamp(12px, 2vw, 22px) !important; }
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main > div > div:nth-child(2) { padding-top: clamp(4px, 1vw, 12px) !important; }
/* marka: szerszy układ jak w pozostałych, tekst w wąskiej kolumnie */
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] { max-width: 1120px !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] > *:not([data-marka-zabiegi]):not([style*="height:clamp(230px"]):not(.lift-hub-akcje) { max-width: 760px; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main div[style*="width:96px"], html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main span[style*="width:96px"] { width: 72px !important; height: 72px !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main div[style*="gap:20px"] { gap: 16px !important; margin-bottom: 18px !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main div[style*="height:clamp(230px"] { height: clamp(190px, 25vw, 320px) !important; margin: 30px 0 !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hub-stare { display: none !important; }

/* kremowe nagłówki: lifting.css maluje okruszki i H1 jasno (pod zdjęcie), tu tło jest kremowe */
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main [data-cms="t2"], html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main [data-cms="t2"] { color: var(--l-czern) !important; opacity: 1 !important; }
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main nav[aria-label="Okruszki"], html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main nav[aria-label="Okruszki"] a, html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main nav[aria-label="Okruszki"], html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main nav[aria-label="Okruszki"] a { color: var(--l-taupe) !important; }
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main nav[aria-label="Okruszki"] > span, html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main nav[aria-label="Okruszki"] > span { color: var(--l-czern) !important; }

/* Działanie w nagłówku */
.lift-hub-akcje { margin: 22px 0 0; }
.lift-hub-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.lift-hub-cta a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 26px; border-radius: 2px; font: 500 15px 'Jost', sans-serif; letter-spacing: .01em; text-decoration: none; transition: background-color .3s var(--l-ease), color .3s var(--l-ease), border-color .3s var(--l-ease); }
.lift-hub-b1 { background: var(--l-czern); color: var(--l-krem); border: 1px solid var(--l-czern); }
.lift-hub-b1:hover { background: var(--l-taupe); border-color: var(--l-taupe); }
.lift-hub-b2 { background: transparent; color: var(--l-czern); border: 1px solid var(--l-kamel); }
.lift-hub-b2:hover { background: var(--l-kamel); }
.lift-hub-cta a:focus-visible, .lift-hub-kat:focus-visible, .lift-wiecej button:focus-visible { outline: 2px solid var(--l-kamel); outline-offset: 3px; }
.lift-hub-kat { display: inline-flex; align-items: center; min-height: 44px; margin-top: 6px; font-size: 14.5px; color: var(--l-taupe); text-decoration: underline; text-decoration-color: var(--l-kamel); text-underline-offset: .25em; text-decoration-thickness: 1px; }
.lift-hub-kat:hover { color: var(--l-czern); text-decoration-thickness: 2px; }

/* 2. Nagłówki grup: rytm i oddech */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] { margin-top: clamp(34px, 4.4vw, 56px) !important; scroll-margin-top: 96px; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child { gap: 6px 16px !important; margin-bottom: 20px !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child h2 { font-weight: 500 !important; font-size: clamp(25px, 2.9vw, 34px) !important; line-height: 1.1; letter-spacing: -.005em; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child > span:nth-of-type(1) { color: var(--l-taupe) !important; font-size: 12px !important; letter-spacing: .14em !important; font-weight: 500; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child > span:last-child { background: linear-gradient(90deg, var(--l-kamel), var(--l-bez) 40%, transparent) !important; opacity: .8; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [data-marka-zabiegi] { margin-top: clamp(34px, 4.4vw, 56px) !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [data-s10] > h2 { scroll-margin-top: 96px; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hr { opacity: 0; transform: translateY(12px); transition: opacity .7s var(--l-ease), transform .7s var(--l-ease); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hr.lift-hr-in { opacity: 1; transform: none; }

/* 3. Siatka i karta zabiegu: jak w katalogu, z ceną */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hub-siatka { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; gap: 16px !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto 1fr auto; grid-template-areas: "cat cat" "name name" "desc desc" "cena strz"; row-gap: 7px !important; column-gap: 12px; padding: 20px 20px 16px !important; border-radius: 6px !important; border-color: var(--l-bez) !important; background: #fff !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(1) { grid-area: cat; font: 500 11.5px/1.3 'Jost', sans-serif !important; letter-spacing: .13em !important; color: var(--l-taupe) !important; text-transform: uppercase; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(2) { grid-area: name; font: 600 23px/1.12 'Cormorant Garamond', serif !important; color: var(--l-czern) !important; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(3) { grid-area: desc; font-size: 14px !important; line-height: 1.55 !important; color: var(--l-taupe) !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7[data-cena]::before, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::after { border-top: 1px solid #EFE3D3; padding-top: 13px; margin-top: 7px; align-self: end; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7[data-cena]::before { grid-area: cena; font: 600 24px/1.05 'Cormorant Garamond', serif; color: var(--l-czern); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7[data-cena-txt]::before { font: 500 14px/1.4 'Jost', sans-serif; color: var(--l-taupe); padding-top: 14px; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::after { grid-area: strz; color: var(--l-taupe); font-size: 16px; line-height: 1.3; padding-top: 14px; transition: transform .3s var(--l-ease), color .3s var(--l-ease); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:not([data-cena])::after { grid-area: 4 / 1 / 5 / -1; text-align: right; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:hover::after { transform: translateX(4px); color: var(--l-czern); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:hover, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:focus-visible { transform: translateY(-3px); border-color: var(--l-kamel) !important; box-shadow: 0 16px 30px -20px rgba(69, 62, 56, .4); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8 { transition: border-color .3s var(--l-ease), box-shadow .3s var(--l-ease), transform .3s var(--l-ease), background-color .3s var(--l-ease) !important; }
html.lift-huby.lift-js main a.x7.lift-r:not(.lift-in), html.lift-huby.lift-js main a.x8.lift-r:not(.lift-in) { opacity: 0; }
html.lift-huby.lift-js main a.x7.lift-r.lift-in, html.lift-huby.lift-js main a.x8.lift-r.lift-in { animation: lift-hub-w .7s var(--l-ease) var(--lift-d, 0ms) backwards; }

/* Marka: pastylki zabiegów jako zwarte wiersze z ceną */
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main [data-marka-zabiegi] > div { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8 { display: flex !important; align-items: center; justify-content: space-between; gap: 14px; min-height: 60px; padding: 12px 18px !important; border-radius: 6px !important; border-color: var(--l-bez) !important; font-size: 15.5px !important; line-height: 1.3; color: var(--l-czern) !important; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8:hover, html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8:focus-visible { border-color: var(--l-kamel) !important; background: #fff !important; box-shadow: 0 14px 26px -20px rgba(69, 62, 56, .4); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8[data-cena]::before { margin-left: auto; flex: 0 0 auto; font: 600 20px/1 'Cormorant Garamond', serif; color: var(--l-czern); white-space: nowrap; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8[data-cena-txt]::before { font: 500 12.5px/1.3 'Jost', sans-serif; color: var(--l-taupe); white-space: normal; text-align: right; max-width: 9em; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8::after { color: var(--l-taupe); transition: transform .3s var(--l-ease); }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8:hover::after { transform: translateX(4px); }

/* Skrót długich list: „Pokaż wszystkie (N)”, linki zostają w HTML */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-wiecej { display: none; margin-top: 24px; }
@media (min-width: 761px) {
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-wiecej.lift-w-d { display: flex; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hub-g.lift-g-d:not(.lift-otwarta) > .lift-x { display: none !important; }
}
@media (max-width: 760px) {
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-wiecej.lift-w-m { display: flex; margin-top: 14px; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hub-g.lift-g-m:not(.lift-otwarta) > .lift-xm { display: none !important; }
}

/* 4. Telefon: krótsza strona, zwarte karty (nazwa i cena w jednym wierszu), cele dotyku min. 44 px */
@media (max-width: 760px) {
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main h1 { font-size: 36px !important; }
  html:is(.lift-huby-foto,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):has(main img[data-cms="i1"]))) main div[style*="min-height:clamp(420px"] { min-height: 270px !important; }
  html:is(.lift-huby-foto,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):has(main img[data-cms="i1"]))) main div[style*="min-height:clamp(420px"] > div { padding-top: 22px !important; }
  html:is(.lift-huby-foto,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):has(main img[data-cms="i1"]))) main div[style*="background:#FBF4EA"] > div { padding-top: 22px !important; padding-bottom: 26px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main p[data-cms="t3"], html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main p[data-cms="t4"] { font-size: 16px !important; line-height: 1.65 !important; }
  html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main div[style*="height:clamp(230px"] { height: 180px !important; margin: 24px 0 !important; }
  .lift-hub-akcje { margin-top: 18px; }
  .lift-hub-cta { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .lift-hub-cta a { min-height: 50px; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="flex:3 1"] h2[data-cms], html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [data-s10] > h2 { margin-top: 36px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] { margin-top: 32px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child { margin-bottom: 14px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child h2 { font-size: 26px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main [style*="margin-top:clamp(24px"] > div:first-child > span:last-child { display: none; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-hub-siatka { grid-template-columns: 1fr !important; gap: 10px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto; grid-template-areas: "name cena" "desc desc"; padding: 14px 16px !important; row-gap: 3px !important; align-items: baseline; min-height: 56px; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(1) { display: none; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-mix a.x7 { grid-template-areas: "cat cat" "name cena" "desc desc"; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-mix a.x7 > span:nth-child(1) { display: block; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(2) { font-size: 20px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7 > span:nth-child(3) { font-size: 13.5px !important; line-height: 1.4 !important; -webkit-line-clamp: 1; line-clamp: 1; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7[data-cena]::before { border: 0; padding: 0; margin: 0; align-self: baseline; font-size: 19px; white-space: nowrap; text-align: right; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7[data-cena-txt]::before { font-size: 12.5px; white-space: normal; max-width: 8em; padding: 0; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::after { display: none; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:hover { transform: none; }
  html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main [data-marka-zabiegi] > div { grid-template-columns: 1fr; gap: 8px !important; }
  html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8 { min-height: 56px; padding: 10px 16px !important; font-size: 15px !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8::after { display: none; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) .lift-wiecej button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html.lift-huby.lift-js main a.x7.lift-r:not(.lift-in), html.lift-huby.lift-js main a.x8.lift-r:not(.lift-in) { opacity: 1 !important; }
  html.lift-huby.lift-js main a.x7.lift-r.lift-in, html.lift-huby.lift-js main a.x8.lift-r.lift-in { animation: none !important; }
  html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:hover, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::after, .lift-hub-cta a, .lift-hr { transition: none !important; transform: none !important; }
  .lift-hr { opacity: 1 !important; }
}
html:is(.lift-huby-krem,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])):not(:has(main img[data-cms="i1"])))) main h1 + p[data-cms="t3"] { margin-top: 20px !important; }


/* ===== Rezerwy miejsca (CLS) =====
   1) Przestawienia kolejności (order, display:contents) i reguły układu z gałęzią "przed skryptem" są zwykłymi regułami (bez zapytania):
      bez skryptu nie robią dziur i trzymają układ makiety. Rodzaj strony rozpoznaje canonical w head (bez szukania po całym DOM).
   2) Rezerwy miejsca i wstępne ukrywanie kart czekają na element ze skryptu, więc są w jednym bloku @media (scripting: enabled).
      Bez JS (i w przeglądarkach bez wsparcia tego zapytania) nie ma pustych dziur, a wszystkie karty są widoczne i klikalne.
   Gdy część skryptu zgłosi błąd, lifting.js dodaje do html klasę lift-awaria, która wyłącza gałęzie "przed skryptem" i rezerwy. */

/* Strona główna: kolejność wizualna przez CSS (HTML bez zmian): hero, pas wejść, „Od czego chcesz zacząć”, reszta */
main:has(> #top):has(> #obszary):has(> #kontakt) { display: flex; flex-direction: column; }
/* elementy z margin:0 auto (np. #technologie) w kolumnie flex nie rozciągają się same: pełna szerokość bez zmiany modelu pudełka */
main:has(> #top):has(> #obszary):has(> #kontakt) > * { width: -webkit-fill-available; width: -moz-available; width: stretch; }
main:has(> #top):has(> #obszary):has(> #kontakt) > #top { order: -3; }
main:has(> #top):has(> #obszary):has(> #kontakt) > .lg-pas { order: -2; }
main:has(> #top):has(> #obszary):has(> #kontakt) > #obszary { order: -1; }

/* Zabieg, telefon: kafel ceny tuż nad treścią, przez order (bez przenoszenia węzła skryptem) */
@media (max-width: 899px) {
  html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main aside, html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main aside > div { display: contents !important; }
  html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main aside > div > div { flex: 1 1 100%; min-width: 0; }
  html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main aside > div > div:first-child { order: -1; }
  html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main aside > div > div:nth-child(n+3) { margin-top: calc(16px - clamp(26px, 4vw, 48px)); }
}

/* Huby: siatka kart także zanim skrypt doda klasę lift-hub-siatka */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main div:has(> a.x7) { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; gap: 16px !important; }
@media (max-width: 760px) { html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main div:has(> a.x7) { grid-template-columns: 1fr !important; gap: 10px !important; } }
/* Marka: zdjęcie za działaniem wizualnie (order), HTML w oryginalnej kolejności */
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] { display: flex; flex-direction: column; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] > [data-cms="t4"] { order: 1; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] > [data-cms="t4"] ~ * { order: 3; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] > .lift-hub-akcje { order: 1; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main > div[style*="max-width:860px"] > div:has(img[data-cms="i1"]) { order: 2; }
/* Strzałka i cena kart przez CSS (pseudo-elementy z content), nie jako tekst wewnątrz linku: tekst kotwicy (nazwa dostępna linku) zostaje taki jak w HTML.
   Cena w atrybucie data-cena ustawianym przez skrypt; content z pustym tekstem alternatywnym po ukośniku wyłącza odczyt przez czytniki. */
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::before, html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8::before { content: attr(data-cena); content: attr(data-cena) / ""; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::after, html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x8::after { content: "\2192"; content: "\2192" / ""; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7::before { grid-area: cena; }
html:is(.lift-huby,:where(:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])))) main a.x7:not([data-cena])::before { display: none; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8::before { order: 2; margin-left: auto; flex: 0 0 auto; font: 600 20px/1 'Cormorant Garamond', serif; color: var(--l-czern); white-space: nowrap; }
html:is(.lift-huby-marka,:where(:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]))) main a.x8::after { order: 3; }

/* ----- Rezerwy i wstępne ukrywanie: tylko gdy skrypty działają ----- */
@media (scripting: enabled) {
  /* główna: pas wejść, wysokość minus zachodzenie na hero: 121,8-30 px (od 734 px), 147,5-30 px (701-733 px), 217-22 px (do 700 px) */
  html:not(.lift-awaria) main:has(> #top):has(> #obszary):has(> #kontakt) > #top:not(:has(+ .lg-pas)) { margin-bottom: 91.8px; }
  /* zabieg: spis sekcji pod hero (55 px desktop, 51 px telefon) i cena pod przyciskami w hero (30 + 22 px, desktop) */
  html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main > div > div:has([data-hero-cta]):not(:has(+ .lift-spis)) { margin-bottom: 55px; }
  /* huby: miejsce na wiersz z ceną, do czasu skryptu (html bez lift-huby): strzałka zajmuje ten sam wiersz (39 px + 7 px odstępu) */
  html:not(.lift-huby):not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])) main a.x7:not([data-cena])::after { box-sizing: border-box; min-height: 39px; }
  html:not(.lift-huby):not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])) main a.x8:not([data-cena])::before { min-width: 70px; }
  @media (min-width: 900px) { html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main:has(aside [data-price]) [data-hero-cta]:not(:has(+ .lift-cena-hero)) { margin-bottom: 52px; } }
  @media (max-width: 899px) { html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/zabieg-"]) main > div > div:has([data-hero-cta]):not(:has(+ .lift-spis)) { margin-bottom: 51px; } }
  @media (min-width: 701px) and (max-width: 733px) { html:not(.lift-awaria) main:has(> #top):has(> #obszary):has(> #kontakt) > #top:not(:has(+ .lg-pas)) { margin-bottom: 117.5px; } }
  @media (max-width: 700px) { html:not(.lift-awaria) main:has(> #top):has(> #obszary):has(> #kontakt) > #top:not(:has(+ .lg-pas)) { margin-bottom: 195px; } }
  /* huby: skrót długich list (desktop: powyżej 5 kart pokazuje 4; marka 6) i miejsce na przycisk „Pokaż wszystkie” (24 + 48 px) oraz na działanie w nagłówku (120 px);
     po skrypcie robią to klasy lift-x i lift-xm z przyciskiem, a przy błędzie skryptu grupy dostają lift-otwarta */
  @media (min-width: 761px) {
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main div:has(> a.x7:nth-of-type(6)):not(.lift-otwarta) > a.x7:nth-of-type(n+5) { display: none !important; }
    html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-marka-zabiegi] div:has(> a.x8:nth-of-type(8)):not(.lift-otwarta) > a.x8:nth-of-type(n+7) { display: none !important; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main div:has(> a.x7:nth-of-type(6)):not(:has(+ .lift-wiecej)) { padding-bottom: 72px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-marka-zabiegi] div:has(> a.x8:nth-of-type(8)):not(:has(+ .lift-wiecej)) { padding-bottom: 72px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main [data-technologie]:not(:has(+ .lift-hub-akcje)), html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-cms="t4"]:not(:has(+ .lift-hub-akcje)) { padding-bottom: 120px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main:not(:has([data-technologie])) p[data-cms="t3"]:not(:has(+ .lift-hub-akcje)) { padding-bottom: 120px; }
  }
  /* telefon: powyżej 4 kart pokazuje 3 (marka: powyżej 6 pokazuje 5), przycisk 14 + 48 px, działanie w nagłówku 178 px */
  @media (max-width: 760px) {
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main div:has(> a.x7:nth-of-type(5)):not(.lift-otwarta) > a.x7:nth-of-type(n+4) { display: none !important; }
    html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-marka-zabiegi] div:has(> a.x8:nth-of-type(7)):not(.lift-otwarta) > a.x8:nth-of-type(n+6) { display: none !important; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main div:has(> a.x7:nth-of-type(5)):not(:has(+ .lift-wiecej)) { padding-bottom: 62px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-marka-zabiegi] div:has(> a.x8:nth-of-type(7)):not(:has(+ .lift-wiecej)) { padding-bottom: 62px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main [data-technologie]:not(:has(+ .lift-hub-akcje)), html:not(.lift-awaria):has(>head>link[rel=canonical][href*="/marka-"]) main [data-cms="t4"]:not(:has(+ .lift-hub-akcje)) { padding-bottom: 178px; }
    html:not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"])) main:not(:has([data-technologie])) p[data-cms="t3"]:not(:has(+ .lift-hub-akcje)) { padding-bottom: 178px; }
    html:not(.lift-huby):not(.lift-awaria):has(>head>link[rel=canonical]:is([href*="/problem-"],[href*="/cera-"],[href*="/marka-"])) main a.x7:not([data-cena])::before { display: block; content: ""; width: 72px; }
  }
  /* katalog zabiegów (/zabiegi/): skrót grup jak po skrypcie (8 kart na desktopie, 4 na telefonie), do czasu aż skrypt przejmie to klasą lift-skryta */
  @media (min-width: 761px) {
    html:not(.lift-kat):not(.lift-awaria) [data-group]:not([data-lift-otwarta]) [data-card]:nth-child(n+9) { display: none !important; }
    html:not(.lift-kat):not(.lift-awaria) [data-group] > div:has(> [data-card]:nth-child(9)):not(:has(+ .lift-wiecej)) { padding-bottom: 72px; }
  }
  @media (max-width: 760px) {
    html:not(.lift-kat):not(.lift-awaria) [data-group]:not([data-lift-otwarta]) [data-card]:nth-child(n+5) { display: none !important; }
    html:not(.lift-kat):not(.lift-awaria) [data-group] > div:has(> [data-card]:nth-child(5)):not(:has(+ .lift-wiecej)) { padding-bottom: 64px; }
  }
}

/* Ciemny kafelek „Umów konsultację” (wyszukiwarka zabiegów): bez wiszącego „- oddzwonimy.” w osobnej linii */
main p[style*="color:#C6BCA9"]:has(> a[href="/#kontakt"]) { text-wrap: balance; }