/* ============================================================
   Home Page — Light BG + 50% Gray Cards + Light Hero
   ============================================================ */
.page-light { background: #f4f5f7; }

/* --- HERO: very light overlay --- */
/* Hero — compact, photo-first, text horizontal */
.page-light .hero {
  min-height: 0;
  height: auto;
  padding: calc(32px + var(--header-height) + var(--space-2xl)) var(--space-lg) var(--space-3xl);
  display: flex; align-items: center;
  position: relative;
}
.page-light .hero-bg { background: rgba(0,0,0,0.18) !important; }
.page-light .hero-bg-glow { opacity: 0.02; }
.page-light .hero-pattern { opacity: 0; }
.page-light .hero-bg-img { object-position: 65% center; filter: saturate(0.8); }
.page-light .hero-bg-overlay { background: rgba(0,0,0,0.15); }
.page-light .hero-content {
  position: relative; z-index: 2;
  text-align: center;
  max-width: 860px;
  margin-inline: auto;
  padding: var(--space-xl) var(--space-2xl);
  background: radial-gradient(ellipse 90% 100% at center, rgba(0,0,0,0.40) 0%, rgba(0,0,0,0.25) 40%, rgba(0,0,0,0.08) 75%, transparent 100%);
  border-radius: 24px;
}
.page-light .hero-title {
  color: #fff; font-size: 1.7rem; line-height: 1.25;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
  margin-bottom: var(--space-sm);
}
.page-light .hero-subtitle {
  color: rgba(255,255,255,0.9);
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.3));
  font-size: 0.95rem; max-width: 540px; margin-inline: auto;
  margin-bottom: var(--space-lg);
}
.page-light .hero-search-wrap { max-width: 560px; margin-inline: auto; margin-bottom: var(--space-md); }
.page-light .hero-chip { color: rgba(255,255,255,0.9); border-color: rgba(255,255,255,0.25); font-size: 0.72rem; background: rgba(255,255,255,0.08); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.page-light .hero-chip:hover { color: #fff; background: rgba(255,255,255,0.18); border-color: rgba(255,255,255,0.4); }
.page-light .hero-stat { background: rgba(0,0,0,0.22); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); padding: 8px 16px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.08); }
.page-light .hero-stat-value { color: #fff; font-weight: 700; font-size: 1.05rem; text-shadow: 0 1px 4px rgba(0,0,0,0.5); }
.page-light .hero-stat-label { color: rgba(255,255,255,0.85); font-size: 0.72rem; text-shadow: 0 1px 3px rgba(0,0,0,0.5); }
.page-light .hero-search { background: rgba(255,255,255,0.95); border-color: transparent; box-shadow: 0 4px 24px rgba(0,0,0,0.12); }
.page-light .hero-search input { color: #111827; font-size: 0.9rem; padding: 0.7rem 0; }
.page-light .hero-search input::placeholder { color: #9ca3af; }
.page-light .hero-badge { background: rgba(255,255,255,0.15); border-color: rgba(255,255,255,0.3); color: #fff; font-size: 0.7rem; margin-bottom: var(--space-md); }
.page-light .hero-badge-dot { background: #fff; }
.page-light .hero-stats { justify-content: center; gap: var(--space-xl); }
.page-light .hero-chips { margin-bottom: var(--space-lg); }
@media (max-width: 768px) {
  .page-light .hero { padding: calc(32px + var(--header-height) + var(--space-lg)) var(--space-md) var(--space-2xl); }
  .page-light .hero-title { font-size: 1.35rem; }
  .page-light .hero-subtitle { font-size: 0.85rem; }
  .page-light .hero-stat-value { font-size: 0.9rem; }
  .page-light .hero-bg-img { object-position: 25% center; }
}

/* --- ALL CARDS: 50% gray, subtle, elegant --- */
.page-light .cat-card,
.page-light .city-card,
.page-light .calc-card,
.page-light .step-card,
.page-light .lead-box,
.page-light .article-card,
.page-light .newsletter-banner {
  background: #d8dbe0;
  border: 1px solid #c8ccd1;
  box-shadow: 0 3px 14px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.03);
  color: #4b5563;
}
.page-light .cat-card:hover,
.page-light .city-card:hover,
.page-light .calc-card:hover,
.page-light .step-card:hover,
.page-light .lead-box:hover,
.page-light .article-card:hover,
.page-light .newsletter-banner:hover {
  border-color: #b8bcc2;
  box-shadow: 0 6px 22px rgba(0,0,0,0.08);
  transform: translateY(-2px);
}

/* Typography inside cards */
.page-light .cat-card h3,
.page-light .city-card h3,
.page-light .calc-card h3,
.page-light .step-card h3,
.page-light .lead-box h3,
.page-light .article-card h3 { color: #111827; }
.page-light .cat-card p,
.page-light .city-card p,
.page-light .calc-card p,
.page-light .step-card p,
.page-light .lead-box p,
.page-light .article-card p { color: #4b5563; }
.page-light .city-stat-label { color: #6b7280; }
.page-light .city-stat-value { color: #111827; }
.page-light .city-stat-row { border-bottom-color: #d5d7db; }
.page-light .lead-form input { background: #fff; border-color: #b8bcc2; color: #111827; }
.page-light .lead-feature { color: #6b7280; }
.page-light .step-number { color: rgba(0,0,0,0.03); }
.page-light .newsletter-form input { background: #fff; border-color: #b8bcc2; color: #111827; }
.page-light .newsletter-banner h2 { color: #111827; }
.page-light .newsletter-banner p { color: #6b7280; }
.page-light .newsletter-form .btn { padding: 0.9em 2.2em; font-size: 0.95rem; }
.page-light .article-card h3 a { color: #111827; }
.page-light .article-card-meta { color: #9ca3af; }
.page-light .article-card-image-placeholder { background: #dfe1e5; }

/* Icons — larger, modern, with soft glow */
.page-light .cat-card-icon,
.page-light .calc-card-icon,
.page-light .step-card-icon {
  width: 48px; height: 48px; border-radius: 14px;
  font-size: 1.45rem;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-md);
}
.page-light .cat-card-icon i,
.page-light .calc-card-icon i,
.page-light .step-card-icon i {
  font-size: 1.45rem;
  line-height: 1;
}
.page-light .cat-card-icon svg,
.page-light .calc-card-icon svg,
.page-light .step-card-icon svg {
  width: 26px; height: 26px;
  display: block;
}
.page-light .cat-card:nth-child(1) .cat-card-icon { background: #fee2e2; color: #dc2626; }
.page-light .cat-card:nth-child(2) .cat-card-icon { background: #e0e7ff; color: #4f46e5; }
.page-light .cat-card:nth-child(3) .cat-card-icon { background: #fef3c7; color: #b45309; }
.page-light .cat-card:nth-child(4) .cat-card-icon { background: #fce7f3; color: #db2777; }
.page-light .cat-card:nth-child(5) .cat-card-icon { background: #e0f2fe; color: #0284c7; }
.page-light .cat-card:nth-child(6) .cat-card-icon { background: #d1fae5; color: #059669; }
.page-light .cat-card:nth-child(7) .cat-card-icon { background: #fef3c7; color: #b45309; }
.page-light .cat-card:nth-child(8) .cat-card-icon { background: #e0e7ff; color: #4f46e5; }
.page-light .calc-card:nth-child(1) .calc-card-icon { background: #fee2e2; color: #dc2626; }
.page-light .calc-card:nth-child(2) .calc-card-icon { background: #e0e7ff; color: #4f46e5; }
.page-light .calc-card:nth-child(3) .calc-card-icon { background: #fef3c7; color: #b45309; }
.page-light .calc-card:nth-child(4) .calc-card-icon { background: #d1fae5; color: #059669; }
.page-light .step-card:nth-child(1) .step-card-icon { background: #fee2e2; color: #dc2626; }
.page-light .step-card:nth-child(2) .step-card-icon { background: #fef3c7; color: #b45309; }
.page-light .step-card:nth-child(3) .step-card-icon { background: #e0e7ff; color: #4f46e5; }
.page-light .step-card:nth-child(4) .step-card-icon { background: #d1fae5; color: #059669; }
.page-light .city-card:nth-child(1) .city-card-flag { background: #e0e7ff; color: #4f46e5; }
.page-light .city-card:nth-child(2) .city-card-flag { background: #fee2e2; color: #dc2626; }
.page-light .city-card:nth-child(3) .city-card-flag { background: #fef3c7; color: #b45309; }
.page-light .city-card:nth-child(4) .city-card-flag { background: #d1fae5; color: #059669; }

/* Link arrows */
.page-light .cat-card .link-arrow-red { color: #dc2626; }
.page-light .city-card .link-arrow { color: #b45309; }
.page-light .calc-card .link-arrow { color: #dc2626; }
.page-light .cat-card-count { color: #6b7280; }

/* Section backgrounds */
.page-light .categories-section { background: #f4f5f7; }
.page-light .cities-section { background: #f4f5f7; }
.page-light .calculators-section { background: #f4f5f7; }
.page-light .steps-section { background: #f4f5f7; }
.page-light .lead-section { background: #f4f5f7; }
.page-light #neueste { background: #f4f5f7; }

/* Top bar — readable on light bg */
.page-light .top-bar { background: #111827; color: #d1d5db; border-bottom-color: rgba(255,255,255,0.06); }
.page-light .top-bar-sep { color: rgba(255,255,255,0.12); }

/* Mega menu — lighter glass for light theme */
.page-light .mega-menu { background: rgba(255,255,255,0.97); border-bottom-color: #e5e7eb; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.page-light .mega-cat-icon { background: rgba(0,0,0,0.03); color: #6b7280; }
.page-light .mega-cat:hover { background: rgba(0,0,0,0.05); }
.page-light .mega-cat:hover .mega-cat-icon { background: rgba(0,0,0,0.07); }
.page-light .mega-cat--red .mega-cat-icon { background: #fef2f2; color: #dc2626; }
.page-light .mega-cat--red:hover .mega-cat-icon { background: #fee2e2; }
.page-light .mega-cat--blue .mega-cat-icon { background: #eff6ff; color: #2563eb; }
.page-light .mega-cat--blue:hover .mega-cat-icon { background: #dbeafe; }
.page-light .mega-cat--gold .mega-cat-icon { background: #fefce8; color: #b45309; }
.page-light .mega-cat--gold:hover .mega-cat-icon { background: #fef3c7; }
.page-light .mega-cat--green .mega-cat-icon { background: #ecfdf5; color: #059669; }
.page-light .mega-cat--green:hover .mega-cat-icon { background: #d1fae5; }
.page-light .mega-cat-info h4 { color: #111827; }
.page-light .mega-cat-info p { color: #6b7280; }
.page-light .mega-cat-links a { color: #6b7280; border-color: #e5e7eb; }
.page-light .mega-cat-links a:hover { color: #111827; border-color: #d1d5db; background: rgba(0,0,0,0.04); }
.page-light .mega-menu-bottom { border-top-color: #e5e7eb; }
.page-light .mega-bottom-link { color: #4b5563; border-color: #e5e7eb; }
.page-light .mega-bottom-link:hover { color: #111827; border-color: #d1d5db; }

/* Section titles */
.page-light .section-title { color: #111827; }
.page-light .section-subtitle { color: #6b7280; }
.page-light .section-label { color: #dc2626; }

/* BTT button */
.page-light .btt-btn {
  position: fixed; bottom: 26px; right: 26px; z-index: 99999;
  width: 42px; height: 42px; border-radius: 50%;
  background: #dc2626; color: #fff; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 18px rgba(220,38,38,0.35);
  opacity: 0.7; pointer-events: auto; transition: all 0.2s;
}
.page-light .btt-btn.visible { opacity: 0.7; }
.page-light .btt-btn:hover { opacity: 1; transform: translateY(-3px); box-shadow: 0 6px 24px rgba(220,38,38,0.5); }
.page-light .btt-btn svg { width: 18px; height: 18px; }