/* ============================================================
   Shopify Maintenance v2 — draft page, Gulf LP & thank-you page
   Loaded only for those templates (see functions/eneque-styles.php).
   Palette matches base.css: #050F44/#0526A3 gradient, #13A5DB accent,
   #09225D deep blue, #203B7B theme color, #191919 hero.
   ============================================================ */

/* ---------- Hero support line & CTA subline ---------- */
.mnt-support-line {
  display: inline-block;
  margin-top: 14px;
  padding: 10px 18px;
  border: 1px solid rgba(19, 165, 219, 0.45);
  border-radius: 30px;
  background: rgba(19, 165, 219, 0.12);
  color: #fff;
  font-size: 14px !important;
  line-height: 22px;
}
.mnt-cta-subline {
  margin-top: 10px;
  color: #b9c6e2;
  font-size: 14px !important;
}

/* ---------- Hero picture (replaces banner-img-block/-mobile pair) ---------- */
.banner-img-picture {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

/* ---------- Lead form ---------- */
.mnt-form-card {
  max-width: 760px;
  margin: 34px auto 0;
  padding: 28px 26px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 18px 45px rgba(5, 15, 68, 0.18);
  text-align: left;
  scroll-margin-top: 130px;
}
.mnt-form-head h3 {
  margin: 0 0 6px;
  color: #09225D;
  font-size: 22px;
}
.mnt-form-head p {
  margin: 0 0 18px;
  color: #5A5A5A;
  font-size: 15px !important;
  line-height: 23px;
}
.mnt-form-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 14px;
}
.mnt-field {
  flex: 1 1 240px;
  display: flex;
  flex-direction: column;
}
.mnt-field label {
  margin-bottom: 5px;
  color: #09225D;
  font-size: 13px;
  font-weight: 600;
}
.mnt-field input,
.mnt-field select,
.mnt-field textarea {
  width: 100%;
  padding: 11px 14px;
  border: 1px solid #d4dae8;
  border-radius: 8px;
  background: #fff;
  color: #191919;
  font-size: 15px;
  font-family: inherit;
}
.mnt-field input:focus,
.mnt-field select:focus,
.mnt-field textarea:focus {
  outline: none;
  border-color: #13A5DB;
  box-shadow: 0 0 0 3px rgba(19, 165, 219, 0.18);
}
.mnt-field.has-error input,
.mnt-field.has-error select,
.mnt-field.has-error textarea {
  border-color: #d52929;
}
.mnt-error {
  display: none;
  margin-top: 4px;
  color: #d52929;
  font-size: 12px;
}
.mnt-field.has-error .mnt-error {
  display: block;
}
.mnt-submit {
  display: block;
  width: 100%;
  padding: 15px 20px;
  border: none;
  border-radius: 8px;
  background: #13A5DB;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.3s ease;
}
.mnt-submit:hover {
  background: #09225D;
}
.mnt-submit[disabled] {
  opacity: 0.6;
  cursor: wait;
}
.mnt-form-note {
  margin: 10px 0 0;
  color: #808080;
  font-size: 12px !important;
  text-align: center;
}
.mnt-success {
  margin-top: 16px;
  padding: 16px 18px;
  border-radius: 8px;
  background: #eaf8ef;
  border: 1px solid #198754;
  color: #14532d;
}
.mnt-success p {
  margin: 6px 0 0;
  font-size: 14px !important;
  color: #14532d;
}
.mnt-form.is-sent .mnt-form-row,
.mnt-form.is-sent .mnt-submit,
.mnt-form.is-sent .mnt-form-note {
  display: none;
}
.mnt-form-section .mnt-form-card {
  margin-top: 0;
  border: 1px solid #e3e8f4;
  box-shadow: 0 14px 40px rgba(5, 15, 68, 0.08);
}

/* Compact hero variant: Name, WhatsApp, Store URL, submit only */
.mnt-form-card--compact {
  max-width: 620px;
  padding: 22px 22px 20px;
}
.mnt-form-card--compact .mnt-form-head h3 {
  font-size: 19px;
}
.mnt-form-card--compact .mnt-form-head p {
  margin-bottom: 14px;
  font-size: 14px !important;
}
.mnt-form-card--compact .mnt-form-row {
  margin-bottom: 12px;
}

/* ---------- Pricing cards: badge, footnote, risk reversal ---------- */
.maintenance-packages .card {
  position: relative;
}
.maintenance-packages .card.most-popular {
  border: 2px solid #13A5DB;
  box-shadow: 0 14px 40px rgba(19, 165, 219, 0.25);
}
.plan-badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  padding: 5px 16px;
  border-radius: 20px;
  background: #13A5DB;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  white-space: nowrap;
}
.mnt-pricing-footnote {
  margin-top: 40px;
}
.mnt-badge-risk {
  display: inline-block;
  padding: 9px 22px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 30px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}
