/**
 * Homepage unified navy theme — matches hero-circuit (#061428 / #0b1f4d).
 * Scoped to body.home-navy so other pages keep the original theme.
 */

body.home-navy {
  --hn-navy: #061428;
  --hn-navy-2: #0b1f4d;
  --hn-navy-3: #071530;
  --hn-text: #e8f3ff;
  --hn-muted: rgba(232, 243, 255, 0.78);
  /* Deeper gold (matches hero CTAs) — #ffe27a reads too neon on navy */
  --hn-gold: #f0c43c;
  --hn-gold-hover: #ffd45a;
  --hn-gold-text: #1f1408;
  --hn-line: rgba(94, 179, 255, 0.35);
  background: var(--hn-navy);
  color: var(--hn-text);
}

body.home-navy main {
  background: var(--hn-navy);
}

/* Shared panel gradient (same language as hero + services) */
body.home-navy #about > .w-100,
body.home-navy #process > .w-100,
body.home-navy #testimonials > .w-100,
body.home-navy #faq > .w-100,
body.home-navy #partner > .w-100,
body.home-navy #cta-banner > .w-100,
body.home-navy #seocheck .seocheck-breeze__scene,
body.home-navy #about-ssl > .w-100,
body.home-navy #about-years > .w-100 {
  background:
    radial-gradient(900px 520px at 70% 30%, rgba(31, 90, 188, 0.18), transparent 60%),
    linear-gradient(165deg, var(--hn-navy) 0%, var(--hn-navy-2) 48%, var(--hn-navy-3) 100%) !important;
  color: var(--hn-text);
}

/* Slight depth alternation */
body.home-navy #process > .w-100,
body.home-navy #faq > .w-100,
body.home-navy #partner > .w-100 {
  background:
    radial-gradient(800px 480px at 20% 40%, rgba(31, 90, 188, 0.16), transparent 55%),
    linear-gradient(165deg, var(--hn-navy-3) 0%, var(--hn-navy) 45%, var(--hn-navy-2) 100%) !important;
}

/* —— Typography —— */
body.home-navy .about-desc > h2,
body.home-navy .about-desc2 > h2,
body.home-navy .sec-title2 h2,
body.home-navy .sec-title2 h2 span,
body.home-navy .sec-title > h2,
body.home-navy .sec-title > span,
body.home-navy .roadmap-item > h3,
body.home-navy .testi-info-inner > h3,
body.home-navy .toggle-item > h3,
body.home-navy .widget > h4 {
  color: #fff !important;
}

body.home-navy .about-desc > p,
body.home-navy .about-desc2 > p,
body.home-navy .sec-title2 h2 + p,
body.home-navy .testi-info-inner > p,
body.home-navy .testi-info > p,
body.home-navy .toggle-content,
body.home-navy .toggle-content p,
body.home-navy .footer-about > p,
body.home-navy .text-color2 {
  color: var(--hn-muted) !important;
}

body.home-navy .sec-title2 h2:before {
  background-color: var(--hn-gold) !important;
}

/* —— About —— */
body.home-navy #about .bg-waves,
body.home-navy #about-ssl .bg-waves {
  opacity: 0.18;
  filter: brightness(0.55) saturate(0.8);
}

body.home-navy #about .about-wrap picture,
body.home-navy #about .about-wrap img {
  background: transparent !important;
  display: block;
  max-width: 100%;
  height: auto;
  filter: drop-shadow(0 18px 40px rgba(0, 0, 0, 0.35));
}

/* Shared CTA fill — same as hero / Check Yours Next (less bright than theme --color7) */
body.home-navy #about .fill-btn2,
body.home-navy #seocheck .fill-btn2 {
  background-color: var(--hn-gold);
  border-color: var(--hn-gold);
  color: var(--hn-gold-text);
  font-weight: 700;
}

body.home-navy #about .fill-btn2:hover,
body.home-navy #about .fill-btn2:focus,
body.home-navy #seocheck .fill-btn2:hover,
body.home-navy #seocheck .fill-btn2:focus {
  background-color: var(--hn-gold-hover);
  border-color: var(--hn-gold-hover);
  color: var(--hn-gold-text);
}

body.home-navy #about .bordered-btn:hover,
body.home-navy #about .bordered-btn:focus {
  color: var(--hn-navy);
  background: var(--hn-gold);
  border-color: var(--hn-gold);
}

/* Force bright theme blues → navy on homepage only */
body.home-navy .bg-color2,
body.home-navy .bg-color5,
body.home-navy .bg-color14 {
  background-color: transparent !important;
}

