/* ============================================
   FIXED FOOTER LAYOUT - 3 COLUMNS SIDE BY SIDE
   ============================================ */

/* 1. FOOTER BASE STYLES */
#fs-1528971627712.astroid-footer-section {
  background: linear-gradient(180deg, #0c5a4d1c 18%, #218576 100%);
  color: #222222;
  padding: 60px 0 25px 0;
  position: relative;
  overflow: hidden;
  font-size: 16px;
}

/* 2. MAIN CONTAINER FIX */
#fs-1528971627712 .container {
  max-width: 1200px;
  padding: 0 20px;
  margin: 0 auto;
}

/* 3. MAIN ROW - Force 3 columns on desktop */
#fs-1528971627712 #ar-941582093674805 {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 30px !important;
  width: 100% !important;
}

/* 4. COLUMNS - Force side by side */
#fs-1528971627712 #ac-851582093674805,
#fs-1528971627712 #ac-381582093674805,
#fs-1528971627712 #ac-60cc17f1e95d2c45744883 {
  display: block !important;
  float: none !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

/* Column 1: Slogan & Social - 25% */
#fs-1528971627712 #ac-851582093674805 {
  flex: 0 0 25% !important;
  max-width: 25% !important;
}

/* Column 2: Navigation - 20% */
#fs-1528971627712 #ac-381582093674805 {
  flex: 0 0 20% !important;
  max-width: 20% !important;
}

/* Column 3: Newsletter - 55% - Center content */
#fs-1528971627712 #ac-60cc17f1e95d2c45744883 {
  flex: 0 0 55% !important;
  max-width: 55% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

/* ============================================
   NEWSLETTER FORM - FIXED WIDTH & ALIGNMENT
   ============================================ */

/* Form container - centered with fixed width */
#fs-1528971627712 .acym_module_form {
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: 500px !important;
  display: block !important;
  margin: 20px auto 0 !important;
}

/* FIXED: COMPLETELY remove the original checkbox that was at the top */
#fs-1528971627712 .acym_module_form > .acym_lists {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  opacity: 0 !important;
  position: absolute !important;
  z-index: -9999 !important;
}

/* Remove the pseudo-elements that were creating extra checkboxes */
#fs-1528971627712 .acym_form .acysubbuttons::before,
#fs-1528971627712 .acym_form .acysubbuttons::after {
  display: none !important;
}

/* Fix the form table layout */
#fs-1528971627712 .acym_form table {
  width: 500px !important;
  border-collapse: collapse !important;
  background: transparent !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Stack form fields vertically */
#fs-1528971627712 .acym_form tbody {
  display: block !important;
  width: 450px !important;
}

#fs-1528971627712 .acym_form tr {
  display: block !important;
  width: 4500px !important;
  margin-bottom: 0 !important;
}

/* First row for Name and Email stacked */
#fs-1528971627712 .acym_form tr:first-child {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
  margin-bottom: 20px !important;
  width: 500px !important;
}

/* Make Name and Email fields take full 500px width and stack */
#fs-1528971627712 .acym_form td.acyfield_1,
#fs-1528971627712 .acym_form td.acyfield_2 {
  flex: 0 0 500px !important;
  max-width: 500px !important;
  width: 500px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Add spacing between stacked fields */
#fs-1528971627712 .acym_form td.acyfield_1 {
  margin-bottom: 15px !important;
}

/* FIXED WIDTH form inputs - 500px wide */
#fs-1528971627712 .acym_form input[type="text"],
#fs-1528971627712 .acym_form input[type="email"] {
  width: 500px !important;
  max-width: 500px !important;
  min-width: 450px !important;
  padding: 16px 20px !important;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 10px;
  color: #222222;
  font-size: 1rem;
  box-sizing: border-box !important;
  transition: all 0.3s ease;
  min-height: 55px;
  display: block !important;
}

#fs-1528971627712 .acym_form input:focus {
  outline: none;
  border-color: #4fd1c7;
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0 0 0 3px rgba(79, 209, 199, 0.2);
}

/* Bottom row for Subscribe button and Checkbox - FIXED 500px width */
#fs-1528971627712 .acym_form .acysubbuttons {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 500px !important;
  max-width: 500px !important;
  min-width: 450px !important;
  margin: 20px auto 0 auto !important;
  gap: 25px !important;
  position: relative;
}

/* ONLY SHOW THE CHECKBOX IN THE BOTTOM ROW */
#fs-1528971627712 .acym_form .acysubbuttons .acym_lists {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  order: 1;
}

#fs-1528971627712 .acym_form .acysubbuttons .acym_lists tbody,
#fs-1528971627712 .acym_form .acysubbuttons .acym_lists tr,
#fs-1528971627712 .acym_form .acysubbuttons .acym_lists td {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