.mnt-bundle-note {
  margin-top: 14px;
  color: #fff;
  font-size: 15px !important;
}
.mnt-bundle-note a {
  color: #7FDBFF;
  text-decoration: underline;
  font-weight: 600;
}

/* ---------- Comparison table ---------- */
.mnt-compare {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 30px;
  border: 1px solid #e3e8f4;
  border-radius: 12px;
}
.mnt-compare-table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-size: 15px;
}
.mnt-compare-table th,
.mnt-compare-table td {
  padding: 13px 16px;
  border-bottom: 1px solid #e3e8f4;
  text-align: center;
  vertical-align: middle;
  color: #191919;
}
.mnt-compare-table thead th {
  background: #050F44;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}
.mnt-compare-table thead th.is-popular {
  background: #13A5DB;
}
.mnt-compare-table thead th .th-price {
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 500;
  opacity: 0.85;
}
.mnt-compare-table tbody th[scope="row"] {
  position: sticky;
  left: 0;
  background: #f7f9fd;
  text-align: left;
  font-weight: 600;
  color: #09225D;
  min-width: 210px;
}
.mnt-compare-table thead th:first-child {
  position: sticky;
  left: 0;
  background: #050F44;
  text-align: left;
  z-index: 999;
}
.mnt-compare-table tbody tr:nth-child(even) td {
  background: #fbfcfe;
}
.mnt-compare-table tbody tr:last-child th,
.mnt-compare-table tbody tr:last-child td {
  border-bottom: none;
}
.mnt-compare-table .check::before {
  content: "\2713";
  color: #198754;
  font-size: 17px;
  font-weight: 700;
}
.mnt-compare-table tr.row-group th {
  position: static;
  background: #09225D;
  color: #fff;
  text-align: left;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
}

/* ---------- ERP & Backend Support add-on (inside dark pricing section) ---------- */
.mnt-addon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  max-width: 980px;
  margin: 34px auto 0;
  padding: 24px 26px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 16px;
  background: rgba(19, 165, 219, 0.1);
}
.mnt-addon-text {
  flex: 1 1 420px;
}
.mnt-addon-text h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 20px;
}
.mnt-addon-text p {
  margin: 0;
  color: #d6def2;
  font-size: 15px !important;
  line-height: 24px;
}
.mnt-addon-cta {
  flex: 0 0 auto;
  padding: 14px 26px;
  border: none;
  border-radius: 8px;
  background: #13A5DB;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.3s ease;
}
.mnt-addon-cta:hover {
  background: #fff;
  color: #09225D;
}
@media (max-width: 567px) {
  .mnt-addon {
    padding: 20px 18px;
  }
  .mnt-addon-cta {
    width: 100%;
  }
}

/* ---------- "Before You Hire" comparison (in-house vs Seamedia) ---------- */
.mnt-vs-intro {
  max-width: 860px;
  margin: 0 auto 10px;
}
.mnt-vs {
  margin-top: 30px;
  border: 1px solid #e3e8f4;
  border-radius: 12px;
  overflow: hidden;
}
.mnt-vs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.mnt-vs-table th,
.mnt-vs-table td {
  padding: 14px 18px;
  border-bottom: 1px solid #e3e8f4;
  text-align: left;
  vertical-align: top;
  color: #191919;
  line-height: 24px;
}
.mnt-vs-table thead th {
  background: #050F44;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}
.mnt-vs-table thead th.is-seamedia {
  background: #13A5DB;
}
.mnt-vs-table tbody th[scope="row"] {
  background: #f7f9fd;
  font-weight: 600;
  color: #09225D;
  width: 20%;
  min-width: 150px;
}
.mnt-vs-table tbody td[data-col="Seamedia"] {
  background: rgba(19, 165, 219, 0.06);
}
.mnt-vs-table tbody tr:last-child th,
.mnt-vs-table tbody tr:last-child td {
  border-bottom: none;
}
.mnt-vs-section .project-button {
  margin-top: 30px;
}
/* Stack to cards on mobile: row label becomes a heading, each cell labels itself */
@media (max-width: 567px) {
  .mnt-vs-table thead {
    display: none;
  }
  .mnt-vs-table,
  .mnt-vs-table tbody,
  .mnt-vs-table tr,
  .mnt-vs-table th,
  .mnt-vs-table td {
    display: block;
    width: 100%;
  }
  .mnt-vs-table tbody th[scope="row"] {
    border-bottom: none;
    padding: 12px 16px 6px;
    font-size: 16px;
  }
  .mnt-vs-table td {
    padding: 8px 16px;
  }
  .mnt-vs-table td::before {
    content: attr(data-col);
    display: block;
    margin-bottom: 2px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #5A5A5A;
  }
  .mnt-vs-table td[data-col="Seamedia"]::before {
    color: #13A5DB;
  }
  .mnt-vs-table tbody tr {
    border-bottom: 1px solid #e3e8f4;
  }
  .mnt-vs-table tbody tr:last-child {
    border-bottom: none;
  }
}

/* ---------- Testimonials ---------- */
.mnt-testimonials {
  background: #f7f9fd;
}
.mnt-testimonial-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  margin-top: 36px;
}
.testimonial-card {
  flex: 1 1 280px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 26px 24px;
  background: #fff;
  border: 1px solid #e3e8f4;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(5, 15, 68, 0.06);
}
.testimonial-card .t-quote {
  margin: 0 0 18px;
  color: #191919;
  font-size: 15px !important;
  line-height: 25px;
}
.testimonial-card .t-author {
  display: flex;
  align-items: center;
  gap: 12px;
}
.testimonial-card .t-logo {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: contain;
}
.testimonial-card .t-meta {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: #5A5A5A;
}
.testimonial-card .t-meta strong {
  color: #09225D;
  font-size: 15px;
}
.testimonial-card .t-country {
  color: #13A5DB;
  font-weight: 600;
}

