/* ============================================================
   Lucky General — Design System
   lg-styles.css  |  v2.0
   Colors: Navy #0B1D3A  Gold #D4A029  White #FFFFFF
   Font: Manrope
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --lg-navy:        #0B1D3A;
  --lg-navy-deep:   #071326;
  --lg-navy-mid:    #142444;
  --lg-gold:        #D4A029;
  --lg-gold-light:  #E5BF5A;
  --lg-gold-dark:   #A87E1C;
  --lg-white:       #FFFFFF;
  --lg-bg:          #F5F6F8;
  --lg-bg-alt:      #EEF0F3;
  --lg-text:        #1A2540;
  --lg-text-mid:    #4A5568;
  --lg-text-light:  #718096;
  --lg-border:      #E2E8F0;
  --lg-green:       #25D366;
  --lg-radius:      8px;
  --lg-radius-lg:   12px;
  --lg-shadow:      0 2px 12px rgba(11,29,58,.10);
  --lg-shadow-md:   0 4px 24px rgba(11,29,58,.15);
  --lg-max:         1180px;
  --lg-font:        'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ── Homepage inline CSS compatibility aliases ── */
  --navy:   #0B1D3A;
  --navy2:  #142444;
  --gold:   #D4A029;
  --goldd:  #A87E1C;
  --goldl:  #FDF0C8;
  --white:  #FFFFFF;
  --bgl:    #F5F6F8;
  --bgc:    #FBF8F1;
  --text:   #1A2540;
  --text2:  #4A5568;
  --text3:  #718096;
  --line:   #E2E8F0;
  --line2:  #D0D5DD;
  --ok:     #16A34A;
  --green:  #25D366;
  --rsm:    8px;
  --rmd:    8px;
  --rlg:    12px;
  --rxl:    16px;
  --s1:     0 2px 12px rgba(11,29,58,.10);
  --s2:     0 4px 24px rgba(11,29,58,.15);
  --s3:     0 10px 32px rgba(11,29,58,.20);
  --font:   'Manrope', -apple-system, sans-serif;
  --max:    1180px;
}

/* ── RESET / BASE ────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { overflow-x: hidden; }

body {
  font-family: var(--lg-font) !important;
  color: var(--lg-text);
  background: var(--lg-white);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--lg-navy); text-decoration: none; }
a:hover { color: var(--lg-gold); }

h1, h2, h3, h4 {
  font-family: var(--lg-font) !important;
  font-weight: 700;
  line-height: 1.25;
  color: var(--lg-navy);
  margin: 0 0 .75em;
}
h1 { font-size: clamp(28px, 4vw, 44px); }
h2 { font-size: clamp(22px, 3vw, 32px); }
h3 { font-size: clamp(17px, 2vw, 21px); }
p  { margin: 0 0 1em; color: var(--lg-text-mid); line-height: 1.75; }
p:last-child { margin-bottom: 0; }
ul { padding-left: 1.25em; margin: 0 0 1em; }
li { margin-bottom: .4em; color: var(--lg-text-mid); }

/* ── KADENCE THEME OVERRIDES ─────────────────────────────── */
/* Keep Kadence header clean but minimal */
.site-header { background: var(--lg-navy) !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; }
.site-header-wrap { padding: 0 !important; min-height: 0 !important; }

/* Eliminate empty <p> tags WordPress inserts before content — they carry 32px margins */
.entry-content > p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}
/* Hide any <p> tags containing raw script text (stray JS in classic editor) */
.entry-content > p:not(:empty):has(br) {
  /* Can't target JS content directly — JS will handle hiding */
}

/* Hide the Kadence branding text if logo image is shown */
.site-branding .site-title { display: none !important; }

/* Kadence header logo sizing */
.site-branding img,
.custom-logo,
.site-logo img { max-height: 52px !important; width: auto !important; }

/* Fix Kadence header layout */
.header-layout-inner,
.header-default-layout-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  max-width: var(--lg-max) !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  gap: 24px !important;
}

