/* BookingHostSidebar: fix assigned user layout in narrow sidebar */
.booking-host-sidebar-section .inline-flex > .flex.w-full {
  width: auto;
}
.booking-host-sidebar-section .inline-flex {
  margin-right: 4px;
  margin-bottom: 4px;
}
.booking-host-sidebar-section .avatar__Img {
  flex-shrink: 0;
}
.booking-host-sidebar-section .noName__letter__text {
  white-space: nowrap;
}

.layout47
  .e-richtexteditor
  .e-rte-content
  .e-content::-webkit-scrollbar
  .layout47
  .e-richtexteditor
  .e-rte-content
  .e-content
  p::-webkit-scrollbar {
  display: none;
}
.layout47 .e-richtexteditor .e-rte-content .e-content,
.layout47 .e-richtexteditor .e-rte-content .e-content p {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* emailTemplateListTab */
.emailTemplateListTab {
  display: flex;
  align-items: center;
  justify-content: center;
}
.booking-host-sidebar-section .inline-flex > .emailTemplateListTab.w-full {
  width: auto;
}
.emailTemplateListTab .horizontal__tab__wrapper,
.emailTemplateListTab .horizontal__tab__wrapper .ht__item.active {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
/* emailTemplateListTab end */

/* email template css start */
.horizontal__tabSwitch__wrapper .inner__scroll__wrapper {
  width: 100%;
  overflow: hidden;
  border-radius: 7px;
  background-color: var(--primaryBlackSD100);
  padding: 4px;
}
.booking-host-sidebar-section .inline-flex > .flex.horizontal__tabSwitch__wrapper .inner__scroll__wrapper {
  width: auto;
}
.horizontal__tabSwitch__wrapper .ht__item {
  display: inline-block;
  cursor: pointer;
  border-radius: 100px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 14px;
  padding-right: 14px;
  text-align: center;
}
.horizontal__tabSwitch__wrapper .ht__item .ht__text {
  display: inline-block;
  text-align: center;
  font-family: Biotif-Medium;
  font-size: 14px;
  color: var(--textSecondary);
}
.horizontal__tabSwitch__wrapper .ht__item.active {
  background-color: var(--bgWhiteSD);
  --tw-shadow: var(--raiseShadow);
  --tw-shadow-colored: var(--raiseShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.horizontal__tabSwitch__wrapper .ht__item.active .ht__text {
  color: var(--textDark);
}
.horizontal__tabSwitch__wrapper.twoSwitch .ht__item {
  width: 50%;
}
/* email template css end */

/* emailTemplateSDPage__wrapper */
.fullScreenPage .sidebar,
.fullScreenPage .top__header {
  display: none;
}
.fullScreenPage .contentR__wrapper {
  margin-left: 0px;
  width: 100%;
  padding-right: 0px;
  padding-top: 0px;
}
.booking-host-sidebar-section .inline-flex > .flex.fullScreenPage .contentR__wrapper {
  width: auto;
}
.emailTemplateSDPage__wrapper html,
.emailTemplateSDPage__wrapper body {
  overflow-x: visible;
}
.emailTemplateSDPage__wrapper .horizontal__tab__wrapper {
  position: relative;
  z-index: 3;
  --tw-shadow: var(--raiseShadow) !important;
  --tw-shadow-colored: var(--raiseShadow) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
/* .emailTemplateSDPage__wrapper.fullScreenMode .rightSidebar {
  @apply translate-x-[100%];
} */
/* .emailTemplateSDPage__wrapper.fullScreenMode .cnBody__Wrapper {
  @apply w-full;
} */
.emailTemplateSDPage__wrapper.fullScreenMode
  .cnBody__Wrapper
  .innerScrollWrapper {
  padding-top: 0px;
  padding-bottom: 0px;
}
.emailTemplateSDPage__wrapper.fullScreenMode .socialButtonWrapper {
  top: 52px;
  display: none;
}
.settingMenuTemplateBlock .i__Icon svg {
  fill: #ffffff;
}
.settingMenuTemplateBlock .i__Icon:hover svg {
  fill: var(--primaryColorSD);
}
.settingMenuOpen .settingMenuTemplateBlock {
  display: block;
}
.settingMenuTemplateBlock.fixed {
  left: calc(((100vw - 350px) / 2) + 443px);
  right: unset;
  position: fixed;
  top: 140px;
  transform: translateY(0px);
}
.emailTemplateBuilderModal .settingMenuTemplateBlock.fixed {
  top: 70px;
  left: calc(((100vw - 350px) / 2) + 443px);
}
.settingMenuTemplateBlock.fixedBottom {
  left: calc(((100vw - 350px) / 2) + 443px);
  right: unset;
  position: fixed;
  top: unset;
  transform: translateY(0px);
  bottom: 20px;
}
.emailTemplateBuilderModal .settingMenuTemplateBlock.fixedBottom {
  left: calc(((100vw - 350px) / 2) + 443px);
}
.tooltipWrapperCS.fixed {
  left: calc((100vw / 2) + 426px);
  right: unset;
  position: fixed;
  top: 140px;
  transform: translateX(0px) translateY(0px);
}
.emailTemplateBuilderModal .tooltipWrapperCS.fixed {
  top: 65px;
}
.tooltipWrapperCS.fixedBottom {
  left: calc((100vw / 2) + 426px);
  right: unset;
  position: fixed;
  top: unset;
  transform: translateX(0px) translateY(0px);
  bottom: 20px;
}
.emailTemplateBuilderModal .tooltipWrapperCS.fixed,
.emailTemplateBuilderModal .tooltipWrapperCS.fixedBottom {
  left: calc((100vw / 2) + 426px);
}
.sidebarOpen .tooltipWrapperCS.fixed,
.sidebarOpen .tooltipWrapperCS.fixedBottom {
  left: calc((100vw / 2) + 262px);
}
.emailTemplateBuilderModal .sidebarOpen .tooltipWrapperCS.fixed,
.emailTemplateBuilderModal .sidebarOpen .tooltipWrapperCS.fixedBottom {
  left: calc((100vw / 2) + 262px);
}

.emailTemplateSDPage__wrapper
  .select__SD__option.select__SD__option--is-selected
  .i__Icon
  svg {
  fill: #ffffff;
}
.emailTemplateSDPage__wrapper
  .select__SD__option.select__SD__option--is-selected
  .textWrap {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

/* .emailTemplateSDPage__wrapper.fullScreenMode .cnBody__Wrapper{
  @apply fixed top-0 left-0 w-screen !h-screen bg-bgWhiteSD z-[999] mt-0;
}
.emailTemplateSDPage__wrapper.fullScreenMode .innerScrollWrapper{
  @apply py-[40px] h-screen overflow-x-hidden;
}
.emailTemplateSDPage__wrapper.fullScreenMode .backArrow__btn{
  @apply left-[20px];
}
.emailTemplateSDPage__wrapper.fullScreenMode .cnBody__Wrapper .socialButtonWrapper{
  @apply hidden;
} */
/* .emailTemplateSDPage__wrapper.fullScreenMode .backArrow__btn{
  @apply mb-0 bg-bgWhiteSD py-[6px] px-[10px] rounded-[7px] shadow-raiseShadow left-[20px];
} */
.emailTemplateSDPage__wrapper * {
  word-break: break-word;
}

.emailTemplateBuilderModal .modal__body {
  max-height: calc(100dvh - 50px) !important;
  overflow: hidden !important;
  padding: 0px;
}
.emailTemplateBuilderModal
  .emailTemplateSDPage__wrapper
  .cnBody__Wrapper
  > .innerScrollWrapper {
  height: calc(100vh - 62px) !important;
}
.emailTemplateBuilderModal .emailTemplateSDPage__wrapper .rightSidebar {
  padding-top: 57px !important;
}
.emailTemplateBuilderModal .cnWrapper {
  height: calc(100dvh - 163px) !important;
}
.formPreviewOverlay .cnBody__Wrapper .draggableSidebarOpen {
  width: calc(100% - 600px);
}
@media (max-width: 1439px) {
  .formPreviewOverlay .cnBody__Wrapper .draggableSidebarOpen {
    width: calc(100% - 600px);
  }
}
.formPreviewOverlay .cnBody__Wrapper .draggableSidebarClose {
  width: calc(100% - 350px);
}
@media (max-width: 1439px) {
  .formPreviewOverlay .cnBody__Wrapper .draggableSidebarClose {
    width: calc(100% - 350px);
  }
}

.emailTemplateBuilderModal.fullScreenModal .desktopTemplateWrapper {
  margin-bottom: 20px !important;
}
.emailTemplateBuilderModal:not(.fullScreenModal)
  .emailTemplateSDPage__wrapper
  .rightSidebar {
  position: static;
  height: calc(100vh - 100px) !important;
  padding-top: 0px;
}
.emailTemplateBuilderModal:not(.fullScreenModal)
  .emailTemplateSDPage__wrapper
  .innerScrollWrapper {
  height: calc(100vh - 100px) !important;
}
.emailTemplateBuilderModal:not(.fullScreenModal)
  .emailTemplateSDPage__wrapper
  .rightSidebar
  .cnWrapper {
  height: calc(100vh - 206px) !important;
}

.entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-active::before {
  display: none;
}
.entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-hover.e-active::before {
  display: block;
}
.entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-active
  .snippet__title,
.entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-active
  .description {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.dark
  .entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-active
  .snippet__title,
.dark
  .entityFieldsEmailTemplateBuilder
  .e-dropdownbase
  .e-list-item.e-active
  .description {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.entityFieldsEmailTemplateBuilder .e-dropdownbase .e-list-item.e-hover .count {
  background-color: var(--primaryColor2SD);
}

.entityFieldsEmailTemplateBuilder__nested {
  max-height: 200px;
  overflow-y: auto;
  border-radius: 8px;
  border-width: 1px;
  border-color: var(--lightBorderSD);
  background-color: var(--bgWhiteSD);
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.entityFieldsEmailTemplateBuilder__nested .listItem {
  position: relative;
  font-family: Biotif-Regular;
  font-size: 14px;
  color: var(--textDark);
}
.entityFieldsEmailTemplateBuilder__nested .listItem::before {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background-color: transparent;
  transition-duration: 300ms;
  --tw-content: '';
  content: var(--tw-content);
}
.entityFieldsEmailTemplateBuilder__nested .listItem:hover::before {
  content: var(--tw-content);
  background-color: var(--primaryColor2SD100);
}
.entityFieldsEmailTemplateBuilder__nested .listItem .innerText {
  position: relative;
  z-index: 3;
  display: inline-block;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 8px;
  padding-bottom: 8px;
}
/* emailTemplateSDPage__wrapper end */

/* email template css start */
.horizontal__tabSwitch__wrapper .inner__scroll__wrapper {
  width: 100%;
  overflow: hidden;
  border-radius: 7px;
  background-color: var(--primaryBlackSD100);
  padding: 4px;
}
.booking-host-sidebar-section .inline-flex > .flex.horizontal__tabSwitch__wrapper .inner__scroll__wrapper {
  width: auto;
}
.horizontal__tabSwitch__wrapper .ht__item {
  display: inline-block;
  cursor: pointer;
  border-radius: 7px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 14px;
  padding-right: 14px;
  text-align: center;
}
.horizontal__tabSwitch__wrapper .ht__item .ht__text {
  display: inline-block;
  text-align: center;
  font-family: Biotif-Medium;
  font-size: 14px;
  color: var(--textSecondary);
}
.horizontal__tabSwitch__wrapper .ht__item.active {
  background-color: var(--bgWhiteSD);
}
.horizontal__tabSwitch__wrapper .ht__item.active .ht__text {
  color: var(--textDark);
}
.horizontal__tabSwitch__wrapper.twoSwitch .ht__item {
  width: 50%;
}

.syncfusionRangeSlider .syncfusionRangeSlider__labelVal {
  display: none;
}
.syncfusionRangeSlider .e-control-wrapper.e-slider-container.e-horizontal,
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container.e-horizontal
  .e-slider {
  top: 0px;
  height: auto;
  border-radius: 200px;
}
.syncfusionRangeSlider .e-control-wrapper.e-slider-container .e-range {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  background-color: var(--primaryColorSD);
}
.syncfusionRangeSlider .e-control-wrapper.e-slider-container.e-horizontal {
  padding-left: 35px;
  padding-right: 35px;
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container.e-horizontal
  .e-slider-track {
  position: static;
  height: 6px;
  border-radius: 200px;
  background-color: var(--primaryColorSD100);
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider
  .e-handle {
  top: calc(50% - 8px);
  z-index: 2 !important;
  height: 16px;
  width: 16px;
  border-radius: 9999px;
  border-width: 1px;
  border-color: var(--lightBorderSD);
  background-color: var(--bgWhiteSD);
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider
  .e-handle::before {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  height: calc(100% - 2px);
  width: calc(100% - 2px);
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-radius: 9999px;
  background-color: var(--primaryColorSD);
  --tw-content: '';
  content: var(--tw-content);
}
.syncfusionRangeSlider .e-control-wrapper.e-slider-container .e-slider-button {
  height: 24px;
  width: 24px;
  border-radius: 9999px;
  border-width: 0px;
  background-color: transparent !important;
  transition-duration: 300ms;
}
.syncfusionRangeSlider .e-control-wrapper.e-slider-container .e-slider-button:hover {
  background-color: transparent !important;
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider-button
  .e-button-icon {
  display: none;
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider-button.e-first-button::before {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 2px;
  width: 10px;
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: var(--bgSurface);
  --tw-content: '';
  content: var(--tw-content);
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider-button.e-second-button::before {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 2px;
  width: 10px;
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: var(--bgSurface);
  --tw-content: '';
  content: var(--tw-content);
}
.syncfusionRangeSlider
  .e-control-wrapper.e-slider-container
  .e-slider-button.e-second-button::after {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 10px;
  width: 2px;
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: var(--bgSurface);
  --tw-content: '';
  content: var(--tw-content);
}

.socialIcon {
  transition-duration: 300ms;
}

.socialIcon:hover {
  border-color: var(--primaryColorSD);
}
.socialIcon .i__Icon svg {
  fill: var(--textSecondary);
  transition-duration: 300ms;
}
.socialIcon:hover .i__Icon svg {
  fill: var(--primaryColorSD);
}

.textBlockRichTextEditor .e-richtexteditor .e-rte-content .e-content {
  height: auto;
  min-height: unset;
  overflow-x: hidden;
  border-width: 0px !important;
  background-color: transparent !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.textBlockRichTextEditor .e-richtexteditor .e-rte-content {
  overflow: hidden;
  border-radius: 0px;
  border-width: 0px !important;
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
/* email template css end */

.videoTitleTextRichTextEditor .e-richtexteditor.e-focused .e-rte-content {
  outline-width: 0px;
  transition-duration: 0s !important;
}
.videoTitleTextRichTextEditor.focus .e-richtexteditor .e-rte-content {
  outline-style: solid;
  outline-width: 2px;
  outline-color: var(--primaryColorSD);
}
.videoTitleTextRichTextEditor .e-richtexteditor .e-rte-content {
  overflow: hidden !important;
  border-radius: 0px;
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.videoTitleTextRichTextEditor .e-richtexteditor .e-rte-content .e-content {
  height: auto;
  min-height: unset;
  border-radius: 0px;
  padding: 0px;
}
.videoTitleTextRichTextEditor .e-richtexteditor:hover .e-rte-content,
.videoTitleTextRichTextEditor .e-richtexteditor.e-focused .e-rte-content {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
/* Default line-height — only when the paragraph has NO inline line-height.
   Inline line-height set by the Tiptap LineHeight extension (Google-Docs
   spacing: Single, 1.15, 1.5, Double) wins. */
.videoTitleTextRichTextEditor p:not([style*="line-height"]),
.videoTitleTextRichTextEditor p:not([style*="line-height"]) * {
  line-height: 1 !important;
}

.richTextEditor__withoutDefault {
  min-width: 100%;
}
.richTextEditor__withoutDefault .e-richtexteditor {
  position: relative;
  z-index: 4;
}
.richTextEditor__withoutDefault .e-richtexteditor:hover .e-rte-content {
  outline-style: solid;
  outline-width: 1px;
  outline-color: var(--primaryColorSD);
}
.richTextEditor__withoutDefault.noOutline .e-richtexteditor .e-rte-content,
.richTextEditor__withoutDefault.noOutline
  .e-richtexteditor:hover
  .e-rte-content {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.richTextEditor__withoutDefault .e-richtexteditor.e-focused .e-rte-content {
  outline-width: 0px;
  transition-duration: 0s !important;
}
.richTextEditor__withoutDefault.focus .e-richtexteditor .e-rte-content {
  outline-style: solid;
  outline-width: 2px;
  outline-color: var(--primaryColorSD);
}
.richTextEditor__withoutDefault .e-richtexteditor .e-rte-content {
  display: flex;
  min-height: 300px;
  align-items: center;
  overflow: hidden !important;
  border-radius: 0px;
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.booking-host-sidebar-section .inline-flex > .richTextEditor__withoutDefault .e-richtexteditor .e-rte-content.w-full {
  width: auto;
}
.emailTemplateSDPage__wrapper
  .richTextEditor__withoutDefault
  .e-richtexteditor
  .e-rte-content,
.emailTemplateSDPage__wrapper
  .richTextEditor__withoutDefault
  .e-richtexteditor
  .e-rte-content
  .e-content {
  overflow: visible !important;
}
.richTextEditor__withoutDefault.autoHeight .e-richtexteditor .e-rte-content {
  min-height: unset;
}
.richTextEditor__withoutDefault.fullHeightEContent
  .e-richtexteditor
  .e-rte-content
  .e-content {
  height: 100%;
}
.richTextEditor__withoutDefault .e-richtexteditor .e-rte-content .e-content {
  height: auto;
  min-height: unset;
  border-radius: 0px;
  padding: 0px;
}
/* Default line-height — only when the paragraph has NO inline line-height.
   Inline line-height set by the Tiptap LineHeight extension (Google-Docs
   spacing: Single, 1.15, 1.5, Double) wins. */
.richTextEditor__withoutDefault p:not([style*="line-height"]),
.richTextEditor__withoutDefault p:not([style*="line-height"]) * {
  line-height: 1 !important;
  /* margin: 0px 0px 10px 0px; */
}

.layout22Img__text * {
  letter-spacing: 4px;
}

/*
 * Layout 54 (LandingPageBuilderLayout2) - CTA Text Block (Dark Theme)
 * Figma (key bits):
 * - Container: flex column, center, padding 60px 120px, bg #333
 * - Inner: gap 30px
 * - Text stack: gap 36px
 *
 * NOTE: Most font settings are set inline via TemplateText/TemplateButton element configs.
 * These rules focus on spacing, max widths, and fixing default RTE margins.
 */
.layout54 .layout54Cta {
  /* center content and keep it readable */
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.layout54 .layout54Inner {
  max-width: 960px;
}

/* Make TemplateText blocks match the tight Figma spacing (no default paragraph margin) */
.layout54 .layout54Inner .richTextEditor__withoutDefault p,
.layout54 .layout54Inner .richTextEditor__withoutDefault p * {
  margin: 0px !important;
}

/* Prevent TemplateButton from breaking layout by forcing button wrapper to be centered */
.layout54 .layout54Inner a {
  margin-left: auto;
  margin-right: auto;
}

/*
 * Layout 56 (LandingPageBuilderLayout4) - Text Section 5 / Three-Column Feature Section
 * Figma CSS Specifications:
 * - Container: padding 60px 120px, background #FCFCFC
 * - Inner frame: max-width 960px, centered
 * - Heading: Inter, 64px, 400 weight, #333333, line-height 64px
 * - Cards row: gap 40px between columns
 * - Card titles: Inter, 16px, 500 weight, #333333, uppercase, line-height 19px
 * - Card descriptions: Inter, 16px, 400 weight, #555555, line-height 19px
 * - Button: Matter, 16px, 500 weight, #FFFFFF text, #333333 bg, 6px border-radius
 */
.layout56 .layout56Content {
  max-width: 960px;
}

/* Remove default RTE paragraph margins for tight Figma spacing */
.layout56 .layout56Content .richTextEditor__withoutDefault p,
.layout56 .layout56Content .richTextEditor__withoutDefault p * {
  margin: 0px !important;
}

/* Ensure heading text is properly centered */
.layout56 .layout56Heading {
  text-align: center;
}

/* Center the button */
.layout56 .layout56Button a {
  margin-left: auto;
  margin-right: auto;
}

/*
 * Layout 58 (LandingPageBuilderLayout6) - Simple Hero — Headline + CTA
 * Figma CSS Specifications:
 * - Container: padding 60px, background #FCFCFC
 * - Inner frame: max-width 1080px, centered
 * - Heading: Junge, 54px, 400 weight, #333333, line-height 66px
 * - Subheading: Inter, 14px, 400 weight, #333333, uppercase, line-height 17px
 * - Button: Matter, 16px, 500 weight, #FFFFFF text, #0E0E0E bg
 * - Promo text: Matter, 16px, 500 weight, #555555, line-height 19px
 */
/* .layout58 .layout58Content {
  max-width: 1080px;
} */

/* Remove default RTE paragraph margins for tight Figma spacing */
.layout58 .layout58Content .richTextEditor__withoutDefault p,
.layout58 .layout58Content .richTextEditor__withoutDefault p * {
  margin: 0px !important;
}

/* Ensure heading section text is properly centered */
.layout58 .layout58HeadingSection {
  text-align: center;
}

/* Ensure button section is properly centered */
.layout58 .layout58ButtonSection {
  text-align: center;
}

/* Center the button */
.layout58 .layout58ButtonSection a {
  margin-left: auto;
  margin-right: auto;
}

.layout38 .richTextEditor__withoutDefault.fullHeightEContent,
.layout38 .richTextEditor__withoutDefault.fullHeightEContent > div,
.layout38 .richTextEditor__withoutDefault.fullHeightEContent .e-control {
  height: 100% !important;
}
.layout38 .richTextEditor__withoutDefault.fullHeightEContent .e-control {
  display: flex;
  align-items: center;
  justify-content: center;
}
.booking-host-sidebar-section .inline-flex > .layout38 .richTextEditor__withoutDefault.fullHeightEContent .e-control.w-full {
  width: auto;
}
.layout38
  .richTextEditor__withoutDefault.fullHeightEContent
  .e-richtexteditor
  .e-rte-content {
  min-height: unset !important;
}

.layout39__text > div {
  display: flex;
  min-height: 600px;
  align-items: center;
  justify-content: center;
}

.booking-host-sidebar-section .inline-flex > .layout39__text > div.w-full {
  width: auto;
}

.layout46 .leftVerticalText p {
  overflow: hidden;
  white-space: pre;
}
.layout46 .leftVerticalText .e-content {
  height: 100% !important;
}

.layout47 .e-content {
  height: 100% !important;
  white-space: pre;
}
.layout47 .richTextEditor__withoutDefault p {
  white-space: pre;
}
/* .layout47 .richTextEditor__withoutDefault > div{
  @apply !h-full;
} */
.layout47textCenter {
  justify-content: center;
}
.layout47textLeft {
  justify-content: flex-start;
}
.layout47textRight {
  justify-content: flex-end;
}

.layout49 .mobileShape {
  position: absolute;
  left: 50%;
  z-index: 2;
  display: inline-block;
  height: 43px;
  width: 202px;
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-bottom-right-radius: 28px;
  border-bottom-left-radius: 28px;
}

.layout35VerticalText .e-content {
  height: 100% !important;
}

.layout38LineText * {
  white-space: pre;
}
.layout38LineText .e-content {
  overflow-x: hidden;
}

.layout37 .richTextEditor__withoutDefault p {
  line-height: 85% !important;
}
.layout37
  .richTextEditor__withoutDefault
  .e-richtexteditor
  .e-rte-content
  .e-content {
  overflow: visible;
}
.layout31absoluteNumber p {
  line-height: 85% !important;
}

/* .emailTemplateSDPage__wrapper .mainBlockWrapper{
  @apply overflow-hidden p-0 hover:outline-1 hover:outline-dashed hover:outline-primaryColorSD hover:-outline-offset-1 will-change-[outline];
} */
/* .emailTemplateSDPage__wrapper .mainBlockWrapper {
  @apply overflow-hidden p-0 will-change-[outline];
} */
/* .emailTemplateSDPage__wrapper .mainBlockWrapper.outline-dashed outline-2 outline-primaryColorSD{
  @apply outline-dashed outline-2 outline-primaryColorSD -outline-offset-2 will-change-[outline] hover:outline-dashed hover:outline-2 hover:outline-primaryColorSD hover:-outline-offset-2;
} */
.emailTemplateSDPage__wrapper .mainBlockWrapper.outlineActive {
  z-index: 9;
  overflow: visible;
  will-change: outline;
}
.emailTemplateSDPage__wrapper .mainBlockWrapper.outlineActive .outlineWrapper {
  opacity: 1;
  will-change: outline;
}
.emailTemplateSDPage__wrapper .mainBlockWrapper > *:not(.outlineWrapper){
  /* @apply relative z-[3]; */
  position: relative;
}
.emailTemplateSDPage__wrapper .previewModeOn .mainBlockWrapper.outlineActive {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.previewModeOn .triangleShape {
  display: none;
}

.blockWrapper > button {
  display: none;
}
.blockWrapper:hover > button {
  display: block;
}
/* .previewModeOn .settingMenuTemplateBlock{
  @apply !hidden;
} */
/* .previewModeOn,
.previewModeOn *{
  @apply !pointer-events-none !outline-none;
} */

.templateS .richTextEditor__withoutDefault,
.templateS .richTextEditor__withoutDefault * {
  text-align: left !important;
  font-weight: 700;
}
.templateS.flipRight .richTextEditor__withoutDefault,
.templateS.flipRight .richTextEditor__withoutDefault * {
  text-align: right !important;
  font-weight: 700;
}

.templateV .richTextEditor__withoutDefault .e-content,
.templateV .richTextEditor__withoutDefault .e-content * {
  text-align: left !important;
}
.templateV.flipRight .richTextEditor__withoutDefault .e-content,
.templateV.flipRight .richTextEditor__withoutDefault .e-content * {
  text-align: right !important;
}

.templatesFolderListing .headerDetails .horizontal__tab__wrapper .ht__item {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
.templatesFolderListing .headerDetails .horizontal__tab__wrapper:is(.dark *) {
  background-color: transparent;
}

.emailPreviewOverlay .template__wrapper > .template__wrapper {
  overflow: hidden !important;
  border-radius: 16px;
}
/* .emailPreviewOverlay .innerScrollWrapper > div{
  @apply mb-[30px] h-[700px];
} */
.emailPreviewOverlay .innerScrollWrapper {
  height: 100%;
  border-radius: 0px;
}
.emailPreviewOverlay .sidebarOpen .innerScrollWrapper {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
/* .emailPreviewOverlay .template__wrapper > .template__wrapper{
  @apply px-[20px] bg-bgWhiteSD;
} */
.emailPreviewOverlay .emailTemplateSDPage__wrapper {
  /* @apply pt-[58px] w-[calc(100%_-_40px)] mx-auto; */
  padding-top: 53px;
}
.emailPreviewOverlay .emailTemplateSDPage__wrapper.etPageSidebarOpen {
  padding-top: 53px;
}
.emailPreviewOverlay
  .emailTemplateSDPage__wrapper.etPageSidebarOpen.fullScreenMode {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
.booking-host-sidebar-section .inline-flex > .flex.emailPreviewOverlay
  .emailTemplateSDPage__wrapper.etPageSidebarOpen.fullScreenMode {
  width: auto;
}
.emailPreviewOverlay .rightSidebar {
  position: static;
  height: 100% !important;
  border-left-width: 1px;
  border-left-color: var(--lightBorderSD);
}
.emailPreviewOverlay .rightSidebar .cnWrapper {
  height: auto !important;
  overflow-y: visible;
}
.emailPreviewOverlay
  .horizontal__tabSwitch__wrapper.twoSwitch
  .inner__scroll__wrapper:is(.dark *) {
  border-color: var(--light-border-100);
  background-color: var(--bgSurface);
}
.emailPreviewOverlay
  .horizontal__tabSwitch__wrapper.twoSwitch
  .ht__item.active:is(.dark *) {
  background-color: var(--primaryBlackSD800);
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.emailPreviewOverlay .e-richtexteditor .e-rte-content:is(.dark *) {
  background-color: transparent;
}

.emailTemplateSDPage__wrapper .input__SD {
  height: 36px;
}
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD div[class$='control'],
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD div[class$='control']:hover,
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD .select__SD__control,
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD .select__SD__control:hover {
  border-width: 1px;
  border-color: var(--lightBorderSD);
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  position: relative;
  min-height: 36px;
}
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD div[class$='ValueContainer'],
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD .select__SD__value-container {
  height: 25px;
}
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD.selectAutoHeight div[class$='ValueContainer'],
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD.selectAutoHeight .select__SD__value-container {
  height: auto;
}
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD div[class$='IndicatorsContainer'],
.emailTemplateSDPage__wrapper .field__wrapper:not(.notFixedHeight) .select__SD .select__SD__indicators {
  position: absolute;
  top: 0px;
  right: 0px;
  margin-right: 0px;
  height: 34px;
  width: 48px;
  justify-content: flex-end;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  padding-right: 7px;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  div[class$='indicatorContainer']:last-child::before,
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  .select__SD__indicator-separator:last-child::before {
  left: calc(50% - 3px);
  width: 8px;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  div[class$='indicatorContainer']:last-child::after,
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  .select__SD__indicator-separator:last-child::after {
  left: calc(50% + 2px);
  width: 8px;
}
.emailTemplateSDPage__wrapper
  .select__SD
  div[class$='indicatorContainer']:last-child,
.emailTemplateSDPage__wrapper
  .select__SD
  .select__SD__indicator-separator:last-child {
  left: 3px;
}
.emailTemplateSDPage__wrapper
  .select__SD
  div[class$='indicatorContainer']:last-child::before,
.emailTemplateSDPage__wrapper
  .select__SD
  .select__SD__indicator-separator:last-child::before {
  height: 1px;
}
.emailTemplateSDPage__wrapper
  .select__SD
  div[class$='indicatorContainer']:last-child::after,
.emailTemplateSDPage__wrapper
  .select__SD
  .select__SD__indicator-separator:last-child::after {
  height: 1px;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  div[class$='singleValue'],
.emailTemplateSDPage__wrapper
  .rightSidebar
  .select__SD
  .select__SD__single-value {
  font-size: 14px;
}

/* .secPlusBtn{
  @apply opacity-0 pointer-events-none;
}
.builderSection:hover .secPlusBtn{
  @apply opacity-100 pointer-events-auto;
} */

.mobileView .desktopTemplateWrapper {
  min-height: calc(100dvh - 168px) !important;
}
.mobileView .plusMenuWrapper {
  width: 100%;
  padding-left: 10px;
  padding-right: 10px;
}
.booking-host-sidebar-section .inline-flex > .flex.mobileView .plusMenuWrapper {
  width: auto;
}
.mobileView .plusMenuWrapper .plusMenuCol {
  width: 25%;
}
.mobileView .plusMenuWrapper .plusMenuCol > button {
  min-height: 50px;
  padding-left: 3px;
  padding-right: 3px;
}

.mobileView .bookingLotItem {
  width: 100% !important;
}

.colorPickerInput::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
/* .sliderLabelAbove .syncfusionRangeSliderCN{
  @apply flex-wrap;
} */
.sliderColWrapper.doubleCol .sliderLabelAbove {
  width: 50%;
}
.sliderColWrapper.doubleCol .sliderLabelAbove .syncfusionRangeSlider__label {
  margin-right: 0px;
  margin-bottom: 5px;
}
.sliderColWrapper.doubleCol .syncfusionRangeSlider {
  width: 102px;
}
.sliderColWrapper.fullCol .sliderLabelAbove {
  width: 100%;
}
.booking-host-sidebar-section .inline-flex > .flex.sliderColWrapper.fullCol .sliderLabelAbove {
  width: auto;
}
.sliderColWrapper.doubleCol .sliderLabelAbove .syncfusionRangeSliderCN {
  flex-wrap: wrap;
}
.sliderColWrapper.doubleCol
  .sliderLabelAbove
  .syncfusionRangeSliderCN
  .syncfusionRangeSlider__labelVal {
  margin-left: 6px;
}

.textBlockPaddingSettings .sliderColWrapper.doubleCol .sliderLabelAbove {
  width: 100%;
}

.booking-host-sidebar-section .inline-flex > .flex.textBlockPaddingSettings .sliderColWrapper.doubleCol .sliderLabelAbove {
  width: auto;
}
.textBlockPaddingSettings
  .sliderColWrapper.doubleCol
  .sliderLabelAbove
  .syncfusionRangeSliderCN {
  flex-wrap: nowrap;
}

.tippy-box.templateBlockMenuTippy {
  max-width: unset !important;
  background-color: transparent !important;
}
.tippy-box.templateBlockMenuTippy .tippy-content {
  background-color: transparent !important;
  padding: 0px !important;
}

/* new richTextEditor start */
.textBlockRichTextEditor .tiptap {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.textBlockRichTextEditor .tiptap:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.textBlockRichTextEditor .tiptap ul {
  list-style-type: disc !important;
  padding-left: 1.5em !important;
  margin: 0.5em 0 !important;
}

.textBlockRichTextEditor .tiptap ol {
  list-style-type: decimal !important;
  padding-left: 1.5em !important;
  margin: 0.5em 0 !important;
}
.textBlockRichTextEditor .tiptap ul li,
.textBlockRichTextEditor .tiptap ol li {
  display: list-item !important;
  margin: 0.25em 0 !important;
}
.textBlockRichTextEditor .tiptap ul li p,
.textBlockRichTextEditor .tiptap ol li p {
  margin: 0 !important;
  display: inline;
}

.textBlockRichTextEditor .tiptap ul ul {
  list-style-type: circle !important;
}
.textBlockRichTextEditor .tiptap ul ul ul {
  list-style-type: square !important;
}
.textBlockRichTextEditor .tiptap ol ol {
  list-style-type: lower-alpha !important;
}
.textBlockRichTextEditor .tiptap ol ol ol {
  list-style-type: lower-roman !important;
}
/* new richTextEditor end */

.toolbarWrapperNew {
  border-radius: 6px;
  --tw-shadow: var(--highFloatShadow);
  --tw-shadow-colored: var(--highFloatShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.toolbarWrapperNew .innerTBWrapperNew {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  border-width: 1px;
  border-color: var(--lightBorderSD);
  background-color: var(--bgWhiteSD);
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 6px;
  padding-right: 6px;
}
.booking-host-sidebar-section .toolbarWrapperNew .innerTBWrapperNew > .flex.w-full {
  width: auto;
}
.booking-host-sidebar-section .toolbarWrapperNew .innerTBWrapperNew {
  margin-right: 4px;
  margin-bottom: 4px;
}
.toolbarWrapperNew .innerTBWrapperNew:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(227 227 227 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

/* new style start */
.emailTemplateSDPage__wrapper .mainBlockWrapper.outlineActive {
  z-index: 9;
  overflow: visible;
  will-change: outline;
}
.emailTemplateSDPage__wrapper .mainBlockWrapper.outlineActive .outlineWrapper {
  opacity: 1;
  will-change: outline;
}

/* .emailTemplateSDPage__wrapper .blockWrapper.outlineActive {
  @apply overflow-visible will-change-[outline] z-[9];
}
.emailTemplateSDPage__wrapper .blockWrapper.outlineActive .outlineWrapper {
  @apply will-change-[outline] opacity-100;
} */

/* hover outline style start */
.secPlusWrapper:hover + .mainBlockWrapper {
  z-index: 3;
  --tw-shadow: var(--highFloatShadow);
  --tw-shadow-colored: var(--highFloatShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColorSD);
}
.columnBlockWrapper .secPlusWrapper:hover + .group {
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColorSD);
}
/* hover outline style end */

/* plus & delete button css start */
.elementActionWrapper .secPlusBtn,
.elementActionWrapper .deleteCrossBtn {
  opacity: 0;
}
.elementActionWrapper:hover > .secPlusWrapper .secPlusBtn {
  opacity: 1;
}
.elementActionWrapper:hover
  + .elementActionWrapper
  > .secPlusWrapper
  .secPlusBtn {
  opacity: 1;
}
.elementActionWrapper:hover + .secPlusWrapper .secPlusBtn {
  opacity: 1;
}
.secPlusWrapper:hover .secPlusBtn {
  opacity: 1;
}
/* Show the previous elementActionWrapper's secPlusBtn when hovering the next secPlusWrapper */
.elementActionWrapper:has(+ .secPlusWrapper:hover)
  > .secPlusWrapper
  .secPlusBtn {
  opacity: 1;
}
.elementActionWrapper.crossActive .deleteCrossBtn {
  opacity: 1;
}

/* Hide BlockWrapper secPlusBtn when hovering on COLUMN_CONTENT__SD */
.blockWrapper:has(.COLUMN_CONTENT__SD:hover) > .secPlusWrapper .secPlusBtn {
  pointer-events: none !important;
  opacity: 0 !important;
}
/* plus & delete button css end */
/* new style end */

/* Column drag and drop styles start */
.columnDraggableBlock {
  position: relative;
}
.columnDraggableBlock:hover {
  cursor: grab;
}
.columnDraggableBlock:active {
  cursor: grabbing;
}
/* Style for the block being dragged */
.columnDraggableBlock[data-rbd-dragging='true'] {
  z-index: 999;
  opacity: 0.9;
  --tw-shadow: var(--highFloatShadow);
  --tw-shadow-colored: var(--highFloatShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
/* Column drag and drop styles end */

/* Column block button visibility for draggable blocks start */
/* Show top secPlusBtn of next block when hovering current columnDraggableBlock */
.columnDraggableBlock:hover
  + .columnDraggableBlock
  .columnBlockWrapper
  > .secPlusWrapper:first-of-type
  .secPlusBtn {
  opacity: 1;
}
/* Show bottom secPlusBtn ONLY when hovering directly on the last columnDraggableBlock itself */
.columnDraggableBlock:last-child:hover
  > .columnBlockWrapper
  > .secPlusWrapper:last-of-type
  .secPlusBtn {
  opacity: 1;
}
/* Show bottom secPlusBtn ONLY when hovering on the columnBlockWrapper inside the last columnDraggableBlock */
.columnDraggableBlock:last-child
  > .columnBlockWrapper:hover
  > .secPlusWrapper:last-of-type
  .secPlusBtn {
  opacity: 1;
}
/* Show bottom button when hovering on the group (block content) inside the last columnDraggableBlock */
.columnDraggableBlock:last-child
  .columnBlockWrapper
  .group:hover
  ~ .secPlusWrapper
  .secPlusBtn {
  opacity: 1;
}
/* Show bottom button when hovering on the bottom secPlusWrapper itself (last block only) */
.columnDraggableBlock:last-child
  .columnBlockWrapper
  > .secPlusWrapper:last-of-type:hover
  .secPlusBtn {
  opacity: 1;
}
/* Column block button visibility for draggable blocks end */

/* new css start */
.mainBlockWrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 0px;
  outline-offset: 0px;
  will-change: outline;
}
.booking-host-sidebar-section .inline-flex > .flex.mainBlockWrapper {
  width: auto;
}
.mainBlockWrapper::before {
  position: absolute;
  top: 50%;
  left: 100%;
  display: none;
  --tw-translate-y: -50%;
  --tw-translate-x: 10px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  white-space: pre;
  border-radius: 8px;
  background-color: var(--bgBlackSD);
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: Matter;
  font-size: 14px;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  --tw-content: '';
  content: var(--tw-content);
}
.mainBlockWrapper:hover {
  z-index: 3;
}
.mainBlockWrapper:focus {
  display: none;
}
.mainBlockWrapper .outlineWrapper {
  position: absolute;
  z-index: 4;
  opacity: 0;
}
.mainBlockWrapper .outlineWrapper.topOLW {
  top: 0px;
  left: 0px;
  height: 1px;
  width: calc(100% + 18px);
  border-bottom-width: 2px;
  border-style: dashed;
  border-bottom-color: var(--primaryColorSD);
}
.mainBlockWrapper .outlineWrapper.rightOLW {
  top: 50%;
  right: -18px;
  height: 100%;
  width: 1px;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-left-width: 2px;
  border-style: dashed;
  border-left-color: var(--primaryColorSD);
}
.mainBlockWrapper .outlineWrapper.bottomOLW {
  bottom: 0px;
  left: 0px;
  height: 1px;
  width: calc(100% + 18px);
  border-top-width: 2px;
  border-style: dashed;
  border-top-color: var(--primaryColorSD);
}
.mainBlockWrapper .outlineWrapper.leftOLW {
  top: 50%;
  left: 0px;
  height: 100%;
  width: 1px;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-right-width: 2px;
  border-style: dashed;
  border-right-color: var(--primaryColorSD);
}

.mainBlockWrapper.outlineHover {
  transition-duration: 100ms;
}

.mainBlockWrapper.outlineHover:hover {
  z-index: 2;
  --tw-shadow: var(--highFloatShadow);
  --tw-shadow-colored: var(--highFloatShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColorSD);
}
.mainBlockWrapper.outlineActive {
  outline-style: dashed;
  outline-width: 1px;
  outline-offset: -1px;
  outline-color: var(--primaryColorSD);
}

.proposalTitleControlsToggle input:focus-visible + label {
  border-radius: 4px;
  outline-style: solid;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: var(--primaryColorSD);
}

.columnBlockWrapper .outlineWrapper {
  position: absolute;
  z-index: 4;
  opacity: 0;
}
.columnBlockWrapper .outlineWrapper.topOLW {
  top: 0px;
  left: 0px;
  height: 1px;
  width: 100%;
  border-bottom-width: 2px;
  border-style: dashed;
  border-bottom-color: var(--primaryColor2SD);
}
.booking-host-sidebar-section .inline-flex > .flex.columnBlockWrapper .outlineWrapper.topOLW {
  width: auto;
}
.columnBlockWrapper .outlineWrapper.rightOLW {
  top: 50%;
  right: 0px;
  height: 100%;
  width: 1px;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-left-width: 2px;
  border-style: dashed;
  border-left-color: var(--primaryColor2SD);
}
.columnBlockWrapper .outlineWrapper.bottomOLW {
  bottom: 0px;
  left: 0px;
  height: 1px;
  width: 100%;
  border-top-width: 2px;
  border-style: dashed;
  border-top-color: var(--primaryColor2SD);
}
.booking-host-sidebar-section .inline-flex > .flex.columnBlockWrapper .outlineWrapper.bottomOLW {
  width: auto;
}
.columnBlockWrapper .outlineWrapper.leftOLW {
  top: 50%;
  left: 0px;
  height: 100%;
  width: 1px;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-right-width: 2px;
  border-style: dashed;
  border-right-color: var(--primaryColor2SD);
}
.columnBlockWrapper.outlineHover {
  transition-duration: 100ms;
}
.columnBlockWrapper.outlineHover:hover {
  z-index: 2;
  --tw-shadow: var(--highFloatShadow);
  --tw-shadow-colored: var(--highFloatShadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColor2SD);
}
.columnBlockWrapper.outlineActive .outlineWrapper {
  opacity: 1;
}
.columnBlockWrapper [class*='outline-primaryColorSD'],
.columnBlockWrapper [class*='hover:outline-']:hover {
  outline-color: var(--primaryColor2SD) !important;
}
.columnBlockWrapper .triangleShape {
  border-bottom-color: var(--primaryColor2SD);
}
.columnBlockWrapper .secPlusWrapper .i__Icon {
  border-color: var(--primaryColor2SD) !important;
  background-color: var(--primaryColor2SD) !important;
}

/* sidebar css start */
.emailTemplateSDPage__wrapper .rightSidebar .colorPickerWrapper {
  display: block;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .colorPickerWrapper
  .colorPickerLabel {
  position: relative;
  top: 1px;
  margin-right: 0px;
  margin-bottom: 4px;
}
.emailTemplateSDPage__wrapper .rightSidebar .colorPickerWrapper .colorPickerCN {
  width: 100%;
}
.booking-host-sidebar-section .inline-flex > .flex.emailTemplateSDPage__wrapper .rightSidebar .colorPickerWrapper .colorPickerCN {
  width: auto;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .colorPickerWrapper
  .colorPickerCNLeft {
  width: calc(100% - 36px);
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 6px;
}
.emailTemplateSDPage__wrapper
  .rightSidebar
  .colorPickerWrapper
  .colorPickerCNLeft
  input {
  width: calc(100% - 26px);
}
/* sidebar css end */
.elementOutline:hover {
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColorSD);
}
.elementOutline.active {
  outline-style: dashed;
  outline-width: 2px;
  outline-color: var(--primaryColorSD);
}
.columnBlockWrapper .elementOutline:hover {
  outline-style: dashed;
  outline-width: 1px;
  outline-color: var(--primaryColor2SD);
}
.columnBlockWrapper .elementOutline.active {
  outline-style: dashed;
  outline-width: 2px;
  outline-color: var(--primaryColor2SD);
}

.blockRoundedWrapper {
  border-radius: 10px;
  border-width: 1px;
  border-color: var(--lightBorderSD);
  padding: 14px;
}
/* new css end */


.modal__wrapper__SD.simpleModal.addBlockModal .modal__header {
  border-bottom-width: 1px !important;
  border-bottom-color: var(--lightBorderSD) !important;
}
.modal__wrapper__SD.simpleModal.addBlockModal .addBlockHeader {
  display: none;
}
.modal__wrapper__SD.simpleModal.addBlockModal .blockMenuWrapper {
  max-width: 100%;
  border-radius: 0px;
  border-style: none;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.modal__wrapper__SD.simpleModal.addBlockModal .colWrapper {
  border-top-width: 1px;
  border-top-color: var(--lightBorderSD);
}
.modal__wrapper__SD.simpleModal.addBlockModal .leftScroll {
  max-height: calc(100vh - 268px);
}


/* template builder right sidebar scrolling */
.emailPreviewOverlay .emailTR__scroll:empty {
  height: calc(100vh - 209px);
}
.emailPreviewOverlay .rightSidebar .blockSidebarHeight {
  height: calc(100vh - 209px);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px;
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .blockSidebarHeight {
  height: calc(100vh - 274px);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px;
  padding-top: 0px;
}
.emailPreviewOverlay .rightSidebar .withoutTabScroll,
.emailPreviewOverlay .rightSidebar .blockSidebarWithoutTab {
  height: calc(100vh - 209px);
  overflow-y: auto;
  overflow-x: hidden;
}
.emailPreviewOverlay .rightSidebar .blockSidebarWithoutTab {
  padding: 14px;
}
/* Nested native properties share the outer scroll with free-layout controls. */
.emailPreviewOverlay .rightSidebar .freeLayoutChildSettings > .blockSidebarWithoutTab,
.emailPreviewOverlay .rightSidebar .freeLayoutChildSettings > .blockSidebarHeight {
    height: auto;
    overflow: visible;
}
.emailPreviewOverlay .rightSidebar .withoutTabScroll > *:first-child {
  padding-top: 0px;
}
.emailPreviewOverlay .rightSidebar .emailGlobalBlock {
  height: calc(100vh - 209px);
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .formGeneralSidebar,
.emailPreviewOverlay .rightSidebar .tabWrapper + .socialIcon,
.emailPreviewOverlay .rightSidebar .tabWrapper + .socialIconNoData,
.emailPreviewOverlay .rightSidebar .tabWrapper + .addressSettings,
.emailPreviewOverlay .rightSidebar .tabWrapper + .emailTemplateListing {
  height: calc(100vh - 276px);
}
.emailPreviewOverlay .rightSidebar .favoriteBlocksNoData {
  height: calc(100vh - 210px);
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .formGeneralSidebar > *:first-child,
.emailPreviewOverlay .rightSidebar .tabWrapper + .blockGeneralSidebar > *:first-child,
.emailPreviewOverlay .rightSidebar .tabWrapper + .typographyTab > *:first-child {
  padding-top: 0px;
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .formGeneralSidebar > *:last-child::before,
.emailPreviewOverlay .rightSidebar .tabWrapper + .blockGeneralSidebar > *:last-child::before,
.emailPreviewOverlay .rightSidebar .tabWrapper + .typographyTab > *:last-child::before {
  content: var(--tw-content);
  display: none;
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .formTemplatesSidebar {
  height: calc(100vh - 276px);
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .blockGeneralSidebar {
  height: calc(100vh - 276px);
}
.emailPreviewOverlay .rightSidebar .tabWrapper + .typographyTab {
  height: calc(100vh - 276px);
}
.emailPreviewOverlay .rightSidebar .formFieldsScroll {
  max-height: calc(100vh - 328px);
}
.emailPreviewOverlay .rightSidebar .addFieldsListing {
  max-height: calc(100vh - 383px);
}
.emailPreviewOverlay .rightSidebar .createFieldListing {
  max-height: calc(100vh - 338px);
  padding-bottom: 14px;
}
.emailPreviewOverlay .rightSidebar .columnSetting {
  height: calc(100vh - 209px);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px;
}
/* template builder right sidebar scrolling end */


.websiteBuilder .desktopTemplateWrapper {
  margin-top: 0px !important;
  width: 100%;
  padding: 12px;
  transition-property: padding;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}


.booking-host-sidebar-section .inline-flex > .flex.websiteBuilder .desktopTemplateWrapper {
  width: auto;
}
/* Keep the toolbar gutter stable before the first free-layout selection.
   Otherwise earlier blocks reflow and push the selected canvas out of view. */
.websiteBuilder .desktopTemplateWrapper:has(.settingMenuTemplateBlock, .freeLayoutToolbar) {
  padding-right: 72px !important;
}
.websiteBuilder .mobileView .desktopTemplateWrapper:has(.settingMenuTemplateBlock, .freeLayoutToolbar) {
  padding-right: 12px !important;
}
.websiteBuilder .tooltipWrapperCS {
  position: fixed !important;
  right: 358px !important;
  left: auto !important;
  z-index: 9999 !important;
  --tw-translate-x: 0px !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}
.websiteBuilder .leftCN__Wrapper .innerScrollWrapper {
  padding-left: 0px;
}

.emailPreviewOverlay.websiteBuilder .emailTemplateSDPage__wrapper > .proposalLeftSidebar {
  border-right-width: 1px;
  border-right-color: var(--lightBorderSD);
  background-color: var(--bgWhiteSD);
}
.emailPreviewOverlay.websiteBuilder .emailTemplateSDPage__wrapper > .proposalLeftSidebar .pageLeftSidebar {
  height: 100%;
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 12px;
}
.emailPreviewOverlay.websiteBuilder .proposalLeftSidebar.draggableSidebarClose + .leftCN__Wrapper {
  width: calc(100% - 350px);
}
/* template builder right sidebar scrolling end */

/* ============================================== */
/* DYNAMIC COLUMN LAYOUT SYSTEM                  */
/* Use these classes instead of inline styles    */
/* ============================================== */

/* Base Column Container - use on parent flex container */
.COLUMN_CONTAINER__SD {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}
.booking-host-sidebar-section .inline-flex > .flex.COLUMN_CONTAINER__SD {
  width: auto;
}
.booking-host-sidebar-section .inline-flex > .COLUMN_CONTAINER__SD.w-full {
  width: auto;
}
.COLUMN_CONTAINER__SD {
  border-collapse: collapse;
  border: none;
}

/* Base Column Content - use on each column div */
.COLUMN_CONTENT__SD {
  position: relative;
  border: 1px solid transparent;
  vertical-align: top;
  box-sizing: border-box;
  height: 100%;
}

/* Column Item - use on column wrapper */
.COLUMN_ITEM__SD {
  position: relative;
  vertical-align: top;
  box-sizing: border-box;
}

/* ============================================== */
/* COLUMN WIDTH CLASSES - Desktop View           */
/* ============================================== */

/* 1 Column - 100% width */
.COLUMN_1__SD {
  width: 100%;
}

/* 2 Columns - 50% each */
.COLUMN_2__SD {
  width: 50%;
}

/* 3 Columns - 33.33% each */
.COLUMN_3__SD {
  width: 33.33%;
}

/* 4 Columns - 25% each */
.COLUMN_4__SD {
  width: 25%;
}

/* 5 Columns - 20% each */
.COLUMN_5__SD {
  width: 20%;
}

/* 6 Columns - 16.66% each */
.COLUMN_6__SD {
  width: 16.66%;
}

/* ============================================== */
/* COLUMN WIDTH WITH GAP SUPPORT                 */
/* Use when you have gap between columns         */
/* ============================================== */

/* 1 Column (full width) */
.COLUMN_1_GAP_10__SD,
.COLUMN_1_GAP_20__SD,
.COLUMN_1_GAP_22__SD,
.COLUMN_1_GAP_30__SD,
.COLUMN_1_GAP_40__SD { width: 100%; }

/* 2 Columns with gaps */
.COLUMN_2_GAP_10__SD { width: calc(50% - 5px); }
.COLUMN_2_GAP_20__SD { width: calc(50% - 10px); }
.COLUMN_2_GAP_22__SD { width: calc(50% - 11px); }
.COLUMN_2_GAP_30__SD { width: calc(50% - 15px); }
.COLUMN_2_GAP_40__SD { width: calc(50% - 20px); }

/* 3 Columns with gaps */
.COLUMN_3_GAP_10__SD { width: calc(33.33% - 6.67px); }
.COLUMN_3_GAP_20__SD { width: calc(33.33% - 13.33px); }
.COLUMN_3_GAP_22__SD { width: calc(33.33% - 14.67px); }
.COLUMN_3_GAP_30__SD { width: calc(33.33% - 20px); }
.COLUMN_3_GAP_40__SD { width: calc(33.33% - 26.67px); }

/* 4 Columns with gaps */
.COLUMN_4_GAP_10__SD { width: calc(25% - 7.5px); }
.COLUMN_4_GAP_20__SD { width: calc(25% - 15px); }
.COLUMN_4_GAP_22__SD { width: calc(25% - 16.5px); }
.COLUMN_4_GAP_30__SD { width: calc(25% - 22.5px); }
.COLUMN_4_GAP_40__SD { width: calc(25% - 30px); }

/* ============================================== */
/* GAP CLASSES                                   */
/* ============================================== */

.COLUMN_GAP_10__SD { gap: 10px; }
.COLUMN_GAP_20__SD { gap: 20px; }
.COLUMN_GAP_22__SD { gap: 22px; }
.COLUMN_GAP_30__SD { gap: 30px; }
.COLUMN_GAP_40__SD { gap: 40px; }

.ROW_GAP_10__SD { row-gap: 10px; }
.ROW_GAP_20__SD { row-gap: 20px; }
.ROW_GAP_30__SD { row-gap: 30px; }
.ROW_GAP_40__SD { row-gap: 40px; }

/* ============================================== */
/* MOBILE RESPONSIVE - Columns Stack Vertically  */
/* ============================================== */

/* Mobile Preview Mode (in builder) - Uses MOBILE_VIEW class */
.MOBILE_VIEW .COLUMN_2__SD,
.MOBILE_VIEW .COLUMN_3__SD,
.MOBILE_VIEW .COLUMN_4__SD,
.MOBILE_VIEW .COLUMN_5__SD,
.MOBILE_VIEW .COLUMN_6__SD,
.MOBILE_VIEW .COLUMN_2_GAP_10__SD,
.MOBILE_VIEW .COLUMN_2_GAP_20__SD,
.MOBILE_VIEW .COLUMN_2_GAP_22__SD,
.MOBILE_VIEW .COLUMN_2_GAP_30__SD,
.MOBILE_VIEW .COLUMN_2_GAP_40__SD,
.MOBILE_VIEW .COLUMN_3_GAP_10__SD,
.MOBILE_VIEW .COLUMN_3_GAP_20__SD,
.MOBILE_VIEW .COLUMN_3_GAP_22__SD,
.MOBILE_VIEW .COLUMN_3_GAP_30__SD,
.MOBILE_VIEW .COLUMN_3_GAP_40__SD,
.MOBILE_VIEW .COLUMN_4_GAP_10__SD,
.MOBILE_VIEW .COLUMN_4_GAP_20__SD,
.MOBILE_VIEW .COLUMN_4_GAP_22__SD,
.MOBILE_VIEW .COLUMN_4_GAP_30__SD,
.MOBILE_VIEW .COLUMN_4_GAP_40__SD {
  width: 100%;
}
.booking-host-sidebar-section .inline-flex > .flex.MOBILE_VIEW .COLUMN_2__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_5__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_6__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_2_GAP_10__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_2_GAP_20__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_2_GAP_22__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_2_GAP_30__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_2_GAP_40__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3_GAP_10__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3_GAP_20__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3_GAP_22__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3_GAP_30__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_3_GAP_40__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4_GAP_10__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4_GAP_20__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4_GAP_22__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4_GAP_30__SD,.booking-host-sidebar-section .inline-flex > .flex
.MOBILE_VIEW .COLUMN_4_GAP_40__SD {
  width: auto;
}

.MOBILE_VIEW .COLUMN_CONTAINER__SD {
  flex-direction: column;
}

/* Mobile Preview - Reduce gaps for stacked columns */
.MOBILE_VIEW .COLUMN_GAP_30__SD,
.MOBILE_VIEW .COLUMN_GAP_40__SD {
  gap: 30px;
}

.MOBILE_VIEW .ROW_GAP_30__SD,
.MOBILE_VIEW .ROW_GAP_40__SD {
  row-gap: 20px;
}

/* Mobile Preview - Remove min-width constraints */
.MOBILE_VIEW .COLUMN_MIN_W_200__SD,
.MOBILE_VIEW .COLUMN_MIN_W_160__SD,
.MOBILE_VIEW .COLUMN_MIN_W_120__SD {
  min-width: 0;
}

/* Actual Mobile Screen (< 600px) */
@media (max-width: 600px) {
  .COLUMN_2__SD,
  .COLUMN_3__SD,
  .COLUMN_4__SD,
  .COLUMN_5__SD,
  .COLUMN_6__SD,
  .COLUMN_2_GAP_10__SD,
  .COLUMN_2_GAP_20__SD,
  .COLUMN_2_GAP_22__SD,
  .COLUMN_2_GAP_30__SD,
  .COLUMN_2_GAP_40__SD,
  .COLUMN_3_GAP_10__SD,
  .COLUMN_3_GAP_20__SD,
  .COLUMN_3_GAP_22__SD,
  .COLUMN_3_GAP_30__SD,
  .COLUMN_3_GAP_40__SD,
  .COLUMN_4_GAP_10__SD,
  .COLUMN_4_GAP_20__SD,
  .COLUMN_4_GAP_22__SD,
  .COLUMN_4_GAP_30__SD,
  .COLUMN_4_GAP_40__SD {
    width: 100% !important;
  }
  
  .COLUMN_CONTAINER__SD {
    flex-direction: column !important;
  }
  
  /* Reduce gaps for stacked columns on mobile */
  .COLUMN_GAP_30__SD,
  .COLUMN_GAP_40__SD {
    gap: 30px !important;
  }
  
  .ROW_GAP_30__SD,
  .ROW_GAP_40__SD {
    row-gap: 20px !important;
  }
  
  /* Remove min-width constraints on mobile */
  .COLUMN_MIN_W_200__SD,
  .COLUMN_MIN_W_160__SD,
  .COLUMN_MIN_W_120__SD {
    min-width: 0 !important;
  }
}

/* ============================================== */
/* NESTED BLOCK SELECTION STYLES                 */
/* ============================================== */

.COLUMN_CONTENT__SD .NESTED_SELECTED__SD {
  outline-style: dashed;
  outline-width: 2px;
  outline-color: var(--primaryColorSD);
}

.COLUMN_CONTENT__SD .NESTED_HOVER__SD:hover {
  outline-style: dashed;
  outline-width: 1px;
  outline-offset: -1px;
  outline-color: var(--primaryColorSD);
}

/* ============================================== */
/* FLEX UTILITIES FOR COLUMNS                    */
/* ============================================== */

.COLUMN_FLEX__SD {
  display: flex;
}

.booking-host-sidebar-section .inline-flex > .COLUMN_FLEX__SD.w-full {
  width: auto;
}

.COLUMN_FLEX_COL__SD {
  display: flex;
  flex-direction: column;
}

.booking-host-sidebar-section .inline-flex > .COLUMN_FLEX_COL__SD.w-full {
  width: auto;
}

.COLUMN_FLEX_1__SD {
  flex: 1;
}

.COLUMN_MIN_W_200__SD {
  min-width: 200px;
}

.COLUMN_MIN_W_160__SD {
  min-width: 160px;
}

.COLUMN_MIN_W_120__SD {
  min-width: 120px;
}

/* ============================================== */
/* CSS GRID RESPONSIVE CLASSES                   */
/* For layouts using CSS Grid (14, 15, 16, 17)   */
/* ============================================== */

/* Two Column Grid - stacks on mobile */
.GRID_2_COL__SD {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

/* Mobile View - Stack grid columns */
.MOBILE_VIEW .GRID_2_COL__SD {
  grid-template-columns: 1fr !important;
}

@media (max-width: 600px) {
  .GRID_2_COL__SD {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================== */
/* LAYOUT 64 (LandingPageBuilderLayout12) GRID   */
/* 2x3 Grid with borders - equal row heights     */
/* ============================================== */

/* Mobile View - Stack items and adjust borders */
.MOBILE_VIEW .LAYOUT_64_GRID__SD .LAYOUT_64_ITEM__SD {
  border-width: 1px !important;
  border-style: solid !important;
}

.MOBILE_VIEW .LAYOUT_64_GRID__SD .LAYOUT_64_ITEM__SD:not(:first-child) {
  border-top-width: 0px !important;
}

@media (max-width: 600px) {
  .LAYOUT_64_GRID__SD .LAYOUT_64_ITEM__SD {
    border-width: 1px !important;
    border-style: solid !important;
  }
  
  .LAYOUT_64_GRID__SD .LAYOUT_64_ITEM__SD:not(:first-child) {
    border-top-width: 0px !important;
  }
}

/* ============================================== */
/* DIVIDER CLASSES FOR MOBILE/DESKTOP            */
/* ==============================================*/

/* Vertical Divider - shown on desktop, hidden on mobile */
.DIVIDER_VERTICAL__SD {
  display: block;
  flex-shrink: 0;
}

/* Horizontal Divider - hidden on desktop, shown on mobile */
.DIVIDER_HORIZONTAL__SD {
  display: none;
  width: 100%;
  flex-shrink: 0;
}

/* Horizontal Divider inside card - hidden on desktop, shown on mobile (below each card) */
.DIVIDER_HORIZONTAL_MOBILE__SD {
  display: none;
  width: 100%;
  flex-shrink: 0;
  margin-top: 10px;
}

/* Mobile View - Switch divider visibility */
.MOBILE_VIEW .DIVIDER_VERTICAL__SD {
  display: none !important;
}

.MOBILE_VIEW .DIVIDER_HORIZONTAL__SD {
  display: block !important;
}

.MOBILE_VIEW .DIVIDER_HORIZONTAL_MOBILE__SD {
  display: block !important;
}

/* ============================================== */
/* MOBILE PADDING REDUCTION                       */
/* Global 50px padding on mobile view (all sides) */
/* ============================================== */

/* Mobile View - Global padding for layout blocks */
.MOBILE_VIEW [id$="_background_block"] {
  padding-top: 50px !important;
  padding-right: 16px !important;
  padding-bottom: 50px !important;
  padding-left: 16px !important;
}

/* Media query for actual mobile screens */
@media (max-width: 600px) {
  .DIVIDER_VERTICAL__SD {
    display: none !important;
  }
  
  .DIVIDER_HORIZONTAL__SD {
    display: block !important;
  }
  
  .DIVIDER_HORIZONTAL_MOBILE__SD {
    display: block !important;
  }
  
  /* Global 50px padding for layout blocks on mobile */
  [id$="_background_block"] {
    padding-top: 50px !important;
    padding-right: 50px !important;
    padding-bottom: 50px !important;
    padding-left: 50px !important;
  }
}

/* ============================================================ */
/* IMAGE LAYOUT RESPONSIVE CLASSES (Layout IDs 65-69 ONLY)      */
/* These classes are EXCLUSIVE to the 5 Image category layouts: */
/*   65 (Image 01), 66 (Image 02), 67 (Image 03),              */
/*   68 (Image 04), 69 (Image 05)                               */
/* Do NOT reuse these class names for other layouts.            */
/* ============================================================ */

/* ── Builder Mobile Preview (.MOBILE_VIEW) ─────────────────── */

/* --- Gallery 01 (Layout 24 - Portfolio Grid) --- */
/* .MOBILE_VIEW .GALLERY_01_CONTAINER__SD {
  padding: 30px 5% !important;
} */
.MOBILE_VIEW .GALLERY_01_CONTENT__SD {
  gap: 20px !important;
}
.MOBILE_VIEW .GALLERY_01_GRID__SD {
  flex-direction: column !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_01_SIDE_COL__SD {
  flex-direction: row !important;
  width: 100% !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_01_CENTER__SD {
  flex: none !important;
  width: 100% !important;
  order: -1 !important;
}

/* --- Gallery 02 (Layout 25 - Work in Focus) --- */
/* .MOBILE_VIEW .GALLERY_02_CONTAINER__SD {
  padding: 30px 5% !important;
} */
.MOBILE_VIEW .GALLERY_02_CONTENT__SD {
  gap: 24px !important;
}
.MOBILE_VIEW .GALLERY_02_GRID__SD {
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_02_CENTER__SD {
  flex: none !important;
  width: 100% !important;
  order: -1 !important;
}
.MOBILE_VIEW .GALLERY_02_SIDE__SD {
  flex: 1 1 calc(50% - 4px) !important;
}

/* --- Gallery 03 (Layout 26 - Visual Highlights) --- */
/* .MOBILE_VIEW .GALLERY_03_CONTAINER__SD {
  padding: 30px 5% !important;
} */
.MOBILE_VIEW .GALLERY_03_TOP_ROW__SD {
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_03_TEXT_BLOCK__SD {
  flex: none !important;
  width: 100% !important;
  order: -1 !important;
  margin-bottom:30px;
}
.MOBILE_VIEW .GALLERY_03_BOTTOM_ROW__SD {
  flex-wrap: wrap !important;
  gap: 8px !important;
}

/* --- Gallery 04 (Layout 27 - Featured Gallery) --- */
/* .MOBILE_VIEW .GALLERY_04_CONTAINER__SD {
  padding: 30px 20px !important;
} */
.MOBILE_VIEW .GALLERY_04_HEADER__SD {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  position: static !important;
  margin-bottom:30px !important;
}
.MOBILE_VIEW .GALLERY_04_TEXT__SD {
  width: 100% !important;
}
.MOBILE_VIEW .GALLERY_04_BUTTON__SD {
  position: static !important;
  width: 100% !important;
  transform: none !important;
  top: auto !important;
  right: auto !important;
}
.MOBILE_VIEW .GALLERY_04_GRID__SD {
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_04_GRID__SD > div {
  flex: 1 1 calc(50% - 4px) !important;
  height: 180px !important;
}

/* --- Gallery 05 (Layout 28 - Dark Gallery) --- */
/* .MOBILE_VIEW .GALLERY_05_CONTAINER__SD {
  padding: 30px 5% !important;
} */
.MOBILE_VIEW .GALLERY_05_WRAPPER__SD {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.MOBILE_VIEW .GALLERY_05_GRID__SD {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.MOBILE_VIEW .GALLERY_05_ROW__SD {
  display: contents !important;
}
.MOBILE_VIEW .GALLERY_05_HIDDEN__SD {
  display: none !important;
}
.MOBILE_VIEW .GALLERY_05_GRID__SD > .GALLERY_05_ROW__SD > div:not(.GALLERY_05_HIDDEN__SD) {
  flex: 1 1 calc(50% - 4px) !important;
}
.MOBILE_VIEW .GALLERY_05_TEXT_OVERLAY__SD {
  position: static !important;
  width: 100% !important;
  left: auto !important;
  top: auto !important;
  order: -1 !important;
  margin-bottom:30px !important;
}
.MOBILE_VIEW .GALLERY_05_BUTTON__SD {
  position: static !important;
  right: auto !important;
  bottom: auto !important;
  margin-top: 16px !important;
}

/* --- Image 01 (Layout 13 - Text Left + Three Images Right) --- */
.MOBILE_VIEW .LP_IMAGE_SPLIT__SD {
  flex-direction: column !important;
  gap: 35px !important;
}
.MOBILE_VIEW .LP_IMAGE_GRID__SD {
  flex-direction: column !important;
  height: auto !important;
  gap: 20px !important;
  width: 100% !important;
}
.MOBILE_VIEW .LP_IMAGE_GRID_SMALL_COL__SD {
  display: contents !important;
}
.MOBILE_VIEW .LP_IMAGE_GRID_ITEM__SD {
  width: 100% !important;
  height: 160px !important;
  min-height: 120px !important;
}

/* --- Image 02 (Layout 14 - Full-Width Two-Column Card) --- */
.MOBILE_VIEW .IMAGE_02_CONTAINER__SD {
  flex-direction: column !important;
  height: auto !important;
  border-radius: 16px !important;
}
.MOBILE_VIEW .IMAGE_02_CONTAINER__SD .LP_IMAGE_CARD_HALF__SD {
  flex: 1 1 auto !important;
  max-width: 100% !important;
  min-height: 180px !important;
  width:100% !important;
}
.MOBILE_VIEW .IMAGE_02_CONTAINER__SD .IMAGE_02_TEXT__SD {
  padding: 20px 16px !important;
}
.MOBILE_VIEW .IMAGE_02_GRADIENT__SD {
  display: none !important;
}

/* --- Image 03 (Layout 15 - Split Image + Dark Text) --- */
.MOBILE_VIEW .IMAGE_03_CONTAINER__SD {
  flex-direction: column !important;
  min-height: auto !important;
  gap: 0px !important;
}
.MOBILE_VIEW .IMAGE_03_IMAGE__SD {
  min-height: 180px !important;
  width: 100% !important;
}
.MOBILE_VIEW .IMAGE_03_TEXT__SD {
  width: 100% !important;
  padding: 20px 16px !important;
}

/* --- Image 04 (Layout 16 - Image Left + Text Right) --- */
.MOBILE_VIEW .IMAGE_04_OUTER__SD {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.MOBILE_VIEW .IMAGE_04_CONTAINER__SD {
  flex-direction: column !important;
  gap: 12px !important;
  align-items: stretch !important;
}
.MOBILE_VIEW .IMAGE_04_IMAGE__SD {
  width: 100% !important;
  height: 180px !important;
  border-radius: 16px !important;
  flex-shrink: 1 !important;
  order: 0 !important;
}
.MOBILE_VIEW .IMAGE_04_TEXT__SD {
  width: 100% !important;
  gap: 12px !important;
  order: 1 !important;
  flex: none !important;
  margin-top:30px;
}

/* --- Image 05 (Layout 17 - Header + Full Width Image) --- */
.MOBILE_VIEW .IMAGE_05_WRAPPER__SD {
  gap: 30px !important;
}
.MOBILE_VIEW .IMAGE_05_HEADER__SD {
  flex-direction: column !important;
  gap: 10px !important;
  align-items: flex-start !important;
}
.MOBILE_VIEW .IMAGE_05_IMAGE__SD {
  height: 160px !important;
  border-radius: 16px !important;
}

/* --- Image 06 (Layout 48 - Text + Highlights + 3 Image Row) --- */
/* .MOBILE_VIEW .IMAGE_06_ROW__SD {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 24px !important;
} */
.MOBILE_VIEW .IMAGE_06_ROW__SD.flip-mobile {
  flex-direction: column-reverse !important;
}
.MOBILE_VIEW .IMAGE_06_TEXT__SD {
  width: 100% !important;
  max-width: none !important;
}
.MOBILE_VIEW .IMAGE_06_IMAGES__SD {
  width: 100% !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.MOBILE_VIEW .IMAGE_06_IMG_ITEM__SD {
  min-height: 160px !important;
  height: 160px !important;
  width: 100% !important;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* --- Layout 18 (ID 70 - Hero with Form) --- */
.MOBILE_VIEW .HERO_FORM_OUTER__SD {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.MOBILE_VIEW .HERO_FORM_CONTAINER__SD {
  flex-direction: column !important;
  gap: 24px !important;
  align-items: stretch !important;
}
.MOBILE_VIEW .HERO_FORM_LEFT__SD {
  width: 100% !important;
  max-width: none !important;
}
.MOBILE_VIEW .HERO_FORM_RIGHT__SD {
  width: 100% !important;
  max-width: none !important;
}

/* --- Layout 49 (ID 107 - Image Row / Logos) --- */
/* .MOBILE_VIEW .IMAGE_06_CONTAINER__SD {
  padding-left: 16px !important;
  padding-right: 16px !important;
} */
.MOBILE_VIEW .IMAGE_06_TITLE__SD {
  font-size: 18px !important;
  line-height: 1.3 !important;
}

/* --- Layout 50 (ID 108 - Stats / Proven Results) --- */
/* .MOBILE_VIEW .STATS_SECTION_CONTAINER__SD {
  padding: 30px 16px !important;
} */
.MOBILE_VIEW .STATS_SECTION_TITLE__SD {
  font-size: 24px !important;
  line-height: 1.3 !important;
}
.MOBILE_VIEW .STATS_SECTION_ROW__SD {
  flex-direction: column !important;
  gap: 24px !important;
}
.MOBILE_VIEW .STATS_SECTION_ITEM__SD {
  width: 100% !important;
}
.MOBILE_VIEW .STATS_SECTION_NUMBER__SD {
  font-size: 36px !important;
}
.MOBILE_VIEW .STATS_SECTION_LABEL__SD {
  font-size: 14px !important;
}

/* --- Layout 35 (ID 87 - Video Section) --- */
.MOBILE_VIEW .VIDEO_01_WRAPPER__SD {
  width: 100% !important;
  /* padding: 0 16px !important; */
  box-sizing: border-box !important;
}
.MOBILE_VIEW .VIDEO_01_VIDEO_BOX__SD {
  height: 200px !important;
}

/* --- Layout 45 (ID 103 - FAQ Accordion) --- */
/* .MOBILE_VIEW .FAQ_ACCORDION_CONTAINER__SD {
  padding: 30px 16px !important;
} */
.MOBILE_VIEW .FAQ_ACCORDION_TITLE__SD {
  font-size: 24px !important;
  line-height: 1.3 !important;
}
.MOBILE_VIEW .FAQ_ACCORDION_LIST__SD {
  gap: 12px !important;
}
/* .MOBILE_VIEW .FAQ_ACCORDION_ITEM__SD {
  padding: 16px !important;
} */
.MOBILE_VIEW .FAQ_ACCORDION_ANSWER_WRAPPER__SD {
  font-size: 14px !important;
}

/* ── Actual Mobile Screens (@media) ────────────────────────── */

@media (max-width: 600px) {
  /* --- Gallery 01 (Layout 24 - Portfolio Grid) --- */
  /* .GALLERY_01_CONTAINER__SD {
    padding: 30px 5% !important;
  } */
  .GALLERY_01_CONTENT__SD {
    gap: 20px !important;
  }
  .GALLERY_01_GRID__SD {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .GALLERY_01_SIDE_COL__SD {
    flex-direction: row !important;
    width: 100% !important;
    gap: 8px !important;
  }
  .GALLERY_01_CENTER__SD {
    flex: none !important;
    width: 100% !important;
    order: -1 !important;
  }

  /* --- Gallery 02 (Layout 25 - Work in Focus) --- */
  /* .GALLERY_02_CONTAINER__SD {
    padding: 30px 5% !important;
  } */
  .GALLERY_02_CONTENT__SD {
    gap: 24px !important;
  }
  .GALLERY_02_GRID__SD {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .GALLERY_02_CENTER__SD {
    flex: none !important;
    width: 100% !important;
    order: -1 !important;
  }
  .GALLERY_02_SIDE__SD {
    flex: 1 1 calc(50% - 4px) !important;
  }

  /* --- Gallery 03 (Layout 26 - Visual Highlights) --- */
  /* .GALLERY_03_CONTAINER__SD {
    padding: 30px 5% !important;
  } */
  .GALLERY_03_TOP_ROW__SD {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .GALLERY_03_TEXT_BLOCK__SD {
    flex: none !important;
    width: 100% !important;
    order: -1 !important;
  }
  .GALLERY_03_BOTTOM_ROW__SD {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* --- Gallery 04 (Layout 27 - Featured Gallery) --- */
  /* .GALLERY_04_CONTAINER__SD {
    padding: 30px 20px !important;
  } */
  .GALLERY_04_HEADER__SD {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    position: static !important;
  }
  .GALLERY_04_TEXT__SD {
    width: 100% !important;
  }
  .GALLERY_04_BUTTON__SD {
    position: static !important;
    width: 100% !important;
    transform: none !important;
    top: auto !important;
    right: auto !important;
  }
  .GALLERY_04_GRID__SD {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .GALLERY_04_GRID__SD > div {
    flex: 1 1 calc(50% - 4px) !important;
    height: 180px !important;
  }

  /* --- Gallery 05 (Layout 28 - Dark Gallery) --- */
  /* .GALLERY_05_CONTAINER__SD {
    padding: 30px 5% !important;
  } */
  .GALLERY_05_WRAPPER__SD {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  .GALLERY_05_GRID__SD {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .GALLERY_05_ROW__SD {
    display: contents !important;
  }
  .GALLERY_05_HIDDEN__SD {
    display: none !important;
  }
  .GALLERY_05_GRID__SD > .GALLERY_05_ROW__SD > div:not(.GALLERY_05_HIDDEN__SD) {
    flex: 1 1 calc(50% - 4px) !important;
  }
  .GALLERY_05_TEXT_OVERLAY__SD {
    position: static !important;
    width: 100% !important;
    left: auto !important;
    top: auto !important;
    order: -1 !important;
    margin-bottom: 16px !important;
  }
  .GALLERY_05_BUTTON__SD {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    margin-top: 16px !important;
  }

  /* --- Image 01 (Layout 13 - Text Left + Three Images Right) --- */
  .LP_IMAGE_SPLIT__SD {
    flex-direction: column !important;
    gap: 35px !important;
  }
  .LP_IMAGE_GRID__SD {
    flex-direction: column !important;
    height: auto !important;
    gap: 35px !important;
    width: 100% !important;
  }
  .LP_IMAGE_GRID_SMALL_COL__SD {
    display: contents !important;
  }
  .LP_IMAGE_GRID_ITEM__SD {
    width: 100% !important;
    height: 160px !important;
    min-height: 120px !important;
  }

  /* --- Image 02 (Layout 14 - Full-Width Two-Column Card) --- */
  .IMAGE_02_CONTAINER__SD {
    flex-direction: column !important;
    height: auto !important;
    border-radius: 16px !important;
  }
  .IMAGE_02_CONTAINER__SD .LP_IMAGE_CARD_HALF__SD {
    flex: 1 1 auto !important;
    max-width: 100% !important;
    min-height: 180px !important;
  }
  .IMAGE_02_CONTAINER__SD .IMAGE_02_TEXT__SD {
    padding: 20px 16px !important;
  }
  .IMAGE_02_GRADIENT__SD {
    display: none !important;
  }

  /* --- Image 03 (Layout 15 - Split Image + Dark Text) --- */
  .IMAGE_03_CONTAINER__SD {
    flex-direction: column !important;
    min-height: auto !important;
    gap: 0px !important;
  }
  .IMAGE_03_IMAGE__SD {
    min-height: 180px !important;
    width: 100% !important;
  }
  .IMAGE_03_TEXT__SD {
    width: 100% !important;
    padding: 20px 16px !important;
  }

  /* --- Image 04 (Layout 16 - Image Left + Text Right) --- */
  .IMAGE_04_OUTER__SD {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .IMAGE_04_CONTAINER__SD {
    flex-direction: column !important;
    gap: 12px !important;
    align-items: stretch !important;
  }
  .IMAGE_04_IMAGE__SD {
    width: 100% !important;
    height: 180px !important;
    border-radius: 16px !important;
    flex-shrink: 1 !important;
    order: 0 !important;
  }
  .IMAGE_04_TEXT__SD {
    width: 100% !important;
    gap: 12px !important;
    order: 1 !important;
    flex: none !important;
  }

  /* --- Image 05 (Layout 17 - Header + Full Width Image) --- */
  .IMAGE_05_WRAPPER__SD {
    gap: 12px !important;
  }
  .IMAGE_05_HEADER__SD {
    flex-direction: column !important;
    gap: 10px !important;
    align-items: flex-start !important;
  }
  .IMAGE_05_IMAGE__SD {
    height: 160px !important;
    border-radius: 16px !important;
  }

  /* --- Image 06 (Layout 48 - Text + Highlights + 3 Image Row) --- */
  /* .IMAGE_06_ROW__SD {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 24px !important;
  } */
  .IMAGE_06_ROW__SD.flip-mobile {
    flex-direction: column-reverse !important;
  }
  .IMAGE_06_TEXT__SD {
    width: 100% !important;
    max-width: none !important;
  }
  .IMAGE_06_IMAGES__SD {
    width: 100% !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  .IMAGE_06_IMG_ITEM__SD {
    min-height: 160px !important;
    height: 160px !important;
    width: 100% !important;
  }

  /* --- Layout 18 (ID 70 - Hero with Form) --- */
  .HERO_FORM_OUTER__SD {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .HERO_FORM_CONTAINER__SD {
    flex-direction: column !important;
    gap: 24px !important;
    align-items: stretch !important;
  }
  .HERO_FORM_LEFT__SD {
    width: 100% !important;
    max-width: none !important;
  }
  .HERO_FORM_RIGHT__SD {
    width: 100% !important;
    max-width: none !important;
  }

  /* --- Layout 49 (ID 107 - Image Row / Logos) --- */
  /* .IMAGE_06_CONTAINER__SD {
    padding-left: 16px !important;
    padding-right: 16px !important;
  } */
  .IMAGE_06_TITLE__SD {
    font-size: 18px !important;
    line-height: 1.3 !important;
  }

  /* --- Layout 50 (ID 108 - Stats / Proven Results) --- */
  /* .STATS_SECTION_CONTAINER__SD {
    padding: 30px 16px !important;
  } */
  .STATS_SECTION_TITLE__SD {
    font-size: 24px !important;
    line-height: 1.3 !important;
  }
  .STATS_SECTION_ROW__SD {
    flex-direction: column !important;
    gap: 24px !important;
  }
  .STATS_SECTION_ITEM__SD {
    width: 100% !important;
  }
  .STATS_SECTION_NUMBER__SD {
    font-size: 36px !important;
  }
  .STATS_SECTION_LABEL__SD {
    font-size: 14px !important;
  }

  /* --- Layout 35 (ID 87 - Video Section) --- */
  .VIDEO_01_WRAPPER__SD {
    width: 100% !important;
    /* padding: 0 16px !important; */
    box-sizing: border-box !important;
  }
  .VIDEO_01_VIDEO_BOX__SD {
    height: 200px !important;
  }

  /* --- Layout 45 (ID 103 - FAQ Accordion) --- */
  /* .FAQ_ACCORDION_CONTAINER__SD {
    padding: 30px 16px !important;
  } */
  .FAQ_ACCORDION_TITLE__SD {
    font-size: 24px !important;
    line-height: 1.3 !important;
  }
  .FAQ_ACCORDION_LIST__SD {
    gap: 12px !important;
  }
  /* .FAQ_ACCORDION_ITEM__SD {
    padding: 16px !important;
  } */
  .FAQ_ACCORDION_ANSWER_WRAPPER__SD {
    font-size: 14px !important;
  }
}

/* ============================================== */
/* FAQ LAYOUT (LAYOUT 53) RESPONSIVE STYLES      */
/* Based on Figma Design: 1200px desktop width   */
/* ============================================== */

/* FAQ Title - Desktop: 54px, Mobile: 32px */
.FAQ_TITLE__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 27px; /* Scaled for 600px width: 54 * 0.5 = 27 */
  line-height: 33px; /* Scaled: 65 * 0.5 ≈ 33 */
  text-align: center;
  color: #333333;
}

/* FAQ Question - Desktop: 16px, Mobile: 14px */
.FAQ_QUESTION__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  text-transform: uppercase;
  color: #333333;
}

/* FAQ Answer - Desktop: 14px, Mobile: 13px */
.FAQ_ANSWER__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  color: #555555;
}

/* FAQ Container - Gap between title and grid */
.FAQ_CONTAINER__SD {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  gap: 30px; /* Scaled from 40px for 600px width */
  width: 100%;
  box-sizing: border-box;
}

/* FAQ Grid Container - Rows of FAQ items */
.FAQ_GRID__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 40px; /* Row gap */
  width: 100%;
  box-sizing: border-box;
}

/* FAQ Row - Contains 2 FAQ items side by side */
.FAQ_ROW__SD {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  padding: 0px;
  gap: 22px; /* Column gap scaled from 44px */
  width: 100%;
  box-sizing: border-box;
}

/* FAQ Item - Contains question and answer */
.FAQ_ITEM__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 10px; /* Gap between question and answer */
  flex: 1;
  box-sizing: border-box;
}

/* Vertical Stack Position - When user selects "Vertical" in Stack Position sidebar */
/* Makes FAQ rows stack vertically (one item per row) instead of side-by-side */
.FAQ_GRID_VERTICAL__SD .FAQ_ROW__SD {
  flex-direction: column;
  gap: 40px;
}

.FAQ_GRID_VERTICAL__SD .FAQ_ITEM__SD {
  width: 100%;
  flex: none;
}

/* Mobile View - FAQ Responsive Adjustments */
/* Use *, selector to override inline font-size on inner <span> elements */
.MOBILE_VIEW .FAQ_TITLE__SD,
.MOBILE_VIEW .FAQ_TITLE__SD * {
  font-size: 24px !important;
  line-height: 29px !important;
}

.MOBILE_VIEW .FAQ_QUESTION__SD,
.MOBILE_VIEW .FAQ_QUESTION__SD * {
  font-size: 14px !important;
  line-height: 17px !important;
}

.MOBILE_VIEW .FAQ_ANSWER__SD,
.MOBILE_VIEW .FAQ_ANSWER__SD * {
  font-size: 13px !important;
  line-height: 16px !important;
}

.MOBILE_VIEW .FAQ_CONTAINER__SD {
  gap: 20px !important;
}

.MOBILE_VIEW .FAQ_GRID__SD {
  gap: 20px !important;
}

.MOBILE_VIEW .FAQ_ROW__SD {
  flex-direction: column !important;
  gap: 20px !important;
}

.MOBILE_VIEW .FAQ_ITEM__SD {
  width: 100% !important;
}

/* Media query for actual mobile screens (< 600px) */
@media (max-width: 600px) {
  .FAQ_TITLE__SD,
  .FAQ_TITLE__SD * {
    font-size: 24px !important;
    line-height: 29px !important;
  }

  .FAQ_QUESTION__SD,
  .FAQ_QUESTION__SD * {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .FAQ_ANSWER__SD,
  .FAQ_ANSWER__SD * {
    font-size: 13px !important;
    line-height: 16px !important;
  }

  .FAQ_CONTAINER__SD {
    gap: 20px !important;
  }

  .FAQ_GRID__SD {
    gap: 20px !important;
  }

  .FAQ_ROW__SD {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .FAQ_ITEM__SD {
    width: 100% !important;
  }
}

/* ============================================== */
/* LAYOUT 54-56 MOBILE PREVIEW & RESPONSIVE       */
/* ============================================== */
/* .MOBILE_VIEW .layout54Cta {
  padding: 30px 16px !important;
} */
.MOBILE_VIEW .layout54Inner {
  gap: 20px !important;
}
.MOBILE_VIEW .layout-55-container {
  flex-direction: column !important;
  gap: 30px !important;
}
.MOBILE_VIEW .layout-55-column {
  gap: 20px !important;
  min-width: 0 !important;
}
.MOBILE_VIEW .landing-layout-56-columns {
  grid-template-columns: 1fr !important;
  gap: 28px !important;
}
/* Layout 56 heading font scaling */
.MOBILE_VIEW .layout-56-heading,
.MOBILE_VIEW .layout-56-heading * {
  font-size: 28px !important;
  line-height: 36px !important;
}
.MOBILE_VIEW .layout-56-heading-wrap {
  margin-bottom: 30px !important;
}
.MOBILE_VIEW .layout-56-cards-button-wrap {
  gap: 28px !important;
}
/* FAQ ACCORDION LAYOUT (LAYOUT 103)              */
/* Based on Figma Design: FAQ Accordion           */
/* ============================================== */

.FAQ_ACCORDION_TITLE__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 32px;
  line-height: 39px;
  text-align: center;
  color: #333333;
}

.FAQ_ACCORDION_QUESTION__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 22px;
  line-height: 27px;
  color: #333333;
}

.FAQ_ACCORDION_ANSWER__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #555555;
}

.FAQ_ACCORDION_CONTAINER__SD {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 40px;
}

.FAQ_ACCORDION_LIST__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
}

.FAQ_ACCORDION_ITEM__SD {
  box-sizing: border-box;
  background: #FFFFFF;
  border: 2px solid #E3E3E3;
  border-radius: 20px;
  width: 100%;
  overflow: hidden;
}

.FAQ_ACCORDION_ANSWER_WRAPPER__SD {
  transition: max-height 0.3s ease-in-out;
  overflow: hidden;
}

/* Mobile responsive styles for FAQ Accordion */
.MOBILE_VIEW .FAQ_ACCORDION_TITLE__SD {
  font-size: 22px;
  line-height: 27px;
}

.MOBILE_VIEW .FAQ_ACCORDION_QUESTION__SD {
  font-size: 16px;
  line-height: 20px;
}

.MOBILE_VIEW .FAQ_ACCORDION_ANSWER__SD {
  font-size: 14px;
  line-height: 20px;
}

.MOBILE_VIEW .FAQ_ACCORDION_CONTAINER__SD {
  gap: 24px;
  /* padding: 0px 10px !important; */
}

.MOBILE_VIEW .FAQ_ACCORDION_LIST__SD {
  gap: 12px;
}

.MOBILE_VIEW .FAQ_ACCORDION_ITEM__SD {
  border-radius: 12px;
}

@media only screen and (max-width: 600px) {
  .FAQ_ACCORDION_TITLE__SD {
    font-size: 22px !important;
    line-height: 27px !important;
  }

  .FAQ_ACCORDION_QUESTION__SD {
    font-size: 16px !important;
    line-height: 20px !important;
  }

  .FAQ_ACCORDION_ANSWER__SD {
    font-size: 14px !important;
    line-height: 20px !important;
  }

  .FAQ_ACCORDION_CONTAINER__SD {
    gap: 24px !important;
    /* padding: 0px 10px !important; */
  }

  .FAQ_ACCORDION_LIST__SD {
    gap: 12px !important;
  }

  .FAQ_ACCORDION_ITEM__SD {
    border-radius: 12px !important;
  }
}

/* ============================================== */
/* FAQ TWO-COLUMN LAYOUT (LAYOUT 104) RESPONSIVE */
/* Based on Figma Design: FAQ Two Column          */
/* Figma node: 84171-4070                         */
/* ============================================== */

/* Title — Figma: Inter 500 32px/39px #333333 */
.FAQ_TWO_COL_TITLE__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 32px;
  line-height: 39px;
  color: #333333;
}

/* Question — Figma: Inter 600 22px/27px #333333 */
.FAQ_TWO_COL_QUESTION__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 22px;
  line-height: 27px;
  color: #333333;
}

/* Answer — Figma: Inter 400 16px/24px #555555 */
.FAQ_TWO_COL_ANSWER__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #555555;
}

/* Outer container — row, gap 40, full width */
.FAQ_TWO_COL_CONTAINER__SD {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 40px;
  width: 100%;
}

/* Left column — flex-grow:1, col, gap 40 */
.FAQ_TWO_COL_LEFT__SD {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
  flex: 1 1 0%;
  min-width: 0;
}

/* FAQ list — col, gap 20, full width */
.FAQ_TWO_COL_LIST__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
}

/* FAQ item — radius 20, overflow hidden, full width */
/* background & border set via inline styles from sidebar settings */
.FAQ_TWO_COL_ITEM__SD {
  box-sizing: border-box;
  border-radius: 20px;
  overflow: hidden;
  width: 100%;
}

/* Right panel — 36% of parent, #F0F0F0, radius 10 */
.FAQ_TWO_COL_RIGHT__SD {
  flex: 0 0 36%;
  background: #F0F0F0;
  border-radius: 10px;
  min-height: 300px;
}

.FAQ_TWO_COL_ANSWER_WRAPPER__SD {
  transition: max-height 0.3s ease-in-out;
  overflow: hidden;
}

/* ── MOBILE_VIEW class (builder mobile preview) ── */

.MOBILE_VIEW .FAQ_TWO_COL_TITLE__SD {
  font-size: 22px;
  line-height: 27px;
}

.MOBILE_VIEW .FAQ_TWO_COL_QUESTION__SD {
  font-size: 16px;
  line-height: 20px;
}

.MOBILE_VIEW .FAQ_TWO_COL_ANSWER__SD {
  font-size: 14px;
  line-height: 20px;
}

.MOBILE_VIEW .FAQ_TWO_COL_CONTAINER__SD {
  flex-direction: column;
  gap: 24px;
}

.MOBILE_VIEW .FAQ_TWO_COL_LEFT__SD {
  flex: 1 1 auto;
  width: 100%;
  gap: 24px;
}

.MOBILE_VIEW .FAQ_TWO_COL_LIST__SD {
  gap: 12px;
}

.MOBILE_VIEW .FAQ_TWO_COL_ITEM__SD {
  border-radius: 12px;
}

.MOBILE_VIEW .FAQ_TWO_COL_RIGHT__SD {
  flex: 0 0 auto;
  width: 100%;
  min-height: 250px;
}

/* ── @media query (published page responsive) ── */

@media only screen and (max-width: 768px) {
  .FAQ_TWO_COL_CONTAINER__SD {
    flex-direction: column !important;
    gap: 24px !important;
  }

  .FAQ_TWO_COL_LEFT__SD {
    flex: 1 1 auto !important;
    width: 100% !important;
    gap: 24px !important;
  }

  .FAQ_TWO_COL_RIGHT__SD {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 250px !important;
  }
}

@media only screen and (max-width: 600px) {
  .FAQ_TWO_COL_TITLE__SD {
    font-size: 22px !important;
    line-height: 27px !important;
  }

  .FAQ_TWO_COL_QUESTION__SD {
    font-size: 16px !important;
    line-height: 20px !important;
  }

  .FAQ_TWO_COL_ANSWER__SD {
    font-size: 14px !important;
    line-height: 20px !important;
  }

  .FAQ_TWO_COL_LIST__SD {
    gap: 12px !important;
  }

  .FAQ_TWO_COL_ITEM__SD {
    border-radius: 12px !important;
  }
}

/* ============================================== */
/* WHY CHOOSE US LAYOUT (LAYOUT 61) RESPONSIVE   */
/* Based on Figma Design: List 02                */
/* ============================================== */

/* Why Choose Us Heading - Judson, 40px, 700 weight, #333333, line-height: 47px */
.WHY_CHOOSE_US_HEADING__SD {
  font-family: 'Judson', Georgia, serif;
  font-style: normal;
  font-weight: 700;
  font-size: 40px;
  line-height: 47px;
  text-align: center;
  color: #333333;
}

/* Why Choose Us Item Title - Inter, 16px, 600 weight, #333333, line-height: 19px */
.WHY_CHOOSE_US_TITLE__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 19px;
  color: #333333;
}

/* Why Choose Us Item Description - Inter, 14px, 400 weight, #555555, line-height: 140% */
.WHY_CHOOSE_US_DESC__SD {
  font-family: 'Inter', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #555555;
}

/* Why Choose Us Container - gap: 40px between heading and grid */
.WHY_CHOOSE_US_CONTAINER__SD {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  gap: 40px;
  width: 100%;
  box-sizing: border-box;
}

/* Why Choose Us Grid - 3 columns x 2 rows, gap: 40px */
.WHY_CHOOSE_US_GRID__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 40px;
  width: 100%;
  box-sizing: border-box;
}

/* Why Choose Us Row - 3 items per row, gap: 40px */
.WHY_CHOOSE_US_ROW__SD {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 0px;
  gap: 40px;
  width: 100%;
  box-sizing: border-box;
}

/* Why Choose Us Item - Icon + Title + Description, gap: 14px */
.WHY_CHOOSE_US_ITEM__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 14px;
  flex: 1;
  border-radius: 10px;
  box-sizing: border-box;
}

/* Why Choose Us Icon Container - 48x48px, #F5F5F5 bg, 30px border-radius */
.WHY_CHOOSE_US_ICON__SD {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 12px;
  width: 48px;
  height: 48px;
  background: #F5F5F5;
  border-radius: 30px;
  box-sizing: border-box;
}

/* Why Choose Us Text Content - gap: 10px between title and description */
.WHY_CHOOSE_US_TEXT__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
}

/* Mobile View - Why Choose Us Responsive Adjustments */
/* Use *, selector to override inline font-size on inner <span> elements */
.MOBILE_VIEW .WHY_CHOOSE_US_HEADING__SD,
.MOBILE_VIEW .WHY_CHOOSE_US_HEADING__SD * {
  font-size: 28px !important;
  line-height: 33px !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_TITLE__SD,
.MOBILE_VIEW .WHY_CHOOSE_US_TITLE__SD * {
  font-size: 14px !important;
  line-height: 17px !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_DESC__SD,
.MOBILE_VIEW .WHY_CHOOSE_US_DESC__SD * {
  font-size: 13px !important;
  line-height: 130% !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_CONTAINER__SD {
  gap: 20px !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_GRID__SD {
  gap: 20px !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_ROW__SD {
  flex-direction: column !important;
  gap: 20px !important;
}

.MOBILE_VIEW .WHY_CHOOSE_US_ITEM__SD {
  width: 100% !important;
}

/* Media query for actual mobile screens (< 600px) */
@media (max-width: 600px) {
  .WHY_CHOOSE_US_HEADING__SD,
  .WHY_CHOOSE_US_HEADING__SD * {
    font-size: 28px !important;
    line-height: 33px !important;
  }

  .WHY_CHOOSE_US_TITLE__SD,
  .WHY_CHOOSE_US_TITLE__SD * {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .WHY_CHOOSE_US_DESC__SD,
  .WHY_CHOOSE_US_DESC__SD * {
    font-size: 13px !important;
    line-height: 130% !important;
  }

  .WHY_CHOOSE_US_CONTAINER__SD {
    gap: 20px !important;
  }

  .WHY_CHOOSE_US_GRID__SD {
    gap: 20px !important;
  }

  .WHY_CHOOSE_US_ROW__SD {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .WHY_CHOOSE_US_ITEM__SD {
    width: 100% !important;
  }
}

/* ============================================== */
/* LIST 04 LAYOUT (LAYOUT 64) RESPONSIVE STYLES  */
/* "Why Choose Us" with Bordered Items           */
/* Based on Figma Design: List 04                */
/* ============================================== */

/* List 04 Heading - Roboto, 40px, 700 weight, #333333, line-height: 47px */
.LIST_04_HEADING__SD {
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 40px;
  line-height: 47px;
  text-align: center;
  color: #333333;
}

/* List 04 Item Title - Roboto, 18px, 600 weight, #333333, line-height: 21px */
.LIST_04_TITLE__SD {
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 21px;
  color: #333333;
}

/* List 04 Item Description - Roboto, 14px, 400 weight, #555555, line-height: 140% */
.LIST_04_DESC__SD {
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #555555;
}

/* List 04 Container - gap: 40px between heading and grid */
.LIST_04_CONTAINER__SD {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  gap: 40px;
  width: 100%;
  box-sizing: border-box;
}

/* List 04 Grid - 2 columns × 3 rows */
.LIST_04_GRID__SD {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 0px;
  width: 100%;
  box-sizing: border-box;
}

/* List 04 Column - Contains 3 items vertically */
.LIST_04_COLUMN__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  width: 50%;
  box-sizing: border-box;
}

/* List 04 Item - Icon + Title + Description (horizontal), padding: 24px, gap: 20px, border: 1px solid #E3E3E3 */
.LIST_04_ITEM__SD {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 24px;
  gap: 20px;
  width: 100%;
  height: 115px;
  box-sizing: border-box;
  border: 1px solid #E3E3E3;
}

/* List 04 Icon Container - 42x42px, #F5F5F5 bg, 10px border-radius, 10px padding */
.LIST_04_ICON__SD {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 10px;
  width: 42px;
  height: 42px;
  min-width: 42px;
  background: #F5F5F5;
  border-radius: 10px;
  box-sizing: border-box;
}

/* List 04 Text Content - gap: 6px between title and description */
.LIST_04_TEXT__SD {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 6px;
  flex: 1;
  box-sizing: border-box;
}

/* Mobile View - List 04 Responsive Adjustments */
/* Use *, selector to override inline font-size on inner <span> elements */
.MOBILE_VIEW .LIST_04_HEADING__SD,
.MOBILE_VIEW .LIST_04_HEADING__SD * {
  font-size: 28px !important;
  line-height: 33px !important;
}

.MOBILE_VIEW .LIST_04_TITLE__SD,
.MOBILE_VIEW .LIST_04_TITLE__SD * {
  font-size: 16px !important;
  line-height: 19px !important;
}

.MOBILE_VIEW .LIST_04_DESC__SD,
.MOBILE_VIEW .LIST_04_DESC__SD * {
  font-size: 13px !important;
  line-height: 130% !important;
}

.MOBILE_VIEW .LIST_04_CONTAINER__SD {
  gap: 20px;
}

.MOBILE_VIEW .LIST_04_GRID__SD {
  flex-direction: column;
}

.MOBILE_VIEW .LIST_04_COLUMN__SD {
  width: 100%;
}

.MOBILE_VIEW .LIST_04_ITEM__SD {
  height: auto;
  min-height: 100px;
  padding: 16px;
  gap: 12px;
}

/* Media query for actual mobile screens (< 600px) */
@media (max-width: 600px) {
  .LIST_04_HEADING__SD,
  .LIST_04_HEADING__SD * {
    font-size: 28px !important;
    line-height: 33px !important;
  }

  .LIST_04_TITLE__SD,
  .LIST_04_TITLE__SD * {
    font-size: 16px !important;
    line-height: 19px !important;
  }

  .LIST_04_DESC__SD,
  .LIST_04_DESC__SD * {
    font-size: 13px !important;
    line-height: 130% !important;
  }

  .LIST_04_CONTAINER__SD {
    gap: 20px !important;
  }

  .LIST_04_GRID__SD {
    flex-direction: column !important;
  }

  .LIST_04_COLUMN__SD {
    width: 100% !important;
  }

  .LIST_04_ITEM__SD {
    height: auto !important;
    min-height: 100px !important;
    padding: 16px !important;
    gap: 12px !important;
  }
}

/* ============================================== */
/* LAYOUT 64 (List 04 - Why Choose Us) STYLES   */
/* Dynamic height boxes that expand with content */
/* ============================================== */

/* Layout 64 Item - Dynamic height based on content */
.LAYOUT_64_ITEM__SD {
  min-height: auto;
  height: auto;
}

/* Mobile View - Layout 64 adjustments */
.MOBILE_VIEW .LAYOUT_64_ITEM__SD {
  min-height: auto;
  height: auto;
  padding: 16px;
  gap: 12px;
}

/* Mobile View - Layout 64 border adjustments for single column */
.MOBILE_VIEW .COLUMN_2__SD .LAYOUT_64_ITEM__SD {
  border-width: 1px !important;
  border-style: solid !important;
}

/* Media query for actual mobile screens (< 600px) */
@media (max-width: 600px) {
  .LAYOUT_64_ITEM__SD {
    min-height: auto !important;
    height: auto !important;
    padding: 16px !important;
    gap: 12px !important;
  }
  
  /* Single column border style on mobile */
  .COLUMN_2__SD .LAYOUT_64_ITEM__SD {
    border-width: 1px !important;
    border-style: solid !important;
  }
}

/* ============================================== */
/* END DYNAMIC COLUMN LAYOUT SYSTEM              */
/* ==============================================*/

/* LayoutGrid responsive styles - 1 column on mobile (editor preview) */
.mobileView .layout-grid > div {
    flex: 0 0 100% !important;
    width: 100% !important;
}

/* LayoutGrid responsive styles - actual device breakpoints */
@media (max-width: 768px) {
  .layout-grid > div {
    flex: 0 0 calc(50% - 7px) !important;
  }
}

@media (max-width: 600px) {
  .layout-grid > div {
    flex: 0 0 100% !important;
    width: 100% !important;
  }
}

/* ============================================== */
/* VIDEO & TESTIMONIAL LAYOUT RESPONSIVE CLASSES  */
/* For Layouts 85 (Testimonial 33), 87-91 (Video) */
/* ============================================== */

/* --- Layout 33 (Testimonial) --- */
.MOBILE_VIEW .TESTIMONIAL_CARD__SD {
  flex-direction: column !important;
}

.MOBILE_VIEW .TESTIMONIAL_CARD_IMAGE__SD {
  width: 100% !important;
  min-height: 200px !important;
  border-right: none !important;
  border-bottom: 1px solid #E3E3E3 !important;
}

.MOBILE_VIEW .TESTIMONIAL_HEADER__SD {
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

.MOBILE_VIEW .TESTIMONIAL_NAV__SD {
  align-self: flex-start !important;
}

/* --- Layout 35 (Video 01 - Centered) --- */
.MOBILE_VIEW .VIDEO_01_WRAPPER__SD {
  width: 100% !important;
  gap: 24px !important;
}
.MOBILE_VIEW .VIDEO_01_VIDEO_BOX__SD {
  aspect-ratio: 16 / 9 !important;
}

/* --- Layout 36 (Video 02 - Two Column) --- */
.MOBILE_VIEW .VIDEO_02_CONTAINER__SD {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 30px !important;
  /* padding: 0 20px !important; */
}

.MOBILE_VIEW .VIDEO_02_CONTENT__SD {
  width: 100% !important;
  gap:20px !important;
}

.MOBILE_VIEW .VIDEO_02_VIDEO__SD {
  width: 100% !important;
}

.MOBILE_VIEW .VIDEO_02_FEATURES__SD {
  flex-direction: row !important;
  gap: 20px !important;
}

/* --- Layout 37 (Video 03 - Full Background) --- */
.MOBILE_VIEW .VIDEO_03_CARD__SD {
  flex-direction: column !important;
  aspect-ratio: unset !important;
  min-height: auto !important;
  border-radius: 16px !important;
}

.MOBILE_VIEW .VIDEO_03_LEFT__SD {
  width: 100% !important;
  padding: 24px 20px !important;
}

.MOBILE_VIEW .VIDEO_03_GRADIENT__SD {
  background: linear-gradient(180deg, var(--video03-card-bg, #F5F5F5) 0%, var(--video03-card-bg, #F5F5F5) 40%, transparent 100%) !important;
}

.MOBILE_VIEW .VIDEO_03_RIGHT__SD {
  min-height: 200px !important;
  width: 100% !important;
}

/* --- Layout 38 (Video 04 - Dual Video) --- */
.MOBILE_VIEW .VIDEO_04_HEADER__SD {
  flex-direction: column !important;
  gap: 20px !important;
}

.MOBILE_VIEW .VIDEO_04_HEADER_TITLE__SD {
  max-width: 100% !important;
}

.MOBILE_VIEW .VIDEO_04_HEADER_RIGHT__SD {
  max-width: 100% !important;
}

.MOBILE_VIEW .VIDEO_04_GRID__SD {
  flex-direction: column !important;
  gap: 20px !important;
}

.MOBILE_VIEW .VIDEO_04_CARD__SD {
  width: 100% !important;
}

/* --- Layout 39 (Video 05 - Centered with Strip) --- */
/* .MOBILE_VIEW .VIDEO_05_VIDEO__SD {
  width: 90% !important;
} */

/* ============================================== */
/* MEDIA QUERIES: Actual Mobile Screen (< 600px) */
/* Video & Testimonial Layouts                    */
/* ============================================== */

@media (max-width: 600px) {
  /* --- Layout 33 (Testimonial) --- */
  .TESTIMONIAL_CARD__SD {
    flex-direction: column !important;
  }

  .TESTIMONIAL_CARD_IMAGE__SD {
    width: 100% !important;
    min-height: 200px !important;
    border-right: none !important;
    border-bottom: 1px solid #E3E3E3 !important;
  }

  .TESTIMONIAL_HEADER__SD {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }

  .TESTIMONIAL_NAV__SD {
    align-self: flex-start !important;
  }

  /* --- Layout 35 (Video 01 - Centered) --- */
  .VIDEO_01_WRAPPER__SD {
    width: 100% !important;
    gap: 24px !important;
  }
  .VIDEO_01_VIDEO_BOX__SD {
    aspect-ratio: 16 / 9 !important;
  }

  /* --- Layout 36 (Video 02 - Two Column) --- */
  .VIDEO_02_CONTAINER__SD {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 30px !important;
    /* padding: 0 20px !important; */
  }

  .VIDEO_02_CONTENT__SD {
    width: 100% !important;
  }

  .VIDEO_02_VIDEO__SD {
    width: 100% !important;
  }

  .VIDEO_02_FEATURES__SD {
    flex-direction: row !important;
    gap: 20px !important;
  }

  /* --- Layout 37 (Video 03 - Full Background) --- */
  .VIDEO_03_CARD__SD {
    flex-direction: column !important;
    aspect-ratio: unset !important;
    min-height: auto !important;
    border-radius: 16px !important;
  }

  .VIDEO_03_LEFT__SD {
    width: 100% !important;
    padding: 24px 20px !important;
  }

  .VIDEO_03_GRADIENT__SD {
    background: linear-gradient(180deg, var(--video03-card-bg, #F5F5F5) 0%, var(--video03-card-bg, #F5F5F5) 40%, transparent 100%) !important;
  }

  .VIDEO_03_RIGHT__SD {
    min-height: 200px !important;
    width: 100% !important;
  }

  /* --- Layout 38 (Video 04 - Dual Video) --- */
  .VIDEO_04_HEADER__SD {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .VIDEO_04_HEADER_TITLE__SD {
    max-width: 100% !important;
  }

  .VIDEO_04_HEADER_RIGHT__SD {
    max-width: 100% !important;
  }

  .VIDEO_04_GRID__SD {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .VIDEO_04_CARD__SD {
    width: 100% !important;
  }

  /* --- Layout 39 (Video 05 - Centered with Strip) --- */
  /* .VIDEO_05_VIDEO__SD {
    width: 90% !important;
  } */
}
/* proposalBuilder */
.proposalBuilder .builderSection {
  margin-top: 2px;
}
.proposalBuilder .builderSection:last-child .settingMenuTemplateBlock {
  bottom: 0px;
  top: unset;
}
.proposalBuilder .builderSection .mainBlockWrapper {
  padding: 14px;
}
/* proposalBuilder end */


/* ============================================== */
/* FEATURE TEXT STYLES FOR PRICING BLOCKS        */
/* Ensures styles are properly inherited by      */
/* TipTap editor content                         */
/* ==============================================*/
.feature-text-wrapper {
  /* Allow all styles to be inherited */
}

.feature-text-wrapper .ProseMirror,
.feature-text-wrapper .ProseMirror p {
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-align: inherit !important;
  text-transform: inherit !important;
  margin: 0 !important;
}

.feature-text-wrapper .tiptap,
.feature-text-wrapper .tiptap p {
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-align: inherit !important;
  text-transform: inherit !important;
  margin: 0 !important;
}

/* ===== COUNTDOWN TIMER RESPONSIVE CLASSES ===== */

/* Countdown container - centers and constrains timer */
.COUNTDOWN_CONTAINER__SD {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

/* Countdown two-column layout (used by Countdown3) */
.COUNTDOWN_TWO_COL__SD {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
}

/* Countdown input row (used by Countdown1) */
.COUNTDOWN_INPUT_ROW__SD {
  display: flex;
  align-items: center;
}

/* Countdown input field */
.COUNTDOWN_INPUT__SD {
  max-width: 100%;
  box-sizing: border-box;
}

/* Countdown timer wrapper - prevents overflow */
.COUNTDOWN_TIMER_WRAP__SD {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

/* Countdown card digit */
.COUNTDOWN_CARD__SD {
  /* default sizes set via inline style */
}

/* Countdown large label row */
.COUNTDOWN_LABEL_ROW__SD {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ===== MOBILE VIEW (builder preview) ===== */
.MOBILE_VIEW .COUNTDOWN_TWO_COL__SD {
  flex-direction: column !important;
  gap: 30px !important;
}

.MOBILE_VIEW .COUNTDOWN_INPUT_ROW__SD {
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}

.MOBILE_VIEW .COUNTDOWN_INPUT__SD {
  width: 100% !important;
  max-width: 100% !important;
}

/* ===== TABLET @media (max-width: 768px) ===== */
@media (max-width: 768px) {
  .COUNTDOWN_TWO_COL__SD {
    flex-direction: column !important;
    gap: 30px !important;
  }
}

/* ===== MOBILE @media (max-width: 600px) ===== */
@media (max-width: 600px) {
  /* Two-column stacks to single column */
  .COUNTDOWN_TWO_COL__SD {
    flex-direction: column !important;
    gap: 24px !important;
    align-items: center !important;
  }

  /* Input row stacks vertically */
  .COUNTDOWN_INPUT_ROW__SD {
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .COUNTDOWN_INPUT__SD {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Card digits scale down */
  .COUNTDOWN_CARD__SD {
    width: 60px !important;
    height: 86px !important;
    font-size: 42px !important;
    line-height: 50px !important;
  }

  /* Bordered digits scale down */
  .COUNTDOWN_BORDERED_CARD__SD {
    width: 34px !important;
    height: 52px !important;
    font-size: 32px !important;
    line-height: 42px !important;
  }

  /* Box digits scale down */
  .COUNTDOWN_BOX__SD {
    width: 70px !important;
    height: 76px !important;
    font-size: 40px !important;
    line-height: 56px !important;
  }

  /* Large label row gap shrinks */
  .COUNTDOWN_LABEL_ROW__SD {
    gap: 20px !important;
  }
}

/* Builder mobile preview — countdown blocks */
.MOBILE_VIEW .countdown-97-input-section {
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}
.MOBILE_VIEW .countdown-97-input-field {
  width: 100% !important;
}
.MOBILE_VIEW .countdown-97-timer-digits {
  font-size: 36px !important;
  line-height: 54px !important;
}
.MOBILE_VIEW .countdown-97-separator {
  font-size: 36px !important;
  line-height:36px !important;
}
.MOBILE_VIEW .countdown-97-label {
  font-size: 11px !important;
}
.MOBILE_VIEW .countdown-97-header {
  box-sizing: border-box !important;
}

.MOBILE_VIEW .countdown-98-card {
   width: 24px !important;
    height: 40px !important;
    font-size: 20px !important;
    border-radius:8px !important;
}

.MOBILE_VIEW .countdown-98-separator {
  font-size: 36px !important;
}
.MOBILE_VIEW .countdown-98-timer-container {
  gap: 4px !important;
}
.MOBILE_VIEW .countdown-98-card-pair {
  gap: 4px !important;
}
.MOBILE_VIEW .countdown-98-header {
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

.MOBILE_VIEW .countdown-99-columns {
  flex-direction: column !important;
  gap: 24px !important;
  align-items: center !important;
}
.MOBILE_VIEW .countdown-99-left-col {
  align-items: center !important;
  width: 100% !important;
}
.MOBILE_VIEW .countdown-99-button-wrap {
  justify-content: center !important;
}
.MOBILE_VIEW .countdown-99-right-col {
  flex: none !important;
  width: 100% !important;
  justify-content: center !important;
}
.MOBILE_VIEW .countdown-99-box {
  width: 68px !important;
  height: 74px !important;
  font-size: 38px !important;
}

.MOBILE_VIEW .countdown-100-bordered-card {
  width: 34px !important;
  height: 52px !important;
  font-size: 32px !important;
}
.MOBILE_VIEW .countdown-100-separator {
  font-size: 32px !important;
}
.MOBILE_VIEW .countdown-100-label {
  font-size: 11px !important;
  width: 68px !important;
  margin-top: 8px !important;
}
.MOBILE_VIEW .countdown-100-header {
  box-sizing: border-box !important;
}

.MOBILE_VIEW .countdown-101-digit {
  font-size: 48px !important;
  line-height: 52px !important;
}
.MOBILE_VIEW .countdown-101-separator {
  font-size: 48px !important;
  line-height:48px !important;
}
.MOBILE_VIEW .countdown-101-label-row {
  gap: 16px !important;
}
.MOBILE_VIEW .countdown-101-label {
  font-size: 12px !important;
}
.MOBILE_VIEW .countdown-101-header {
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

/* ============================================== */
/* GLOBAL LANDING PAGE RESPONSIVE                  */
/* Responsive rules for ALL landing page layouts   */
/* on published site (via MOBILE_VIEW class from   */
/* viewport detection) and builder mobile preview   */
/* ============================================== */

/* --- Global background block padding reduction --- */
/* Already handled above via [id$="_background_block"] */

/* --- Layout 55 (Layout3): Stack to column on mobile --- */
.MOBILE_VIEW .layout-55-container {
  flex-direction: column !important;
}

/* --- Layout 57 (Layout5): Hero split layout --- */
.MOBILE_VIEW .layout-57-content {
  flex-direction: column !important;
  gap: 24px !important;
}
.MOBILE_VIEW .layout-57-text-content {
  width: 100% !important;
  max-width: 100% !important;
}
.MOBILE_VIEW .layout-57-image-card-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}

/* --- Layout 58 (Layout6): CTA block like Layout54 --- */
/* .MOBILE_VIEW .layout58Content {
  padding: 30px 16px !important;
} */
.MOBILE_VIEW .layout58HeadingSection {
  gap: 16px !important;
}

/* --- Layout 59 (Layout7): Split image + text --- */
.MOBILE_VIEW .layout-59-split-container {
  flex-direction: column !important;
}
.MOBILE_VIEW .layout-59-text-column,
.MOBILE_VIEW .layout-59-image-column {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  flex: none !important;
  height: auto !important;
}

/* --- Layout 62 (Layout10): What You Get 4-col cards --- */
.MOBILE_VIEW .layout-62-heading-text,
.MOBILE_VIEW .layout-62-heading-text * {
  font-size: 24px !important;
  line-height: 30px !important;
}
.MOBILE_VIEW .layout-62-cards-container {
  padding: 16px !important;
  border-radius: 14px !important;
}
.MOBILE_VIEW .layout-62-cards-wrapper {
  flex-direction: column !important;
  gap: 16px !important;
}
.MOBILE_VIEW .layout-62-card-wrapper {
  flex: none !important;
  width: 100% !important;
  flex-direction: column !important;
}
.MOBILE_VIEW .layout-62-divider-vertical {
  display: none !important;
}
.MOBILE_VIEW .layout-62-divider-horizontal {
  display: block !important;
}
.MOBILE_VIEW .layout-62-icon-container {
  width: 52px !important;
  height: 52px !important;
}
.MOBILE_VIEW .layout-62-card {
  min-height: auto !important;
  gap: 14px !important;
}
.MOBILE_VIEW .layout-62-desc-text,
.MOBILE_VIEW .layout-62-desc-text * {
  font-size: 13px !important;
}

/* --- Layout 63 (Layout11): How It Works steps --- */
.MOBILE_VIEW .layout-63-heading,
.MOBILE_VIEW .layout-63-heading * {
  font-size: 24px !important;
  line-height: 30px !important;
}

/* --- Pricing Layouts (19-23) card grid stacking --- */
.MOBILE_VIEW .pricing-grid,
.MOBILE_VIEW .pricing-cards-container {
  flex-direction: column !important;
  align-items: center !important;
}
.MOBILE_VIEW .pricing-card {
  width: 100% !important;
  max-width: 400px !important;
}

/* --- Gallery Layouts (24-28): grid stacking --- */
.MOBILE_VIEW .gallery-grid {
  grid-template-columns: 1fr !important;
}

/* --- Video Layouts (35-39) --- */
/* Already handled above via VIDEO_*__SD classes */

/* --- Footer Layouts (40-44): column stacking --- */
.MOBILE_VIEW .footer-columns {
  flex-direction: column !important;
  gap: 24px !important;
}

/* ============================================== */
/* GLOBAL FONT SCALING - PUBLISHED SITE            */
/* For ALL landing page text blocks that use        */
/* inline font-size via Interweave/TemplateRTE      */
/* Uses [data-is-merge-text-attribute] wrapper       */
/* ============================================== */

/* --- Large headings (>= 40px) → 26px on mobile --- */
@media (max-width: 600px) {
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 64px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 54px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 53px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 44px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 40px"] {
    font-size: 26px !important;
    line-height: 1.25 !important;
  }

  /* Medium headings (36px, 32px, 30px) → 22px on mobile */
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 36px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 32px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 30px"] {
    font-size: 22px !important;
    line-height: 1.3 !important;
  }

  /* Medium text (22px) → 18px on mobile */
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 22px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 20px"] {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
}

/* Tablet breakpoint (768px) */
@media (max-width: 768px) {
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 64px"] {
    font-size: 40px !important;
    line-height: 1.2 !important;
  }

  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 54px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 53px"] {
    font-size: 36px !important;
    line-height: 1.25 !important;
  }

  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 44px"],
  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 40px"] {
    font-size: 32px !important;
    line-height: 1.25 !important;
  }

  [id$="_background_block"] [data-is-merge-text-attribute] p span[style*="font-size: 36px"] {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }
}

/* MOBILE_VIEW class equivalents for builder preview */
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 64px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 54px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 53px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 44px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 40px"] {
  font-size: 26px !important;
  display:inline-block;
}

.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 36px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 32px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 30px"] {
  font-size: 22px !important;
  display:inline-block;
}

.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 22px"],
.MOBILE_VIEW [data-is-merge-text-attribute] p span[style*="font-size: 20px"] {
  font-size: 16px !important;
  display:inline-block;
}

/* ============================================== */
/* GLOBAL FONT SCALING - TIPTAP EDITOR             */
/* For text blocks rendered via Tiptap (builder)    */
/* Uses .tiptap.ProseMirror for targeting           */
/* ============================================== */
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 64px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 54px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 53px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 44px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 40px"] {
  font-size: 26px !important;
  line-height: 1.25 !important;
}

.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 36px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 32px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 30px"] {
  font-size: 22px !important;
  line-height: 1.3 !important;
}

.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 22px"],
.MOBILE_VIEW .tiptap.ProseMirror p span[style*="font-size: 20px"] {
  font-size: 16px !important;
  line-height: 1.4 !important;
}

/* Tiptap font scaling for published site via @media */
@media (max-width: 600px) {
  .tiptap.ProseMirror p span[style*="font-size: 64px"],
  .tiptap.ProseMirror p span[style*="font-size: 54px"],
  .tiptap.ProseMirror p span[style*="font-size: 53px"],
  .tiptap.ProseMirror p span[style*="font-size: 44px"],
  .tiptap.ProseMirror p span[style*="font-size: 40px"] {
    font-size: 26px !important;
    line-height: 1.25 !important;
  }

  .tiptap.ProseMirror p span[style*="font-size: 36px"],
  .tiptap.ProseMirror p span[style*="font-size: 32px"],
  .tiptap.ProseMirror p span[style*="font-size: 30px"] {
    font-size: 22px !important;
    line-height: 1.3 !important;
  }

  .tiptap.ProseMirror p span[style*="font-size: 22px"],
  .tiptap.ProseMirror p span[style*="font-size: 20px"] {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
}

/* ============================================== */
/* GLOBAL LAYOUT STACKING - PUBLISHED SITE         */
/* For two-column layouts, pricing grids, etc.      */
/* ============================================== */
@media (max-width: 768px) {
  /* Layout 55 container stacking */
  .layout-55-container {
    flex-direction: column !important;
    gap: 30px !important;
  }
  .layout-55-column {
    min-width: 0 !important;
  }

  /* Layout 57 content stacking */
  .layout-57-content {
    flex-direction: column !important;
    gap: 24px !important;
  }
  .layout-57-text-content,
  .layout-57-image-card-wrapper {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Layout 59 split stacking */
  .layout-59-split-container {
    flex-direction: column !important;
  }
  .layout-59-text-column,
  .layout-59-image-column {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: none !important;
    height: auto !important;
  }
}

@media (max-width: 600px) {
  /* Layout 58 CTA padding */
  /* .layout58Content {
    padding: 30px 16px !important;
  } */
  .layout58HeadingSection {
    gap: 16px !important;
  }

  /* Reduce all large layout paddings */
  [id$="_background_block"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ============================================== */
/* PRICING LAYOUTS 71-75 (Layout19-23) MOBILE      */
/* Builder preview via MOBILE_VIEW class            */
/* ============================================== */

/* --- Layout 71 (Layout19): Classic Pricing with Toggle --- */
.MOBILE_VIEW .layout-71-title,
.MOBILE_VIEW .layout-71-title * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-71-subtitle,
.MOBILE_VIEW .layout-71-subtitle * {
  font-size: 14px !important;
}
.MOBILE_VIEW .layout-71-header {
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}
.MOBILE_VIEW .layout-71-toggle-wrapper {
  justify-self: start !important;
}
.MOBILE_VIEW .layout-71-toggle {
  width: 100% !important;
  max-width: 100% !important;
}
.MOBILE_VIEW .layout-71-toggle-btn {
  flex: 1 !important;
  width: auto !important;
}
.MOBILE_VIEW .layout-71-cards {
  gap: 16px !important;
}
.MOBILE_VIEW .layout-71-cards .COLUMN_ITEM__SD,
.MOBILE_VIEW .layout-71-card-item {
  width: 100% !important;
  flex: 0 0 100% !important;
}
.MOBILE_VIEW .layout-71-price,
.MOBILE_VIEW .layout-71-price * {
  font-size: 24px !important;
  line-height: 30px !important;
}
.MOBILE_VIEW .layout-71-container {
  gap: 24px !important;
}

/* --- Layout 72 (Layout20): Centered Modern Pricing --- */
.MOBILE_VIEW .layout-72-title,
.MOBILE_VIEW .layout-72-title * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-72-subtitle,
.MOBILE_VIEW .layout-72-subtitle * {
  font-size: 14px !important;
}
.MOBILE_VIEW .layout-72-toggle {
  width: 100% !important;
  max-width: 100% !important;
}
.MOBILE_VIEW .layout-72-toggle-btn {
  flex: 1 !important;
  width: auto !important;
}
.MOBILE_VIEW .layout-72-cards {
  gap: 16px !important;
}
.MOBILE_VIEW .layout-72-cards .COLUMN_ITEM__SD,
.MOBILE_VIEW .layout-72-card-item {
  width: 100% !important;
  flex: 0 0 100% !important;
}
.MOBILE_VIEW .layout-72-price,
.MOBILE_VIEW .layout-72-price * {
  font-size: 24px !important;
  line-height: 30px !important;
}
.MOBILE_VIEW .layout-72-container {
  gap: 20px !important;
}

/* --- Layout 73 (Layout21): Comparison Table Pricing --- */
.MOBILE_VIEW .layout-73-title,
.MOBILE_VIEW .layout-73-title * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-73-subtitle,
.MOBILE_VIEW .layout-73-subtitle * {
  font-size: 14px !important;
}
.MOBILE_VIEW .layout-73-container {
  gap: 20px !important;
}
.MOBILE_VIEW .layout-73-table-scroll {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
.MOBILE_VIEW .layout-73-table {
  min-width: 700px !important;
}
.MOBILE_VIEW .layout-73-price,
.MOBILE_VIEW .layout-73-price * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-73-plan-col {
  padding: 14px !important;
}

/* --- Layout 74 (Layout22): Stacked/Overlapping Cards --- */
.MOBILE_VIEW .layout-74-title,
.MOBILE_VIEW .layout-74-title * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-74-subtitle,
.MOBILE_VIEW .layout-74-subtitle * {
  font-size: 14px !important;
}
.MOBILE_VIEW .layout-74-container {
  gap: 20px !important;
}
.MOBILE_VIEW .layout-74-cards {
  flex-direction: column !important;
  gap: 16px !important;
}
.MOBILE_VIEW .layout-74-card-wrapper {
  width: 100% !important;
  flex: none !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.MOBILE_VIEW .layout-74-card {
  padding-bottom: 20px !important;
}
.MOBILE_VIEW .layout-74-card-btn {
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  margin-top: 16px !important;
}
.MOBILE_VIEW .layout-74-price,
.MOBILE_VIEW .layout-74-price * {
  font-size: 24px !important;
  line-height: 30px !important;
}

/* --- Layout 75 (Layout23): Cards with Image Headers --- */
.MOBILE_VIEW .layout-75-title,
.MOBILE_VIEW .layout-75-title * {
  font-size: 22px !important;
  line-height: 28px !important;
}
.MOBILE_VIEW .layout-75-subtitle,
.MOBILE_VIEW .layout-75-subtitle * {
  font-size: 14px !important;
}
.MOBILE_VIEW .layout-75-container {
  gap: 20px !important;
}
.MOBILE_VIEW .layout-75-cards {
  gap: 16px !important;
}
.MOBILE_VIEW .layout-75-cards .COLUMN_ITEM__SD,
.MOBILE_VIEW .layout-75-card-item {
  width: 100% !important;
  flex: 0 0 100% !important;
}
.MOBILE_VIEW .layout-75-image-header {
  height: 120px !important;
}
.MOBILE_VIEW .layout-75-price,
.MOBILE_VIEW .layout-75-price * {
  font-size: 24px !important;
  line-height: 30px !important;
}
.MOBILE_VIEW .layout-75-card-content {
  padding: 16px !important;
}
.emailPreviewOverlay .ProseMirror{
  min-height:unset;
}

/* Layout 107: Image 06 — Title + Multi-Image Row */

.IMAGE_06_ROW__SD::-webkit-scrollbar {
  display: none;
}

.MOBILE_VIEW .IMAGE_06_CONTAINER__SD {
  gap: 30px;
  padding: 0 16px;
}

.MOBILE_VIEW .IMAGE_06_ROW__SD {
  overflow-x: auto;
  justify-content: flex-start;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.MOBILE_VIEW .IMAGE_06_ROW__SD::-webkit-scrollbar {
  display: none;
}

/* .MOBILE_VIEW .IMAGE_06_ITEM__SD {
  flex: 0 0 120px;
} */

@media only screen and (max-width: 768px) {
  .IMAGE_06_CONTAINER__SD {
    gap: 30px !important;
    /* padding: 0 16px !important; */
  }

  .IMAGE_06_ROW__SD {
    overflow-x: auto !important;
    justify-content: flex-start !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .IMAGE_06_ROW__SD::-webkit-scrollbar {
    display: none;
  }

  /* .IMAGE_06_ITEM__SD {
    flex: 0 0 120px !important;
  } */
}



/* Layout 108: Stats / Proven Results Section */

.STATS_SECTION_ROW__SD {
  flex-direction: row;
}

.MOBILE_VIEW .STATS_SECTION_ROW__SD {
  flex-direction: column;
  gap: 24px;
  align-items: center;
}

.MOBILE_VIEW .STATS_SECTION_ITEM__SD {
  width: 100%;
}

@media only screen and (max-width: 768px) {
  .STATS_SECTION_ROW__SD {
    flex-direction: column !important;
    gap: 24px !important;
    align-items: center !important;
  }

  .STATS_SECTION_ITEM__SD {
    width: 100% !important;
  }
}

/* Layout 109: Footer 06 */

.MOBILE_VIEW .FOOTER_06_TOP_ROW__SD {
  flex-direction: column;
}

.MOBILE_VIEW .FOOTER_06_IMAGE__SD {
  width: 100% !important;
}

@media only screen and (max-width: 768px) {
  .FOOTER_06_TOP_ROW__SD {
    flex-direction: column !important;
  }

  .FOOTER_06_IMAGE__SD {
    width: 100% !important;
  }
}

/* Free-layout controls are only mounted behind builder_free_layout. */
.freeLayoutToolbar { display: flex; gap: 8px; flex-wrap: wrap; }
.freeLayoutActions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.freeLayoutBlock { position: relative; }
.freeLayoutCanvas { isolation: isolate; }
.freeLayoutBackground { position: absolute; inset: 0; z-index: 0; }
.freeLayoutToolbar { position: absolute; top: 8px; left: 8px; right: 8px; z-index: 2; justify-content: flex-start; opacity: 0; pointer-events: none; }
.freeLayoutBlock:hover > .freeLayoutToolbar,
.freeLayoutToolbar:focus-within { opacity: 1; pointer-events: auto; }
.freeLayoutToolbar button, .freeLayoutSettings button:not(.button_SD) { padding: 6px 8px; border: 1px solid var(--lightBorderSD); border-radius: 6px; background: var(--bgWhiteSD); color: var(--textColorSD); }
.freeLayoutSettings { padding: 14px; border-bottom: 1px solid var(--lightBorderSD); }
.freeLayoutSettings p { margin: 8px 0; }
.freeLayoutSettings input { width: 100%; border: 1px solid var(--lightBorderSD); border-radius: 6px; padding: 6px; }
.freeLayoutSettings h3 { margin: 14px 0 8px; }
.freeLayoutLayerRow { display: flex; align-items: center; border: 1px solid var(--lightBorderSD); border-radius: 6px; margin: 6px 0; background: var(--bgWhiteSD); }
.freeLayoutLayerRow.isSelected { outline: 2px solid var(--primaryColorSD); }
.freeLayoutLayerRow.isDragging { opacity: .6; z-index: 2; }
.freeLayoutSettings .freeLayoutLayerRow button { border: 0; background: transparent; }
.freeLayoutSettings .freeLayoutLayerGrip { flex: 0 0 32px; cursor: grab; touch-action: none; color: var(--textTertiary); }
.freeLayoutSettings .freeLayoutLayerGrip:active { cursor: grabbing; }
.freeLayoutSettings .freeLayoutLayerSelect { flex: 1; text-align: left; min-width: 0; }
.freeLayoutSettings .freeLayoutLayerSelect[aria-pressed='true'] { outline: none; }
.freeLayoutLayerGrip:focus-visible, .freeLayoutLayerSelect:focus-visible { outline: 2px solid var(--primaryColorSD) !important; }
.freeLayoutSettings button[aria-pressed='true'] { outline: 2px solid var(--primaryColorSD); }
.freeLayoutSettings button:disabled { opacity: .4; }
.freeLayoutElement.isSelected { outline: 2px solid var(--primaryColorSD); }
.freeLayoutElementHandles { visibility: hidden; }
.freeLayoutElement:hover .freeLayoutElementHandles, .freeLayoutElement:focus-within .freeLayoutElementHandles, .freeLayoutElement.isSelected .freeLayoutElementHandles { visibility: visible; }
.freeLayoutResize { position: absolute; top: 0; z-index: 2; background: var(--bgWhiteSD); color: var(--primaryColorSD); border: 1px solid currentColor; touch-action: none; width: 12px; height: 12px; padding: 0; border-radius: 2px; }
.freeLayoutResize-nw { top: -6px; left: -6px; cursor: nwse-resize; }
.freeLayoutResize-n { top: -6px; left: calc(50% - 6px); cursor: ns-resize; }
.freeLayoutResize-ne { top: -6px; right: -6px; cursor: nesw-resize; }
.freeLayoutResize-e { top: calc(50% - 6px); right: -6px; cursor: ew-resize; }
.freeLayoutResize-se { top: auto; bottom: -6px; right: -6px; cursor: nwse-resize; }
.freeLayoutResize-s { top: auto; bottom: -6px; left: calc(50% - 6px); cursor: ns-resize; }
.freeLayoutResize-sw { top: auto; bottom: -6px; left: -6px; cursor: nesw-resize; }
.freeLayoutResize-w { top: calc(50% - 6px); left: -6px; cursor: ew-resize; }
.freeLayoutOriginal [id$='_layout_66_heading'], .freeLayoutOriginal [id$='_layout_66_description'], .freeLayoutOriginal [id$='_layout_66_button'] { visibility: hidden; }

.freeLayoutGrid { pointer-events: none; }
.freeLayoutGridLine { fill: none; stroke: var(--primaryColorSD); stroke-opacity: .35; stroke-width: 1; }
.freeLayoutGridSettings { display: flex; flex-direction: column; gap: 12px; }
.freeLayoutGridSettings .toggle__switch__btnSD { width: 100%; }
.freeLayoutSettings .freeLayoutGridSettings label { width: 100%; margin: 0; align-items: flex-start; text-align: left; }
.freeLayoutGridSettings input[type="checkbox"] { width: auto; padding: 0; }

.freeLayoutElement[tabindex] { cursor: grab; touch-action: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; }
.freeLayoutElement[tabindex] .freeLayoutContent * { cursor: inherit; }
.freeLayoutElement[data-editing-text] { cursor: text; -webkit-user-select: text; -moz-user-select: text; user-select: text; }

.imagePlacementSettings { display: flex; flex-direction: column; gap: 14px; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--lightBorderSD); }
.imagePlacementActions { display: flex; gap: 8px; }
.imagePlacementActions > button { flex: 1; }
.templateImageFrame { position: relative; display: block; width: 100%; overflow: hidden; }
.templateImageFrame.isCropping { cursor: move; touch-action: none; outline: 2px solid var(--primaryColorSD); outline-offset: -2px; }
.templateImageTile { position: absolute; inset: 0; background-repeat: repeat; }
.freeLayoutContentSized .templateImageFrame { height: var(--free-layout-height); aspect-ratio: auto !important; }