/* === RESET & BASE === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #f7f8fc; color: #1a1a2e; line-height: 1.6; }
a { text-decoration: none; color: inherit; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

/* === TEXT CARET IN FORM FIELDS === */
:root { --field-caret-color: #126dff; }
.dark { --field-caret-color: #ff3547; }

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
textarea,
[contenteditable]:not([contenteditable="false"]) {
  caret-color: var(--field-caret-color);
}

@supports (caret-animation: manual) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]):focus,
  textarea:focus,
  [contenteditable]:not([contenteditable="false"]):focus {
    caret-animation: manual;
    animation: field-caret-blink 0.9s steps(1, end) infinite;
  }
}

@keyframes field-caret-blink {
  0%, 52% { caret-color: var(--field-caret-color); }
  53%, 100% { caret-color: transparent; }
}

/* === NAVBAR === */
.navbar { background: #fff; border-bottom: 1px solid #e8eaf0; position: sticky; top: 0; z-index: 100; }
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo { font-size: 1.3rem; font-weight: 700; color: #3b5bdb; }
.nav-links { list-style: none; display: flex; gap: 28px; }
.nav-links a { font-size: 0.95rem; font-weight: 500; color: #444; transition: color 0.2s; }
.nav-links a:hover { color: #3b5bdb; }

/* === HERO === */
.hero { background: linear-gradient(135deg, #3b5bdb 0%, #5c7cfa 60%, #74c0fc 100%); color: #fff; padding: 80px 0 60px; }
.hero-content { text-align: center; }
.hero h1 { font-size: 2.6rem; font-weight: 700; line-height: 1.2; margin-bottom: 16px; }
.highlight { background: rgba(255,255,255,0.25); border-radius: 6px; padding: 0 6px; }
.hero-sub { font-size: 1.1rem; opacity: 0.92; margin-bottom: 36px; }
.hero-search { display: flex; max-width: 560px; margin: 0 auto; gap: 10px; }
.hero-search input { flex: 1; padding: 14px 18px; border-radius: 10px; border: none; font-size: 1rem; outline: none; }
.hero-search button { padding: 14px 26px; background: #1c7ed6; color: #fff; border: none; border-radius: 10px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background 0.2s; white-space: nowrap; }
.hero-search button:hover { background: #1864ab; }

/* === SHARED BLUE HEADER FOR PUBLIC PAGES === */
.site-blue-surface {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 80% 15%, rgba(135, 184, 255, 0.34), transparent 20rem),
    linear-gradient(135deg, #1c347d, #365ed9 60%, #2382bd) !important;
}

.site-blue-surface::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -100px;
  bottom: -170px;
  width: 380px;
  height: 380px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  box-shadow:
    0 0 0 50px rgba(255, 255, 255, 0.04),
    0 0 0 100px rgba(255, 255, 255, 0.025);
  pointer-events: none;
}

.site-blue-surface > * {
  position: relative;
  z-index: 1;
}

.site-blue-surface h1 {
  color: #fff;
}

.site-blue-surface .hero-sub,
.site-blue-surface.ad-order-head p {
  color: rgba(255, 255, 255, 0.87) !important;
}

.site-blue-hero {
  padding: 46px 0 43px;
}

.site-blue-hero-inner {
  display: flex;
  min-height: 104px;
  flex-direction: column;
  justify-content: center;
}

.site-blue-kicker {
  display: inline-flex;
  align-self: flex-start;
  padding: 5px 10px;
  margin-bottom: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-blue-hero h1 {
  max-width: 780px;
  margin: 0;
  color: #fff;
  font-size: clamp(2rem, 5vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.site-blue-subtitle {
  max-width: 760px;
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.87);
  font-size: 1.02rem;
  line-height: 1.65;
}

.hero-cta-wrap { margin-top: 20px; display: flex; justify-content: center; }
.hero-add-btn {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 34px;
  border-radius: 999px;
  background: rgba(255,255,255,0.96);
  color: #2f4ecf;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  box-shadow: 0 14px 32px rgba(22, 46, 130, 0.22);
  border: 1px solid rgba(255,255,255,0.9);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
  animation: heroCtaPulse 2.8s ease-in-out infinite;
}
.hero-add-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -90%;
  width: 55%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(59,91,219,0.18), transparent);
  transform: skewX(-18deg);
  animation: heroCtaShine 3.2s ease-in-out infinite;
}
.hero-add-btn span {
  position: relative;
  z-index: 1;
}
.hero-add-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(22, 46, 130, 0.30);
  background: #fff;
  animation-play-state: paused;
}
.hero-add-btn:active { transform: translateY(0); }
.dark .hero-add-btn { background: rgba(30,30,48,0.96)!important; color: #9db5ff!important; border-color: rgba(255,255,255,0.08)!important; }

@keyframes heroCtaPulse {
  0%, 100% { box-shadow: 0 14px 32px rgba(22, 46, 130, 0.22); }
  50% { box-shadow: 0 18px 42px rgba(22, 46, 130, 0.34); }
}

@keyframes heroCtaShine {
  0% { left: -90%; }
  45%, 100% { left: 135%; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-add-btn,
  .hero-add-btn::before {
    animation: none;
  }
}


/* === HOW IT WORKS === */
.how-it-works { padding: 56px 0; border-bottom: 1px solid #e8eaf0; }
.how-head { text-align: center; max-width: 720px; margin: 0 auto 30px; }
.eyebrow { display: inline-flex; align-items: center; justify-content: center; padding: 6px 12px; border-radius: 999px; background: #dbe4ff; color: #3b5bdb; font-size: 0.82rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 12px; }
.how-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.how-card { position: relative; overflow: hidden; background: rgba(255,255,255,0.92); border: 1px solid #dfe6ff; border-radius: 18px; padding: 24px 22px; box-shadow: 0 12px 28px rgba(59,91,219,0.08); transition: transform 0.18s ease, box-shadow 0.18s ease; }
.how-card::after { content: ''; position: absolute; right: -34px; top: -34px; width: 90px; height: 90px; border-radius: 50%; background: linear-gradient(135deg, rgba(59,91,219,0.14), rgba(116,192,252,0.08)); }
.how-card:hover { transform: translateY(-3px); box-shadow: 0 18px 34px rgba(59,91,219,0.14); }
.how-icon { width: 42px; height: 42px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; background: linear-gradient(135deg, #3b5bdb, #1c7ed6); color: #fff; font-weight: 900; box-shadow: 0 10px 24px rgba(59,91,219,0.24); }
.how-card h3 { position: relative; z-index: 1; font-size: 1.05rem; font-weight: 800; margin-bottom: 8px; color: #1a1a2e; }
.how-card p { position: relative; z-index: 1; color: #555; font-size: 0.94rem; }

/* Kolejne pojawianie się kart; animacja tekstu pozostaje bez zmian. */
.how-grid.is-card-sequence-ready .how-card {
  opacity: 0;
  visibility: hidden;
  transform: translateY(26px) scale(0.965);
  filter: blur(5px);
  pointer-events: none;
  transition:
    opacity 0.42s ease,
    visibility 0s linear 0.42s,
    transform 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.42s ease,
    box-shadow 0.18s ease;
}
.how-grid.is-card-sequence-ready .how-card.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  filter: blur(0);
  pointer-events: auto;
  transition-delay: 0s;
}

.how-grid.is-card-sequence-ready .how-card.is-visible:hover {
  transform: translateY(-3px) scale(1);
}

/* Efekt pisania tekstu w kartach „Jak to działa?” */
.how-card [data-typewriter] { position: relative; }
.how-card [data-typewriter].is-typing::after {
  content: '';
  display: inline-block;
  width: 2px;
  height: 1em;
  margin-left: 3px;
  vertical-align: -0.12em;
  border-radius: 2px;
  background: currentColor;
  animation: typewriter-caret 0.75s steps(1, end) infinite;
}
@keyframes typewriter-caret {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .how-card [data-typewriter].is-typing::after { animation: none; }
  .how-grid.is-card-sequence-ready .how-card {
    opacity: 1;
    visibility: visible;
    transform: none;
    filter: none;
    pointer-events: auto;
    transition: none;
  }
}
.how-action { margin-top: 26px; display: flex; justify-content: center; }
.how-btn { display: inline-flex; align-items: center; justify-content: center; padding: 13px 26px; border-radius: 999px; background: #3b5bdb; color: #fff; font-weight: 800; box-shadow: 0 14px 30px rgba(59,91,219,0.22); transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease; }
.how-btn:hover { transform: translateY(-2px); background: #2f4ac2; box-shadow: 0 18px 36px rgba(59,91,219,0.30); }
.dark .how-it-works { background: #14142a!important; border-color: #333!important; }
.dark .eyebrow { background: #2a2a40!important; color: #9db5ff!important; }
.dark .how-card { background: #1e1e30!important; border-color: #333!important; color: #e0e0e0!important; }
.dark .how-card h3 { color: #fff!important; }
.dark .how-card p { color: #ccc!important; }
.dark .how-btn { background: #4361ee!important; color: #fff!important; }

@media (max-width: 760px) {
  .how-it-works { padding: 44px 0; }
  .how-grid { grid-template-columns: 1fr; gap: 14px; }
  .how-card { padding: 20px; }
  .how-head { margin-bottom: 22px; }
  .how-action { margin-top: 20px; }
  .how-btn { width: 100%; max-width: 330px; padding: 13px 18px; }
}

/* === STATS BAR === */
.stats-bar { background: #fff; border-bottom: 1px solid #e8eaf0; padding: 22px 0; }
.stats-inner { display: flex; justify-content: center; gap: 60px; }
.stat { display: flex; flex-direction: column; align-items: center; }
.stat-num { font-size: 2rem; font-weight: 700; color: #3b5bdb; }
.stat-label { font-size: 0.85rem; color: #888; text-transform: uppercase; letter-spacing: 0.05em; }

/* === SECTIONS === */
.section { padding: 64px 0; }
.section-alt { background: #eef2ff; }
.section-title { font-size: 1.8rem; font-weight: 700; margin-bottom: 8px; }
.section-sub { color: #666; margin-bottom: 32px; }

/* === REVIEW GRID === */
.review-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; margin-top: 28px; }
.review-card { background: #fff; border-radius: 14px; padding: 24px; box-shadow: 0 2px 12px rgba(0,0,0,0.07); border: 1px solid #e8eaf0; transition: transform 0.2s, box-shadow 0.2s; }
.review-card:hover { transform: translateY(-3px); box-shadow: 0 6px 24px rgba(59,91,219,0.12); }
.card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; }
.card-company { font-size: 1.1rem; font-weight: 700; color: #1a1a2e; }
.card-stars { color: #f59f00; font-size: 1.2rem; letter-spacing: 2px; }
.card-meta { font-size: 0.82rem; color: #999; margin-bottom: 14px; }
.card-meta span { margin-right: 12px; }
.card-section-label { font-size: 0.78rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #888; margin-top: 10px; margin-bottom: 3px; }
.card-text { font-size: 0.92rem; color: #444; }
.badge-poleca { display: inline-block; margin-top: 14px; background: #d3f9d8; color: #2f9e44; padding: 3px 10px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; }
.badge-nie { background: #ffe3e3; color: #c92a2a; }
.empty-state { grid-column: 1/-1; text-align: center; color: #aaa; padding: 60px 0; font-size: 1.1rem; }

/* === FORM === */
.review-form { background: #fff; border-radius: 16px; padding: 36px; box-shadow: 0 2px 16px rgba(0,0,0,0.07); border: 1px solid #e8eaf0; max-width: 780px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-group.full { margin-bottom: 20px; }
.form-group label { font-size: 0.88rem; font-weight: 600; color: #333; }
.form-group input, .form-group textarea, .form-group select { border: 1.5px solid #dee2e6; border-radius: 8px; padding: 10px 14px; font-size: 0.95rem; font-family: inherit; outline: none; transition: border-color 0.2s; resize: vertical; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-color: #3b5bdb; }
.checkbox-group label { flex-direction: row; align-items: center; gap: 10px; cursor: pointer; font-weight: 500; }
.checkbox-group input[type=checkbox] { width: 18px; height: 18px; accent-color: #3b5bdb; cursor: pointer; }
.star-rating { display: flex; gap: 6px; font-size: 1.8rem; cursor: pointer; }
.star { color: #dee2e6; transition: color 0.15s; user-select: none; }
.star.active, .star:hover { color: #f59f00; }
.btn-primary { margin-top: 10px; padding: 14px 36px; background: #3b5bdb; color: #fff; border: none; border-radius: 10px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.btn-primary:hover { background: #2f4ac2; }
.form-msg { margin-top: 16px; font-size: 0.95rem; font-weight: 500; }
.form-msg.success { color: #2f9e44; }
.form-msg.error { color: #c92a2a; }

/* === FAQ === */
.faq-list { max-width: 720px; display: flex; flex-direction: column; gap: 12px; margin-top: 28px; }
.faq-item { background: #fff; border-radius: 10px; border: 1px solid #e8eaf0; overflow: hidden; }
.faq-q { width: 100%; background: none; border: none; padding: 18px 22px; font-size: 1rem; font-weight: 600; text-align: left; cursor: pointer; display: flex; justify-content: space-between; align-items: center; color: #1a1a2e; }
.faq-q span { font-size: 1.3rem; color: #3b5bdb; transition: transform 0.2s; }
.faq-a { display: none; padding: 0 22px 18px; font-size: 0.93rem; color: #555; }
.faq-item.open .faq-a { display: block; }
.faq-item.open .faq-q span { transform: rotate(45deg); }

/* === FOOTER === */
.footer { background: #1a1a2e; color: #aaa; padding: 28px 0; }
.footer-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.footer-links { display: flex; gap: 20px; }
.footer-links a { color: #aaa; font-size: 0.9rem; transition: color 0.2s; }
.footer-links a:hover { color: #fff; }

/* === RESPONSIVE === */
@media (max-width: 680px) {
  .hero h1 { font-size: 1.8rem; }
  .hero-search { flex-direction: column; }
  .site-blue-hero { padding: 34px 0 32px; }
  .site-blue-hero-inner { min-height: 88px; }
  .site-blue-hero h1 { font-size: 1.85rem; }
  .site-blue-subtitle { font-size: 0.95rem; }
  .site-blue-surface::after {
    right: -150px;
    bottom: -205px;
  }
  .form-row { grid-template-columns: 1fr; }
  .stats-inner { gap: 30px; }
  .footer-inner { flex-direction: column; text-align: center; }
}

.alert-success { background: #d3f9d8; color: #2f9e44; text-align: center; padding: 14px; font-weight: 600; font-size: 1rem; }
.clear-search { display: inline-block; margin-bottom: 16px; color: #3b5bdb; font-size: 0.9rem; }
.form-msg.error { color: #c92a2a; margin-top: 8px; }


/* === MOBILE NAV FIX: one-line header on phones === */
.logo { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.logo img { flex: 0 0 auto; }
#theme-toggle { flex-shrink: 0; }

@media (max-width: 680px) {
  .navbar { position: sticky; top: 0; z-index: 100; }

  .container { padding-left: 10px; padding-right: 10px; }

  .nav-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    height: 58px !important;
    min-height: 58px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  /* On small screens keep only the mask icon in the logo so everything fits on one line */
  .logo {
    flex: 0 0 auto !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    font-size: 0 !important;
    line-height: 1 !important;
    gap: 0 !important;
    overflow: hidden !important;
  }

  .logo img {
    height: 30px !important;
    width: 34px !important;
    max-width: 34px !important;
    object-fit: contain !important;
    margin: 0 !important;
  }

  .nav-links {
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    list-style: none !important;
  }

  .nav-links a {
    font-size: 0.78rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  #theme-toggle {
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 26px !important;
    min-width: 46px !important;
    margin-left: 0 !important;
    justify-self: auto !important;
    border-radius: 999px !important;
  }

  #theme-toggle::before {
    top: 3px !important;
    left: 3px !important;
    width: 20px !important;
    height: 20px !important;
  }

  body.dark #theme-toggle::before,
  .dark #theme-toggle::before {
    transform: translateX(20px) !important;
  }

  #theme-toggle .t-sun,
  #theme-toggle .t-moon {
    font-size: 11px !important;
  }

  #theme-toggle .t-sun { left: 6px !important; }
  #theme-toggle .t-moon { right: 6px !important; }

  .hero { padding: 50px 0 44px; }
  .hero h1 { font-size: 1.75rem; }
  .hero-sub { font-size: 1rem; }
  .stats-inner { gap: 28px; flex-wrap: nowrap; }
  .review-grid { grid-template-columns: 1fr; }
  .review-card { padding: 18px; }
}

@media (max-width: 360px) {
  .container { padding-left: 8px; padding-right: 8px; }
  .nav-inner { gap: 6px !important; }
  .logo { width: 30px !important; min-width: 30px !important; max-width: 30px !important; }
  .logo img { width: 30px !important; height: 27px !important; }
  .nav-links { gap: 5px !important; }
  .nav-links a { font-size: 0.72rem !important; }
  #theme-toggle { flex-basis: 42px !important; width: 42px !important; min-width: 42px !important; height: 24px !important; }
  #theme-toggle::before { width: 18px !important; height: 18px !important; }
  body.dark #theme-toggle::before,
  .dark #theme-toggle::before { transform: translateX(18px) !important; }
}


@media (max-width: 330px) {
  .container { padding-left: 6px; padding-right: 6px; }
  .nav-inner { gap: 4px !important; }
  .logo { width: 26px !important; min-width: 26px !important; max-width: 26px !important; }
  .logo img { width: 26px !important; height: 24px !important; }
  .nav-links { gap: 4px !important; }
  .nav-links a { font-size: 0.68rem !important; }
  #theme-toggle { flex-basis: 38px !important; width: 38px !important; min-width: 38px !important; height: 22px !important; }
  #theme-toggle::before { width: 16px !important; height: 16px !important; }
  body.dark #theme-toggle::before,
  .dark #theme-toggle::before { transform: translateX(16px) !important; }
}


@media (max-width: 680px) {
  .hero-cta-wrap { margin-top: 16px; }
  .hero-add-btn { width: 100%; max-width: 330px; padding: 13px 18px; font-size: 0.96rem; border-radius: 14px; }
}

/* === JEDNORAZOWE OKNO NOWEGO SERWISU === */
.new-site-popup-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1199;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(18, 25, 50, 0.38);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.26s ease, visibility 0.26s ease;
}
.new-site-popup-backdrop.is-visible {
  opacity: 1;
  visibility: visible;
}
.new-site-popup {
  position: relative;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 15px;
  width: min(470px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 22px;
  border: 1px solid rgba(59, 91, 219, 0.18);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.99);
  color: #1a1a2e;
  box-shadow: 0 30px 90px rgba(14, 28, 78, 0.34);
  opacity: 0;
  transform: translateY(18px) scale(0.95);
  transition: opacity 0.26s ease, transform 0.26s ease;
}
.new-site-popup-backdrop.is-visible .new-site-popup {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.new-site-popup-close {
  position: absolute;
  top: 9px;
  right: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #777f96;
  font: 400 27px/1 Arial, sans-serif;
  cursor: pointer;
  transition: background 0.16s ease, color 0.16s ease;
}
.new-site-popup-close:hover,
.new-site-popup-close:focus-visible {
  background: #eef2ff;
  color: #2f4ecf;
  outline: none;
}
.new-site-popup-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-top: 2px;
  border-radius: 17px;
  background: linear-gradient(135deg, #e7edff, #d9f0ff);
  font-size: 1.55rem;
}
.new-site-popup-heart {
  display: inline-block;
  transform-origin: center;
  animation: new-site-heartbeat 1.35s ease-in-out infinite;
  will-change: transform;
}
@keyframes new-site-heartbeat {
  0%, 100% { transform: scale(1); }
  12% { transform: scale(1.2); }
  24% { transform: scale(1); }
  36% { transform: scale(1.12); }
  50% { transform: scale(1); }
}
.new-site-popup-content { min-width: 0; padding-right: 20px; }
.new-site-popup-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #3b5bdb;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}
.new-site-popup h2 {
  margin: 0 0 7px;
  color: #17172b;
  font-size: 1.16rem;
  line-height: 1.28;
}
.new-site-popup p {
  margin: 0;
  color: #596174;
  font-size: 0.91rem;
  line-height: 1.55;
}
.new-site-popup-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 15px;
}
.new-site-popup-primary,
.new-site-popup-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 15px;
  border-radius: 11px;
  font-size: 0.86rem;
  font-weight: 800;
  cursor: pointer;
}
.new-site-popup-primary {
  border: 1px solid #3b5bdb;
  background: #3b5bdb;
  color: #fff;
  box-shadow: 0 9px 22px rgba(59, 91, 219, 0.21);
}
.new-site-popup-primary:hover { background: #2f4ac2; }
.new-site-popup-secondary {
  border: 1px solid #d9deec;
  background: #fff;
  color: #596174;
}
.new-site-popup-secondary:hover { background: #f5f7fc; color: #30384a; }
.dark .new-site-popup-backdrop { background: rgba(3, 4, 12, 0.58) !important; }
.dark .new-site-popup {
  border-color: rgba(157, 181, 255, 0.2) !important;
  background: rgba(30, 30, 48, 0.99) !important;
  color: #f1f3ff !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.58) !important;
}
.dark .new-site-popup h2 { color: #fff !important; }
.dark .new-site-popup p { color: #c7cada !important; }
.dark .new-site-popup-icon { background: #2a2a40 !important; }
.dark .new-site-popup-close { color: #aeb4ca !important; }
.dark .new-site-popup-close:hover,
.dark .new-site-popup-close:focus-visible { background: #2a2a40 !important; color: #fff !important; }
.dark .new-site-popup-secondary { border-color: #414158 !important; background: #25253a !important; color: #d7d9e5 !important; }
@media (max-width: 560px) {
  .new-site-popup-backdrop { padding: 12px; }
  .new-site-popup {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 11px;
    width: 100%;
    max-height: calc(100vh - 24px);
    padding: 18px 16px;
    border-radius: 18px;
  }
  .new-site-popup-icon { width: 42px; height: 42px; border-radius: 13px; font-size: 1.25rem; }
  .new-site-popup-content { padding-right: 13px; }
  .new-site-popup h2 { font-size: 1.02rem; }
  .new-site-popup p { font-size: 0.84rem; }
  .new-site-popup-actions { align-items: stretch; }
  .new-site-popup-primary { flex: 1 1 100%; }
  .new-site-popup-secondary { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .new-site-popup-backdrop,
  .new-site-popup { transition: none; }
  .new-site-popup-heart { animation: none; }
}



/* === INDEX PAGE CACHED STYLES === */
    html{scrollbar-gutter:stable;scroll-behavior:smooth;}
    /* Базовый фон для предотвращения вспышки */
    html { background: #fff; }
    html.dark { background: #0f0f1a; }

    #theme-toggle{position:relative;z-index:2;flex:0 0 auto;width:60px;height:30px;border-radius:20px;border:none;cursor:pointer;background:#e2e8f0;box-shadow:0 2px 8px rgba(0,0,0,0.15);transition:background 0.3s;padding:0;overflow:hidden;}
    #theme-toggle::before{content:'';position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,0.2);transition:transform 0.3s cubic-bezier(.4,0,.2,1);}
    #theme-toggle .t-sun{position:absolute;top:50%;left:7px;transform:translateY(-50%);font-size:13px;opacity:0;transition:opacity 0.2s;pointer-events:none;}
    #theme-toggle .t-moon{position:absolute;top:50%;right:7px;transform:translateY(-50%);font-size:13px;opacity:1;transition:opacity 0.2s;pointer-events:none;}
    #theme-toggle:hover{box-shadow:0 2px 12px rgba(67,97,238,0.35);}
    
    .dark #theme-toggle{background:#3451d1;}
    .dark #theme-toggle::before{transform:translateX(30px);}
    .dark #theme-toggle .t-sun{opacity:1;}
    .dark #theme-toggle .t-moon{opacity:0;}
    .dark body{background:#0f0f1a!important;color:#e0e0e0!important;}
    .dark .navbar{background:#1a1a2e!important;}
    .dark .hero{background:#12122a!important;}
    .dark .stats-bar{background:#1a1a2e!important;}
    .dark .section{background:#0f0f1a!important;}
    .dark .section-alt{background:#14142a!important;}
    .dark .review-card{background:#1e1e30!important;border-color:#333!important;color:#e0e0e0!important;}
    .dark .review-form{background:#1e1e30!important;}
    .dark input,.dark textarea,.dark select{background:#2a2a40!important;color:#e0e0e0!important;border-color:#444!important;}
    .dark h1,.dark h2,.dark h3,.dark .section-title,.dark .card-company{color:#fff!important;}
    .dark .card-meta,.dark .card-text,.dark .card-section-label{color:#ccc!important;}
    .dark .hero-sub,.dark .section-sub{color:#bbb!important;}
    .dark .stat-num{color:#7b9cff!important;}
    .dark .stat-label{color:#aaa!important;}
    .dark .faq-q{background:#1e1e30!important;color:#e0e0e0!important;border-color:#333!important;}
    .dark .faq-a{background:#16162a!important;color:#ccc!important;}
    .dark .footer{background:#0a0a18!important;color:#888!important;}
    .dark .footer a{color:#7b9cff!important;}
    .dark .logo{color:#fff!important;}
    .dark .nav-links a{color:#ccc!important;}
    .dark label{color:#ccc!important;}
    .dark .alert-success{background:#1a3a1a!important;color:#6fcf6f!important;}
    .dark .hero-search input{background:#2a2a40!important;color:#fff!important;border-color:#555!important;}
    .dark .empty-state{color:#aaa!important;}
    .dark .clear-search{color:#7b9cff!important;}
    .dark .sort-select{background:#2a2a40!important;color:#e0e0e0!important;border-color:#444!important;}
    .dark .review-info-item{background:#26263a!important;border-color:#3b3b52!important;}
    .dark .review-info-label{color:#9ea8c7!important;}
    .dark .review-info-value{color:#e0e0e0!important;}
    .dark .review-rating-label{color:#9ea8c7!important;}

    .review-card-header-main{min-width:0;}
    .review-field-label,.review-rating-label{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#8a8fa3;margin-bottom:3px;}
    .review-rating{text-align:right;flex:0 0 auto;}
    .review-card-modern{padding:18px;overflow:hidden;}
    .review-card-modern .card-header{margin-bottom:0;gap:14px;align-items:flex-start;}
    .review-date-line{display:flex;align-items:center;gap:5px;margin-top:5px;color:#8a8fa3;font-size:11px;line-height:1.35;}

    .review-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;margin:13px 0 11px;padding:11px 12px;border:1px solid #e8eaf0;border-radius:10px;background:#fafbfe;}
    .review-meta-item{min-width:0;display:flex;flex-direction:column;gap:2px;}
    .review-meta-item-wide{grid-column:1/-1;}
    .review-meta-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.045em;color:#8a8fa3;line-height:1.25;}
    .review-meta-value{color:#2a2f3a;font-size:13px;font-weight:600;line-height:1.35;overflow-wrap:anywhere;}
    .review-meta-link{display:inline-flex;align-items:center;gap:4px;color:#344fc5;text-decoration:none;text-underline-offset:2px;}
    .review-meta-link:hover{text-decoration:underline;color:#243ca7;}
    .review-meta-link::after{content:'\2197';font-size:10px;opacity:.65;}

    .review-story{margin-top:2px;border-top:1px solid #eceef3;border-bottom:1px solid #eceef3;}
    .review-story summary{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-height:48px;padding:9px 0;cursor:pointer;list-style:none;}
    .review-story summary::-webkit-details-marker{display:none;}
    .review-story summary::marker{display:none;}
    .review-preview-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#25864c;}
    .review-preview-text{min-width:0;color:#414754;font-size:13px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
    .review-open-label{white-space:nowrap;color:#4361ee;font-size:12px;font-weight:700;}
    .review-open-label::after{content:'Pokaż całą opinię';}
    .review-story[open] .review-open-label::after{content:'Zwiń opinię';}
    .review-story[open] .review-preview-text{display:none;}
    .review-story[open] summary{grid-template-columns:auto 1fr auto;padding-bottom:7px;}

    .review-content{display:grid;gap:9px;padding:2px 0 12px;}
    .review-section{padding:2px 0 2px 12px;border-left:3px solid #dfe4ea;}
    .review-section-title{font-size:12px;font-weight:700;color:#343947;margin:0 0 3px;}
    .review-section-title span{display:inline-block;width:17px;text-align:center;margin-left:-4px;}
    .review-section .card-text{margin:0;color:#414754;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;}
    .review-section-positive{border-color:#53bd7b;}
    .review-section-positive .review-section-title{color:#23864b;}
    .review-section-negative{border-color:#ed7084;}
    .review-section-negative .review-section-title{color:#c73d56;}
    .review-section-advice{border-color:#e4b442;}
    .review-section-advice .review-section-title{color:#8d6600;}

    .review-bottom-row{display:flex;align-items:center;justify-content:space-between;gap:9px 14px;flex-wrap:wrap;margin-top:11px;}
    .recommendation-block{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0;padding:0;border:0;}
    .recommendation-block .card-section-label{margin:0;color:#666d7c;font-size:12px;font-weight:600;}
    .recommendation-block .badge-poleca{margin:0;padding:5px 9px;line-height:1.25;font-size:12px;}
    .badge-brak{background:#eef0f4!important;color:#707789!important;}
    .review-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0;}
    .review-actions .share-btn{margin:0;min-height:32px;padding:5px 10px;display:inline-flex;align-items:center;}
    .review-actions .employer-toggle{margin:0;min-height:32px;display:inline-flex;align-items:center;padding:5px 10px;border:1px solid #d9def8;border-radius:8px;background:#fff;color:#4361ee;text-decoration:none;font-size:11.5px;}
    .review-actions .employer-toggle:hover{background:#f3f5ff;text-decoration:none;}

    .dark .review-date-line{color:#9ea8c7!important;}
    .dark .review-meta-grid{background:#25253a!important;border-color:#3b3b52!important;}
    .dark .review-meta-label{color:#9ea8c7!important;}
    .dark .review-meta-value{color:#e3e6ef!important;}
    .dark .review-meta-link{color:#8fa3ff!important;}
    .dark .review-story{border-color:#39394f!important;}
    .dark .review-preview-text,.dark .review-section .card-text{color:#dfe2eb!important;}
    .dark .review-section-title{color:#dfe2eb!important;}
    .dark .recommendation-block .card-section-label{color:#aeb5c9!important;}
    .dark .review-actions .employer-toggle{background:#2a2a40!important;border-color:#444a68!important;color:#8fa6ff!important;}

    @media(max-width:520px){
      .review-card-modern{padding:15px;}
      .review-card-modern .card-header{gap:10px;}
      .review-meta-grid{gap:8px 10px;padding:10px;margin:11px 0 9px;}
      .review-meta-value{font-size:12px;}
      .review-story summary{grid-template-columns:auto minmax(0,1fr);gap:6px;}
      .review-open-label{grid-column:1/-1;justify-self:start;margin-top:-2px;}
      .review-story[open] summary{grid-template-columns:1fr auto;}
      .review-story[open] .review-open-label{grid-column:auto;margin-top:0;}
      .review-preview-text{-webkit-line-clamp:2;font-size:12px;}
      .review-section .card-text{font-size:13px;}
      .review-bottom-row{align-items:flex-start;}
    }
    
    .pagination{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:32px;}
    .page-btn{padding:8px 14px;border-radius:8px;background:#fff;border:1px solid #ddd;color:#333;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.15s;}
    .page-btn:hover{background:#4361ee;color:#fff;border-color:#4361ee;}
    .page-btn.active{background:#4361ee;color:#fff;border-color:#4361ee;font-weight:700;}
    .dark .page-btn{background:#1e1e30!important;color:#ccc!important;border-color:#444!important;}
    .dark .page-btn.active,.page-btn:hover{background:#4361ee!important;color:#fff!important;}
    
    .share-btn{margin-top:10px;padding:6px 14px;background:#f0f4ff;border:1px solid #c7d2fe;color:#4361ee;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;}
    .share-btn:hover{background:#4361ee;color:#fff;}
    .dark .share-btn{background:#2a2a40!important;border-color:#444!important;color:#7b9cff!important;}
    
    .card-company-link{text-decoration:none;color:inherit;display:inline-flex;align-items:center;gap:5px;position:relative;}
    .card-company-link:hover{color:#4361ee;}
    .card-company-link .cc-arrow{font-size:11px;opacity:0;transform:translateX(-4px);transition:opacity 0.2s,transform 0.2s;color:#4361ee;}
    .card-company-link:hover .cc-arrow{opacity:1;transform:translateX(0);}
    .card-company-link::after{content:'Kliknij, aby zobaczyć wszystkie opinie i rating firmy';position:absolute;bottom:calc(100% + 6px);left:0;background:#1a1a2e;color:#fff;font-size:12px;font-weight:400;white-space:nowrap;padding:5px 10px;border-radius:6px;pointer-events:none;opacity:0;transition:opacity 0.2s;z-index:10;box-shadow:0 2px 8px rgba(0,0,0,0.2);}
    .card-company-link:hover::after{opacity:1;}
    .dark .card-company-link::after{background:#4361ee;}

    .empty-example-label{font-size:13px;color:#999;margin-top:18px;margin-bottom:8px;font-style:italic;}
    .dark .empty-example-label{color:#666!important;}
    .example-card{opacity:0.6;pointer-events:none;position:relative;}
    .example-card::after{content:'Przykład';position:absolute;top:12px;right:12px;background:#4361ee22;color:#4361ee;font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;letter-spacing:0.5px;}

    .ad-top, .ad-bottom {
      width: 100%;
      text-align: center;
      background: #f9f9f9;
      padding: 8px 0;
      border-bottom: 1px solid #eee;
      overflow: hidden;
    }
    .ad-bottom {
      border-top: 1px solid #eee;
      border-bottom: none;
      margin-top: 20px;
    }
    .ad-sidebar {
      position: fixed;
      top: 50%;
      transform: translateY(-50%);
      width: 330px;
      text-align: center;
      z-index: 100;
    }
    .ad-left { left: 10px; }
    .ad-right { right: 10px; }
    @media(max-width:1800px) { .ad-sidebar { display: none; } }

    .sort-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
    .sort-bar .section-title { margin-bottom: 0; }
    .sort-select { padding: 7px 14px; border-radius: 8px; border: 1px solid #ddd; font-size: 14px; cursor: pointer; background: #fff; color: #333; font-family: inherit; }
    .sort-select:focus { outline: none; border-color: #4361ee; }
    .employer-toggle { margin-top: 12px; font-size: 13px; color: #4361ee; cursor: pointer; user-select: none; font-weight: 600; }
    .employer-toggle:hover { text-decoration: underline; }
    .employer-form { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
    .employer-form textarea { padding: 10px; border-radius: 8px; border: 1px solid #ddd; font-size: 14px; font-family: inherit; resize: vertical; }
    .employer-form input[type=email] { padding: 9px 12px; border-radius: 8px; border: 1px solid #ddd; font-size: 14px; font-family: inherit; }
    .employer-form button { padding: 9px 18px; background: #4361ee; color: #fff; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 14px; align-self: flex-start; }
    .employer-form button:hover { background: #3451d1; }
    .employer-reply { margin-top: 12px; background: #f0f7ff; border-left: 3px solid #4361ee; padding: 10px 14px; border-radius: 0 8px 8px 0; }
    .employer-reply-label { font-size: 16px; font-weight: 700; color: #4361ee; margin-bottom: 4px; }
    .employer-reply-text { font-size: 16px; color: #333; }
    
    .dark .employer-reply { background: #1a2a3a!important; border-color: #7b9cff!important; }
    .dark .employer-reply-text { color: #ccc!important; }
    .dark .employer-form textarea, .dark .employer-form input { background: #2a2a40!important; color: #e0e0e0!important; border-color: #444!important; }
    
    .modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 9999; align-items: center; justify-content: center; }
    .modal-overlay.show { display: flex; }
    .modal-box { background: #fff; border-radius: 16px; padding: 32px; max-width: 440px; width: 90%; text-align: center; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2); }
    .modal-box h3 { font-size: 20px; margin-bottom: 10px; color: #1a1a2e; }
    .modal-code { font-size: 32px; font-weight: 800; letter-spacing: 6px; color: #4361ee; background: #f0f4ff; padding: 14px 24px; border-radius: 10px; margin: 16px 0; font-family: monospace; }
    .modal-box p { font-size: 14px; color: #666; margin-bottom: 6px; }
    .modal-box .modal-email { font-weight: 700; color: #1a1a2e; }
    .modal-close { margin-top: 20px; padding: 10px 28px; background: #4361ee; color: #fff; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 15px; }
    
    .dark .modal-box { background: #1e1e30!important; color: #e0e0e0!important; }
    .dark .modal-box h3 { color: #fff!important; }
    .dark .modal-code { background: #2a2a40!important; }
  
    .hero-cta-wrap{gap:12px;flex-wrap:wrap;}
    .hero-reviews-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:15px 30px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.68);
      background:rgba(255,255,255,.13);
      color:#fff;
      font-size:1rem;
      font-weight:800;
      letter-spacing:-.01em;
      backdrop-filter:blur(5px);
      box-shadow:0 12px 28px rgba(22,46,130,.16);
      transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
    }
    .hero-reviews-btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.22);box-shadow:0 17px 34px rgba(22,46,130,.24);}
    .hero-reviews-btn:active{transform:translateY(0);}
    .dark .hero-reviews-btn{background:rgba(30,30,48,.64)!important;border-color:rgba(255,255,255,.18)!important;color:#dce4ff!important;}
    @media(max-width:680px){
      .hero-reviews-btn{width:100%;max-width:330px;padding:13px 18px;font-size:.96rem;border-radius:14px;}
    }


/* === PERFORMANCE & ACCESSIBILITY === */
.how-it-works, #opinie { content-visibility: auto; contain-intrinsic-size: 720px; }
.review-card { content-visibility: auto; contain-intrinsic-size: 430px; }
.employer-toggle { font-family: inherit; line-height: inherit; cursor: pointer; }
.employer-form[hidden] { display: none !important; }
.visually-hidden {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;
}
.employer-rodo{display:flex;align-items:flex-start;gap:8px;font-size:12px;margin:4px 0}
.employer-rodo input{width:auto!important;margin:3px 0 0;cursor:pointer}
.employer-rodo label{cursor:pointer}.employer-rodo a{color:inherit;text-decoration:underline}

/* === KONKURS === */
.contest-banner{padding:28px 0;background:linear-gradient(135deg,#eef3ff 0%,#fff 55%,#fff5e8 100%);border-bottom:1px solid #dfe6ff}
.contest-banner-card{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:#fff;border:1px solid #dfe6ff;border-radius:20px;padding:24px 28px;box-shadow:0 12px 34px rgba(55,81,190,.11)}
.contest-kicker{display:inline-flex;align-items:center;gap:7px;color:#4361ee;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.contest-banner h2{font-size:25px;line-height:1.2;color:#17172c;margin:0 0 8px}
.contest-banner p{color:#5f6477;line-height:1.55;margin:0 0 15px;max-width:760px}
.contest-progress-row{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.contest-progress{height:12px;flex:1;min-width:220px;max-width:520px;background:#e9edfb;border-radius:999px;overflow:hidden}
.contest-progress>span{display:block;height:100%;background:linear-gradient(90deg,#4361ee,#7c5cff);border-radius:inherit}
.contest-progress-label{font-weight:800;color:#252a47;font-size:14px;white-space:nowrap}
.contest-banner-actions{display:flex;flex-direction:column;gap:10px;min-width:210px}
.contest-banner-actions a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:12px;padding:12px 17px;font-weight:800;font-size:14px}
.contest-banner-actions .contest-primary{background:#4361ee;color:#fff;box-shadow:0 8px 18px rgba(67,97,238,.22)}
.contest-banner-actions .contest-secondary{border:1px solid #cad4ff;color:#4361ee;background:#f8faff}
.contest-form-box{border:1px solid #cad5ff;background:#f7f9ff;border-radius:16px;padding:20px;margin:12px 0 20px}
.contest-form-box h3{margin:0 0 6px;color:#1d2549;font-size:19px}
.contest-form-box .contest-form-intro{color:#68708b;font-size:14px;line-height:1.5;margin-bottom:14px}
.contest-form-fields{display:none;margin-top:15px;padding-top:15px;border-top:1px solid #dfe5ff}
.contest-form-box.is-open .contest-form-fields{display:block}
.contest-form-check{display:flex!important;align-items:flex-start;gap:9px;margin:10px 0!important;line-height:1.45}
.contest-form-check input{width:auto!important;margin-top:3px!important;flex:0 0 auto}
.contest-form-note{font-size:12px;color:#737b94;margin-top:8px}
body.dark .contest-banner{background:linear-gradient(135deg,#171a34,#121222)!important;border-color:#2d335f!important}
body.dark .contest-banner-card,body.dark .contest-form-box{background:#1e1e30!important;border-color:#343b69!important}
body.dark .contest-banner h2,body.dark .contest-progress-label,body.dark .contest-form-box h3{color:#fff!important}
body.dark .contest-banner p,body.dark .contest-form-intro,body.dark .contest-form-note{color:#b8bfd7!important}
body.dark .contest-progress{background:#303650!important}
body.dark .contest-banner-actions .contest-secondary{background:#252a45!important;border-color:#414c83!important;color:#9eb1ff!important}
@media(max-width:760px){.contest-banner-card{grid-template-columns:1fr;padding:21px}.contest-banner-actions{min-width:0;flex-direction:row;flex-wrap:wrap}.contest-banner-actions a{flex:1;min-width:150px}.contest-banner h2{font-size:22px}.contest-progress{min-width:160px}}

/* Stałe głosy pomocności opinii */
.helpful-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid #d9ddea;background:#fff;color:#3d465f;border-radius:10px;padding:9px 12px;font-weight:700;cursor:pointer;transition:.18s ease}
.helpful-btn:hover{border-color:#4361ee;color:#314fc4;transform:translateY(-1px)}
.helpful-btn.helpful-voted,.helpful-btn:disabled{background:#eefaf2;border-color:#9bd5ae;color:#24713c;cursor:default;transform:none}
.helpful-count{display:inline-flex;min-width:24px;height:22px;padding:0 6px;align-items:center;justify-content:center;border-radius:999px;background:#eef1f8;color:#3d465f;font-size:12px}
.helpful-voted .helpful-count{background:#d9f1e1;color:#24713c}
.dark .helpful-btn{background:#25253a;border-color:#3b3b52;color:#dce2ff}.dark .helpful-btn.helpful-voted{background:#183426;border-color:#2f6b48;color:#a9e7bd}
@media(max-width:640px){.review-actions{width:100%;display:flex;gap:8px;flex-wrap:wrap}.helpful-btn{flex:1 1 100%;justify-content:center}}
.helpful-label{display:inline-flex;align-items:center;gap:5px}

/* === REKLAMY: wspólny, responsywny system === */
.ad-slot{box-sizing:border-box;position:relative;text-align:center;color:#6b7280;font-size:12px;line-height:1.35;overflow:hidden;transition:opacity .2s ease,max-height .25s ease,padding .25s ease,margin .25s ease}
.ad-slot-top,.ad-slot-bottom{width:100%;min-height:78px;padding:18px 10px 10px;background:#fafbfc;border-color:#e8ebf1;border-style:solid;border-width:0 0 1px}
.ad-slot-bottom{border-width:1px 0 0;margin-top:24px}
.ad-slot-left,.ad-slot-right{position:fixed;top:50%;transform:translateY(-50%);width:316px;max-height:calc(100vh - 24px);padding:22px 8px 8px;background:rgba(250,251,252,.97);border:1px solid #e8ebf1;border-radius:14px;box-shadow:0 8px 30px rgba(23,31,55,.08);z-index:40}
.ad-slot-left{left:12px}.ad-slot-right{right:12px}
.ad-disclosure{position:absolute;top:4px;left:50%;transform:translateX(-50%);font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#9197a6;line-height:1}
.ad-unit{display:flex;align-items:center;justify-content:center;width:100%;max-width:100%;min-width:0;margin:0 auto}
.ad-unit iframe,.ad-unit ins,.ad-unit object,.ad-unit embed{max-width:100%!important}
.ad-unit img{display:block;max-width:100%;height:auto;margin:0 auto}
.ad-banner-link{display:inline-flex;align-items:center;justify-content:center;max-width:100%;border-radius:10px;overflow:hidden;outline-offset:3px}
.ad-banner-link:focus-visible{outline:3px solid #4361ee}
.ad-video-link{display:flex;width:100%;height:100%;max-width:100%;align-items:center;justify-content:center}
.ad-video-link .ad-media-video{pointer-events:none}
.ad-slot-left .ad-unit-media,.ad-slot-right .ad-unit-media{height:min(600px,calc(100vh - 70px));max-height:600px;flex-direction:column}
.ad-slot-left .ad-video-link,.ad-slot-right .ad-video-link{width:300px;max-width:100%;height:100%}
.ad-slot-left .ad-media-video,.ad-slot-right .ad-media-video{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#000;border-radius:10px}
.ad-slot-top .ad-unit-media,.ad-slot-bottom .ad-unit-media{width:min(970px,100%);height:90px;max-height:90px;flex-direction:column}
.ad-slot-top .ad-video-link,.ad-slot-bottom .ad-video-link{width:100%;height:100%}
.ad-slot-top .ad-media-video,.ad-slot-bottom .ad-media-video{display:block;width:100%;height:100%;object-fit:contain;background:#000;border-radius:10px}
.ad-slot-empty{max-height:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;opacity:0!important;pointer-events:none}
.dark .ad-slot-top,.dark .ad-slot-bottom,.dark .ad-slot-left,.dark .ad-slot-right,body.dark .ad-slot-top,body.dark .ad-slot-bottom,body.dark .ad-slot-left,body.dark .ad-slot-right{background:#171724!important;border-color:#303044!important;color:#a9aec0!important}
@media(max-width:1760px){.ad-slot-left,.ad-slot-right{display:none!important}}
@media(max-width:760px){.ad-slot-top,.ad-slot-bottom{min-height:62px;padding:16px 6px 7px}.ad-disclosure{font-size:8px}.ad-unit{overflow:hidden}}
@media(prefers-reduced-motion:reduce){.ad-slot{transition:none}}

.ad-placeholder[hidden]{display:none!important}
.ad-placeholder{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;margin:0 auto;border:1px dashed #b9c1d1;border-radius:10px;background:repeating-linear-gradient(135deg,#f8f9fc,#f8f9fc 12px,#f1f3f8 12px,#f1f3f8 24px);color:#626b7e;user-select:none}
.ad-placeholder-title{font-size:15px;font-weight:800;letter-spacing:.01em}
.ad-placeholder-size{font-size:11px;font-weight:700;color:#8a92a3;letter-spacing:.06em;text-transform:uppercase}
.ad-placeholder-top,.ad-placeholder-bottom{max-width:970px;height:90px;min-height:90px}
.ad-placeholder-left,.ad-placeholder-right{width:100%;height:min(600px,calc(78vh - 32px));min-height:260px}
.ad-slot-placeholder-only .ad-disclosure,.ad-slot-showing-placeholder .ad-disclosure{color:#7b8496}
.dark .ad-placeholder,body.dark .ad-placeholder{background:repeating-linear-gradient(135deg,#20202e,#20202e 12px,#252536 12px,#252536 24px);border-color:#44465b;color:#d6d8e1}
.dark .ad-placeholder-size,body.dark .ad-placeholder-size{color:#9fa4b5}
@media(max-width:760px){.ad-placeholder-top,.ad-placeholder-bottom{height:72px;min-height:72px}.ad-placeholder-title{font-size:13px}.ad-placeholder-size{font-size:10px}}

/* Reklama wyskakująca */
body.ad-popup-open{overflow:hidden}
.ad-popup[hidden]{display:none!important}
.ad-popup{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:18px;opacity:0;transition:opacity .18s ease}
.ad-popup-visible{opacity:1}
.ad-popup-backdrop{position:absolute;inset:0;background:rgba(7,10,22,.72);backdrop-filter:blur(3px)}
.ad-popup-dialog{position:relative;z-index:1;width:min(760px,calc(100vw - 36px));max-height:calc(100vh - 36px);overflow:auto;border-radius:18px;background:#fff;border:1px solid #e4e7ef;box-shadow:0 26px 80px rgba(0,0,0,.34);padding:46px 18px 18px;outline:none;transform:translateY(10px) scale(.985);transition:transform .18s ease}
.ad-popup-visible .ad-popup-dialog{transform:translateY(0) scale(1)}
.ad-popup-disclosure{position:absolute;top:15px;left:18px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#8e95a4}
.ad-popup-close{position:absolute;top:10px;right:10px;border:1px solid #d9deea;border-radius:999px;background:#f7f8fb;color:#30374b;min-height:34px;padding:7px 12px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;transition:background .15s ease,border-color .15s ease,opacity .15s ease}
.ad-popup-close:not(:disabled):hover{background:#eef1f7;border-color:#c7cedd}
.ad-popup-close:focus-visible{outline:3px solid #4361ee;outline-offset:2px}
.ad-popup-close:disabled{cursor:not-allowed;opacity:.72}
.ad-popup-content{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;max-width:100%;overflow:hidden}
.ad-popup-content img,.ad-popup-content .ad-media-image{display:block;max-width:100%;max-height:68vh;width:auto;height:auto;object-fit:contain;border-radius:12px}
.ad-popup-content video,.ad-popup-content .ad-media-video{display:block;width:100%;max-height:68vh;border-radius:12px;background:#000;object-fit:contain}
.ad-popup-content .ad-video-link{width:100%;height:auto}
.ad-popup-video{pointer-events:none}
.ad-popup-sound-gate[hidden]{display:none!important}
.ad-popup-sound-gate{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:22px;background:rgba(8,11,24,.78);backdrop-filter:blur(3px);border-radius:12px;text-align:center}
.ad-popup-sound-start{display:flex;align-items:center;justify-content:center;gap:10px;max-width:520px;border:0;border-radius:999px;background:#fff;color:#1f2740;padding:13px 20px;font:inherit;font-size:15px;font-weight:900;line-height:1.35;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.28)}
.ad-popup-sound-start:hover{background:#f1f4ff}
.ad-popup-sound-start:focus-visible{outline:4px solid #8ea2ff;outline-offset:3px}
.ad-popup-sound-start:disabled{opacity:.68;cursor:wait}
.ad-popup-sound-icon{font-size:22px;line-height:1}
.ad-popup-sound-note{max-width:500px;color:#f4f5f9;font-size:12px;line-height:1.5;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.ad-popup-sound-failed .ad-popup-sound-start{background:#fff3f3;color:#8b2222}
.ad-media{max-width:100%;height:auto}
.ad-media-cta{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;padding:10px 18px;border-radius:999px;background:#4361ee;color:#fff;text-decoration:none;font-weight:800;font-size:14px}
.ad-media-cta:hover{background:#344fd0}
.dark .ad-popup-dialog,body.dark .ad-popup-dialog{background:#171724;border-color:#303044;color:#f2f3f8}
.dark .ad-popup-close,body.dark .ad-popup-close{background:#232334;border-color:#3a3a50;color:#f4f5fa}
.dark .ad-popup-close:not(:disabled):hover,body.dark .ad-popup-close:not(:disabled):hover{background:#2c2c40}
.dark .ad-popup-disclosure,body.dark .ad-popup-disclosure{color:#a9aec0}
.dark .ad-popup-sound-start,body.dark .ad-popup-sound-start{background:#f3f4f8;color:#171724}
@media(max-width:640px){.ad-popup{padding:10px}.ad-popup-dialog{width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:48px 10px 10px;border-radius:14px}.ad-popup-content img,.ad-popup-content .ad-media-image,.ad-popup-content video,.ad-popup-content .ad-media-video{max-height:72vh}.ad-popup-close{right:8px;top:8px;font-size:11px}.ad-popup-disclosure{left:12px;top:14px}}
@media(prefers-reduced-motion:reduce){.ad-popup,.ad-popup-dialog{transition:none}}

/* Publiczne puste miejsca reklamowe prowadzą do formularza zamówienia. */
a.ad-placeholder{text-decoration:none;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease}
a.ad-placeholder:hover,a.ad-placeholder:focus-visible{border-color:#4361ee;box-shadow:0 8px 24px rgba(67,97,238,.18);transform:translateY(-1px);outline:none;background:repeating-linear-gradient(135deg,#f7f8ff,#f7f8ff 12px,#edf0ff 12px,#edf0ff 24px)}
.ad-placeholder-cta{font-size:11px;font-weight:800;color:#4361ee;text-transform:uppercase;letter-spacing:.05em}
.dark a.ad-placeholder:hover,.dark a.ad-placeholder:focus-visible,body.dark a.ad-placeholder:hover,body.dark a.ad-placeholder:focus-visible{border-color:#7b9cff;background:repeating-linear-gradient(135deg,#22233a,#22233a 12px,#292b48 12px,#292b48 24px);box-shadow:0 8px 24px rgba(74,103,255,.24)}
.dark .ad-placeholder-cta,body.dark .ad-placeholder-cta{color:#9eb2ff}
@media(max-width:760px){.ad-placeholder-cta{font-size:9px}}

/* Keep public blue headers blue in both themes. */
html.dark .site-blue-surface,
body.dark .site-blue-surface,
.dark .site-blue-surface {
  background:
    radial-gradient(circle at 80% 15%, rgba(135, 184, 255, 0.34), transparent 20rem),
    linear-gradient(135deg, #1c347d, #365ed9 60%, #2382bd) !important;
}