/* Kadence nav styling */
.main-navigation a {
  color: rgba(255,255,255,.88) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 14px !important;
  border-radius: var(--lg-radius) !important;
  transition: color .2s, background .2s !important;
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a {
  color: var(--lg-gold) !important;
  background: rgba(201,168,76,.1) !important;
}

/* Kadence header CTA button */
.header-widget-area .btn,
.header-widget-area a[href*="quote"],
.header-widget-area a[href*="Quote"] {
  background: var(--lg-gold) !important;
  color: var(--lg-navy) !important;
  font-weight: 700 !important;
  border-radius: var(--lg-radius) !important;
  padding: 10px 22px !important;
  font-size: 14px !important;
  border: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

/* Mobile menu toggle */
.menu-toggle,
.drawer-toggle {
  color: var(--lg-white) !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  border-radius: var(--lg-radius) !important;
  padding: 8px 12px !important;
}

/* Kadence mobile drawer */
.mobile-navigation { background: var(--lg-navy) !important; }
.mobile-navigation a { color: rgba(255,255,255,.9) !important; padding: 12px 24px !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; display: block !important; }
.mobile-navigation a:hover { color: var(--lg-gold) !important; background: rgba(201,168,76,.08) !important; }

/* ── LAYOUT UTILITIES ─────────────────────────────────────── */
.w {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
}
.sec, section.hero, section.snv {
  padding: 60px 0;
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
/* Override padding for variants */
.sec-sm {
  padding-top: 44px !important;
  padding-bottom: 44px !important;
}
.tc { text-align: center; }

/* Margin utilities */
.mt12 { margin-top: 12px; }
.mt16 { margin-top: 16px; }
.mt18 { margin-top: 18px; }
.mt20 { margin-top: 20px; }
.mt24 { margin-top: 24px; }
.mt32 { margin-top: 32px; }
.mt48 { margin-top: 48px; }

/* Label / eyebrow */
.lbl {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lg-gold);
  margin-bottom: 10px;
}
.lead {
  font-size: 18px;
  color: var(--lg-text-mid);
  line-height: 1.65;
  max-width: 680px;
}
.sh {
  font-size: 14px;
  color: var(--lg-text-light);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.dot { display: inline-block; width: 6px; height: 6px; background: var(--lg-gold); border-radius: 50%; margin: 0 6px; vertical-align: middle; }

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--lg-font);
  font-size: 15px;
  font-weight: 600;
  padding: 13px 28px;
  border-radius: var(--lg-radius);
  border: 2px solid transparent;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: all .2s ease;
  line-height: 1;
}
/* Primary - gold */
.btn-p {
  background: var(--lg-gold);
  color: var(--lg-navy);
  border-color: var(--lg-gold);
}
.btn-p:hover {
  background: var(--lg-gold-dark);
  border-color: var(--lg-gold-dark);
  color: var(--lg-navy);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(201,168,76,.4);
}
/* Secondary - navy outline */
.btn-s {
  background: transparent;
  color: var(--lg-navy);
  border-color: var(--lg-navy);
}
.btn-s:hover { background: var(--lg-navy); color: var(--lg-white); }
/* Black/navy solid */
.btn-bl {
  background: var(--lg-navy);
  color: var(--lg-white);
  border-color: var(--lg-navy);
}
.btn-bl:hover { background: var(--lg-navy-mid); color: var(--lg-white); transform: translateY(-1px); }
/* Ghost white */
.btn-gw {
  background: rgba(255,255,255,.12);
  color: var(--lg-white);
  border-color: rgba(255,255,255,.35);
  backdrop-filter: blur(4px);
}
.btn-gw:hover { background: rgba(255,255,255,.22); color: var(--lg-white); }
/* WhatsApp */
.btn-wa {
  background: var(--lg-green);
  color: var(--lg-white);
  border-color: var(--lg-green);
}
.btn-wa:hover { background: #1ebe59; color: var(--lg-white); transform: translateY(-1px); }
/* Size modifiers */
.btn-sm { padding: 9px 18px; font-size: 13px; }
.btn-lg { padding: 16px 36px; font-size: 16px; }

/* ── HIDE KADENCE HEADER + INLINE LEGACY HEADER ─────────── */
#masthead { display: none !important; }
/* Hide inline .site-hdr / .hdr-fixed in page content — replaced by .lg-hdr */
.site-hdr, .hdr-fixed { display: none !important; }

/* ── GLOBAL SITE HEADER (.lg-hdr) ───────────────────────── */
.lg-hdr {
  background: var(--lg-navy);
  position: sticky;
  top: 0;
  z-index: 9000;
  border-bottom: 1px solid rgba(255,255,255,.08);
  width: 100%;
}
.lg-hdr-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
  height: 68px;
}
.lg-hdr-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}
.lg-hdr-logo svg { border-radius: 6px; }
.lg-hdr-logo-txt {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.lg-hdr-logo-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--lg-white);
  letter-spacing: .02em;
}
.lg-hdr-logo-sub {
  font-size: 10px;
  color: var(--lg-gold);
  text-transform: uppercase;
  letter-spacing: .15em;
}
.lg-hdr-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
  justify-content: center;
}
.lg-hdr-nav a {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,.85);
  padding: 6px 14px;
  border-radius: 6px;
  transition: color .2s, background .2s;
  text-decoration: none;
}
.lg-hdr-nav a:hover { color: var(--lg-white); background: rgba(255,255,255,.08); }
.lg-hdr-acts {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.lg-hdr-phone {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.75);
  text-decoration: none;
  transition: color .2s;
}
.lg-hdr-phone:hover { color: var(--lg-gold); }
.lg-hdr-cta { font-size: 14px; padding: 10px 20px; }
.lg-hbg {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
}
.lg-hbg span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--lg-white);
  border-radius: 2px;
}

/* ── MOBILE NAV DRAWER ───────────────────────────────────── */
.lg-mob-menu {
  position: fixed;
  top: 0; right: -100%;
  width: min(320px, 85vw);
  height: 100%;
  background: var(--lg-navy);
  z-index: 9100;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: right .3s ease;
  overflow-y: auto;
}
.lg-mob-menu.is-open { right: 0; }
.lg-mob-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}
.lg-mob-brand { font-size: 16px; font-weight: 700; color: var(--lg-white); }
.lg-mob-close {
  background: none;
  border: 1px solid rgba(255,255,255,.2);
  color: var(--lg-white);
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  display: flex; align-items: center; justify-content: center;
}
.lg-mob-menu a {
  display: block;
  padding: 12px 16px;
  color: rgba(255,255,255,.85);
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  border-radius: 8px;
  transition: background .2s;
}
.lg-mob-menu a:hover { background: rgba(255,255,255,.08); color: var(--lg-white); }
.hdr-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
  height: 68px;
}
.hdr-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}
.hdr-logo img {
  max-height: 44px;
  width: auto;
}
.hdr-logo-txt {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.hdr-logo-txt strong {
  font-size: 16px;
  font-weight: 700;
  color: var(--lg-white);
  letter-spacing: .02em;
}
.hdr-logo-txt span {
  font-size: 10px;
  color: var(--lg-gold);
  text-transform: uppercase;
  letter-spacing: .15em;
}
.hdr-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
  justify-content: center;
}
.hdr-nav a {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,.85);
  padding: 7px 14px;
  border-radius: var(--lg-radius);
  transition: color .2s, background .2s;
  text-decoration: none;
  white-space: nowrap;
}
.hdr-nav a:hover { color: var(--lg-gold); background: rgba(201,168,76,.1); }
.hdr-acts {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.hdr-phone {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,.8);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color .2s;
}
.hdr-phone:hover { color: var(--lg-gold); }

/* Hamburger */
.hbg {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: var(--lg-radius);
  cursor: pointer;
  padding: 0;
}
.hbg span {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--lg-white);
  border-radius: 2px;
  transition: all .2s;
}

