/* =====================================================
   משפחה כלכלית — Special + Listing pages v3 (Modern Tactile)
   Scoped to body.page-special-v3 and body.page-listing-v3
   ===================================================== */

/* ============================================
   PALETTE OVERRIDE — same warm system as homepage v3
   ============================================ */
body.page-special-v3,
body.page-listing-v3 {
  --paper:        #FBF7F0;
  --paper-2:      #F3EBDC;
  --paper-3:      #EADDC4;
  --white:        #FFFFFF;

  --ink:          #2D1F33;
  --ink-soft:     #5A4A60;
  --ink-mute:     #8C7E92;

  --clay:         #C8623F;
  --clay-soft:    #E8B099;
  --clay-pale:    #F5E0D2;
  --olive:        #6B7B3E;
  --olive-soft:   #B8C094;
  --butter:       #F0D266;
  --butter-soft:  #F8E5A6;
  --plus:         #4D8B5C;

  /* re-tint 'gold' references to clay so existing component CSS picks it up */
  --gold:         #C8623F;
  --gold-soft:    #E8B099;
  --gold-pale:    #F5E0D2;

  --rule:         #E5D8BE;
  --rule-strong:  #C9B894;

  --shadow-sm:    0 2px 0 rgba(45, 31, 51, .05);
  --shadow-md:    0 8px 30px -12px rgba(45, 31, 51, .18);

  --display: 'Rubik', 'Heebo', sans-serif;
  --serif: 'Frank Ruhl Libre', Georgia, serif;
  --sans: 'Heebo', 'Assistant', sans-serif;

  background: var(--paper);
  color: var(--ink-soft);
  font-family: var(--sans);
}

/* ============================================
   MASTHEAD + FOOTER RE-TINT
   ============================================ */
body.page-special-v3 .utility-tag,
body.page-listing-v3 .utility-tag {
  background: var(--clay); color: var(--paper);
}
body.page-special-v3 .masthead__nav-cta,
body.page-listing-v3 .masthead__nav-cta {
  background: var(--clay) !important; color: var(--white) !important;
}
body.page-special-v3 .masthead__nav-cta:hover,
body.page-listing-v3 .masthead__nav-cta:hover {
  background: var(--ink) !important; color: var(--butter) !important;
}
body.page-special-v3 .nav-list > li > a::after,
body.page-listing-v3 .nav-list > li > a::after { background: var(--clay); }
body.page-special-v3 .nav-list > li > a:hover,
body.page-listing-v3 .nav-list > li > a:hover { color: var(--clay); }
body.page-special-v3 .nav-dropdown a:hover,
body.page-listing-v3 .nav-dropdown a:hover { color: var(--clay); border-inline-end-color: var(--clay); }
body.page-special-v3 .site-header::after,
body.page-listing-v3 .site-header::after {
  background: linear-gradient(90deg, transparent, var(--clay-soft) 30%, var(--clay) 50%, var(--clay-soft) 70%, transparent);
}

body.page-special-v3 .colophon__col h3,
body.page-listing-v3 .colophon__col h3 { color: var(--butter); }
body.page-special-v3 .colophon__col h3::after,
body.page-listing-v3 .colophon__col h3::after { background: var(--clay); }
body.page-special-v3 .colophon__phone,
body.page-listing-v3 .colophon__phone { color: var(--butter); }
body.page-special-v3 .colophon__col a:hover,
body.page-listing-v3 .colophon__col a:hover { color: var(--butter); }
body.page-special-v3 .colophon__rule span,
body.page-listing-v3 .colophon__rule span { color: var(--clay); }
body.page-special-v3 .colophon__social:hover,
body.page-listing-v3 .colophon__social:hover { background: var(--clay); color: var(--ink); }
body.page-special-v3 .site-footer::before,
body.page-listing-v3 .site-footer::before { background: var(--clay); }

/* ============================================
   BREADCRUMB
   ============================================ */
body.page-special-v3 .breadcrumb,
body.page-listing-v3 .breadcrumb {
  background: var(--paper-2);
  border-bottom: 1px solid var(--rule);
  padding: 1rem 0;
}
body.page-special-v3 .breadcrumb a:hover,
body.page-listing-v3 .breadcrumb a:hover { color: var(--clay); }
body.page-special-v3 .breadcrumb__sep,
body.page-listing-v3 .breadcrumb__sep { color: var(--clay); font-weight: 800; }

/* ============================================
   KICKER — warm pill
   ============================================ */
body.page-special-v3 .kicker,
body.page-listing-v3 .kicker {
  background: var(--clay-pale);
  color: var(--clay);
  border-color: var(--clay-soft);
}
body.page-special-v3 .kicker__dot,
body.page-listing-v3 .kicker__dot { color: var(--clay); }

/* ============================================
   ABOUT PAGE — v3 overrides
   ============================================ */
body.page-special-v3 .about-hero h1.display {
  font-family: var(--display);
  font-weight: 900;
  font-style: normal;
  letter-spacing: -0.03em;
  color: var(--ink);
}
body.page-special-v3 .about-hero__deck em {
  background: linear-gradient(180deg, transparent 60%, var(--butter-soft) 60%);
  color: var(--clay);
}

body.page-special-v3 .about-mission__num {
  font-family: var(--display);
  color: var(--clay);
  font-style: normal;
}
body.page-special-v3 .about-mission__num small { color: var(--clay-soft); }

body.page-special-v3 .about-pillars {
  background: var(--paper-2);
}
body.page-special-v3 .about-pillars .display {
  font-family: var(--display);
  font-weight: 800;
  font-style: normal;
  color: var(--ink);
}