body.home-navy #about-ssl > .bg-color5 {
  background:
    radial-gradient(900px 520px at 70% 30%, rgba(31, 90, 188, 0.18), transparent 60%),
    linear-gradient(165deg, var(--hn-navy) 0%, var(--hn-navy-2) 48%, var(--hn-navy-3) 100%) !important;
}

body.home-navy #seocheck .sec-title > span,
body.home-navy #seocheck .sec-title > h2 {
  color: #fff !important;
}

/* —— Process roadmap —— */
body.home-navy .roadmap-item > h3 {
  color: #fff !important;
}

body.home-navy .roadmap-item span.roadmap-label {
  color: var(--hn-gold);
}

body.home-navy .roadmap-wrap::after {
  opacity: 0.35;
}

/* —— Testimonials (legacy boxes; modern layout uses testimonials-modern.css) —— */
body.home-navy .testi-box.style2 {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

body.home-navy .testi-box.style2 .testi-info-inner > h3 {
  color: #fff !important;
}

body.home-navy .testi-box.style2 .testi-info-inner > span,
body.home-navy .testi-box.style2 .testi-info > span {
  color: var(--hn-gold) !important;
}

body.home-navy #testimonials.testimonials-modern .tm-card__name {
  color: #fff !important;
}

/* —— About2 / SSL + years cards —— */
body.home-navy #about-ssl .about-desc2 > h2 {
  color: #fff !important;
}

body.home-navy #about-years {
  background: var(--hn-navy) !important;
}

body.home-navy #about-years > .w-100 {
  background: transparent !important;
}

body.home-navy .about-info-cap {
  background-color: rgba(11, 31, 77, 0.85) !important;
}

/* —— Facts —— */
body.home-navy #facts > .w-100 {
  background:
    linear-gradient(165deg, rgba(6, 20, 40, 0.92) 0%, rgba(11, 31, 77, 0.9) 50%, rgba(7, 21, 48, 0.94) 100%),
    #061428 !important;
}

body.home-navy #facts .fixed-bg {
  opacity: 0.25;
  filter: saturate(0.7) brightness(0.45);
}

body.home-navy #facts .fact-box {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

body.home-navy #facts .fact-box,
body.home-navy #facts .fact-box h3,
body.home-navy #facts .fact-box span,
body.home-navy #facts .fact-box i {
  color: #fff !important;
}

/* —— Partners —— */
body.home-navy #partner .sr-box {
  background: rgba(255, 255, 255, 0.04);
}

body.home-navy #partner .sr-box img {
  filter: brightness(0) invert(1);
  opacity: 0.75;
}

body.home-navy #partner .sr-box:hover img {
  opacity: 1;
}

/* —— CTA —— */
body.home-navy #cta-banner .sec-title2 h2,
body.home-navy #cta-banner .sec-title2 p {
  color: #fff !important;
}

/* —— FAQ —— */
body.home-navy .toggle-item {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

body.home-navy .toggle-item > h3,
body.home-navy .toggle-item > h3 i {
  color: #fff !important;
}

body.home-navy .toggle-item.activate,
body.home-navy .toggle-item:hover {
  background: rgba(255, 255, 255, 0.08);
}

body.home-navy .toggle-content,
body.home-navy .toggle-content p {
  color: var(--hn-muted) !important;
}

/* —— Footer —— */
body.home-navy footer > .w-100,
body.home-navy footer .bg-color14 {
  background:
    radial-gradient(700px 400px at 50% 0%, rgba(31, 90, 188, 0.2), transparent 55%),
    linear-gradient(180deg, var(--hn-navy-2) 0%, var(--hn-navy) 55%, #040e1c 100%) !important;
  color: var(--hn-muted) !important;
}

body.home-navy footer a {
  color: rgba(232, 243, 255, 0.75);
}

body.home-navy footer a:hover,
body.home-navy footer a:focus {
  color: var(--hn-gold);
}

body.home-navy footer .widget > h4 {
  color: #fff !important;
}

/* Particles / decorative waves sit softer on navy */
body.home-navy .particles-js {
  opacity: 0.55;
}

body.home-navy .bg-waves {
  opacity: 0.2;
  filter: brightness(0.55) saturate(0.75);
}

/* Sticky header matches navy (not white) */
body.home-navy header.sticky {
  background-color: rgba(6, 20, 40, 0.96) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

body.home-navy header.sticky .nav-wrap a,
body.home-navy header.sticky .menu-item a {
  color: #e8f3ff;
}

body.home-navy .responsive-header {
  background: var(--hn-navy);
}
