/*
Theme Name:        Your Garden State Agent
Theme URI:         https://yourgardenstateagent.com
Author:            Eugeniusz "Eugene" Jaworski
Author URI:        https://yourgardenstateagent.com
Description:       A professional real estate and life insurance website for Eugene Jaworski — NJ Licensed REALTOR® and PFA/NLG Life Insurance Producer. Built with PFA navy/gold palette, NLG forest green accents, and Realmart coral branding.
Version:           1.0.0
Requires at least: 5.8
Tested up to:      6.5
Requires PHP:      7.4
License:           Private
License URI:       https://yourgardenstateagent.com
Text Domain:       gardenstateagent
Tags:              real-estate, insurance, business, one-page, custom-colors, custom-menu, featured-images

--- COLOR SYSTEM ---
PFA Primary:   Navy #0A1F44 | Gold #C9922A | Cream #F8F4EE
NLG Accent:    Forest #1B6B3A | Sage #4A9B6F
Realmart:      Coral #C0392B
Typography:    Cormorant Garamond (display) | DM Sans (body) | Bebas Neue (labels)
*/

/* See page-home.php, page-real-estate.php, page-insurance.php for full styles */


/* ═══════════════════════════════════════
   GLOBAL THEME STYLES
═══════════════════════════════════════ */

/* ═══════════════════════════════════════════════
   DESIGN SYSTEM — Garden State Agent
   PFA palette: Navy #0A1F44, Gold #C9922A, Cream #F8F4EE
   NLG accent:  Forest #1B6B3A, Sage #4A9B6F
   Realmart:    Coral #C0392B, Warm Red #E74C3C
═══════════════════════════════════════════════ */
:root {
  --navy:       #0A1F44;
  --navy-deep:  #061229;
  --navy-mid:   #163166;
  --gold:       #C9922A;
  --gold-light: #E8B84B;
  --gold-pale:  #F5E6C8;
  --cream:      #F8F4EE;
  --cream-dark: #EDE7DC;
  --forest:     #1B6B3A;
  --sage:       #4A9B6F;
  --sage-light: #A8D5B8;
  --coral:      #C0392B;
  --red-warm:   #E74C3C;
  --charcoal:   #2C2C2C;
  --gray-mid:   #6B7280;
  --gray-light: #E5E7EB;
  --white:      #FFFFFF;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', sans-serif;
  --font-label:   'Bebas Neue', sans-serif;
  --shadow-soft:  0 4px 24px rgba(10,31,68,0.10);
  --shadow-card:  0 8px 40px rgba(10,31,68,0.13);
  --shadow-lift:  0 20px 60px rgba(10,31,68,0.18);
  --radius:       12px;
  --radius-lg:    20px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body);
  background: var(--white);
  color: var(--charcoal);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--navy); border-radius: 3px; }

/* ══════════════════════════════════
   NAVIGATION
══════════════════════════════════ */
#nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  transition: all 0.4s ease;
  padding: 0 5vw;
}
#nav.scrolled {
  background: rgba(6,18,41,0.97);
  backdrop-filter: blur(12px);
  box-shadow: 0 2px 30px rgba(0,0,0,0.25);
}
.nav-inner {
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}
.nav-logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.nav-logo .logo-main {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.02em;
}
.nav-logo .logo-sub {
  font-family: var(--font-label);
  font-size: 9px;
  color: var(--gold-light);
  letter-spacing: 0.35em;
  margin-top: 2px;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
}
.nav-links a {
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  padding: 6px 14px;
  border-radius: 6px;
  transition: all 0.25s;
  letter-spacing: 0.02em;
}
.nav-links a:hover { color: var(--white); background: rgba(201,146,42,0.2); }
.nav-cta {
  background: var(--gold) !important;
  color: var(--white) !important;
  font-weight: 600 !important;
  padding: 8px 20px !important;
}
.nav-cta:hover { background: var(--gold-light) !important; transform: translateY(-1px); }
.nav-toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 6px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--white); border-radius: 2px; transition: all 0.3s; }