body.page-special-v3 .pillar {
  border-top: 4px solid var(--clay);
  border-radius: 16px;
  background: var(--white);
}
body.page-special-v3 .pillar__num {
  font-family: var(--display);
  font-style: normal;
  color: var(--clay);
}
body.page-special-v3 .pillar h3 {
  font-family: var(--display);
  font-weight: 700;
}
/* Alternate pillar accent colors */
body.page-special-v3 .pillar:nth-child(2) { border-top-color: var(--olive); }
body.page-special-v3 .pillar:nth-child(2) .pillar__num { color: var(--olive); }
body.page-special-v3 .pillar:nth-child(3) { border-top-color: var(--plus); }
body.page-special-v3 .pillar:nth-child(3) .pillar__num { color: var(--plus); }
body.page-special-v3 .pillar:nth-child(4) { border-top-color: var(--butter); }
body.page-special-v3 .pillar:nth-child(4) .pillar__num { color: #BF9B00; }

/* ============================================
   CONTACT PAGE — v3 overrides
   ============================================ */
body.page-special-v3 .contact-hero h1.display {
  font-family: var(--display);
  font-weight: 900;
  font-style: normal;
  color: var(--ink);
}

body.page-special-v3 .contact-item > .ic {
  color: var(--clay);
  background: var(--clay-pale);
  border-color: var(--clay-soft);
}
body.page-special-v3 .contact-item__value--big { color: var(--clay); }
body.page-special-v3 a.contact-item__value:hover { color: var(--clay); }

/* Contact form — v3 card */
body.page-special-v3 .contact-form-card {
  border-top: 4px solid var(--clay);
  border-radius: 16px;
}
body.page-special-v3 .contact-form-card h2 {
  font-family: var(--display);
  font-weight: 800;
  font-style: normal;
}
body.page-special-v3 .form-field input:focus,
body.page-special-v3 .form-field textarea:focus,
body.page-special-v3 .form-field select:focus {
  border-color: var(--clay);
  box-shadow: 0 0 0 4px var(--clay-pale);
}
body.page-special-v3 .btn-submit {
  background: var(--clay);
  color: var(--white);
}
body.page-special-v3 .btn-submit:hover { background: var(--ink); }

/* ============================================
   LEGAL PAGES — v3 overrides
   ============================================ */
body.page-special-v3 .legal-article .article__header {
  background: var(--paper-2);
}
body.page-special-v3 .legal-body h2 {
  font-family: var(--display);
  font-weight: 800;
  font-style: normal;
  color: var(--ink);
  border-top-color: var(--rule);
}
body.page-special-v3 .legal-body h3 {
  font-family: var(--display);
  font-weight: 700;
  font-style: normal;
}
body.page-special-v3 .legal-body a { color: var(--clay); border-bottom-color: var(--clay-soft); }
body.page-special-v3 .legal-body a:hover { color: var(--ink); border-bottom-color: var(--ink); }
body.page-special-v3 .legal-body ul > li::before { color: var(--clay); }

/* Article CTA frame on about page */
body.page-special-v3 .cta-frame {
  border-color: var(--clay-soft);
  background: linear-gradient(135deg, var(--clay-pale) 0%, var(--paper-2) 100%);
}
body.page-special-v3 .cta-frame .btn,
body.page-special-v3 .cta-frame .btn-primary {
  background: var(--clay);
  color: var(--white);
  border-color: var(--clay);
}
body.page-special-v3 .cta-frame .btn:hover,
body.page-special-v3 .cta-frame .btn-primary:hover {
  background: var(--ink);
  border-color: var(--ink);
}

/* ============================================
   LISTING PAGE — v3 overrides
   ============================================ */
body.page-listing-v3 .listing-hero__title {
  font-family: var(--display);
  font-weight: 900;
  font-style: normal;
  letter-spacing: -0.03em;
}
body.page-listing-v3 .listing-hero__lead {
  font-family: var(--sans);
  font-style: normal;
  font-size: clamp(1rem, 1.8vw, 1.2rem);
}
body.page-listing-v3 .listing-hero__search input:focus {
  border-color: var(--clay);
  box-shadow: 0 0 0 4px var(--clay-pale);
}

/* Filter buttons */
body.page-listing-v3 .filter-btn:hover {
  border-color: var(--clay);
  color: var(--clay);
  background: var(--clay-pale);
}
body.page-listing-v3 .filter-btn.is-active {
  background: var(--clay);
  border-color: var(--clay);
  color: var(--white);
}
body.page-listing-v3 .filter-btn.is-active:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--butter-soft);
}

/* Article cards */
body.page-listing-v3 .list-card {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow .2s, transform .2s;
}
body.page-listing-v3 .list-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
body.page-listing-v3 .list-card__thumb img { border-radius: 0; }

body.page-listing-v3 .list-card__cat {
  display: inline-block;
  padding: .2em .7em;
  background: var(--clay-pale);
  color: var(--clay);
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: .4rem;
}
body.page-listing-v3 .list-card__title a {
  font-family: var(--display);
  font-weight: 700;
  color: var(--ink);
}
body.page-listing-v3 .list-card__title a:hover { color: var(--clay); }

body.page-listing-v3 .list-card__more {
  color: var(--clay);
  font-weight: 700;
}
body.page-listing-v3 .list-card__more:hover { color: var(--ink); }
body.page-listing-v3 .list-card__more .ic { color: var(--clay); }

/* Section header on listing */
body.page-listing-v3 .section-head h2 {
  font-family: var(--display);
  font-weight: 900;
  font-style: normal;
}