/* ==========================================================================
   iNode.pl – nadpisania szablonu Technoit (kolory marki, czcionki, komponenty)
   ========================================================================== */

/* Poppins hostowany lokalnie (latin + latin-ext dla polskich i skandynawskich znaków) */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/poppins-latin-ext-300-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/poppins-latin-300-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/poppins-latin-ext-400-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/poppins-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/poppins-latin-ext-500-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/poppins-latin-500-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/poppins-latin-ext-600-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/poppins-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/poppins-latin-ext-700-normal.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/poppins-latin-700-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---------- Kolory marki: jasnoniebieski z logo + granat ---------- */
:root {
  --brand-sky: #42C0FB;
  --brand-blue: #0679B8;
  --brand-navy: #14243A;
  --brand-indigo: #3F51B5;

  --color-primary: var(--brand-blue);
  --color-secondary: #1C9AD6;
  --theme-color: #ffffff;
  --theme-color-dark: #F2F7FB;
  --light-color: #ffffff;
  --text-color: #24313D;
  --text-muted-color: #5B6773;
  --menu-color: #ffffff;
  --hero-text-color: #ffffff;
  --border-color: #DCE6EE;
  --box-shadow-color: rgb(20 36 58 / 10%);
  --card-bg: #ffffff;
  --hero-gradient: linear-gradient(135deg, #0B1A2C 0%, #14325A 55%, #0679B8 100%);

  --bs-primary: var(--brand-blue);
  --bs-primary-rgb: 6, 121, 184;
  --bs-link-color: var(--brand-blue);
  --bs-link-color-rgb: 6, 121, 184;
  --bs-link-hover-color: #045A8A;
  --bs-body-font-family: 'Poppins', system-ui, sans-serif;
}

:root.dark {
  --color-primary: #5CCBFF;
  --color-secondary: #42C0FB;
  --theme-color: #0E1622;
  --theme-color-dark: #131F2F;
  --light-color: #0E1622;
  --text-color: #E3EAF1;
  --text-muted-color: #A3B1BF;
  --border-color: #26364A;
  --box-shadow-color: rgb(0 0 0 / 35%);
  --card-bg: #172539;
  --bs-body-color: #E3EAF1;
  --bs-body-bg: #0E1622;
  --bs-secondary-color: #A3B1BF;
  --bs-border-color: #26364A;
  --bs-link-color: #5CCBFF;
  --bs-link-color-rgb: 92, 203, 255;
  --bs-link-hover-color: #9BDFFF;
  --bs-tertiary-bg: #172539;
  color-scheme: dark;
}
:root.dark .table { --bs-table-color: var(--text-color); --bs-table-bg: transparent; --bs-table-border-color: var(--border-color); }
:root.dark .form-control, :root.dark .form-select { background-color: #172539; color: var(--text-color); border-color: var(--border-color); }
:root.dark .text-muted { color: var(--text-muted-color) !important; }
:root.dark .accordion { --bs-accordion-bg: var(--card-bg); --bs-accordion-color: var(--text-color); --bs-accordion-btn-color: var(--text-color); --bs-accordion-active-bg: #1B2C44; --bs-accordion-active-color: var(--color-primary); --bs-accordion-border-color: var(--border-color); }

body { font-family: 'Poppins', system-ui, sans-serif; background: var(--theme-color); color: var(--text-color); }
a { color: var(--color-primary); }
h1, h2, h3, h4, h5 { color: var(--text-color); }
.text-primary { color: var(--color-primary) !important; }
.btn-primary { --bs-btn-bg: var(--brand-blue); --bs-btn-border-color: var(--brand-blue); --bs-btn-hover-bg: #045A8A; --bs-btn-hover-border-color: #045A8A; }
.btn-outline-primary { --bs-btn-color: var(--color-primary); --bs-btn-border-color: var(--color-primary); --bs-btn-hover-bg: var(--brand-blue); --bs-btn-hover-border-color: var(--brand-blue); }
:focus-visible { outline: 3px solid var(--brand-sky); outline-offset: 2px; }
.skip-link { position: absolute; left: 1rem; top: 1rem; z-index: 2000; background: #fff; padding: .5rem 1rem; border-radius: 4px; }
.section { padding: 80px 0; }
.section-header p { color: var(--text-muted-color); }
.section-header h2 { color: var(--text-color); font-weight: 600; }
.section-header h2::after { content: ''; display: block; width: 56px; height: 4px; border-radius: 2px; margin: 14px auto 0; background: var(--brand-sky); }

/* ---------- Nagłówek: przezroczysty nad hero, pełny po przewinięciu ---------- */
.header { position: fixed; top: 0; left: 0; right: 0; height: 80px; background: transparent; z-index: 997; }
.header.stikcy-menu { background: var(--light-color); box-shadow: 0 2px 16px var(--box-shadow-color); }
.header .logo img { max-height: 40px; width: auto; }
.header .logo .logo-light { display: none; }
.header.stikcy-menu .logo .logo-light { display: block; }
.header.stikcy-menu .logo .logo-dark { display: none; }
:root.dark .header.stikcy-menu .logo .logo-light { display: none; }
:root.dark .header.stikcy-menu .logo .logo-dark { display: block; }
#darkmode-button { background: rgb(255 255 255 / 12%); color: #fff; width: 40px; height: 40px; }
.header.stikcy-menu #darkmode-button { background: var(--theme-color-dark); color: var(--text-color); }
.mobile-nav-toggle { background: none; border: 0; color: #fff; font-size: 28px; line-height: 0; padding: 4px; margin-left: 8px; }
.header.stikcy-menu .mobile-nav-toggle { color: var(--text-color); }
.mobile-nav-active .mobile-nav-toggle { color: #fff !important; position: relative; z-index: 9999; }
.btn-get-started { border: 2px solid transparent; }
.btn-get-started.btn-outline { background: transparent; border-color: currentColor; color: inherit; }
.hero .btn-get-started.btn-outline { color: #fff; }
.btn-get-started.btn-outline:hover { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.header .btn-get-started { padding: 9px 18px; font-size: 14px; margin-left: 12px; white-space: nowrap; }
@media (max-width: 1279px) { .header .logo { margin-right: auto; } }

@media (min-width: 1280px) {
  .navbar .dropdown ul { background: var(--card-bg); border-radius: 8px; box-shadow: 0 10px 30px var(--box-shadow-color); }
  .navbar .dropdown ul a { color: var(--text-color) !important; }
  .navbar .dropdown ul a:hover, .navbar .dropdown ul a.active { color: var(--color-primary) !important; }
  .navbar .dropdown ul li.sub a { padding-left: 34px; font-size: 13px; }
  .navbar .lang-switch ul { min-width: 160px; left: auto; right: 0; }
}
@media (max-width: 1279px) {
  .navbar ul { background: var(--brand-navy); }
  .navbar .dropdown ul { background: rgb(255 255 255 / 6%); }
  .navbar .dropdown ul li.sub a { padding-left: 40px; }
}
@media (max-width: 575px) { .hide-on-mobile { display: none; } }

/* ---------- Hero ---------- */
.hero { background: var(--hero-image, none) center/cover no-repeat, var(--hero-gradient); min-height: 92vh; height: auto; padding: 140px 0 100px; }
.hero::before { background: linear-gradient(90deg, rgb(11 26 44 / 85%), rgb(11 26 44 / 20%)); opacity: 1; }
#particles-js { position: absolute; inset: 0; z-index: 0; }
.hero .container { z-index: 2; }
.hero h1 { color: #fff; font-size: clamp(30px, 4.6vw, 52px); font-weight: 600; line-height: 1.2; margin-bottom: 22px; }
.hero h1 span { color: var(--brand-sky); }
.hero .lead { color: rgb(255 255 255 / 85%); font-size: 18px; margin-bottom: 32px; max-width: 620px; }

/* ---------- Nagłówek podstron ---------- */
.breadcrumbs .page-header { background: var(--hero-gradient); padding: 140px 0 56px; }
.breadcrumbs .page-header::before { display: none; }
.breadcrumbs .page-header h1 { color: #fff; font-weight: 600; font-size: clamp(26px, 3.5vw, 40px); }
.breadcrumbs .page-header p { color: rgb(255 255 255 / 85%); }
.breadcrumbs nav { background: var(--theme-color-dark); padding: 14px 0; }
.breadcrumbs nav ol { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; font-size: 14px; }
.breadcrumbs nav ol { color: var(--text-color); }
.breadcrumbs nav ol a { color: var(--color-primary); }
.breadcrumbs nav ol li + li { padding-left: 0; }
.breadcrumbs nav ol li + li::before { content: '/'; padding: 0 10px; color: var(--text-muted-color); }

/* ---------- Karty ---------- */
.icon-box { background: var(--card-bg); }
.icon-box .icon i { font-size: 44px; color: var(--color-primary); }
.icon-box .title { font-size: 20px; }
.icon-box p { color: var(--text-muted-color); margin-bottom: 0; }
.feature-item { display: flex; gap: 18px; align-items: flex-start; }
.feature-item .icon { flex: 0 0 56px; height: 56px; display: grid; place-items: center; border-radius: 14px; background: rgb(66 192 251 / 14%); color: var(--color-primary); font-size: 26px; }
.feature-item h3 { font-size: 18px; margin-bottom: 6px; }
.feature-item p { color: var(--text-muted-color); }

.category-card { position: relative; display: flex; gap: 24px; padding: 28px; background: var(--card-bg); border-radius: 12px; box-shadow: 0 6px 24px var(--box-shadow-color); transition: transform .25s; }
.category-card:hover { transform: translateY(-4px); }
.category-card-icon { flex: 0 0 84px; height: 84px; display: grid; place-items: center; border-radius: 18px; background: var(--hero-gradient); color: #fff; font-size: 40px; }
.category-card-img { flex: 0 0 140px; width: 140px; height: 140px; object-fit: contain; }
.category-card h3 { font-size: 22px; }
.category-card h3 a { color: var(--text-color); }
.category-card p { color: var(--text-muted-color); }
.chip-list { display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 8px; list-style: none; }
.chip-list li { font-size: 12px; padding: 3px 10px; border-radius: 20px; background: rgb(66 192 251 / 14%); color: var(--color-primary); font-weight: 500; }
.chip-list.small li { font-size: 11px; padding: 2px 8px; }

.product-card { position: relative; display: flex; flex-direction: column; background: var(--card-bg); border-radius: 12px; overflow: hidden; box-shadow: 0 4px 18px var(--box-shadow-color); transition: transform .25s, box-shadow .25s; }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px var(--box-shadow-color); }
.product-card-img { aspect-ratio: 4/3; display: grid; place-items: center; background: #fff; border-bottom: 1px solid var(--border-color); }
.product-card-img img { width: 100%; height: 100%; object-fit: contain; padding: 14px; }
.product-card-img i { font-size: 56px; color: var(--brand-sky); }
:root.dark .product-card-img { background: #1B2B42; }
.product-card-body { padding: 18px; }
.product-card h3 { font-size: 17px; margin: 6px 0 8px; }
.product-card h3 a { color: var(--text-color); }
.product-card p { font-size: 14px; color: var(--text-muted-color); margin-bottom: 0; }

.subcat-card { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--card-bg); color: var(--text-color); transition: border-color .2s, transform .2s; }
.subcat-card:hover { border-color: var(--brand-sky); transform: translateY(-2px); color: var(--text-color); }
.subcat-card > i { font-size: 30px; color: var(--color-primary); }
.subcat-card strong { display: block; }
.subcat-card small { display: block; color: var(--text-muted-color); }
.subcat-card .badge { margin-left: auto; background: var(--theme-color-dark); color: var(--text-color); }
.subnav { display: flex; flex-wrap: wrap; gap: 8px; }
.subnav a, .subnav span { padding: 6px 14px; border-radius: 20px; border: 1px solid var(--border-color); font-size: 14px; color: var(--text-color); }
.subnav .active { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }

/* ---------- Karta produktu ---------- */
.product-gallery .main { display: block; border: 1px solid var(--border-color); border-radius: 12px; background: #fff; }
.product-gallery .main img { width: 100%; aspect-ratio: 1; object-fit: contain; padding: 20px; }
.product-gallery .thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 10px; }
.product-gallery .thumbs img { width: 100%; aspect-ratio: 1; object-fit: contain; border: 1px solid var(--border-color); border-radius: 8px; background: #fff; padding: 6px; }
.placeholder-img { aspect-ratio: 1; display: grid; place-items: center; border-radius: 12px; background: var(--hero-gradient); color: #fff; font-size: 90px; }
.spec-table th { width: 38%; font-weight: 500; color: var(--text-muted-color); }
.spec-table .spec-group th { background: var(--theme-color-dark); color: var(--text-color); font-weight: 600; width: auto; }
.check-list { list-style: none; padding: 0; columns: 2; }
.check-list li { margin-bottom: 6px; break-inside: avoid; }
.check-list i { color: var(--color-primary); }
.download-item { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--border-color); border-radius: 10px; color: var(--text-color); background: var(--card-bg); }
.download-item:hover { border-color: var(--brand-sky); }
.download-item i { font-size: 24px; color: var(--color-primary); }

.prose h2, .prose h3, .prose h4 { margin-top: 1.4em; }
.prose p, .prose li { line-height: 1.75; }
.prose code { background: var(--theme-color-dark); padding: 1px 6px; border-radius: 4px; color: inherit; }

/* ---------- Oprogramowanie ---------- */
.software-item { display: flex; gap: 20px; padding: 24px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--card-bg); margin-bottom: 18px; }
.software-icon { flex: 0 0 56px; height: 56px; display: grid; place-items: center; border-radius: 14px; background: rgb(66 192 251 / 14%); color: var(--color-primary); font-size: 26px; }
.software-item h3 { font-size: 20px; margin-bottom: 4px; }
.software-item .meta { font-size: 13px; color: var(--text-muted-color); }
.software-archive summary { cursor: pointer; }

/* ---------- O firmie / kontakt ---------- */
.company-card { padding: 24px; border-radius: 12px; background: var(--theme-color-dark); }
.company-card dt { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted-color); font-weight: 500; }
.company-card dd { margin-bottom: 12px; }
.contact-info .info-item { display: flex; gap: 16px; margin-bottom: 22px; }
.contact-info .info-item > i { flex: 0 0 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: rgb(66 192 251 / 14%); color: var(--color-primary); font-size: 20px; }
.contact-info h2 { margin-bottom: 2px; }
.contact-info p { margin: 0; color: var(--text-muted-color); }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.map iframe { width: 100%; height: 380px; border: 0; border-radius: 12px; }

/* ---------- CTA i stopka ---------- */
.call-to-action { background: var(--hero-gradient); background-attachment: scroll; padding: 80px 0; }
.call-to-action::before { display: none; }
.call-to-action h2 { color: #fff; }
.call-to-action .cta-btn { border: 2px solid #fff; color: #fff; }
.call-to-action .cta-btn:hover { background: #fff; color: var(--brand-navy); }
.footer-section { background: #0B1522; color: rgb(255 255 255 / 75%); background-attachment: scroll; padding: 0; }
.footer-section::before { display: none; }
.footer-section h3 { color: #fff; font-size: 17px; margin-bottom: 16px; }
.footer-section a { color: rgb(255 255 255 / 80%); }
.footer-section a:hover { color: var(--brand-sky); }
.footer-section .list { list-style: none; }
.footer-section .list li { margin-bottom: 8px; }
.footer-text p { color: rgb(255 255 255 / 75%); line-height: 1.7; }
.footer-social-icon a { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgb(255 255 255 / 8%); margin-right: 6px; }
.footer-legal { border-top: 1px solid rgb(255 255 255 / 10%); color: rgb(255 255 255 / 55%); }
.scroll-top { background: var(--brand-blue); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  #particles-js { display: none; }
}
@media (max-width: 767px) {
  .category-card { flex-direction: column; }
  .check-list { columns: 1; }
  .software-item { flex-direction: column; }
}

/* ---------- Zgoda na cookies / treści zewnętrzne ---------- */
.consent-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 100000; display: flex; justify-content: center; pointer-events: none; }
.consent-banner[hidden] { display: none; }
.consent-inner { pointer-events: auto; width: min(640px, 100%); background: var(--card-bg); color: var(--text-color); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: 0 12px 40px rgb(0 0 0 / 25%); padding: 20px 22px; }
.consent-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.consent-actions .btn-primary { min-width: 140px; }
.footer-consent-link { color: rgb(255 255 255 / 70%); text-decoration: underline; }
.footer-consent-link:hover { color: var(--brand-sky); }
.map-consent { height: 380px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 24px; border-radius: 12px; background: var(--theme-color-dark); border: 1px dashed var(--border-color); }
.map-consent > i { font-size: 42px; color: var(--color-primary); }
.map-consent p { max-width: 460px; color: var(--text-muted-color); margin: 0; }
@media (max-width: 575px) { .consent-actions .btn-primary { flex: 1 1 45%; min-width: 0; } }

/* ---------- Instrukcje ---------- */
.lang-tag { display: inline-block; font-size: 10px; font-weight: 600; line-height: 1; padding: 3px 5px; border-radius: 4px; border: 1px solid currentColor; vertical-align: middle; margin-left: 4px; opacity: .8; }
.download-main { border-color: var(--brand-sky); background: rgb(66 192 251 / 8%); }

/* ---------- Data pliku przy przyciskach pobierania ---------- */
.btn-file { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.btn-file .file-date { font-size: 11px; font-weight: 400; opacity: .85; padding-left: 6px; border-left: 1px solid currentColor; white-space: nowrap; }
.software-icon.has-image { background: transparent; overflow: hidden; }
.software-icon img { width: 100%; height: 100%; object-fit: contain; }

/* ---------- Strona szczegółów programu ---------- */
.screenshots img { width: 100%; border: 1px solid var(--border-color); border-radius: 10px; background: #fff; }
.software-detail .software-icon { flex: 0 0 64px; height: 64px; }
/* listy w treściach z panelu (szablon wyłącza punktory globalnie) */
.prose ul { list-style: disc; padding-left: 1.4em; margin-bottom: 1rem; }
.prose ol { list-style: decimal; padding-left: 1.4em; margin-bottom: 1rem; }
.prose li { margin-bottom: .25rem; }