/* Voltra Crest — style.css (modern_bold) */
/* RESET & NORMALIZE */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
img, svg { display: block; max-width: 100%; height: auto; }
ul, ol { margin: 0; padding-left: 20px; }
a { text-decoration: none; color: inherit; }
button { font: inherit; background: none; border: none; padding: 0; cursor: pointer; }
:focus { outline: none; }
:focus-visible { outline: 3px solid #2FA27E; outline-offset: 2px; }

/* THEME TOKENS */
:root {
  --color-primary: #1F3A5F;  /* deep tech blue */
  --color-secondary: #2FA27E; /* energetic teal */
  --color-accent: #F4F7FB;   /* soft light */
  --color-ink: #0F172A;      /* near-black for text */
  --color-muted: #556987;    /* muted text */
  --color-border: #E2E8F0;   /* light border */
  --color-white: #FFFFFF;
  --shadow-1: 0 2px 12px rgba(15, 23, 42, 0.08);
  --shadow-2: 0 6px 20px rgba(15, 23, 42, 0.12);
  --radius-s: 10px;
  --radius-m: 14px;
  --radius-l: 18px;
  --space-8: 8px; --space-12: 12px; --space-16: 16px; --space-20: 20px; --space-24: 24px; --space-32: 32px; --space-40: 40px; --space-60: 60px;
  --transition-fast: 150ms ease;
  --transition-mid: 220ms ease;
}

/* TYPOGRAPHY */
body {
  font-family: Verdana, Segoe UI, Tahoma, sans-serif;
  color: var(--color-ink);
  background: var(--color-accent);
  line-height: 1.6;
  font-size: 16px;
}
h1, h2, h3, h4 { font-family: "Trebuchet MS", Verdana, Arial, sans-serif; margin: 0 0 12px; color: var(--color-ink); font-weight: 800; letter-spacing: 0.2px; }
h1 { font-size: 32px; line-height: 1.2; }
h2 { font-size: 24px; line-height: 1.25; margin-top: 8px; }
h3 { font-size: 18px; line-height: 1.3; }
.subheadline { color: var(--color-muted); font-size: 16px; margin: 6px 0 12px; }

p { margin: 0 0 12px; }
strong { font-weight: 800; }
.breadcrumbs { color: var(--color-muted); font-size: 14px; }
.last-updated { color: var(--color-muted); font-size: 14px; }

/* LAYOUT PRIMITIVES */
.container {
  width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px;
  display: flex; flex-direction: column; gap: var(--space-20);
}
section { padding: 40px 0; }
.content-wrapper { display: flex; flex-direction: column; gap: 20px; }

/* MANDATORY SPACING & ALIGNMENT PATTERNS */
.section { margin-bottom: 60px; padding: 40px 20px; }
.card-container { display: flex; flex-wrap: wrap; gap: 24px; }
.card { margin-bottom: 20px; position: relative; }
.content-grid { display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; }
.text-image-section { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.testimonial-card { display: flex; align-items: center; gap: 20px; padding: 20px; }
.feature-item { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; }

/* HEADER */
header { background: var(--color-white); border-bottom: 4px solid var(--color-primary); position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow-1); }
header > .container { flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; }
.logo img { height: 36px; }
.main-nav { display: none; align-items: center; gap: 16px; }
.main-nav a { color: var(--color-ink); font-weight: 700; padding: 10px 12px; border-radius: 8px; transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast); }
.main-nav a[aria-current="page"] { color: var(--color-secondary); }
.main-nav a:hover { background: var(--color-accent); transform: translateY(-1px); }
.header-ctas { display: none; align-items: center; gap: 12px; }

