/* ============================================================ NIS2 dla zakładów produkcyjnych — landing Template: templates/nis2-produkcja.php Header: header-nis2-produkcja.php Paleta spójna z jednostronicową ofertą PDF: granat #0E0E2C / #14152E + indygo-fiolet #6C5CE7. Odbiega od globalnego --blue: #4426FF celowo — landing ma wyglądać jak PDF, dlatego kolory są scope'owane do .nis2-*. ============================================================ */ :root { --nis2-navy-900: #0E0E2C; --nis2-navy-800: #14152E; --nis2-navy-700: #1B1D3C; --nis2-indigo: #6C5CE7; --nis2-indigo-4: #8A7CF0; --nis2-indigo-3: #A79BF5; --nis2-lav: #CFC7FF; --nis2-text: #CBD5E1; --nis2-muted: #94A3B8; } /* ============================================================ TŁO LANDINGA WAŻNE: nie przemalowujemy . Tło strony ustawia OceanWP (Customizer) i wygrywa z regułami motywu potomnego — próba nadpisania kończy się białym tekstem na kremowym tle. Konwencja repo (patrz css/net.css): ciemny gradient malujemy na własnym kontenerze osadzonym na jasnym tle motywu. Tutaj jeden wspólny blok .nis2-page na całą treść — bliżej jednostronicowego PDF-a niż osobne kafle per sekcja. ============================================================ */ .nis2-page { position: relative; overflow: hidden; padding: 0 44px; border-radius: 30px; background-color: var(--nis2-navy-900); background-image: radial-gradient(1100px 620px at 78% -12%, rgba(108, 92, 231, 0.28), transparent 62%), radial-gradient(900px 560px at 8% 8%, rgba(108, 92, 231, 0.14), transparent 60%), linear-gradient(180deg, #0E0E2C 0%, #14152E 55%, #0E0E2C 100%); color: var(--nis2-text); } /* Na mobile pełna szerokość, bez zaokrągleń — jak .net-hero w net.css. Ujemne marginesy wychodzą poza padding kontenera OceanWP. */ @media (max-width: 911px) { .nis2-page { margin-left: -20px; margin-right: -20px; padding: 0 20px; border-radius: 0; } } /* Kontener OceanWP jest wąski — landing potrzebuje pełnej szerokości. */ .nis2-landing #content-wrap.container { max-width: 1180px; padding-left: 20px; padding-right: 20px; } /* OceanWP potrafi dodać własne tło i cień na #content — zdejmujemy, żeby ciemny blok nie miał jasnej obwódki. */ .nis2-landing #main, .nis2-landing #content-wrap, .nis2-landing #primary, .nis2-landing #content { background: transparent; box-shadow: none; } /* ============================================================ FOCUS STATES — WCAG 2.4.7 Nigdzie nie gasimy outline'u; OceanWP miejscami to robi, więc przywracamy go jawnie w obrębie landinga. ============================================================ */ .nis2-landing a:focus-visible, .nis2-landing button:focus-visible, .nis2-landing summary:focus-visible, .nis2-landing input:focus-visible, .nis2-landing select:focus-visible, .nis2-landing textarea:focus-visible { outline: 3px solid var(--nis2-indigo-3); outline-offset: 3px; border-radius: 4px; } /* ============================================================ ELEMENTY WSPÓLNE ============================================================ */ /* ---------- Badge / pill (jak „GOTOWOŚĆ NIS2 / KSC" w PDF) ---------- */ .nis2-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border: 1px solid rgba(167, 155, 245, 0.3); border-radius: 999px; background: rgba(108, 92, 231, 0.15); color: var(--nis2-lav); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; } .nis2-badge__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--nis2-indigo-3); } /* ---------- Przyciski ---------- */ .nis2-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 28px; border-radius: 12px; font-size: 16px; font-weight: 700; text-decoration: none; transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease; } .nis2-btn--primary { background: var(--nis2-indigo); color: #fff; box-shadow: 0 20px 25px -5px rgba(108, 92, 231, 0.3); } .nis2-btn--primary:hover, .nis2-btn--primary:focus { background: var(--nis2-indigo-4); color: #fff; transform: translateY(-2px); } .nis2-btn--ghost { border: 1px solid rgba(255, 255, 255, 0.2); color: var(--nis2-text); } .nis2-btn--ghost:hover, .nis2-btn--ghost:focus { border-color: rgba(167, 155, 245, 0.6); color: #fff; } /* ---------- Siatka „terminalowa" jako tło ---------- */ .nis2-hero__grid { position: absolute; inset: 0; opacity: 0.6; pointer-events: none; background-image: linear-gradient(rgba(108, 92, 231, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(108, 92, 231, 0.07) 1px, transparent 1px); background-size: 28px 28px; } /* ---------- Karta ---------- */ .nis2-card { height: 100%; padding: 26px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 16px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); transition: border-color 0.3s ease, transform 0.3s ease; } .nis2-card:hover { border-color: rgba(167, 155, 245, 0.38); transform: translateY(-4px); } .nis2-card h3 { margin: 18px 0 10px; color: #fff; font-size: 20px; font-weight: 800; } .nis2-card p { margin: 0; color: var(--nis2-text); font-size: 15px; line-height: 1.65; } .nis2-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 12px; background: rgba(108, 92, 231, 0.2); color: var(--nis2-indigo-3); font-size: 20px; } .nis2-card--pillar ul { margin: 18px 0 0; padding: 0; list-style: none; } .nis2-card--pillar li { position: relative; margin-bottom: 10px; padding-left: 18px; color: var(--nis2-text); font-size: 14px; line-height: 1.6; } .nis2-card--pillar li::before { content: ""; position: absolute; top: 9px; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--nis2-indigo-3); } .nis2-card__desc { margin-bottom: 0; } /* ---------- Nagłówki sekcji ---------- */ .nis2-section { padding: 72px 0; border-top: 1px solid rgba(255, 255, 255, 0.1); } .nis2-section__eyebrow { display: block; color: var(--nis2-indigo-3); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; } .nis2-section__eyebrow--inline { margin-top: 32px; } .nis2-section__title { margin: 16px 0 0; color: #fff; font-size: clamp(28px, 4vw, 40px); font-weight: 900; line-height: 1.15; letter-spacing: -0.02em; } .nis2-section__lead { margin: 20px 0 0; color: var(--nis2-text); font-size: 18px; line-height: 1.7; } .nis2-section__lead--wide { max-width: 680px; } .nis2-section__lead strong, .nis2-quote strong { color: #fff; font-weight: 600; } /* ---------- Cytat / wyróżnienie ---------- */ .nis2-quote { margin: 28px 0 0; padding: 16px 20px; border-left: 2px solid rgba(167, 155, 245, 0.6); border-radius: 12px; background: rgba(255, 255, 255, 0.03); color: var(--nis2-text); font-size: 15px; line-height: 1.7; } /* ---------- Lista z kropkami / checkami ---------- */ .nis2-list { margin: 16px 0 0; padding: 0; list-style: none; } .nis2-list li { position: relative; margin-bottom: 12px; padding-left: 22px; color: var(--nis2-text); font-size: 15px; line-height: 1.65; } .nis2-list li::before { content: ""; position: absolute; top: 9px; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--nis2-indigo-3); } /* Znak "✓" zamiast glifu Font Awesome — FA leci przez TypeKit, więc nazwa rodziny nie jest pewna, a to musi działać zawsze. */ .nis2-list--check li::before { content: "\2713"; top: -1px; width: auto; height: auto; border-radius: 0; background: none; color: var(--nis2-indigo-3); font-size: 15px; font-weight: 700; line-height: 1.65; } /* ============================================================ 1. HERO ============================================================ */ .nis2-hero { position: relative; overflow: hidden; padding: 56px 0 80px; } .nis2-hero__title { margin: 24px 0 0; color: #fff; font-size: clamp(36px, 6vw, 60px); font-weight: 900; line-height: 1.06; letter-spacing: -0.025em; } .nis2-hero__desc { max-width: 560px; margin: 24px 0 0; color: var(--nis2-text); font-size: 18px; line-height: 1.7; } .nis2-hero__desc strong { color: #fff; font-weight: 600; } .nis2-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; } .nis2-hero__note { margin: 20px 0 0; color: var(--nis2-muted); font-size: 14px; } @media (max-width: 575px) { .nis2-hero__cta .nis2-btn { width: 100%; } } /* ============================================================ PANEL TERMINALOWY + ODLICZANIE ============================================================ */ .nis2-term { overflow: hidden; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 16px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); } .nis2-term__bar { display: flex; align-items: center; gap: 7px; padding: 10px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); background: rgba(14, 14, 44, 0.7); } .nis2-term__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.2); } .nis2-term__title { margin-left: 6px; color: var(--nis2-muted); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 12px; } .nis2-term__live { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; color: #6EE7B7; font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 10px; font-weight: 700; letter-spacing: 0.15em; } .nis2-term__live-dot { width: 6px; height: 6px; border-radius: 50%; background: #34D399; animation: nis2-pulse 2s ease-in-out infinite; } @keyframes nis2-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } } .nis2-term__body { padding: 20px 18px; font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 13px; line-height: 1.75; } .nis2-term__body p { margin: 0 0 4px; color: var(--nis2-text); } .nis2-term__body--boxed { border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px; background: rgba(14, 14, 44, 0.5); } .nis2-term__prompt { color: #64748B; } .nis2-term__prompt--spaced { margin-top: 14px !important; } /* Kontrast sprawdzony na tle #14152E — wszystkie ≥ 4.5:1 */ .nis2-ok { color: #6EE7B7; font-weight: 700; } .nis2-warn { color: #FCD34D; font-weight: 700; } .nis2-bad { color: #FDA4AF; font-weight: 700; } .nis2-countdown { margin-top: 12px; padding: 16px; border: 1px solid rgba(167, 155, 245, 0.25); border-radius: 12px; background: rgba(108, 92, 231, 0.1); } .nis2-countdown__label { margin: 0 0 12px !important; color: var(--nis2-lav) !important; font-size: 10px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; } .nis2-countdown__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; text-align: center; } .nis2-countdown__cell { padding: 10px 4px; border-radius: 8px; background: rgba(14, 14, 44, 0.6); } .nis2-countdown__cell span { display: block; color: #fff; font-size: 26px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1.1; } .nis2-countdown__cell .nis2-countdown__sec { color: var(--nis2-indigo-3); } .nis2-countdown__cell small { display: block; margin-top: 2px; color: var(--nis2-muted); font-size: 10px; letter-spacing: 0.05em; text-transform: uppercase; } .nis2-countdown__foot { margin: 12px 0 0 !important; color: var(--nis2-muted) !important; font-size: 11px; line-height: 1.5; } /* ============================================================ 2. PROBLEM / DLACZEGO TERAZ ============================================================ */ .nis2-reasons { margin: 0; padding: 0; list-style: none; } .nis2-reasons__item { display: flex; gap: 16px; margin-bottom: 16px; padding: 20px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 12px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); transition: border-color 0.3s ease; } .nis2-reasons__item:hover { border-color: rgba(167, 155, 245, 0.38); } .nis2-reasons__num { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: 10px; background: rgba(108, 92, 231, 0.2); color: var(--nis2-indigo-3); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 14px; font-weight: 700; } .nis2-reasons__item h3 { margin: 0 0 6px; color: #fff; font-size: 18px; font-weight: 700; } .nis2-reasons__item p { margin: 0; color: var(--nis2-text); font-size: 15px; line-height: 1.7; } .nis2-reasons__item strong { color: #fff; font-weight: 600; } /* ============================================================ 4. CASE STUDY ============================================================ */ .nis2-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 32px 0 0; } .nis2-stats__item { padding: 20px 14px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 12px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); text-align: center; } .nis2-stats__item dd { margin: 0; } .nis2-stats__num { display: block; color: #fff; font-size: 28px; font-weight: 900; letter-spacing: -0.02em; } .nis2-stats__lbl { display: block; margin-top: 6px; color: var(--nis2-muted); font-size: 13px; line-height: 1.4; } @media (max-width: 575px) { .nis2-stats { grid-template-columns: 1fr; } } .nis2-figure { margin: 0; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 16px; background: var(--nis2-navy-800); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); } .nis2-figure img { display: block; width: 100%; height: auto; } .nis2-figure figcaption { padding: 14px 20px; border-top: 1px solid rgba(255, 255, 255, 0.1); color: var(--nis2-muted); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 12px; } /* ============================================================ 5. SEKTOR PUBLICZNY ============================================================ */ .nis2-public { position: relative; overflow: hidden; padding: 40px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 20px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); } @media (max-width: 767px) { .nis2-public { padding: 26px; } } /* ============================================================ 6. DLACZEGO CREOSPACE ============================================================ */ .nis2-trust { list-style: none; padding-left: 0; } .nis2-trust .nis2-card strong { display: block; color: #fff; font-size: 24px; font-weight: 900; letter-spacing: -0.02em; } .nis2-trust .nis2-card span { display: block; margin-top: 6px; color: var(--nis2-text); font-size: 15px; line-height: 1.5; } /* ============================================================ 7. KROKI ============================================================ */ .nis2-steps { list-style: none; padding-left: 0; counter-reset: none; } .nis2-card__step-num { display: block; color: rgba(108, 92, 231, 0.4); font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 48px; font-weight: 900; line-height: 1; } /* ============================================================ 8. FAQ Natywne

— działa bez JS, dostępne z klawiatury. ============================================================ */ .nis2-faq { margin-top: 32px; } .nis2-faq__item { margin-bottom: 12px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 12px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); transition: border-color 0.3s ease; } .nis2-faq__item[open] { border-color: rgba(167, 155, 245, 0.38); } .nis2-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; color: #fff; font-size: 17px; font-weight: 700; line-height: 1.45; cursor: pointer; list-style: none; } .nis2-faq__item summary::-webkit-details-marker { display: none; } .nis2-faq__item summary::after { content: "\2b"; /* + */ flex-shrink: 0; color: var(--nis2-indigo-3); font-size: 20px; font-weight: 400; transition: transform 0.25s ease; } .nis2-faq__item[open] summary::after { content: "\2212"; /* − */ } .nis2-faq__item p { margin: 0; padding: 0 22px 20px; color: var(--nis2-text); font-size: 15px; line-height: 1.75; } /* ============================================================ 9. KONTAKT ============================================================ */ .nis2-contact { position: relative; overflow: hidden; margin: 40px 0 64px; padding: 48px 40px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 24px; background: linear-gradient(180deg, rgba(36, 39, 81, 0.55) 0%, rgba(20, 21, 46, 0.55) 100%); } @media (max-width: 767px) { .nis2-contact { padding: 30px 22px; border-radius: 18px; } } .nis2-contact__glow { position: absolute; top: -40%; right: -10%; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(108, 92, 231, 0.25) 0%, transparent 70%); pointer-events: none; } .nis2-contact__info { margin-top: 28px; } .nis2-contact__info-item { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; color: var(--nis2-text); font-size: 16px; text-decoration: none; transition: color 0.25s ease; } a.nis2-contact__info-item:hover, a.nis2-contact__info-item:focus { color: #fff; } .nis2-contact__info-item i { width: 20px; color: var(--nis2-indigo-3); text-align: center; } .nis2-contact__socials { display: flex; gap: 12px; margin-top: 24px; } .nis2-contact__socials a { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid rgba(167, 155, 245, 0.25); border-radius: 12px; color: var(--nis2-text); font-size: 17px; transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease; } .nis2-contact__socials a:hover, .nis2-contact__socials a:focus { border-color: transparent; background: var(--nis2-indigo); color: #fff; } /* ============================================================ SKÓRKA CONTACT FORM 7 — wariant ciemny Selektory celują w klasy generowane przez wtyczkę, więc styl działa niezależnie od tego, którą wersję formularza wepniesz (wspólny „Formularz 1" albo dedykowany formularz NIS2). ============================================================ */ .nis2-form { padding: 34px 30px; border: 1px solid rgba(167, 155, 245, 0.16); border-radius: 20px; background: rgba(14, 14, 44, 0.45); } @media (max-width: 767px) { .nis2-form { padding: 24px 20px; } } .nis2-form .wpcf7-form label { display: block; margin-bottom: 6px; color: #E2E8F0; font-size: 14px; font-weight: 600; } .nis2-form .wpcf7-form input[type="text"], .nis2-form .wpcf7-form input[type="email"], .nis2-form .wpcf7-form input[type="tel"], .nis2-form .wpcf7-form select, .nis2-form .wpcf7-form textarea { width: 100%; margin-bottom: 16px; padding: 13px 16px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 8px; background: rgba(14, 14, 44, 0.6); color: #fff; font-family: inherit; font-size: 15px; transition: border-color 0.25s ease; } .nis2-form .wpcf7-form textarea { min-height: 120px; resize: vertical; } .nis2-form .wpcf7-form ::placeholder { color: #64748B; } .nis2-form .wpcf7-form input:focus, .nis2-form .wpcf7-form select:focus, .nis2-form .wpcf7-form textarea:focus { border-color: var(--nis2-indigo-3); } /* Zgoda RODO — CF7 renderuje [acceptance] jako zagnieżdżone spany */ .nis2-form .wpcf7-acceptance .wpcf7-list-item { margin: 0; } .nis2-form .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 12px; color: var(--nis2-text); font-size: 14px; font-weight: 400; line-height: 1.6; } .nis2-form .wpcf7-form input[type="checkbox"] { flex-shrink: 0; width: 20px; height: 20px; margin-top: 3px; accent-color: var(--nis2-indigo); } .nis2-form .wpcf7-form a { color: var(--nis2-indigo-3); text-decoration: underline; text-underline-offset: 4px; } /* Submit */ .nis2-form .wpcf7-form input[type="submit"] { width: 100%; margin-top: 24px; padding: 16px 28px; border: none; border-radius: 12px; background: var(--nis2-indigo); color: #fff; font-family: inherit; font-size: 16px; font-weight: 700; cursor: pointer; box-shadow: 0 20px 25px -5px rgba(108, 92, 231, 0.25); transition: background 0.25s ease, transform 0.25s ease; } .nis2-form .wpcf7-form input[type="submit"]:hover { background: var(--nis2-indigo-4); transform: translateY(-2px); } .nis2-form .wpcf7-form input[type="submit"]:disabled { opacity: 0.6; cursor: not-allowed; transform: none; } /* Komunikaty walidacji */ .nis2-form .wpcf7-not-valid-tip { margin: -10px 0 14px; color: #FDA4AF; font-size: 14px; } .nis2-form .wpcf7-form input.wpcf7-not-valid, .nis2-form .wpcf7-form select.wpcf7-not-valid, .nis2-form .wpcf7-form textarea.wpcf7-not-valid { border-color: #FCA5A5; } .nis2-form .wpcf7-response-output { margin: 20px 0 0; padding: 14px 18px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 12px; color: #E2E8F0; font-size: 15px; } .nis2-form .wpcf7-form.invalid .wpcf7-response-output, .nis2-form .wpcf7-form.failed .wpcf7-response-output, .nis2-form .wpcf7-form.aborted .wpcf7-response-output { border-color: rgba(251, 113, 133, 0.45); background: rgba(244, 63, 94, 0.1); color: #FECDD3; } .nis2-form .wpcf7-form.sent .wpcf7-response-output { border-color: rgba(52, 211, 153, 0.45); background: rgba(16, 185, 129, 0.1); color: #A7F3D0; } .nis2-form .wpcf7-spinner { display: block; margin: 16px auto 0; } /* Siatka pól — działa, jeśli w edytorze CF7 owiniesz pola w

