/* ============================================================================
   CLIENT SKIN — שר הנדל"ן / בר לוי.  (NOT a kit file.)
   ----------------------------------------------------------------------------
   Loaded LAST (priority 99), so :root overrides here win the cascade.
   Excluded from kit-source / kit-sync — editing it never touches the core kit.

   COLOUR HIERARCHY (per client direction):
     • LIGHT (cool off-white / light gray)  = dominant, leading surface.
     • NAVY  (#0E2540)                       = secondary / structural / dark bands.
     • COPPER(#B0763C)                       = CTA ONLY, used sparingly, key spots.
   ============================================================================ */

:root{
  /* dominant light surfaces */
  --paper:          #F4F5F7;   /* page background — clean light gray        */
  --surface:        #ffffff;   /* cards / raised surfaces                   */
  --line:           #E4E6EA;   /* borders / dividers                        */

  /* text + navy (secondary / structural / dark sections) */
  --ink:            #16202E;   /* primary text — deep navy-charcoal         */
  --brand-deep:     #0E2540;   /* navy — dark dramatic bands / footer       */
  --fg-soft:        #3f4955;
  --fg-mute:        #5d6975;

  /* text on navy dark sections */
  --on-dark:        #eef1f5;
  --on-dark-soft:   #c3cdd8;
  --on-dark-mute:   #8a97a6;

  /* copper = CTA accent (least-used, important spots) */
  --accent:         #B0763C;   /* copper — buttons / key highlights          */
  --accent-strong:  #8a5824;   /* copper for text on light (WCAG AA)         */
  --accent-ink:     #241600;   /* dark espresso text/icon ON copper          */

  --shadow-btn:0 14px 28px -12px rgba(176,118,60,.55);

  /* BRAND GOLD — the skyline gradient (logo / favicon / OG signature).
     Canonical values from the brand kit. The gradient IS the identity. */
  --gold-1:         #B0763C;   /* gradient top — copper-bronze ( = --accent )  */
  --gold-2:         #E8B45C;   /* gradient bottom — light gold                 */
  --gold-solid:     #C5923F;   /* flat gold — hairlines / small marks / emboss */
  --gold-grad:      linear-gradient(180deg,#B0763C 0%,#E8B45C 100%);
  --gold-grad-h:    linear-gradient(90deg,#B0763C 0%,#E8B45C 100%);

  /* NAVY RAMP — single source for the dark dramatic bands. Replaces the
     one-off navy hexes that used to live inline in front-page.css gradients,
     so the dark theme moves together if the navy is ever retuned. */
  --navy-tint:      #15375a;   /* lighter navy — value-strip gradient        */
  --navy-mid:       #13314f;   /* mid navy — hero gradient top               */
  --navy-deep:      #0a1c30;   /* deepest navy — gradient bottoms            */
}

/* gold gradient hairline at the very top of every page — a premium brand cue
   that echoes the logo's gold. 3px, no meaningful layout shift. */
.sbr-hdr{border-top:3px solid;border-image:var(--gold-grad-h) 1}

/* reusable gold rule — echoes the divider inside the wordmark.
   Use under eyebrows / section headings: <hr class="sbr-gold-rule"> */
.sbr-gold-rule{height:3px;width:56px;border:0;border-radius:3px;background:var(--gold-grad-h);margin:0 0 18px}

/* button hover glow → copper (base.css hardcodes an amber glow) */
.sbr-btn--primary:hover{
  box-shadow:0 10px 26px -8px rgba(176,118,60,.6),0 2px 10px rgba(176,118,60,.4);
}

/* footer = light gray zone. Every page ends with a navy CTA band, so a light
   footer separates cleanly (navy → light) and keeps the brand light-led.
   footer.css assumes a dark footer (white text + translucent-white borders),
   so we flip text/borders to dark here. */
.site-footer{background:#E9EBF1;color:var(--fg-soft);border-top:1px solid var(--line)}
.site-footer a{color:var(--fg-soft)}
.site-footer a:hover{color:var(--ink)}
.site-footer h2,.site-footer h3,.site-footer__heading,.site-footer__title{color:var(--ink)}
.site-footer__nap,.site-footer__hours,.site-footer__tagline{color:var(--fg-mute)}
.site-footer__support,.site-footer__copy{border-top-color:var(--line);color:var(--fg-mute)}
.support-links{color:var(--fg-mute)}
.support-links a{color:var(--fg-mute)}
.support-links a:hover{color:var(--ink)}
.social-links a{border-color:var(--line);color:var(--fg-soft)}
.social-links a:hover{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}
/* brand lockup in the footer (light-gray zone) */
.site-footer__brand-link{display:inline-block;line-height:0;margin:0 0 10px}
.site-footer__logo{height:64px;width:auto;display:block}
@media(max-width:560px){.site-footer__logo{height:54px}}
.site-footer__a11y-link:hover,.site-footer__a11y-link:focus-visible{color:var(--accent-strong)}

/* --- Any other client-only CSS below ---------------------------------------- */