/* Theme Name: PixelMaker – NestorMedica Theme URI: https://pixelmaker.pl/ Author: PixelMaker Author URI: https://pixelmaker.pl/ Description: Indywidualny wygląd strony NestorMedica oparty na motywie PixelMaker. Template: pixelmaker Requires at least: 7.1 Tested up to: 7.1 Requires PHP: 8.1 Version: 1.0.0 License: GNU General Public License v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: pixelmaker-nestormedica Update URI: false */ /* * Wygląd NestorMedica: reguły uzupełniające theme.json (decyzje E0: projekt/decyzje.md). * Klasy sekcji nm-* (Zaawansowane → Dodatkowe klasy CSS w edytorze). */ /* Podstawy. --nm-pas: jedna wysokość ciemnych pasów ze zdjęciem pod nagłówkiem na wszystkich podstronach. */ :root { --nm-pas: clamp(15rem, 19vw, 17.5rem); /* Złoto jak w literze N logo: jasny połysk, środek, cień i drugi połysk (przyciski, odznaki, pinezki, kreski) */ --nm-zloto: linear-gradient(135deg, #f8e3a0 0%, #ecc768 24%, #d29f2e 50%, #f2d27c 74%, #b8852b 100%); --nm-zloto-pion: linear-gradient(180deg, #f8e3a0 0%, #e2b54a 45%, #b8852b 100%); } body { -webkit-font-smoothing: antialiased; } h1, h2, h3, h4 { text-wrap: balance; } p { text-wrap: pretty; } a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; } a:hover { text-decoration-thickness: 2px; } :where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--wp--custom--focus--color); outline-offset: 3px; } .nm-ciemna :focus-visible, .nm-stopka :focus-visible { outline-color: var(--wp--custom--focus--on-dark); } .nm-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-hero__top .nm-lead, .nm-wlasciciele__lead { max-width: 46ch; } body:not(.nm-demo) .nm-tylko-demo { display: none; } /* * Nagłówek: srebrny pasek z delikatnym połyskiem (jaśniejszy u góry, chłodniejszy u dołu), cienka linia światła * u góry, cień pod spodem; nad nim cień granatowego górnego paska (menu.css wtyczki). Logo, menu z panelami * (blok nestormedica/menu), „Panel placówki” i złote „Dodaj placówkę”. */ .wp-site-blocks { position: relative; } .pm-header.nm-naglowek, .pm-header.nm-naglowek.is-scrolled.has-shadow { background-image: linear-gradient(180deg, #ffffff 0%, #f4f5f7 42%, #e4e7ec 100%); box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(11 34 48 / 0.14), 0 12px 26px -16px rgb(11 34 48 / 0.6); } .nm-naglowek .nm-menu { flex: 1; margin-left: var(--wp--preset--spacing--30); } .nm-naglowek .wp-block-site-logo { flex-shrink: 0; } /* * Przyciski w nagłówku: „Logowanie” (srebro) i „Dodaj obiekt” (złoto) – ta sama wielkość, metaliczny gradient. * Po najechaniu gradient przesuwa się w bok, a przez przycisk przebiega jasny refleks. */ .nm-zaloguj a, .nm-naglowek .wp-block-button .wp-block-button__link { box-sizing: border-box; position: relative; isolation: isolate; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-width: 10.25rem; min-height: 2.75rem; padding: 0.5rem 1.125rem; border: 0; border-radius: var(--wp--custom--radius--button); background-size: 220% 100%; background-position: 0 0; font-family: var(--wp--preset--font-family--heading); font-size: 1.0625rem; font-weight: 700; letter-spacing: 0.02em; line-height: 1.1; text-decoration: none; transition: background-position 600ms ease, box-shadow 200ms ease, transform 200ms ease; } .nm-zaloguj a { background-image: linear-gradient(135deg, #fbfcfd 0%, #e2e6eb 26%, #b9c1ca 50%, #eef0f3 74%, #a8b0ba 100%); color: var(--wp--preset--color--heading); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.9), inset 0 0 0 1px rgb(11 34 48 / 0.16), 0 6px 14px -8px rgb(11 34 48 / 0.5); } .nm-naglowek .wp-block-button .wp-block-button__link { box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.6), inset 0 0 0 1px rgb(138 90 14 / 0.25), 0 6px 14px -8px rgb(138 90 14 / 0.6); } .nm-zaloguj a::after, .nm-naglowek .wp-block-button .wp-block-button__link::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 30%, rgb(255 255 255 / 0.6) 50%, transparent 70%); transform: translateX(-120%); transition: transform 700ms ease; } .nm-zaloguj a:hover, .nm-naglowek .wp-block-button .wp-block-button__link:hover { background-position: 100% 0; transform: translateY(-1px); color: var(--wp--preset--color--heading); } .nm-zaloguj a:hover::after, .nm-naglowek .wp-block-button .wp-block-button__link:hover::after { transform: translateX(120%); } .nm-zaloguj a:hover { box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.9), inset 0 0 0 1px rgb(11 34 48 / 0.24), 0 10px 18px -8px rgb(11 34 48 / 0.55); } .nm-naglowek .wp-block-button .wp-block-button__link:hover { box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.6), inset 0 0 0 1px rgb(138 90 14 / 0.35), 0 10px 18px -8px rgb(138 90 14 / 0.65); } @media (prefers-reduced-motion: reduce) { .nm-zaloguj a, .nm-naglowek .wp-block-button .wp-block-button__link, .nm-zaloguj a::after, .nm-naglowek .wp-block-button .wp-block-button__link::after { transition: none; } } /* Węższy komputer: oba przyciski po równo mniejsze, żeby menu zmieściło się w jednej linii */ @media (max-width: 1250px) { .nm-zaloguj a, .nm-naglowek .wp-block-button .wp-block-button__link { min-width: 9rem; padding-inline: 0.875rem; font-size: 1rem; } } .nm-zaloguj a::before { content: ""; width: 1.25em; height: 1.25em; flex: none; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E") center / contain no-repeat; } .nm-zaloguj { margin: 0; white-space: nowrap; } /* Menu na telefonie: granatowa szuflada z rozwijanymi sekcjami (menu.css wtyczki) */ .nm-btn-plus .wp-block-button__link { display: inline-flex; align-items: center; gap: 0.5rem; } .nm-btn-plus .wp-block-button__link::before { content: ""; width: 1.125em; height: 1.125em; flex: none; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat; } .pm-drawer .wp-block-buttons .wp-block-button { width: 100%; } .pm-drawer .wp-block-buttons .wp-block-button__link { width: 100%; justify-content: center; } /* Przyciski: Premium (złoto – tylko oferta Premium) i Jasny (na granacie) */ .wp-block-button.is-style-nm-premium .wp-block-button__link { border-color: transparent; background: var(--nm-zloto, var(--wp--preset--color--accent)); background-size: 220% 100%; background-position: 0 0; color: var(--wp--preset--color--on-accent); transition: background-position 500ms ease; } .wp-block-button.is-style-nm-premium .wp-block-button__link:hover { border-color: transparent; background-position: 100% 0; color: var(--wp--preset--color--on-accent); } .wp-block-button.is-style-nm-jasny .wp-block-button__link { background: var(--wp--preset--color--white); border-color: var(--wp--preset--color--white); color: var(--wp--preset--color--primary); } .wp-block-button.is-style-nm-jasny .wp-block-button__link:hover { background: var(--wp--preset--color--accent-soft); border-color: var(--wp--preset--color--accent-soft); color: var(--wp--preset--color--primary); } /* Sekcje strony głównej */ .nm-sechead { margin-bottom: var(--wp--preset--spacing--10); } .nm-sechead > * { margin: 0; } .nm-sechead__opis { max-width: 60ch; } .nm-sechead__link { font-weight: 600; } .nm-hero__top h1 { margin: 0; } .nm-hero__top .nm-lead { margin: 0; } /* * Pierwszy ekran na zdjęciu (blok Okładka): tytuł w jednej linii z lewej, opis z prawej, wyszukiwarka pod nimi. * Nad nim biały pasek nagłówka. Zdjęcie powoli się przybliża (raz, 14 s). */ .nm-hero--zdjecie { min-height: 0 !important; padding: clamp(2rem, 3.2vw, 3rem) var(--wp--style--root--padding-right) !important; color: #fff; } .nm-hero--zdjecie .wp-block-cover__image-background { animation: nm-zoom 14s cubic-bezier(0.2, 0.6, 0.2, 1) both; } /* Hero „pod treścią”: cień spod nagłówka u góry i spod mapy u dołu – zdjęcie z wyszukiwarką wygląda jak tło schowane pod stroną */ .wp-block-cover.nm-hero--zdjecie::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; box-shadow: inset 0 48px 44px -26px rgb(2 9 14 / 0.92), inset 0 -48px 44px -26px rgb(2 9 14 / 0.92); } .wp-block-cover.nm-hero--zdjecie > .wp-block-cover__inner-container { z-index: 2; } /* Paralaksa (biblioteka ruchu, efekt 03): zdjęcie przesuwa się wolniej niż strona; zapas zdjęcia nad kadrem, żeby nie odsłonić krawędzi. Chrome, Edge, Safari 26; Firefox i ograniczony ruch – zdjęcie stoi */ @supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) { .wp-block-cover.nm-hero--zdjecie .wp-block-cover__image-background { top: -14rem; height: calc(100% + 14rem); animation: nm-zoom 14s cubic-bezier(0.2, 0.6, 0.2, 1) both, nm-paralaksa linear both; animation-timeline: auto, view(); animation-range: normal, cover 50% cover 100%; } } } @keyframes nm-paralaksa { from { translate: 0 0; } to { translate: 0 14rem; } } /* Tytuł i opis na jednej osi: opis pod tytułem, oba wyśrodkowane nad wyszukiwarką */ .nm-hero__top { display: flex; flex-direction: column; align-items: center; gap: clamp(0.5rem, 0.9vw, 0.875rem); margin-bottom: clamp(1.5rem, 2.4vw, 2.25rem) !important; text-align: center; } /* Tytuł z cienką czarną obwódką wokół liter i miękkim cieniem – czytelny na każdym fragmencie zdjęcia */ .nm-hero__top h1 { margin: 0; font-size: var(--wp--preset--font-size--gigantic); line-height: 1.08; letter-spacing: -0.01em; text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000, 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 0 2px 1px rgb(0 0 0 / 0.6), 0 6px 22px rgb(0 0 0 / 0.55); } /* Opis pod tytułem: jedna linijka krojem nagłówków między dwiema złotymi kreskami (na telefonie dwie linijki bez kresek) */ .nm-hero__opis { margin: 0 !important; font-family: var(--wp--preset--font-family--heading); font-size: clamp(1.125rem, 0.85rem + 0.7vw, 1.4375rem); font-weight: 600; line-height: 1.25; letter-spacing: 0.015em; color: #fff; text-shadow: 0 2px 10px rgb(0 0 0 / 0.5); animation: nm-pojaw 700ms 150ms ease-out both; } .nm-hero__opis::before, .nm-hero__opis::after { content: ""; display: inline-block; width: clamp(1.75rem, 3vw, 3rem); height: 2px; margin: 0 0.875rem 0.3em; vertical-align: middle; background: var(--nm-zloto, var(--wp--preset--color--accent)); } .nm-hero__opis::after { transform: scaleX(-1); } @media (min-width: 782px) { .nm-hero__opis br { display: none; } } .nm-hero--zdjecie .nm-szukaj { animation: nm-pojaw 700ms 300ms ease-out both; } .nm-hero--zdjecie .nm-pole { border-color: transparent; box-shadow: 0 1px 2px rgb(0 0 0 / 0.2); } .nm-hero--zdjecie .nm-szukaj__pola .nm-btn--primary { border-color: transparent; background: var(--nm-zloto, var(--wp--preset--color--accent)); background-size: 220% 100%; background-position: 0 0; color: var(--wp--preset--color--on-accent); transition: background-position 500ms ease; } .nm-hero--zdjecie .nm-szukaj__pola .nm-btn--primary:hover { border-color: transparent; background-position: 100% 0; } /* Typy placówek jako przyciski: nazwa i liczba w osobnym polu; wybrany biały z liczbą na złocie */ /* Przyciski rodzajów i „W pobliżu mnie” wyśrodkowane pod wyszukiwarką (jak tytuł i hasło nad nią) */ .nm-hero--zdjecie .nm-szukaj__dol { flex-direction: column; justify-content: center; gap: 0.75rem; margin-top: 1.125rem; } .nm-hero--zdjecie .nm-szukaj__typy { justify-content: center; } /* Te same przyciski rodzajów w ciemnym pasie wyników (/szukaj/, strony kategorii, województw i miast) */ :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chips { gap: 0.5rem; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chips { align-items: center; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip { gap: 0.5rem; min-height: 2.25rem; padding: 0.25rem 0.25rem 0.25rem 0.75rem; border: 0; border-radius: var(--wp--custom--radius--l); background: rgb(255 255 255 / 0.13); color: #fff; font-size: 0.8125rem; font-weight: 600; text-decoration: none; transform-origin: center; transition: background-color 160ms ease, color 160ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1), font-size 220ms ease, min-height 220ms ease, padding 220ms ease; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip .nm-type { font-weight: 600; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip .nm-type::before { display: none; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip small { display: inline-grid; place-items: center; min-width: 2.25rem; height: 1.75rem; padding: 0 0.4375rem; transition: height 220ms ease, min-width 220ms ease; border-radius: var(--wp--custom--radius--m); background: rgb(11 34 48 / 0.55); color: #f0cf72; font-size: 0.875rem; font-weight: 700; opacity: 1; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip:hover, :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip:focus-visible { background: rgb(255 255 255 / 0.24); color: #fff; transform: scale(1.07); } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip.is-active { gap: 0.625rem; min-height: 2.75rem; padding: 0.3125rem 0.3125rem 0.3125rem 0.875rem; background: #fff; color: var(--wp--preset--color--heading); font-size: 0.9375rem; transform: none; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip.is-active small { min-width: 2.5rem; height: 2.125rem; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip.is-active small { background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent); } .nm-hero--zdjecie .nm-blisko { color: #fff; } /* Pas wyników: przyciski pod tytułem; na telefonie jeden rząd przewijany w bok */ .nm-wyniki__rodzaje { margin: 1.25rem 0 0; padding: 0; list-style: none; } .nm-wyniki__rodzaje .nm-chip.is-active { min-height: 2.25rem; padding: 0.25rem 0.25rem 0.25rem 0.75rem; font-size: 0.8125rem; } .nm-wyniki__rodzaje .nm-chip.is-active small { min-width: 2.25rem; height: 1.75rem; } :is(.nm-hero--zdjecie, .nm-wyniki__glowa) .nm-chip:not(:has(small)) { padding-right: 0.75rem; } @media (max-width: 781px) { .nm-wyniki__rodzaje { position: relative; flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; margin-inline: calc(-1 * var(--wp--style--root--padding-left, 1rem)); padding-inline: var(--wp--style--root--padding-left, 1rem); } .nm-wyniki__rodzaje > li { flex: none; } } @keyframes nm-pojaw { from { opacity: 0; transform: translateY(14px); } } @keyframes nm-zoom { from { transform: scale(1.08); } } /* Komputer i tablet: tytuł zawsze w jednej linii (stopień dopasowany do szerokości ekranu) */ @media (min-width: 782px) { .nm-hero__top h1 { font-size: min(calc(var(--wp--preset--font-size--gigantic) * 0.84), calc((100vw - 6rem) / 28)); white-space: nowrap; } } @media (max-width: 781px) { .nm-hero--zdjecie { padding-block: 1.75rem !important; } .nm-hero__opis { font-size: 1.125rem; } .nm-hero__opis::before, .nm-hero__opis::after { display: none; } .nm-hero--zdjecie .nm-chip { font-size: 0.9375rem; } } @media (prefers-reduced-motion: reduce) { .nm-hero--zdjecie .wp-block-cover__image-background, .nm-hero__opis, .nm-hero--zdjecie .nm-szukaj { animation: none; } .nm-hero--zdjecie .nm-chip { transition: none; } .nm-hero--zdjecie .nm-chip:hover { transform: none; } } .nm-zdjecie img { border-radius: var(--wp--custom--radius--l); } /* Karty artykułów (strona główna – 4 najnowsze, poradnik i działy – siatka): zdjęcie 3:2, dział jako złota etykieta, tytuł (link na całą kartę) i zajawka. Pod kursorem karta się unosi, a zdjęcie lekko przybliża */ .nm-karty-wpisow__lista { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); margin: 0; padding: 0; list-style: none; } .nm-poradnik-siatka__lista.nm-karty-wpisow__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } .nm-karty-wpisow__lista > li { position: relative; display: flex; flex-direction: column; gap: 0.625rem; margin: 0 !important; padding: 0 0 1.25rem; overflow: hidden; border-radius: 16px; background: var(--wp--preset--color--surface, #fff); box-shadow: 0 0 0 1px rgb(11 34 48 / 0.07), 0 14px 30px -24px rgb(11 34 48 / 0.45); transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 300ms ease; } .nm-karty-wpisow__lista > li > * { margin: 0 !important; padding-inline: 1.25rem; } .nm-karty-wpisow__lista > li > .wp-block-post-featured-image { margin-bottom: 0.375rem !important; padding: 0; overflow: hidden; } .nm-karty-wpisow__lista .wp-block-post-featured-image img { border-radius: 0; transition: transform 900ms cubic-bezier(0.16, 1, 0.3, 1); } .nm-karty-wpisow__lista > li:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgb(11 34 48 / 0.08), 0 26px 44px -26px rgb(11 34 48 / 0.55); } .nm-karty-wpisow__lista > li:hover .wp-block-post-featured-image img { transform: scale(1.04); } .nm-karty-wpisow__lista .wp-block-post-title { font-size: var(--wp--preset--font-size--large); line-height: 1.25; } .nm-karty-wpisow__lista .wp-block-post-title a { color: var(--wp--preset--color--heading); text-decoration: none; } .nm-karty-wpisow__lista .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; } .nm-karty-wpisow__lista > li:hover .wp-block-post-title a, .nm-karty-wpisow__lista .wp-block-post-title a:focus-visible { text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; } .nm-karty-wpisow__lista .wp-block-post-excerpt, .nm-karty-wpisow__lista .wp-block-post-excerpt__excerpt { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--wp--preset--color--contrast); } /* Dział: mała złota etykieta nad tytułem (link działu nad linkiem karty) */ .nm-wpis-dzial { position: relative; z-index: 1; font: 700 0.8125rem/1.2 var(--wp--preset--font-family--heading); letter-spacing: 0.04em; text-transform: uppercase; } .nm-wpis-dzial a { color: var(--wp--preset--color--accent-dark, #8a5a0e); text-decoration: none; } .nm-wpis-dzial a:hover { text-decoration: underline; } .nm-wpis-dzial .wp-block-post-terms__separator { color: var(--wp--preset--color--muted); } @media (max-width: 1100px) { .nm-karty-wpisow__lista, .nm-poradnik-siatka__lista.nm-karty-wpisow__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 600px) { .nm-karty-wpisow__lista, .nm-poradnik-siatka__lista.nm-karty-wpisow__lista { grid-template-columns: minmax(0, 1fr); } } @media (prefers-reduced-motion: reduce) { .nm-karty-wpisow__lista > li, .nm-karty-wpisow__lista img { transition: none; } .nm-karty-wpisow__lista > li:hover { transform: none; } } /* Działy poradnika na stronie głównej: kafle (nazwa, zakres, liczba artykułów na żywo) – cały kafel jest linkiem, pod kursorem unosi się, a złoty pasek u góry się wydłuża; pojawiają się w rytm przewijania (nm-pojaw) */ .nm-poradnik-dzialy-glowna { margin-top: var(--wp--preset--spacing--60) !important; } .nm-poradnik-dzialy-glowna > * { margin: 0; } .nm-poradnik-dzialy-glowna__tytul { font-size: var(--wp--preset--font-size--x-large); } /* Skąd mamy dane: granatowy pas – opis z lewej, trzy źródła ze złotymi liczbami z prawej */ .nm-dane-uklad { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 2.5vw, 2.5rem) clamp(1.25rem, 2.5vw, 2.5rem); align-items: stretch; } .nm-dane-uklad > * { margin: 0 !important; } .nm-dane.wp-block-cover { min-height: 0; padding-inline: var(--wp--style--root--padding-left); } .nm-dane .wp-block-cover__inner-container { color: #fff; } .nm-dane-uklad__glowa { grid-row: span 2; padding-right: clamp(0rem, 2vw, 2rem); } .nm-dane-uklad__link { margin-top: 1.25rem !important; } .nm-dane-uklad__link a { color: #fff; font-weight: 600; text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-dane-uklad__glowa > * { margin: 0; } .nm-dane-uklad__opis { margin-top: 1rem !important; max-width: 46ch; color: #d6dee3; } .nm-zrodlo { padding-top: 1.25rem; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.18); } .nm-zrodlo > * { margin: 0; } .nm-zrodlo__liczba { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--xx-large); font-weight: 600; line-height: 1.1; letter-spacing: -0.03em; background: var(--nm-zloto, var(--wp--preset--color--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; } .nm-zrodlo__tekst { margin-top: 0.5rem !important; color: #d6dee3; line-height: 1.45; } @media (max-width: 1080px) { .nm-dane-uklad { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-dane-uklad__glowa { grid-column: 1 / -1; grid-row: auto; padding: 0 0 0.5rem; } } @media (max-width: 600px) { .nm-dane-uklad { grid-template-columns: minmax(0, 1fr); } } /* Prowadzisz dom opieki? (granat, kadr z drona) */ .nm-wlasciciele { color: #dfe5e9; } .nm-wlasciciele h2, .nm-wlasciciele h3 { color: var(--wp--preset--color--white); } .nm-wlasciciele__lead { max-width: 46ch; } .nm-wlasciciele .pm-icon-box h3 { margin: 0 0 0.25rem; } .nm-wlasciciele .pm-icon-box p { margin: 0; } .nm-wlasciciele__przyciski { margin-top: var(--wp--preset--spacing--40); } .nm-kadr { position: relative; } .nm-kadr .wp-block-image { margin: 0; } .nm-kadr img { border-radius: var(--wp--custom--radius--l); } .nm-kadr__znak { position: absolute; left: 1rem; top: 1rem; margin: 0; display: inline-flex; align-items: center; gap: 0.375rem; min-height: 1.875rem; padding: 0.25rem 0.625rem; border-radius: var(--wp--custom--radius--s); background: rgb(11 34 48 / 0.82); color: #fff; font: 650 0.9375rem/1.2 var(--wp--preset--font-family--body); } @media (max-width: 781px) { .nm-kadr img { aspect-ratio: 4 / 3 !important; } } /* Stopka (E30): zdjęcie z drona pod granatowym gradientem; zaproszenie z przyciskami, liczby katalogu, kolumny linków, województwa jako jasne przyciski, na dole informacja o źródłach danych */ .nm-stopka { margin-top: 0 !important; color: #d3dadf; } .nm-stopka.wp-block-cover { min-height: 0; padding-inline: var(--wp--style--root--padding-left); } .nm-stopka .wp-block-cover__inner-container > * { margin-block: 0; } .nm-stopka .wp-block-cover__inner-container > * + * { margin-top: clamp(1.5rem, 2.6vw, 2.25rem); } .nm-stopka h2 { margin: 0; } .nm-stopka a { color: #fff; text-decoration: none; } /* Zaproszenie w jednym rzędzie: tytuł, zdanie i przyciski (od 1100 px); węziej – tytuł nad zdaniem, przyciski niżej */ .nm-stopka__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2.5rem; padding-bottom: clamp(1.25rem, 2.5vw, 1.75rem); box-shadow: inset 0 -1px 0 rgb(255 255 255 / 0.14); } .nm-stopka__cta-tekst { flex: 1 1 32rem; min-width: 0; } .nm-stopka__cta-tekst > * { margin: 0; } .nm-stopka__cta-tekst h2 { font-size: var(--wp--preset--font-size--x-large); line-height: 1.1; white-space: nowrap; } .nm-stopka__cta-tekst p { margin-top: 0.5rem; font-size: var(--wp--preset--font-size--medium); line-height: 1.45; color: #e2e8ec; } @media (min-width: 1100px) { .nm-stopka__cta-tekst { display: flex; align-items: baseline; gap: 1.75rem; } .nm-stopka__cta-tekst p { margin-top: 0; } } .nm-stopka__cta-przyciski { margin: 0; } /* Katalog w liczbach: sześć równych pól w jednym rzędzie – duża złota liczba, pod nią podpis; między polami cienkie kreski */ .nm-stopka__liczby { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); padding: 0.875rem 0; border-radius: var(--wp--custom--radius--l); background: rgb(255 255 255 / 0.06); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); } .nm-stopka__liczby > * { margin: 0 !important; } .nm-stopka__liczba { display: grid; align-content: start; gap: 0.25rem; padding: 0.25rem clamp(0.75rem, 1.4vw, 1.5rem); font: 600 0.9375rem/1.3 var(--wp--preset--font-family--heading); letter-spacing: 0.01em; color: #dfe5e9; } .nm-stopka__liczba + .nm-stopka__liczba { box-shadow: inset 1px 0 0 rgb(255 255 255 / 0.12); } .nm-stopka__liczba .nm-liczba { display: block; font: 400 clamp(1.375rem, 1.8vw, 1.875rem)/1.05 var(--wp--preset--font-family--display); color: #f0cf72; font-variant-numeric: tabular-nums; } @media (max-width: 1100px) { .nm-stopka__liczby { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 1rem; } .nm-stopka__liczba:nth-child(3n + 1) { box-shadow: none; } } @media (max-width: 600px) { .nm-stopka__liczby { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-stopka__liczba:nth-child(3n + 1) { box-shadow: inset 1px 0 0 rgb(255 255 255 / 0.12); } .nm-stopka__liczba:nth-child(odd) { box-shadow: none; } } /* Logo w stopce bez zaokrąglonych rogów (globalny promień obrazów nie dotyczy logo) */ .nm-stopka__logo img { border-radius: 0 !important; } /* Profile społecznościowe pod e-mailem */ .nm-stopka .nm-social { display: flex; gap: 0.5rem; margin: 1rem 0 0; padding: 0; list-style: none; } .nm-stopka .nm-social a, .nm-stopka .nm-social .is-wkrotce { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: rgb(255 255 255 / 0.1); color: #fff; transition: background-color 200ms ease, color 200ms ease; } .nm-stopka .nm-social .nm-i { width: 1.25rem; height: 1.25rem; } .nm-stopka .nm-social a:hover, .nm-stopka .nm-social a:focus-visible { background: #f0cf72; color: var(--wp--preset--color--heading); } .nm-stopka .nm-social .is-wkrotce { opacity: 0.75; } .nm-social .nm-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* Płatności: znaki PayU i BLIK jako jasne plakietki */ .nm-platnosci { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; } .nm-platnosci__tytul { margin-right: 0.25rem; } .nm-platnosc { display: inline-flex; align-items: center; min-height: 1.875rem; padding: 0 0.75rem; border-radius: 6px; background: #fff; color: #1d1f21; font: 800 0.875rem/1 var(--wp--preset--font-family--heading); letter-spacing: 0.02em; } .nm-platnosc--payu { color: #237a17; } .nm-platnosc--blik { background: #000; color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.3); } /* Oficjalne logotypy (2.11.2026): PayU na białej pigułce, znak BLIK z własnym czarnym tłem – ta sama wysokość. */ .nm-platnosc img { display: block; width: auto; height: 1.25rem; } .nm-platnosc-logo { display: block; width: auto; height: 1.875rem; } .nm-stopka .wp-block-column h2, .nm-stopka__woj h2 { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--medium) !important; font-weight: 600; letter-spacing: 0.02em; color: #f0cf72; } .nm-stopka__logo { margin: 0; } .nm-stopka__logo img { width: 10.5rem; height: auto; } .nm-stopka__opis { max-width: 40ch; margin-top: 1rem; font-size: var(--wp--preset--font-size--small); line-height: 1.55; } .nm-stopka__email { margin-top: 0.875rem; font-weight: 600; } .nm-stopka__email a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1rem; border-radius: var(--wp--custom--radius--button, 6px); background: rgb(255 255 255 / 0.1); transition: background-color 200ms ease; } .nm-stopka__email a:hover { background: rgb(255 255 255 / 0.18); } .nm-stopka__linki { list-style: none; margin: 0.75rem 0 0; padding: 0; display: grid; gap: 0.25rem; } .nm-stopka__linki a { display: inline-block; padding-block: 0.1875rem; color: #e8edf0; transition: color 200ms ease, transform 200ms ease; } .nm-stopka__linki a:hover, .nm-stopka__linki a:focus-visible { color: #f0cf72; transform: translateX(4px); } .nm-stopka__woj-lista { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.75rem 0 0; padding: 0; list-style: none; } /* Rodzaje placówek nad województwami – ten sam wygląd przycisków, mniejszy odstęp do rzędu województw */ /* Rodzaje placówek w jednym rzędzie (krótkie nazwy); na węższych ekranach zawijają się */ @media (min-width: 1100px) { .nm-stopka__rodzaje-lista { flex-wrap: nowrap; justify-content: space-between; } } .nm-stopka__woj-lista a { display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 0.875rem; border-radius: 999px; background: rgb(255 255 255 / 0.08); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); font-size: 0.9375rem; transition: background-color 200ms ease, color 200ms ease; } .nm-stopka__woj-lista a:hover, .nm-stopka__woj-lista a:focus-visible { background: #f0cf72; color: var(--wp--preset--color--heading); } /* Dolny pasek: © i linki prawne z lewej, płatności z prawej */ .nm-stopka__dol { align-items: center; padding-top: 1.125rem; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.14); color: #b9c4cc; } .nm-stopka__dol p { margin: 0; } .nm-stopka__prawa { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem 1.75rem; } .nm-stopka__prawa > * { margin: 0 !important; } .nm-stopka__prawne { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; } .nm-stopka__prawne a { display: inline-flex; align-items: center; min-height: 2.25rem; color: #c9d3da; transition: color 160ms ease; } .nm-stopka__prawne a:hover, .nm-stopka__prawne a:focus-visible { color: #f0cf72; } /* Nota o niezależności portalu – osobny wiersz pod dolnym paskiem */ .nm-stopka__nota { flex: 0 0 100%; font-size: 0.8125rem; line-height: 1.5; text-wrap: balance; } /* Poniżej 1280 px treść stopki sięga pod pływający przycisk cookies (lewy dolny róg) – miejsce pod notą */ @media (max-width: 1279px) { .nm-stopka.wp-block-cover { padding-bottom: calc(var(--wp--preset--spacing--30) + 3.5rem) !important; } } @media (max-width: 781px) { .nm-stopka__cta { flex-direction: column; align-items: flex-start; } .nm-stopka__cta-tekst { flex: 0 0 auto; } /* Linki stopki w dwóch kolumnach (logo i opis nad nimi) – krótsza stopka na telefonie */ .nm-stopka .wp-block-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 1.25rem; } .nm-stopka .wp-block-columns > .wp-block-column { margin: 0; } .nm-stopka .wp-block-columns > .wp-block-column:first-child { grid-column: 1 / -1; } } /* Telefon: tryb mapy na stronie głównej – tylko mapa (pozostałe sekcje i stopka znikają) */ @media (max-width: 900px) { body.nm-tryb-mapy .entry-content > :not(.nm-split), body.nm-tryb-mapy footer.wp-block-template-part { display: none; } } @media (max-width: 781px) { .nm-hero__top { flex-direction: column; align-items: center !important; } .nm-lead { font-size: var(--wp--preset--font-size--medium); } .nm-art { grid-template-columns: 7.5rem minmax(0, 1fr) !important; gap: 1rem !important; } .nm-fakt { grid-template-columns: 5rem minmax(0, 1fr) !important; } } /* Podstrony: Dla placówek, Kontakt, O portalu, dokumenty, poradnik */ .nm-zrzut { margin: 0; } .nm-zrzut img { border-radius: var(--wp--custom--radius--l); box-shadow: 0 0 0 1px var(--wp--preset--color--line), var(--wp--preset--shadow--raised); } .nm-zrzut figcaption { margin: 0.875rem 0 0; font-size: var(--wp--preset--font-size--small); line-height: 1.45; color: var(--wp--preset--color--contrast); text-align: left; } .nm-oferta h2 { margin-top: 0; } .nm-kafelek { height: 100%; padding: 1.75rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--surface); box-shadow: var(--wp--preset--shadow--subtle); } .nm-kafelek h3, .nm-kafelek p { margin: 0; } .nm-kroki .nm-kafelek h3::before { content: ""; display: block; width: 2.5rem; height: 0.25rem; margin-bottom: 1rem; border-radius: 2px; background: var(--nm-zloto, var(--wp--preset--color--accent)); } /* Porównanie: bezpłatny wpis i Premium */ .nm-porownanie { margin: 0; overflow-x: auto; } .nm-porownanie table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--wp--preset--font-size--medium); } .nm-porownanie th, .nm-porownanie td { padding: 1rem 1.25rem; border: 0; box-shadow: inset 0 -1px 0 var(--wp--preset--color--line); text-align: left; vertical-align: top; } .nm-porownanie thead th { font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--heading); box-shadow: inset 0 -2px 0 var(--wp--preset--color--heading); } .nm-porownanie tbody th { font-weight: 500; color: var(--wp--preset--color--contrast); } .nm-porownanie td { font-weight: 600; color: var(--wp--preset--color--heading); } .nm-porownanie th:nth-child(3), .nm-porownanie td:nth-child(3) { background: var(--wp--preset--color--accent-soft); } .nm-porownanie thead th:nth-child(3) { border-radius: var(--wp--custom--radius--m) var(--wp--custom--radius--m) 0 0; box-shadow: inset 0 -2px 0 var(--wp--preset--color--accent); } .nm-porownanie tbody tr:last-child th, .nm-porownanie tbody tr:last-child td { box-shadow: none; } /* Pytania (rozwijane) */ .nm-pytanie { margin: 0; padding: 0; border: 0; box-shadow: inset 0 -1px 0 var(--wp--preset--color--line); } .nm-pytanie summary { display: flex; justify-content: space-between; gap: 1rem; align-items: center; min-height: 3.75rem; padding-block: 0.875rem; font-weight: 650; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--heading); cursor: pointer; list-style: none; } .nm-pytanie summary::-webkit-details-marker { display: none; } .nm-pytanie summary::after { content: ""; flex: none; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m5 9 7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m5 9 7 7 7-7'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform var(--wp--custom--transition); } .nm-pytanie[open] summary::after { transform: rotate(180deg); } .nm-pytanie > p { margin: 0; padding-bottom: 1.25rem; max-width: 68ch; } /* Kontakt i formularze */ .nm-kontakt-sekcja h2 { margin-top: 0; } .nm-kontakt-sekcja .wp-block-pixelmaker-contact-form { padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); } .nm-kontakt-mail { font-weight: 600; } .nm-kontakty .pm-icon-box h3 { margin: 0 0 0.125rem; } .nm-kontakty .pm-icon-box p { margin: 0; font-weight: 600; } .nm-kontakt-lead { max-width: 46ch; font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--heading); } .nm-kontakty { margin-top: var(--wp--preset--spacing--40) !important; } /* „W czym możemy pomóc”: trzy sprawy w kolumnach na jasnym tle – tytuł, jedno zdanie i linki do miejsc, gdzie sprawę załatwisz */ .nm-sprawy-sekcja h2 { margin-top: 0; } .nm-sprawy { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 3rem); } .nm-sprawy > * { margin: 0 !important; } .nm-sprawa { display: grid; align-content: start; gap: 0.75rem; } .nm-sprawa > * { margin: 0; } .nm-sprawa__tytul { font-size: var(--wp--preset--font-size--x-large); } .nm-sprawa__tekst { line-height: 1.5; color: var(--wp--preset--color--contrast); } .nm-sprawa__linki { display: grid; gap: 0.5rem; padding: 0; list-style: none; } .nm-sprawa__linki a { font-weight: 600; color: var(--wp--preset--color--primary); text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } @media (max-width: 860px) { .nm-sprawy { grid-template-columns: minmax(0, 1fr); } } /* Dokumenty i poradnik */ .nm-przyklad { padding: 1.25rem 1.5rem; border-radius: var(--wp--custom--radius--m); background: var(--wp--preset--color--base-2); box-shadow: inset 4px 0 0 var(--wp--preset--color--primary); } .nm-lista-pytan > li + li { margin-top: 0.875rem; } .nm-lista-pytan strong { color: var(--wp--preset--color--heading); } .nm-tabela-porownanie table, .nm-tabela-rodo table { font-size: var(--wp--preset--font-size--small); } .nm-tabela-porownanie th, .nm-tabela-porownanie td, .nm-tabela-rodo th, .nm-tabela-rodo td { padding: 0.75rem; vertical-align: top; text-align: left; } .nm-tabela-porownanie tbody th, .nm-tabela-rodo tbody th { font-weight: 650; color: var(--wp--preset--color--heading); } /* Telefon: tabele porównań jako karty (wiersz = karta, podpis kolumny przed wartością) */ @media (max-width: 640px) { .nm-porownanie table, .nm-tabela-porownanie table, .nm-tabela-rodo table { display: block; } .nm-porownanie thead, .nm-tabela-porownanie thead, .nm-tabela-rodo thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .nm-porownanie tbody, .nm-tabela-porownanie tbody, .nm-tabela-rodo tbody { display: grid; gap: 0.75rem; } .nm-porownanie tr, .nm-tabela-porownanie tr, .nm-tabela-rodo tr { display: grid; gap: 0.25rem; padding: 1rem 1.125rem; border-radius: var(--wp--custom--radius--m); background: var(--wp--preset--color--base-2); } .nm-porownanie th, .nm-porownanie td, .nm-tabela-porownanie th, .nm-tabela-porownanie td, .nm-tabela-rodo th, .nm-tabela-rodo td { display: block; padding: 0; background: none !important; box-shadow: none !important; } .nm-porownanie tbody th, .nm-tabela-porownanie tbody th, .nm-tabela-rodo tbody th { margin-bottom: 0.25rem; font-weight: 650; color: var(--wp--preset--color--heading); } .nm-porownanie td::before, .nm-tabela-porownanie td::before, .nm-tabela-rodo td::before { font-weight: 400; color: var(--wp--preset--color--muted); } .nm-porownanie td:nth-child(2)::before { content: "Bezpłatny wpis: "; } .nm-porownanie td:nth-child(3)::before { content: "Wyróżniona wizytówka: "; } .nm-tabela-porownanie td:nth-child(2)::before { content: "DPS: "; } .nm-tabela-porownanie td:nth-child(3)::before { content: "Prywatny dom opieki: "; } .nm-tabela-rodo td:nth-child(2)::before { content: "Dane: "; } .nm-tabela-rodo td:nth-child(3)::before { content: "Cel i podstawa: "; } } .nm-poradnik__opis { max-width: 60ch; margin: 0; } /* * Strona główna, dolne sekcje (E9): krótko i konkretnie, każda sekcja inna kompozycja, * tła na przemian (granat, biel, jasny kamień). Siatka na szerokości układu (1440 px). */ .nm-rodzaje-sekcja h2, .nm-faq-sekcja h2, .nm-woj-sekcja h2, .nm-dane h2, .nm-poradnik-sekcja h2 { margin-top: 0; } /* „Rodzaje placówek”: nagłówek z opisem i linkiem do porównania, pod nim rozwijane kafle ze zdjęciem */ .nm-rodzaje__glowa { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 0.5rem clamp(2rem, 5vw, 5rem); align-items: end; } .nm-rodzaje__glowa > * { margin: 0 !important; } .nm-rodzaje__glowa h2 { grid-row: span 2; } .nm-rodzaje__opis { font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--heading); } .nm-rodzaje__link a { font-weight: 600; } /* „Rodzaje placówek”: rozwijane kafle ze zdjęciem (mechanika – wtyczka ruch.css); cały kafel prowadzi do kategorii */ .nm-kafel--prywatny { --nm-typ: var(--wp--custom--typ--prywatny); } .nm-kafel--dps { --nm-typ: var(--wp--custom--typ--dps); } .nm-kafel--zol { --nm-typ: var(--wp--custom--typ--zol); } .nm-kafel::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 0.375rem; background: var(--nm-typ); } .nm-kafel:focus-within { outline: 3px solid #f0cf72; outline-offset: 3px; } .nm-kafel__liczba { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--large); color: #f0cf72; } .nm-kafel__nazwa { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.05; } .nm-kafel__nazwa a { color: #fff; text-decoration: none; } .nm-kafel__nazwa a::after { content: ""; position: absolute; inset: 0; z-index: 1; } .nm-kafel__nazwa a:focus-visible { outline: none; } .nm-kafel__krotko { max-width: 34ch; font-size: var(--wp--preset--font-size--large); line-height: 1.4; color: #e8edf0; } .nm-kafel__fakt { max-width: 46ch; line-height: 1.45; color: #e8edf0; } .nm-kafel__fakt strong { display: block; margin-bottom: 0.125rem; font-size: var(--wp--preset--font-size--small); font-weight: 600; color: #f0cf72; } .nm-kafel__link { position: relative; z-index: 2; } .nm-kafel__link a { font-weight: 700; color: #fff; text-decoration-color: #f0cf72; text-underline-offset: 0.2em; } .nm-kafel__link a::after { content: "\00a0→"; } /* „Od czego zacząć”: karty sytuacji (ruch „kurtyna” – wtyczka ruch.css): duży numer konturem w rogu, sytuacja i podpowiedź; po najechaniu karta granatowieje, numer złoty, od dołu wysuwają się kroki i linki */ .nm-sytuacje__glowa { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem clamp(2rem, 5vw, 5rem); align-items: end; } .nm-sytuacje__glowa > * { margin: 0 !important; } .nm-sytuacje__opis { max-width: 40ch; font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--contrast); } .nm-sytuacje-sekcja h2 { margin-top: 0; } .nm-sytuacja { --nm-typ: var(--wp--custom--typ--prywatny, #12394f); } .nm-sytuacja--dps { --nm-typ: var(--wp--custom--typ--dps, #1f6f78); } .nm-sytuacja--zol { --nm-typ: var(--wp--custom--typ--zol, #6e4a6b); } .nm-sytuacja--wytchnienie { --nm-typ: var(--wp--preset--color--accent, #d4a12a); } .nm-sytuacja--opieka { --nm-typ: var(--wp--custom--typ--opieka, #5a4a9c); } .nm-sytuacja--hospicjum { --nm-typ: var(--wp--custom--typ--hospicjum, #8e3b4e); } .nm-sytuacja::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 0.375rem; background: var(--nm-typ); } .nm-sytuacja:focus-within { outline: 3px solid var(--wp--custom--focus--color, #12394f); outline-offset: 3px; } .nm-sytuacja__nr { position: absolute; z-index: -1; top: clamp(1rem, 1.6vw, 1.5rem); right: clamp(1.25rem, 2vw, 2rem); margin: 0 !important; font: 400 clamp(4rem, 6vw, 6rem)/1 var(--wp--preset--font-family--display); color: transparent; -webkit-text-stroke: 1.5px var(--wp--preset--color--accent-dark, #8a5a0e); transition: color 450ms ease, -webkit-text-stroke-color 450ms ease; } .nm-sytuacja__tresc { display: grid; gap: 0.625rem; padding: clamp(1.25rem, 2vw, 2rem); } .nm-sytuacja__tresc > * { margin: 0 !important; } .nm-sytuacja__tytul { max-width: 24ch; font-size: var(--wp--preset--font-size--x-large); line-height: 1.12; color: inherit; } .nm-sytuacja__odp { max-width: 40ch; line-height: 1.4; color: var(--wp--preset--color--contrast); transition: color 450ms ease; } .nm-sytuacja__odp strong { color: inherit; } .nm-sytuacja__zacheta { display: none; } .nm-sytuacja__kroki { counter-reset: nm-krok; display: grid; gap: 0.625rem; max-width: 60ch; margin: 0; padding: 0.25rem 0 0; list-style: none; } .nm-sytuacja__kroki li { counter-increment: nm-krok; display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); gap: 0.75rem; line-height: 1.45; } .nm-sytuacja__kroki li::before { content: counter(nm-krok); display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent, #1d1f21); font: 700 0.875rem/1 var(--wp--preset--font-family--heading); } .nm-sytuacja__linki { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; } .nm-sytuacja__linki a { font-weight: 700; color: var(--wp--preset--color--primary); text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-sytuacja__linki a::after { content: "\00a0→"; } @media (hover: hover) and (min-width: 961px) { /* Zachęta pod podpowiedzią – znika, gdy kroki są widoczne */ .nm-sytuacja__zacheta { display: inline-flex; align-items: center; gap: 0.5rem; font: 700 0.9375rem/1.2 var(--wp--preset--font-family--heading); letter-spacing: 0.02em; color: var(--wp--preset--color--accent-dark, #8a5a0e); transition: opacity 200ms ease; } .nm-sytuacja__zacheta::after { content: ""; width: 1.75rem; height: 2px; background: currentColor; transition: width 400ms var(--nm-ease, ease); } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__zacheta { position: absolute; opacity: 0; pointer-events: none; } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__nr { color: rgb(240 207 114 / 0.28); -webkit-text-stroke-color: transparent; } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__odp { color: #e8edf0; } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__odp strong { color: #f0cf72; } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__linki a { color: #fff; } .nm-sytuacja:focus-within { outline-color: #f0cf72; } } /* „Jak znaleźć miejsce”: granatowy pas, trzy kroki na ścieżce – złote kółka z ikoną połączone przerywaną linią */ .nm-jak__glowa { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem clamp(2rem, 5vw, 5rem); align-items: end; } .nm-jak__glowa > * { margin: 0 !important; } .nm-jak h2 { margin-top: 0; } .nm-jak__opis { max-width: 42ch; font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: #d6dde2; } .nm-jak__kroki { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); counter-reset: nm-jak; } .nm-jak__kroki::before { content: ""; position: absolute; top: 1.5rem; left: 1.5rem; right: calc(33.333% - 1rem); border-top: 2px dashed rgb(240 207 114 / 0.45); } .nm-jak__kroki > * { margin: 0 !important; } .nm-jak__krok { counter-increment: nm-jak; position: relative; gap: 1rem; } .nm-jak__krok .pm-icon-box__icon { position: relative; background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent, #1d1f21); box-shadow: 0 0 0 6px var(--wp--preset--color--overlay, #0b2230); } .nm-jak__krok h3 { margin: 0.25rem 0 0 !important; color: #fff; } .nm-jak__krok h3::before { content: counter(nm-jak, decimal-leading-zero) "\00a0\00a0"; color: #f0cf72; font-family: var(--wp--preset--font-family--display); } .nm-jak__krok p { margin: 0.5rem 0 0 !important; max-width: 40ch; line-height: 1.5; color: #d6dde2; } .nm-jak__link a { font-weight: 700; color: #fff; text-decoration-color: #f0cf72; text-underline-offset: 0.2em; } .nm-jak__link a::after { content: "\00a0→"; } @media (max-width: 960px) { .nm-jak__glowa { grid-template-columns: minmax(0, 1fr); } .nm-jak__kroki { grid-template-columns: minmax(0, 1fr); } .nm-jak__kroki::before { display: none; } } /* „Inne formy opieki”: sześć białych kart pod kaflami – ikona w kolorze rodzaju (jak kropki na mapie), nazwa, jedno zdanie i liczba na żywo; cała karta klikalna (link nazwy rozciągnięty na kartę) */ .nm-rodzaje__inne { margin-top: var(--wp--preset--spacing--50) !important; } .nm-rodzaje__inne-tytul { margin: 0 0 1rem !important; font-size: var(--wp--preset--font-size--x-large); } .nm-inne { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; } .nm-inne > * { margin: 0 !important; } .nm-inny { --nm-typ: var(--wp--custom--typ--prywatny, #12394f); --pm-icon-bg: var(--nm-typ) !important; --pm-icon-color: #fff !important; position: relative; gap: 0.75rem; padding: 1.25rem 1.375rem; border-radius: var(--wp--custom--radius--l, 10px); background: var(--wp--preset--color--base, #fff); box-shadow: var(--wp--preset--shadow--subtle); transition: box-shadow 200ms ease, transform 200ms ease; } .nm-inny:hover, .nm-inny:focus-within { box-shadow: 0 18px 36px -24px rgb(11 34 48 / 0.45); transform: translateY(-2px); } .nm-inny:focus-within { outline: 3px solid var(--wp--custom--focus--color, #12394f); outline-offset: 3px; } .nm-inny--hospicjum { --nm-typ: var(--wp--custom--typ--hospicjum, #8e3b4e); } .nm-inny--opieka { --nm-typ: var(--wp--custom--typ--opieka, #5a4a9c); } .nm-inny--sanatorium { --nm-typ: var(--wp--custom--typ--sanatorium, #2c6493); } .nm-inny--turnus { --nm-typ: var(--wp--custom--typ--turnus, #8a5524); } .nm-inny--mieszkania { --nm-typ: var(--wp--custom--typ--mieszkania, #2d6a4f); } .nm-inny--dzienny { --nm-typ: var(--wp--custom--typ--dzienny, #4a4e54); } .nm-inny__nazwa { margin: 0 !important; font-size: var(--wp--preset--font-size--large); line-height: 1.2; } .nm-inny__nazwa a { color: var(--wp--preset--color--heading); text-decoration: none; } .nm-inny__nazwa a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; } .nm-inny__nazwa a:focus-visible { outline: none; } .nm-inny:hover .nm-inny__nazwa a { text-decoration: underline; text-decoration-color: var(--nm-typ); text-underline-offset: 0.2em; } .nm-inny__opis { margin: 0.375rem 0 0 !important; line-height: 1.45; color: var(--wp--preset--color--contrast); } .nm-inny__liczba { margin: 0.75rem 0 0 !important; font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--nm-typ); } @media (max-width: 960px) { .nm-inne { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 600px) { .nm-inne { grid-template-columns: minmax(0, 1fr); } } /* „Domy opieki w województwach”: opis i zdjęcie z lewej, 16 województw w jasnych polach z prawej */ .nm-woj-uklad { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; } .nm-woj-uklad > * { margin: 0 !important; } .nm-woj-uklad__lewa > * { margin: 0; } .nm-woj-uklad__opis { margin-top: 1rem !important; max-width: 40ch; font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--heading); } .nm-woj-uklad__zdjecie { margin-top: var(--wp--preset--spacing--50) !important; } .nm-woj-uklad__zdjecie img { border-radius: var(--wp--custom--radius--l); } .nm-woj-uklad__prawa .nm-woj-lista { --nm-kolumny: 2 !important; gap: 0.5rem; margin: 0 !important; } .nm-woj-uklad__prawa .nm-woj-lista a { padding: 0.5rem 0.75rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); box-shadow: none; transition: background-color 160ms ease; } .nm-woj-uklad__prawa .nm-woj-lista a:hover { background: var(--wp--preset--color--accent-soft); } .nm-woj-uklad__prawa .nm-woj-lista b { font-size: 0.9375rem; font-weight: 600; } .nm-woj-uklad__prawa .nm-woj-lista a > * { font-size: 0.875rem; } .nm-woj-uklad__prawa .nm-woj-lista a:hover { transform: translateY(-2px); } .nm-woj-uklad__prawa .nm-woj-lista a { transition: background-color 160ms ease, transform 200ms ease; } /* „Prowadzisz dom opieki?”: zdjęcie z drona obok granatowego pola (blok Media i tekst) */ .nm-wlasciciele-glowna { margin-block: 0 !important; color: #dfe5e9; } .nm-wlasciciele-glowna .wp-block-media-text__media { min-height: clamp(18rem, 34vw, 30rem); } .nm-wlasciciele-glowna .wp-block-media-text__content { padding: clamp(2.5rem, 5vw, 4.5rem) max(var(--wp--style--root--padding-right), calc((100vw - var(--wp--style--global--wide-size)) / 2)) clamp(2.5rem, 5vw, 4.5rem) clamp(2rem, 5vw, 5rem); } .nm-wlasciciele-glowna .wp-block-media-text__content > * { max-width: 34rem; margin-block: 0; } .nm-wlasciciele-glowna .wp-block-media-text__content { background: radial-gradient(120% 90% at 100% 0%, rgb(212 161 42 / 0.18) 0%, rgb(212 161 42 / 0) 55%), linear-gradient(160deg, #12394f 0%, #0b2230 72%); } .nm-wlasciciele-glowna .wp-block-media-text__content > * + * { margin-top: 1.25rem; } .nm-wlasciciele-glowna__zdanie { font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: #fff; } .nm-wlasciciele-glowna__lista { display: grid; gap: 0.5rem; padding: 0; list-style: none; } .nm-wlasciciele-glowna__lista li { position: relative; padding-left: 1.75rem; } .nm-wlasciciele-glowna__lista li::before { content: ""; position: absolute; left: 0.125rem; top: 0.4em; width: 0.875rem; height: 0.45rem; border-left: 2px solid var(--wp--preset--color--accent); border-bottom: 2px solid var(--wp--preset--color--accent); transform: rotate(-45deg); } .nm-wlasciciele-glowna .wp-block-buttons { margin-top: 1.75rem !important; } @media (max-width: 600px) { .nm-woj-uklad__prawa .nm-woj-lista { --nm-kolumny: 1 !important; } } /* „Najczęstsze pytania”: tytuł i kontakt z lewej, pytania w jasnych polach z prawej */ .nm-faq-uklad { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; } .nm-faq-uklad > * { margin: 0 !important; } .nm-faq-uklad__lewa > * { margin: 0; } .nm-faq-uklad__lewa > * + * { margin-top: 1.25rem; } .nm-faq-uklad__kontakt { max-width: 30ch; font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--heading); } @media (max-width: 1080px) { .nm-woj-uklad, .nm-faq-uklad { grid-template-columns: minmax(0, 1fr); } .nm-woj-uklad__zdjecie, .nm-faq-uklad__zdjecie { display: none; } } @media (max-width: 781px) { .nm-rodzaje__glowa, .nm-sytuacje__glowa, .nm-jak__glowa { grid-template-columns: minmax(0, 1fr); } .nm-rodzaje__glowa h2 { grid-row: auto; } .nm-wlasciciele-glowna.wp-block-media-text > .wp-block-media-text__content { padding: var(--wp--preset--spacing--60) max(1.25rem, var(--wp--style--root--padding-right)) var(--wp--preset--spacing--60) max(1.25rem, var(--wp--style--root--padding-left)); } } /* „Jak znaleźć miejsce” na stronie Dla placówek: kroki dużym tekstem (lista numerowana) */ .nm-kroki-lista { display: grid; gap: 1.5rem; margin: 0; padding-left: 1.75rem; font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-kroki-lista li::marker { font-weight: 700; color: var(--wp--preset--color--accent-dark); } .nm-kroki-lista strong { color: var(--wp--preset--color--heading); } /* Pytania na podstronach: jasne pola zamiast linii podziału */ .nm-pytania { display: grid; gap: 0.375rem; } /* Pytania placówek – zwarte jak FAQ na stronie głównej (E30) */ .nm-pytania .nm-pytanie { padding: 0 1rem; border-radius: var(--wp--custom--radius--l); } .nm-pytania .nm-pytanie summary { min-height: 3rem; padding-block: 0.625rem; font-size: var(--wp--preset--font-size--medium); font-weight: 600; } .nm-pytania .nm-pytanie > p { padding-bottom: 1rem; font-size: 1rem; line-height: 1.55; } .nm-pytanie { padding: 0 1.25rem; border-radius: var(--wp--custom--radius--m); background: var(--wp--preset--color--base-2); box-shadow: none !important; } .nm-pytania-sekcja .nm-pytanie { background: var(--wp--preset--color--surface); } .nm-pytania > * { margin: 0 !important; } /* Pytania na stronie głównej: jasne pola bez linii; strzałka z dwóch kresek */ .nm-faq-glowna { display: grid; gap: 0.375rem; } .nm-faq-glowna > * { margin: 0 !important; } .nm-faq-glowna details { margin: 0; padding: 0 1rem; border: 0 !important; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base); box-shadow: none !important; } .nm-faq-glowna summary { display: flex; justify-content: space-between; gap: 1rem; align-items: center; min-height: 3rem; padding-block: 0.625rem; font-weight: 600; font-size: var(--wp--preset--font-size--medium); line-height: 1.3; color: var(--wp--preset--color--heading); cursor: pointer; list-style: none; } .nm-faq-glowna summary::-webkit-details-marker { display: none; } .nm-faq-glowna summary::after { content: ""; flex: none; width: 0.6rem; height: 0.6rem; margin-right: 0.35rem; border-right: 2px solid var(--wp--preset--color--accent-dark); border-bottom: 2px solid var(--wp--preset--color--accent-dark); transform: rotate(45deg); transition: transform var(--wp--custom--transition); } .nm-faq-glowna details[open] summary::after { transform: rotate(-135deg); } .nm-faq-glowna details > p { margin: 0; padding-bottom: 1rem; max-width: 68ch; font-size: 1rem; line-height: 1.55; color: var(--wp--preset--color--contrast); } .nm-faq-glowna details > p a { font-weight: 600; white-space: nowrap; } .nm-faq-uklad__zdjecie img { border-radius: var(--wp--custom--radius--l); } .nm-faq-skroty { padding: 1.25rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base); } .nm-faq-skroty > * { margin: 0; } .nm-faq-skroty__tytul { font-size: var(--wp--preset--font-size--large); } .nm-faq-skroty__lista { display: grid; gap: 0.375rem; margin-top: 0.75rem !important; padding: 0; list-style: none; } .nm-faq-skroty__lista a { font-weight: 600; color: var(--wp--preset--color--primary); text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-faq-skroty__lista a::after { content: "\00a0→"; } .nm-faq-skroty__mail { margin-top: 1rem !important; font-size: var(--wp--preset--font-size--small); } /* Poradnik (strona wpisów): najnowszy artykuł jako duża granatowa karta (zdjęcie z lewej, tekst z prawej), pozostałe w siatce kart (style kart – wyżej, „Karty artykułów”) */ .nm-poradnik-glowa h1 { margin: 0; } .nm-poradnik-glowa .nm-poradnik__opis { margin-top: 0.75rem; } .nm-poradnik__naglowek { margin-top: 0; } .nm-poradnik-pierwszy { margin-top: var(--wp--preset--spacing--40); } .nm-poradnik-pierwszy__lista { margin: 0; padding: 0; list-style: none; } .nm-poradnik-pierwszy__lista > li { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: stretch; overflow: hidden; border-radius: 18px; background: var(--wp--preset--color--overlay, #0b2230); color: #fff; box-shadow: 0 30px 60px -36px rgb(11 34 48 / 0.6); } .nm-poradnik-pierwszy .wp-block-post-featured-image { margin: 0; overflow: hidden; } .nm-poradnik-pierwszy .wp-block-post-featured-image img { height: 100%; border-radius: 0; object-fit: cover; transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1); } .nm-poradnik-pierwszy__lista > li:hover .wp-block-post-featured-image img { transform: scale(1.03); } .nm-poradnik-pierwszy__tekst { display: flex; flex-direction: column; justify-content: center; padding: clamp(1.5rem, 3.5vw, 3.5rem); } .nm-poradnik-pierwszy__tekst > * { margin: 0; } .nm-poradnik-pierwszy__tekst > * + * { margin-top: 1rem !important; } .nm-poradnik-strona .wp-block-post-excerpt, .nm-poradnik-strona .wp-block-post-excerpt__excerpt { margin: 0; color: var(--wp--preset--color--contrast); } .nm-poradnik-pierwszy .wp-block-post-title { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.1; } .nm-poradnik-pierwszy .wp-block-post-title a { color: #fff; text-decoration: none; } .nm-poradnik-pierwszy .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; } .nm-poradnik-pierwszy__lista > li:hover .wp-block-post-title a, .nm-poradnik-pierwszy .wp-block-post-title a:focus-visible { text-decoration: underline; text-decoration-color: #f0cf72; text-decoration-thickness: 2px; } .nm-poradnik-pierwszy .nm-wpis-dzial a { color: #f0cf72; } .nm-poradnik-pierwszy .wp-block-post-excerpt__excerpt { font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: #d6dde2; } .nm-poradnik-pierwszy .wp-block-post-excerpt__more-text { margin: 1.25rem 0 0; } .nm-poradnik-pierwszy .wp-block-post-excerpt__more-link { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.5rem 1.25rem; border-radius: var(--wp--custom--radius--button, 8px); background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent, #1d1f21); font: 700 1rem/1.1 var(--wp--preset--font-family--heading); text-decoration: none; } .nm-poradnik-pierwszy .wp-block-post-excerpt__more-link::after { content: "\00a0→"; } .nm-poradnik-siatka { margin-top: var(--wp--preset--spacing--60); } @media (max-width: 900px) { .nm-poradnik-pierwszy__lista > li { grid-template-columns: minmax(0, 1fr); } .nm-poradnik-pierwszy .wp-block-post-featured-image { aspect-ratio: 16 / 10; } } /* Zachęta do wyszukiwania: jasne pole na końcu artykułu i jasny pas na dole poradnika */ .nm-cta-szukaj > * { margin: 0; } .nm-cta-szukaj__tekst > * { margin: 0; } .nm-cta-szukaj__tekst h2 { font-size: var(--wp--preset--font-size--x-large); } .nm-cta-szukaj__tekst p { margin-top: 0.5rem; max-width: 52ch; } .nm-cta-szukaj .wp-block-buttons { margin-top: 1.25rem; } .wp-block-post-content > .nm-cta-szukaj { margin-top: var(--wp--preset--spacing--60) !important; padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); } .nm-poradnik-cta .nm-cta-szukaj { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.5rem 3rem; } .nm-poradnik-cta .nm-cta-szukaj__tekst h2 { font-size: var(--wp--preset--font-size--xx-large); } .nm-poradnik-cta .nm-cta-szukaj__tekst p { color: var(--wp--preset--color--contrast); } .nm-poradnik-cta .nm-cta-szukaj .wp-block-buttons { margin-top: 0; } /* Zachęta artykułu: wyszukiwarka z typem placówki z góry; pola obok siebie, gdy kolumna ma miejsce */ .nm-cta-artykul { container-type: inline-size; } .nm-cta-artykul .nm-szukaj { margin-top: 1.25rem; } .nm-cta-artykul .nm-szukaj__pola.bez-nazwy, .nm-cta-artykul .nm-szukaj__pola.bez-nazwy.bez-ceny { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; } .nm-cta-artykul .nm-szukaj__pola .nm-btn { grid-column: auto; min-height: 3.25rem; } .nm-cta-artykul .nm-szukaj__dol { margin-top: 0.5rem; } .nm-cta-artykul__linki { margin-top: 1rem !important; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--contrast); } @container (min-width: 34rem) { .nm-cta-artykul .nm-szukaj__pola.bez-nazwy.bez-ceny { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 0.75rem; } .nm-cta-artykul .nm-szukaj__pola.bez-nazwy:not(.bez-ceny) { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 0.75rem; } .nm-cta-artykul .nm-szukaj__pola.bez-nazwy:not(.bez-ceny) .nm-btn { grid-column: 1 / -1; } } /* Krótka zachęta w treści artykułu (znacznik [[cta]] w pliku Markdown) */ .wp-block-post-content > .nm-cta-krotka { padding: 1rem 1.25rem; border-left: 4px solid var(--wp--preset--color--accent); border-radius: 0 var(--wp--custom--radius--m) var(--wp--custom--radius--m) 0; background: var(--wp--preset--color--base-2); } /* * Ciemne pasy ze zdjęciem pod nagłówkiem na każdej podstronie (jak pierwszy ekran strony głównej): * nagłówki podstron z motywu (zdjęcie wyróżniające), poradnik i artykuły. Równe granatowe przyciemnienie. */ .pm-page-hero.wp-block-cover, .nm-ciemny-pas.wp-block-cover { min-height: var(--nm-pas) !important; align-items: flex-end !important; padding-top: 2.5rem !important; padding-bottom: 2.75rem !important; } .pm-page-hero .wp-block-cover__background { background-image: none !important; background-color: var(--wp--preset--color--overlay) !important; opacity: 0.74 !important; } /* Okruszki i tytuł podstrony od lewej krawędzi układu – w tej samej linii co logo i tytuły wyników, karty i poradnika */ .pm-page-hero .wp-block-cover__inner-container > :not(.alignfull) { max-width: var(--wp--style--global--wide-size) !important; } .nm-ciemny-pas { color: #fff; } .nm-ciemny-pas .nm-lead, .nm-ciemny-pas p { color: rgb(255 255 255 / 0.9); } .nm-ciemny-pas .pm-breadcrumbs { margin-bottom: 0.75rem; opacity: 0.9; } .nm-wpis-glowa__in > * { margin: 0; } .nm-wpis-glowa .wp-block-post-title { margin: 0.25rem 0 1rem; font-size: var(--wp--preset--font-size--huge); max-width: 28ch; text-wrap: balance; } .nm-wpis-glowa__meta { gap: 0.25rem 1.25rem; font-size: var(--wp--preset--font-size--small); } .nm-wpis-glowa__meta > * { margin: 0; color: rgb(255 255 255 / 0.82) !important; } /* Nagłówki podstron wyśrodkowane – jak pierwszy ekran strony głównej i pas wyników (decyzja właściciela 1.11.2026): strony ze zdjęciem, poradnik, działy, artykuły i strony tekstowe (regulamin, polityka). */ :is(.pm-page-hero, .nm-ciemny-pas) .wp-block-cover__inner-container, .nm-strona-glowa > .alignwide { text-align: center; } :is(.pm-page-hero, .nm-ciemny-pas, .nm-strona-glowa) .pm-breadcrumbs ol { justify-content: center; } :is(.nm-wpis-glowa, .nm-strona-glowa) .wp-block-post-title, .nm-poradnik-glowa .nm-poradnik__opis { margin-inline: auto; } .nm-wpis-glowa__meta, .nm-poradnik-glowa .wp-block-buttons, .nm-poradnik-glowa .nm-psz__przyklady { justify-content: center; } /* * Artykuł poradnika. Tytuł i tekst stoją w tej samej siatce co logo i nagłówki innych podstron; od 1100 px * obok tekstu jest przyklejona kolumna ze spisem treści i zachętą. Kolumna tekstu ma ok. 70 znaków w wierszu. */ .nm-wpis-glowa .wp-block-cover__inner-container > .nm-wpis-glowa__in { max-width: var(--wp--style--global--wide-size) !important; margin-inline: auto; } /* Tytuł w ciemnym pasie w jednej linii z logo i tekstem: margines boczny daje już kontener w środku pasa. */ :is(.nm-wpis-glowa, .nm-poradnik-glowa).wp-block-cover { padding-inline: 0 !important; } /* Ostatnia pozycja okruszków powtarza tytuł tuż pod nią – w artykule jej nie pokazujemy (czytnik ekranu ma ją w tytule). */ .nm-wpis-glowa .pm-breadcrumbs li[aria-current="page"] { display: none; } @media (max-width: 40rem) { .nm-wpis-glowa .wp-block-post-title { font-size: clamp(1.625rem, 1.2rem + 2vw, 1.875rem); line-height: 1.12; } .nm-wpis-glowa .pm-breadcrumbs li:nth-child(2) { display: none; } } /* * Układ: telefon – spis (zwinięty), tekst, artykuły z działu pod tekstem (panel się rozpada: display: contents); * od 1100 px – tekst od lewej krawędzi siatki (w jednej linii z tytułem, najwyżej 64rem) i panel po prawej * (spis, zachęta, artykuły z działu) – przyklejony, przewija się sam, gdy jest wyższy niż ekran. Pod panelem pas * w kolorze tła sekcji od lewej krawędzi panelu (z zapasem) do prawej krawędzi ekranu, przez całą wysokość artykułu. */ .nm-wpis-uklad { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "spis" "tresc" "bok"; gap: var(--wp--preset--spacing--40); align-items: start; } .nm-wpis-uklad > *, .nm-wpis-panel > * { margin: 0 !important; } .nm-wpis-panel { display: contents; } .nm-wpis-spis { grid-area: spis; } .nm-wpis-tresc { grid-area: tresc; } .nm-wpis-bok { grid-area: bok; display: grid; gap: 1.25rem; align-content: start; } .nm-wpis-spis:not(:has(.nm-spis)) { display: none; } @media (min-width: 68.75rem) { .nm-wpis { --nm-panel: 19rem; --nm-panel-zapas: clamp(1.25rem, 2vw, 2rem); position: relative; isolation: isolate; } .nm-wpis::before { content: ""; position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; width: calc(50% - min(50% - var(--wp--style--root--padding-right, 2.5rem), var(--wp--style--global--wide-size) / 2) + var(--nm-panel) + var(--nm-panel-zapas)); border-left: 1px solid #e3e6e9; background: linear-gradient(100deg, #fdfdfd 0%, #f5f6f7 45%, #eceff1 100%); } .nm-wpis-uklad { grid-template-columns: minmax(0, 1fr) var(--nm-panel); grid-template-areas: "tresc panel"; column-gap: clamp(3rem, 5vw, 5rem); } .nm-wpis-tresc .wp-block-post-content, .nm-wpis-dalej { max-width: 64rem; } .nm-wpis-panel { grid-area: panel; display: grid; gap: 0.75rem; align-content: start; position: sticky; top: 7.5rem; max-height: calc(100vh - 8.5rem); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; } .nm-wpis-panel > * { grid-area: auto; } /* Zwarty panel: spis, zachęta i trzy artykuły mieszczą się na ekranie 1440 × 900 bez przewijania panelu. */ .nm-wpis-panel .nm-spis { padding: 0.25rem 0 0; } .nm-wpis-panel .nm-spis__lista a { padding-block: 0.35rem; } .nm-wpis-panel .nm-spis__lista a:hover, .nm-wpis-panel .nm-spis__lista a[aria-current="true"] { background: var(--wp--preset--color--surface); } .nm-wpis-panel .nm-wpis-zacheta { padding: 1rem 1.125rem; } .nm-wpis-panel .nm-wpis-zacheta__tytul { font-size: 1.25rem; } .nm-wpis-panel .nm-wpis-zacheta__przycisk { min-height: 2.75rem; margin-top: 0.75rem; } .nm-wpis-panel .nm-powiazane { padding: 0.625rem; background: var(--wp--preset--color--surface); box-shadow: 0 0 0 1px #e3e6e9, 0 2px 6px -2px rgb(16 24 40 / 0.08); } .nm-wpis-panel .nm-powiazane__lista { gap: 0; margin-top: 0.5rem !important; } .nm-wpis-panel .nm-powiazane__lista a { grid-template-columns: 2.5rem minmax(0, 1fr); padding: 0.3rem 0.5rem; } .nm-wpis-panel .nm-powiazane__lista a:hover { background: var(--wp--preset--color--base-2); } .nm-wpis-panel .nm-powiazane__zdjecie { width: 2.5rem; height: 2.5rem; } .nm-wpis-panel .nm-powiazane__wszystkie { margin-top: 0.5rem !important; } } .nm-wpis-tresc .wp-block-post-content { font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem); line-height: 1.65; color: var(--wp--preset--color--contrast); } .nm-wpis-tresc .wp-block-post-content > * { margin-block: 0; } .nm-wpis-tresc .wp-block-post-content > * + * { margin-block-start: 1.15em; } .nm-wpis-tresc .wp-block-post-content > .nm-lead { font-size: clamp(1.25rem, 1.05rem + 0.75vw, 1.5rem); line-height: 1.5; color: var(--wp--preset--color--heading); } .nm-wpis-tresc .wp-block-post-content > h2 { margin-block-start: 2.25em; font-size: clamp(1.625rem, 1.25rem + 1.1vw, 2.125rem); line-height: 1.15; text-wrap: balance; scroll-margin-top: 1.25rem; } .nm-wpis-tresc .wp-block-post-content > h3 { margin-block-start: 1.75em; font-size: var(--wp--preset--font-size--large); line-height: 1.25; scroll-margin-top: 1.25rem; } .nm-wpis-tresc .wp-block-post-content > :is(h2, h3) + * { margin-block-start: 0.6em; } .nm-wpis-tresc :is(h2, h3) { scroll-margin-top: 1.25rem; } .nm-wpis-tresc .wp-block-post-content :is(ul, ol) { padding-inline-start: 1.25em; } .nm-wpis-tresc .wp-block-post-content li + li { margin-top: 0.4em; } .nm-wpis-tresc .wp-block-post-content li::marker { color: var(--wp--preset--color--accent-dark); } .nm-wpis-tresc .wp-block-post-content strong { color: var(--wp--preset--color--heading); } .nm-wpis-tresc .wp-block-post-content a:where(:not(.wp-element-button):not(.nm-btn)) { text-decoration-thickness: 1px; text-underline-offset: 0.18em; } .nm-wpis-tresc .wp-block-post-content a:where(:not(.wp-element-button):not(.nm-btn)):hover { text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; } .nm-wpis-tresc .nm-przyklad { padding: 1.25rem 1.5rem; font-size: var(--wp--preset--font-size--medium); } .nm-wpis-tresc .nm-tabela { margin-block: 1.75em; } .nm-wpis-tresc .nm-tabela table { font-size: var(--wp--preset--font-size--medium); } /* Strony tekstowe (regulamin, polityka, źródła zdjęć): ta sama kolumna co w artykule. */ .nm-strona-glowa .wp-block-post-title { max-width: 28ch; font-size: var(--wp--preset--font-size--huge); text-wrap: balance; } .nm-strona-glowa > .alignwide > * { margin-block: 0; } .nm-strona-glowa + .nm-wpis .nm-wpis-tresc .wp-block-post-content > :first-child { margin-top: 0; } /* Spis treści: na telefonie zwinięty nad tekstem, od 1100 px lekka lewa kolumna. */ /* Płynne przejście do sekcji po kliknięciu w spis (przy „ogranicz ruch” motyw nadrzędny wyłącza je dla całej strony). */ html:has([data-nm-spis]) { scroll-behavior: smooth; } .nm-spis { padding: 1rem 1.25rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); } .nm-spis__tytul { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: var(--wp--custom--control--min); font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--medium); font-weight: 600; color: var(--wp--preset--color--heading); cursor: pointer; list-style: none; } .nm-spis__tytul::-webkit-details-marker { display: none; } .nm-spis__tytul::after { content: ""; width: 0.6rem; height: 0.6rem; margin-right: 0.25rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-25%) rotate(45deg); transition: transform 0.2s; } .nm-spis[open] .nm-spis__tytul::after { transform: translateY(25%) rotate(-135deg); } .nm-spis__lista { display: grid; gap: 0.125rem; margin: 0.5rem 0 0.25rem; padding: 0; list-style: none; } .nm-spis__lista a { display: block; padding: 0.5rem 0.75rem; border-radius: var(--wp--custom--radius--m); font-size: var(--wp--preset--font-size--small); line-height: 1.35; color: var(--wp--preset--color--muted); text-decoration: none; transition: background-color 0.15s, color 0.15s; } .nm-spis__lista a:hover { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--heading); } .nm-spis__lista a[aria-current="true"] { background: var(--wp--preset--color--surface); box-shadow: inset 3px 0 0 var(--wp--preset--color--accent); font-weight: 600; color: var(--wp--preset--color--heading); } @media (min-width: 68.75rem) { .nm-spis { padding: 0; border-radius: 0; background: none; } .nm-spis__tytul { min-height: 0; margin-bottom: 0.5rem; padding-left: 0.75rem; cursor: default; pointer-events: none; } .nm-spis__tytul::after { display: none; } .nm-spis__lista { margin: 0; } .nm-spis__lista a:hover, .nm-spis__lista a[aria-current="true"] { background: var(--wp--preset--color--base-2); } } /* Zachęta w prawej kolumnie (ciemna przy artykule, jasna przy stronie tekstowej). */ .nm-wpis-zacheta { padding: 1.5rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--primary); color: var(--wp--preset--color--on-primary); } .nm-wpis-zacheta > * { margin: 0; } .nm-wpis-zacheta__tytul { font-family: var(--wp--preset--font-family--heading); font-size: clamp(1.25rem, 1.05rem + 0.75vw, 1.5rem); font-weight: 600; line-height: 1.15; color: #fff; } .nm-wpis-zacheta p:not(.nm-wpis-zacheta__tytul) { margin-top: 0.5rem; font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: rgb(255 255 255 / 0.88); } .nm-wpis-zacheta__przycisk { display: inline-flex; align-items: center; min-height: 3rem; margin-top: 1.25rem; padding: 0 1.25rem; border-radius: var(--wp--custom--radius--button); background: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--heading); font-weight: 700; color: var(--wp--preset--color--on-accent); text-decoration: none; transition: background-color 0.15s, transform 0.15s; } .nm-wpis-zacheta__przycisk:hover { background: #e0b244; transform: translateY(-1px); } .nm-wpis-zacheta__przycisk:focus-visible { outline: 3px solid var(--wp--custom--focus--on-dark); outline-offset: 3px; } .nm-wpis-zacheta--jasna { background: var(--wp--preset--color--base-2); color: var(--wp--preset--color--contrast); } .nm-wpis-zacheta--jasna .nm-wpis-zacheta__tytul { color: var(--wp--preset--color--heading); } .nm-wpis-zacheta--jasna p:not(.nm-wpis-zacheta__tytul) { color: var(--wp--preset--color--contrast); } .nm-wpis-zacheta--jasna .nm-wpis-zacheta__przycisk { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--on-primary); } .nm-wpis-zacheta--jasna .nm-wpis-zacheta__przycisk:hover { background: var(--wp--preset--color--primary-dark); } .nm-wpis-zacheta--jasna .nm-wpis-zacheta__przycisk:focus-visible { outline-color: var(--wp--custom--focus--color); } /* Więcej z działu: trzy artykuły z miniaturami, tytuł w najwyżej dwóch wierszach. */ .nm-powiazane { padding: 1.25rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); } .nm-powiazane > * { margin: 0; } .nm-powiazane__tytul { padding: 0 0.5rem; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--medium); font-weight: 600; color: var(--wp--preset--color--heading); } .nm-powiazane__lista { display: grid; gap: 0.25rem; margin: 0.75rem 0 0 !important; padding: 0; list-style: none; } .nm-powiazane__lista a { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 0.75rem; align-items: center; padding: 0.5rem; border-radius: var(--wp--custom--radius--m); font-size: var(--wp--preset--font-size--small); font-weight: 600; line-height: 1.3; color: var(--wp--preset--color--heading); text-decoration: none; transition: background-color 0.15s; } .nm-powiazane__lista a:hover { background: var(--wp--preset--color--surface); } .nm-powiazane__lista a:hover span { text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; } .nm-powiazane__lista span { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .nm-powiazane__zdjecie { width: 3rem; height: 3rem; border-radius: var(--wp--custom--radius--m); object-fit: cover; } .nm-powiazane__wszystkie { display: inline-block; margin-top: 0.75rem !important; padding: 0.25rem 0.5rem; font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--wp--preset--color--primary); } @media (min-width: 48rem) and (max-width: 68.74rem) { .nm-powiazane__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* Poniżej 1100 px artykuły z działu są pod tekstem: zachęta powtarzałaby tę w treści – zostają same artykuły. */ @media (max-width: 68.74rem) { .nm-wpis-zacheta { display: none; } } @media (max-width: 68.74rem) { .nm-wpis-uklad { gap: var(--wp--preset--spacing--30); } .nm-wpis-bok { margin-top: var(--wp--preset--spacing--30) !important; } } @media (prefers-reduced-motion: reduce) { .nm-spis__tytul::after, .nm-wpis-zacheta__przycisk, .nm-spis__lista a, .nm-powiazane__lista a { transition: none; } .nm-wpis-zacheta__przycisk:hover { transform: none; } } /* Poprzedni i następny artykuł: dwa jasne kafle zamiast linii. */ .nm-wpis-dalej { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)) !important; gap: 1rem !important; margin-top: var(--wp--preset--spacing--60) !important; } .nm-wpis-dalej .wp-block-post-navigation-link { display: flex; margin: 0; } .nm-wpis-dalej .wp-block-post-navigation-link a { display: grid; flex: 1; align-content: start; gap: 0.25rem; padding: 1rem 1.25rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--base-2); text-decoration: none; transition: background-color 0.15s; } .nm-wpis-dalej .wp-block-post-navigation-link a:hover { background: var(--wp--preset--color--accent-soft); } .nm-wpis-dalej .post-navigation-link__label { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); } .nm-wpis-dalej .post-navigation-link__title { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--large); font-weight: 600; line-height: 1.3; color: var(--wp--preset--color--heading); } .nm-wpis-dalej .post-navigation-link-next { text-align: right; } @media (prefers-reduced-motion: reduce) { .nm-wpis-dalej .wp-block-post-navigation-link a { transition: none; } } /* Małe nagłówki w panelach, listach i na karcie placówki – lżejsze niż tytuły sekcji */ .nm-karta__podtytul, .nm-ramka h2, .nm-przejmij h2, .nm-cennik__opis h3, .nm-miejsce h3, .nm-stopka .wp-block-column h2, .nm-split--wyniki .nm-listhead h2, .nm-grupa, .nm-split__list h3:not(.nm-card__name):not(.nm-cities-h), .nm-sheet h3 { font-weight: 600; letter-spacing: -0.01em; } .nm-karta__glowna h2 { font-size: clamp(1.625rem, 1.3rem + 1vw, 2.125rem); } /* Kroje zastępcze dopasowane do Cairo, Rajdhani i Goldman (Arial i Arial Bold w skali szerokości, te same wysokości): tekst łamie się tak samo przed wczytaniem czcionek i po nim – bez przesunięcia układu (CLS). */ @font-face { font-family: "Cairo Fallback"; font-weight: 400 549; src: local("Arial"), local("ArialMT"), local("Liberation Sans"); size-adjust: 93.7%; ascent-override: 138.7%; descent-override: 60.8%; line-gap-override: 0%; } @font-face { font-family: "Cairo Fallback"; font-weight: 550 900; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"); size-adjust: 90.4%; ascent-override: 143.8%; descent-override: 63%; line-gap-override: 0%; } @font-face { font-family: "Rajdhani Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"); size-adjust: 85.5%; ascent-override: 108.8%; descent-override: 40.9%; line-gap-override: 0%; } @font-face { font-family: "Goldman Fallback"; font-weight: 400 549; src: local("Arial"), local("ArialMT"), local("Liberation Sans"); size-adjust: 114.7%; ascent-override: 78.5%; descent-override: 26.2%; line-gap-override: 0%; } @font-face { font-family: "Goldman Fallback"; font-weight: 550 900; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"); size-adjust: 114.9%; ascent-override: 78.3%; descent-override: 26.1%; line-gap-override: 0%; } /* Poradnik: kafle działów (strona poradnika i dół działu), tabele w artykułach, stronicowanie działu. */ .nm-poradnik-dzialy h2 { margin-top: 0; } /* Działy: 10 stałych działów (nowych nie dodajemy, projekt/decyzje.md), numerowane jak rozdziały. Telefon: 2 kolumny × 5 rzędów bez opisu. Od 600 px (--2x5): 2 kolumny × 5 rzędów czytane kolumnami jak spis treści, numer po lewej; od 1280 px liczba artykułów w „pigułce” po prawej. */ .nm-dzialy { counter-reset: nm-dzial; gap: clamp(0.75rem, 1.6vw, 1.25rem); margin-top: var(--wp--preset--spacing--40); } .nm-dzialy.is-layout-grid { grid-template-columns: minmax(0, 1fr); } .nm-dzial { counter-increment: nm-dzial; position: relative; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); grid-template-areas: "nr nazwa" "nr opis" "nr liczba"; column-gap: 0.75rem; row-gap: 0.3rem; align-content: start; height: 100%; padding: 1.1rem 1.25rem 1rem; border-radius: var(--wp--custom--radius--l); background: var(--wp--preset--color--surface); box-shadow: var(--wp--preset--shadow--subtle); transition: box-shadow 0.25s ease, transform 0.25s cubic-bezier(0.16, 1, 0.3, 1); } .nm-dzial > * { margin: 0 !important; } .nm-dzial::before { content: counter(nm-dzial, decimal-leading-zero); content: counter(nm-dzial, decimal-leading-zero) / ""; grid-area: nr; padding-top: 0.15rem; font: 400 1.6rem/1 var(--wp--preset--font-family--display); color: var(--wp--preset--color--accent-dark); } .nm-dzial::after { content: ""; position: absolute; left: 1.25rem; top: 0; width: 2.5rem; height: 4px; border-radius: 0 0 2px 2px; background: var(--nm-zloto, var(--wp--preset--color--accent)); transition: width 0.45s cubic-bezier(0.16, 1, 0.3, 1); } .nm-dzial__nazwa { grid-area: nazwa; font-size: var(--wp--preset--font-size--large); line-height: 1.2; } .nm-dzial__nazwa a { color: var(--wp--preset--color--heading); text-decoration: none; } .nm-dzial__nazwa a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; } .nm-dzial__opis { grid-area: opis; font-size: var(--wp--preset--font-size--small); line-height: 1.45; color: var(--wp--preset--color--contrast); } .nm-dzial__liczba { grid-area: liczba; padding-top: 0.2rem; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--small); font-weight: 700; color: var(--wp--preset--color--primary); } .nm-dzial__liczba::after { content: "\00a0→"; display: inline-block; transition: transform 0.25s ease; } .nm-dzial:hover { box-shadow: var(--wp--preset--shadow--raised); transform: translateY(-3px); } .nm-dzial:is(:hover, :focus-within)::after { width: calc(100% - 2.5rem); } .nm-dzial:hover .nm-dzial__liczba::after { transform: translateX(4px); } .nm-dzial:hover .nm-dzial__nazwa a, .nm-dzial__nazwa a:focus-visible { text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; } @media (max-width: 599px) { /* Telefon: 2 kolumny × 5 rzędów, sam numer, nazwa i liczba (opis jest na stronie działu). */ .nm-dzialy.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; } .nm-dzial { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr auto; grid-template-areas: "nr" "nazwa" "liczba"; row-gap: 0.4rem; padding: 1rem 0.9rem 0.9rem; } .nm-dzial::before { padding-top: 0.3rem; font-size: 1.45rem; } .nm-dzial::after { left: 0.9rem; } .nm-dzial:is(:hover, :focus-within)::after { width: calc(100% - 1.8rem); } .nm-dzial__nazwa { font-size: 1.1rem; overflow-wrap: anywhere; } .nm-dzial__opis { display: none; } } @media (min-width: 600px) { .nm-dzialy--2x5.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(5, auto); grid-auto-flow: column; } } @media (min-width: 1280px) { .nm-dzialy--2x5 .nm-dzial { grid-template-columns: 4rem minmax(0, 1fr) auto; grid-template-areas: "nr nazwa liczba" "nr opis liczba"; column-gap: 1.25rem; align-items: center; padding: 1.25rem 1.5rem; } .nm-dzialy--2x5 .nm-dzial::before { padding: 0; font-size: 2.6rem; } .nm-dzialy--2x5 .nm-dzial__liczba { padding: 0.4rem 0.8rem; border-radius: 999px; background: var(--wp--preset--color--base-2); white-space: nowrap; } } @media (prefers-reduced-motion: reduce) { .nm-dzial, .nm-dzial::after, .nm-dzial__liczba::after { transition: none; } .nm-dzial:hover { transform: none; } } .nm-tabela { margin-block: 1.5rem; overflow-x: auto; } .nm-tabela table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--medium); } .nm-tabela th, .nm-tabela td { padding: 0.75rem 1rem; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 18%, transparent); text-align: left; vertical-align: top; } .nm-tabela thead th { background: var(--wp--preset--color--base-2); font-family: var(--wp--preset--font-family--heading); font-weight: 600; color: var(--wp--preset--color--heading); } .nm-tabela tbody th { width: 34%; font-weight: 600; color: var(--wp--preset--color--heading); } .nm-tabela thead { border-bottom: 0; } .nm-zrodla { font-size: var(--wp--preset--font-size--small); } .nm-stan-prawny { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--contrast); } .nm-poradnik-strona .nm-strony { gap: 0.5rem; margin-top: var(--wp--preset--spacing--60); font-family: var(--wp--preset--font-family--heading); font-weight: 600; } .nm-poradnik-strona .nm-strony a, .nm-poradnik-strona .nm-strony .current { display: inline-flex; min-width: 2.75rem; min-height: 2.75rem; align-items: center; justify-content: center; padding: 0 0.75rem; border-radius: var(--wp--custom--radius--m); text-decoration: none; } .nm-poradnik-strona .nm-strony a { background: var(--wp--preset--color--base-2); color: var(--wp--preset--color--heading); } .nm-poradnik-strona .nm-strony .current { background: var(--wp--preset--color--primary); color: #fff; } .nm-dzial-pusty { max-width: 40rem; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--heading); } .nm-ilustracja { margin-block: 1.5rem; } .nm-ilustracja img { border-radius: var(--wp--custom--radius--m); box-shadow: var(--wp--preset--shadow--subtle); } /* Blok tabeli ma domyślnie stały układ kolumn i łamie słowa w połowie – w treści układ automatyczny, słowa całe */ .nm-tabela table.has-fixed-layout { table-layout: auto; } .nm-tabela table.has-fixed-layout th, .nm-tabela table.has-fixed-layout td { overflow-wrap: normal; word-break: normal; } @media (max-width: 600px) { .nm-tabela table { font-size: 0.9375rem; } .nm-tabela th, .nm-tabela td { padding: 0.5rem 0.625rem; overflow-wrap: normal; word-break: normal; hyphens: manual; } .nm-tabela tbody th { width: auto; } /* tabele z 4+ kolumnami przewijane w poziomie, z cieniem przy krawędzi, za którą jest dalsza część */ .nm-tabela table:has(thead th:nth-child(4)) { min-width: 34rem; } .nm-tabela table:has(thead th:nth-child(5)) { min-width: 42rem; } .nm-tabela table:has(thead th:nth-child(6)) { min-width: 50rem; } .nm-tabela:has(thead th:nth-child(4)) { background: linear-gradient(to right, var(--wp--preset--color--base) 30%, transparent) left / 2rem 100% no-repeat local, linear-gradient(to left, var(--wp--preset--color--base) 30%, transparent) right / 2rem 100% no-repeat local, radial-gradient(farthest-side at 0 50%, rgb(0 0 0 / 0.16), transparent) left / 0.75rem 100% no-repeat scroll, radial-gradient(farthest-side at 100% 50%, rgb(0 0 0 / 0.16), transparent) right / 0.75rem 100% no-repeat scroll; } } /* ——— Kontakt (E30): panel na zdjęciu z granatowym gradientem i dużymi kaflami kontaktu obok białej karty formularza, pod pasem nagłówka strony (bez nachodzenia); niżej trzy sprawy jako karty unoszące się pod kursorem ——— */ .nm-kontakt-nowy { padding-top: clamp(2rem, 4vw, 3.5rem) !important; } /* Treść strony bez górnego odstępu – sekcja z jasnym tłem zaczyna się tuż pod nagłówkiem strony */ .wp-block-post-content:has(> .nm-kontakt-nowy:first-child) { padding-top: 0 !important; } .nm-kontakt-uklad { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1rem, 2vw, 1.5rem); align-items: stretch; } .nm-kontakt-uklad > * { margin: 0 !important; } .nm-kontakt-panel.wp-block-cover { min-height: 0; align-items: stretch; padding: clamp(1.75rem, 3vw, 2.75rem); border-radius: 18px; overflow: hidden; } .nm-kontakt-panel .wp-block-cover__inner-container { display: flex; flex-direction: column; gap: 1.25rem; color: #e8edf0; } .nm-kontakt-panel .wp-block-cover__inner-container > * { margin: 0 !important; } .nm-kontakt-panel h2 { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.05; } .nm-kontakt-panel__lead { max-width: 40ch; font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-kontakt-kafle { display: grid; gap: 0.75rem; margin-top: 0.5rem !important; } .nm-kontakt-kafle > * { margin: 0 !important; } .nm-kontakt-k a { position: relative; display: grid; gap: 0.125rem; padding: 1rem 1.25rem 1rem 4.25rem; border-radius: 14px; background: rgb(255 255 255 / 0.1); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); color: #fff; text-decoration: none; transition: background-color 250ms ease, transform 300ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 250ms ease; } .nm-kontakt-k a::before { content: ""; position: absolute; left: 1rem; top: 50%; width: 2.5rem; height: 2.5rem; margin-top: -1.25rem; border-radius: 50%; background: var(--nm-zloto, var(--wp--preset--color--accent)); } .nm-kontakt-k a::after { content: ""; position: absolute; left: 1.625rem; top: 50%; width: 1.25rem; height: 1.25rem; margin-top: -0.625rem; background: var(--wp--preset--color--heading); -webkit-mask: var(--ik) center / contain no-repeat; mask: var(--ik) center / contain no-repeat; } .nm-kontakt-k--telefon { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.75'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M5%203h3.5l1.7%204.3-2.2%201.4a11%2011%200%200%200%205.3%205.3l1.4-2.2L19%2013.5V17a2%202%200%200%201-2.2%202A16%2016%200%200%201%203%205.2%202%202%200%200%201%205%203z'%2F%3E%3C%2Fsvg%3E"); } .nm-kontakt-k--mail { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.75'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Crect%20x%3D'3'%20y%3D'5'%20width%3D'18'%20height%3D'14'%20rx%3D'2'%2F%3E%3Cpath%20d%3D'm4%207%208%206%208-6'%2F%3E%3C%2Fsvg%3E"); } .nm-kontakt-k--skrzynka { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.75'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M3%2013h5l1.5%203h5L16%2013h5'%2F%3E%3Cpath%20d%3D'M5%205h14l2%208v6H3v-6z'%2F%3E%3C%2Fsvg%3E"); } .nm-kontakt-k a:hover, .nm-kontakt-k a:focus-visible { background: rgb(255 255 255 / 0.18); box-shadow: inset 0 0 0 1px rgb(240 207 114 / 0.7); transform: translateX(4px); } .nm-kontakt-k__etykieta { font-size: var(--wp--preset--font-size--small); color: #f0cf72; } .nm-kontakt-k__wartosc { font: 600 clamp(1.125rem, 0.95rem + 0.7vw, 1.5rem)/1.2 var(--wp--preset--font-family--heading); letter-spacing: 0.01em; overflow-wrap: anywhere; } .nm-kontakt-panel__firma { margin-top: auto !important; padding-top: 1rem; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.14); font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: #c3cdd4; } .nm-kontakt-panel__firma { display: grid; justify-items: center; gap: 0.75rem; text-align: center; } .nm-kontakt-panel__firma > * { margin: 0 !important; } .nm-kontakt-panel__firma p { font-size: var(--wp--preset--font-size--small); line-height: 1.6; color: #c3cdd4; } .nm-kontakt-panel__firma strong { font-weight: 600; color: #fff; } .nm-kontakt-panel .nm-social { gap: 0.5rem; } .nm-kontakt-panel .nm-social a, .nm-kontakt-panel .nm-social .is-wkrotce { width: 2.75rem; height: 2.75rem; background: rgb(255 255 255 / 0.1); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); color: #fff; } .nm-kontakt-panel .nm-social .nm-i { width: 1.25rem; height: 1.25rem; } .nm-kontakt-panel .nm-social a:hover, .nm-kontakt-panel .nm-social a:focus-visible { background: #f0cf72; color: var(--wp--preset--color--heading); } .nm-kontakt-panel .nm-social .is-wkrotce { opacity: 0.75; } .nm-kontakt-formularz { padding: clamp(1.5rem, 3vw, 2.75rem); border-radius: 18px; background: var(--wp--preset--color--base); box-shadow: 0 30px 60px -36px rgb(11 34 48 / 0.45); } .nm-kontakt-formularz > * { margin: 0 !important; } .nm-kontakt-formularz h2 { font-size: var(--wp--preset--font-size--xx-large); } .nm-kontakt-formularz__opis { margin-top: 0.5rem !important; color: var(--wp--preset--color--contrast); } .nm-kontakt-formularz .wp-block-pixelmaker-contact-form { margin-top: 1.5rem !important; padding: 0; background: none; } /* „W czym możemy pomóc”: białe karty z ikoną w złotym kółku, linki jako wiersze ze strzałką. */ .nm-sprawy-sekcja h2 { margin-top: 0; } .nm-sprawy__glowa { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0.5rem clamp(2rem, 5vw, 5rem); align-items: end; } .nm-sprawy__glowa > * { margin: 0 !important; } .nm-sprawy__opis { font-size: var(--wp--preset--font-size--large); line-height: 1.45; color: var(--wp--preset--color--contrast); } @media (max-width: 860px) { .nm-sprawy__glowa { grid-template-columns: minmax(0, 1fr); } } .nm-sprawy { margin-top: var(--wp--preset--spacing--40) !important; gap: clamp(1rem, 2vw, 1.5rem); } .nm-sprawa { position: relative; grid-template-rows: auto auto auto 1fr; gap: 0.75rem; padding: 1.75rem 1.5rem 1rem; border-radius: 18px; background: var(--wp--preset--color--base); box-shadow: 0 0 0 1px var(--wp--preset--color--line), 0 18px 40px -32px rgb(11 34 48 / 0.35); transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 300ms ease; } .nm-sprawa::before { content: ""; width: 3.25rem; height: 3.25rem; border-radius: 50%; background: var(--wp--preset--color--accent-soft, #f7edd4); } .nm-sprawa::after { content: ""; position: absolute; left: 1.5rem; top: 1.75rem; width: 3.25rem; height: 3.25rem; background: var(--wp--preset--color--accent-dark, #8a5a0e); -webkit-mask: var(--ik) center / 1.5rem no-repeat; mask: var(--ik) center / 1.5rem no-repeat; } .nm-sprawa--szukaj { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2711%27%20cy%3D%2711%27%20r%3D%277%27%2F%3E%3Cpath%20d%3D%27m20%2020-3.6-3.6%27%2F%3E%3C%2Fsvg%3E"); } .nm-sprawa--budynek { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2021V8l8-5%208%205v13%27%2F%3E%3Cpath%20d%3D%27M9%2021v-6h6v6M8%2011h.01M12%2011h.01M16%2011h.01%27%2F%3E%3C%2Fsvg%3E"); } .nm-sprawa--edytuj { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2020h4L19%209l-4-4L4%2016z%27%2F%3E%3Cpath%20d%3D%27m13%207%204%204%27%2F%3E%3C%2Fsvg%3E"); } .nm-sprawa__tytul { font-size: var(--wp--preset--font-size--x-large); line-height: 1.15; } .nm-sprawa__linki { align-self: end; gap: 0; margin-top: 0.5rem !important; } .nm-sprawa__linki li { border-top: 1px solid var(--wp--preset--color--line); } .nm-sprawa__linki a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; padding: 0.5rem 0.25rem; text-decoration: none; } .nm-sprawa__linki a::after { content: "→"; color: var(--wp--preset--color--accent-dark, #8a5a0e); transition: transform 200ms ease; } .nm-sprawa__linki a:hover, .nm-sprawa__linki a:focus-visible { text-decoration: underline; text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; } .nm-sprawa__linki a:hover::after { transform: translateX(4px); } .nm-sprawa:hover, .nm-sprawa:focus-within { transform: translateY(-4px); box-shadow: 0 0 0 1px var(--wp--preset--color--accent), 0 26px 50px -30px rgb(11 34 48 / 0.45); } @media (prefers-reduced-motion: reduce) { .nm-sprawa, .nm-sprawa__linki a::after { transition: none; } .nm-sprawa:hover, .nm-sprawa:focus-within { transform: none; } } @media (max-width: 960px) { .nm-kontakt-uklad { grid-template-columns: minmax(0, 1fr); margin-top: 0 !important; } .nm-kontakt-nowy { padding-top: var(--wp--preset--spacing--50) !important; } } /* ——— Dla placówek #film (E30): usługi jako białe karty na granacie; na komputerze nasuwają się w stos ——— */ .nm-uslugi-sekcja h2 { margin-top: 0; } .nm-uslugi__glowa > * { margin: 0; } .nm-uslugi__lead { max-width: 60ch; margin-top: 1rem !important; font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: #dfe5e9; } .nm-uslugi { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); margin-top: var(--wp--preset--spacing--50) !important; } .nm-uslugi > * { margin: 0 !important; } .nm-usluga { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 3rem); align-items: center; padding: clamp(1rem, 1.6vw, 1.5rem); border-radius: 20px; background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); box-shadow: 0 -10px 40px -20px rgb(0 0 0 / 0.45); } .nm-usluga > * { margin: 0 !important; } .nm-usluga__zdjecie img { width: 100%; border-radius: 14px; } .nm-usluga__tresc > * { margin: 0 !important; } .nm-usluga__tresc > * + * { margin-top: 1rem !important; } .nm-usluga__tytul { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.08; color: var(--wp--preset--color--heading); } .nm-usluga__tekst { max-width: 46ch; font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-usluga__lista { display: grid; gap: 0.5rem; padding: 0; list-style: none; } .nm-usluga__lista li { position: relative; padding-left: 1.75rem; } .nm-usluga__lista li::before { content: ""; position: absolute; left: 0.125rem; top: 0.42em; width: 0.875rem; height: 0.45rem; border-left: 2px solid var(--wp--preset--color--accent-dark); border-bottom: 2px solid var(--wp--preset--color--accent-dark); transform: rotate(-45deg); } @media (max-width: 781px) { .nm-usluga { grid-template-columns: minmax(0, 1fr); } } /* Strona 404 (rysunek z paczki grafik) */ .nm-blad-404 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); gap: var(--wp--preset--spacing--60); align-items: center; } .nm-blad-404__tekst > * { margin-block: 0; } .nm-blad-404__tekst > * + * { margin-top: 1.25rem; } .nm-blad-404__rysunek { margin: 0; } .nm-blad-404__rysunek img { display: block; width: 100%; height: auto; } @media (max-width: 781px) { .nm-blad-404 { grid-template-columns: minmax(0, 1fr); } .nm-blad-404__rysunek { max-width: 20rem; } } /* Kafle „Od czego zacząć?”: zdjęcie w tle mocno przyciemnione granatowym gradientem, po najechaniu jeszcze ciemniejsze (zamiast płaskiego granatu); tekst jasny w każdym stanie. Na telefonie kroki są widoczne od razu. */ .nm-kurtyna > .nm-sytuacja { background: var(--wp--preset--color--overlay, #0b2230); color: #fff; box-shadow: none; } .nm-sytuacja__foto { position: absolute; inset: 0; z-index: -3; margin: 0 !important; overflow: hidden; } .nm-sytuacja__foto img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.85) brightness(0.9); transform: scale(1.01); transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s ease; } .nm-sytuacja::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgb(11 34 48 / 0.5) 0%, rgb(11 34 48 / 0.78) 45%, rgb(11 34 48 / 0.94) 100%); } .nm-sytuacja__nr { -webkit-text-stroke-color: rgb(240 207 114 / 0.9); } .nm-sytuacja__tytul { color: #fff; } .nm-sytuacja__odp { color: #e8edf0; } .nm-sytuacja__odp strong { color: #f0cf72; } .nm-sytuacja__zacheta { color: #f0cf72 !important; } .nm-sytuacja__kroki li { color: #f2f5f7; } .nm-sytuacja__linki a { color: #fff; } .nm-sytuacja:focus-within { outline-color: #f0cf72; } .nm-kurtyna > .nm-sytuacja:is(:hover, :focus-within) { box-shadow: 0 26px 50px -30px rgb(11 34 48 / 0.7); } .nm-sytuacja:is(:hover, :focus-within) .nm-sytuacja__foto img { filter: saturate(0.7) brightness(0.5); transform: scale(1.06); } @media (prefers-reduced-motion: reduce) { .nm-sytuacja__foto img { transition: none; transform: none !important; } } @media (max-width: 960px) { /* Telefon i tablet: numer nie nachodzi na tytuł. */ .nm-sytuacja__tytul { padding-right: clamp(4.5rem, 22vw, 7rem); } } /* ——— O portalu i Jak ustalamy kolejność (1.11.2026): sekcje na całą szerokość pod zdjęciem nagłówka ——— Treść: narzedzia/tresci.mjs (oPortalu, kolejnosc). Karty jak „W czym możemy pomóc” na Kontakcie. */ .wp-block-post-content:has(> .nm-info:first-child) { padding-top: 0 !important; padding-bottom: 0 !important; } .nm-info :is(h2, h3, p, ul, ol, figure) { margin: 0; } .nm-info h2 { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.08; text-wrap: balance; } .nm-info h3 { font-size: var(--wp--preset--font-size--x-large); line-height: 1.15; } .nm-info .nm-lead { max-width: 52ch; color: var(--wp--preset--color--heading); } .nm-info p { text-wrap: pretty; } .nm-info .alignwide > *, .nm-info .alignwide > * > * { margin-block: 0 !important; } .nm-info { --ik-tarcza: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203%204.5%206v5.5c0%204.6%203.2%208.2%207.5%209.5%204.3-1.3%207.5-4.9%207.5-9.5V6z%27%2F%3E%3Cpath%20d%3D%27m8.8%2012%202.3%202.3%204.4-4.6%27%2F%3E%3C%2Fsvg%3E"); } /* Odznaki jak na kartach placówek (zwykły akapit z ikoną w CSS). */ .nm-odznaka-wzor { display: inline-flex; align-items: center; gap: 0.4rem; width: fit-content; min-height: 2.25rem; padding: 0.35rem 0.85rem; border-radius: var(--wp--custom--radius--m); font: 650 1rem/1.2 var(--wp--preset--font-family--body); white-space: nowrap; } .nm-odznaka-wzor--wyrozniona { background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent); } .nm-odznaka-wzor--zweryfikowana { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--accent-2); box-shadow: 0 0 0 1px rgb(45 106 79 / 0.28); } .nm-odznaka-wzor--zweryfikowana::before { content: ""; width: 1.15rem; height: 1.15rem; flex: none; background: currentColor; -webkit-mask: var(--ik-tarcza) center / contain no-repeat; mask: var(--ik-tarcza) center / contain no-repeat; } /* Listy: „tak” – złoty znak, „nie” – krzyżyk. */ .nm-op-lista-tak, .nm-op-platne ul, .nm-op-nieplatne ul, .nm-kol-nie ul { display: grid; gap: 0.75rem; padding: 0; list-style: none; } .nm-op-lista-tak li, .nm-op-platne li, .nm-op-nieplatne li, .nm-kol-nie li { position: relative; padding-left: 1.875rem; line-height: 1.5; } .nm-op-lista-tak li::before, .nm-op-platne li::before { content: ""; position: absolute; left: 0.2rem; top: 0.42em; width: 0.875rem; height: 0.45rem; border-left: 2px solid var(--wp--preset--color--accent-dark); border-bottom: 2px solid var(--wp--preset--color--accent-dark); transform: rotate(-45deg); } .nm-op-platne li::before { border-color: #f0cf72; } .nm-op-nieplatne li::before, .nm-kol-nie li::before, .nm-op-nieplatne li::after, .nm-kol-nie li::after { content: ""; position: absolute; left: 0.25rem; top: 0.72em; width: 0.95rem; height: 2px; border-radius: 1px; background: #f0a99f; transform: rotate(45deg); } .nm-op-nieplatne li::after, .nm-kol-nie li::after { transform: rotate(-45deg); } .nm-op-lista-tak strong { color: var(--wp--preset--color--heading); } /* O portalu – wstęp: tekst i kamienny panel „Dla rodzin – bezpłatnie”. */ .nm-op-wstep { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; } .nm-op-wstep__tekst { display: grid; gap: 1.25rem; } .nm-op-wstep__tekst > p:last-child { max-width: 60ch; } .nm-op-rodziny { display: grid; gap: 1.25rem; padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: 18px; background: var(--wp--preset--color--base-2); box-shadow: inset 4px 0 0 var(--wp--preset--color--accent); } .nm-op-rodziny .wp-block-buttons { margin-top: 0.25rem !important; } /* O portalu – źródła: tekst obok wykresu, pod spodem trzy rejestry z liczbą na żywo. */ .nm-op-zrodla__glowa { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; } .nm-op-zrodla__tekst { display: grid; gap: 1.25rem; } .nm-op-wykres img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: var(--wp--preset--shadow--subtle); } .nm-op-wykres figcaption { margin: 0.75rem 0 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); text-align: left; } .nm-op-zrodla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.5fr); gap: clamp(1rem, 2vw, 1.5rem); margin-top: var(--wp--preset--spacing--60) !important; } .nm-op-zrodlo__liczby { display: flex; flex-wrap: wrap; gap: 1rem 1.75rem; } .nm-op-zrodlo--nfz .nm-op-zrodlo__liczba { flex: 1 1 7.5rem; } .nm-op-zrodlo--nfz .nm-op-zrodlo__liczba .nm-liczba { font-size: clamp(2rem, 1.6rem + 1.2vw, 2.75rem); } .nm-op-zrodlo--nfz .nm-op-zrodlo__liczba:nth-child(1) { --nm-kolor-typu: #6e4a6b; } .nm-op-zrodlo--nfz .nm-op-zrodlo__liczba:nth-child(2) { --nm-kolor-typu: #8e3b4e; } .nm-op-zrodlo--nfz .nm-op-zrodlo__liczba:nth-child(3) { --nm-kolor-typu: #5a4a9c; } .nm-op-zrodlo { display: flex; flex-direction: column; gap: 0.75rem; padding: clamp(1.5rem, 2.5vw, 2rem); border-radius: 18px; background: var(--wp--preset--color--base); box-shadow: 0 0 0 1px var(--wp--preset--color--line), 0 18px 40px -32px rgb(11 34 48 / 0.35); } .nm-op-zrodlo__liczba { font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--wp--preset--color--muted); } .nm-op-zrodlo__liczba .nm-liczba { display: block; margin-bottom: 0.25rem; font: 600 clamp(2.5rem, 2rem + 2vw, 3.5rem)/1 var(--wp--preset--font-family--heading); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--nm-kolor-typu, var(--wp--preset--color--primary)); } .nm-op-zrodlo:nth-child(2) { --nm-kolor-typu: #1f6f78; } .nm-op-zrodlo__tytul { margin-top: 0.25rem !important; } .nm-op-zrodlo__tekst { line-height: 1.55; } .nm-op-zrodlo__rytm { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: auto !important; padding-top: 0.5rem; font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--wp--preset--color--accent-2); } .nm-op-zrodlo__rytm::before { content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: currentColor; } /* O portalu – kto odpowiada za dane: rejestr, placówka i odznaka. */ .nm-op-dane { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; } .nm-op-dane__glowa { grid-column: 1 / -1; display: grid; gap: 1rem; max-width: 46rem; } .nm-op-dane__opis { font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-op-strona { display: grid; gap: 1rem; padding-top: 1.5rem; box-shadow: inset 0 4px 0 var(--wp--preset--color--primary); } .nm-op-strona--placowka { box-shadow: inset 0 4px 0 var(--wp--preset--color--accent); } .nm-op-strona ul { display: grid; gap: 0.5rem; padding: 0; list-style: none; } .nm-op-strona li { position: relative; padding-left: 1.25rem; } .nm-op-strona li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 0.5rem; height: 0.5rem; border-radius: 2px; background: var(--wp--preset--color--primary); } .nm-op-strona--placowka li::before { background: var(--wp--preset--color--accent); } .nm-op-strona__nota { font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--wp--preset--color--muted); } .nm-op-strona__nota a, .nm-kol-etykieta a { font-weight: 600; color: var(--wp--preset--color--primary); text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-op-odznaka { display: grid; gap: 0.875rem; padding: clamp(1.5rem, 2.5vw, 2rem); border-radius: 18px; background: #e7f0eb; } .nm-op-odznaka p { line-height: 1.55; } .nm-op-odznaka strong { color: var(--wp--preset--color--heading); } /* O portalu – jak zarabiamy (granatowy pas). */ .nm-op-zarabiamy { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.5rem); align-items: stretch; } .nm-op-zarabiamy__glowa { display: grid; align-content: start; gap: 1.25rem; padding-right: clamp(0rem, 2vw, 1.5rem); } .nm-op-zarabiamy__lead { max-width: 36ch; font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: #dfe5e9; } .nm-op-zarabiamy__link a { font-weight: 600; color: #fff; text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-op-platne, .nm-op-nieplatne { display: grid; gap: 1.25rem; align-content: start; padding: clamp(1.5rem, 2.5vw, 2rem); border-radius: 18px; background: rgb(255 255 255 / 0.07); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); color: #e8edf0; } .nm-op-platne strong { color: #fff; } /* O portalu – firma i kontakt; jasne kafle kontaktu (te same co na Kontakcie, na jasnym tle). */ .nm-op-firma { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; } .nm-op-firma__tekst { display: grid; gap: 1.25rem; } .nm-op-firma__dane { padding-left: 1.125rem; box-shadow: inset 4px 0 0 var(--wp--preset--color--accent); line-height: 1.7; } .nm-op-firma__dane strong { color: var(--wp--preset--color--heading); } .nm-op-firma__kontakt { display: grid; gap: 1.25rem; } .nm-kontakt-kafle--jasne .nm-kontakt-k a { background: var(--wp--preset--color--base-2); box-shadow: inset 0 0 0 1px var(--wp--preset--color--line); color: var(--wp--preset--color--heading); } .nm-kontakt-kafle--jasne .nm-kontakt-k__etykieta { color: var(--wp--preset--color--accent-dark); } .nm-kontakt-kafle--jasne .nm-kontakt-k a:hover, .nm-kontakt-kafle--jasne .nm-kontakt-k a:focus-visible { background: var(--wp--preset--color--accent-soft); box-shadow: inset 0 0 0 1px var(--wp--preset--color--accent); } /* Jak ustalamy kolejność – zasada obok przykładowej listy wyników. */ .nm-kol-zasada { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; } .nm-kol-zasada__tekst { display: grid; gap: 1.25rem; } .nm-kol-wzor { display: grid; gap: 0.75rem; padding: clamp(1.25rem, 2.5vw, 2rem); border-radius: 18px; background: var(--wp--preset--color--base-2); } .nm-kol-wzor__tytul { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); } .nm-kol-wzor__grupa { margin-top: 0.5rem !important; font: 600 var(--wp--preset--font-size--large)/1.2 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--heading); } .nm-kol-wzor__lista { display: grid; gap: 0.5rem; padding: 0; list-style: none; counter-reset: nm-wzor; } .nm-kol-wzor__lista:not(.nm-kol-wzor__lista--wyr) { counter-reset: nm-wzor 2; } .nm-kol-wzor__lista li { display: flex; align-items: center; gap: 0.75rem; min-height: 3.25rem; padding: 0.625rem 1rem 0.625rem 0.75rem; border-radius: 12px; background: var(--wp--preset--color--base); box-shadow: var(--wp--preset--shadow--subtle); counter-increment: nm-wzor; } .nm-kol-wzor__lista li::before { content: counter(nm-wzor); display: grid; place-items: center; width: 1.875rem; height: 1.875rem; flex: none; border-radius: 50%; background: var(--wp--preset--color--base-2); font: 600 0.9375rem/1 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; color: var(--wp--preset--color--heading); } .nm-kol-wzor__lista--wyr li { background: #fffaf0; box-shadow: 0 0 0 2px var(--wp--preset--color--accent), var(--wp--preset--shadow--subtle); } .nm-kol-wzor__lista--wyr li::before { background: var(--wp--preset--color--accent-soft); } .nm-kol-wzor__opis { display: flex; flex: 1; flex-wrap: wrap; align-items: center; gap: 0.375rem 0.75rem; min-width: 0; } .nm-kol-wzor__etykieta { padding: 0.15rem 0.5rem; border-radius: var(--wp--custom--radius--s); background: var(--nm-zloto, var(--wp--preset--color--accent)); font-size: 0.875rem; font-weight: 650; color: var(--wp--preset--color--on-accent); } .nm-kol-wzor__typ { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; color: var(--wp--preset--color--heading); } .nm-kol-wzor__typ::before { content: ""; width: 0.625rem; height: 0.625rem; flex: none; border-radius: 50%; background: var(--nm-typ, #12394f); } .nm-kol-wzor__typ--dps { --nm-typ: #1f6f78; } .nm-kol-wzor__typ--zol { --nm-typ: #6e4a6b; } .nm-kol-wzor__km { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; color: var(--wp--preset--color--contrast); white-space: nowrap; } /* Jak ustalamy kolejność – cztery miejsca z wyróżnieniem (karty z ikoną w złotym kółku). */ .nm-kol-miejsca__glowa { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1rem clamp(2rem, 5vw, 4.5rem); align-items: end; } .nm-kol-miejsca__opis { max-width: 54ch; font-size: var(--wp--preset--font-size--large); line-height: 1.5; } .nm-kol-miejsca { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin-top: var(--wp--preset--spacing--50) !important; } .nm-kol-miejsce { position: relative; display: grid; align-content: start; gap: 0.625rem; padding: clamp(1.5rem, 2.5vw, 2rem) clamp(1.5rem, 2.5vw, 2rem) clamp(1.5rem, 2.5vw, 2rem) calc(clamp(1.5rem, 2.5vw, 2rem) + 4.25rem); border-radius: 18px; background: var(--wp--preset--color--base); box-shadow: 0 0 0 1px var(--wp--preset--color--line), 0 18px 40px -32px rgb(11 34 48 / 0.35); } .nm-kol-miejsce::before, .nm-kol-miejsce::after { content: ""; position: absolute; left: clamp(1.5rem, 2.5vw, 2rem); top: clamp(1.5rem, 2.5vw, 2rem); width: 3.25rem; height: 3.25rem; } .nm-kol-miejsce::before { border-radius: 50%; background: var(--wp--preset--color--accent-soft, #f7edd4); } .nm-kol-miejsce::after { background: var(--wp--preset--color--accent-dark, #8a5a0e); -webkit-mask: var(--ik) center / 1.5rem no-repeat; mask: var(--ik) center / 1.5rem no-repeat; } .nm-kol-miejsce p { line-height: 1.55; } .nm-kol-miejsce--szukaj { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2711%27%20cy%3D%2711%27%20r%3D%277%27%2F%3E%3Cpath%20d%3D%27m20%2020-3.6-3.6%27%2F%3E%3C%2Fsvg%3E"); } .nm-kol-miejsce--dom { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2011%2012%204l9%207%27%2F%3E%3Cpath%20d%3D%27M5%209.5V20h14V9.5%27%2F%3E%3Cpath%20d%3D%27M10%2020v-5h4v5%27%2F%3E%3C%2Fsvg%3E"); } .nm-kol-miejsce--mapa { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%204%203%206.5v13.5l6-2.5%206%202.5%206-2.5V4l-6%202.5z%27%2F%3E%3Cpath%20d%3D%27M9%204v13.5M15%206.5V20%27%2F%3E%3C%2Fsvg%3E"); } .nm-kol-miejsce--karta { --ik: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M7%209h6M7%2013h10M7%2016.5h4%27%2F%3E%3C%2Fsvg%3E"); } /* Jak ustalamy kolejność – oznaczenia i „czego nie da się kupić” (granatowa karta). */ .nm-kol-etykiety { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; } .nm-kol-etykiety__wzory { display: grid; gap: 1.25rem; } .nm-kol-etykieta { display: grid; gap: 0.75rem; padding: 1.25rem 1.5rem; border-radius: 14px; background: var(--wp--preset--color--accent-soft); } .nm-kol-etykieta + .nm-kol-etykieta { background: #e7f0eb; } .nm-kol-etykieta p:not(.nm-odznaka-wzor) { line-height: 1.55; } .nm-kol-nie { display: grid; gap: 1.25rem; padding: clamp(1.5rem, 3vw, 2.5rem); border-radius: 18px; background: var(--wp--preset--color--overlay, #0b2230); color: #e8edf0; } .nm-kol-nie h3 { color: #fff; } .nm-kol-nie__nota { padding-top: 1rem; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.14); font-size: var(--wp--preset--font-size--small); color: #c3cdd4; } .nm-kol-nie__nota a { font-weight: 600; color: #fff; text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; overflow-wrap: anywhere; } .nm-kol-nie :focus-visible { outline-color: var(--wp--custom--focus--on-dark); } @media (max-width: 960px) { .nm-op-wstep, .nm-op-zrodla__glowa, .nm-op-firma, .nm-kol-zasada, .nm-kol-etykiety, .nm-kol-miejsca__glowa { grid-template-columns: minmax(0, 1fr); } .nm-op-zarabiamy { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-op-zarabiamy__glowa { grid-column: 1 / -1; padding-right: 0; } .nm-op-dane { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-op-odznaka { grid-column: 1 / -1; } .nm-op-zrodla { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-op-zrodlo--nfz { grid-column: 1 / -1; } } @media (max-width: 781px) { .nm-op-zrodla, .nm-op-zarabiamy, .nm-op-dane, .nm-kol-miejsca { grid-template-columns: minmax(0, 1fr); } .nm-kol-miejsce { padding-left: clamp(1.5rem, 2.5vw, 2rem); padding-top: calc(clamp(1.5rem, 2.5vw, 2rem) + 4rem); } } /* Formularz kontaktowy (Kontakt, Dla placówek): imię i nazwisko, e-mail i telefon w jednym rzędzie, gdy formularz ma na to miejsce (zapytanie o kontener – działa w każdej kolumnie), węziej i na telefonie pod sobą. Wiadomość pod nimi, informacja o danych nad polem wyboru, link do polityki w osobnej linii (functions.php). */ .wp-block-pixelmaker-contact-form { container-type: inline-size; } .pm-form .pm-form__grid { grid-template-columns: minmax(0, 1fr); } .pm-form .pm-form__field.is-full { grid-column: 1 / -1; } @container (min-width: 33rem) { .pm-form .pm-form__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 0.8fr); } } .pm-form .pm-form__privacy { font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--wp--preset--color--muted); } .pm-form__consent > label { line-height: 1.5; color: var(--wp--preset--color--contrast); } .pm-form__consent .nm-zgoda-link { grid-column: 2; margin: 0; font-size: var(--wp--preset--font-size--small); line-height: 1.4; } .nm-zgoda-link a { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 2.75rem; font-weight: 600; color: var(--wp--preset--color--primary); text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 0.2em; } .nm-zgoda-link a::after { content: "↗"; color: var(--wp--preset--color--accent-dark); transition: transform 200ms ease; } .nm-zgoda-link a:hover::after { transform: translate(2px, -2px); } @media (prefers-reduced-motion: reduce) { .nm-zgoda-link a::after { transition: none; } } /* ——— Dla placówek (1.11.2026, wersja 2): pierwszy ekran na zdjęciu z drona, kafle rodzajów, pokazy korzyści ——— */ /* Pierwszy ekran: z lewej tytuł, sprawdzenie placówki i przyciski, z prawej wzór wizytówki; na dole pas liczb */ .nm-dla-start .wp-block-cover__inner-container > * + * { margin-top: clamp(2.5rem, 5vw, 4rem); } .nm-dla-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; } .nm-dla-hero > * { margin: 0 !important; } .nm-dla-hero__tekst { display: grid; gap: 1.25rem; } .nm-dla-hero__tekst > * { margin: 0 !important; } .nm-dla-hero__tekst h1 { font-size: var(--wp--preset--font-size--huge); line-height: 1.04; text-wrap: balance; } .nm-dla-hero__tekst .nm-lead { max-width: 50ch; color: #d6dee3; } .nm-dla-hero__zrzut img { border-radius: var(--wp--custom--radius--l); box-shadow: 0 0 0 1px rgb(255 255 255 / 0.14), 0 40px 80px -40px rgb(0 0 0 / 0.7); } .nm-dla-hero__zrzut figcaption { color: #b9c4cc; } @media (min-width: 961px) { .nm-dla-hero__zrzut { transform: perspective(1800px) rotateY(-7deg) rotateX(2deg); transform-origin: 0 50%; } } /* Sprawdzenie placówki: jasne pole na ciemnym tle */ .nm-dla-szukaj { display: grid; gap: 0.625rem; max-width: 34rem; padding: 1rem 1.125rem 1.125rem; border-radius: 16px; background: rgb(255 255 255 / 0.07); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); } .nm-dla-szukaj label { font-weight: 650; color: #fff; } .nm-dla-szukaj__pole { display: flex; gap: 0.5rem; } .nm-dla-szukaj input { flex: 1; min-width: 0; min-height: 3.25rem; padding: 0 1rem; border: 1.5px solid #fff; border-radius: var(--wp--custom--radius--button, 8px); background: #fff; font: inherit; color: var(--wp--preset--color--heading); } .nm-dla-szukaj input::placeholder { color: #5c6670; } .nm-dla-szukaj input:focus-visible { outline: 3px solid var(--wp--custom--focus--on-dark, #f0cf72); outline-offset: 2px; } .nm-dla-szukaj button { min-height: 3.25rem; padding: 0 1.5rem; border: 0; border-radius: var(--wp--custom--radius--button, 8px); background: var(--nm-zloto, var(--wp--preset--color--accent)); color: var(--wp--preset--color--on-accent, #0b2230); font: 700 1rem/1 var(--wp--preset--font-family--heading); cursor: pointer; transition: filter 160ms ease, transform 160ms ease; } .nm-dla-szukaj button:hover { filter: brightness(1.06); } .nm-dla-szukaj button:active { transform: translateY(1px); } /* Pas liczb katalogu na żywo */ .nm-dla-liczby { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem clamp(1rem, 3vw, 2.5rem); padding-top: clamp(1.25rem, 2.5vw, 1.75rem); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.16); } .nm-dla-liczby > * { margin: 0 !important; } .nm-dla-liczba { font-size: var(--wp--preset--font-size--small); line-height: 1.4; color: #c9d3da; } .nm-dla-liczba .nm-liczba { display: block; margin-bottom: 0.25rem; font: 600 clamp(1.75rem, 3vw, 2.625rem)/1.05 var(--wp--preset--font-family--display); letter-spacing: -0.03em; background: var(--nm-zloto, var(--wp--preset--color--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; } /* Kafle rodzajów: kolor rodzaju jak na mapie, liczba wpisów na żywo, cały kafel jest linkiem */ .nm-dla-rodzaje-siatka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(0.75rem, 1.6vw, 1.25rem); } .nm-dla-rodzaje-siatka > * { margin: 0 !important; } .nm-dla-rodzaj { --nm-rodzaj: var(--wp--preset--color--primary); position: relative; display: grid; gap: 0.375rem; padding: 1.25rem 3rem 1.25rem 1.375rem; border-radius: 16px; background: var(--wp--preset--color--base); box-shadow: inset 4px 0 0 var(--nm-rodzaj), 0 0 0 1px var(--wp--preset--color--line), 0 16px 36px -30px rgb(11 34 48 / 0.4); transition: transform 200ms ease, box-shadow 200ms ease; } .nm-dla-rodzaj > * { margin: 0 !important; } .nm-dla-rodzaj::after { content: "→"; position: absolute; right: 1.25rem; top: 50%; translate: 0 -50%; font-weight: 700; color: var(--nm-rodzaj); transition: translate 200ms ease; } .nm-dla-rodzaj:hover, .nm-dla-rodzaj:focus-within { transform: translateY(-2px); box-shadow: inset 4px 0 0 var(--nm-rodzaj), 0 0 0 1px var(--nm-rodzaj), 0 22px 40px -28px rgb(11 34 48 / 0.45); } .nm-dla-rodzaj:hover::after { translate: 3px -50%; } .nm-dla-rodzaj__nazwa { font: 600 var(--wp--preset--font-size--large)/1.2 var(--wp--preset--font-family--heading); } .nm-dla-rodzaj__nazwa a { color: var(--wp--preset--color--heading); text-decoration: none; } .nm-dla-rodzaj__nazwa a::before { content: ""; position: absolute; inset: 0; border-radius: inherit; } .nm-dla-rodzaj__nazwa a:focus-visible { outline: none; } .nm-dla-rodzaj:has(a:focus-visible) { outline: 3px solid var(--wp--custom--focus--color, #12394f); outline-offset: 3px; } .nm-dla-rodzaj__liczba { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); } .nm-dla-rodzaj__liczba .nm-liczba { font-weight: 700; color: var(--nm-rodzaj); } .nm-dla-rodzaj--prywatny { --nm-rodzaj: #12394f; } .nm-dla-rodzaj--dps { --nm-rodzaj: #1f6f78; } .nm-dla-rodzaj--zol { --nm-rodzaj: #6e4a6b; } .nm-dla-rodzaj--hospicjum { --nm-rodzaj: #8e3b4e; } .nm-dla-rodzaj--mieszkania { --nm-rodzaj: #2d6a4f; } .nm-dla-rodzaj--dzienny { --nm-rodzaj: #4a4e54; } .nm-dla-rodzaj--sanatorium { --nm-rodzaj: #2c6493; } .nm-dla-rodzaj--turnus { --nm-rodzaj: #8a5524; } .nm-dla-rodzaj--opieka { --nm-rodzaj: #5a4a9c; } @media (prefers-reduced-motion: reduce) { .nm-dla-rodzaj, .nm-dla-rodzaj::after { transition: none; } .nm-dla-rodzaj:hover, .nm-dla-rodzaj:focus-within { transform: none; } } /* Kroki przejęcia: trzy karty z numerem w złotym kółku */ .nm-kroki-karty { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin-top: var(--wp--preset--spacing--50) !important; padding: 0; list-style: none; counter-reset: nm-krok; font-size: var(--wp--preset--font-size--medium); } .nm-kroki-karty li { position: relative; display: grid; align-content: start; gap: 0.5rem; padding: clamp(1.5rem, 2.5vw, 2rem); padding-top: calc(clamp(1.5rem, 2.5vw, 2rem) + 3.75rem); border-radius: 18px; background: var(--wp--preset--color--base); box-shadow: 0 0 0 1px var(--wp--preset--color--line), 0 18px 40px -32px rgb(11 34 48 / 0.35); counter-increment: nm-krok; line-height: 1.55; } .nm-kroki-karty li::before { content: counter(nm-krok); position: absolute; left: clamp(1.5rem, 2.5vw, 2rem); top: clamp(1.5rem, 2.5vw, 2rem); display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--nm-zloto, var(--wp--preset--color--accent)); font: 700 1.25rem/1 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--on-accent); } .nm-kroki-karty li::marker { content: none; } .nm-kroki-karty strong { display: block; font: 600 var(--wp--preset--font-size--x-large)/1.15 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--heading); } .nm-kroki__przyciski { margin-top: var(--wp--preset--spacing--40) !important; } /* Co daje wyróżnienie: kadr portalu obok opisu, co drugi z prawej */ .nm-dla-korzysci { display: grid; gap: clamp(3rem, 7vw, 6rem); margin-top: var(--wp--preset--spacing--50) !important; } .nm-dla-korzysci > * { margin: 0 !important; } .nm-dla-korzysc { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1.75rem, 5vw, 4.5rem); align-items: center; } .nm-dla-korzysc > * { margin: 0 !important; } .nm-dla-korzysc--odwrotnie .nm-dla-korzysc__kadr { order: 2; } .nm-dla-korzysc__tekst { display: grid; gap: 1rem; max-width: 34rem; } .nm-dla-korzysc__tekst > * { margin: 0 !important; } .nm-dla-korzysc__tekst h3 { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.08; text-wrap: balance; } .nm-dla-korzysc__tekst p { font-size: var(--wp--preset--font-size--medium); line-height: 1.6; color: var(--wp--preset--color--contrast); } .nm-dla-korzysc__kadr img { width: 100%; height: auto; } /* Dwa plany obok siebie: bezpłatny (biały) i wyróżniony (złoty akcent) */ .nm-plany { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); margin-top: var(--wp--preset--spacing--50) !important; align-items: stretch; } .nm-plany > * { margin: 0 !important; } .nm-plan { display: flex; flex-direction: column; gap: 0.875rem; padding: clamp(1.5rem, 3vw, 2.5rem); border-radius: 20px; background: var(--wp--preset--color--base); box-shadow: 0 0 0 1px var(--wp--preset--color--line), 0 18px 40px -32px rgb(11 34 48 / 0.35); } .nm-plan > * { margin: 0 !important; } .nm-plan--wyrozniony { background: #fffaf0; box-shadow: 0 0 0 2px var(--wp--preset--color--accent), 0 26px 50px -32px rgb(138 90 14 / 0.45); } .nm-plan__tytul { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.05; } .nm-plan__cena { font: 600 var(--wp--preset--font-size--x-large)/1.2 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--primary); } .nm-plan--wyrozniony .nm-plan__cena { color: var(--wp--preset--color--accent-dark); } .nm-plan__opis { line-height: 1.5; color: var(--wp--preset--color--contrast); } .nm-plan__lista { display: grid; gap: 0.625rem; padding: 0.75rem 0 0; list-style: none; box-shadow: inset 0 1px 0 var(--wp--preset--color--line); } .nm-plan__lista li { position: relative; padding-left: 1.875rem; line-height: 1.45; } .nm-plan__lista li::before { content: ""; position: absolute; left: 0.2rem; top: 0.42em; width: 0.875rem; height: 0.45rem; border-left: 2px solid var(--wp--preset--color--accent-dark); border-bottom: 2px solid var(--wp--preset--color--accent-dark); transform: rotate(-45deg); } .nm-plan .wp-block-buttons { margin-top: auto !important; padding-top: 0.5rem; } .nm-uslugi__przyciski { margin-top: 1.5rem !important; } @media (max-width: 960px) { .nm-dla-hero, .nm-plany, .nm-dla-korzysc { grid-template-columns: minmax(0, 1fr); } .nm-dla-korzysc--odwrotnie .nm-dla-korzysc__kadr { order: 0; } .nm-dla-liczby, .nm-dla-rodzaje-siatka { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nm-kroki-karty { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 600px) { .nm-dla-szukaj__pole { flex-direction: column; } .nm-dla-rodzaje-siatka { grid-template-columns: minmax(0, 1fr); gap: 0.625rem; } .nm-dla-rodzaj { padding-block: 1rem; } }