/* Mobile menu overlay */
.mob-menu {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--lg-navy);
  z-index: 9000;
  padding: 24px;
  flex-direction: column;
  overflow-y: auto;
}
.mob-menu.is-open { display: flex; }
.mob-close {
  align-self: flex-end;
  background: transparent;
  border: 1px solid rgba(255,255,255,.3);
  color: var(--lg-white);
  width: 40px;
  height: 40px;
  border-radius: var(--lg-radius);
  cursor: pointer;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mob-acts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 32px;
}
.mob-acts a {
  display: block;
  padding: 16px 20px;
  color: rgba(255,255,255,.9);
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  transition: color .2s;
}
.mob-acts a:hover { color: var(--lg-gold); }
.mob-acts .btn { margin-top: 16px; }

/* ── HERO SECTION ────────────────────────────────────────── */
.hero {
  background: linear-gradient(135deg, var(--lg-navy-deep) 0%, var(--lg-navy) 50%, var(--lg-navy-mid) 100%);
  position: relative;
  overflow: hidden;
  padding: 80px 0 72px;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 600px 400px at 80% 50%, rgba(201,168,76,.08) 0%, transparent 70%),
    url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C9A84C' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.hero-in {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 60px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.hero-ey {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--lg-gold);
  margin-bottom: 16px;
}
.hero-ey::before {
  content: '';
  display: block;
  width: 28px;
  height: 2px;
  background: var(--lg-gold);
}
.hero h1,
.hero-s-n {
  font-size: clamp(30px, 4.5vw, 48px);
  font-weight: 800;
  color: var(--lg-white);
  line-height: 1.15;
  margin: 0 0 20px;
}
.hero-s-n em { color: var(--lg-gold); font-style: normal; }
.hero-s-l {
  font-size: clamp(14px, 1.6vw, 17px);
  color: rgba(255,255,255,.75);
  line-height: 1.7;
  margin-bottom: 32px;
  max-width: 520px;
}
.hero-cta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.hero-tel {
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.7);
  font-size: 14px;
  text-decoration: none;
  transition: color .2s;
}
.hero-tel:hover { color: var(--lg-gold); }
.hero-tel-ico {
  width: 36px;
  height: 36px;
  background: rgba(201,168,76,.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
/* Hero signal/trust row — OUTSIDE hero-vis (left column) */
.hero > .hero-in > .hero-s > .hero-sg,
.hero-in > .hero-s > .hero-sg {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* Hero-sg INSIDE hero-vis = stat cards in 2x2 grid */
.hero-vis .hero-sg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  flex-wrap: unset;
  align-items: unset;
}

/* General hero-sg (left column trust signals) */
.hero-sg {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.hero-sg span {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(255,255,255,.65);
}
.hero-sg span::before {
  content: '✓';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: rgba(201,168,76,.25);
  color: var(--lg-gold);
  border-radius: 50%;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
}

/* Stat card (used inside .hero-vis .hero-sg) */
.hero-s {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--lg-radius);
  padding: 14px 16px;
}
.hero-s-n {
  font-size: 26px;
  font-weight: 800;
  color: var(--lg-gold);
  line-height: 1;
  margin-bottom: 4px;
}
.hero-s-l {
  font-size: 12px;
  color: rgba(255,255,255,.6);
  line-height: 1.35;
}
/* Hero right column - visual card */
.hero-vis {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--lg-radius-lg);
  backdrop-filter: blur(12px);
  padding: 28px;
}
.hero-vis-lbl {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lg-gold);
  margin-bottom: 18px;
  display: block;
}
/* Hero benefit check rows */
.hero-ben { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.hero-rc {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.hero-rc-ico {
  width: 28px;
  height: 28px;
  background: rgba(201,168,76,.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--lg-gold);
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}
.hero-rc-txt strong {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--lg-white);
  margin-bottom: 2px;
}
.hero-rc-txt span {
  font-size: 13px;
  color: rgba(255,255,255,.6);
}
/* Hero cards (small stat cards) */
.hero-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.hero-card-item {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--lg-radius);
  padding: 14px;
  text-align: center;
}
.hero-card-item strong {
  display: block;
  font-size: 22px;
  font-weight: 800;
  color: var(--lg-gold);
}
.hero-card-item span {
  font-size: 12px;
  color: rgba(255,255,255,.6);
  line-height: 1.3;
}
/* Hero description block */
.hero-desc {
  font-size: 15px;
  color: rgba(255,255,255,.7);
  line-height: 1.7;
  margin-bottom: 20px;
}

/* ── TRUST BAR ───────────────────────────────────────────── */
.trust-bar {
  background: var(--lg-navy-deep);
  border-top: 1px solid rgba(201,168,76,.2);
  border-bottom: 1px solid rgba(201,168,76,.2);
  padding: 18px 0;
}
.trust-grid {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 32px;
}
.trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.trust-ico {
  font-size: 18px;
  color: var(--lg-gold);
  flex-shrink: 0;
  line-height: 1;
}
.trust-txt { display: flex; flex-direction: column; line-height: 1.2; }
.trust-txt strong {
  font-size: 13px;
  font-weight: 700;
  color: var(--lg-white);
}
.trust-txt span {
  font-size: 12px;
  color: rgba(255,255,255,.55);
}

/* ── WHY CHOOSE ──────────────────────────────────────────── */
.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
}
.why-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  position: relative;
  transition: box-shadow .25s, transform .25s;
}
.why-card:hover {
  box-shadow: var(--lg-shadow-md);
  transform: translateY(-3px);
}
.why-n {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--lg-gold);
  text-transform: uppercase;
  margin-bottom: 12px;
}
.why-ico {
  font-size: 28px;
  margin-bottom: 12px;
  line-height: 1;
}
.why-card h3 {
  font-size: 17px;
  margin-bottom: 10px;
  color: var(--lg-navy);
}
.why-card p { font-size: 14px; color: var(--lg-text-mid); margin: 0; }

