/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme for Farm
 Author:         CM
 Author URI:     https://www.clevermethod.com
 Template:       Divi
 Version:        1.0.0
*/


 :root {
  /* Core Brand Colors */
  --primary-color: #00664B;
  --primary-light: rgba(0, 102, 75, 0.1);
  --primary-dark: #004F3A;
  --secondary-color: #DE7C00;
  --secondary-light: rgba(222, 124, 0, 0.1);
  --secondary-dark: #B36500;
  --upcoming-bg: #ECCE2E;
  
  /* Neutral Colors */
  --neutral-50: #f9fafb;
  --neutral-100: #f3f4f6;
  --neutral-200: #e5e7eb;
  --neutral-300: #d1d5db;
  --neutral-400: #9ca3af;
  --neutral-500: #6b7280;
  --neutral-600: #4b5563;
  --neutral-700: #374151;
  --neutral-800: #1f2937;
  --neutral-900: #111827;
  
  /* Status Colors */
  --status-live: var(--primary-color);
  --status-upcoming: var(--secondary-color);
  --status-future: var(--neutral-500);
  
  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 2px 4px rgba(17, 24, 39, 0.05), 0 1px 2px rgba(17, 24, 39, 0.1);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  
  /* Borders */
  --border-radius-sm: 0.375rem;
  --border-radius-md: 0.5rem;
  --border-radius-lg: 0.75rem;
  --border-radius-xl: 1rem;
  --border-radius-full: 9999px;
  
  /* Typography */
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.1rem;
  --font-size-xl: 1.2rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  
  /* Animation */
  --transition-base: all 0.3s ease;
  --transition-smooth: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  
  /* Layout */
  --content-width: 1200px;
  --content-padding: 2rem;
  --card-spacing: 1.5rem;
  --section-spacing: 3rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins',Helvetica,Arial,Lucida,sans-serif;
  font-size: 40px;
  letter-spacing: -2px;
  line-height: 1.2em;
}

.faq-template-default .entry-content tr td {
  border: 1px solid #000;
  padding: 6px 24px;
  font-size: 16px;
}

.entry-title.main_title {
  font-family: inherit;
  font-weight: 700;
  font-size: 40px;
  text-align: center;
}

.faq-container .faq-question {
  padding: 15px !important;
}

/* --- Section and Title --- */
.zone-updates-section {
  margin: .6em 0;
  padding-bottom: 1rem;
}

.zone-updates-title {
  margin-top: 0;
  text-align: center;
  font-size: 2rem;
  color: #343a40;
  line-height: 2.2rem;
  font-weight: 700;
}

/* --- Card Container --- */
.zone-card-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
  justify-content: center;
  align-items: stretch; 
}

/* --- Zone System Styles --- */

a.zone-info-card-link {
  display: block;
  color: inherit;
  text-decoration: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  width: 18%;
  flex-basis: 18%;
  flex-grow: 0;
  flex-shrink: 0;
  margin-bottom: 1.5em;
  border-radius: 10px;
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-out;
  border: solid 2px transparent;
  box-sizing: border-box;
  position: relative;
}

/* --- Section Containers & Titles --- */
.zone-tag-results-section {
  padding: 1.5em;
}
.zone-updates-section { padding-top: 0; }
.zone-tag-results-section { padding: 4em 1.5em; background-color: #00664B; }

.zone-updates-title,
.zone-tag-results-title { margin-top: 0; margin-bottom: 1em; text-align: center; }
.zone-updates-title { font-size: 1.8em; color: #343a40; }
.zone-tag-results-title { font-size: 1.7rem; color: #fff; text-transform: uppercase; font-weight: 700; }

/* --- Card List Containers (Apply to both) --- */
.zone-card-list,
.zone-tag-card-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5em;
  justify-content: center;
  align-items: stretch;
}

/* --- Base Card Structure (Link Wrapper) --- */
.zone-info-card-link {
  display: block;
  width: 18%;
  flex-basis: 18%;
  flex-grow: 0;
  flex-shrink: 0;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-out;
  text-decoration: none;
  color: inherit;
  border: solid 2px transparent;
  box-sizing: border-box;
  margin-bottom: 1.5em;
}

/* --- Inner Card Element (Holds Status Variables) --- */
.zone-info-card {
  --bg-color: var(--neutral-500);
  --bg-color-light: var(--neutral-200);
  --text-color-hover: #fff;
  --box-shadow-color: rgba(108, 117, 125, 0.4);
  --icon-color-initial: var(--neutral-500);
  --icon-color-hover: #fff;

  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 20px 15px;
  box-sizing: border-box;
  position: relative;
}

/* Override Variables per Status */
.zone-info-card.zone-live {
  --bg-color: var(--primary-color);
  --box-shadow-color: rgba(0, 102, 75, 0.4);
  --icon-color-initial: var(--primary-color);
  --icon-color-hover: #fff;
}
.zone-info-card.zone-contract-active,
.zone-info-card.zone-contract-upcoming {
  --bg-color: var(--upcoming-bg);
  --box-shadow-color: rgba(222, 124, 0, 0.48);
  --icon-color-initial: var(--secondary-color);
  --icon-color-hover: #fff;
}

.zone-info-card.zone-tbd {
   opacity: 0.9; /* Keep slightly dimmed */
}


/* --- Card Elements (Styled like Uiverse example) --- */

.zone-info-card .circle {
  width: 131px;
  height: 131px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--bg-color);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
  transition: all 0.3s ease-out;
  flex-shrink: 0;
  margin-bottom: 20px;
}

.zone-info-card .circle:after {
  content: "";
  width: 118px;
  height: 118px;
  display: block;
  position: absolute;
  background: var(--bg-color);
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: background 0.3s ease-out;
  z-index: 0;
}

.zone-info-card .zone-icon {
  font-size: 50px;
  color: #fff;
  z-index: 1;
  transition: color 0.3s ease-out;
  width: auto; height: auto;
}

.zone-info-card .overlay {
    top: 20px;
    left: calc(50% - 59px);
    width: 118px;
    height: 118px;
    position: absolute;
    border-radius: 50%;
    background: var(--bg-color);
    z-index: 0;
    transition: transform 0.4s ease-out;
    transform: scale(0);
    transform-origin: center;
}

.zone-info-card .zone-content {
  color: #495050;
  z-index: 1;
  transition: color 0.3s ease-out;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  flex-grow: 1;
  min-height: 0;
}

/* Style individual text elements */
.zone-info-card .zone-card-title {
  font-size: 1.2rem;
  font-weight: bold;
  margin: 0;
  color: inherit;
  padding-bottom: 3px;
}

.zone-info-card .zone-status-subtitle {
  font-size: 0.9em;
  font-weight: bold;
  margin: 0 0 0.5em 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #595959;
  display: block;
  padding: 0;
  border-radius: 0;
  line-height: 1.3;
}

.zone-info-card .zone-signup-details {
  font-size: 0.9rem;
  margin: 0;
  line-height: 1.4;
  color: inherit;
  padding-top: 0.5em;
}


/* --- Hover Effects (Targeting the Link Wrapper) --- */

.zone-info-card-link:hover {
  transform: translateY(-5px) scale(1.005);
  box-shadow: 0 24px 36px rgba(0, 0, 0, 0.11),
              0 24px 46px var(--box-shadow-color);
  border-color: transparent;
  z-index: 10;
}

.zone-info-card-link:hover .zone-info-card .circle {
  border-color: #fff;
  background: #fff;
}

.zone-info-card-link:hover .zone-info-card .circle:after {
  background: var(--bg-color);
}

.zone-info-card-link:hover .zone-info-card .overlay {
  transform: scale(5);
}

/* Text Content Hover Color (Status Specific) */
.zone-info-card-link:hover .zone-info-card.zone-live .zone-content * {
  color: #fff; /* White Text */
}
.zone-info-card-link:hover .zone-info-card.zone-contract-active .zone-content *,
.zone-info-card-link:hover .zone-info-card.zone-contract-upcoming .zone-content * {
  color: var(--neutral-800); /* Dark Text */
}
.zone-info-card-link:hover .zone-info-card.zone-tbd .zone-content * {
  color: #fff; /* White Text */
}

/* You might need to adjust height/padding/font-size within media queries too */
@media (max-width: 1200px) { a.zone-info-card-link { width: 23%; flex-basis: 23%; } }
@media (max-width: 991px) { a.zone-info-card-link { width: 31%; flex-basis: 31%; } }
@media (max-width: 767px) { .zone-info-card-link { width: 80%; flex-basis: 80%; max-width: 400px;} a.zone-info-card-link { width: 80%; flex-basis: 80%; max-width: 400px;} }

/* ----------------------------------------
   ZONE SINGLE PAGE LAYOUT
---------------------------------------- */

.zone-single-page #primary.content-area {
  max-width: var(--content-width);
  margin: 3rem auto 5rem;
  padding: 0 1.5rem;
}