#fs-1528971627712 .acym_form .acysubbuttons .acym_lists label {
  color: #222222 !important;
  font-size: 0.95rem;
  font-weight: 500;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap;
}

#fs-1528971627712 .acym_form .acysubbuttons .acym_lists .acym_checkbox {
  width: 22px !important;
  height: 22px !important;
  accent-color: #218576;
  cursor: pointer;
  margin: 0 !important;
  padding: 0 !important;
}

/* Subscribe button - proper width and alignment */
#fs-1528971627712 .subbutton {
  background: #218576;
  color: white;
  border: none;
  padding: 18px 40px !important;
  font-size: 1rem;
  font-weight: 600;
  border-radius: 10px;
  cursor: pointer;
  width: 220px !important;
  min-width: 220px !important;
  max-width: 220px !important;
  min-height: 55px;
  transition: all 0.3s ease;
  flex-shrink: 0;
  white-space: nowrap;
  display: block !important;
  order: 2;
}

#fs-1528971627712 .subbutton:hover {
  background: #1a6b5e;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(33, 133, 118, 0.3);
}

/* Form labels */
#fs-1528971627712 .acym__users__creation__fields__title {
  color: #222222 !important;
  font-size: 0.95rem;
  font-weight: 600;
  margin-bottom: 10px;
  display: block;
  width: 500px !important;
}

/* Ensure all form elements stay within 500px */
#fs-1528971627712 .acym_module_form,
#fs-1528971627712 .acym_fulldiv,
#fs-1528971627712 #acym_fulldiv_formAcym70901 {
  width: 500px !important;
  max-width: 500px !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Your navigation heading padding */
#n-641cf0196bca8c99960901 .heading {
  padding-left: 15px;
}

/* ============================================
   RESPONSIVE - TABLET (991px and below)
   ============================================ */
@media (max-width: 991px) {
  /* Stack columns on tablet/mobile */
  #fs-1528971627712 #ar-941582093674805 {
    flex-wrap: wrap !important;
  }

  #fs-1528971627712 #ac-851582093674805,
  #fs-1528971627712 #ac-381582093674805,
  #fs-1528971627712 #ac-60cc17f1e95d2c45744883 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin-bottom: 30px;
  }

  /* Center everything on tablet/mobile */
  #fs-1528971627712 #ac-60cc17f1e95d2c45744883 {
    align-items: center !important;
    text-align: center;
  }

  /* Make form responsive on mobile - reduce width */
  #fs-1528971627712 .acym_module_form,
  #fs-1528971627712 .acym_form table,
  #fs-1528971627712 .acym_form tbody,
  #fs-1528971627712 .acym_form tr:first-child,
  #fs-1528971627712 .acym_form td.acyfield_1,
  #fs-1528971627712 .acym_form td.acyfield_2,
  #fs-1528971627712 .acym_form .acysubbuttons,
  #fs-1528971627712 .acym__users__creation__fields__title {
    width: 100% !important;
    max-width: 100% !important;
    min-width: auto !important;
  }

  /* Make inputs responsive */
  #fs-1528971627712 .acym_form input[type="text"],
  #fs-1528971627712 .acym_form input[type="email"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: auto !important;
    padding: 14px 18px !important;
    min-height: 50px;
  }

  /* Stack checkbox and button on mobile */
  #fs-1528971627712 .acym_form .acysubbuttons {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 15px !important;
    margin-top: 20px !important;
  }

  /* Center checkbox on mobile */
  #fs-1528971627712 .acym_form .acysubbuttons .acym_lists {
    justify-content: center !important;
    order: 2 !important;
  }

  /* Make button full width on mobile */
  #fs-1528971627712 .subbutton {
    width: 100% !important;
    max-width: 100% !important;
    min-width: auto !important;
    order: 1 !important;
  }

  #fs-1528971627712 .acym__users__creation__fields__title {
    text-align: center;
  }
}

/* ============================================
   YOUR SPECIFIC LAPTOP SIZES - 1100px width
   ============================================ */