/* ── SERVICES GRID ───────────────────────────────────────── */
.svc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}
.svc-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  text-decoration: none;
  display: block;
  transition: box-shadow .25s, transform .25s, border-color .25s;
  position: relative;
  overflow: hidden;
}
.svc-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--lg-gold);
  transform: scaleX(0);
  transition: transform .25s;
  transform-origin: left;
}
.svc-card:hover { box-shadow: var(--lg-shadow-md); transform: translateY(-3px); border-color: var(--lg-gold-light); }
.svc-card:hover::before { transform: scaleX(1); }
.svc-ico {
  font-size: 30px;
  margin-bottom: 14px;
  line-height: 1;
}
.svc-card h3 {
  font-size: 18px;
  color: var(--lg-navy);
  margin-bottom: 10px;
}
.svc-card p { font-size: 14px; color: var(--lg-text-mid); }
.svc-note {
  margin-top: 12px;
  font-size: 13px;
  color: var(--lg-gold);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}
.svc-note::after { content: '→'; }

/* ── INFOGRAPHIC / PROCESS ───────────────────────────────── */
.infog { }
.infog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 24px;
  counter-reset: step;
}
.infog-item {
  text-align: center;
  position: relative;
  padding-top: 16px;
}
.infog-item::before {
  counter-increment: step;
  content: counter(step, decimal-leading-zero);
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--lg-gold);
  margin-bottom: 12px;
}
.infog-ico {
  width: 56px;
  height: 56px;
  background: var(--lg-bg);
  border: 2px solid var(--lg-border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
  font-size: 22px;
  transition: background .25s, border-color .25s;
}
.infog-item:hover .infog-ico {
  background: rgba(201,168,76,.12);
  border-color: var(--lg-gold);
}
.infog-ttl {
  font-size: 14px;
  font-weight: 600;
  color: var(--lg-navy);
}
.infog-item p { font-size: 13px; color: var(--lg-text-light); margin-top: 6px; }

/* ── PLAN SECTION ────────────────────────────────────────── */
.plan-sec {
  background: var(--lg-navy);
  padding: 72px 0;
  position: relative;
  overflow: hidden;
}
.plan-sec::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(201,168,76,.06) 0%, transparent 70%);
  pointer-events: none;
}
.plan-in {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.plan-l h2 { color: var(--lg-white); }
.plan-l p { color: rgba(255,255,255,.7); margin-bottom: 28px; }
.plan-bens { display: flex; flex-direction: column; gap: 12px; }
.plan-ben {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.plan-ben-chk {
  width: 22px;
  height: 22px;
  background: rgba(201,168,76,.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--lg-gold);
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}
.plan-ben p { font-size: 14px; color: rgba(255,255,255,.7); margin: 0; }
.plan-r {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--lg-radius-lg);
  padding: 32px;
  backdrop-filter: blur(8px);
}

/* ── LOCAL / AREAS SECTION ───────────────────────────────── */
.local-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 900px) {
  .local-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .local-cards { grid-template-columns: 1fr; }
}
.local-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 24px 20px;
  text-align: center;
  text-decoration: none;
  display: block;
  transition: box-shadow .25s, transform .25s, border-color .25s;
}
.local-card:hover { box-shadow: var(--lg-shadow); transform: translateY(-2px); border-color: var(--lg-gold-light); }
.local-card h3 { font-size: 16px; color: var(--lg-navy); margin-bottom: 8px; }
.local-card p { font-size: 13px; color: var(--lg-text-light); margin: 0; }

/* Area grid */
.area-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
}
.area-g {
  background: var(--lg-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius);
  padding: 12px 16px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--lg-navy);
  transition: background .2s, border-color .2s;
}
.area-g:hover { background: rgba(201,168,76,.08); border-color: var(--lg-gold); }
.area-badge {
  display: inline-block;
  background: rgba(201,168,76,.15);
  color: var(--lg-gold-dark);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 20px;
  margin-top: 4px;
}
.area-list { display: flex; flex-wrap: wrap; gap: 8px; }
/* local-grid: 2-column layout — cards left, map/list right */
.local-grid {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  align-items: start;
}
/* On narrow viewports, stack */
@media (max-width: 900px) {
  .local-grid { grid-template-columns: 1fr; }
}
.local-lm { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--lg-text-mid); }
.local-lm-dot { width: 8px; height: 8px; background: var(--lg-gold); border-radius: 50%; flex-shrink: 0; }
.local-map {
  background: var(--lg-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 200px;
}
.local-map-in { text-align: center; }
.local-map-lbl { font-size: 14px; color: var(--lg-text-light); margin-top: 12px; }

/* Building access grid */
.ba-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}
.ba-slot {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 24px 20px;
}
.ba-ico { font-size: 28px; margin-bottom: 12px; }
.ba-slot h3 { font-size: 16px; color: var(--lg-navy); margin-bottom: 8px; }
.ba-slot p { font-size: 14px; color: var(--lg-text-mid); margin: 0; }

/* ── REVIEWS / TESTIMONIALS ──────────────────────────────── */
.rev-ph {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  box-shadow: var(--lg-shadow);
  transition: box-shadow .25s;
}
.rev-ph:hover { box-shadow: var(--lg-shadow-md); }
.rev-ph-ico {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, var(--lg-navy) 0%, var(--lg-navy-mid) 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--lg-white);
  font-weight: 700;
  margin-bottom: 12px;
  flex-shrink: 0;
}
.rev-stars {
  color: var(--lg-gold);
  font-size: 15px;
  letter-spacing: 2px;
  margin-bottom: 10px;
  display: block;
}
.rev-txt {
  font-size: 14px;
  color: var(--lg-text-mid);
  line-height: 1.7;
  font-style: italic;
  margin-bottom: 16px;
}
.rev-author {
  font-size: 13px;
  font-weight: 600;
  color: var(--lg-navy);
}
.rev-date { font-size: 12px; color: var(--lg-text-light); }

