/*
Theme Name: Successive Digital
Theme URI: https://successive.tech/
Author: Successive Digital
Author URI: https://successive.tech/
Description: Successive Digital is a custom-built WordPress theme developed to deliver a scalable, performance-optimized, and enterprise-ready web experience. This theme is designed with clean architecture principles, modular template structure, and adherence to WordPress coding standards. It supports responsive layouts, SEO best practices, accessibility compliance, and extensible component-based development. The theme is optimized for fast loading, secure coding practices, and seamless integration with modern development workflows including CI/CD pipelines. It is suitable for corporate websites, digital platforms, and high-performance content-driven applications.
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: successive.tech
Tags: custom-theme, responsive, accessibility-ready, seo-optimized, corporate, scalable, performance
*/

.w-richtext table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  border: 1px solid #fff;
  margin-bottom: 1rem;
}
.w-richtext table,
.w-richtext table td,
.w-richtext table th {
  padding: 10px 1rem;
}

.prodpage_iconbox {
  background-color: #faba0017;
  border-radius: 0.75rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  display: flex;
}

/* Menu Syle */
.menu_btn_style {
  width: 30px;
  height: 20px;
  position: relative;
  display: block;
  cursor: pointer;
  border: 2px solid white;
  border-width: 2px 0 2px;
}

.menu_btn_style::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: #fff;
  left: 0;
  top: calc(50% - 1px);
}

.prodpage_iconbox_img {
  object-fit: scale-down;
  max-width: 60%;
  max-height: 60%;
}

.prodpage_iconbox.mb-4 {
  margin-bottom: 1.5rem;
}

.prodpage_iconbox.mb-3 {
  margin-bottom: 1rem;
}

.pod-hero-section .aws-hero-box {
  width: 80%;
}

/* =========================== */
.contact-form-block * {
  font-family: "Space Grotesk", sans-serif;
}

.contact-form-block {
  font-family: "Space Grotesk", sans-serif;
}

.contact-form-block .contact-form-block-inner {
  background-color: #000;
  padding: 40px;
  font-family: sans-serif;
  color: #fff;
}

/* Form Layout: 2 columns */
.contact-form-block .hs-form .form-columns-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 100%;
}

.contact-form-block .hs-form .form-columns-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  max-width: 100%;
}