/* ══════════════════════════════════
   HERO
══════════════════════════════════ */
#hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--navy-deep);
}
.hero-bg {
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(ellipse 80% 60% at 70% 40%, rgba(27,107,58,0.18) 0%, transparent 60%),
    radial-gradient(ellipse 60% 80% at 20% 70%, rgba(201,146,42,0.12) 0%, transparent 55%),
    linear-gradient(135deg, #061229 0%, #0A1F44 40%, #163166 70%, #0e2850 100%);
}
.hero-grid {
  position: absolute;
  inset: 0;
  background-image: 
    linear-gradient(rgba(201,146,42,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,146,42,0.05) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.4) 30%, rgba(0,0,0,0.4) 70%, transparent 100%);
}
/* NJ Skyline silhouette */
.hero-skyline {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 45%;
  opacity: 0.08;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320' preserveAspectRatio='xMidYMax meet'%3E%3Cpath fill='%23ffffff' d='M0,320 L0,220 L30,220 L30,180 L50,180 L50,160 L70,160 L70,180 L90,180 L90,140 L100,140 L100,120 L110,120 L110,100 L120,100 L120,80 L130,80 L130,60 L140,60 L140,80 L150,80 L150,100 L160,100 L160,120 L170,120 L170,140 L180,140 L180,180 L200,180 L200,160 L220,160 L220,140 L240,140 L240,120 L250,120 L250,100 L260,100 L260,80 L270,80 L270,60 L280,60 L280,40 L290,40 L290,20 L300,20 L300,10 L305,10 L305,5 L310,5 L310,10 L315,10 L315,20 L320,20 L320,40 L330,40 L330,60 L340,60 L340,80 L350,80 L350,100 L360,100 L360,120 L380,120 L380,140 L400,140 L400,160 L420,160 L420,180 L440,180 L440,160 L460,160 L460,140 L480,140 L480,120 L500,120 L500,100 L510,100 L510,80 L520,80 L520,60 L530,60 L530,40 L540,40 L540,60 L550,60 L550,80 L560,80 L560,100 L570,100 L570,120 L580,120 L580,140 L600,140 L600,120 L620,120 L620,100 L640,100 L640,80 L650,80 L650,60 L660,60 L660,40 L670,40 L670,60 L680,60 L680,80 L690,80 L690,100 L700,100 L700,120 L720,120 L720,140 L740,140 L740,160 L760,160 L760,180 L780,180 L780,200 L800,200 L800,180 L820,180 L820,160 L840,160 L840,140 L860,140 L860,120 L880,120 L880,140 L900,140 L900,160 L920,160 L920,140 L940,140 L940,120 L960,120 L960,100 L980,100 L980,120 L1000,120 L1000,140 L1020,140 L1020,160 L1040,160 L1040,180 L1060,180 L1060,200 L1080,200 L1080,180 L1100,180 L1100,160 L1120,160 L1120,140 L1140,140 L1140,120 L1160,120 L1160,140 L1180,140 L1180,160 L1200,160 L1200,180 L1220,180 L1220,200 L1240,200 L1240,180 L1260,180 L1260,200 L1280,200 L1280,220 L1300,220 L1300,200 L1320,200 L1320,220 L1340,220 L1340,200 L1360,200 L1360,220 L1380,220 L1380,240 L1400,240 L1400,260 L1440,260 L1440,320 Z'/%3E%3C/svg%3E") bottom/cover no-repeat;
}
.hero-content {
  position: relative;
  z-index: 2;
  max-width: 1300px;
  margin: 0 auto;
  padding: 120px 5vw 80px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.hero-text { }
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.4em;
  color: var(--gold);
  margin-bottom: 20px;
}
.hero-eyebrow::before {
  content: '';
  display: block;
  width: 30px;
  height: 1px;
  background: var(--gold);
}
.hero-h1 {
  font-family: var(--font-display);
  font-size: clamp(48px, 5.5vw, 84px);
  font-weight: 700;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 24px;
}
.hero-h1 em {
  font-style: italic;
  color: var(--gold-light);
}
.hero-p {
  font-size: 17px;
  font-weight: 300;
  color: rgba(255,255,255,0.75);
  line-height: 1.75;
  max-width: 480px;
  margin-bottom: 40px;
}
.hero-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gold);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 14px 28px;
  border-radius: 8px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 20px rgba(201,146,42,0.35);
}
.btn-primary:hover { background: var(--gold-light); transform: translateY(-2px); box-shadow: 0 8px 30px rgba(201,146,42,0.45); }
.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--white);
  font-size: 14px;
  font-weight: 500;
  padding: 14px 28px;
  border-radius: 8px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.3);
  cursor: pointer;
  transition: all 0.3s ease;
}
.btn-outline:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,146,42,0.08); }