/* BUTTONS */
.btn-primary, .btn-secondary, .btn-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 800; letter-spacing: 0.3px; border-radius: var(--radius-m); padding: 12px 18px; transition: transform var(--transition-mid), box-shadow var(--transition-mid), background var(--transition-mid), color var(--transition-mid), border-color var(--transition-mid); }
.btn-primary { background: var(--color-secondary); color: #0B1B14; box-shadow: var(--shadow-2); border: 2px solid var(--color-secondary); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(47,162,126,0.35); }
.btn-secondary { background: var(--color-white); color: var(--color-primary); border: 2px solid var(--color-primary); box-shadow: var(--shadow-1); }
.btn-secondary:hover { background: var(--color-primary); color: var(--color-white); transform: translateY(-2px); }
.btn-link { padding: 8px 0; color: var(--color-secondary); border-bottom: 2px solid currentColor; border-radius: 0; }
.btn-link:hover { color: #238a6b; }

/* MOBILE NAVIGATION */
.mobile-menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; border: 2px solid var(--color-primary); color: var(--color-primary); background: var(--color-white); transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast); }
.mobile-menu-toggle:hover { background: var(--color-primary); color: var(--color-white); transform: translateY(-1px); }
.mobile-menu { position: fixed; inset: 0; background: var(--color-primary); color: var(--color-white); transform: translateX(100%); transition: transform 300ms ease; z-index: 999; display: flex; flex-direction: column; }
.mobile-menu.open { transform: translateX(0); }
.mobile-menu-header { display: flex; align-items: center; justify-content: space-between; padding: 16px; }
.mobile-menu-close { align-self: flex-end; margin: 12px 16px 0 0; width: 44px; height: 44px; border-radius: 10px; border: 2px solid #fff; color: #fff; transition: background var(--transition-fast), transform var(--transition-fast); }
.mobile-menu-close:hover { background: rgba(255,255,255,0.12); transform: translateY(-1px); }
.mobile-nav { display: flex; flex-direction: column; gap: 8px; padding: 20px; }
.mobile-nav a { display: flex; align-items: center; padding: 14px 12px; color: #E9F1FF; font-weight: 800; border-radius: 10px; border: 2px solid rgba(255,255,255,0.1); }
.mobile-nav a[aria-current="page"] { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.25); }
.mobile-nav a:hover { background: rgba(255,255,255,0.10); }

/* HERO */
.hero { background: var(--color-primary); color: var(--color-white); position: relative; overflow: hidden; }
.hero .content-wrapper { padding: 8px 0 8px 0; }
.hero h1, .hero .subheadline, .hero p { color: var(--color-white); }
.hero .hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
/* Decorative geometric shapes */
.hero::before, .hero::after { content: ""; position: absolute; z-index: 0; }
.hero::before { width: 220px; height: 220px; background: rgba(47,162,126,0.15); right: -60px; top: -60px; border-radius: 24px; transform: rotate(18deg); }
.hero::after { width: 140px; height: 140px; background: rgba(255,255,255,0.06); left: -40px; bottom: -40px; border-radius: 20px; transform: rotate(-12deg); }
.hero .container, .hero .content-wrapper { position: relative; z-index: 1; }

/* TRUST BADGES + BADGES */
.trust-badges { display: flex; flex-wrap: wrap; gap: 12px; }
.trust-badges .badge { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: rgba(255,255,255,0.10); border: 2px solid rgba(255,255,255,0.25); color: #fff; border-radius: 12px; }
.trust-badges .badge img { width: 20px; height: 20px; }
.promo-badges { display: flex; flex-wrap: wrap; gap: 10px; }
.promo-badges .badge { display: inline-flex; align-items: center; justify-content: center; padding: 8px 12px; background: var(--color-secondary); color: #0B1B14; font-weight: 900; border-radius: 999px; border: 2px solid #138e69; }

/* VALUE PROP + SEARCH BAR */
.value-proposition ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.value-proposition li { display: flex; align-items: center; gap: 10px; padding-left: 8px; }
.value-proposition li::before { content: "■"; color: var(--color-secondary); font-size: 12px; }
.search-bar { display: flex; flex-direction: column; gap: 8px; padding: 14px; background: rgba(255,255,255,0.08); border: 2px solid rgba(255,255,255,0.2); border-radius: 12px; }
.search-bar .btn-link { color: #fff; border-color: #fff; }

/* GENERIC TEXT SECTIONS */
.text-section { display: flex; flex-direction: column; gap: 12px; background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-m); padding: 16px; box-shadow: var(--shadow-1); }
.text-section ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.text-section li { display: flex; align-items: center; gap: 10px; }
.text-section li img { width: 18px; height: 18px; }

/* FEATURE GRID */
.feature-grid { display: flex; flex-wrap: wrap; gap: 24px; }
.feature-grid .feature-item { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-l); padding: 18px; box-shadow: var(--shadow-1); flex: 1 1 260px; min-width: 260px; transition: transform var(--transition-mid), box-shadow var(--transition-mid), border-color var(--transition-mid); }
.feature-grid .feature-item:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); border-color: var(--color-primary); }