/* ── FAQ ACCORDION ───────────────────────────────────────── */
.faq-list { display: flex; flex-direction: column; gap: 2px; }
.faq-item {
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius);
  overflow: hidden;
  background: var(--lg-white);
}
.faq-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-size: 16px;
  font-weight: 600;
  color: var(--lg-navy);
  font-family: var(--lg-font);
  gap: 16px;
  transition: background .2s, color .2s;
}
.faq-btn:hover { background: var(--lg-bg); }
.faq-btn[aria-expanded="true"] { background: var(--lg-navy); color: var(--lg-white); }
.faq-btn[aria-expanded="true"] .faq-chv { transform: rotate(45deg); color: var(--lg-gold); }
.faq-chv {
  font-size: 20px;
  font-weight: 300;
  color: var(--lg-gold);
  flex-shrink: 0;
  transition: transform .25s;
  line-height: 1;
}
.faq-panel {
  display: none;
  padding: 20px 22px;
  border-top: 1px solid var(--lg-border);
  background: var(--lg-white);
}
.faq-panel.is-open { display: block; }
.faq-panel p { font-size: 14px; color: var(--lg-text-mid); margin: 0; line-height: 1.75; }

/* ── FINAL CTA SECTION ───────────────────────────────────── */
.fcta {
  background: linear-gradient(135deg, var(--lg-navy-deep) 0%, var(--lg-navy) 100%);
  padding: 60px 24px;
  text-align: center;
  width: 100%;        /* fill flex parent when inside .snv .w */
  border-radius: var(--lg-radius-lg);
}
/* When .fcta is INSIDE .snv (dark section wrapper), remove its own background */
section.snv .fcta {
  background: transparent;
  border-radius: 0;
  padding: 0;
}
.fcta h2 { color: var(--lg-white); margin-bottom: 12px; }
.fcta p { color: rgba(255,255,255,.7); max-width: 560px; margin: 0 auto 32px; }
.fcta-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}
.fcta-note {
  margin-top: 16px;
  font-size: 13px;
  color: rgba(255,255,255,.5);
}

/* ── MOBILE STICKY BAR ───────────────────────────────────── */
.msbar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 8000;
  background: var(--lg-navy-deep);
  border-top: 1px solid rgba(212,160,41,.25);
  padding: 8px 16px;
  padding-bottom: max(8px, env(safe-area-inset-bottom));
  display: none;
}
.msbar-in {
  max-width: 480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 8px;
}
.msb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  border-radius: var(--lg-radius);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s;
}
.msb:hover { opacity: .88; }
.msb-w {
  background: var(--lg-green);
  color: var(--lg-white);
}
.msb-q {
  background: var(--lg-gold);
  color: var(--lg-navy);
}

/* ── FOOTER ──────────────────────────────────────────────── */
.site-footer,
.footer-layout-inner,
.site-ftr {
  background: var(--lg-navy-deep) !important;
  color: rgba(255,255,255,.7) !important;
  /* Full-bleed footer */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.ftr-in {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 56px 24px 24px;
  display: grid;
  grid-template-columns: 1.5fr repeat(3, 1fr);
  gap: 48px;
}
.ftr-col h4 {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--lg-gold);
  margin-bottom: 16px;
}
.ftr-col a, .ftr-col p {
  font-size: 14px;
  color: rgba(255,255,255,.6);
  text-decoration: none;
  display: block;
  margin-bottom: 8px;
  line-height: 1.5;
  transition: color .2s;
}
.ftr-col a:hover { color: var(--lg-white); }
.ftr-brand img { max-height: 40px; margin-bottom: 14px; }
.ftr-brand p { font-size: 13px; color: rgba(255,255,255,.5); line-height: 1.7; }
.ftr-ci { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
.ftr-ci-ico { font-size: 16px; color: var(--lg-gold); margin-top: 2px; flex-shrink: 0; }
.ftr-contacts a, .ftr-contacts p { color: rgba(255,255,255,.7); font-size: 14px; margin: 0; }
.ftr-bot {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 20px 24px;
  border-top: 1px solid rgba(255,255,255,.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  color: rgba(255,255,255,.4);
}

/* ── COMPARISON TABLE ────────────────────────────────────── */
.cmp-tbl {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  overflow: hidden;
}
.cmp-tbl th {
  background: var(--lg-navy);
  color: var(--lg-white);
  padding: 14px 18px;
  font-size: 13px;
  font-weight: 600;
  text-align: left;
}
.cmp-tbl td {
  padding: 13px 18px;
  font-size: 14px;
  color: var(--lg-text-mid);
  border-top: 1px solid var(--lg-border);
}
.cmp-tbl tr:nth-child(even) td { background: var(--lg-bg); }
.cmp-tbl tr:hover td { background: rgba(201,168,76,.05); }
.cmp-w { overflow-x: auto; }
.cmp-tag {
  display: inline-block;
  background: rgba(201,168,76,.15);
  color: var(--lg-gold-dark);
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
}
.cmp-extra { font-size: 13px; color: var(--lg-text-light); margin-top: 12px; }

/* ── PRICING ─────────────────────────────────────────────── */
.price-f {
  background: rgba(201,168,76,.08);
  border: 1px solid rgba(201,168,76,.25);
  border-radius: var(--lg-radius);
  padding: 6px 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--lg-gold-dark);
  display: inline-block;
}
.pnote {
  font-size: 13px;
  color: var(--lg-text-light);
  font-style: italic;
  margin-top: 8px;
}

/* ── GENERIC TABLE STYLING ───────────────────────────────── */
.entry-content table,
table.wp-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  overflow: hidden;
  margin: 24px 0;
  font-size: 14px;
}
.entry-content table th {
  background: var(--lg-navy);
  color: var(--lg-white);
  padding: 13px 16px;
  font-weight: 600;
  text-align: left;
  font-size: 13px;
}
.entry-content table td {
  padding: 12px 16px;
  color: var(--lg-text-mid);
  border-top: 1px solid var(--lg-border);
}
.entry-content table tr:nth-child(even) td { background: var(--lg-bg); }
.entry-content table tr:hover td { background: rgba(201,168,76,.04); }