/* Hero card stack */
.hero-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hero-service-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  backdrop-filter: blur(10px);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  cursor: pointer;
  text-decoration: none;
  display: block;
}
.hero-service-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  border-radius: 4px 0 0 4px;
}
.hero-service-card.card-re::before  { background: var(--gold); }
.hero-service-card.card-ins::before { background: var(--sage); }
.hero-service-card:hover { 
  transform: translateX(6px); 
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.22);
}
.hsc-icon {
  font-size: 28px;
  margin-bottom: 12px;
  display: block;
}
.hsc-title {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 8px;
}
.hsc-desc {
  font-size: 14px;
  color: rgba(255,255,255,0.65);
  line-height: 1.6;
}
.hsc-tag {
  position: absolute;
  top: 20px; right: 24px;
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.3em;
  padding: 4px 10px;
  border-radius: 20px;
}
.tag-re  { background: rgba(201,146,42,0.2); color: var(--gold-light); border: 1px solid rgba(201,146,42,0.3); }
.tag-ins { background: rgba(74,155,111,0.2); color: var(--sage-light); border: 1px solid rgba(74,155,111,0.3); }

/* Hero badge strip */
.hero-badges {
  display: flex;
  gap: 20px;
  margin-top: 48px;
  flex-wrap: wrap;
  align-items: center;
}
.badge-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.badge-num {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 700;
  color: var(--gold-light);
  line-height: 1;
}
.badge-lbl {
  font-size: 11px;
  color: rgba(255,255,255,0.5);
  letter-spacing: 0.06em;
  margin-top: 3px;
}
.badge-sep { width: 1px; height: 40px; background: rgba(255,255,255,0.15); }

/* Scroll indicator */
.hero-scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  opacity: 0.5;
  animation: bounce 2.5s ease-in-out infinite;
}
.hero-scroll span {
  font-size: 10px;
  letter-spacing: 0.3em;
  color: var(--white);
  font-family: var(--font-label);
}
.hero-scroll svg { color: var(--white); }
@keyframes bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(8px); }
}

/* ══════════════════════════════════
   TRUST BAR
══════════════════════════════════ */
#trust {
  background: var(--cream);
  border-top: 1px solid var(--cream-dark);
  border-bottom: 3px solid var(--gold);
  padding: 22px 5vw;
}
.trust-inner {
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--navy);
}
.trust-icon {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--navy);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}
.trust-divider { width: 1px; height: 28px; background: var(--cream-dark); }

/* Affiliation logos row */
.trust-affiliates {
  display: flex;
  align-items: center;
  gap: 16px;
}
.affiliate-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border-radius: 6px;
  border: 1px solid;
  font-family: var(--font-label);
  font-size: 13px;
  letter-spacing: 0.12em;
}
.aff-pfa  { border-color: rgba(10,31,68,0.25); color: var(--navy); background: rgba(10,31,68,0.06); }
.aff-nlg  { border-color: rgba(27,107,58,0.3);  color: var(--forest); background: rgba(27,107,58,0.07); }
.aff-real { border-color: rgba(192,57,43,0.3);  color: var(--coral); background: rgba(192,57,43,0.07); }
.aff-dot  { width: 6px; height: 6px; border-radius: 50%; }
.aff-pfa  .aff-dot { background: var(--navy); }
.aff-nlg  .aff-dot { background: var(--forest); }
.aff-real .aff-dot { background: var(--coral); }