/* QUICK LINKS */
.quick-links, .support-links { display: flex; flex-wrap: wrap; gap: 10px; color: var(--color-muted); }
.quick-links a, .support-links a { color: var(--color-primary); font-weight: 800; border-bottom: 2px solid transparent; }
.quick-links a:hover, .support-links a:hover { border-color: var(--color-primary); }

/* SERVICE LIST */
.service-list { display: flex; flex-wrap: wrap; gap: 24px; }
.service-item { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-l); padding: 18px; box-shadow: var(--shadow-1); flex: 1 1 280px; min-width: 260px; transition: transform var(--transition-mid), box-shadow var(--transition-mid); }
.service-item:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); }
.service-item h3 { display: flex; align-items: center; gap: 10px; }
.service-item h3 img { width: 20px; height: 20px; }

/* LIST HIGHLIGHTS */
.usp-highlights ul, .savings-highlights ul, .value-list ul, .warranty-summary ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.usp-highlights li, .savings-highlights li, .value-list li, .warranty-summary li { position: relative; padding-left: 28px; }
.usp-highlights li::before, .savings-highlights li::before, .value-list li::before, .warranty-summary li::before { content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 4px; background: var(--color-secondary); }

/* TEASERS & TERMS */
.teasers p, .terms-snippet p { background: var(--color-accent); border: 2px solid var(--color-border); border-radius: var(--radius-s); padding: 12px; }

/* REVIEWS */
.rating-summary { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-s); color: var(--color-ink); box-shadow: var(--shadow-1); }
.review-slider { display: flex; flex-wrap: nowrap; gap: 16px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
.review-slider .testimonial-card { scroll-snap-align: start; }
.testimonial-card { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-l); color: var(--color-ink); box-shadow: var(--shadow-1); flex: 0 0 auto; min-width: 280px; max-width: 520px; }
.testimonial-card p { margin: 0; font-style: italic; }
.testimonial-card .author { font-weight: 800; color: var(--color-primary); }
.cert-logos { display: flex; align-items: center; gap: 16px; }
.cert-logos img { height: 28px; filter: none; }

/* CATEGORY NAV (produkty) */
.category-nav, .categories-nav { display: flex; flex-wrap: wrap; gap: 10px; }
.category-nav a, .categories-nav a { padding: 10px 14px; border-radius: 999px; background: var(--color-white); border: 2px solid var(--color-primary); color: var(--color-primary); font-weight: 800; transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast); }
.category-nav a:hover, .categories-nav a:hover { background: var(--color-primary); color: var(--color-white); transform: translateY(-2px); }
.filters-overview { color: var(--color-muted); }

/* PRODUCT GRID */
.product-grid { display: flex; flex-wrap: wrap; gap: 24px; }
.product-card { background: var(--color-white); border: 3px solid var(--color-primary); border-radius: 18px; padding: 18px; box-shadow: var(--shadow-2); flex: 1 1 280px; min-width: 260px; transition: transform var(--transition-mid), box-shadow var(--transition-mid); }
.product-card:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(31,58,95,0.25); }
.product-card h3 { color: var(--color-primary); font-size: 20px; }
.product-card ul { margin: 8px 0 0; padding-left: 18px; }
.price { font-size: 24px; font-weight: 900; color: var(--color-secondary); margin-top: 6px; }
.card-ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }

/* COMPARE TOOL & PAGINATION */
.compare-tool, .featured-guide-card { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-l); padding: 18px; box-shadow: var(--shadow-1); }
.pagination { display: flex; align-items: center; gap: 10px; color: var(--color-muted); }
.pagination a { display: inline-flex; align-items: center; justify-content: center; padding: 6px 10px; border-radius: 8px; border: 2px solid var(--color-primary); color: var(--color-primary); font-weight: 800; }
.pagination a:hover { background: var(--color-primary); color: #fff; }

/* DEAL GRID (promocje) */
.deal-grid { display: flex; flex-wrap: wrap; gap: 24px; }
.deal-item { background: var(--color-white); border: 3px solid var(--color-secondary); border-radius: 18px; padding: 18px; box-shadow: var(--shadow-2); flex: 1 1 280px; min-width: 260px; transition: transform var(--transition-mid), box-shadow var(--transition-mid); }
.deal-item:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(47,162,126,0.25); }
.countdown { color: #D8F5EA; font-weight: 800; }

/* GUIDES (poradniki) */
.guide-list { display: flex; flex-direction: column; gap: 16px; }
.guide-list article { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-m); padding: 16px; box-shadow: var(--shadow-1); flex: 1 1 260px; transition: transform var(--transition-mid), box-shadow var(--transition-mid); }
.guide-list article:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); }
.popular-tags { color: var(--color-muted); }
.ask-expert { color: var(--color-ink); }

/* ABOUT (o-nas) blocks */
.timeline, .team-intro, .certifications, .innovation-highlights, .quality-assurance, .sustainability, .service-overview, .media-mentions { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-m); padding: 16px; box-shadow: var(--shadow-1); }
.timeline ul { margin: 0; padding-left: 18px; }
.certifications img { display: inline-block; height: 22px; margin-right: 8px; }

/* CONTACT (kontakt) */
.faq-teaser p { background: var(--color-accent); border: 2px solid var(--color-border); border-radius: var(--radius-s); padding: 12px; }

