/* SECTION164 — Nhận Báo Giá / Đăng ký (match Ladi) */
.mc-quote-wrap.elementor-section,
.elementor-section.mc-quote-wrap {
  --mc-quote-accent: #850e35;
  --mc-quote-accent-soft: rgba(133, 14, 53, 0.3);
  --mc-quote-icon-accent: #ee6983;
  --mc-quote-text: #545454;
  --mc-quote-bg: rgb(255, 247, 249);
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
  min-height: 742px;
  background: var(--mc-quote-bg) !important;
  overflow: visible;
}

.mc-quote-wrap > .elementor-container {
  position: relative !important;
  width: min(100%, 1200px) !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  min-height: 742px;
}

.mc-quote-wrap > .elementor-container > .elementor-column,
.mc-quote-wrap > .elementor-container > .elementor-column > .elementor-widget-wrap {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  position: relative !important;
  min-height: 742px;
  overflow: visible !important;
}

.mc-quote-wrap .elementor-element {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}

.mc-quote-wrap .elementor-element.mc-quote__stage-html {
  position: absolute !important;
  inset: 0;
  z-index: 1;
  width: 100% !important;
  height: 100%;
  pointer-events: none;
  overflow: visible !important;
}

.mc-quote-wrap .elementor-element.mc-quote__stage-html > .elementor-widget-container {
  overflow: visible !important;
}

.mc-quote-wrap .mc-quote__stage {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: visible;
}

/* BOX181 — large white backdrop (shadow must stay visible; product paints over it) */
.mc-quote-wrap .mc-quote__card {
  position: absolute;
  left: 347px;
  top: 66px;
  width: 708px;
  height: 590px;
  z-index: 2;
  background: #fff;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px -15px;
  overflow: visible;
}

/* GROUP165 — left accent panel */
.mc-quote-wrap .mc-quote__panel {
  position: absolute;
  left: 82px;
  top: 66px;
  width: 311px;
  height: 590px;
  z-index: 3;
  overflow: visible;
}

/* BOX166 */
.mc-quote-wrap .mc-quote__panel-bar {
  position: absolute;
  left: 28px;
  top: 0;
  width: 239px;
  height: 100%;
  background: var(--mc-quote-accent);
  overflow: visible;
}

/* SHAPE167 / SHAPE168 — wavy blobs, rotate on hover */
.mc-quote-wrap .mc-quote__wave {
  position: absolute;
  z-index: 2;
  pointer-events: auto;
  cursor: default;
  overflow: visible;
}

.mc-quote-wrap .mc-quote__wave-inner {
  width: 100%;
  height: 100%;
  transition: transform 150ms linear, opacity 150ms linear;
  transform-origin: center center;
  will-change: transform;
}

.mc-quote-wrap .mc-quote__wave-inner svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: rgba(255, 255, 255, 0.1);
}

.mc-quote-wrap .mc-quote__wave--a {
  left: 22px;
  top: 39px;
  width: 289px;
  height: 173px;
}

.mc-quote-wrap .mc-quote__wave--a .mc-quote__wave-inner {
  transform: rotate(-90deg);
}

.mc-quote-wrap .mc-quote__wave--b {
  left: 0;
  top: 303px;
  width: 207px;
  height: 130px;
}

.mc-quote-wrap .mc-quote__wave--b .mc-quote__wave-inner {
  transform: rotate(90deg);
}

.mc-quote-wrap .mc-quote__wave:hover .mc-quote__wave-inner,
.mc-quote-wrap .mc-quote__wave:focus-within .mc-quote__wave-inner {
  transform: rotate(0deg);
  opacity: 1;
}

