/* barni.fun light theme for every page except the home page (which carries its own copy)
   and demo.html (sent to leads, stays dark by decision).
   Loaded after each page's inline <style>, so it only overrides colors. */

:root { --lt-cream:#FFFBF5; --lt-peach:#FFF4EA; --lt-ink:#1A1A2E; --lt-soft:#4a4a63; --lt-line:#f0e2d6; }

body { background: var(--lt-cream) !important; }

/* top bar */
.top-nav, nav {
  background: rgba(255,251,245,.96) !important;
  box-shadow: 0 1px 0 rgba(26,26,46,.07) !important;
}
.top-nav a, nav a, nav .logo, nav .nav-links a { color: var(--lt-ink) !important; }
.top-nav .back-link, nav .nav-links a:hover { color: #E85A2A !important; }
.nav-toggle span { background: var(--lt-ink) !important; }
.nav-links { background-color: transparent; }

/* hero: the show photo, washed light, dark text */
.hero, .article-hero {
  background:
    linear-gradient(180deg, rgba(255,251,245,.90) 0%, rgba(255,251,245,.82) 55%, rgba(255,244,234,.95) 100%),
    image-set(url('/show-crowd.webp') type('image/webp'), url('/show-crowd.jpeg') type('image/jpeg')) center/cover no-repeat !important;
}
.hero::before, .article-hero::before {
  background:
    radial-gradient(260px 260px at 92% 10%, rgba(255,209,102,.45), transparent 70%),
    radial-gradient(240px 240px at 4% 90%, rgba(125,211,252,.35), transparent 70%) !important;
}
.hero h1, .article-hero h1 { color: var(--lt-ink) !important; text-shadow: none !important; }
.hero h1 span, .article-hero h1 span {
  background: none !important; -webkit-text-fill-color: #E85A2A !important; color: #E85A2A !important;
}
.hero-subtitle, .hero p, .article-hero p, .article-hero .meta, .article-meta { color: var(--lt-soft) !important; }
.hero .trust-item, .hero .hero-trust span { color: var(--lt-soft) !important; }

/* dark blocks inside articles */
.compare-table thead { background: #FFE3CF !important; color: var(--lt-ink) !important; }
.compare-table thead th { color: var(--lt-ink) !important; }
.cta-box {
  background: linear-gradient(135deg,#FF8A4C 0%,#FF6B35 55%,#FF9F6E 100%) !important;
}
.cta-box h2 { color: #fff !important; }
.cta-box p { color: rgba(255,255,255,.9) !important; }

/* closing call to action: orange only, no purple */
.cta-section { background: linear-gradient(135deg,#FF8A4C 0%,#FF6B35 55%,#FF9F6E 100%) !important; }

/* soft section backgrounds */
.faq-section, .features-section, .why-section { background-color: var(--lt-peach); }

/* footer: peach with a wave */
footer {
  position: relative;
  background: #F7D5BD !important;
  color: #5a3a2c !important;
  margin-top: 0;
}
footer::before {
  content: ""; position: absolute; left: 0; right: 0; top: -29px; height: 30px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L0 22 C 240 0 480 40 720 20 S 1200 0 1440 22 L1440 40Z' fill='%23F7D5BD'/%3E%3C/svg%3E") no-repeat bottom/100% 100%;
}
footer p, footer span { color: #5a3a2c !important; }
footer a { color: #B83A12 !important; font-weight: 700; }

/* details block (name, phone, area, hours) */
.nap-block { background: #FFFFFF !important; color: var(--lt-ink) !important; border-top: 0 !important; padding-bottom: 44px !important; }
.nap-block h3, .nap-block strong { color: var(--lt-ink) !important; }
.nap-block p, .nap-block span { color: var(--lt-soft) !important; }
.nap-block a { color: #E85A2A !important; }

/* WhatsApp buttons keep white text everywhere (article link colors used to win) */
a.btn-whatsapp, .btn-whatsapp, .btn-whatsapp * { color: #fff !important; }
.cta-section a.btn-whatsapp, .cta-section .btn-whatsapp, .cta-section .btn-whatsapp * { color: #25D366 !important; }

/* 404 page: its whole body used to be the dark stage */
body.page-404 { color: var(--lt-ink) !important; background: var(--lt-cream) !important; }
body.page-404 h2 { color: var(--lt-ink) !important; }
body.page-404 p { color: var(--lt-soft) !important; }

/* phones: one big WhatsApp button, always there (same rule as the home page, 2026-09-27) */
@media (max-width: 768px) {
  .mobile-bar { transform: none !important; }
  .mobile-bar .btn-call-mobile { display: none !important; }
  .mobile-bar .btn-wa-mobile { flex: 1 1 100% !important; font-size: 1.1rem !important; padding: 15px !important; }
  body:has(.mobile-bar) .whatsapp-float { display: none !important; }
}

/* ---------- shared blocks copied from the home page ---------- */
.real-reviews { background: #FFFFFF; padding: 56px 16px; text-align: center; }
.real-reviews .section-title { margin-bottom: 8px; }
.real-reviews .section-subtitle { color: #6b6b80; margin-bottom: 26px; }
.public-reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; max-width: 1100px; margin: 0 auto; }
.public-reviews-grid img { width: 100%; height: auto; border-radius: 16px; box-shadow: 0 10px 28px rgba(35,20,54,.14); display: block; }
@media (max-width: 768px) { .public-reviews-grid { grid-template-columns: 1fr; max-width: 520px; } }

.who-section{background:#FFFBF5;padding:56px 16px}
.who-wrap{max-width:1000px;margin:0 auto;text-align:center}
.who-title{font-family:'Rubik',sans-serif;font-size:1.8rem;font-weight:900;color:#1A1A2E;margin:0 0 10px}
.who-lead{font-size:1.05rem;color:#555;line-height:1.6;margin:0 auto 26px;max-width:520px}
.who-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.who-card{display:flex;flex-direction:column;align-items:flex-start;text-align:right;gap:3px;background:#fff;border:1px solid #f3e7dc;border-radius:16px;padding:10px 10px 14px;font:inherit;color:#1A1A2E;box-shadow:0 4px 14px rgba(26,26,46,.06)}
.who-card.has-video{cursor:pointer}
.who-thumb{position:relative;width:100%;aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:#1A1A2E;margin-bottom:8px;display:block}
.who-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.who-play{position:absolute;inset:0;margin:auto;width:44px;height:44px;border-radius:50%;background:rgba(255,107,53,.95);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.who-kind{font-size:.72rem;font-weight:700;color:#FF6B35}
.who-card b{font-size:1.05rem}
.who-card small{font-size:.82rem;color:#777;line-height:1.35}
.who-ads{margin:22px 0 0;color:#666;font-size:.95rem}
.who-ads button{background:none;border:1px solid #e8d5c6;border-radius:999px;padding:6px 14px;margin:4px;font:inherit;color:#1A1A2E;cursor:pointer}
@media (min-width:900px){.who-grid{grid-template-columns:repeat(4,1fr)}.who-title{font-size:2.4rem}}
.seen-modal{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:9999;padding:16px}
.seen-modal.open{display:flex}
.seen-modal iframe{width:100%;max-width:720px;aspect-ratio:16/9;border:0;border-radius:12px}

/* ---------- top bar on sub-pages: one row on phones, small breadcrumbs ---------- */
.breadcrumbs { background: transparent !important; border-bottom: 0 !important; padding: 8px 20px !important; font-size: .8rem !important; }
@media (max-width: 768px) {
  .top-nav { flex-direction: row !important; justify-content: space-between !important; align-items: center !important; padding: 10px 16px !important; text-align: right !important; }
  .top-nav .back-link { font-size: .85rem !important; white-space: nowrap; }
  .top-nav .back-link { font-size: 0 !important; }
  .top-nav .back-link::after { content: "← לדף הבית"; font-size: .85rem; font-weight: 600; }
  .breadcrumbs { padding: 6px 16px 0 !important; font-size: .75rem !important; }
}

/* a few pages (Raanana) had the top bar floating over the hero; keep it in the flow */
.top-nav { position: relative !important; }

/* any other table header in the blog */
table thead, .price-table thead { background: #FFE3CF !important; color: var(--lt-ink) !important; }
table thead th { color: var(--lt-ink) !important; }

/* dates and brand bits that were yellow on the dark hero */
.article-meta time, .article-meta span { color: #C2410C !important; }
nav .nav-brand, .nav-brand { color: var(--lt-ink) !important; }