/* ══════════════════════════════════
   SECTION COMMONS
══════════════════════════════════ */
section { padding: 100px 5vw; }
.section-inner { max-width: 1300px; margin: 0 auto; }
.section-eyebrow {
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.42em;
  color: var(--gold);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.section-eyebrow::after { content: ''; display: block; width: 40px; height: 1px; background: var(--gold); }
.section-title {
  font-family: var(--font-display);
  font-size: clamp(34px, 4vw, 60px);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.1;
  margin-bottom: 16px;
}
.section-title em { font-style: italic; color: var(--gold); }
.section-sub {
  font-size: 17px;
  color: var(--gray-mid);
  line-height: 1.7;
  max-width: 620px;
}

/* ══════════════════════════════════
   SERVICES SECTION
══════════════════════════════════ */
#services { background: var(--white); }
.services-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-top: 64px;
}
.service-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
  display: block;
  text-decoration: none;
  transition: all 0.4s ease;
  box-shadow: var(--shadow-card);
}
.service-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.sc-image-zone {
  height: 280px;
  position: relative;
  overflow: hidden;
}
.sc-image-re {
  background: linear-gradient(135deg, #0A1F44 0%, #163166 40%, #1B4B8A 70%, #0d2e5c 100%);
}
.sc-image-ins {
  background: linear-gradient(135deg, #0d2e1a 0%, #1B6B3A 40%, #2d8a50 70%, #155530 100%);
}
.sc-img-pattern {
  position: absolute;
  inset: 0;
  opacity: 0.15;
  background-image: 
    radial-gradient(circle at 20% 50%, rgba(255,255,255,0.3) 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,0.3) 1px, transparent 1px),
    radial-gradient(circle at 60% 80%, rgba(255,255,255,0.3) 1px, transparent 1px);
  background-size: 40px 40px;
}
.sc-hero-icon {
  position: absolute;
  bottom: 24px;
  right: 28px;
  font-size: 80px;
  opacity: 0.25;
  line-height: 1;
}
.sc-label-strip {
  position: absolute;
  top: 24px;
  left: 24px;
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.35em;
  color: rgba(255,255,255,0.7);
  background: rgba(0,0,0,0.3);
  backdrop-filter: blur(4px);
  padding: 5px 14px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,0.15);
}
.sc-body {
  background: var(--white);
  padding: 36px 36px 40px;
  border-top: 4px solid;
}
.sc-body-re  { border-color: var(--gold); }
.sc-body-ins { border-color: var(--sage); }
.sc-title {
  font-family: var(--font-display);
  font-size: 30px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
  line-height: 1.1;
}
.sc-desc {
  font-size: 15px;
  color: var(--gray-mid);
  line-height: 1.7;
  margin-bottom: 28px;
}
.sc-features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 32px;
}
.sc-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: var(--charcoal);
}
.sc-check {
  width: 20px; height: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  flex-shrink: 0;
}
.check-re  { background: var(--gold-pale); color: var(--gold); }
.check-ins { background: var(--sage-light); color: var(--forest); }
.sc-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  padding: 12px 24px;
  border-radius: 8px;
  transition: all 0.3s;
}
.sc-btn-re  { background: var(--navy); color: var(--white); }
.sc-btn-re:hover  { background: var(--gold); }
.sc-btn-ins { background: var(--forest); color: var(--white); }
.sc-btn-ins:hover { background: var(--sage); }

/* ══════════════════════════════════
   WHY ME — ABOUT SECTION
══════════════════════════════════ */
#about {
  background: var(--navy);
  color: var(--white);
  position: relative;
  overflow: hidden;
}
.about-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 60% at 80% 50%, rgba(201,146,42,0.1) 0%, transparent 60%),
    radial-gradient(ellipse 40% 50% at 10% 20%, rgba(27,107,58,0.08) 0%, transparent 60%);
}
.about-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.about-text .section-title { color: var(--white); }
.about-text .section-sub   { color: rgba(255,255,255,0.7); }
.about-signature {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: flex;
  align-items: center;
  gap: 20px;
}
.sig-avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 700;
  color: var(--navy);
  flex-shrink: 0;
  border: 3px solid rgba(255,255,255,0.2);
}
.sig-name {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--white);
}
.sig-title {
  font-size: 13px;
  color: var(--gold-light);
  margin-top: 2px;
}
.sig-nj {
  font-size: 12px;
  color: rgba(255,255,255,0.5);
  margin-top: 4px;
}

/* Value cards */
.value-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.val-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius);
  padding: 28px 24px;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}
