/* =====================================
   RESET & GLOBAL BASE
   ===================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body, h1, h2, p, ul {
  margin: 0;
  padding: 0;
}

/* Properly spacing paragraphs when wrapping around an image */
.spacer {
  display: block;
  margin-bottom: 1.25rem;
  content: "";
}

/* Browser canvas (video pages can show this) */
html {
  background: #000;
}

/* BASE BODY LAYOUT (no colors here) */
body {
  font-family: Arial, sans-serif;
  line-height: 1.6;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Bold helper */
.text-bold {
  font-weight: bold;
}

/* =====================================
   LEFT-PAGE-COPY STRUCTURE
   ===================================== */
.left-page-copy,
.left-page-copy h1,
.left-page-copy h2,
.left-page-copy p,
.left-page-copy ul,
.left-page-copy li {
  text-align: left;
}

.left-page-copy p,
.left-page-copy li {
  margin-bottom: 1rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.left-page-copy ul,
.left-page-copy ol {
  margin: 1rem 0 1rem 1.5rem;
  padding: 0;
}

.left-page-copy h1,
.left-page-copy h2 {
  margin: 1.5rem 0 1rem;
  line-height: 1.3;
}

/* =====================================
   PRIVACY POLICY LIST STYLES
   (scoped only to .privacy-copy)
   ===================================== */
.privacy-copy ul {
  list-style-type: disc;
  margin: 0 0 1rem 1.5rem;
  padding-left: 1.5rem;
}

.privacy-copy li {
  margin-bottom: 0.35rem;
}

/* =====================================
   Global CHECKLIST
   ===================================== */
ul.checklist {
  list-style: none;
  margin: 1rem 0;
  padding-left: 0;
  text-align: left;
}

ul.checklist li {
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  gap: .6rem;
  align-items: start;
  margin: .75rem 0;
  line-height: 1.6;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

ul.checklist li::before {
  content: "✅";
  font-size: 1.1rem;
  line-height: 1.4;
  margin-top: .2rem;
}

/* =====================================
   HEADER STRUCTURE
   ===================================== */
header.site-header {
  background: transparent;
  padding: 1rem;
}

.logo-nav-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  font-size: 1.5rem;
  font-weight: bold;
}

/* For centered logo on video pages */
.logo-center-video-background {
  width: 100%;
  max-width: 700px;
  height: auto;
}

@media (max-width: 480px) {
  .logo {
    max-width: 220px;
  }
}

/* =====================================
   MOBILE MENU STRUCTURE
   ===================================== */
.menu-toggle {
  font-size: 1.5rem;
  background: none;
  border: none;
  cursor: pointer;
  display: block;
}

.mobile-menu {
  display: none;
  background: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 1rem;
}

.mobile-menu ul {
  list-style: none;
}

.mobile-menu li {
  margin: 0.5rem 0;
}

.mobile-menu a {
  text-decoration: none;
  font-weight: bold;
}

/* Desktop nav */
@media (min-width: 768px) {
  .menu-toggle {
    display: none;
  }

  .mobile-menu {
    display: block;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
  }

  .mobile-menu ul {
    display: flex;
    justify-content: flex-start;
    gap: 2rem;
  }

  .mobile-menu li {
    margin: 0;
  }
}

/* =====================================
   MAIN CONTENT STRUCTURE
   ===================================== */
.main-content {
  padding: 2rem;
  padding-bottom: 12rem;
  flex: 1;
  position: relative;
  z-index: 1;
}

.page-copy {
  max-width: 1000px;
  margin: 0 auto 2rem auto;
  text-align: center;
}

.page-copy h2 {
  margin-bottom: 1.25rem;
}

p {
  text-align: justify;
  margin-bottom: 1.5rem;
  overflow: hidden;
}

/* Countdown (video pages will recolor it) */
.countdown-label {
  text-align: center;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}

#countdown {
  text-align: center;
  margin-bottom: 10rem;
}

/* =====================================
   TWO COLUMN LISTS
   ===================================== */
.two-column-lists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  margin: 2rem auto;
  max-width: 1000px;
}

.two-column-lists .column-left,
.two-column-lists .column-right {
  flex: 1 1 45%;
  text-align: left;
}

.two-column-lists h2 {
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
}

.two-column-lists ul {
  list-style: disc;
  padding-left: 1.5rem;
  margin-bottom: 1rem;
}

.two-column-lists li {
  margin-bottom: 0.5rem;
}

/* Services list as two columns */
.split-list {
  columns: 2;
  column-gap: 2rem;
  list-style: disc;
  padding-left: 1.5rem;
}

.split-list li {
  break-inside: avoid;
  margin-bottom: 0.5rem;
}

/* ======================================
   CTA LIST
   ====================================== */
.cta-service-checklist {
  list-style: none;
  padding: 0;
  margin: 1em 0;
  text-align: left;
}

.cta-service-checklist li {
  margin: 0.4em 0;
  font-size: 1rem;
  line-height: 1.5;
}

.cta-service-checklist li::before {
  content: "✅ ";
  margin-right: 0.5em;
}

/* =====================================
   FOOTER STRUCTURE
   ===================================== */
.site-footer {
  padding: 1rem;
  font-size: 0.9rem;
}

/* NEW: top row layout (Legal left, social icons right) */
.footer-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer-nav {
  text-align: left;
  margin-left: 0.5rem;
}