/* ── PAGE INNER HERO (for inner pages) ───────────────────── */
.page-hero {
  background: linear-gradient(135deg, var(--lg-navy-deep) 0%, var(--lg-navy) 100%);
  padding: 56px 0 48px;
  position: relative;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 400px 300px at 90% 50%, rgba(201,168,76,.07) 0%, transparent 70%);
  pointer-events: none;
}
.page-hero .w { position: relative; z-index: 1; }
.page-hero .lbl { color: var(--lg-gold); }
.page-hero h1 { color: var(--lg-white); font-size: clamp(26px, 3.5vw, 40px); margin-bottom: 12px; }
.page-hero .lead { color: rgba(255,255,255,.7); max-width: 600px; }

/* Breadcrumb */
.page-bc {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(255,255,255,.5);
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.page-bc a { color: rgba(255,255,255,.6); text-decoration: none; }
.page-bc a:hover { color: var(--lg-gold); }
.page-bc span { color: rgba(255,255,255,.3); }

/* ── CALLOUT / WARNING BOXES ─────────────────────────────── */
.lg-callout {
  background: #FFF8E7;
  border-left: 4px solid var(--lg-gold);
  border-radius: 0 var(--lg-radius) var(--lg-radius) 0;
  padding: 18px 20px;
  margin: 24px 0;
}
.lg-callout strong { color: #7A4500; display: block; margin-bottom: 6px; font-size: 14px; font-weight: 700; }
.lg-callout p { color: #5A3400; font-size: 14px; margin: 0; }
.lg-warning-box {
  background: #FFF8E7;
  border-left: 4px solid #E8A000;
  border-radius: 0 var(--lg-radius) var(--lg-radius) 0;
  padding: 16px 20px;
  margin: 24px 0;
}
.lg-alert {
  background: #FFF3CD;
  border: 1px solid #E8A000;
  border-left: 4px solid #E8A000;
  padding: 14px 18px;
  border-radius: var(--lg-radius);
  margin: 24px 0;
}

/* ── STEP / PROCESS CARDS ────────────────────────────────── */
.step-list { display: flex; flex-direction: column; gap: 16px; }
.step-item {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 24px;
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  transition: box-shadow .25s;
}
.step-item:hover { box-shadow: var(--lg-shadow); }
.step-num {
  width: 40px;
  height: 40px;
  background: var(--lg-navy);
  color: var(--lg-gold);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 800;
  flex-shrink: 0;
}
.step-body h3 { font-size: 16px; margin-bottom: 6px; }
.step-body p { font-size: 14px; color: var(--lg-text-mid); margin: 0; }

/* ── CARD GRID (general) ─────────────────────────────────── */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}
.card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  transition: box-shadow .25s, transform .25s;
}
.card:hover { box-shadow: var(--lg-shadow); transform: translateY(-2px); }
.card-icon {
  font-size: 28px;
  margin-bottom: 14px;
  line-height: 1;
}
.card h3 { font-size: 17px; margin-bottom: 10px; }
.card p { font-size: 14px; color: var(--lg-text-mid); margin: 0; }

/* ── INFO BOX (highlight callout) ────────────────────────── */
.info-box {
  background: var(--lg-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 24px 28px;
  margin: 24px 0;
}
.info-box h3 { font-size: 17px; margin-bottom: 12px; }
.info-box p  { font-size: 14px; color: var(--lg-text-mid); }
.info-box.highlight {
  background: rgba(201,168,76,.06);
  border-color: rgba(201,168,76,.3);
}

/* Related links footer */
.related-links {
  margin: 48px 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--lg-border);
  font-size: 14px;
  color: var(--lg-text-light);
}
.related-links a {
  color: var(--lg-navy);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.related-links a:hover { color: var(--lg-gold); }

/* ── KADENCE CONTENT AREA OVERRIDES ──────────────────────── */
.entry-content-wrap { padding-bottom: 0 !important; }
.wp-singular .entry-content { max-width: 100% !important; padding: 0 !important; }
.single-content { max-width: 100% !important; }
.site-inner { padding-top: 0 !important; }

/* Remove default post title display (controlled per-section) */
.content-title-style-hide .page-title,
.content-title-style-hide .entry-title { display: none !important; }

/* ── INNER PAGE CONTENT WRAPPER ──────────────────────────── */
.inner-content {
  max-width: var(--lg-max);
  margin: 0 auto;
  padding: 64px 24px;
}
.inner-content h2 { margin-top: 48px; margin-bottom: 16px; padding-top: 16px; }
.inner-content h2:first-child { margin-top: 0; padding-top: 0; }
.inner-content h3 { margin-top: 28px; margin-bottom: 12px; }
.inner-content p { font-size: 15px; color: var(--lg-text-mid); line-height: 1.8; margin-bottom: 1em; }
.inner-content ul li { font-size: 15px; color: var(--lg-text-mid); }

/* ── SNAV / SUBNAV ───────────────────────────────────────── */
/* .snv as a standalone section = final CTA wrapper */
section.snv:not(.sec) {
  background: var(--lg-navy);
  padding: 0;
}
section.snv:not(.sec) .w {
  padding: 60px 24px;
  max-width: var(--lg-max);
  margin: 0 auto;
}
/* .sec.snv = process step nav strip (inside a section) */
.sec.snv {
  background: var(--lg-bg);
  border-bottom: 1px solid var(--lg-border);
  padding: 12px 0;
}
.sec.snv .w {
  display: flex;
  gap: 4px;
  align-items: center;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.sec.snv .w::-webkit-scrollbar { display: none; }
.sec.snv a {
  font-size: 13px;
  font-weight: 500;
  color: var(--lg-text-mid);
  padding: 6px 12px;
  border-radius: 20px;
  white-space: nowrap;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.sec.snv a:hover { background: var(--lg-white); color: var(--lg-navy); }
.sec.snv a.active { background: var(--lg-navy); color: var(--lg-white); }

/* ── PHOTO ELEMENT ───────────────────────────────────────── */
.photo {
  border-radius: var(--lg-radius-lg);
  overflow: hidden;
}
.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── SECTION BACKGROUNDS ─────────────────────────────────── */
.bg-light { background: var(--lg-bg); }
.bg-navy { background: var(--lg-navy); }
.bg-white { background: var(--lg-white); }

/* SLI = slide/carousel wrapper */
.sli { overflow: hidden; }

/* WSM (wide section with margin) */
.wsm { margin: 40px 0; }

/* TC = text center */
.tc { text-align: center; }
.tc h2, .tc h3 { max-width: 700px; margin-left: auto; margin-right: auto; }
.tc .lead { margin-left: auto; margin-right: auto; }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .plan-in { grid-template-columns: 1fr; gap: 40px; }
  .ftr-in { grid-template-columns: 1fr 1fr; gap: 32px; }
}
/* Hero collapses to single column at 900px (keeps two-col on tablet) */
@media (max-width: 900px) {
  .hero-in { grid-template-columns: 1fr; gap: 36px; }
  .hero-vis { max-width: 500px; }
}

@media (max-width: 768px) {
  :root { --lg-max: 100%; }
  .sec { padding: 48px 0; }
  .sec-sm { padding: 32px 0; }
  .w { padding: 0 20px; }

  /* Show mobile sticky bar */
  .msbar { display: block; }
  /* Add bottom padding so content isn't hidden behind sticky bar */
  body { padding-bottom: 56px; }

  /* Global header mobile */
  .lg-hdr-in { height: 60px; }
  .lg-hdr-nav { display: none; }
  .lg-hdr-phone { display: none; }
  .lg-hdr-cta { display: none; }
  .lg-hbg { display: flex; }
  /* Legacy header mobile */
  .hdr-in { height: 60px; }
  .hdr-nav { display: none; }
  .hdr-phone { display: none; }
  .hdr-acts .btn { display: none; }
  .hbg { display: flex; }

  /* Hero */
  .hero { padding: 48px 0 40px; }
  .hero h1, .hero-s-n { font-size: clamp(24px, 7vw, 34px); }
  .hero-sg { gap: 12px; }
  .hero-sg span { font-size: 12px; }
  .hero-cta { gap: 12px; }
  .hero-cards { grid-template-columns: 1fr 1fr; }

  /* Why / Svc */
  .why-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .svc-grid { grid-template-columns: 1fr; }

  /* Plan */
  .plan-sec { padding: 48px 0; }
  .plan-in { gap: 32px; }

  /* Trust */
  .trust-grid { gap: 8px 20px; }
  .trust-item { flex: 0 0 auto; }

  /* Areas */
  .area-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; }
  .local-cards { grid-template-columns: 1fr 1fr; }

  /* Infog */
  .infog-grid { grid-template-columns: 1fr 1fr; gap: 16px; }

  /* Footer */
  .ftr-in { grid-template-columns: 1fr; gap: 24px; padding: 40px 20px 20px; }
  .ftr-bot { flex-direction: column; gap: 8px; text-align: center; }

  /* Tables */
  .entry-content table, .cmp-tbl { font-size: 13px; }
  .entry-content table th, .entry-content table td,
  .cmp-tbl th, .cmp-tbl td { padding: 10px 12px; }

  /* Card grid */
  .card-grid { grid-template-columns: 1fr; }
  .ba-grid { grid-template-columns: 1fr; }

  /* Step */
  .step-item { padding: 18px; }

  /* FAQ */
  .faq-btn { padding: 15px 18px; font-size: 14px; }
  .faq-panel { padding: 16px 18px; }

  /* Inner content */
  .inner-content { padding: 40px 20px; }
  .inner-content h2 { margin-top: 36px; }

  /* Page hero */
  .page-hero { padding: 40px 0 32px; }
}

@media (max-width: 480px) {
  .why-grid { grid-template-columns: 1fr; }
  .local-cards { grid-template-columns: 1fr; }
  .hero-cards { grid-template-columns: 1fr 1fr; }
  .infog-grid { grid-template-columns: 1fr; }
  .fcta-btns { flex-direction: column; align-items: stretch; }
  .fcta-btns .btn { text-align: center; }
  .hero-cta { flex-direction: column; align-items: flex-start; }
}

/* ── HERO CARD (right-column .hcard) ────────────────────── */
.hcard {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.hcard-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.hstat {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--lg-radius);
  padding: 14px 12px;
  text-align: center;
}
.hstat strong {
  display: block;
  font-size: 20px;
  font-weight: 800;
  color: var(--lg-gold);
  line-height: 1.1;
}
.hstat span {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  line-height: 1.3;
}
.hcard-divider {
  height: 1px;
  background: rgba(255,255,255,.1);
  margin: 4px 0;
}
.hcard-feat {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: rgba(255,255,255,.82);
  font-weight: 500;
}
.hcard-ico {
  color: var(--lg-gold);
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

/* ── HERO STAT ITEMS (.sg-item) ──────────────────────────── */
.sg-item {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--lg-radius);
  padding: 10px 16px;
  text-align: center;
  min-width: 80px;
}
.sg-item strong {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: var(--lg-gold);
  line-height: 1.1;
}
.sg-item span {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  line-height: 1.3;
}

/* ── TOWER GRID ──────────────────────────────────────────── */
.tower-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
}
.tower-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-left: 4px solid var(--lg-gold);
  border-radius: 0 var(--lg-radius-lg) var(--lg-radius-lg) 0;
  padding: 20px 20px 20px 18px;
  transition: box-shadow .25s, transform .25s;
}
.tower-card:hover { box-shadow: var(--lg-shadow); transform: translateY(-2px); }
.tower-card h3 { font-size: 16px; color: var(--lg-navy); margin-bottom: 6px; }
.tower-card p { font-size: 13px; color: var(--lg-text-mid); margin: 0; }