.val-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-radius: 3px 3px 0 0;
}
.val-card.v-gold::before { background: var(--gold); }
.val-card.v-sage::before { background: var(--sage); }
.val-card.v-red::before  { background: var(--coral); }
.val-card.v-navy::before { background: var(--sage-light); }
.val-card:hover { background: rgba(255,255,255,0.08); transform: translateY(-3px); }
.val-icon { font-size: 28px; margin-bottom: 12px; }
.val-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 8px;
}
.val-desc { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.6; }

/* ══════════════════════════════════
   PROCESS SECTION
══════════════════════════════════ */
#process { background: var(--cream); }
.process-tabs {
  margin-top: 16px;
  display: flex;
  gap: 0;
  border: 1px solid var(--cream-dark);
  border-radius: 10px;
  overflow: hidden;
  width: fit-content;
  background: var(--white);
  box-shadow: var(--shadow-soft);
}
.tab-btn {
  padding: 12px 28px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  background: transparent;
  color: var(--gray-mid);
  transition: all 0.3s;
  letter-spacing: 0.04em;
}
.tab-btn.active-re  { background: var(--navy); color: var(--white); }
.tab-btn.active-ins { background: var(--forest); color: var(--white); }
.tab-btn:not(.active-re):not(.active-ins):hover { background: var(--cream); color: var(--navy); }

.process-content { display: none; margin-top: 56px; }
.process-content.active { display: block; }
.steps-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
}
.steps-row::before {
  content: '';
  position: absolute;
  top: 28px;
  left: calc(12.5% + 20px);
  right: calc(12.5% + 20px);
  height: 2px;
  z-index: 0;
}
.steps-row.re-steps::before  { background: linear-gradient(90deg, var(--gold), rgba(201,146,42,0.2)); }
.steps-row.ins-steps::before { background: linear-gradient(90deg, var(--sage), rgba(74,155,111,0.2)); }
.step-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 16px;
  position: relative;
  z-index: 1;
}
.step-num {
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 20px;
  border: 3px solid var(--white);
  box-shadow: var(--shadow-soft);
}
.step-num-re  { background: var(--navy); }
.step-num-ins { background: var(--forest); }
.step-title {
  font-weight: 700;
  font-size: 15px;
  color: var(--navy);
  margin-bottom: 8px;
}
.step-desc {
  font-size: 13px;
  color: var(--gray-mid);
  line-height: 1.6;
}

/* ══════════════════════════════════
   TESTIMONIALS
══════════════════════════════════ */
#testimonials { background: var(--white); }
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 56px;
}
.testi-card {
  background: var(--cream);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  position: relative;
  border: 1px solid var(--cream-dark);
  transition: all 0.3s;
}
.testi-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.testi-quote {
  font-size: 48px;
  line-height: 1;
  color: var(--gold);
  font-family: var(--font-display);
  margin-bottom: 12px;
  opacity: 0.5;
}
.testi-text {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 17px;
  color: var(--navy);
  line-height: 1.65;
  margin-bottom: 28px;
}
.testi-author {
  display: flex;
  align-items: center;
  gap: 12px;
}
.testi-avatar {
  width: 46px; height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
  color: var(--white);
  flex-shrink: 0;
}
.av-re  { background: var(--navy); }
.av-ins { background: var(--forest); }
.av-mix { background: linear-gradient(135deg, var(--navy), var(--forest)); }
.testi-name  { font-weight: 700; font-size: 15px; color: var(--navy); }
.testi-type  { font-size: 12px; color: var(--gray-mid); margin-top: 2px; }
.testi-stars { color: var(--gold); font-size: 13px; margin-bottom: 4px; }
.testi-service {
  position: absolute;
  top: 20px; right: 20px;
  font-family: var(--font-label);
  font-size: 9px;
  letter-spacing: 0.25em;
  padding: 3px 10px;
  border-radius: 10px;
}
.ts-re  { background: var(--gold-pale); color: var(--gold); }
.ts-ins { background: var(--sage-light); color: var(--forest); }