.zone-single-page .zone-article {
  background-color: white;
  overflow: hidden;
  transition: var(--transition-smooth);
}

.zone-single-page .zone-article:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-xl);
}

/* ----------------------
      ZONE HEADER
---------------------- */

.zone-single-page .zone-header {
  padding: 1.5rem 2.5rem 1rem; /* Reduced padding */
  border-bottom: none; /* Remove original border */
  background-color: #fff; /* Ensure a background if needed */
}

.zone-single-page .zone-header::after {
  display: none; /* Hide original gradient line */
}

.zone-single-page .zone-header-content {
  display: flex;
  justify-content: center; /* Center the title */
  align-items: center;
}

.zone-single-page .zone-header-content .zone-title {
  font-weight: 600;
}

.zone-single-page .zone-header .zone-title {
    line-height: 1.3;
    margin-bottom: 0;
}

/* ========================================
  CWZ Timeline Status Section Styles
  ======================================== */

  .cwz-timeline-status {
  padding: 2rem 1.5rem 0;
  text-align: center;
  overflow: hidden;
}

.cwz-status-tag-container {
  margin: 0 0 0.5rem;
}

.cwz-status-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 2rem;
  font-size: var(--font-size-lg);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--primary-color);
  line-height: 1.2;
}

.cwz-status-tag .cwz-status-icon {
  font-size: 1.3em;
  line-height: 1;
}

.zone-contract-cta {
  margin: 0 0 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 2rem;
  border-radius: 3px;
  font-size: var(--font-size-lg);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1.2;
  border: solid 2px var(--secondary-color);
  background-color: var(--secondary-color) !important;
  color: #fff;
}

.zone-contract-cta:hover {
  background-color: #fff !important;
  border: solid 2px #333;
  cursor: pointer;
  color: #333;
}

.cwz-status-tag .cwz-status-icon {
  font-size: 1.3em;
  line-height: 1;
}

/* --- Timeline Visual --- */
.cwz-timeline-container {
  max-width: 800px; /* Limit width */
  margin: 0 auto 1.5rem;
  padding: 0 1rem; /* Add some padding */
}

.cwz-timeline-bar {
  height: 8px;
  background-color: var(--neutral-200);
  border-radius: var(--border-radius-full);
  position: relative;
  margin-bottom: 3.5rem; /* Space for markers below */
}

.cwz-timeline-progress {
  height: 100%;
  background-color: var(--status-upcoming); /* Default progress color (Orange) */
  border-radius: var(--border-radius-full);
  transition: width 0.5s ease-out;
  position: absolute;
  left: 0;
  top: 0;
}
/* Change progress bar color based on status */
.cwz-timeline-status.status-active .cwz-timeline-progress,
.cwz-timeline-status.status-awaiting-go-live .cwz-timeline-progress {
  background-color: var(--status-live); /* Green when done */
}
.cwz-timeline-status.status-future .cwz-timeline-progress,
.cwz-timeline-status.status-starting-soon .cwz-timeline-progress {
  width: 0 !important; /* No progress yet */
}


.cwz-timeline-today {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%); /* Center on the percentage */
    z-index: 2;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cwz-timeline-today-marker {
    display: block;
    width: 16px;
    height: 16px;
    background-color: var(--secondary-dark); /* Distinct color for today */
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 0 0 2px var(--secondary-dark);
    margin-bottom: 0.5rem; /* Space between marker and label */
    transform: translateY(-4px); /* Adjust vertical position slightly */
}
.cwz-timeline-today-label {
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--secondary-dark);
    position: absolute;
    top: -2.2em; /* Position label above marker */
    white-space: nowrap;
}


.cwz-timeline-markers {
  display: flex;
  justify-content: space-between;
  position: relative;
  margin-top: -3.2rem; /* Pull markers up visually closer to bar */
}

.cwz-timeline-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 30%; /* Give markers some width */
  position: relative;
}

.cwz-timeline-marker .marker-point {
  width: 14px;
  height: 14px;
  background-color: white;
  border: 3px solid var(--neutral-400); /* Default border */
  border-radius: 50%;
  margin-bottom: 0.6rem;
  position: relative;
  z-index: 1; /* Above progress bar */
}

/* --- Layout (Mostly unchanged) --- */
.milestone-timeline-container {
  width: 100%;
  padding: 20px 0;
  max-width: 750px;
  margin: 0 auto;
}
.milestone-timeline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start; /* Align tops of steps */
}
.milestone-step {
  display: flex;
  align-items: flex-start;
  flex-basis: 0;
  flex-grow: 0; /* Let content size itself */
  position: relative;
}
.milestone-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-width: 180px;
}