/* ── STEP CARDS (numbered process) ──────────────────────── */
.step-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  counter-reset: step;
}
.step-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  position: relative;
  transition: box-shadow .25s, transform .25s;
}
.step-card:hover { box-shadow: var(--lg-shadow-md); transform: translateY(-3px); }
.step-n {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lg-gold);
  background: rgba(201,168,76,.1);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 14px;
}
.step-card h3 { font-size: 17px; color: var(--lg-navy); margin-bottom: 10px; }
.step-card p { font-size: 14px; color: var(--lg-text-mid); margin: 0; }

/* ── COST GRID (pricing cards) ───────────────────────────── */
.cost-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
}
.cost-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 28px 24px;
  text-align: center;
  position: relative;
  transition: box-shadow .25s, transform .25s;
}
.cost-card:hover { box-shadow: var(--lg-shadow-md); transform: translateY(-3px); }
.cost-card--featured {
  border-color: var(--lg-gold);
  box-shadow: 0 0 0 2px rgba(201,168,76,.2);
}
.cost-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--lg-gold);
  color: var(--lg-navy);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 12px;
  border-radius: 20px;
  white-space: nowrap;
}
.cost-type {
  font-size: 16px;
  font-weight: 700;
  color: var(--lg-navy);
  margin-bottom: 8px;
}
.cost-price {
  font-size: 22px;
  font-weight: 800;
  color: var(--lg-gold);
  margin-bottom: 16px;
}
.cost-card ul {
  text-align: left;
  padding-left: 1.2em;
  margin-bottom: 0;
}
.cost-card li { font-size: 13px; color: var(--lg-text-mid); }