/* ══════════════════════════════════
   CTA SECTION
══════════════════════════════════ */
#cta {
  background: linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 50%, var(--navy-mid) 100%);
  padding: 100px 5vw;
  position: relative;
  overflow: hidden;
}
#cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 70% at 50% 50%, rgba(201,146,42,0.1) 0%, transparent 60%);
}
.cta-inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}
.cta-eyebrow {
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.4em;
  color: var(--gold);
  margin-bottom: 20px;
}
.cta-title {
  font-family: var(--font-display);
  font-size: clamp(38px, 4.5vw, 64px);
  font-weight: 700;
  color: var(--white);
  line-height: 1.08;
  margin-bottom: 20px;
}
.cta-title em { font-style: italic; color: var(--gold-light); }
.cta-sub {
  font-size: 17px;
  color: rgba(255,255,255,0.7);
  margin-bottom: 48px;
  line-height: 1.7;
}
.cta-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.cta-dividers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}
.cta-contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: rgba(255,255,255,0.6);
}
.cta-contact-item strong { color: var(--white); }

/* ══════════════════════════════════
   FOOTER
══════════════════════════════════ */
footer {
  background: var(--navy-deep);
  padding: 64px 5vw 32px;
  color: rgba(255,255,255,0.6);
}
.footer-inner {
  max-width: 1300px;
  margin: 0 auto;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 56px;
}
.footer-brand .logo-main {
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin-bottom: 6px;
}
.footer-brand .logo-sub {
  font-family: var(--font-label);
  font-size: 9px;
  color: var(--gold);
  letter-spacing: 0.4em;
  margin-bottom: 16px;
}
.footer-brand p {
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 20px;
  max-width: 280px;
}
.footer-domain {
  font-size: 12px;
  color: var(--gold-light);
  opacity: 0.7;
}
.footer-col h4 {
  font-family: var(--font-label);
  font-size: 12px;
  letter-spacing: 0.3em;
  color: var(--white);
  margin-bottom: 20px;
}
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col li a {
  font-size: 14px;
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  transition: color 0.2s;
}
.footer-col li a:hover { color: var(--gold-light); }
.footer-bottom {
  padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  font-size: 12px;
}
.footer-legal a { color: rgba(255,255,255,0.4); text-decoration: none; margin-left: 16px; }
.footer-legal a:hover { color: var(--gold-light); }
.footer-affiliates { display: flex; gap: 8px; align-items: center; }
.fa-badge {
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.15em;
  padding: 3px 9px;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.5);
}

/* ══════════════════════════════════
   UTILITY
══════════════════════════════════ */
.gold-line {
  display: inline-block;
  width: 60px;
  height: 3px;
  background: var(--gold);
  border-radius: 2px;
  margin-bottom: 24px;
}
.text-gold  { color: var(--gold); }
.text-sage  { color: var(--sage); }
.text-coral { color: var(--coral); }

/* ══════════════════════════════════
   ANIMATIONS
══════════════════════════════════ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-up { animation: fadeUp 0.7s ease forwards; }
.delay-1 { animation-delay: 0.1s; }
.delay-2 { animation-delay: 0.2s; }
.delay-3 { animation-delay: 0.35s; }
.delay-4 { animation-delay: 0.5s; }

/* ══════════════════════════════════
   RESPONSIVE
══════════════════════════════════ */
@media (max-width: 1024px) {
  .services-grid     { grid-template-columns: 1fr; }
  .about-grid        { grid-template-columns: 1fr; gap: 48px; }
  .testimonials-grid { grid-template-columns: 1fr 1fr; }
  .steps-row         { grid-template-columns: 1fr 1fr; }
  .footer-top        { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .hero-content      { grid-template-columns: 1fr; gap: 40px; padding-top: 110px; }
  .hero-visual       { display: none; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .trust-inner       { justify-content: center; }
  .trust-divider     { display: none; }
  .trust-affiliates  { flex-wrap: wrap; justify-content: center; }
  .steps-row         { grid-template-columns: 1fr 1fr; gap: 32px; }
  .steps-row::before { display: none; }
  .value-cards       { grid-template-columns: 1fr 1fr; }
  .footer-top        { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom     { flex-direction: column; text-align: center; }
  .nav-links         { display: none; }
  .nav-toggle        { display: flex; }
  .hero-badges       { justify-content: center; }
}
@media (max-width: 480px) {
  .steps-row   { grid-template-columns: 1fr; }
  .value-cards { grid-template-columns: 1fr; }
  .hero-actions { flex-direction: column; }
  .cta-actions  { flex-direction: column; align-items: center; }
}


/* Additional WP-specific overrides in assets/css/theme-extras.css */