/* FOOTER */
footer { background: var(--color-primary); color: #EAF1FF; padding: 36px 0; margin-top: 20px; }
footer .content-wrapper { flex-direction: column; gap: 20px; }
footer h3 { color: #fff; }
.newsletter-signup { display: flex; flex-direction: column; gap: 10px; background: rgba(255,255,255,0.06); border: 2px solid rgba(255,255,255,0.18); border-radius: var(--radius-l); padding: 16px; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-nav a { color: #CFE2FF; font-weight: 800; padding: 8px 10px; border-radius: 8px; border: 2px solid rgba(255,255,255,0.18); }
.footer-nav a:hover { background: rgba(255,255,255,0.12); }
.social-links, .payment-icons { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.social-links a { display: inline-flex; padding: 8px; border-radius: 10px; border: 2px solid rgba(255,255,255,0.18); }
.social-links a:hover { background: rgba(255,255,255,0.12); }
.payment-icons img { height: 26px; filter: brightness(1.15); }
address { font-style: normal; color: #CFE2FF; }

/* COOKIES — BANNER & MODAL */
.cookie-banner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 998; transform: translateY(110%); transition: transform 280ms ease; }
.cookie-banner.show { transform: translateY(0); }
.cookie-banner .bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; background: var(--color-ink); color: #F6FAFF; padding: 14px 16px; border-top: 4px solid var(--color-secondary); }
.cookie-banner .text { flex: 1 1 220px; font-size: 14px; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.cookie-actions .btn { display: inline-flex; align-items: center; justify-content: center; padding: 10px 14px; border-radius: 10px; font-weight: 800; }
.cookie-accept { background: var(--color-secondary); color: #0B1B14; border: 2px solid var(--color-secondary); }
.cookie-reject { background: var(--color-white); color: var(--color-primary); border: 2px solid var(--color-primary); }
.cookie-settings { background: transparent; color: #F6FAFF; border: 2px solid #F6FAFF; }

.cookie-overlay { position: fixed; inset: 0; background: rgba(15,23,42,0.6); opacity: 0; pointer-events: none; transition: opacity 220ms ease; z-index: 997; }
.cookie-overlay.show { opacity: 1; pointer-events: auto; }
.cookie-modal { position: fixed; left: 50%; top: 50%; transform: translate(-50%, calc(-50% + 20px)); opacity: 0; background: var(--color-white); width: 92%; max-width: 560px; border-radius: 18px; border: 3px solid var(--color-primary); box-shadow: var(--shadow-2); z-index: 1000; display: flex; flex-direction: column; gap: 14px; padding: 18px; pointer-events: none; transition: opacity 220ms ease, transform 220ms ease; }
.cookie-modal.open { opacity: 1; transform: translate(-50%, -50%); pointer-events: auto; }
.cookie-modal h3 { margin-bottom: 4px; }
.cookie-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 2px solid var(--color-border); }
.cookie-row:last-child { border-bottom: 0; }
/* Toggle switch */
.cookie-toggle { width: 48px; height: 28px; border-radius: 999px; background: #E2E8F0; border: 2px solid #CBD5E1; position: relative; display: inline-flex; align-items: center; padding: 2px; transition: background var(--transition-fast), border-color var(--transition-fast); }
.cookie-toggle::after { content: ""; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-1); transform: translateX(0); transition: transform var(--transition-fast); }
.cookie-toggle.on { background: var(--color-secondary); border-color: #138e69; }
.cookie-toggle.on::after { transform: translateX(20px); }
.cookie-modal-actions { display: flex; justify-content: flex-end; gap: 10px; }

/* BREADCRUMBS in hero */
.hero .breadcrumbs { opacity: 0.9; }

/* MISC UTILITIES */
.badge { font-weight: 800; }
.media-mentions p { margin: 0; }

/* RESPONSIVE */
@media (min-width: 640px) {
  h1 { font-size: 40px; }
  h2 { font-size: 28px; }
}
@media (min-width: 768px) {
  h1 { font-size: 48px; }
  h2 { font-size: 32px; }
  header .main-nav { display: flex; }
  header .header-ctas { display: flex; }
  .mobile-menu-toggle { display: none; }
  .content-wrapper { gap: 24px; }
  .guide-list { flex-direction: row; flex-wrap: wrap; }
}
@media (min-width: 992px) {
  .container { gap: 24px; }
  .hero .content-wrapper { padding: 12px 0 16px 0; }
  footer .content-wrapper { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; }
}

/* ACCESSIBILITY & STATES */
a:hover, a:active { outline: none; }
.btn-primary:active, .btn-secondary:active { transform: translateY(0); }

/* PAGE-SPECIFIC LIGHT/DARK BALANCE */
/* Ensure testimonials and reviews use dark text on light backgrounds for readability */
section .testimonial-card, section .rating-summary { background: var(--color-white); color: var(--color-ink); }

/* BREADCRUMBS wrappers across inner pages */
.hero .subheadline + .category-nav,
.hero .subheadline + .categories-nav,
.hero .subheadline + .promo-badges { margin-top: 4px; }

/* COUNTDOWN emphasis */
.countdown { display: inline-flex; padding: 8px 12px; border-radius: 10px; border: 2px solid rgba(255,255,255,0.25); }

/* FOOTER payment icons spacing on small */
.payment-icons { gap: 14px; }

/* HEADER current page accent */
.main-nav a[aria-current="page"] { border: 2px solid var(--color-secondary); border-radius: 10px; }

/* ARTICLE link emphasis */
.guide-list article a { color: var(--color-primary); font-weight: 800; border-bottom: 2px solid transparent; }
.guide-list article a:hover { border-color: var(--color-primary); }

/* CERT LOGO group in index */
.cert-logos { flex-wrap: wrap; }

/* HERO CTAs spacing */
.hero-ctas .btn-primary, .hero-ctas .btn-secondary { min-width: 180px; }

/* Ensure minimum gaps between content blocks */
.content-wrapper > * + * { margin-top: 0; }

/* Print safe colors if needed (fallbacks) */
@media print {
  header, footer, .mobile-menu, .cookie-banner, .cookie-overlay, .cookie-modal { display: none !important; }
  body { background: #fff; color: #000; }
}