/* --- Milestone Point Styling (Using CSS Variable) --- */
.milestone-point-wrapper {
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.milestone-point {
  width: 24px;
  height: 24px;
  background-color: #ffffff;
  border: 3px solid #e0e0e0;
  border-radius: 50%;
  transition: background-color 0.5s ease, border-color 0.5s ease;
  z-index: 1;
  position: relative;
  --point-status-color: #e0e0e0;
}

@keyframes pulse-marker {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.2); /* Scale up */
    opacity: 0.7; /* Slightly fade */
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.milestone-point.completed {
  background-color: var(--point-status-color, #0073aa);
  border-color: var(--point-status-color, #0073aa);
  animation: pulse-marker 1s infinite ease-in-out;
  transform-origin: center center;
}

.milestone-point.active {
   border-color: #00a0d2;
}

.milestone-label {
  border: 4px solid #fff;
  border-radius: 3px;
}

/* --- Label Styling (Unchanged) --- */
.milestone-label .date { display: block; font-weight: bold; font-size: 1.1rem; color: #333; }
.milestone-label .desc { display: block; font-size: 1rem; color: #555; }


/* --- NEW: Solid Bar Connector Styling --- */
.milestone-connector {
  flex-grow: 1; 
  display: flex;
  align-items: center;
  min-width: 60px;
  padding: 0 10px;
  position: relative;
  height: 30px;
}

.milestone-connector::before {
  content: '';
  display: block;
  width: 100%;
  height: 6px;
  background-color: #e0e0e0;
  border-radius: 3px;
  transition: background-color 0.4s ease;
}

.milestone-connector.dark::before {
  background-color: var(--current-zone-status-color, var(--status-upcoming));
}

/* Color for COMPLETED phases */
.milestone-connector.completed::before {
   background-color: var(--current-zone-status-color, var(--status-live));
}

@media (max-width: 767px) {
  .milestone-timeline-container {
    display: flex;
    justify-content: center;
  }

  .milestone-timeline {
    flex-direction: column;
    gap:1rem;
  }

  .milestone-step {
    flex-direction: column;
    align-items: center;
  }

  .milestone-connector {
    display: none;
  }

  .milestone-content {
    flex-direction: row;
    gap:2em;
  }

  .milestone-label {
    min-width: 250px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .milestone-label.completed {
    background-color: var(--current-zone-status-color);
  }

  .milestone-label.completed .date, .milestone-label.completed .desc {
    color: #fff;
  }
}

/* ----------------------------------------
   ZONE CONTENT
---------------------------------------- */

.zone-single-page .entry-content {
  padding: 0.5rem 2.5rem 0;
}

.zone-single-page .zone-details-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 2.5rem;
  align-items: start;
}

.content-card {
  background-color: white;
  transition: var(--transition-base);
  height: 100%;
}

/* ----------------------------------------
   LEFT COLUMN STYLES
---------------------------------------- */

.zone-single-page .zone-details-left {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.zone-single-page .zone-description-content {
  background-color: white;
  padding: 1.75rem;
  position: relative;
}

.zone-single-page .zone-description-inner {
  font-size: var(--font-size-base);
  line-height: 1.7;
  color: var(--neutral-700);
}

.zone-single-page .zone-description-inner p:last-child {
  margin-bottom: 0;
}

.zone-services-info {
  margin-bottom: 1rem;
}

/* ----------------------------------------
   SECTION HEADINGS
---------------------------------------- */

.zone-single-page .detail-heading {
  font-size: var(--font-size-lg);
  font-weight: 700;
  color: var(--neutral-800);
  margin: 0 0 1.25rem;
  position: relative;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--neutral-200);
  letter-spacing: 0.01em;
}

.zone-single-page .detail-heading::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  height: 2px;
  width: 3rem;
  background-color: var(--status-future);
  border-radius: 2px;
}

.zone-article.zone-live .detail-heading::after {
  background-color: var(--status-live);
}

.zone-article.zone-upcoming-soon .detail-heading::after {
  background-color: var(--status-upcoming);
}

/* ----------------------------------------
   MAP CONTAINER STYLES
---------------------------------------- */

.zone-single-page #zone-map-container,
.zone-single-page .zone-image-container,
.zone-single-page .zone-map-placeholder {
  padding: 1.5rem;
}

.zone-single-page #zone-map {
  border-radius: var(--border-radius-sm);
  overflow: hidden;
  border: 1px solid var(--neutral-200);
}

.zone-single-page .image-wrapper {
  border-radius: var(--border-radius-sm);
  overflow: hidden;
  line-height: 0;
}

.zone-single-page .image-wrapper img {
  width: 100%;
  height: 450px;
  transition: var(--transition-smooth);
  max-height: 450px;
  object-fit: cover;
}

.zone-single-page .image-wrapper:hover img {
  transform: scale(1.02);
}

.zone-single-page .zone-map-placeholder {
  display: flex;
  flex-direction: column;
}

.zone-single-page .placeholder-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3rem 1rem;
  background-color: var(--neutral-100);
  border-radius: var(--border-radius-sm);
  color: var(--neutral-500);
  min-height: 350px;
  text-align: center;
}

.zone-single-page .placeholder-content svg {
  margin-bottom: 1.5rem;
  opacity: 0.7;
}

.zone-single-page .placeholder-content p {
  font-size: var(--font-size-base);
  max-width: 250px;
}

/* ----------------------------------------
   LOADING ANIMATION
---------------------------------------- */

.zone-single-page #zone-map p {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-base);
  padding: 1rem;
  color: var(--neutral-600);
  background-color: var(--neutral-100);
  border-radius: var(--border-radius-sm);
  font-weight: 500;
}

.zone-single-page .loading-icon {
  display: inline-block;
  margin-right: 0.5rem;
  animation: spin 1.5s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ----------------------------------------
   RESPONSIVENESS
---------------------------------------- */

@media (max-width: 1200px) {
  .zone-single-page .zone-details-grid {
    gap: 2rem;
  }
  .zone-single-page .zone-title {
    font-size: 40px;
  }
  .zone-card-list {
    gap: 1.5rem;
  }
}

@media (max-width: 991px) {
  .zone-single-page .zone-details-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
   .zone-single-page .zone-details-left {
        gap: 2rem;
    }
  .zone-single-page #zone-map {
    min-height: 350px;
    height: auto;
  }
  .zone-single-page .zone-header {
     padding: 1.5rem 2rem 1rem;
  }
  .zone-single-page .entry-content {
    padding: 2rem;
  }
}

@media (max-width: 767px) {
  .zone-single-page #primary.content-area {
    margin: 2rem auto 3rem;
     padding: 0 1rem;
  }
  .zone-single-page .zone-title {
    font-size: var(--font-size-2xl);
  }
  .zone-single-page .zone-header {
    padding: 1.25rem 1.5rem 0.75rem;
  }
  .zone-single-page .entry-content {
    padding: 1.5rem;
  }
  .zone-single-page .detail-heading {
    font-size: var(--font-size-base);
  }
  .zone-single-page .locations-list {
    grid-template-columns: 1fr;
  }
  .zone-updates-title,
  .zone-tag-results-title {
     font-size: var(--font-size-2xl);
  }

  .cwz-timeline-status {
    padding: 2rem 1rem 0;
  }
  .cwz-status-tag {
    font-size: var(--font-size-base);
    padding: 0.6rem 1.5rem;
  }


  .cwz-timeline-bar {
     display: none;
  }
   .cwz-timeline-today {
        display: none; 
    }
  .cwz-timeline-markers {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    margin-top: 0;
  }
  .cwz-timeline-marker {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
    width: 100%;
    gap: 1rem;
  }
  .cwz-timeline-marker .marker-point {
    margin-bottom: 0;
    margin-top: 0.1em;
    flex-shrink: 0;
  }
  .cwz-timeline-marker .marker-label {
    margin-bottom: 0;
    font-size: var(--font-size-sm);
  }
  .cwz-timeline-marker .marker-label br {
    display: none;
  }
  .cwz-timeline-marker time {
     font-size: var(--font-size-sm);
     font-weight: 600;
     display: block;
     margin-top: 0.1rem;
  }

  .cwz-timeline-marker.marker-start,
  .cwz-timeline-marker.marker-final,
  .cwz-timeline-marker.marker-golive {
     align-items: flex-start;
     text-align: left;
  }
  .zone-cta-section-moved {
    padding: 2rem 1.5rem;
  }
  .zone-cta-section-moved .zone-cta-heading {
    font-size: var(--font-size-2xl);
  }
  .zone-cta-section-moved .zone-cta-text {
    font-size: var(--font-size-base);
  }
  .zone-cta-section-moved .zone-cta-button {
    font-size: var(--font-size-base);
    padding: 0.8rem 2rem;
  }
  .zone-cta-section-moved .zone-cta-link {
    font-size: var(--font-size-sm);
  }
}