/* ---------- Portfolio country badges ---------- */
.country-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 12px;
  border-radius: 20px;
  background: #13A5DB;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  vertical-align: middle;
}

/* ---------- Sticky mobile CTA bar ---------- */
.mnt-sticky-cta {
  display: none;
}
@media (max-width: 767px) {
  .mnt-sticky-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
    background: #fff;
    box-shadow: 0 -6px 24px rgba(5, 15, 68, 0.18);
  }
  .mnt-sticky-cta a {
    flex: 1;
    padding: 13px 10px;
    border-radius: 8px;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
  }
  .mnt-sticky-wa {
    background: #25D366;
    color: #fff;
  }
  .mnt-sticky-audit {
    background: #09225D;
    color: #fff;
  }
  /* lift the round floating WhatsApp icon above the bar on these templates */
  body[class*="shopify-monthly-maintenance-draft-v2"] .floating-chat,
  body[class*="lp-shopify-maintenance-gulf"] .floating-chat {
    bottom: 90px;
  }
}

/* ---------- Credential ribbon (hero, above H1) ---------- */
.mnt-cred-ribbon {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px 12px;
  margin: 14px 0 18px;
  color: #b9c6e2;
  font-size: 14px;
  line-height: 22px;
}
.mnt-cred-ribbon[hidden] {
  display: none !important;
}
.mnt-stat-num {
  color: #13A5DB;
  font-weight: 700;
}
.mnt-stat-sep {
  opacity: 0.5;
}

/* ---------- Entry-point buttons (above lead form) ---------- */
.mnt-entry-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 0 0 28px;
}
.mnt-entry-btn {
  padding: 13px 22px;
  border: 1px solid #13A5DB;
  border-radius: 30px;
  background: #fff;
  color: #09225D;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease;
}
.mnt-entry-btn:hover {
  background: #13A5DB;
  color: #fff;
}
@media (max-width: 567px) {
  .mnt-entry-row {
    gap: 10px;
  }
  .mnt-entry-btn {
    flex: 1 1 calc(50% - 10px);
    padding: 12px 10px;
    font-size: 14px;
  }
  /* the long "in-house team" label gets its own full-width row */
  .mnt-entry-btn:last-child {
    flex-basis: 100%;
  }
}

/* ---------- AI + human sign-off section ---------- */
.mnt-ai-section .mnt-vs-table td:last-child {
  background: rgba(19, 165, 219, 0.06);
}
.mnt-ai-signoff {
  margin: 26px 0 0;
  text-align: center;
  color: #09225D;
  font-size: 17px !important;
}
@media (max-width: 567px) {
  .mnt-ai-section .mnt-vs-table td:last-child::before {
    color: #13A5DB;
  }
}

/* ---------- Risk-reversal guarantee block (Flexible Terms) ---------- */
.mnt-guarantee {
  margin-top: 34px;
  padding: 30px 28px;
  border: 2px solid #13A5DB;
  border-radius: 16px;
  background: #f7f9fd;
}
.mnt-guarantee-title {
  margin: 0 0 22px;
  text-align: center;
  color: #09225D;
  font-size: 22px;
}
.mnt-guarantee-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 22px;
}
.mnt-guarantee-item {
  flex: 1 1 200px;
      flex: 1 1 200px;
    background-color: #50b4d93b;
    padding: 20px;
    border-radius: 20px;
}
.mnt-guarantee-item h4 {
  margin: 0 0 6px;
  color: #09225D;
  font-size: 16px;
}
.mnt-guarantee-item p {
  margin: 0;
  color: #5A5A5A;
  font-size: 14px !important;
  line-height: 23px;
}
.mnt-guarantee-foot {
  margin: 24px 0 0;
  text-align: center;
  color: #09225D;
  font-size: 15px !important;
  font-weight: 700;
}
@media (max-width: 567px) {
  .mnt-guarantee {
    padding: 24px 18px;
  }
  .mnt-guarantee-item {
    flex-basis: 100%;
  }
}

