/* ─── Zafari Law – Custom Stylesheet ─────────────────────────── */

:root {
  --navy:       #1c2b5a;
  --navy-light: #243370;
  --gold:       #c8a84b;
  --gold-light: #d4b96a;
  --marble:     #f5f4f1;
}

/* ── Base ──────────────────────────────────────────────────── */
body { font-family: 'Inter', sans-serif; color: #333; }
h1, h2, h3, h4, h5, h6, .font-serif { font-family: 'Playfair Display', serif; }

/* ── Utility colours ───────────────────────────────────────── */
.bg-navy       { background-color: var(--navy)       !important; }
.bg-navy-light { background-color: var(--navy-light) !important; }
.bg-marble     { background-color: var(--marble)     !important; }
.text-gold     { color: var(--gold)  !important; }
.text-navy     { color: var(--navy)  !important; }

/* ── Buttons ───────────────────────────────────────────────── */
.btn-gold { background-color: var(--gold); color: var(--navy); font-weight: 600; border: none; }
.btn-gold:hover, .btn-gold:focus { background-color: var(--gold-light); color: var(--navy); }

.btn-navy { background-color: var(--navy); color: #fff; font-weight: 600; border: none; }
.btn-navy:hover, .btn-navy:focus { background-color: var(--navy-light); color: #fff; }

.btn-outline-gold { border: 2px solid var(--gold); color: var(--gold); font-weight: 600; background: transparent; }
.btn-outline-gold:hover, .btn-outline-gold:focus { background-color: var(--gold); color: var(--navy); }

.btn-lg { padding: .8rem 2rem; font-size: 1.05rem; }

/* ── Top Bar ───────────────────────────────────────────────── */
.top-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1031;
  background: var(--navy);
  border-bottom: 1px solid rgba(255,255,255,.1);
  height: 38px; display: flex; align-items: center;
  font-size: .83rem; color: rgba(255,255,255,.7);
}
.top-bar a { color: var(--gold); font-weight: 600; text-decoration: none; }
.top-bar a:hover { color: var(--gold-light); }

/* ── Navbar ────────────────────────────────────────────────── */
#mainNav {
  position: fixed; top: 38px; left: 0; right: 0; z-index: 1030;
  background-color: var(--navy);
  box-shadow: 0 2px 12px rgba(0,0,0,.3);
}
.navbar-brand { gap: .6rem; text-decoration: none; }
.navbar-brand img { height: 52px; object-fit: contain; }
.brand-text { font-family: 'Playfair Display', serif; color: #fff; font-size: 1.1rem; font-weight: 600; line-height: 1.1; }
.brand-sub  { font-size: .62rem; letter-spacing: 2px; color: rgba(255,255,255,.45); text-transform: uppercase; }
.navbar-nav .nav-link { color: rgba(255,255,255,.8) !important; font-weight: 500; font-size: .9rem; padding: 1.2rem .55rem !important; transition: color .2s; }
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { color: var(--gold) !important; }
.navbar-toggler { border-color: rgba(255,255,255,.3); }
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,.8)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (max-width: 991px) {
  .navbar-collapse { background: var(--navy); padding: 1rem 0; }
  .navbar-nav .nav-link { padding: .65rem 1rem !important; }
  .navbar-cta { margin: .8rem 1rem 0; }
}

/* ── Page offset (top-bar 38 + nav ~78 = 116px) ──────────── */
.page-top-offset { padding-top: 116px; }

/* ── Hero (home) ───────────────────────────────────────────── */
.hero-section {
  background-color: var(--navy);
  min-height: 100vh; display: flex; align-items: center;
  padding-top: 116px; position: relative; overflow: hidden;
}
.hero-section::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 70% 50%, rgba(200,168,75,.08) 0%, transparent 60%);
  pointer-events: none;
}
.hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(200,168,75,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,168,75,.03) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

/* ── Page Hero (inner pages) ───────────────────────────────── */
.page-hero { background-color: var(--navy); padding: 136px 0 65px; }

/* ── Gold underline heading ────────────────────────────────── */
.gold-underline { position: relative; padding-bottom: 16px; }
.gold-underline::after {
  content: ''; position: absolute; bottom: 0; left: 0;
  width: 55px; height: 3px; background: var(--gold); border-radius: 2px;
}
.gold-underline-center::after { left: 50%; transform: translateX(-50%); }

/* ── Section spacing ───────────────────────────────────────── */
.section-py { padding: 80px 0; }
@media (max-width: 575px) { .section-py { padding: 52px 0; } }

