/* ==========================================================================
   Appslin — Portal Development page: requested updates layer
   Additive only. Loaded last. No production stylesheet is modified.
   ========================================================================== */

/* ---------- 1. Hero: tighter gap under navigation + image nudged up ------- */
.pr-hero {
  padding-top: clamp(22px, 3vw, 44px);
}
.pr-hero .crumbs {
  margin-bottom: 14px;
}
@media (min-width: 993px) {
  .pr-hero .pr-hero-grid {
    align-items: start;
  }
  .pr-hero .pr-hero-visual {
    transform: translateY(-26px);
  }
}
@media (max-width: 992px) {
  .pr-hero .pr-hero-visual {
    transform: translateY(-6px);
  }
}

/* ---------- 2. Critical Aspects: show the full image, no cropping -------- */
#critical-aspects .pp-split {
  align-items: start;
}
#critical-aspects .pp-split-visual {
  height: auto;
  align-self: start;
}
#critical-aspects .pp-split-visual img {
  flex: 0 0 auto;
  height: auto;
  min-height: 0;
  max-height: none;
  object-fit: contain;
  object-position: center;
  background: #fff;
}
@media (min-width: 993px) {
  #critical-aspects .pp-split-visual {
    position: sticky;
    top: 96px;
  }
}

/* ---------- 4. CTA band after FAQ ---------------------------------------- */
.pr-cta-after-faq {
  padding: clamp(40px, 5vw, 76px) 0;
}
.pr-cta-after-faq .cta-band p {
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 600px) {
  .pr-cta-after-faq .cta-band {
    padding: 30px 20px;
  }
}

/* ==========================================================================
   Round 2 — approved micro-adjustments only (additive)
   ========================================================================== */

/* ---------- R2.1 Banner image slightly larger, uses space below ---------- */
@media (min-width: 993px) {
  .pr-hero .pr-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
    align-items: center;
  }
  .pr-hero .pr-hero-visual {
    transform: translateY(-8px);
  }
}
@media (min-width: 1200px) {
  .pr-hero .pr-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.36fr);
  }
}

/* ---------- R2.2 Schedule Meeting: wider Submit button ------------------- */
#schdule-quotation .btn[type="submit"],
#schdule-quotation input[type="submit"].btn,
#schdule-quotation button[type="submit"].btn {
  min-width: 260px;
  padding-left: 34px;
  padding-right: 34px;
}
@media (max-width: 520px) {
  #schdule-quotation .btn[type="submit"],
  #schdule-quotation input[type="submit"].btn,
  #schdule-quotation button[type="submit"].btn {
    min-width: 0;
    width: 100%;
  }
}

/* ---------- R2.3 Tighter FAQ -> CTA transition --------------------------- */
#faq.section {
  padding-bottom: clamp(28px, 3.2vw, 46px);
}
.pr-cta-after-faq {
  padding-top: clamp(24px, 2.8vw, 40px);
}

/* ---------- R3.1 WhatsApp widget: remove stray white panel behind icon ---- */
/* Hides the Elfsight platform toolbar/placeholder card that renders as an
   empty white box behind the floating WhatsApp button. The button, widget
   and all functionality stay untouched. */
.eapps-widget-toolbar,
.eapps-widget-toolbar-panel,
.eapps-widget-toolbar-panel-inner,
.eapps-custom-widget-toolbar,
[class^="elfsight-app-"] > .eapps-widget-toolbar,
[class*=" elfsight-app-"] > .eapps-widget-toolbar {
  display: none !important;
}
[class^="elfsight-app-"],
[class*=" elfsight-app-"],
[class^="elfsight-app-"] > div,
[class*=" elfsight-app-"] > div {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}
/* Keep the widget's own coloured elements intact */
[class^="elfsight-app-"] [class*="Button"],
[class*=" elfsight-app-"] [class*="Button"],
[class^="elfsight-app-"] [class*="Popup"],
[class*=" elfsight-app-"] [class*="Popup"],
[class^="elfsight-app-"] [class*="Chat"],
[class*=" elfsight-app-"] [class*="Chat"] {
  background: revert !important;
  box-shadow: revert !important;
}