@media (max-width: 1300px) and (max-height: 690px),
  (max-width: 1265px) and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
  (max-width: 1265px) and (max-height: 585px) and (min-resolution: 144dpi) {
  /* 1. Set container to 1100px */
  #fs-1528971627712 .container {
    max-width: 1100px !important;
    padding: 0 30px;
  }

  /* 2. Keep 3 columns side by side */
  #fs-1528971627712 #ar-941582093674805 {
    display: flex !important;
    flex-wrap: nowrap !important;
  }

  /* 3. Adjust column widths: 25% | 15% | 60% */
  #fs-1528971627712 #ac-851582093674805 {
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }

  #fs-1528971627712 #ac-381582093674805 {
    flex: 0 0 15% !important;
    max-width: 15% !important;
  }

  #fs-1528971627712 #ac-60cc17f1e95d2c45744883 {
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }

  /* 4. Reduce form width for smaller screens */
  #fs-1528971627712 .acym_module_form,
  #fs-1528971627712 .acym_form table,
  #fs-1528971627712 .acym_form tbody,
  #fs-1528971627712 .acym_form tr:first-child,
  #fs-1528971627712 .acym_form td.acyfield_1,
  #fs-1528971627712 .acym_form td.acyfield_2,
  #fs-1528971627712 .acym_form .acysubbuttons,
  #fs-1528971627712 .acym__users__creation__fields__title {
    width: 450px !important;
    max-width: 450px !important;
  }

  /* 5. Make form inputs slightly smaller for this screen size */
  #fs-1528971627712 .acym_form input[type="text"],
  #fs-1528971627712 .acym_form input[type="email"] {
    width: 500px !important;
    max-width: 500px !important;
    min-width: 500px !important;
    padding: 14px 18px !important;
    min-height: 40px;
  }

  /* 6. Footer styling adjustments */
  #fs-1528971627712.astroid-footer-section {
    padding: 35px 0 15px 0;
    font-size: 14px;
  }

  #fs-1528971627712 #lsmsgt-63ee17a26bf78834807009 .heading {
    font-size: 1.5rem;
    margin-bottom: 15px;
  }

  /* Adjust button width for smaller form */
  #fs-1528971627712 .subbutton {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
    padding: 12px 30px !important;
    min-height: 50px;
  }
}

#ar-941582093674805 {
  padding: 0px !important;
}

/* ============================================
   STYLE THE JAVASCRIPT CREATED CHECKBOX
   ============================================ */

/* Style the newsletter checkbox container */
#fs-1528971627712 .acym_form .acysubbuttons .newsletter-checkbox-container {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  order: 1;
  flex: 1;
}

/* Style the label */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  label {
  color: #222222 !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  cursor: pointer;
  margin: 0 !important;
  padding: 12px 15px !important;
  white-space: nowrap;
  transition: all 0.3s ease;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Hover effect for the checkbox label */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  label:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(79, 209, 199, 0.3);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

/* Custom checkbox styling */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  input[type="checkbox"] {
  width: 24px !important;
  height: 24px !important;
  cursor: pointer;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  border: 2px solid #218576 !important;
  border-radius: 6px !important;
  background: white !important;
  transition: all 0.3s ease;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Checkbox checked state */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  input[type="checkbox"]:checked {
  background: #218576 !important;
  border-color: #218576 !important;
}

/* Custom checkmark */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  input[type="checkbox"]:checked::after {
  content: "✓";
  color: white !important;
  font-size: 16px !important;
  font-weight: bold !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Focus state for accessibility */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  input[type="checkbox"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(33, 133, 118, 0.3) !important;
}

/* Add a subtle icon before "Newsletters" text */
#fs-1528971627712
  .acym_form
  .acysubbuttons
  .newsletter-checkbox-container
  label::before {
  content: "📧";
  font-size: 1.1rem;
  opacity: 0.8;
}

/* Make sure the checkbox is properly aligned */
#fs-1528971627712 .acym_form .acysubbuttons {
  align-items: center !important;
}

/* Responsive adjustments for the checkbox */
@media (max-width: 991px) {
  #fs-1528971627712 .acym_form .acysubbuttons .newsletter-checkbox-container {
    width: 100% !important;
    justify-content: center !important;
  }

  #fs-1528971627712
    .acym_form
    .acysubbuttons
    .newsletter-checkbox-container
    label {
    padding: 10px 20px !important;
    justify-content: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  #fs-1528971627712
    .acym_form
    .acysubbuttons
    .newsletter-checkbox-container
    input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
  }
}

/* For the specific laptop sizes */
@media (max-width: 1300px) and (max-height: 690px),
  (max-width: 1265px) and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
  (max-width: 1265px) and (max-height: 585px) and (min-resolution: 144dpi) {
  #fs-1528971627712
    .acym_form
    .acysubbuttons
    .newsletter-checkbox-container
    label {
    padding: 10px 12px !important;
    font-size: 0.95rem !important;
  }

  #fs-1528971627712
    .acym_form
    .acysubbuttons
    .newsletter-checkbox-container
    input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
  }
  #fs-1528971627712 .acym_form input[type="text"],
  #fs-1528971627712 .acym_form input[type="email"] {
    max-width: 450px !important;
    min-width: 450px !important;
  }
}