/* ---------- Anchor offsets for fixed menu ---------- */
.mnt-form-card,
.maintenance-packages {
  scroll-margin-top: 120px;
}

/* ============================================================
   Gulf Ads Landing Page (pages/lp-shopify-maintenance-gulf.php)
   ============================================================ */
.mnt-lp-header {
  position: sticky;
  top: 0;
  z-index: 998;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 20px;
  background: #fff;
  box-shadow: 0 2px 14px rgba(5, 15, 68, 0.1);
}
.mnt-lp-header .lp-logo img {
  height: 35px;
  width: auto;
  display: block;
}
.mnt-lp-header .lp-contact {
  display: flex;
  align-items: center;
  gap: 10px;
}
.mnt-lp-header .lp-contact a {
  display: inline-block;
  padding: 9px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.mnt-lp-header .lp-phone {
  border: 1px solid #09225D;
  color: #09225D;
}
.mnt-lp-header .lp-wa {
  background: #25D366;
  color: #fff;
}
@media (max-width: 567px) {
  .mnt-lp-header .lp-phone {
    display: none;
  }
}
.mnt-lp .banner-bg-section {
  padding-top: 60px;
}
.mnt-lp-footer {
  padding: 34px 20px;
  background: #000;
  color: #a8a8a8;
  text-align: center;
  font-size: 14px;
}
.mnt-lp-footer p {
  margin: 0 0 8px;
  color: #a8a8a8;
  font-size: 14px !important;
}
.mnt-lp-footer a {
  color: #7FDBFF;
  text-decoration: none;
}

/* ============================================================
   Thank-you page
   ============================================================ */
.mnt-thankyou {
  max-width: 640px;
  margin: 0 auto;
  padding: 110px 20px 90px;
  text-align: center;
}
.mnt-thankyou h1 {
  color: #09225D;
  font-size: 38px;
  margin-bottom: 16px;
}
.mnt-thankyou p {
  color: #5A5A5A;
  line-height: 27px;
}
.mnt-thankyou .mnt-badge-risk {
  border-color: #d4dae8;
  color: #09225D;
  margin-top: 18px;
}
.mnt-thankyou .project-button {
  margin-top: 26px;
}
#shopify-audit-form{
  display: flex;
    align-items: center;
    justify-content: center;
}
#shopify-audit-form .saw-btn {
    background: var(--theme-color);
}
@media(min-width:1401px){
.page-template-shopify-monthly-maintenance-draft-v2 .innovative-section-block.process-works .innovative-item .description-block {
    min-height: 305px !important;
}
.page-template-shopify-monthly-maintenance-draft-v2 .maintenance-packages .card ul{
      min-height: 605px;
}
}
@media(max-width:767px){
.page-template-shopify-monthly-maintenance-draft-v2 .innovative-section-block.process-works .innovative-item .description-block,.page-template-shopify-monthly-maintenance-draft-v2 .innovative-section-block .container .innovative-wrap .innovative-item{
  height: auto !important;
          min-height: auto !important;
}
}
@media (min-width: 992px) {
    .page-template-shopify-monthly-maintenance-draft-v2 .innovative-section-block {
        padding-top: 67px !important;
        padding-bottom: 112px !important;
    }
    .mnt-form-section{
      padding: 0;
    }
}

.saw-title,.saw-subtitle{
  text-align: center;
}

@media (max-width: 767px) {
    .page-template-shopify-monthly-maintenance-draft-v2 .wpt-floating {
        bottom: 69px !important;
    }
  }
  #gotoTop{
        bottom: 66px!important;
  }
  .floating-chat {
    right:10px!important;
  }
  .page-template-shopify-monthly-maintenance-draft-v2 .integration-card.service-card .icon img{
        width: 50px!important;
    height: 50px!important;

  }
@media(min-width:992px) and (max-width:1199px){
 .page-template-shopify-monthly-maintenance-draft-v2 .maintenance-packages .card ul
 {
      min-height: 567px;
 }
}
@media (min-width: 1200px) {
.maintenance-packages .card p {
    min-height: 85px;
}
}
.page-template-shopify-monthly-maintenance-draft-v2 .portfolio-list.support-services .collection-box .content-block {
    margin: 00px 0px 0px;
}
@media (max-width: 991px) {
    .page-template-shopify-monthly-maintenance-draft-v2 .maintenance-packages .collection-box .content-block.plan {
        margin: 20px;
    }
}
@media (max-width: 567px) {
    .page-template-shopify-monthly-maintenance-draft-v2 .services-expand .block {
        min-height: auto;
    }
}