/*
Theme Name: SSS Citywide Elegant
Theme URI: https://www.securityservicessolutions.com/
Author: Security Services Solutions
Description: Custom WordPress theme for Security Services Solutions using the Citywide Elegant design system. No page builder required.
Version: 1.0.0
License: Private
Text Domain: sss-elegant
*/

/* =====================================================
   DESIGN TOKENS — CITYWIDE ELEGANT SYSTEM
   ===================================================== */
:root {
  --navy-deep:  #07111e;
  --navy-mid:   #0d1b2a;
  --navy-card:  #111f30;
  --navy-lift:  #162539;
  --gold:       #c9a84c;
  --gold-light: #e2c97e;
  --muted:      #8fa0b4;
  --white:      #ffffff;
  --body-max:   1200px;
  --radius:     4px;
  --transition: 0.25s ease;
}

/* =====================================================
   RESET & BASE
   ===================================================== */
*, *::before, *::after { box-sizing: border-box !important; margin: 0 !important; padding: 0 !important; }

html { scroll-behavior: smooth !important; }

body {
  background: #07111e !important;
  color: #ffffff !important;
  font-family: 'Source Sans 3', 'Segoe UI', sans-serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  -webkit-font-smoothing: antialiased !important;
}

img { max-width: 100% !important; height: auto !important; display: block !important; }
a { color: #c9a84c !important; text-decoration: none !important; transition: color 0.25s ease !important; }
a:hover { color: #e2c97e !important; }
ul { list-style: none !important; }

/* =====================================================
   TYPOGRAPHY
   ===================================================== */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
}
h1 { font-size: clamp(2.2rem, 4.5vw, 3.6rem) !important; }
h2 { font-size: clamp(1.8rem, 3vw, 2.6rem) !important; }
h3 { font-size: clamp(1.3rem, 2.2vw, 1.8rem) !important; }
h4 { font-size: 1.2rem !important; }
p { margin-bottom: 1.2em !important; color: rgba(255,255,255,0.85) !important; }
p:last-child { margin-bottom: 0 !important; }

/* =====================================================
   LAYOUT UTILITIES
   ===================================================== */
.sss-container { max-width: 1200px !important; margin: 0 auto !important; padding: 0 32px !important; }
.sss-section { padding: 96px 0 !important; }
.sss-section--sm { padding: 64px 0 !important; }
.sss-grid-3 { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 24px !important; }
.sss-grid-2 { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 32px !important; }
.sss-grid-4 { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 20px !important; }
.sss-flex { display: flex !important; align-items: center !important; }
.sss-text-center { text-align: center !important; }
.sss-text-gold { color: #c9a84c !important; }

/* =====================================================
   SECTION LABEL
   ===================================================== */
.sss-section-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #c9a84c !important;
  margin-bottom: 20px !important;
}
.sss-section-label::before {
  content: '' !important;
  display: block !important;
  width: 40px !important;
  height: 2px !important;
  background: #c9a84c !important;
  flex-shrink: 0 !important;
}

/* =====================================================
   BUTTONS
   ===================================================== */
.btn-gold {
  display: inline-block !important;
  background: #c9a84c !important;
  color: #07111e !important;
  -webkit-text-fill-color: #07111e !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 16px 36px !important;
  border-radius: 2px !important;
  border: 2px solid #c9a84c !important;
  transition: all 0.25s ease !important;
  cursor: pointer !important;
}
.btn-gold:hover {
  background: #e2c97e !important;
  color: #07111e !important;
  -webkit-text-fill-color: #07111e !important;
  border-color: #e2c97e !important;
  transform: translateY(-2px) !important;
}
.btn-outline {
  display: inline-block !important;
  background: transparent !important;
  color: #c9a84c !important;
  -webkit-text-fill-color: #c9a84c !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 14px 34px !important;
  border-radius: 2px !important;
  border: 2px solid #c9a84c !important;
  transition: all 0.25s ease !important;
  cursor: pointer !important;
}
.btn-outline:hover {
  background: rgba(201,168,76,0.12) !important;
  color: #e2c97e !important;
  -webkit-text-fill-color: #e2c97e !important;
  border-color: #e2c97e !important;
}
.sss-btn-group { display: flex !important; gap: 16px !important; flex-wrap: wrap !important; }

/* =====================================================
   NAVIGATION
   ===================================================== */
.sss-nav-wrap {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: rgba(7,17,30,0.97) !important;
  backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid rgba(201,168,76,0.2) !important;
}
.sss-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 72px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
}
.sss-nav-logo {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  letter-spacing: 0.04em !important;
}
.sss-nav-logo span { color: #c9a84c !important; -webkit-text-fill-color: #c9a84c !important; }
.sss-nav-menu { display: flex !important; align-items: center !important; gap: 32px !important; }
.sss-nav-menu a {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.8) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.8) !important;
  transition: color 0.2s ease !important;
}
.sss-nav-menu a:hover {
  color: #c9a84c !important;
  -webkit-text-fill-color: #c9a84c !important;
}
.sss-nav-menu .nav-cta {
  background: #c9a84c !important;
  color: #07111e !important;
  -webkit-text-fill-color: #07111e !important;
  padding: 10px 24px !important;
  border-radius: 2px !important;
}
.sss-nav-menu .nav-cta:hover { background: #e2c97e !important; color: #07111e !important; -webkit-text-fill-color: #07111e !important; }

/* Mobile hamburger */
.sss-nav-toggle { display: none !important; flex-direction: column !important; gap: 5px !important; cursor: pointer !important; background: none !important; border: none !important; padding: 4px !important; }
.sss-nav-toggle span { display: block !important; width: 24px !important; height: 2px !important; background: #c9a84c !important; transition: all 0.3s ease !important; }

/* =====================================================
   NAV DROPDOWN SUBMENUS
   ===================================================== */
.sss-nav-menu li { position: relative !important; }
.sss-sub-menu {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  min-width: 240px !important;
  background: #0d1b2a !important;
  border: 1px solid rgba(201,168,76,0.2) !important;
  border-top: 2px solid #c9a84c !important;
  padding: 8px 0 !important;
  z-index: 9999 !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.4) !important;
  flex-direction: column !important;
  gap: 0 !important;
}
.sss-nav-menu li:hover > .sss-sub-menu,
.sss-nav-menu li:focus-within > .sss-sub-menu { display: flex !important; }
.sss-sub-menu li { width: 100% !important; }
.sss-sub-menu li a {
  display: block !important;
  padding: 10px 20px !important;
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
  color: rgba(255,255,255,0.8) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.8) !important;
  transition: all 0.15s ease !important;
  border-left: 2px solid transparent !important;
}
.sss-sub-menu li a:hover {
  background: rgba(201,168,76,0.08) !important;
  color: #c9a84c !important;
  -webkit-text-fill-color: #c9a84c !important;
  border-left-color: #c9a84c !important;
  padding-left: 24px !important;
}
/* Chevron indicator on parent items */
.has-children > a::after {
  content: ' ▾' !important;
  font-size: 0.6rem !important;
  opacity: 0.6 !important;
}