@media (max-width: 479px) {
  .zone-single-page #zone-map {
    min-height: 250px;
    height: auto;
 }
  .cwz-status-tag {
      font-size: var(--font-size-sm);
      padding: 0.5rem 1.25rem;
      gap: 0.5rem;
  }
   .cwz-status-tag .cwz-status-icon {
      font-size: 1.2em;
   }
  .cwz-timeline-marker .marker-label {
      font-size: var(--font-size-xs);
  }
  .cwz-timeline-marker time {
      font-size: var(--font-size-xs);
  }
}


.cwz-timeline-status {
  opacity: 0;
  transform: translateY(15px);
  animation: fadeInUp 0.6s 0.2s ease-out forwards;
}
@keyframes fadeInUp {
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

/* ----------------------------------------
   ANIMATIONS & TRANSITIONS
---------------------------------------- */

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.zone-single-page .zone-article {
  animation: fadeIn 0.5s ease-out forwards;
}

/* Staggered Card Animation */
.zone-card-list a.zone-info-card-link {
  opacity: 0;
  animation: fadeIn 0.5s ease-out forwards;
}

.zone-card-list a.zone-info-card-link:nth-child(1) { animation-delay: 0.1s; }
.zone-card-list a.zone-info-card-link:nth-child(2) { animation-delay: 0.2s; }
.zone-card-list a.zone-info-card-link:nth-child(3) { animation-delay: 0.3s; }
.zone-card-list a.zone-info-card-link:nth-child(4) { animation-delay: 0.4s; }
.zone-card-list a.zone-info-card-link:nth-child(5) { animation-delay: 0.5s; }
.zone-card-list a.zone-info-card-link:nth-child(n+6) { animation-delay: 0.6s; }

/* ----------------------------------------
   ZONE CTA SECTION STYLES
---------------------------------------- */

.zone-cta-section {
  margin-top: 2.5rem;
  background-color: var(--neutral-100);
  border-top: 1px solid var(--neutral-200);
  text-align: center;
}

.zone-cta-content {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 840px;
  margin: 0 auto;
}

.zone-cta-heading {
  font-weight: 700;
  margin-bottom: 1rem;
  color: var(--neutral-900);
  font-size: 36px;
}

.zone-cta-text {
  font-size: var(--font-size-xl);
  line-height: 1.6;
  color: var(--neutral-700);
  margin-bottom: 2rem;
}

.zone-cta-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.zone-cta-section-moved .zone-cta-button {
  outline: none;
  cursor: pointer;
  border: none;
  padding: 1rem 3rem;
  margin: 0;
  font-family: inherit;
  position: relative;
  display: inline-block;
  letter-spacing: 0.05rem;
  font-weight: 700;
  font-size: var(--font-size-lg);
  border-radius: 3px;
  overflow: hidden;
  text-decoration: none;
  z-index: 1;
  text-align: center;
  color: #fff;
  background-color: var(--secondary-color);
  transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}

.zone-cta-section-moved .zone-cta-button:hover {
  background-color: var(--primary-dark);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.zone-cta-section-moved .zone-cta-link {
  font-size: var(--font-size-base);
  color: var(--neutral-600);
  text-decoration: none;
  position: relative;
  transition: color 0.3s ease;
}

.zone-cta-section-moved .zone-cta-link:hover {
  color: var(--primary-color);
}

.zone-cta-section-moved .zone-cta-link::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -3px;
  left: 0;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s ease;
}

.zone-cta-section-moved .zone-cta-link:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Responsive adjustments */
@media (max-width: 767px) {
  .zone-cta-content {
    padding: 2rem 1.5rem;
  }
  
  .zone-cta-heading {
    font-size: var(--font-size-xl);
  }
  
  .zone-cta-button {
    padding: 0.8rem 1.8rem;
    font-size: 16px;
  }
}

/* --- Basic Resets --- */
.new-customer-section *,
.new-customer-section *::before,
.new-customer-section *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.new-customer-section p {
  padding-bottom: 1em;
}

.new-customer-section p:last-of-type {
  padding-bottom: 0;
}

.new-customer-section strong {
  font-weight: 700;
}

/* --- Section Styling --- */
.new-customer-section {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}

/* --- Row Styling --- */
.new-customer-row {
  display: flex;
  width: 100%;
  max-width: 100%;
  min-height: 600px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/* --- Column Styling --- */
.new-customer-image-col,
.new-customer-content-col {
  width: 50%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  min-height: 1px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.new-customer-image-col {
  background-image: url(https://actioncarting.com/wp-content/uploads/2024/06/action_truck_3.jpg);
  background-position: left center;
}

.new-customer-content-col {
  background-color: var(--primary-color);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  padding: 2rem 50px;
}

.new-customer-content-inner {
  width: 80%;
  margin-left: 0;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto;
}

.new-customer-content-inner h2 {
  font-weight: 700;
  color: #FFFFFF !important;
  text-align: left;
}

.new-customer-content-col h1 {
  font-weight: 700;
  color: #FFFFFF;
  text-align: left;
  padding-bottom: 10px;
  margin-top: 0;
}

.new-customer-content-col p {
  font-family: inherit;
  font-size: 18px;
  color: #FFFFFF;
  text-align: left;
}

.new-customer-content-col a {
  color: var(--secondary-color);
  font-family: inherit;
  font-weight: 700;
  text-decoration: underline;
}

.new-customer-content-col strong {
  white-space: nowrap;
}

/* --- Responsive Styles --- */
@media only screen and (max-width: 980px) {
  .new-customer-row {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 100px;
  }

  .new-customer-image-col {
    display: none;
  }

  .new-customer-content-col {
    width: 100%;
    padding: 32px 40px 32px 50px;
    justify-content: center;
    align-items: flex-start;
  }

  .new-customer-content-inner {
     margin-top: 0;
     margin-bottom: 0;
     width: 100%;
  }

  .new-customer-content-col h1 {
    margin-top: -15px;
  }
}

@media only screen and (max-width: 767px) {
  .new-customer-row {
    min-height: auto;
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
  }

  .new-customer-content-col {
    padding: 20px 20px 20px 30px;
  }

  .new-customer-content-inner {
     width: 100%;
  }

  .new-customer-content-col h1 {
    font-size: 30px;
    letter-spacing: -1px;
    margin-top: 0;
  }
}

.about-intro-section *,
.about-intro-section *::before,
.about-intro-section *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.about-intro-section p {
  padding-bottom: 0;
}

.about-intro-section img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  display: block;
}

.about-intro-section {
  padding: 3rem 0;
  margin-top: 0;
  margin-bottom: 0;
  position: relative;
  background-color: #fff;
}

.about-intro-row {
  display: flex;
  align-items: center;
  width: 90%;
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.about-intro-content-col,
.about-intro-image-col {
  width: 50%;
  min-height: 1px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2rem;
}

.about-intro-content-col {
  align-items: flex-start;
  text-align: left;
  gap: 1em;
}

.about-intro-image-col {
  align-items: center;
}

.about-intro-content-col h1 {
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  font-size: 40px;
  color: #000000;
  letter-spacing: -2px;
  line-height: 1.2em;
  padding-bottom: 0;
  margin-bottom: 0;
  width: 100%;
}

.about-intro-content-col p {
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  font-size: 17px;
  line-height: 1.6em;
  margin-bottom: 0;
  width: 100%;
}

.about-intro-content-col p.tagline {
  color: var(--primary-color);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.6em;
  margin-top: 0;
}

.about-intro-button-wrapper {
   margin-top: 0;
   align-self: flex-start;
}

.about-intro-button {
  display: inline-block;
  color: #FFFFFF;
  border-width: 0px;
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  font-weight: 700;
  font-size: 17px;
  background-color: var(--secondary-color);
  padding: 0.6em 1.2em;
  border-radius: 3px;
  text-decoration: none;
  transition: all 300ms ease 0ms;
  line-height: 1.7em;
  position: relative;
}

.about-intro-button:hover {
  background-color: #bf6a00;
  color: #ffffff;
}

.about-image-wrap {
   position: relative;
   max-width: 100%;
   width: 100%;
   line-height: 0;
   margin-left: 0;
   text-align: center;
}

.about-image-wrap img {
   display: inline-block;
   max-width: 100%;
   height: auto;
}

@media only screen and (max-width: 980px) {
  .about-intro-row {
    flex-direction: column;
    align-items: center;
    width: 90%;
    max-width: 90%;
    gap: 2rem;
  }

  .about-intro-content-col,
  .about-intro-image-col {
    width: 100%;
    padding: 1.5rem;
    align-items: center;
    text-align: center;
  }

  .about-intro-content-col h1,
  .about-intro-content-col p,
  .about-intro-content-col p.tagline {
    width: auto;
  }

  .about-intro-content-col {
     order: 1;
  }
   .about-intro-image-col {
     order: 0;
   }

  .about-intro-button-wrapper {
     align-self: center;
  }
}

@media only screen and (max-width: 767px) {
  .about-intro-section {
     padding: 2rem 0;
  }
  .about-intro-content-col h1 {
    font-size: 30px;
    letter-spacing: -1px;
  }
  .about-intro-row {
    gap: 1.5rem;
  }
  .about-intro-content-col,
  .about-intro-image-col {
    padding: 1rem;
  }
}

/* --- Notification Banner --- */

.zone-signup-notification-banner {
  background-color: var(--primary-color);
  color: #fff;
  padding: 5px 20px;
  border-bottom: 1px solid var(--secondary-color);
  position: relative;
  font-size: 0.9rem;
  line-height: 1.4;
  z-index: 1000;
  display: flex;
}

.zone-banner-content {
  display: flex;
  align-items: center;
  gap: 15px;
  justify-content: center;
  margin: 0 auto;
}

a.zone-banner-link-area {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  flex-grow: 1;
  min-width: 250px;
  transition: opacity 0.2s ease;
}

.zone-banner-icon {
  font-size: 24px;
  line-height: 1;
  color: var(--upcoming-bg);
  flex-shrink: 0;
}

.zone-banner-message {
  margin: 0;
  flex-grow: 1;
}

.zone-banner-message:hover {
  color: var(--upcoming-bg);
}

.zone-banner-button.button {
  background-color: #fff;
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  padding: 3px 15px;
  text-decoration: none;
  border-radius: var(--border-radius-sm);
  font-weight: bold;
  white-space: nowrap;
  transition: var(--transition-base);
  flex-shrink: 0;
  font-size: var(--font-size-sm);
}

.zone-banner-button.button:hover,
.zone-banner-button.button:focus {
  background-color: var(--primary-color);
  color: #fff;
  border: 2px solid #fff;
}

/* --- Banner Responsiveness --- */
@media (max-width: 767px) {
  .zone-banner-content {
    flex-direction: column;
    padding: 6px 0;
  }
}

/* --- Header Changes --- */

@media (max-width: 980px) {
  .et_pb_row.et_pb_row_0_tb_header {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .et_pb_column_0_tb_header {
    margin-bottom: 0 !important;
  }

  .et_pb_column_1_tb_header .et_pb_text_0_tb_header {
    width: 100%;
    padding-top: 9px;
  }
}

.zone-updates-button-container {
  text-align: center;
  margin: 20px 5px 10px;
}

.zone-updates-button {
  color: #FFFFFF !important;
  border-width: 0px;
  font-family: 'Poppins',Helvetica,Arial,Lucida,sans-serif;
  background-color: var(--secondary-color);
  padding: 12px 16px;
  font-size: 18px;
  border-radius: 3px;
  border: 2px solid var(--secondary-color) !important;
  outline: none;
  cursor: pointer;
  margin: 0;
  position: relative;
  display: inline-block;
  font-weight: 700;
  overflow: hidden;
  text-decoration: none;
  z-index: 1;
  text-align: center;
  transition: ease-out 0.5s;
  box-shadow: inset 0 0 0 0 var(--secondary-color);
}

.zone-updates-button:hover {
  box-shadow: inset 0 -100px 0 0 var(--primary-color);
  border: 2px solid var(--primary-color) !important;
}

/* General Body & Element Resets for CWZ Overview Page */
/* These styles are fundamental and generally won't cause issues if applied broadly,
   but are here with the prefix for strict uniqueness on this page. */
.cwz-overview-content-area body {
  margin: 0;
  padding: 0;
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  background-color: #f8f8f8;
}

.cwz-overview-content-area a {
  color: #2ea3f2;
  text-decoration: none;
  transition: color 0.3s ease;
}

.cwz-overview-content-area a:hover {
  color: #007bff;
  text-decoration: underline;
}

.cwz-overview-content-area h1,
.cwz-overview-content-area h2,
.cwz-overview-content-area h3,
.cwz-overview-content-area h4 {
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 0.5em;
  color: #006747; /* Dark green for headings */
}

.cwz-overview-content-area h1 {
  font-size: 2.8em;
  font-weight: 700;
  letter-spacing: -1px;
}

.cwz-overview-content-area h2 {
  font-size: 2.2em;
  font-weight: 600;
  margin-bottom: 1em;
  text-align: center;
}

.cwz-overview-content-area h3 {
  font-size: 1.8em;
  font-weight: 600;
}

.cwz-overview-content-area h4 {
  font-size: 1.4em;
  font-weight: 500;
}

.cwz-overview-content-area p {
  margin-bottom: 1em;
}

.cwz-overview-content-area p:last-of-type {
  margin-bottom: 0;
}

.cwz-overview-content-area strong {
  font-weight: 700;
}

.cwz-overview-content-area ul,
.cwz-overview-content-area ol {
  list-style: disc;
  margin-left: 20px;
  padding-left: 0;
}

/* --- CWZ Overview Page Specific Sections --- */

/* Reusable Section Title */
.cwz-overview-section-title {
  text-align: center;
  margin-bottom: 40px;
  color: #006747;
  font-size: 2.5em;
}

/* Hero Section */
.cwz-overview-hero-section {
  position: relative;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  text-align: center;
  background-image: url('/wp-content/uploads/2024/09/brooklyn_new_customer.jpg'); /* Ensure this path is correct */
  background-size: cover;
  background-position: center;
}

.cwz-overview-hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 103, 71, 0.7);
}

.cwz-overview-hero-content {
  position: relative;
  z-index: 1;
  max-width: 900px;
  padding: 0 20px;
}

.cwz-overview-logo-group {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
}

.cwz-overview-logo-action,
.cwz-overview-logo-iws { /* Include if you add the IWS logo back */
  max-height: 80px;
  width: auto;
}

.cwz-overview-main-headline {
  font-size: 3.5em;
  font-weight: 800;
  letter-spacing: -2px;
  margin-bottom: 10px;
  color: #FFFFFF !important;
}

.cwz-overview-sub-headline {
  font-size: 1.5em;
  font-weight: 300;
  color: #FFFFFF;
}

/* Main Content Section (contains program explanation and impact) */
.cwz-overview-main-content-section {
  padding: 80px 20px;
  background-color: #fff;
}

.cwz-overview-main-content-container {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.cwz-overview-content-card {
  text-align: left;
}

.cwz-overview-local-law-intro {
    grid-column: 1 / -1; /* Make this card span all columns */
    text-align: center;
    font-size: 1.1em;
}

.cwz-overview-program-explanation .cwz-overview-section-title,
.cwz-overview-impact-timeline .cwz-overview-subsection-title {
  text-align: left; /* Override section title alignment */
  margin-bottom: 20px;
  font-size: 1.8em;
}

.cwz-overview-subsection-title {
  font-size: 1.4em;
  margin-top: 20px;
  margin-bottom: 10px;
  color: #006747;
}

.cwz-overview-content-text {
  font-size: 1em;
  line-height: 1.7;
}

.cwz-overview-link {
    color: #de7c00;
    font-weight: 700;
}

/* CTA Section (for "Finding Your Commercial Waste Zone...") */
.cwz-overview-cta-section {
  text-align: center;
  padding: 60px 20px;
  background-color: #eef7f4;
}

.cwz-overview-cta-text {
  font-size: 1.2em;
  margin-bottom: 30px !important;
}

.cwz-overview-cta-button {
  display: inline-block;
  background-color: #de7c00; /* Orange button */
  color: #FFFFFF !important;
  padding: 15px 30px;
  border-radius: 5px;
  font-size: 1.1em;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.cwz-overview-cta-button:hover {
  background-color: #b86500; /* Darker orange on hover */
  text-decoration: none;
}

/* New Customer Section (re-styled with unique classes for this page) */

.cwz-overview-new-customer-row {
  display: flex;
  flex-wrap: wrap; /* Allows columns to wrap on smaller screens */
  max-width: 1200px; /* Adjust as needed */
  margin: 0 auto;
  min-height: 600px; /* From original, if desired */
}

.cwz-overview-new-customer-column {
  flex: 1; /* Allows columns to grow */
  min-width: 300px; /* Minimum width before wrapping */
  padding: 20px; /* Inner padding for columns */
  box-sizing: border-box; /* Include padding in width */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cwz-overview-new-customer-image-column {
  background-image: url('https://dev-actioncarting.pantheonsite.io/wp-content/uploads/2024/09/brooklyn_new_customer.jpg');
  background-size: cover;
  background-position: center;
  min-height: 300px; /* Ensure image column has height on mobile */
  flex: 1; /* Occupy available space */
}

.cwz-overview-new-customer-content-column {
  background-color: #006747; /* Green background */
  color: #FFFFFF;
  flex: 1; /* Occupy available space */
}

.cwz-overview-new-customer-headline {
  padding-left: 50px; /* Keep this specific padding */
}

.cwz-overview-new-customer-headline-text {
  color: #FFFFFF !important;
  font-size: 40px; 
  font-weight: 700;
  letter-spacing: -2px;
  text-align: left;
}

.cwz-overview-new-customer-text {
  padding-left: 50px;
  width: 80%; /* Adjust text width within column */
  font-size: 18px; /* Specific font size */
}

.cwz-overview-new-customer-paragraph {
    margin-bottom: 1em;
}

.cwz-overview-new-customer-link {
  color: #de7c00 !important; /* Important to override default link color */
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: #de7c00;
}

.cwz-overview-phone-number {
    white-space: nowrap;
}


/* Map and Zones Section */
.cwz-overview-map-zones-section {
    padding: 80px 20px;
    background-color: #fefefe;
    text-align: center;
}

.cwz-overview-map-zone-title {
    font-size: 1.8em;
    color: #006747;
    margin-bottom: 20px;
}

.cwz-overview-map-cta {
    display: inline-block;
    background-color: #de7c00;
    color: #FFFFFF !important;
    padding: 12px 25px;
    border-radius: 5px;
    font-size: 1em;
    font-weight: 600;
    text-decoration: none;
    margin-bottom: 40px;
    transition: background-color 0.3s ease;
}

.cwz-overview-map-cta:hover {
    background-color: #b86500;
    text-decoration: none;
}

.cwz-overview-map-zones-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    align-items: flex-start; /* Align items to the top */
}

.cwz-overview-zones-list-container {
    flex: 1;
    min-width: 300px;
    text-align: left;
    padding: 30px;
}

.cwz-overview-zones-list-heading {
    font-size: 1.5em;
    color: #006747;
    margin-bottom: 20px;
}

.cwz-overview-zone-list {
  list-style: decimal !important;
    padding-left: 25px;
    margin-bottom: 0;
}

.cwz-overview-zone-item {
    margin-bottom: 8px;
    font-size: 1em;
}

.cwz-overview-map-container {
    flex: 1;
    min-width: 300px; 
    text-align: center;
    padding: 20px;
}

.cwz-overview-map-image {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
}


/* --- Footer (using general cwz-overview- class for consistency with this page's scope) --- */
/* Note: If the actual site footer is separate and globally applied by WordPress,
   these footer styles may need to be adjusted or removed based on your theme structure.
   This assumes it's part of the page content. */
.cwz-overview-footer {
  background-color: #222;
  color: #ccc;
  padding: 40px 20px;
  text-align: center;
  font-size: 0.9em;
  line-height: 1.5;
}

.cwz-overview-footer-content p {
  margin-bottom: 8px;
}

.cwz-overview-footer-link {
  color: #99ccff; /* Lighter blue for footer links */
}

.cwz-overview-footer-logo-group {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-top: 25px;
}

.cwz-overview-footer-logo-action,
.cwz-overview-footer-logo-iws {
  max-height: 45px;
  width: auto;
}

/* --- Responsive Adjustments --- */
@media (max-width: 1024px) {
  .cwz-overview-main-headline {
    font-size: 3em;
  }
  .cwz-overview-sub-headline {
    font-size: 1.3em;
  }

  .cwz-overview-main-content-container {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Allow wrapping to 2 columns */
  }

  .cwz-overview-new-customer-row {
    min-height: auto; /* Allow height to adjust */
  }
}

@media (max-width: 768px) {
  .cwz-overview-hero-section h1 {
    font-size: 2.2em;
    letter-spacing: -0.5px;
  }
  .cwz-overview-section-title {
    font-size: 1.8em;
  }
  .cwz-overview-subsection-title,
  .cwz-overview-map-zone-title,
  .cwz-overview-zones-list-heading {
    font-size: 1.4em;
  }
  .cwz-overview-new-customer-headline-text {
      font-size: 30px;
      letter-spacing: -1px;
  }

  .cwz-overview-hero-section {
    height: 300px;
  }
  .cwz-overview-main-headline {
    font-size: 2.5em;
  }
  .cwz-overview-sub-headline {
    font-size: 1.1em;
  }

  .cwz-overview-main-content-container,
  .cwz-overview-map-zones-layout {
    grid-template-columns: 1fr; /* Stack columns */
  }

  .cwz-overview-new-customer-column {
    width: 100%; /* Full width for columns */
  }
  .cwz-overview-new-customer-column:last-child {
      margin-bottom: 0;
  }

  .cwz-overview-new-customer-image-column {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .cwz-overview-new-customer-content-column {
    padding-top: 32px;
    padding-right: 40px;
    padding-bottom: 32px;
  }
  .cwz-overview-new-customer-headline {
      margin-top: -15px !important; /* Adjust specific margin */
  }
  .cwz-overview-new-customer-text {
      width: auto; /* Allow width to expand if needed */
  }
}

@media (max-width: 480px) {
  .cwz-overview-hero-section h1 {
    font-size: 1.8em;
  }
  .cwz-overview-section-title {
    font-size: 1.5em;
  }
  .cwz-overview-hero-logo-group img {
    max-height: 60px;
  }
  .cwz-overview-main-headline {
    font-size: 1.8em;
    letter-spacing: -1px;
  }

  .cwz-overview-main-content-section,
  .cwz-overview-cta-section,
  .cwz-overview-map-zones-section {
    padding: 40px 15px;
  }

  .cwz-overview-content-card,
  .cwz-overview-zones-list-container {
    padding: 20px;
  }

  .cwz-overview-new-customer-image-column {
      padding-top: 50px;
      padding-bottom: 90px;
  }
  .cwz-overview-new-customer-content-column {
      padding-top: 0px;
      padding-right: 0px;
  }
  .cwz-overview-new-customer-column {
    padding: 20px;
  }

  .cwz-overview-new-customer-headline {
      padding-top: 20px !important;
      margin-top: 0px !important;
  }
  .cwz-overview-new-customer-text {
      padding-bottom: 20px !important;
      padding-left: 0;
  }

  .cwz-overview-footer-logo-group img {
    max-height: 35px;
  }

  .cwz-overview-new-customer-headline {
    padding-left: 0;
  }
}

/* General Body & Element Resets for CWZ Resources FAQ Page */
.cwz-resources-faq-content-area body {
  margin: 0;
  padding: 0;
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  background-color: #f8f8f8;
}

.cwz-resources-faq-content-area a {
  color: #2ea3f2;
  text-decoration: none;
  transition: color 0.3s ease;
}

.cwz-resources-faq-content-area a:hover {
  color: #007bff;
  text-decoration: underline;
}

.cwz-resources-faq-content-area h1,
.cwz-resources-faq-content-area h2,
.cwz-resources-faq-content-area h3,
.cwz-resources-faq-content-area h4 {
  font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 0.5em;
  color: #006747; /* Dark green for headings */
}

.cwz-resources-faq-content-area h1 {
  font-size: 2.8em;
  font-weight: 700;
  letter-spacing: -1px;
}

.cwz-resources-faq-content-area h2 {
  font-size: 2.2em;
  font-weight: 600;
  margin-bottom: 1em;
  text-align: center;
}

.cwz-resources-faq-content-area h3 {
  font-size: 1.8em;
  font-weight: 600;
}

.cwz-resources-faq-content-area h4 {
  font-size: 1.4em;
  font-weight: 500;
}

.cwz-resources-faq-content-area p {
  margin-bottom: 1em;
}

.cwz-resources-faq-content-area p:last-of-type {
  margin-bottom: 0;
}

.cwz-resources-faq-content-area strong {
  font-weight: 700;
}

.cwz-resources-faq-content-area ul,
.cwz-resources-faq-content-area ol {
  list-style: disc; /* Default to disc, overridden for ol below */
  margin-left: 20px;
  padding-left: 0;
}

/* --- Hero Banner Section (similar to original PDF header) --- */
.cwz-resources-faq-hero-banner {
  position: relative;
  height: 200px; /* Adjust height to match PDF header visually */
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  text-align: center;
  background-image: url('https://dev-actioncarting.pantheonsite.io/wp-content/uploads/2024/09/brooklyn_new_customer.jpg'); /* Placeholder image from original HTML */
  background-size: cover;
  background-position: center;
  overflow: hidden; /* Hide overflow from banner image */
}

.cwz-resources-faq-hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 103, 71, 0.8); /* Dark green overlay for text readability */
}

.cwz-resources-faq-hero-content {
  position: relative;
  z-index: 1;
  max-width: 90%;
  padding: 0 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cwz-resources-faq-logo-group {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px; /* Space between logo and titles */
}

.cwz-resources-faq-logo-action {
  max-height: 60px; /* Adjust logo size */
  width: auto;
  filter: brightness(0) invert(1); /* Makes logo white if it's black */
}

.cwz-resources-faq-main-headline {
  font-size: 2.5em; /* Main title size */
  font-weight: 700;
  letter-spacing: -1.5px;
  margin-bottom: 5px;
  color: #FFFFFF;
}

.cwz-resources-faq-sub-headline {
  font-size: 1.5em; /* Sub title size */
  font-weight: 500;
  color: #FFFFFF;
  text-transform: uppercase;
}

/* --- Q&A Content Section --- */
.cwz-resources-faq-content-section {
  padding: 60px 20px;
  background-color: #fff;
}

.cwz-resources-faq-container {
  max-width: 1200px; /* Wider container for two columns */
  margin: 0 auto;
  display: flex; /* Enable flexbox */
  flex-wrap: wrap; /* Allow items to wrap to the next line */
  gap: 30px; /* Space between flex items */
}

.cwz-resources-faq-item {
  background-color: #f9f9f9;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 25px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  flex: 1 1 calc(50% - 15px); /* Two items per row, accounting for gap */
  box-sizing: border-box; /* Include padding/border in flex basis */
  min-width: 300px; /* Prevent items from becoming too narrow */
}

.cwz-resources-faq-question {
  color: #006747; /* Green for questions */
  font-size: 1.5em;
  font-weight: 600;
  margin-bottom: 15px;
}

.cwz-resources-faq-answer {
  font-size: 1em;
  line-height: 1.6;
  margin-bottom: 1em;
  color: #343a40;
}

.cwz-resources-faq-answer:last-child {
  margin-bottom: 0;
}

.cwz-resources-faq-answer-subtext { /* For the list of excluded materials */
    margin-top: 0.5em;
    font-size: 0.95em;
    line-height: 1.5;
}

.cwz-resources-faq-list {
  list-style: disc;
  margin-left: 20px;
  padding-left: 0;
  font-size: 1em;
  line-height: 1.6;
  margin-bottom: 1em;
}

.cwz-resources-faq-list-item {
  margin-bottom: 8px;
}

.cwz-resources-faq-list-item strong {
  color: #333;
}

.cwz-resources-faq-phone-number {
    white-space: nowrap;
}

.cwz-resources-faq-link {
    color: #de7c00 !important; /* Orange accent for links in Q&A */
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: #de7c00;
}

/* Table styles within Q&A */
.cwz-resources-faq-table-responsive {
  overflow-x: auto;
  margin-top: 20px;
}

.cwz-resources-faq-timeline-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 500px; /* Ensures readability on smaller screens */
}

.cwz-resources-faq-table-header,
.cwz-resources-faq-table-data {
  border: 1px solid #cce5da;
  padding: 10px 15px;
  text-align: left;
}

.cwz-resources-faq-zone-updates {
  color: #de7c00;
  font-weight: 600;
}

.cwz-resources-faq-table-header {
  background-color: #006747;
  color: #FFFFFF;
  font-weight: 600;
  font-size: 1.1em;
}

.cwz-resources-faq-table-data {
  background-color: #fff;
}

.cwz-resources-faq-timeline-table tr:nth-child(even) .cwz-resources-faq-table-data {
  background-color: #f4fcf8;
}


/* --- Responsive Adjustments --- */
@media (max-width: 1024px) {
  .cwz-resources-faq-main-headline {
    font-size: 2.2em;
  }
  .cwz-resources-faq-sub-headline {
    font-size: 1.2em;
  }
  .cwz-resources-faq-question {
    font-size: 1.4em;
  }
  .cwz-resources-faq-item {
    flex: 1 1 100%; /* One item per row on smaller screens */
  }
}

@media (max-width: 768px) {
  .cwz-resources-faq-hero-banner {
    height: 150px;
  }
  .cwz-resources-faq-main-headline {
    font-size: 1.8em;
    letter-spacing: -1px;
  }
  .cwz-resources-faq-sub-headline {
    font-size: 1em;
  }
  .cwz-resources-faq-question {
    font-size: 1.3em;
  }
  .cwz-resources-faq-item {
    padding: 20px;
  }
  .cwz-resources-faq-link {
    white-space: normal; /* Allow links to wrap */
  }
  .cwz-resources-faq-timeline-table {
      min-width: unset; /* Allow table to shrink on very small screens */
  }
}

@media (max-width: 480px) {
  .cwz-resources-faq-hero-banner {
    height: 120px;
  }
  .cwz-resources-faq-logo-action {
    max-height: 40px;
  }
  .cwz-resources-faq-main-headline {
    font-size: 1.5em;
    letter-spacing: -0.5px;
  }
  .cwz-resources-faq-sub-headline {
    font-size: 0.8em;
  }
  .cwz-resources-faq-item {
    padding: 15px;
  }
  .cwz-resources-faq-question {
    font-size: 1.1em;
  }
  .cwz-resources-faq-answer,
  .cwz-resources-faq-list,
  .cwz-resources-faq-answer-subtext {
    font-size: 0.9em;
  }
}