.contact-form-block div .hs-form-field {
  width: 100% !important;
  background-color: var(--_secondry-base-collection---color);
  border: 1px solid #655f5f57;
  padding-top: 1.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.contact-form-block .hs-form fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

/* Field Container Styling */
.contact-form-block .hs-form-field {
  margin-bottom: 25px;
  background: #1a1a1a;
  padding: 15px 20px;
}

/* Label Styling */
.contact-form-block .hs-form-field label {
  display: block;
  font-size: 1.15rem;
  color: #ccc;
  margin-bottom: 8px;
}

.contact-form-block .hs-form-field label.hs-error-msg {
  font-size: 1rem;
  font-weight: 400;
  color: red;
}

.contact-form-block .hs-form-field .hs-form-booleancheckbox-display {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.25;
}

.contact-form-block .no-list.hs-error-msgs {
  list-style-type: none;
  padding: 0;
}

.contact-form-block .input-field-2 {
  font-size: 20%;
}

.contact-form-block .hs-form-required {
  color: #ff4d4d;
  margin-left: 4px;
}

/* Input & Textarea Styling */
.contact-form-block .hs-input:not([type="checkbox"]) {
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  font-size: 1.15rem !important;
  padding: 5px 0 !important;
  outline: none !important;
  line-height: 1.25;
}

.contact-form-block .hs-input::placeholder {
  color: #666;
}

.contact-form-block textarea.hs-input {
  min-height: 100px;
}

/* Checkbox & Consent Area */
.contact-form-block .legal-consent-container {
  font-size: 13px;
  color: #ccc;
}

.contact-form-block .legal-consent-container .hs-dependent-field,
.contact-form-block .legal-consent-container .hs-form-field {
  background: transparent;
  border: 0 none;
}

.contact-form-block .hs_recaptcha.hs-recaptcha.field.hs-form-field {
  background: transparent;
  border: 0 none;
  padding: 0;
}

.contact-form-block .inputs-list {
  padding-left: 0;
  list-style-type: none;
  margin: 0;
}

.contact-form-block .hs-form-booleancheckbox-display span {
  margin-left: 10px;
}

.contact-form-block .legal-consent-container a {
  color: #4466ff;
  text-decoration: underline;
}

/* Submit Button */
.contact-form-block .hs-submit .actions {
  margin-top: 30px;
}

.contact-form-block .hs-button.primary {
  background-color: #1a54f4 !important;
  border: none !important;
  padding: 1.15rem 5rem !important;
  border-radius: 50px !important;
  color: #fff !important;
  font-weight: bold !important;
  cursor: pointer !important;
  font-size: 1.15rem;
  transition: background 0.3s ease;
}

.contact-form-block .hs-button.primary:hover {
  background-color: #0040e6 !important;
}

.contact-form-block .grecaptcha-badge {
  margin-bottom: 20px !important;
}

.contact-form-block .legal-consent-container .field.hs-form-field {
  margin-bottom: 20px;
}
.legal-consent-container .hs-form-booleancheckbox-display input {
  position: relative;
  top: 0.15rem;
}

.contact-form-block .hs-error-msg.hs-main-font-element {
  margin-bottom: 0;
}
/* Responsive */
@media (max-width: 768px) {
  .contact-form-block .contact-form-block-inner {
    padding: 1rem;
  }

  .contact-form-block .hs-form .form-columns-2 {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .contact-form-block .hs-button.primary {
    width: 100%;
  }
}

@media all and (max-width: 991px) {
  .industry-solution-section .industry-content-wrapper {
    order: 1;
  }
  .leading .w-layout-vflex.mobile-view {
    align-items: stretch;
  }
  .service-hero-section video {
    width: 100%;
    height: 100%;
    inset: 0;
  }
  .service-about-section .main-service-cards-video {
    width: 100%;
  }
  .service-about-section .main-service-cards-video {
    display: none;
  }
}

.article-content-box {
  /* Hubspot Dark Newsletter Form */

  .hs-form {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    max-width: 520px;
    margin: 0 auto;
    gap: 0;
  }

  /* Hide Label */
  .hs-form-private.hsForm {
    display: flex;
    flex-wrap: wrap;
  }

  .hs-form .hs_email.hs-email > label {
    display: none;
  }

  /* Email Field */
  .hs-form .hs_email {
    flex: 1;
    margin: 0;
  }
  .hs-form .hs_email.hs-email {
    flex: 0 0 auto;
    width: 65%;
  }
  .hs-form .hs-input {
    background: #d9dde3;
    border: none;
    padding: 0 15px;
    height: 48px;
    font-size: 14px;
    width: 100%;
    border-radius: 2px 0 0 2px;
    margin-bottom: 0;
    color: #333;
    border: 0 none !important;
    outline: none;
    font-size: 1rem;
  }

  .no-list.hs-error-msgs.inputs-list {
    order: 1;
    list-style-type: none;
    padding: 0;
    flex: 0 0 auto;
    width: 100%;
   
  }
  .no-list.hs-error-msgs.inputs-list label{
    font-size: .85rem;
    font-weight: 400;
    line-height: 1.1;
  }
  /* Submit Button */
  .hs-form .hs_submit.hs_submit {
    margin: 0;
    flex: 0 0 auto;
    width: 35%;
  }
  .hs-form .hs_error_rollup {
    display: none;
  }
  .hs-form .hs-button {
    background: #2d8cff;
    color: #fff;
    border: none;
    padding: 0 22px;
    height: 48px;
    border-radius: 0 2px 2px 0;
    cursor: pointer;
    font-weight: 500;
    transition: 0.3s ease;
  }

  .hs-form .hs-button:hover {
    background: #1f6fd6;
  }

  /* Remove Error Message */
  .hs-form .hs-error-msgs {
    /* display: none; */
  }

  /* Hide Recaptcha */
  .hs-form .hs_recaptcha {
    display: none;
  }

  /* Remove extra spacing */
  .hs-form .hs-form-field {
    margin: 0;
  }

  /* Make inline layout */
  .hs-form {
    flex-wrap: nowrap;
  }
  @media all and (max-width:767px) {
    .no-list.hs-error-msgs.inputs-list label{
      font-size: 1rem;
    }
  }
}