/* NEW: social icon row */
.footer-social {
  display: flex;
  gap: 12px;
  margin-right: 0.5rem;
}
/* NEW: social icon size */
.footer-social img {
  width: 42px;
  height: 42px;
  display: block;
}

.footer-copy {
  text-align: right;
  margin-top: 0.5rem;
  margin-right: 0.5rem;
}

/* =====================================
   LINK STRUCTURE (colors come from theme)
   ===================================== */
a {
  position: relative;
  text-decoration: none;
  transition: color 0.3s ease;
}

a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 2px;
  transition: width 0.3s ease;
}

a:hover::after {
  width: 100%;
}

/* =====================================
   SIDEBAR
   ===================================== */
.sidebar {
  background-color: #efefef;
  padding: 1rem;
  width: 200px;
  flex-shrink: 0;
}

/* Floated images */
.float-image {
  max-width: 160px;
  width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.float-image.start {
  float: left;
  margin-right: 1.5rem;
}

.float-image.end {
  float: right;
  margin-left: 1.5rem;
}

@media (max-width: 600px) {
  .float-image {
    display: block;
    float: none !important;
    margin: 1rem auto;
    max-width: 100%;
  }
}

/* =====================================
   INFO PAGE OVERRIDES
   ===================================== */
.body-info-page .page-copy h2:not(:first-of-type),
.body-info-page .page-copy h3,
.body-info-page .page-copy p:not(:first-of-type) {
  text-align: left;
}

/* =====================================
   RESPONSIVE
   ===================================== */
@media (max-width: 768px) {
  .sidebar {
    display: none;
  }

  .two-column-lists {
    flex-direction: column;
  }

  .two-column-lists .column-left,
  .two-column-lists .column-right {
    flex: 1 1 100%;
  }

  .split-list {
    columns: 1;
  }

  /* NEW: mobile footer top row stacks/centers */
  .footer-top {
    flex-direction: column;
    gap: 0.5rem;
  }

  .footer-social {
    justify-content: center;
    margin-right: 0;
  }

  /* Mobile footer stacked */
  .site-footer {
    text-align: center;
  }

  .footer-nav,
  .footer-copy {
    text-align: center;
    margin: 0 auto;
    display: block;
    width: 100%;
  }

  .footer-nav {
    margin-bottom: 0.5rem;
  }
}

/* ======================================================
   THEME: VIDEO BACKGROUND
   ====================================================== */
body.body-video {
  background: transparent;
  color: #333;
}

/* Overlay header/footer on video */
body.body-video header.site-header {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

/* FIXED: footer must be in normal document flow (homepage only) */
body.body-video .site-footer {
  background: transparent;
  color: #fff;
  position: relative;         /* was: absolute */
  bottom: auto;               /* neutralize */
  left: auto;                 /* neutralize */
  width: 100%;
  z-index: 10;
}

/* Video links (text color) */
body.body-video a {
  color: #333;
}

/* Video underline color (logo color) */
body.body-video a::after {
  background: #EE2B3A;
}

body.body-video a:hover {
  color: #005fa3;
}

/* Header/nav links: white text on video */
body.body-video header.site-header .logo,
body.body-video header.site-header .menu-toggle,
body.body-video header.site-header .mobile-menu a {
  color: #fff;
}

/* Header/nav underline on video: logo color */
body.body-video header.site-header .mobile-menu a::after {
  background: #EE2B3A;
}

/* Footer links force white on video */
body.body-video .site-footer a {
  color: #fff !important;
}

body.body-video .site-footer a::after {
  background: #fff !important;
}

/* Countdown colors on video pages */
body.body-video .countdown-label,
body.body-video #countdown {
  color: #fff;
}

/* ======================================================
   RESPONSIVE INDEX VIDEO PAGE FOOTER
   VIDEO INDEX — MOBILE FOOTER CLEARANCE
   Prevent overlay footer from covering countdown
   ====================================================== */
@media (max-width: 768px) {
  body.body-video .site-footer {
    padding: 0.5rem 1rem !important;
    font-size: 0.85rem !important;
  }

  /* FIXED: no longer needs huge clearance because footer is not overlayed */
  body.body-video #countdown {
    margin-bottom: 2rem !important; /* was: 14rem */
  }
}

/* ======================================================
   THEME: NON-VIDEO BACKGROUND
   ====================================================== */
body.body-nonvideo {
  background-color: #000;
  color: #fff; /* GLOBAL THEME COLOR */
}

/* NON-INDEX PAGES — reduce excess footer spacing */
body.body-nonvideo .main-content {
  padding-bottom: 6rem;
}

/* NON-INDEX PAGES — MOBILE: tighter footer spacing */
@media (max-width: 768px) {
  body.body-nonvideo .main-content {
    padding-bottom: 1rem;
  }
}

/* Header/footer (normal flow) */
body.body-nonvideo header.site-header {
  position: relative;
  z-index: 2;
}

body.body-nonvideo .site-footer {
  position: relative;
  z-index: 2;
}

/* White link text on non-video pages */
body.body-nonvideo a {
  color: #fff;
}

/* Non-video underline: logo color everywhere (header, footer, body) */
body.body-nonvideo a::after,
body.body-nonvideo header.site-header a::after,
body.body-nonvideo .site-footer a::after {
  background: #EE2B3A !important;
}

/* White nav + buttons */
body.body-nonvideo .logo,
body.body-nonvideo .menu-toggle,
body.body-nonvideo .mobile-menu li,
body.body-nonvideo .footer-nav,
body.body-nonvideo .footer-copy {
  color: #fff;
}