/* ── Cards ─────────────────────────────────────────────────── */
.card-custom {
  border: none; border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
  transition: box-shadow .2s, transform .2s;
}
.card-custom:hover { box-shadow: 0 8px 32px rgba(0,0,0,.14); transform: translateY(-2px); }
.card-navy { background-color: var(--navy); color: #fff; border: none; border-radius: 12px; }

/* Icon box */
.icon-box {
  width: 52px; height: 52px;
  background-color: var(--navy); border-radius: 10px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.icon-box i { color: var(--gold); font-size: 1.3rem; }
.icon-box-lg { width: 64px; height: 64px; border-radius: 50%; }
.icon-box-lg i { font-size: 1.6rem; }

/* ── Stats ─────────────────────────────────────────────────── */
.stat-number { font-family: 'Playfair Display', serif; font-size: 2.6rem; font-weight: 700; color: var(--gold); line-height: 1; }

/* ── Call button ───────────────────────────────────────────── */
.btn-call {
  background-color: var(--navy); color: #fff; font-size: 1.2rem; font-weight: 700;
  padding: 1rem; border-radius: 8px; text-decoration: none;
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  transition: background .2s;
}
.btn-call:hover { background-color: var(--navy-light); color: #fff; }

/* ── Border left gold ──────────────────────────────────────── */
.border-left-gold { border-left: 4px solid var(--gold) !important; }

/* ── Practice area service list ────────────────────────────── */
.services-list { list-style: none; padding: 0; margin: 0; }
.services-list li { padding: 4px 0; font-size: .88rem; color: #555; }
.services-list li i { color: var(--gold); margin-right: 6px; font-size: .8rem; }

/* ── FAQ Accordion ─────────────────────────────────────────── */
.faq-category-label {
  font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.1rem;
  color: var(--navy); margin-bottom: 10px;
  display: flex; align-items: center; gap: 8px;
}
.faq-cat-num {
  width: 30px; height: 30px; background: var(--navy); color: var(--gold);
  border-radius: 5px; display: inline-flex; align-items: center; justify-content: center;
  font-size: .82rem; flex-shrink: 0;
}
.accordion-item { border: 1px solid #e0e0e0 !important; border-radius: 8px !important; overflow: hidden; margin-bottom: 8px; }
.accordion-button { font-size: .88rem; font-weight: 500; color: var(--navy); background: #fff; }
.accordion-button:not(.collapsed) { background: #fff; color: var(--navy); box-shadow: none; font-weight: 600; }
.accordion-button:focus { box-shadow: none; }
.accordion-body { font-size: .86rem; color: #555; }

/* ── Testimonial ───────────────────────────────────────────── */
.testimonial-card { background: rgba(255,255,255,.07); border: none; border-radius: 16px; }

/* ── GHL form container ────────────────────────────────────── */
.ghl-wrap { width: 100%; }

/* ── Policy pages ──────────────────────────────────────────── */
.policy-content h3 { color: var(--navy); font-size: 1.05rem; margin-top: 1.8rem; margin-bottom: .5rem; }
.policy-content ul { padding-left: 1.4rem; }
.policy-content p, .policy-content li { font-size: .93rem; color: #444; line-height: 1.75; }
.sms-policy-img { max-width: 100%; border-radius: 8px; border: 1px solid #ddd; }
.sms-highlight-box {
  background: #fffbf0; border: 1px solid var(--gold);
  border-left: 4px solid var(--gold); border-radius: 8px;
  padding: 1.2rem 1.5rem; margin: 1.5rem 0;
}

/* ── Footer ────────────────────────────────────────────────── */
.site-footer { background-color: var(--navy); color: rgba(255,255,255,.75); }
.footer-heading { font-family: 'Playfair Display', serif; color: var(--gold); font-size: 1rem; margin-bottom: 1.1rem; }
.footer-link { color: rgba(255,255,255,.7); text-decoration: none; transition: color .2s; font-size: .88rem; }
.footer-link:hover { color: var(--gold); }
.footer-hours { background: rgba(255,255,255,.07); border-radius: 8px; padding: .75rem 1rem; font-size: .82rem; margin-top: 1rem; }
.footer-disclaimer { font-size: .76rem; color: rgba(255,255,255,.42); border-top: 1px solid rgba(255,255,255,.1); padding-top: 1rem; }
.footer-copy { font-size: .8rem; color: rgba(255,255,255,.48); border-top: 1px solid rgba(255,255,255,.08); }

/* ── Scroll indicator ──────────────────────────────────────── */
.scroll-indicator { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); color: var(--gold); font-size: 1.7rem; animation: bounce 2s infinite; }
@keyframes bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(10px); }
}