.mc-quote-wrap .mc-quote__panel-tri {
  position: absolute;
  left: 198px;
  top: 17px;
  width: 25px;
  height: 24px;
  z-index: 3;
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__panel-tri svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* SHAPE169 — ring on panel */
.mc-quote-wrap .mc-quote__panel-ring {
  position: absolute;
  left: 89px;
  top: 474px;
  width: 70px;
  height: 60px;
  z-index: 2;
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__panel-ring svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* SHAPE171 / SHAPE172 — real SVG dot grids on panel */
.mc-quote-wrap .mc-quote__panel-dots {
  position: absolute;
  top: 19px;
  width: 67px;
  height: 57px;
  z-index: 3;
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__panel-dots svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mc-quote-wrap .mc-quote__panel-dots--a {
  left: 50px;
}

.mc-quote-wrap .mc-quote__panel-dots--b {
  left: 125px;
}

/* Decorative shapes outside panel (Ladi SHAPE175/179/180) — above card so they sit on box-shadow */
.mc-quote-wrap .mc-quote__deco {
  position: absolute;
  pointer-events: none;
  z-index: 4;
  overflow: visible;
}

.mc-quote-wrap .mc-quote__deco svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* SHAPE175 — pink DOT GRID top-right (wrap-absolute desktop) */
.mc-quote-wrap .mc-quote__deco--dots-tr {
  left: 1002px;
  top: 0;
  width: 148px;
  height: 135px;
}

/* SHAPE179 — relative to .mc-quote__product (desktop product @684,317 → wrap 1025,575) */
.mc-quote-wrap .mc-quote__deco--circle-br {
  left: 341px;
  top: 258px;
  width: 145px;
  height: 145px;
}

/* SHAPE180 — solid pink circle near form */
.mc-quote-wrap .mc-quote__deco--circle-mid {
  left: 340px;
  top: 30px;
  width: 47px;
  height: 47px;
  z-index: 4;
}

/* GROUP198 / FRAME199 — form card (clip SHAPE200 petals inside like Ladi) */
.mc-quote-wrap .mc-quote__form-shell {
  position: absolute;
  left: 278px;
  top: 135px;
  width: 360px;
  height: 473px;
  z-index: 5;
  background: #fff;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px 0;
  pointer-events: auto;
  overflow: hidden;
}

.mc-quote-wrap .mc-quote__form-title {
  position: absolute;
  left: 48px;
  top: 44px;
  width: 265px;
  margin: 0;
  font-family: Tinos, Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.4;
  text-align: center;
  color: var(--mc-quote-accent);
  z-index: 2;
}

/* SHAPE200 */
.mc-quote-wrap .mc-quote__form-ring {
  position: absolute;
  left: -55px;
  top: -82px;
  width: 227px;
  height: 227px;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
  background: none;
}

.mc-quote-wrap .mc-quote__form-ring svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mc-quote-wrap .mc-quote__form-note {
  position: absolute;
  left: 35px;
  top: 391px;
  width: 290px;
  z-index: 7;
  margin: 0;
  font-family: Tinos, Georgia, "Times New Roman", serif;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  color: var(--mc-quote-text);
  pointer-events: none;
}

.mc-quote-wrap .elementor-element.mc-quote__form-shortcode {
  position: absolute !important;
  left: 311px;
  top: 256px;
  z-index: 6;
  width: 294px !important;
  max-width: 294px !important;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 {
  margin: 0;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form {
  display: block !important;
  position: relative;
  width: 294px;
  height: 250px;
  min-height: 250px;
  max-height: 250px;
  overflow: visible;
  gap: 0 !important;
  grid-template-columns: none !important;
}

/* CF7 wraps all fields in one <p> with <br> — match Ladi absolute tops */
.mc-quote-wrap .mc-quote__form-shortcode form > p {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  position: relative;
  width: 294px;
  height: 250px;
  line-height: 0;
}

.mc-quote-wrap .mc-quote__form-shortcode form > p > br {
  display: none !important;
}

.mc-quote-wrap .mc-quote__form-shortcode label {
  display: block;
  margin: 0;
  font-size: 0;
  line-height: 0;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap {
  display: block;
  position: absolute;
  left: 0;
  width: 294px;
  height: 40px;
  line-height: normal;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap[data-name="your-name"] {
  top: 0;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap[data-name="your-email"] {
  top: 47px;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap[data-name="your-phone"] {
  top: 95px;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap[data-name="your-address"] {
  top: 143px;
}

.mc-quote-wrap .mc-quote__form-shortcode input[type="text"],
.mc-quote-wrap .mc-quote__form-shortcode input[type="email"],
.mc-quote-wrap .mc-quote__form-shortcode input[type="tel"] {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0 8px;
  box-sizing: border-box;
  border: 1px solid rgba(5, 31, 78, 0.2);
  border-radius: 0;
  background: #fff;
  font-family: "Open Sans", Tinos, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.8);
}

/* BUTTON220 — top 210, gap 27px after last field (Ladi) */
.mc-quote-wrap .mc-quote__form-shortcode input[type="submit"],
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-submit {
  position: absolute;
  left: 0;
  top: 210px;
  width: 294px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--mc-quote-accent);
  color: #fff;
  font-family: Tinos, Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

/* CF7 default: visibility:hidden still keeps 24×24 + margin in flow → empty gap */
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-spinner {
  position: absolute !important;
  left: 50%;
  top: 222px;
  z-index: 2;
  display: none !important;
  width: 24px;
  height: 24px;
  margin: 0 0 0 12px !important;
  transform: translateX(110px);
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__form-shortcode form.submitting .wpcf7-spinner {
  display: inline-block !important;
  visibility: visible;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-response-output {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  margin: 4px 0 0;
  padding: 6px 8px;
  font-size: 12px;
}

/* Hide CF7 red tips — quote form uses native HTML5 tooltips only */
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-not-valid-tip,
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-validation-errors,
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form.invalid .wpcf7-response-output,
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form.unaccepted .wpcf7-response-output,
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form.spam .wpcf7-response-output,
.mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form.failed .wpcf7-response-output {
  display: none !important;
}

.mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control.wpcf7-not-valid {
  border-color: rgba(5, 31, 78, 0.2);
}

/* GROUP227 — perks title + deco */
.mc-quote-wrap .mc-quote__perks-head {
  position: absolute;
  left: 623px;
  top: 46px;
  width: 377px;
  height: 125px;
  z-index: 5;
  pointer-events: none;
}

/* SHAPE229 — hollow ring behind perks title */
.mc-quote-wrap .mc-quote__perks-deco {
  position: absolute;
  left: 0;
  top: 0;
  width: 83px;
  height: 83px;
  z-index: 0;
}

.mc-quote-wrap .mc-quote__perks-deco svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mc-quote-wrap .mc-quote__perks-title {
  position: absolute;
  left: 64px;
  top: 41px;
  width: 313px;
  z-index: 1;
  margin: 0;
  font-family: "Cormorant Upright", Georgia, serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.4;
  color: var(--mc-quote-accent);
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__perks {
  position: absolute;
  left: 669px;
  top: 193px;
  width: 346px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.mc-quote-wrap .mc-quote__perk {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.mc-quote-wrap .mc-quote__perk-icon {
  flex: 0 0 31px;
  width: 31px;
  height: 31px;
  margin-top: 6px;
  border-radius: 100px;
  background-color: var(--mc-quote-icon-accent);
  background-image: var(--mc-quote-icon);
  background-size: 22px 22px;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px -15px;
}

.mc-quote-wrap .mc-quote__perk p {
  margin: 0;
  font-family: Tinos, Georgia, "Times New Roman", serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--mc-quote-text);
  text-align: justify;
}

/* GROUP1645 — product + brush (above card, Ladi size — organic edge sits on white + shadow) */
.mc-quote-wrap .mc-quote__product {
  position: absolute;
  left: 684px;
  top: 317px;
  width: 341px;
  height: 305px;
  z-index: 6;
  pointer-events: none;
  overflow: visible;
}

/* Product photo: circular like Ladi BOX1635, brush SHAPE1640 peeks around */
.mc-quote-wrap .mc-quote__product-ring {
  position: absolute;
  left: 0;
  top: 11px;
  width: 341px;
  height: 283px;
  z-index: 0;
  pointer-events: none;
  filter: contrast(1.05);
  overflow: visible;
}

.mc-quote-wrap .mc-quote__product-ring svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mc-quote-wrap .mc-quote__product-ring svg,
.mc-quote-wrap .mc-quote__product-ring svg * {
  fill: rgba(133, 14, 53, 0.35);
}

.mc-quote-wrap .mc-quote__deco--dots-tr svg,
.mc-quote-wrap .mc-quote__deco--dots-tr svg * {
  fill: var(--mc-quote-accent-soft);
}

.mc-quote-wrap .mc-quote__deco--circle-br svg,
.mc-quote-wrap .mc-quote__deco--circle-br svg * {
  fill: rgba(133, 14, 53, 0.9);
}

.mc-quote-wrap .mc-quote__deco--circle-mid svg,
.mc-quote-wrap .mc-quote__deco--circle-mid svg * {
  fill: var(--mc-quote-accent);
}

.mc-quote-wrap .mc-quote__perks-deco svg,
.mc-quote-wrap .mc-quote__perks-deco svg * {
  fill: rgba(133, 14, 53, 0.5);
}

.mc-quote-wrap .mc-quote__product-photo {
  position: absolute;
  left: 12px;
  top: 0;
  width: 305px;
  height: 305px;
  z-index: 1;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* Dual layout — mobile form host hidden on desktop */
.mc-quote-wrap .mc-quote__m {
  display: none;
}

@media (max-width: 767px) {
  .mc-quote-wrap.elementor-section,
  .elementor-section.mc-quote-wrap {
    min-height: 0;
    height: auto !important;
    padding: 16px 0 0 !important;
    overflow: hidden;
    background: var(--mc-quote-bg) !important;
  }

  .mc-quote-wrap > .elementor-container,
  .mc-quote-wrap > .elementor-container > .elementor-column,
  .mc-quote-wrap > .elementor-container > .elementor-column > .elementor-widget-wrap {
    min-height: 0 !important;
    height: auto !important;
  }

  .mc-quote-wrap > .elementor-container {
    width: 100% !important;
    max-width: 100% !important;
  }

  /*
   * Ladi mobile (420):
   * 1) white card — perks title + bullets + product
   * 2) brand bar — form card (.mc-quote__m)
   *
   * display:contents promotes stage children into the column flex context.
   * Force COLUMN direction on the column itself (Elementor default is row).
   */
  .mc-quote-wrap > .elementor-container > .elementor-column {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    /* Elementor col-100 width:100% chỉ có ở ≤767 hoặc ≥768 — lỗ hổng ~767.2px
       khiến column co theo content (~732) → hở mép phải */
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0 !important;
  }

  .mc-quote-wrap > .elementor-container > .elementor-column > .elementor-widget-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch;
    gap: 0;
    position: relative !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__stage-html,
  .mc-quote-wrap .elementor-element.mc-quote__stage-html > .elementor-widget-container,
  .mc-quote-wrap .mc-quote__stage,
  .mc-quote-wrap .mc-quote__form-shell {
    display: contents !important;
  }

  /* Kill desktop absolute backdrops — keep flow white card + brand bar.
   * Keep .mc-quote__sprite in DOM (visually hidden) — display:none breaks <use href="#symbol">. */
  .mc-quote-wrap .mc-quote__card,
  .mc-quote-wrap .mc-quote__panel-bar {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__sprite {
    display: block !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  /*
   * Ladi mobile BOX166 (brand) vs FRAME199 (white card) @420:
   * gutter 61 · card 360×434 · side 37
   * dots 171/172: top 42, 82², cardLeft -19 / +71
   * tri 173: top 31, 25×28, cardLeft 234 (≈101px inset from card right)
   * ring 169: card BR, hang ~41px below
   * SHAPE200: 227² at card (-55, -82)
   */
  .mc-quote-wrap {
    --mc-card-w: min(360px, calc(100% - 60px));
    --mc-brand-gutter: 61px;
    --mc-quote-title-incard: 90px;
    --mc-quote-ring-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 296.4 296.4'%3E%3Cpath fill='rgba(134,210,238,0.3)' d='M118.3,211.2A92.2,92.2,0,0,0,142.8,274a85.1,85.1,0,1,1,0-125.6A92.2,92.2,0,0,0,118.3,211.2ZM85.2.1A85.1,85.1,0,0,0,22.4,142.7a92.9,92.9,0,0,1,125.6,0A85.1,85.1,0,0,0,85.2.1ZM296.4,85.2A85.1,85.1,0,0,0,153.7,22.4a92.9,92.9,0,0,1,0,125.6A85.1,85.1,0,0,0,296.4,85.2Zm-85.1,92.9a92.2,92.2,0,0,1-62.8-24.4,85.1,85.1,0,1,0,125.6,0,92.2,92.2,0,0,1-62.8,24.5Z'/%3E%3C/svg%3E");
  }

  .mc-quote-wrap .mc-quote__panel {
    display: block !important;
    position: relative !important;
    order: 4;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: 0 !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    /* no z-index — let dots/waves/ring stack as siblings vs form */
    z-index: auto;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__panel-bar {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__panel-dots,
  .mc-quote-wrap .mc-quote__panel-tri,
  .mc-quote-wrap .mc-quote__panel-ring,
  .mc-quote-wrap .mc-quote__wave {
    display: block !important;
    position: absolute !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    pointer-events: none;
  }

  /* GROUP170 / SHAPE171–172 — sit on brand gutter, kiss white card top */
  .mc-quote-wrap .mc-quote__panel-dots--a {
    left: calc(50% - (var(--mc-card-w) / 2) - 19px);
    top: calc(var(--mc-brand-gutter) - 19px);
    width: 82px;
    height: 82px;
    z-index: 7;
  }

  .mc-quote-wrap .mc-quote__panel-dots--b {
    left: calc(50% - (var(--mc-card-w) / 2) + 71px);
    top: calc(var(--mc-brand-gutter) - 19px);
    width: 82px;
    height: 82px;
    z-index: 7;
  }

  .mc-quote-wrap .mc-quote__panel-dots svg,
  .mc-quote-wrap .mc-quote__panel-dots svg * {
    fill: rgba(255, 255, 255, 0.55) !important;
  }

  /* SHAPE173 — above card, inset ~101px from card right (not flush edge) */
  .mc-quote-wrap .mc-quote__panel-tri {
    left: calc(50% + (var(--mc-card-w) / 2) - 126px) !important;
    right: auto !important;
    top: calc(var(--mc-brand-gutter) - 30px) !important;
    width: 25px;
    height: 28px;
    z-index: 7;
  }

  .mc-quote-wrap .mc-quote__panel-tri svg,
  .mc-quote-wrap .mc-quote__panel-tri svg * {
    fill: rgba(255, 255, 255, 0.75) !important;
  }

  /* SHAPE167 / 168 — between maroon (::before z1) and white card (::after z3) */
  .mc-quote-wrap .mc-quote__wave {
    z-index: 2;
    opacity: 1;
    overflow: visible;
    pointer-events: none;
  }

  /* SHAPE167 — fromCardLeft 80 / fromCardTop -13 */
  .mc-quote-wrap .mc-quote__wave--a {
    left: calc(50% - (var(--mc-card-w) / 2) + 80px);
    top: calc(var(--mc-brand-gutter) - 13px);
    width: min(355px, 92%);
    height: auto;
    aspect-ratio: 355.455 / 248.57;
  }

  .mc-quote-wrap .mc-quote__wave--a .mc-quote__wave-inner {
    transform: rotate(-90deg);
  }

  /* SHAPE168 — fromCardLeft -76 / fromCardTop 214 */
  .mc-quote-wrap .mc-quote__wave--b {
    left: calc(50% - (var(--mc-card-w) / 2) - 76px);
    top: calc(var(--mc-brand-gutter) + 214px);
    width: min(299px, 78%);
    height: auto;
    aspect-ratio: 299.302 / 219.997;
  }

  .mc-quote-wrap .mc-quote__wave--b .mc-quote__wave-inner {
    transform: rotate(90deg);
  }

  .mc-quote-wrap .mc-quote__wave:hover .mc-quote__wave-inner,
  .mc-quote-wrap .mc-quote__wave:focus-within .mc-quote__wave-inner {
    opacity: 1;
  }

  .mc-quote-wrap .mc-quote__wave--a:hover .mc-quote__wave-inner,
  .mc-quote-wrap .mc-quote__wave--a:focus-within .mc-quote__wave-inner {
    transform: rotate(-90deg);
  }

  .mc-quote-wrap .mc-quote__wave--b:hover .mc-quote__wave-inner,
  .mc-quote-wrap .mc-quote__wave--b:focus-within .mc-quote__wave-inner {
    transform: rotate(90deg);
  }

  .mc-quote-wrap .mc-quote__wave-inner svg,
  .mc-quote-wrap .mc-quote__wave-inner svg * {
    fill: rgba(255, 255, 255, 0.14) !important;
  }

  /* SHAPE169 — with waves, under white card / button */
  .mc-quote-wrap .mc-quote__panel-ring {
    left: calc(50% - (var(--mc-card-w) / 2) + 288px) !important;
    right: auto !important;
    top: calc(var(--mc-brand-gutter) + 405px) !important;
    width: 70px;
    height: 70px;
    z-index: 2;
  }

  .mc-quote-wrap .mc-quote__panel-ring svg,
  .mc-quote-wrap .mc-quote__panel-ring svg * {
    fill: rgba(255, 255, 255, 0.22) !important;
  }

  /*
   * SHAPE179 — bottom-right of white perks/product card (BOX181), not form.
   * Host: .mc-quote__product (position:relative).
   */
  .mc-quote-wrap .mc-quote__product .mc-quote__deco--circle-br,
  .mc-quote-wrap .mc-quote__deco--circle-br {
    display: block !important;
    position: absolute !important;
    left: auto !important;
    right: max(-28px, calc((100% - 395px) / 2 - 32px)) !important;
    top: auto !important;
    bottom: -6px !important;
    width: 74px !important;
    height: 74px !important;
    z-index: 6;
    margin: 0 !important;
    transform: none !important;
  }

  /* Brand maroon fill blends into BOX166 — use accent so circle reads on brand bar */
  .mc-quote-wrap .mc-quote__deco--circle-br svg,
  .mc-quote-wrap .mc-quote__deco--circle-br svg * {
    opacity: 0.9;
  }

  .mc-quote-wrap .mc-quote__form-ring {
    display: none !important;
  }

  /*
   * Perks title — Ladi GROUP227 + SHAPE175/180/229 @420 vs BOX181:
   * SHAPE229 ring: (0,-20) 61²
   * SHAPE180 solid: (58,-40) 40²
   * SHAPE175 dots: (259,-65) 148²
   * PARAGRAPH228: (44,21) ~284w, text-align:left
   */
  .mc-quote-wrap .mc-quote__perks-head {
    display: block !important;
    position: relative !important;
    order: 1;
    left: auto !important;
    top: auto !important;
    /* inset via width, not side margin — margin + width:100% kéo khung ra ngoài */
    width: calc(100% - 24px) !important;
    max-width: none;
    height: auto !important;
    min-height: 118px;
    margin: 48px auto 0 !important;
    padding: 28px 20px 8px;
    box-sizing: border-box;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px -15px;
    overflow: visible;
    border-radius: 8px 8px 0 0;
    z-index: 2;
    pointer-events: none;
  }

  /* SHAPE229 — hollow ring, peeks above card top-left */
  .mc-quote-wrap .mc-quote__perks-deco {
    display: block !important;
    position: absolute !important;
    left: 0;
    top: -20px;
    width: 61px;
    height: 61px;
    z-index: 0;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__perks-deco svg,
  .mc-quote-wrap .mc-quote__perks-deco svg * {
    fill: rgba(238, 105, 131, 0.5) !important;
  }

  .mc-quote-wrap .mc-quote__perks-deco::after {
    content: none !important;
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__perks-head::before {
    content: none !important;
    display: none !important;
  }

  /* PARAGRAPH228 — left-aligned, clears ring */
  .mc-quote-wrap .mc-quote__perks-title {
    order: unset;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    max-width: 284px;
    margin: 8px 0 8px 44px !important;
    padding: 0 !important;
    box-sizing: border-box;
    font-family: "Cormorant Upright", Georgia, serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 1.4;
    text-align: left;
    color: var(--mc-quote-accent);
    background: transparent !important;
    box-shadow: none !important;
    z-index: 2;
  }

  /* SHAPE180 — solid circle on ring (~2 o'clock), behind title */
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid {
    display: block !important;
    position: absolute !important;
    left: 58px !important;
    top: -40px !important;
    width: 40px !important;
    height: 40px !important;
    z-index: 1;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid svg,
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid svg * {
    fill: rgba(238, 105, 131, 0.85) !important;
  }

  /* SHAPE175 — dot grid hangs top-right of white card */
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr {
    display: block !important;
    position: absolute !important;
    left: auto !important;
    right: -4px;
    top: -52px;
    width: min(148px, 38%);
    height: auto;
    aspect-ratio: 1;
    z-index: 0;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr svg,
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr svg * {
    fill: rgba(238, 105, 131, 0.3) !important;
  }

  /* Any leftover stage-level copies stay hidden */
  .mc-quote-wrap > .elementor-container .mc-quote__deco--circle-mid:not(.mc-quote__perks-head .mc-quote__deco--circle-mid),
  .mc-quote-wrap .mc-quote__stage > .mc-quote__deco--circle-mid,
  .mc-quote-wrap .mc-quote__stage > .mc-quote__deco--dots-tr {
    display: none !important;
  }

  /* —— 1) White card block —— */

  .mc-quote-wrap .mc-quote__perks {
    order: 2;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: calc(100% - 24px) !important;
    max-width: none;
    margin: 0 auto !important;
    padding: 4px 28px 10px 44px;
    box-sizing: border-box;
    gap: 14px;
    pointer-events: auto;
    background: #fff;
    z-index: 2;
  }

  .mc-quote-wrap .mc-quote__perk {
    align-items: flex-start;
    gap: 12px;
  }

  .mc-quote-wrap .mc-quote__perk-icon {
    margin-top: 2px;
  }

  .mc-quote-wrap .mc-quote__perk p {
    text-align: left;
    font-size: 14px;
    line-height: 1.55;
  }

  .mc-quote-wrap .mc-quote__product {
    order: 3;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    /* Same card width as perks-head — no side margin (would double-inset / overflow) */
    width: calc(100% - 24px) !important;
    max-width: none;
    height: auto;
    aspect-ratio: auto;
    margin: 0 auto !important;
    padding: 8px 0 56px;
    box-sizing: border-box;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.2) 0 10px 30px -15px;
    z-index: 1;
    overflow: visible !important;
    pointer-events: none !important;
  }

  .mc-quote-wrap .mc-quote__product-ring {
    position: absolute;
    left: 50%;
    top: 18px;
    width: min(341px, 92%);
    height: auto;
    aspect-ratio: 341 / 283;
    transform: translateX(-50%);
    margin: 0;
  }

  .mc-quote-wrap .mc-quote__product-photo {
    position: absolute;
    left: 50%;
    top: 8px;
    width: min(305px, 82%);
    height: auto;
    aspect-ratio: 1;
    transform: translateX(-50%);
  }

  /* Reserve height for absolute product layers */
  .mc-quote-wrap .mc-quote__product::after {
    content: "";
    display: block;
    width: min(305px, 82%);
    aspect-ratio: 1;
    margin: 8px auto 0;
    visibility: hidden;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__product-ring svg,
  .mc-quote-wrap .mc-quote__product-ring svg * {
    fill: rgba(133, 14, 53, 0.28);
  }

  /*
   * 2) BOX166 brand bar + FRAME199 white form card
   * Stack (siblings in flex, no isolation on shortcode/note):
   *   ::before maroon z1 → waves/ring z2 → ::after white z3 → fields/button z4
   * Title keeps isolation so headline stays above its own white ::after.
   */
  .mc-quote-wrap .mc-quote__form-title,
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode,
  .mc-quote-wrap .mc-quote__form-note {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: -12px !important;
    margin-right: -12px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    overflow: visible;
  }

  .mc-quote-wrap .mc-quote__form-title {
    z-index: 3;
    isolation: isolate;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode,
  .mc-quote-wrap .mc-quote__form-note {
    z-index: auto;
    isolation: auto;
  }

  .mc-quote-wrap .mc-quote__form-title::before,
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::before,
  .mc-quote-wrap .mc-quote__form-note::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    inset: 0;
    background-color: var(--mc-quote-accent);
    background-image: none !important;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__form-title::before {
    z-index: -2;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::before,
  .mc-quote-wrap .mc-quote__form-note::before {
    z-index: 1;
  }

  .mc-quote-wrap .mc-quote__form-title::after,
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::after,
  .mc-quote-wrap .mc-quote__form-note::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: min(360px, calc(100% - 60px));
    background-color: #fff;
    background-image: none !important;
    background-repeat: no-repeat;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__form-title::after {
    z-index: -1;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::after,
  .mc-quote-wrap .mc-quote__form-note::after {
    z-index: 3;
  }

  /* Fields + ĐĂNG KÝ above waves (z2) and white card (z3) */
  .mc-quote-wrap .mc-quote__form-shortcode .elementor-widget-container,
  .mc-quote-wrap .mc-quote__form-shortcode .elementor-shortcode,
  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7,
  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form,
  .mc-quote-wrap .mc-quote__form-shortcode form > p {
    position: relative;
    z-index: 4;
  }

  /* Note keeps isolation so copy stays above white ::after */
  .mc-quote-wrap .mc-quote__form-note {
    z-index: 3;
    isolation: isolate;
  }

  .mc-quote-wrap .mc-quote__form-note::before {
    z-index: -2;
  }

  .mc-quote-wrap .mc-quote__form-note::after {
    z-index: -1;
  }

  /* Brand gutter matches --mc-brand-gutter; white card starts at title border box */
  .mc-quote-wrap .mc-quote__form-title {
    order: 4;
    margin-top: var(--mc-brand-gutter) !important;
    padding: 20px max(48px, calc((100% - 360px) / 2 + 33px)) 12px !important;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.55;
    text-align: center;
    color: var(--mc-quote-accent);
  }

  .mc-quote-wrap .mc-quote__form-title::before {
    top: calc(-1 * var(--mc-brand-gutter));
  }

  .mc-quote-wrap .mc-quote__form-title::after {
    top: 0;
    bottom: -1px;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px 0;
    /* SHAPE200 — Ladi 227² at card (-55, -82) */
    background-image: var(--mc-quote-ring-svg) !important;
    background-size: 227px 227px;
    background-position: -55px -82px;
  }

  /* Align shortcode to white card edges (30px gutters). Field inset via form pad. */
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode {
    order: 5;
    height: auto !important;
    padding: 8px max(30px, calc((100% - 360px) / 2)) 16px !important;
    --padding-top: 8px !important;
    --padding-bottom: 16px !important;
    --padding-left: max(30px, calc((100% - 360px) / 2)) !important;
    --padding-right: max(30px, calc((100% - 360px) / 2)) !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::after {
    top: -1px;
    /* Bridge into note so the white-card seam doesn't show as a hairline */
    bottom: -24px;
    background-image: var(--mc-quote-ring-svg) !important;
    background-size: 227px 227px;
    background-position: -55px calc(-82px - var(--mc-quote-title-incard));
  }

  .mc-quote-wrap .mc-quote__form-shortcode .elementor-widget-container,
  .mc-quote-wrap .mc-quote__form-shortcode .elementor-shortcode {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .mc-quote-wrap .mc-quote__form-note {
    order: 6;
    padding: 4px max(48px, calc((100% - 360px) / 2 + 33px)) 48px !important;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    color: var(--mc-quote-text);
  }

  .mc-quote-wrap .mc-quote__form-note::after {
    /* overlap shortcode white bridge; z-index -1 keeps text above */
    top: -2px;
    bottom: 48px;
  }

  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7 {
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    background: transparent;
    box-sizing: border-box !important;
  }

  /*
   * Fields fill shortcode content width (card inset via shortcode padding).
   * form > p: vertical pad only — no horizontal shrink.
   */
  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form,
  .mc-quote-wrap .mc-quote__form-shortcode form > p {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 7px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    line-height: normal !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7 form {
    padding: 0 !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode form > p {
    padding: 4px 24px 12px !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form-control-wrap {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode input[type="text"],
  .mc-quote-wrap .mc-quote__form-shortcode input[type="email"],
  .mc-quote-wrap .mc-quote__form-shortcode input[type="tel"] {
    width: 100% !important;
    max-width: 100% !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(5, 31, 78, 0.2);
    border-radius: 0;
    background: #fff;
    font-family: "Open Sans", Tinos, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(0, 0, 0, 0.8);
  }

  .mc-quote-wrap .mc-quote__form-shortcode input[type="submit"],
  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7-submit {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: 2;
    width: 100% !important;
    max-width: 100% !important;
    height: 40px !important;
    margin: 20px 0 0 !important;
    border: 0;
    border-radius: 0;
    background: var(--mc-quote-accent);
    color: #fff;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.6;
    text-transform: uppercase;
    letter-spacing: 0;
  }

  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7-spinner {
    position: absolute !important;
    top: auto !important;
    bottom: 14px !important;
    left: auto !important;
    right: 45px !important;
    display: none !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none;
  }

  .mc-quote-wrap .mc-quote__form-shortcode form.submitting .wpcf7-spinner {
    display: inline-block !important;
    visibility: visible !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7-response-output {
    position: absolute !important;
    left: 33px !important;
    right: 33px !important;
    top: 100% !important;
    margin: 8px 0 0 !important;
    height: auto !important;
    border: 0 !important;
  }

  /* CF7 init output can still paint a cyan border hairline — force off until shown */
  .mc-quote-wrap .mc-quote__form-shortcode .wpcf7-form:not(.sent):not(.invalid):not(.unaccepted):not(.spam):not(.failed):not(.aborted) .wpcf7-response-output {
    display: none !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}

@media (max-width: 767px) {
  .mc-quote-wrap.elementor-section,
  .elementor-section.mc-quote-wrap {
    padding: 12px 0 0 !important;
  }

  .mc-quote-wrap .mc-quote__form-title,
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode,
  .mc-quote-wrap .mc-quote__form-note {
    margin-left: -10px !important;
    margin-right: -10px !important;
  }

  .mc-quote-wrap .mc-quote__perks-title {
    font-size: 26px;
  }

  .mc-quote-wrap {
    --mc-brand-gutter: 58px;
  }

  .mc-quote-wrap .mc-quote__form-title {
    font-size: 17px;
    margin-top: var(--mc-brand-gutter) !important;
    padding: 18px max(42px, calc((100% - 360px) / 2 + 28px)) 10px !important;
  }

  .mc-quote-wrap .mc-quote__form-title::before {
    top: calc(-1 * var(--mc-brand-gutter));
  }

  .mc-quote-wrap .mc-quote__form-title::after {
    top: 0;
    width: min(360px, calc(100% - 48px));
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode {
    padding: 8px max(24px, calc((100% - 360px) / 2)) 6px !important;
    --padding-left: max(24px, calc((100% - 360px) / 2)) !important;
    --padding-right: max(24px, calc((100% - 360px) / 2)) !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::after,
  .mc-quote-wrap .mc-quote__form-note::after {
    width: min(360px, calc(100% - 48px));
  }

  .mc-quote-wrap .mc-quote__form-note {
    font-size: 12px;
    padding: 8px max(42px, calc((100% - 360px) / 2 + 28px)) 44px !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode form > p {
    padding: 4px 35px 10px !important;
  }

  .mc-quote-wrap .mc-quote__form-note::after {
    top: -2px;
    bottom: 44px;
  }
}

@media (max-width: 320px) {
  .mc-quote-wrap .mc-quote__perks-title {
    font-size: 24px;
  }

  .mc-quote-wrap {
    --mc-brand-gutter: 54px;
    --mc-card-w: calc(100% - 40px);
  }

  .mc-quote-wrap .mc-quote__form-title {
    font-size: 16px;
    margin-top: var(--mc-brand-gutter) !important;
    padding: 16px 36px 8px !important;
  }

  .mc-quote-wrap .mc-quote__form-title::before {
    top: calc(-1 * var(--mc-brand-gutter));
  }

  .mc-quote-wrap .mc-quote__form-title::after {
    top: 0;
    width: calc(100% - 40px);
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode {
    padding: 6px 20px 4px !important;
    --padding-left: 20px !important;
    --padding-right: 20px !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode::after,
  .mc-quote-wrap .mc-quote__form-note::after {
    width: calc(100% - 40px);
  }

  .mc-quote-wrap .mc-quote__form-note {
    padding: 6px 36px 40px !important;
  }

  .mc-quote-wrap .mc-quote__form-shortcode form > p {
    padding: 4px 24px 6px !important;
  }

  .mc-quote-wrap .mc-quote__form-note::after {
    bottom: 40px;
  }

  .mc-quote-wrap .mc-quote__deco--dots-tr {
    width: 96px;
    height: 88px;
  }

  .mc-quote-wrap .mc-quote__perks {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/*
 * ========== MOBILE FORM — dedicated block (.mc-quote__m) ==========
 * Separate from desktop absolute stage to avoid z-index / display:contents fights.
 * Ladi SECTION164 @420: BOX166 brand + FRAME199 card 360×434, gutter 61.
 * Phone only (≤767) — iPad/tablet uses desktop stage.
 */
@media (max-width: 767px) {
  /* Hide desktop form chrome + Elementor CF7 (mobile card has its own) */
  .mc-quote-wrap .mc-quote__panel,
  .mc-quote-wrap .mc-quote__panel-dots,
  .mc-quote-wrap .mc-quote__panel-tri,
  .mc-quote-wrap .mc-quote__panel-ring,
  .mc-quote-wrap .mc-quote__wave,
  .mc-quote-wrap .mc-quote__form-shell,
  .mc-quote-wrap .mc-quote__form-title,
  .mc-quote-wrap .mc-quote__form-note,
  .mc-quote-wrap .mc-quote__form-ring,
  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode {
    display: none !important;
  }

  /* Stage stays display:contents so .mc-quote__m participates in column flex order */
  .mc-quote-wrap .mc-quote__m {
    display: block !important;
    order: 4;
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    z-index: 5;
    pointer-events: auto !important;
    background: var(--mc-quote-accent);
    overflow: hidden;
    --mc-m-card: min(360px, calc(100vw - 60px));
    --mc-m-gutter: 61px;
    --mc-m-card-left: calc((100% - var(--mc-m-card)) / 2);
  }

  .mc-quote-wrap .mc-quote__m-brand {
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: var(--mc-m-gutter) 0 56px;
    box-sizing: border-box;
    background: var(--mc-quote-accent);
    overflow: visible;
    min-height: 556px;
  }

  .mc-quote-wrap .mc-quote__m-decos {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none !important;
    overflow: visible;
  }

  .mc-quote-wrap .mc-quote__m-decos > * {
    position: absolute;
  }

  .mc-quote-wrap .mc-quote__m-decos svg {
    display: block;
    width: 100%;
    height: 100%;
  }

  /* GROUP170 dots — Ladi @420: top 42, fromCard -19.3 / +71.4, ~82² */
  .mc-quote-wrap .mc-quote__m-dots--a {
    left: calc(var(--mc-m-card-left) + (-19.338 / 360) * var(--mc-m-card));
    top: calc(var(--mc-m-gutter) - (19 / 360) * var(--mc-m-card));
    width: calc((81.8085 / 360) * var(--mc-m-card));
    height: calc((81.6962 / 360) * var(--mc-m-card));
    z-index: 0;
    pointer-events: none !important;
  }

  .mc-quote-wrap .mc-quote__m-dots--b {
    left: calc(var(--mc-m-card-left) + (71.412 / 360) * var(--mc-m-card));
    top: calc(var(--mc-m-gutter) - (19 / 360) * var(--mc-m-card));
    width: calc((81.8085 / 360) * var(--mc-m-card));
    height: calc((81.6962 / 360) * var(--mc-m-card));
    z-index: 0;
    pointer-events: none !important;
  }

  .mc-quote-wrap .mc-quote__m-dots svg,
  .mc-quote-wrap .mc-quote__m-dots svg * {
    fill: rgba(255, 255, 255, 0.55) !important;
  }

  /*
   * SHAPE173 — Ladi mobile: left 310.111 top 31.05 → 24.58×28.38
   * vs FRAME199: +234.49, -29.95 (not fixed 234px — that drifts on 320)
   */
  .mc-quote-wrap .mc-quote__m-tri {
    left: calc(var(--mc-m-card-left) + (234.489 / 360) * var(--mc-m-card));
    top: calc(var(--mc-m-gutter) - (29.95 / 360) * var(--mc-m-card));
    width: calc((24.5757 / 360) * var(--mc-m-card));
    height: calc((28.3783 / 360) * var(--mc-m-card));
    z-index: 0;
    pointer-events: none !important;
  }

  .mc-quote-wrap .mc-quote__m-tri svg,
  .mc-quote-wrap .mc-quote__m-tri svg * {
    fill: rgba(255, 255, 255, 0.75) !important;
  }

  /*
   * SHAPE167 — Ladi @420: abs left 116.5 vs FRAME199 36.3 → fromCard +80.17
   * (không pin right:0 — sẽ kéo blob lệch trái so với góc phải card)
   * Phần tràn mép phải bị .mc-quote__m overflow:hidden cắt (nền vẫn accent).
   */
  .mc-quote-wrap .mc-quote__m-wave {
    z-index: 0;
    overflow: visible;
    pointer-events: none !important;
  }

  .mc-quote-wrap .mc-quote__m-wave--a {
    left: calc(var(--mc-m-card-left) + (80.167 / 360) * var(--mc-m-card));
    right: auto;
    top: calc(var(--mc-m-gutter) - (12.57 / 360) * var(--mc-m-card));
    width: calc((355.455 / 360) * var(--mc-m-card));
    height: calc((248.57 / 360) * var(--mc-m-card));
  }

  .mc-quote-wrap .mc-quote__m-wave--a .mc-quote__m-wave-inner {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    transform: rotate(-90deg);
    transform-origin: center center;
  }

  .mc-quote-wrap .mc-quote__m-wave--a .mc-quote__m-wave-inner svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
  }

  .mc-quote-wrap .mc-quote__m-wave--b {
    /* SHAPE168 @420: fromCard (-76, 214) 299×220 */
    left: calc(var(--mc-m-card-left) + (-76 / 360) * var(--mc-m-card));
    top: calc(var(--mc-m-gutter) + (214 / 360) * var(--mc-m-card));
    width: calc((299.302 / 360) * var(--mc-m-card));
    height: calc((219.997 / 360) * var(--mc-m-card));
  }

  .mc-quote-wrap .mc-quote__m-wave--b .mc-quote__m-wave-inner {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    transform: rotate(90deg);
    transform-origin: center center;
  }

  .mc-quote-wrap .mc-quote__m-wave--b .mc-quote__m-wave-inner svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
  }

  .mc-quote-wrap .mc-quote__m-wave svg,
  .mc-quote-wrap .mc-quote__m-wave svg * {
    /* Ladi 0.1 on #ff6f88 ≈ this weight on #850e35 */
    fill: rgba(255, 255, 255, 0.28) !important;
  }

  /* SHAPE169 — Ladi @420: fromCard +288.17, +405, 70² */
  .mc-quote-wrap .mc-quote__m-ring {
    left: calc(var(--mc-m-card-left) + (288.167 / 360) * var(--mc-m-card));
    top: calc(var(--mc-m-gutter) + (405 / 360) * var(--mc-m-card));
    width: calc((70 / 360) * var(--mc-m-card));
    height: calc((70 / 360) * var(--mc-m-card));
    z-index: 0;
  }

  .mc-quote-wrap .mc-quote__m-ring svg,
  .mc-quote-wrap .mc-quote__m-ring svg * {
    fill: rgba(255, 255, 255, 0.22) !important;
  }

  /* FRAME199 white card — above decos, clips SHAPE200 */
  .mc-quote-wrap .mc-quote__m-card {
    position: relative;
    z-index: 2;
    width: var(--mc-m-card);
    margin: 0 auto 0 var(--mc-m-card-left);
    padding: 28px 33px 36px;
    box-sizing: border-box;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 296.4 296.4'%3E%3Cpath fill='rgba(134,210,238,0.3)' d='M118.3,211.2A92.2,92.2,0,0,0,142.8,274a85.1,85.1,0,1,1,0-125.6A92.2,92.2,0,0,0,118.3,211.2ZM85.2.1A85.1,85.1,0,0,0,22.4,142.7a92.9,92.9,0,0,1,125.6,0A85.1,85.1,0,0,0,85.2.1ZM296.4,85.2A85.1,85.1,0,0,0,153.7,22.4a92.9,92.9,0,0,1,0,125.6A85.1,85.1,0,0,0,296.4,85.2Zm-85.1,92.9a92.2,92.2,0,0,1-62.8-24.4,85.1,85.1,0,1,0,125.6,0,92.2,92.2,0,0,1-62.8,24.5Z'/%3E%3C/svg%3E");
    background-size: 227px 227px;
    background-position: -55px -82px;
    background-repeat: no-repeat;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 30px 0;
    overflow: hidden;
    pointer-events: auto !important;
  }

  .mc-quote-wrap .mc-quote__m-title {
    position: relative;
    z-index: 1;
    margin: 0 0 16px;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.55;
    text-align: center;
    color: var(--mc-quote-accent);
  }

  .mc-quote-wrap .mc-quote__m-form {
    position: relative;
    z-index: 3;
    pointer-events: auto !important;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7 {
    margin: 0;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7 form,
  .mc-quote-wrap .mc-quote__m-form form > p {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 7px !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  .mc-quote-wrap .mc-quote__m-form form > p > br {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__m-form label {
    display: block;
    margin: 0;
    font-size: 0;
    line-height: 0;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7-form-control-wrap {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }

  .mc-quote-wrap .mc-quote__m-form input[type="text"],
  .mc-quote-wrap .mc-quote__m-form input[type="email"],
  .mc-quote-wrap .mc-quote__m-form input[type="tel"] {
    width: 100% !important;
    max-width: 100% !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(5, 31, 78, 0.2);
    border-radius: 0;
    background: #fff;
    font-family: "Open Sans", Tinos, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(0, 0, 0, 0.8);
  }

  .mc-quote-wrap .mc-quote__m-form input[type="submit"],
  .mc-quote-wrap .mc-quote__m-form .wpcf7-submit {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 40px !important;
    margin: 20px 0 0 !important;
    padding: 0 !important;
    border: 0;
    border-radius: 0;
    background: var(--mc-quote-accent);
    color: #fff;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.6;
    text-transform: uppercase;
    letter-spacing: 0;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7-spinner {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__m-form form.submitting .wpcf7-spinner {
    display: inline-block !important;
    visibility: visible !important;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7-response-output {
    margin: 8px 0 0 !important;
    border: 0 !important;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7-form:not(.sent):not(.invalid):not(.unaccepted):not(.spam):not(.failed):not(.aborted) .wpcf7-response-output {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__m-form .wpcf7-not-valid-tip,
  .mc-quote-wrap .mc-quote__m-form .wpcf7-validation-errors {
    display: none !important;
  }

  .mc-quote-wrap .mc-quote__m-note {
    position: relative;
    z-index: 1;
    margin: 14px 0 0;
    font-family: Tinos, Georgia, "Times New Roman", serif;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    color: var(--mc-quote-text);
  }
}

/*
 * iPad / tablet — use desktop stage (not .mc-quote__m).
 * Scale 1200×742 design to viewport so absolute Ladi coords stay intact.
 */
@media (min-width: 768px) and (max-width: 1024px) {
  .mc-quote-wrap.elementor-section,
  .elementor-section.mc-quote-wrap {
    /* unitless scale for transform:scale() — must divide by px */
    --mc-q-s: min(1, calc((100vw - 32px) / 1200px));
    min-height: calc(742px * var(--mc-q-s) + 40px) !important;
    height: auto !important;
    padding: 20px 0 28px !important;
    overflow: hidden;
  }

  .mc-quote-wrap > .elementor-container {
    width: calc(1200px * var(--mc-q-s)) !important;
    max-width: calc(1200px * var(--mc-q-s)) !important;
    height: calc(742px * var(--mc-q-s)) !important;
    min-height: calc(742px * var(--mc-q-s)) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .mc-quote-wrap > .elementor-container > .elementor-column {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    overflow: hidden !important;
  }

  .mc-quote-wrap > .elementor-container > .elementor-column > .elementor-widget-wrap {
    display: block !important;
    width: 1200px !important;
    max-width: 1200px !important;
    height: 742px !important;
    min-height: 742px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: scale(var(--mc-q-s)) !important;
    transform-origin: top left !important;
    overflow: visible !important;
  }

  /* PC stage + form; hide mobile form host */
  .mc-quote-wrap .mc-quote__m {
    display: none !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__stage-html {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__stage-html > .elementor-widget-container,
  .mc-quote-wrap .mc-quote__stage,
  .mc-quote-wrap .mc-quote__form-shell {
    display: block !important;
  }

  .mc-quote-wrap .mc-quote__card,
  .mc-quote-wrap .mc-quote__panel,
  .mc-quote-wrap .mc-quote__panel-bar {
    display: block !important;
  }

  .mc-quote-wrap .elementor-element.mc-quote__form-shortcode,
  .mc-quote-wrap .mc-quote__form-title,
  .mc-quote-wrap .mc-quote__form-note {
    display: block !important;
  }
}

@media (max-width: 767px) {
  .mc-quote-wrap .mc-quote__m {
    /* Keep Ladi 420 gutter (30+30) so wave ratios stay identical */
    --mc-m-card: min(360px, calc(100vw - 60px));
    --mc-m-gutter: 61px;
  }

  .mc-quote-wrap .mc-quote__m-brand {
    padding: var(--mc-m-gutter) 0 48px;
    min-height: 556px;
    width: 100% !important;
  }

  .mc-quote-wrap .mc-quote__m-card {
    width: var(--mc-m-card);
    padding: 24px 28px 5px;
  }

  .mc-quote-wrap .mc-quote__m-title {
    font-size: 17px;
  }
}

@media (max-width: 320px) {
  .mc-quote-wrap .mc-quote__m {
    --mc-m-card: min(360px, calc(100vw - 60px));
    --mc-m-gutter: 61px;
  }

  .mc-quote-wrap .mc-quote__m-brand {
    padding: var(--mc-m-gutter) 0 40px;
  }

  .mc-quote-wrap .mc-quote__m-card {
    width: var(--mc-m-card);
    padding: 20px 22px 28px;
  }

  .mc-quote-wrap .mc-quote__m-title {
    font-size: 16px;
  }
}

/*
 * Desktop / tablet (≥768) — restore Ladi SECTION164 absolute coords
 * (mobile stack only ≤767). SHAPE180 @340,30 · SHAPE175 @1002,0 · GROUP227 @623,46.
 */
@media (min-width: 768px) {
  .mc-quote-wrap .mc-quote__perks-head {
    position: absolute !important;
    left: 623px !important;
    top: 46px !important;
    width: 377px !important;
    height: 125px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .mc-quote-wrap .mc-quote__perks-title {
    position: absolute !important;
    left: 64px !important;
    top: 41px !important;
    width: 313px !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 30px !important;
    text-align: left !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .mc-quote-wrap .mc-quote__perks-deco {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 83px !important;
    height: 83px !important;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid {
    display: block !important;
    position: absolute !important;
    left: -283px !important;
    top: -16px !important;
    width: 47px !important;
    height: 47px !important;
    right: auto !important;
    z-index: 4;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr {
    display: block !important;
    position: absolute !important;
    left: 379px !important;
    top: -46px !important;
    width: 148px !important;
    height: 135px !important;
    right: auto !important;
    z-index: 0;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid svg,
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--circle-mid svg * {
    fill: var(--mc-quote-accent) !important;
  }

  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr svg,
  .mc-quote-wrap .mc-quote__perks-head .mc-quote__deco--dots-tr svg * {
    fill: var(--mc-quote-accent-soft) !important;
  }

  .mc-quote-wrap .mc-quote__perks-deco svg,
  .mc-quote-wrap .mc-quote__perks-deco svg * {
    fill: rgba(133, 14, 53, 0.5) !important;
  }

  .mc-quote-wrap .mc-quote__perks {
    position: absolute !important;
    left: 669px !important;
    top: 193px !important;
    width: 346px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  .mc-quote-wrap .mc-quote__product {
    position: absolute !important;
    left: 684px !important;
    top: 317px !important;
    width: 341px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}