/* ── PRICE TABLE (.ptable) ───────────────────────────────── */
.ptable {
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  overflow: hidden;
}
.ptable-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 18px;
  font-size: 14px;
}
.ptable-row + .ptable-row { border-top: 1px solid var(--lg-border); }
.ptable-head {
  background: var(--lg-navy);
  color: var(--lg-white);
  font-weight: 700;
  font-size: 13px;
}
.ptable-row:nth-child(even):not(.ptable-head) { background: var(--lg-bg); }
.ptable-price { font-weight: 700; color: var(--lg-gold-dark); }

/* ── TWO-COLUMN SECTION LAYOUT ───────────────────────────── */
.sec-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
@media (max-width: 768px) {
  .sec-2col { grid-template-columns: 1fr; gap: 32px; }
}

/* ── RELATED LINKS ROW ───────────────────────────────────── */
.rel-links {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}
.rel-links a {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.6);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .2s;
}
.rel-links a:hover { color: var(--lg-gold); }

/* ── RESPONSIVE: new components ─────────────────────────── */
@media (max-width: 768px) {
  .tower-grid { grid-template-columns: 1fr; }
  .step-cards { grid-template-columns: 1fr; }
  .cost-grid { grid-template-columns: 1fr 1fr; }
  .hcard-row { grid-template-columns: 1fr 1fr; }
  .hero-sg { flex-wrap: wrap; gap: 8px; }
  .sg-item { min-width: 70px; padding: 8px 12px; }
}
@media (max-width: 480px) {
  .cost-grid { grid-template-columns: 1fr; }
  .hcard-row { grid-template-columns: 1fr 1fr; }
}

/* ── SECTION BACKGROUND HELPERS (homepage) ───────────────── */
.swh { background: var(--lg-white); }
.scr { background: #FBF8F1; }

/* ── REVIEW GRID ─────────────────────────────────────────── */
.rev-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 20px;
}
.rev-card {
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: 20px 18px;
  box-shadow: var(--lg-shadow);
  transition: box-shadow .25s, transform .25s;
}
.rev-card:hover { box-shadow: var(--lg-shadow-md); transform: translateY(-2px); }
.rev-txt {
  font-size: 14px;
  color: var(--lg-text-mid);
  line-height: 1.7;
  font-style: italic;
  margin-bottom: 14px;
}
.rev-auth {
  display: flex;
  align-items: center;
  gap: 10px;
}
.rev-av {
  width: 34px;
  height: 34px;
  background: var(--lg-navy);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--lg-gold);
  flex-shrink: 0;
}
.rev-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--lg-navy);
  margin-bottom: 2px;
}
.rev-meta {
  font-size: 12px;
  color: var(--lg-text-light);
}
.rev-cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

/* ── HOMEPAGE PRICING SECTION ────────────────────────────── */
.price-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
  margin-bottom: 32px;
}
.price-factors h3 { font-size: 18px; margin-bottom: 16px; }
.price-flist {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.price-f {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--lg-white);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--lg-text-mid);
  transition: border-color .2s, background .2s;
}
.price-f:hover { border-color: var(--lg-gold-light); background: rgba(212,160,41,.04); }
.price-f-ico {
  font-size: 16px;
  flex-shrink: 0;
  width: 28px;
}
/* Homepage pricing table (different from .ptable on inner pages) */
.ptbl-w { overflow-x: auto; border-radius: var(--lg-radius-lg); }
.ptbl {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  overflow: hidden;
  font-size: 15px;
  min-width: 280px;
}
.ptbl thead th {
  background: var(--lg-navy);
  color: var(--lg-white);
  padding: 13px 18px;
  text-align: left;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.ptbl thead th:first-child { border-radius: var(--lg-radius-lg) 0 0 0; }
.ptbl thead th:last-child  { border-radius: 0 var(--lg-radius-lg) 0 0; }
.ptbl tbody td {
  padding: 12px 18px;
  color: var(--lg-text-mid);
  border-top: 1px solid var(--lg-border);
  font-size: 14px;
}
.ptbl tbody td:last-child { font-weight: 700; color: var(--lg-gold-dark); }
.ptbl tbody tr:nth-child(even) td { background: var(--lg-bg); }
.ptbl tbody tr:hover td { background: rgba(212,160,41,.04); }

/* ── RESPONSIVE: homepage components ────────────────────── */
@media (max-width: 768px) {
  .rev-grid { grid-template-columns: 1fr; }
  .price-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .rev-cta { flex-direction: column; }
  .rev-cta .btn { text-align: center; }
}

/* ── FAQ JAVASCRIPT HOOK ─────────────────────────────────── */
/* Animated panel */
.faq-panel {
  overflow: hidden;
  transition: max-height .3s ease, opacity .3s ease;
  max-height: 0;
  opacity: 0;
  display: block !important;
  padding: 0 22px;
  border-top: none;
}
.faq-panel.is-open {
  max-height: 500px;
  opacity: 1;
  padding: 20px 22px;
  border-top: 1px solid var(--lg-border);
}