/* =====================================================
   HERO — DOT GRID + DIAGONAL CLIP
   ===================================================== */
.sss-hero {
  position: relative !important;
  min-height: 88vh !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  background: radial-gradient(ellipse at 60% 40%, #0d1b2a 0%, #07111e 70%) !important;
}
.sss-hero-bg {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}
/* dot grid */
.sss-hero-bg::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, rgba(201,168,76,0.08) 1px, transparent 1px) !important;
  background-size: 36px 36px !important;
}
/* diagonal clip overlay */
.sss-hero-bg::after {
  content: '' !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  width: 45% !important;
  height: 100% !important;
  background: linear-gradient(135deg, transparent 40%, rgba(201,168,76,0.04) 100%) !important;
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%) !important;
}
/* vertical gold rule */
.sss-hero-vline {
  position: absolute !important;
  left: calc((100vw - 1200px) / 2 + 32px) !important;
  top: 0 !important;
  width: 2px !important;
  height: 100% !important;
  background: linear-gradient(to bottom, transparent, #c9a84c 30%, #c9a84c 70%, transparent) !important;
  opacity: 0.3 !important;
}
.sss-hero-inner {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 120px 32px 100px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 56px !important;
  width: 100% !important;
}
.sss-hero-copy {
  max-width: 820px !important;
}
.sss-hero-copy .sss-eyebrow {
  animation: fadeUp 0.6s ease both !important;
  animation-delay: 0.1s !important;
}
.sss-hero-copy h1 {
  animation: fadeUp 0.6s ease both !important;
  animation-delay: 0.25s !important;
  margin-bottom: 24px !important;
}
.sss-hero-copy .sss-hero-lead {
  font-size: 1.15rem !important;
  color: rgba(255,255,255,0.75) !important;
  max-width: 680px !important;
  margin-bottom: 40px !important;
  animation: fadeUp 0.6s ease both !important;
  animation-delay: 0.4s !important;
}
.sss-hero-copy .sss-btn-group {
  animation: fadeUp 0.6s ease both !important;
  animation-delay: 0.55s !important;
}
.sss-hero-stats {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 2px !important;
  background: #c9a84c !important;
  border: 2px solid #c9a84c !important;
  animation: fadeUp 0.6s ease both !important;
  animation-delay: 0.35s !important;
  max-width: 100% !important;
}
.sss-stat-cell {
  background: #111f30 !important;
  padding: 28px 20px !important;
  text-align: center !important;
  transition: background 0.25s ease !important;
}
.sss-stat-cell:hover { background: #162539 !important; }
.sss-stat-num {
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 2.2rem !important;
  font-weight: 900 !important;
  color: #c9a84c !important;
  line-height: 1 !important;
  margin-bottom: 6px !important;
}
.sss-stat-label {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #8fa0b4 !important;
}

/* =====================================================
   TRUST BAR
   ===================================================== */
.sss-trust {
  background: #111f30 !important;
  border-top: 1px solid rgba(201,168,76,0.2) !important;
  border-bottom: 1px solid rgba(201,168,76,0.2) !important;
  padding: 28px 0 !important;
}
.sss-trust-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 32px !important;
  flex-wrap: wrap !important;
}
.sss-trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #8fa0b4 !important;
}
.sss-trust-item svg { color: #c9a84c !important; flex-shrink: 0 !important; }

/* =====================================================
   INTRO SECTION
   ===================================================== */
.sss-intro { background: #07111e !important; }
.sss-intro-inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 80px !important;
  align-items: center !important;
}
.sss-intro-shield {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* =====================================================
   CARDS
   ===================================================== */
.sss-card {
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.15) !important;
  padding: 36px 28px !important;
  border-radius: 2px !important;
  transition: all 0.25s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
.sss-card::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 2px !important;
  background: #c9a84c !important;
  transition: width 0.3s ease !important;
}
.sss-card:hover { background: #162539 !important; transform: translateY(-4px) !important; }
.sss-card:hover::after { width: 100% !important; }
.sss-card-icon {
  width: 48px !important;
  height: 48px !important;
  background: rgba(201,168,76,0.12) !important;
  border-radius: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 20px !important;
  color: #c9a84c !important;
}
.sss-card h3 { font-size: 1.2rem !important; margin-bottom: 12px !important; }
.sss-card p { font-size: 0.95rem !important; color: #8fa0b4 !important; margin-bottom: 0 !important; }
.sss-card-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #c9a84c !important;
  -webkit-text-fill-color: #c9a84c !important;
  margin-top: 20px !important;
}

/* =====================================================
   SERVICES SECTION
   ===================================================== */
.sss-services { background: #0d1b2a !important; }
.sss-services-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2px !important;
  background: rgba(201,168,76,0.15) !important;
  margin-top: 48px !important;
}
.sss-service-item {
  background: #111f30 !important;
  padding: 32px 24px !important;
  transition: background 0.25s ease !important;
  cursor: pointer !important;
}
.sss-service-item:hover { background: #162539 !important; }
.sss-service-item h4 { margin-bottom: 10px !important; }
.sss-service-item p { font-size: 0.9rem !important; color: #8fa0b4 !important; margin: 0 !important; }

/* =====================================================
   AREAS SERVED
   ===================================================== */
.sss-areas { background: #07111e !important; }
.sss-areas-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  margin-top: 40px !important;
}
.sss-area-item {
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.12) !important;
  padding: 18px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  transition: all 0.2s ease !important;
  border-radius: 2px !important;
}
.sss-area-item:hover { border-color: rgba(201,168,76,0.4) !important; background: #162539 !important; }
.sss-area-item::before {
  content: '' !important;
  width: 6px !important;
  height: 6px !important;
  background: #c9a84c !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}
.sss-area-item span { font-size: 0.95rem !important; font-weight: 500 !important; }

/* =====================================================
   SPLIT SECTION
   ===================================================== */
.sss-split { background: #0d1b2a !important; }
.sss-split-inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 80px !important;
  align-items: start !important;
}
.sss-split-divider {
  width: 1px !important;
  background: linear-gradient(to bottom, transparent, rgba(201,168,76,0.4), transparent) !important;
  align-self: stretch !important;
}
.sss-feature-list { margin-top: 28px !important; }
.sss-feature-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
.sss-feature-item:last-child { border-bottom: none !important; }
.sss-feature-icon {
  width: 36px !important;
  height: 36px !important;
  background: rgba(201,168,76,0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  border-radius: 2px !important;
  color: #c9a84c !important;
  margin-top: 2px !important;
}
.sss-feature-item h4 { font-size: 1rem !important; margin-bottom: 4px !important; }
.sss-feature-item p { font-size: 0.9rem !important; color: #8fa0b4 !important; margin: 0 !important; }

/* =====================================================
   CASE STUDY
   ===================================================== */
.sss-case { background: #111f30 !important; border-top: 1px solid rgba(201,168,76,0.15) !important; border-bottom: 1px solid rgba(201,168,76,0.15) !important; }
.sss-case-inner {
  display: grid !important;
  grid-template-columns: 1fr 2fr !important;
  gap: 64px !important;
  align-items: center !important;
}
.sss-case-meta { padding: 0 !important; }
.sss-case-tag {
  display: inline-block !important;
  background: rgba(201,168,76,0.12) !important;
  color: #c9a84c !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding: 6px 14px !important;
  border-radius: 2px !important;
  margin-bottom: 20px !important;
}
.sss-case-results {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  margin-top: 32px !important;
}
.sss-result-num {
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 2rem !important;
  font-weight: 900 !important;
  color: #c9a84c !important;
  line-height: 1 !important;
}
.sss-result-label { font-size: 0.8rem !important; color: #8fa0b4 !important; margin-top: 4px !important; display: block !important; }

/* =====================================================
   TESTIMONIAL
   ===================================================== */
.sss-testimonial { background: #07111e !important; }
.sss-testimonial-inner {
  max-width: 800px !important;
  margin: 0 auto !important;
  text-align: center !important;
  position: relative !important;
}
.sss-quote-mark {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic !important;
  font-size: 160px !important;
  line-height: 0.5 !important;
  color: rgba(201,168,76,0.2) !important;
  display: block !important;
  margin-bottom: 16px !important;
}
.sss-testimonial blockquote {
  font-family: 'Playfair Display', serif !important;
  font-style: italic !important;
  font-size: clamp(1.2rem, 2.2vw, 1.6rem) !important;
  color: rgba(255,255,255,0.9) !important;
  line-height: 1.6 !important;
  margin-bottom: 32px !important;
}
.sss-testimonial-author { font-size: 0.85rem !important; font-weight: 700 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: #c9a84c !important; }
.sss-testimonial-role { font-size: 0.82rem !important; color: #8fa0b4 !important; margin-top: 4px !important; }

/* =====================================================
   INDUSTRIES
   ===================================================== */
.sss-industries { background: #0d1b2a !important; }
.sss-industries-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
  margin-top: 48px !important;
}
.sss-industry-card {
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.1) !important;
  padding: 28px 24px !important;
  text-align: center !important;
  transition: all 0.25s ease !important;
  border-radius: 2px !important;
}
.sss-industry-card:hover { background: #162539 !important; border-color: rgba(201,168,76,0.35) !important; }
.sss-industry-card svg { color: #c9a84c !important; margin: 0 auto 16px !important; }
.sss-industry-card h4 { font-size: 1rem !important; margin-bottom: 8px !important; }
.sss-industry-card p { font-size: 0.88rem !important; color: #8fa0b4 !important; margin: 0 !important; }

/* =====================================================
   BACKLINKS / INTERNAL LINKS GRID
   ===================================================== */
.sss-links { background: #111f30 !important; }
.sss-links-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  margin-top: 48px !important;
}
.sss-links-column h4 {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #c9a84c !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(201,168,76,0.25) !important;
}
.sss-links-column ul li { margin-bottom: 10px !important; }
.sss-links-column ul li a {
  font-size: 0.9rem !important;
  color: rgba(255,255,255,0.75) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.75) !important;
  transition: color 0.2s ease !important;
}
.sss-links-column ul li a:hover { color: #c9a84c !important; -webkit-text-fill-color: #c9a84c !important; }

/* money link style */
.sss-money-link {
  color: #c9a84c !important;
  -webkit-text-fill-color: #c9a84c !important;
  border-bottom: 1px solid rgba(201,168,76,0.3) !important;
}
.sss-money-link:hover { border-bottom-color: #c9a84c !important; }

/* =====================================================
   KEYWORDS / TAG CLOUD
   ===================================================== */
.sss-keywords { background: #07111e !important; }
.sss-keywords-wrap {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 36px !important;
}
.sss-keyword-tag {
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.2) !important;
  color: #8fa0b4 !important;
  font-size: 0.8rem !important;
  padding: 7px 16px !important;
  border-radius: 2px !important;
  transition: all 0.2s ease !important;
}
.sss-keyword-tag:hover { border-color: #c9a84c !important; color: #c9a84c !important; -webkit-text-fill-color: #c9a84c !important; }

/* =====================================================
   CTA SECTION
   ===================================================== */
.sss-cta {
  background: #0d1b2a !important;
  position: relative !important;
  overflow: hidden !important;
}
.sss-cta-dot-texture {
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, rgba(201,168,76,0.06) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
  pointer-events: none !important;
}
.sss-cta-inner {
  position: relative !important;
  z-index: 2 !important;
  text-align: center !important;
  max-width: 700px !important;
  margin: 0 auto !important;
}
.sss-cta-inner h2 { margin-bottom: 16px !important; }
.sss-cta-inner p { font-size: 1.05rem !important; color: rgba(255,255,255,0.7) !important; margin-bottom: 40px !important; }
.sss-cta-inner .sss-btn-group { justify-content: center !important; }

/* =====================================================
   FOOTER BAR
   ===================================================== */
.sss-footer {
  background: #07111e !important;
  border-top: 1px solid rgba(201,168,76,0.2) !important;
  padding: 40px 0 !important;
}
.sss-footer-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}
.sss-footer-brand {
  font-family: 'Playfair Display', serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}
.sss-footer-brand span { color: #c9a84c !important; }
.sss-footer-links { display: flex !important; gap: 24px !important; flex-wrap: wrap !important; }
.sss-footer-links a {
  font-size: 0.82rem !important;
  color: #8fa0b4 !important;
  -webkit-text-fill-color: #8fa0b4 !important;
  transition: color 0.2s ease !important;
}
.sss-footer-links a:hover { color: #c9a84c !important; -webkit-text-fill-color: #c9a84c !important; }
.sss-footer-copy { font-size: 0.8rem !important; color: rgba(143,160,180,0.6) !important; }
.sss-footer-address { font-size: 0.8rem !important; color: #8fa0b4 !important; font-style: normal !important; }

/* =====================================================
   ANIMATIONS
   ===================================================== */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sss-fade-up { animation: fadeUp 0.6s ease both !important; }

/* =====================================================
   BREADCRUMB
   ===================================================== */
.sss-breadcrumb {
  background: #0d1b2a !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid rgba(201,168,76,0.1) !important;
}
.sss-breadcrumb-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  font-size: 0.82rem !important;
  color: #8fa0b4 !important;
}
.sss-breadcrumb-inner a { color: #8fa0b4 !important; -webkit-text-fill-color: #8fa0b4 !important; }
.sss-breadcrumb-inner a:hover { color: #c9a84c !important; -webkit-text-fill-color: #c9a84c !important; }
.sss-breadcrumb-inner span { color: #c9a84c !important; margin: 0 6px !important; }

/* =====================================================
   BLOG / ARCHIVE
   ===================================================== */
.sss-blog { background: #07111e !important; }
.sss-blog-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  margin-top: 48px !important;
}
.sss-post-card {
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.1) !important;
  border-radius: 2px !important;
  overflow: hidden !important;
  transition: all 0.25s ease !important;
}
.sss-post-card:hover { transform: translateY(-4px) !important; border-color: rgba(201,168,76,0.3) !important; }
.sss-post-card-body { padding: 24px !important; }
.sss-post-meta { font-size: 0.78rem !important; color: #8fa0b4 !important; margin-bottom: 12px !important; }
.sss-post-card h3 { font-size: 1.1rem !important; margin-bottom: 10px !important; }
.sss-post-card p { font-size: 0.9rem !important; color: #8fa0b4 !important; }

/* =====================================================
   SINGLE POST
   ===================================================== */
.sss-single { background: #07111e !important; }
.sss-single-inner { max-width: 760px !important; margin: 0 auto !important; }
.sss-single-inner h2 { margin: 1.8em 0 0.6em !important; }
.sss-single-inner h3 { margin: 1.5em 0 0.5em !important; }
.sss-single-inner p { margin-bottom: 1.4em !important; line-height: 1.8 !important; }
.sss-single-inner ul, .sss-single-inner ol { padding-left: 1.5em !important; margin-bottom: 1.4em !important; color: rgba(255,255,255,0.85) !important; }
.sss-single-inner li { margin-bottom: 0.5em !important; }

/* =====================================================
   PAGE HERO (non-homepage)
   ===================================================== */
.sss-page-hero {
  background: linear-gradient(135deg, #07111e 0%, #0d1b2a 100%) !important;
  padding: 80px 0 64px !important;
  border-bottom: 1px solid rgba(201,168,76,0.2) !important;
  position: relative !important;
  overflow: hidden !important;
}
.sss-page-hero::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, rgba(201,168,76,0.06) 1px, transparent 1px) !important;
  background-size: 36px 36px !important;
}
.sss-page-hero-inner { position: relative !important; z-index: 2 !important; }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width: 1024px) {
  .sss-hero-stats { grid-template-columns: repeat(2, 1fr) !important; max-width: 100% !important; }
  .sss-intro-inner { grid-template-columns: 1fr !important; gap: 48px !important; }
  .sss-split-inner { grid-template-columns: 1fr !important; gap: 48px !important; }
  .sss-split-divider { display: none !important; }
  .sss-case-inner { grid-template-columns: 1fr !important; gap: 40px !important; }
}

@media (max-width: 768px) {
  .sss-section { padding: 64px 0 !important; }
  .sss-container { padding: 0 24px !important; }
  .sss-nav-menu { display: none !important; }
  .sss-nav-toggle { display: flex !important; }
  .sss-nav-menu.is-open {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: 72px !important;
    left: 0 !important;
    right: 0 !important;
    background: #07111e !important;
    padding: 24px 32px !important;
    border-bottom: 1px solid rgba(201,168,76,0.2) !important;
    gap: 20px !important;
  }
  .sss-hero-stats { grid-template-columns: repeat(2, 1fr) !important; }
  .sss-services-grid { grid-template-columns: 1fr !important; }
  .sss-grid-3 { grid-template-columns: 1fr !important; }
  .sss-grid-2 { grid-template-columns: 1fr !important; }
  .sss-industries-grid { grid-template-columns: 1fr 1fr !important; }
  .sss-areas-grid { grid-template-columns: 1fr 1fr !important; }
  .sss-links-grid { grid-template-columns: 1fr !important; }
  .sss-blog-grid { grid-template-columns: 1fr !important; }
  .sss-trust-inner { justify-content: center !important; }
  .sss-footer-inner { flex-direction: column !important; text-align: center !important; }
  .sss-case-results { grid-template-columns: 1fr !important; }
  .sss-hero-vline { display: none !important; }
}

@media (max-width: 480px) {
  .sss-industries-grid { grid-template-columns: 1fr !important; }
  .sss-areas-grid { grid-template-columns: 1fr !important; }
  .sss-hero-stats { grid-template-columns: 1fr 1fr !important; }
}

/* =====================================================
   PAGE CONTENT — WP editor output styles
   Covers About, Contact, Quote, Privacy, standard pages
   ===================================================== */
.sss-page-content h2 { margin: 1.8em 0 0.6em !important; }
.sss-page-content h3 { margin: 1.5em 0 0.5em !important; }
.sss-page-content h4 { margin: 1.2em 0 0.4em !important; }
.sss-page-content p  { margin-bottom: 1.4em !important; line-height: 1.85 !important; }
.sss-page-content p:last-child { margin-bottom: 0 !important; }
.sss-page-content ul,
.sss-page-content ol { padding-left: 1.5em !important; margin-bottom: 1.4em !important; color: rgba(255,255,255,0.85) !important; }
.sss-page-content ul { list-style: disc !important; }
.sss-page-content ol { list-style: decimal !important; }
.sss-page-content li { margin-bottom: 0.5em !important; line-height: 1.7 !important; }
.sss-page-content a  { color: #c9a84c !important; border-bottom: 1px solid rgba(201,168,76,0.3) !important; }
.sss-page-content a:hover { color: #e2c97e !important; border-bottom-color: #e2c97e !important; }
.sss-page-content strong { color: #ffffff !important; font-weight: 700 !important; }
.sss-page-content blockquote {
  border-left: 3px solid #c9a84c !important;
  padding: 12px 20px !important;
  margin: 24px 0 !important;
  background: rgba(201,168,76,0.05) !important;
  font-style: italic !important;
  color: rgba(255,255,255,0.8) !important;
}
.sss-page-content table { width: 100% !important; border-collapse: collapse !important; margin-bottom: 1.4em !important; }
.sss-page-content th,
.sss-page-content td { padding: 10px 14px !important; border: 1px solid rgba(201,168,76,0.2) !important; text-align: left !important; font-size: 0.9rem !important; }
.sss-page-content th { background: rgba(201,168,76,0.1) !important; color: #c9a84c !important; font-weight: 700 !important; }
.sss-page-content hr { border: none !important; border-top: 1px solid rgba(201,168,76,0.2) !important; margin: 32px 0 !important; }

/* =====================================================
   SERVICE PAGE — sidebar layout class (responsive-safe)
   ===================================================== */
.sss-service-layout {
  display: grid !important;
  grid-template-columns: 2fr 1fr !important;
  gap: 64px !important;
  align-items: start !important;
}

/* =====================================================
   PAGINATION — blog archive .page-numbers
   ===================================================== */
.nav-links { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin-top: 48px !important; }
.page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 0 12px !important;
  background: #111f30 !important;
  border: 1px solid rgba(201,168,76,0.2) !important;
  color: #8fa0b4 !important;
  -webkit-text-fill-color: #8fa0b4 !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  border-radius: 2px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}
.page-numbers:hover,
.page-numbers.current {
  background: #c9a84c !important;
  border-color: #c9a84c !important;
  color: #07111e !important;
  -webkit-text-fill-color: #07111e !important;
}
.page-numbers.dots { background: transparent !important; border-color: transparent !important; }

/* =====================================================
   FOCUS STATES — keyboard / accessibility
   ===================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid #c9a84c !important;
  outline-offset: 3px !important;
  border-radius: 2px !important;
}

/* =====================================================
   SKIP LINK — screen reader / keyboard accessibility
   ===================================================== */
.sss-skip-link {
  position: absolute !important;
  top: -100px !important;
  left: 0 !important;
  z-index: 9999 !important;
  background: #c9a84c !important;
  color: #07111e !important;
  -webkit-text-fill-color: #07111e !important;
  font-weight: 700 !important;
  padding: 12px 24px !important;
  transition: top 0.2s ease !important;
}
.sss-skip-link:focus { top: 0 !important; }

/* =====================================================
   MOBILE SUBMENU ACCORDION
   ===================================================== */
.sss-sub-menu.mobile-open {
  display: flex !important;
  flex-direction: column !important;
  position: static !important;
  background: rgba(255,255,255,0.04) !important;
  border: none !important;
  border-left: 2px solid #c9a84c !important;
  padding: 4px 0 4px 12px !important;
  margin-top: 4px !important;
  box-shadow: none !important;
  min-width: unset !important;
}
.sss-sub-menu.mobile-open li a {
  padding: 10px 12px !important;
  font-size: 0.88rem !important;
  border-left: none !important;
}

/* =====================================================
   SERVICE SIDEBAR RESPONSIVE
   ===================================================== */
@media (max-width: 768px) {
  .sss-service-layout {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
}

/* =====================================================
   SUPPRESS ELEMENTOR THEME BUILDER HEADER & FOOTER
   Prevents Elementor's saved header/footer templates
   from rendering on top of our theme nav and footer.
   ===================================================== */
.elementor-location-header { display: none !important; }
.elementor-location-footer { display: none !important; }

/* Also suppress Elementor canvas/full-width page template
   conflicts on inner pages */
.elementor-page-template .elementor-section-wrap > .elementor-section:first-child { margin-top: 0 !important; }

/* =====================================================
   CUSTOM LOGO — replaces text logo in nav
   ===================================================== */
.sss-nav-logo img {
  height: 44px !important;
  width: auto !important;
  display: block !important;
  object-fit: contain !important;
}
.sss-nav-logo .custom-logo-link {
  display: flex !important;
  align-items: center !important;
}

/* =====================================================
   INTRO SHIELD — replaceable via media
   ===================================================== */
.sss-intro-shield-img {
  width: 100% !important;
  max-width: 380px !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
  border-radius: 4px !important;
}

/* =====================================================
   HERO IMAGE SIZING — confirmed 1200x500 support
   background-size cover handles any uploaded ratio
   ===================================================== */
.sss-hero[style*="background-image"] {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}
.sss-page-hero[style*="background-image"] {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* =====================================================
   HERO MINIMUM HEIGHT — inner pages
   ===================================================== */
.sss-page-hero { min-height: 320px !important; }