/

. */ .nis2-form .cf7-grid { display: grid; gap: 0 20px; } @media (min-width: 768px) { .nis2-form .cf7-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nis2-form .cf7-grid .cf7-full { grid-column: 1 / -1; } } /* ============================================================ STICKY CTA — mobile ============================================================ */ .nis2-sticky-cta { position: fixed; inset: auto 0 0 0; z-index: 40; padding: 12px 16px; border-top: 1px solid rgba(255, 255, 255, 0.1); background: rgba(14, 14, 44, 0.95); backdrop-filter: blur(12px); transform: translateY(120%); transition: transform 0.35s ease; } .nis2-sticky-cta.is-shown { transform: translateY(0); } .nis2-sticky-cta .nis2-btn { width: 100%; } /* Na desktopie CTA jest w nagłówku (nav-cta-group) — pasek zbędny. */ @media (min-width: 912px) { .nis2-sticky-cta { display: none; } } /* Zapas, żeby pasek nie zasłaniał końca stopki */ @media (max-width: 911px) { .nis2-landing #footer-wrap { padding-bottom: 80px; } } /* ============================================================ PREFERS-REDUCED-MOTION Wyłączamy ruch, zostawiamy pełną widoczność treści. ============================================================ */ @media (prefers-reduced-motion: reduce) { .nis2-landing *, .nis2-landing *::before, .nis2-landing *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; } .nis2-card:hover, .nis2-btn--primary:hover, .nis2-form .wpcf7-form input[type="submit"]:hover { transform: none; } /* AOS bez JS-owego disable — na wypadek gdyby init nie zdążył */ .nis2-landing [data-aos] { opacity: 1 !important; transform: none !important; } } /* ============================================================ RESPONSYWNOŚĆ — breakpoint projektu: 911px ============================================================ */ @media (max-width: 911px) { .nis2-section { padding: 52px 0; } .nis2-hero { padding: 36px 0 56px; } .nis2-term__body { font-size: 12px; } .nis2-countdown__cell span { font-size: 22px; } } @media (max-width: 400px) { .nis2-countdown__grid { gap: 6px; } .nis2-countdown__cell { padding: 8px 2px; } .nis2-countdown__cell span { font-size: 19px; } }