/**/.dmNewParagraph[data-version] .text-align-left{text-align:left!important}.dmNewParagraph[data-version] .text-align-center{text-align:center!important}.dmNewParagraph[data-version] .text-align-right{text-align:right!important}
.dmNewParagraph[data-version] .text-align-justify{text-align:justify!important}.dmNewParagraph[data-version] .ql-indent-1{padding:0 1em;padding-inline-end:0;padding-inline-start:3em}.dmNewParagraph[data-version] .ql-indent-2{padding:0 2em;padding-inline-end:0;padding-inline-start:6em}
.dmNewParagraph[data-version] .ql-indent-3{padding:0 3em;padding-inline-end:0;padding-inline-start:9em}.dmNewParagraph[data-version] .ql-indent-4{padding:0 4em;padding-inline-end:0;padding-inline-start:12em}
.dmNewParagraph[data-version] .ql-indent-5{padding:0 5em;padding-inline-end:0;padding-inline-start:15em}.dmNewParagraph[data-version] .ql-indent-6{padding:0 6em;padding-inline-end:0;padding-inline-start:18em}
.dmNewParagraph[data-version] .ql-indent-7{padding:0 7em;padding-inline-end:0;padding-inline-start:21em}.dmNewParagraph[data-version] .ql-indent-8{padding:0 8em;padding-inline-end:0;padding-inline-start:24em}
.dmNewParagraph[data-version] .ql-indent-9{padding:0 9em;padding-inline-end:0;padding-inline-start:27em}.dmNewParagraph[data-version]{line-height:initial}.dmNewParagraph[data-version] [class*=size-]{width:auto!important;height:auto!important}
.dmNewParagraph[data-version] h1,.dmNewParagraph[data-version] h2,.dmNewParagraph[data-version] h3,.dmNewParagraph[data-version] h4,.dmNewParagraph[data-version] h5,.dmNewParagraph[data-version] h6,.dmNewParagraph[data-version] ol,.dmNewParagraph[data-version] p,.dmNewParagraph[data-version] ul{margin-top:0;margin-bottom:0}
.dmNewParagraph[data-version] ol,.dmNewParagraph[data-version] ul{padding:0;counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}.dmNewParagraph[data-version] ol>li,.dmNewParagraph[data-version] ul>li{list-style-type:none;text-indent:-1.5em;margin:0 1em;margin-inline-end:0;margin-inline-start:2em}
.dmNewParagraph[data-version] ol>li:before,.dmNewParagraph[data-version] ul>li:before{min-width:1em;display:inline-block;margin-right:.5em;margin-inline-start:0;margin-inline-end:.5em;text-align:right;text-align:end}
.dmNewParagraph[data-version] ul .ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-1}.dmNewParagraph[data-version] ul .ql-indent-1:before{font-weight:700;content:"○"}
.dmNewParagraph[data-version] ul .ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-2}.dmNewParagraph[data-version] ul .ql-indent-2:before,.dmNewParagraph[data-version] ul .ql-indent-3:before,.dmNewParagraph[data-version] ul .ql-indent-4:before,.dmNewParagraph[data-version] ul .ql-indent-5:before,.dmNewParagraph[data-version] ul .ql-indent-6:before,.dmNewParagraph[data-version] ul .ql-indent-7:before,.dmNewParagraph[data-version] ul .ql-indent-8:before,.dmNewParagraph[data-version] ul .ql-indent-9:before{font-weight:700;content:"■"}
.dmNewParagraph[data-version] ul .ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-3}.dmNewParagraph[data-version] ul .ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9;counter-increment:list-4}
.dmNewParagraph[data-version] ul .ql-indent-5{counter-reset:list-6 list-7 list-8 list-9;counter-increment:list-5}.dmNewParagraph[data-version] ul .ql-indent-6{counter-reset:list-7 list-8 list-9;counter-increment:list-6}
.dmNewParagraph[data-version] ul .ql-indent-7{counter-reset:list-8 list-9;counter-increment:list-7}.dmNewParagraph[data-version] ul .ql-indent-8{counter-reset:list-9;counter-increment:list-8}.dmNewParagraph[data-version] ul .ql-indent-9{counter-reset:list-10 list-9;counter-increment:list-9}
.dmNewParagraph[data-version] ul>li:before{font-weight:700;content:"•";font-family:Arial}.dmNewParagraph[data-version] ul.custom-list-1>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"○";transform:scale(1);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-2>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"★";transform:scale(.7);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-3>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"➞";transform:scale(.8);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-4>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"＋";transform:scale(.7);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-5>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"－";transform:scale(.7);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-6>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"✓";transform:scale(.8);transform-origin:center right}
.dmNewParagraph[data-version] ul.custom-list-7>li:not([class^=ql-indent-]):not([class*=" ql-indent-"]):before{content:"✗";transform:scale(.8);transform-origin:center right}
.dmNewParagraph[data-version] ol .ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-1}.dmNewParagraph[data-version] ol .ql-indent-1:before{content:counter(list-1,lower-alpha) ". "}
.dmNewParagraph[data-version] ol .ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-2}.dmNewParagraph[data-version] ol .ql-indent-2:before{content:counter(list-2,lower-roman) ". "}
.dmNewParagraph[data-version] ol .ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-3}.dmNewParagraph[data-version] ol .ql-indent-3:before{content:counter(list-3,decimal) ". "}
.dmNewParagraph[data-version] ol .ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9;counter-increment:list-4}.dmNewParagraph[data-version] ol .ql-indent-4:before{content:counter(list-4,lower-alpha) ". "}
.dmNewParagraph[data-version] ol .ql-indent-5{counter-reset:list-6 list-7 list-8 list-9;counter-increment:list-5}.dmNewParagraph[data-version] ol .ql-indent-5:before{content:counter(list-5,lower-roman) ". "}
.dmNewParagraph[data-version] ol .ql-indent-6{counter-reset:list-7 list-8 list-9;counter-increment:list-6}.dmNewParagraph[data-version] ol .ql-indent-6:before{content:counter(list-6,decimal) ". "}
.dmNewParagraph[data-version] ol .ql-indent-7{counter-reset:list-8 list-9;counter-increment:list-7}.dmNewParagraph[data-version] ol .ql-indent-7:before{content:counter(list-7,lower-alpha) ". "}
.dmNewParagraph[data-version] ol .ql-indent-8{counter-reset:list-9;counter-increment:list-8}.dmNewParagraph[data-version] ol .ql-indent-8:before{content:counter(list-8,lower-roman) ". "}
.dmNewParagraph[data-version] ol .ql-indent-9{counter-reset:list-10 list-9;counter-increment:list-9}.dmNewParagraph[data-version] ol .ql-indent-9:before{content:counter(list-9,decimal) ". "}
.dmNewParagraph[data-version] ol li{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-0}.dmNewParagraph[data-version] ol li:before{content:counter(list-0,decimal) ". "}
.dmNewParagraph[data-version] a{vertical-align:initial}@media(min-width:768px) and (max-width:1024px){.dmNewParagraph[data-version] .t-text-align-left{text-align:left!important}.dmNewParagraph[data-version] .t-text-align-center{text-align:center!important}
.dmNewParagraph[data-version] .t-text-align-right{text-align:right!important}.dmNewParagraph[data-version] .t-text-align-justify{text-align:justify!important}}@media(max-width:767px){.dmRoot .dmNewParagraph[data-version] .m-text-align-left{text-align:left!important}
.dmRoot .dmNewParagraph[data-version] .m-text-align-center{text-align:center!important}.dmRoot .dmNewParagraph[data-version] .m-text-align-right{text-align:right!important}.dmRoot .dmNewParagraph[data-version] .m-text-align-justify{text-align:justify!important}
}.inlineBindingLink{color:inherit!important;text-decoration:inherit!important}/**/.hamburgerButton{display:block;background-color:transparent;border:0;padding:0;margin:0}.hamburgerButton,.hamburgerButton svg{width:100%;height:100%}/**/.imageWidget{position:relative}.imageWidget a,.imageWidget span.image-caption{font-style:italic;text-align:center}.imageWidget a[data-caption]::after,.imageWidget span[data-caption]::after{content:attr(data-caption);display:block;line-height:100%}
.imageWidget.with-caption a::after,.imageWidget.with-caption span.image-caption::after{margin-top:12px}.imageWidget img[width][height]{height:auto}[data-flex-site] #fcontainer .imageWidget:after,[data-flex-site] #flex-footer .imageWidget:after,[data-flex-site] #flex-header .imageWidget:after{content:none}
[data-flex-site] #fcontainer .imageWidget:before,[data-flex-site] #flex-footer .imageWidget:before,[data-flex-site] #flex-header .imageWidget:before{font-size:80px;transform:none}.imageWidget.hover img.hover-image,.imageWidget:hover img.hover-image{display:initial}
.imageWidget.hover.hasHover img:not(.hover-image),.imageWidget:hover.hasHover img:not(.hover-image){display:none!important}.imageWidget img.hover-image,.imageWidget img.logo-on-scroll{display:none}
/* Custom Widgets Styles */
.template-gallery-widget-list {
    list-style: none; 
    display: grid; 
    grid-template-columns: auto auto auto; 
    gap: 1.25em;
}

.template-gallery-widget-list--error {
    grid-template-columns: auto;
}

.template-gallery-widget-list__item {
    display: flex;
    flex-direction: column;
    cursor: initial;
    border: 1px solid rgba(0,0,0,0);
    border-radius: 4px;
    padding: 1em;
    transition: .366s ease-in-out border, .33s ease-in-out box-shadow;
}

.template-gallery-widget-list__item-thumbnail {
    border: 1px solid var(--button-bg-color);
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: top;
    display: block;
}

.template-gallery-widget-list__item:focus, .template-gallery-widget-list__item:focus-within {
    border-color: rgba(0,0,0,0.225);
    box-shadow:
      0 1px 1px hsl(0deg 0% 0% / 0.075),
      0 2px 2px hsl(0deg 0% 0% / 0.075),
      0 4px 4px hsl(0deg 0% 0% / 0.075),
      0 8px 8px hsl(0deg 0% 0% / 0.075),
      0 16px 16px hsl(0deg 0% 0% / 0.075)
    ;
}

.template-gallery-widget-list__item-caption {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.template-gallery-widget-list__item-title {
    font-size: 1em !important;
    color: rgb(60,60,60) !important;
    margin: 1.5em 0 0.75em;
}
@media (min-width: 768px) { .template-gallery-widget-list__item:hover {
  border-color: rgba(0, 0, 0, 0.225);
  box-shadow: 0 1px 1px hsla(0, 0%, 0%, 0.075), 0 2px 2px hsla(0, 0%, 0%, 0.075), 0 4px 4px hsla(0, 0%, 0%, 0.075), 0 8px 8px hsla(0, 0%, 0%, 0.075), 0 16px 16px hsla(0, 0%, 0%, 0.075);
} }
@media (max-width: 767px) { .template-gallery-widget-list {
  grid-template-columns: auto;
}

.template-gallery-widget-list__item {
  border-color: rgba(0, 0, 0, 0.225);
  padding: 0.75em;
}

.template-gallery-widget-list__item-title {
  font-size: 1.25em !important;
} }

.widget-b6c439 {
  --primary: #A284CB;
  --primary-dark: #7a5fa3;
  --primary-light: #f2edf9;
  --accent: #baa0d9;
  --text-dark: #1e1a26;
  --text-mid: #4a4258;
  --text-light: #8c82a0;
  --border: #ddd6eb;
  --bg-white: #ffffff;
  --bg-soft: #f8f6fc;
  --success: #6aaa72;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --shadow-sm: 0 2px 12px rgba(162, 132, 203, 0.08);
  --shadow-md: 0 6px 30px rgba(162, 132, 203, 0.16);
  --transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: inherit;

  .questionnaire-wrapper {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 16px 48px;
    box-sizing: border-box;
  }

  /* ── Header ── */
  .questionnaire-header {
    text-align: center;
    padding: 10px 0 32px;
  }

  .questionnaire-title {
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 14px;
    letter-spacing: -0.3px;
    line-height: 1.2;
  }

  .questionnaire-subtitle {
    font-size: clamp(0.95rem, 2vw, 1.1rem);
    color: var(--text-mid);
    margin: 0;
    line-height: 1.6;
    max-width: 100%;
    margin-inline: auto;
  }

  /* ── Progress ── */
  .progress-container {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 36px;
  }

  .progress-bar-track {
    flex: 1;
    height: 4px;
    background: var(--border);
    border-radius: 10px;
    overflow: hidden;
  }

  .progress-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--primary), var(--accent));
    border-radius: 10px;
    width: 14.28%;
    transition: width 0.4s ease;
  }

  .progress-label {
    font-size: 0.82rem;
    color: var(--text-light);
    white-space: nowrap;
    font-weight: 500;
    letter-spacing: 0.3px;
  }

  /* ── Question Blocks ── */
  .question-block {
    display: none;
    animation: fadeSlideIn 0.35s ease;
  }

  .question-block.active {
    display: block;
  }

  @keyframes fadeSlideIn {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
  }

  @keyframes fadeSlideBack {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
  }

  .question-block.slide-back {
    animation: fadeSlideBack 0.35s ease;
  }

  .question-header {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 28px;
  }

  .question-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 50%;
    box-shadow: var(--shadow-sm);
  }

  .question-text-wrap {
    flex: 1;
  }

  .question-title {
    font-size: clamp(1.1rem, 2.5vw, 1.35rem);
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 6px;
    line-height: 1.3;
  }

  .question-desc {
    font-size: 0.93rem;
    color: var(--text-mid);
    margin: 0;
    line-height: 1.5;
  }

  .select-note {
    color: var(--primary);
    font-style: italic;
    font-weight: 500;
  }

  /* ── Options Grid ── */
  .options-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
    margin-bottom: 32px;
    width: 100%;
  }

  .option-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 22px 16px;
    background: var(--bg-white);
    border: 2px solid var(--border);
    border-radius: var(--radius-md);
    cursor: pointer;
    text-align: center;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
    min-height: 100px;
  }

  .option-card:hover {
    border-color: var(--primary);
    background: var(--primary-light);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
  }

  .option-card.selected {
    border-color: var(--primary);
    background: var(--primary-light);
    box-shadow: 0 0 0 3px rgba(162, 132, 203, 0.18), var(--shadow-sm);
  }

  .option-card.disabled {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
  }

  .option-card input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }

  .option-icon {
    font-size: 1.5rem;
    color: var(--primary);
    line-height: 1;
    display: block;
  }

  .option-label {
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--text-dark);
    line-height: 1.35;
  }

  .check-mark {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 20px;
    height: 20px;
    border: 2px solid var(--border);
    border-radius: 4px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
  }

  .option-card.selected .check-mark {
    background: var(--primary);
    border-color: var(--primary);
  }

  .option-card.selected .check-mark::after {
    content: '';
    display: block;
    width: 5px;
    height: 9px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg) translateY(-1px);
  }

  /* Radio style for single-select grid */
  .option-card.single-select .check-mark {
    border-radius: 50%;
  }

  .option-card.single-select.selected .check-mark::after {
    width: 8px;
    height: 8px;
    border: none;
    background: #fff;
    border-radius: 50%;
    transform: none;
  }

  /* ── Options List (full-width) ── */
  .options-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 32px;
  }

  .option-card-full {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: var(--bg-white);
    border: 2px solid var(--border);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
  }

  .option-card-full:hover {
    border-color: var(--primary);
    background: var(--primary-light);
    transform: translateX(4px);
  }

  .option-card-full.selected {
    border-color: var(--primary);
    background: var(--primary-light);
    box-shadow: 0 0 0 3px rgba(162, 132, 203, 0.18), var(--shadow-sm);
  }

  .option-card-full input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }

  .option-card-full .check-mark {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 2px solid var(--border);
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
  }

  .option-card-full.selected .check-mark {
    background: var(--primary);
    border-color: var(--primary);
  }

  .option-card-full.selected .check-mark::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
  }

  .option-card-full .option-label {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-dark);
    line-height: 1.4;
  }

  /* ── Step Validation Error ── */
  .step-error-msg {
    display: none;
    font-size: 0.83rem;
    font-weight: 600;
    color: #c0392b;
    background: rgba(192, 57, 43, 0.07);
    border: 1.5px solid rgba(192, 57, 43, 0.25);
    border-radius: var(--radius-sm);
    padding: 9px 16px;
    margin-bottom: 12px;
    text-align: center;
    letter-spacing: 0.2px;
  }

  @keyframes stepErrorShake {
    0%   { transform: translateX(0); }
    18%  { transform: translateX(-7px); }
    36%  { transform: translateX(7px); }
    54%  { transform: translateX(-5px); }
    72%  { transform: translateX(5px); }
    90%  { transform: translateX(-2px); }
    100% { transform: translateX(0); }
  }

  .step-error-msg.step-error-shake {
    animation: stepErrorShake 0.45s ease;
  }

  /* ── Navigation Buttons ── */
  .nav-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    align-items: center;
    padding-top: 8px;
  }

  .btn-back {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 12px 24px;
    background: transparent;
    border: 2px solid var(--border);
    border-radius: var(--radius-sm);
    color: var(--text-mid);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    margin-right: auto;
    letter-spacing: 0.2px;
  }

  .btn-back:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-light);
  }

  .btn-next,
  .btn-submit {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 30px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: var(--radius-sm);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
    box-shadow: 0 4px 16px rgba(162, 132, 203, 0.32);
  }

  .btn-next:hover,
  .btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(162, 132, 203, 0.46);
  }

  .btn-next:disabled,
  .btn-submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
  }

  .arrow {
    font-size: 1rem;
    transition: transform 0.2s ease;
  }

  .btn-next:hover .arrow {
    transform: translateX(3px);
  }

  .btn-back:hover .arrow {
    transform: translateX(-3px);
  }

  /* ── Results Header (shown after quiz) ── */
  .results-header {
    animation: fadeSlideIn 0.4s ease;
    text-align: center;
    padding: 40px 0 32px;
  }

  .results-icon {
    font-size: 2.5rem;
    color: var(--primary);
    margin-bottom: 16px;
    animation: sparkle 1.5s ease-in-out infinite alternate;
  }

  @keyframes sparkle {
    from { transform: scale(1) rotate(-5deg); }
    to   { transform: scale(1.12) rotate(5deg); }
  }

  .results-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 10px;
  }

  .results-subtitle {
    font-size: 1rem;
    color: var(--text-mid);
    margin: 0;
  }

  /* ── Recommended Template Card ── */
  .recommended-template {
    position: relative;
    background: linear-gradient(135deg, var(--primary-light), #faf7ff);
    border: 2px solid var(--primary);
    border-radius: var(--radius-lg);
    padding: 36px 36px 32px;
    margin-bottom: 36px;
    text-align: center;
    box-shadow: var(--shadow-md);
    animation: fadeSlideIn 0.4s ease;
  }

  .template-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 16px;
    border-radius: 30px;
    margin-bottom: 18px;
  }

  .template-name {
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 800;
    color: var(--primary-dark);
    margin: 0 0 14px;
    letter-spacing: -0.5px;
  }

  .template-desc {
    font-size: 1rem;
    color: var(--text-mid);
    line-height: 1.65;
    margin: 0 0 22px;
    max-width: 100%;
    text-align: center;
  }

  .template-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-bottom: 28px;
  }

  .template-tag {
    background: #fff;
    border: 1.5px solid var(--primary);
    color: var(--primary-dark);
    font-size: 0.78rem;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 30px;
    letter-spacing: 0.3px;
  }

  /* ── Recommended actions (preview + choose) ── */
  .recommended-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
  }

  /* ── Preview Button (main card) ── */
  .btn-preview-main {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 28px;
    background: transparent;
    border: 2px solid var(--primary);
    border-radius: var(--radius-sm);
    color: var(--primary-dark);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
  }

  .btn-preview-main:hover {
    background: var(--primary-light);
    transform: translateY(-2px);
  }

  /* ── Choose Button (main card) ── */
  .btn-choose-main {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 28px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: var(--radius-sm);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
    box-shadow: 0 4px 16px rgba(162, 132, 203, 0.32);
  }

  .btn-choose-main:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(162, 132, 203, 0.46);
  }

  .preview-icon {
    font-size: 0.85rem;
  }

  /* ── Skip to Templates ── */
  .skip-to-templates-wrap {
    display: flex;
    justify-content: center;
    margin: 4px 0 32px;
  }

  .btn-skip-templates {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    background: transparent;
    border: none;
    color: var(--text-light);
    font-size: 0.83rem;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0.3px;
    transition: color 0.2s ease;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: transparent;
  }

  .btn-skip-templates:hover {
    color: var(--primary);
    text-decoration-color: var(--primary);
  }

  .skip-arrow {
    font-size: 0.9rem;
    transition: transform 0.2s ease;
  }

  .btn-skip-templates:hover .skip-arrow {
    transform: translateY(3px);
  }

  /* ── All Templates Grid ── */
  .all-templates {
    margin-bottom: 36px;
  }

  .all-templates-title {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-light);
    letter-spacing: 1.8px;
    text-transform: uppercase;
    margin: 0 0 16px;
    text-align: center;
  }

  .templates-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }

  .template-item {
    background: var(--bg-white);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-md);
    padding: 18px 16px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    cursor: pointer;
  }

  .template-item:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
  }

  .template-item.is-match {
    border-color: var(--primary);
    background: var(--primary-light);
  }

  .template-item-badge {
    display: inline-block;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 20px;
    margin-bottom: 8px;
  }

  .template-item-image {
    width: 100%;
    border-radius: var(--radius-sm);
    overflow: hidden;
    margin-bottom: 12px;
    aspect-ratio: 16 / 9;
    background: var(--bg-soft);
  }

  .template-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    display: block;
    transition: transform 0.35s ease;
  }

  .template-item:hover .template-item-image img {
    transform: scale(1.04);
  }

  .template-item-name {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--primary-dark);
    margin: 0 0 6px;
  }

  .template-item-desc {
    font-size: 0.78rem;
    color: var(--text-mid);
    line-height: 1.4;
    margin: 0 0 14px;
  }

  .template-item-actions {
    display: flex;
    gap: 6px;
    justify-content: center;
    flex-wrap: wrap;
  }

  .btn-preview-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    background: transparent;
    border: 1.5px solid var(--primary);
    border-radius: 30px;
    color: var(--primary-dark);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.2px;
  }

  .btn-preview-item:hover {
    background: var(--primary-light);
    border-color: var(--primary-dark);
  }

  .btn-choose-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: 30px;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.2px;
    box-shadow: 0 2px 8px rgba(162, 132, 203, 0.28);
  }

  .btn-choose-item:hover {
    opacity: 0.88;
    transform: translateY(-1px);
  }

  /* ── Custom Design Section ── */
  .custom-design-section {
    margin-top: 40px;
    margin-bottom: 0;
    animation: fadeSlideIn 0.4s ease;
  }

  .custom-design-inner {
    position: relative;
    background: var(--bg-soft);
    border: 2px solid var(--primary);
    border-radius: var(--radius-lg);
    padding: 36px 36px 32px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
  }

  .custom-design-inner::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 260px;
    height: 260px;
    background: radial-gradient(circle at top right, rgba(162, 132, 203, 0.12) 0%, transparent 65%);
    pointer-events: none;
  }

  .custom-design-top {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
  }

  .custom-design-badge {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    padding: 4px 14px;
    border-radius: 30px;
  }

  .custom-design-title {
    font-size: clamp(1.3rem, 2.5vw, 1.75rem);
    font-weight: 800;
    color: var(--primary-dark);
    margin: 0;
    letter-spacing: -0.2px;
    line-height: 1.2;
  }

  .custom-design-desc {
    font-size: 0.95rem;
    color: var(--text-mid);
    line-height: 1.7;
    margin: 0;
  }

  .custom-design-details {
    display: flex;
    align-items: center;
    gap: 28px;
    margin-bottom: 28px;
    flex-wrap: wrap;
  }

  .custom-design-fee {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
    background: var(--bg-white);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-md);
    padding: 14px 22px;
    min-width: 120px;
  }

  .custom-design-fee-label {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--text-light);
    letter-spacing: 1.4px;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .custom-design-fee-amount {
    font-size: 1.85rem;
    font-weight: 800;
    color: var(--primary-dark);
    letter-spacing: -0.5px;
    line-height: 1.1;
  }

  .custom-design-divider {
    width: 1.5px;
    height: 48px;
    background: var(--border);
    flex-shrink: 0;
  }

  .custom-design-features {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
  }

  .custom-design-features li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 0.88rem;
    color: var(--text-mid);
    line-height: 1.5;
  }

  .custom-design-features li::before {
    content: '✦';
    color: var(--primary);
    font-size: 0.65rem;
    margin-top: 4px;
    flex-shrink: 0;
  }

  .btn-custom-design {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 30px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: var(--radius-sm);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
    box-shadow: 0 4px 16px rgba(162, 132, 203, 0.32);
  }

  .btn-custom-design:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(162, 132, 203, 0.48);
  }

  @media (max-width: 767px) {
    .custom-design-inner {
      padding: 26px 20px 24px;
    }

    .custom-design-details {
      flex-direction: column;
      align-items: flex-start;
      gap: 16px;
    }

    .custom-design-divider {
      display: none;
    }

    .custom-design-fee {
      min-width: unset;
      align-self: flex-start;
      flex-direction: row;
      align-items: baseline;
      gap: 8px;
      padding: 10px 18px;
    }
  }

  /* ── Restart Button ── */
  .btn-restart {
    display: block;
    margin: 0 auto;
    padding: 13px 34px;
    background: transparent;
    border: 2px solid var(--primary);
    border-radius: var(--radius-sm);
    color: var(--primary-dark);
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
  }

  .btn-restart:hover {
    background: var(--primary-light);
    transform: translateY(-1px);
  }

  /* ── Contact Screen ── */
  .contact-screen {
    animation: fadeSlideIn 0.4s ease;
    max-width: 560px;
    margin: 0 auto;
  }

  .contact-header {
    text-align: center;
    padding: 32px 0 28px;
  }

  .contact-back-wrap {
    text-align: left;
    margin-bottom: 24px;
  }

  .btn-contact-back {
    background: transparent;
    border: none;
    color: var(--text-light);
    font-size: 0.87rem;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 0;
    transition: color 0.2s;
    letter-spacing: 0.2px;
  }

  .btn-contact-back:hover {
    color: var(--primary);
  }

  .contact-icon {
    font-size: 2.2rem;
    color: var(--primary);
    margin-bottom: 14px;
  }

  .contact-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 10px;
  }

  .contact-subtitle {
    font-size: 1rem;
    color: var(--text-mid);
    margin: 0 0 20px;
    line-height: 1.6;
  }

  .chosen-template-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--primary-light);
    border: 1.5px solid var(--primary);
    border-radius: 30px;
    padding: 6px 18px;
    font-size: 0.88rem;
    color: var(--text-dark);
  }

  .chosen-template-label {
    color: var(--text-light);
    font-weight: 500;
  }

  /* ── Contact Form ── */
  .contact-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .field-label {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-dark);
    letter-spacing: 0.2px;
  }

  .field-required {
    color: var(--primary);
  }

  .field-input {
    width: 100%;
    padding: 13px 16px;
    background: var(--bg-white);
    border: 2px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 0.95rem;
    color: var(--text-dark);
    transition: var(--transition);
    outline: none;
    box-sizing: border-box;
    font-family: inherit;
  }

  .field-input::placeholder {
    color: var(--text-light);
  }

  .field-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(162, 132, 203, 0.18);
  }

  .field-input--error {
    border-color: #c0392b !important;
    box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.1) !important;
  }

  .field-error {
    display: none;
    font-size: 0.8rem;
    color: #c0392b;
    font-weight: 500;
    margin-top: 2px;
  }

  .btn-contact-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 15px 36px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: var(--radius-sm);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    letter-spacing: 0.3px;
    box-shadow: 0 4px 16px rgba(162, 132, 203, 0.32);
    margin-top: 8px;
  }

  .btn-contact-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(162, 132, 203, 0.46);
  }

  .btn-contact-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  }

  /* ── Success Screen ── */
  .success-screen {
    animation: fadeSlideIn 0.4s ease;
    text-align: center;
    padding: 60px 24px 40px;
  }

  .success-icon {
    font-size: 3rem;
    color: var(--primary);
    margin-bottom: 18px;
    animation: sparkle 1.5s ease-in-out infinite alternate;
  }

  .success-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--text-dark);
    margin: 0 0 12px;
  }

  .success-message {
    font-size: 1rem;
    color: var(--text-mid);
    line-height: 1.65;
    margin: 0 0 32px;
    max-width: 460px;
    margin-inline: auto;
  }

  /* ── Responsive ── */
  @media (max-width: 767px) {
    .questionnaire-header {
      padding: 32px 0 24px;
    }

    .options-grid {
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }

    .option-card {
      padding: 16px 10px;
      min-height: 90px;
    }

    .option-label {
      font-size: 0.8rem;
    }

    .question-header {
      gap: 12px;
    }

    .recommended-template {
      padding: 28px 20px;
    }

    .templates-grid {
      grid-template-columns: 1fr 1fr;
    }

    .nav-buttons {
      flex-wrap: wrap;
    }

    .btn-back {
      order: 2;
      margin-right: 0;
    }

    .btn-next,
    .btn-submit {
      order: 1;
      flex: 1;
      justify-content: center;
    }

    .recommended-actions {
      flex-direction: column;
      align-items: stretch;
    }

    .btn-preview-main,
    .btn-choose-main {
      justify-content: center;
    }

    .template-item-actions {
      flex-direction: column;
    }
  }

  @media (min-width: 768px) and (max-width: 1024px) {
    .options-grid {
      grid-template-columns: repeat(3, 1fr);
    }
  }
}

/* ═══════════════════════════════════════════════
   PREVIEW MODAL — global scope
═══════════════════════════════════════════════ */
.bq-preview-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  box-sizing: border-box;
}

.bq-preview-modal.open {
  display: flex;
}

.bq-preview-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(22, 18, 35, 0.8);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.bq-preview-modal-shell {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  background: #1c1528;
  border-radius: 16px;
  overflow: hidden;
  animation: bqModalSlideUp 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 24px 80px rgba(100, 70, 160, 0.5);
  border: 1px solid rgba(162, 132, 203, 0.22);
}

@keyframes bqModalSlideUp {
  from { opacity: 0; transform: translateY(24px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.bq-preview-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 18px;
  height: 52px;
  background: #241832;
  border-bottom: 1px solid rgba(162, 132, 203, 0.2);
  flex-shrink: 0;
}

.bq-preview-modal-title-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow: hidden;
}

.bq-preview-modal-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(162, 132, 203, 0.7);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

.bq-preview-modal-name {
  font-size: 0.95rem;
  font-weight: 700;
  color: #ede8f7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bq-preview-modal-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.bq-preview-nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(162, 132, 203, 0.12);
  border: 1px solid rgba(162, 132, 203, 0.25);
  border-radius: 7px;
  color: #A284CB;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}

.bq-preview-nav-btn:hover:not(:disabled) {
  background: rgba(162, 132, 203, 0.25);
  border-color: rgba(162, 132, 203, 0.5);
}

.bq-preview-nav-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.bq-preview-nav-counter {
  font-size: 0.75rem;
  color: rgba(162, 132, 203, 0.65);
  font-weight: 600;
  min-width: 32px;
  text-align: center;
}

.bq-preview-close-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(162, 132, 203, 0.1);
  border: 1px solid rgba(162, 132, 203, 0.25);
  border-radius: 7px;
  color: #A284CB;
  font-size: 0.95rem;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}

.bq-preview-close-btn:hover {
  background: rgba(162, 132, 203, 0.28);
  border-color: rgba(162, 132, 203, 0.55);
  color: #fff;
}

/* Preview card body */
.bq-preview-body {
  flex: 1;
  overflow-y: auto;
  padding: 36px 32px 40px;
  background: #1c1528;
}

.bq-preview-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
}

.bq-preview-card-icon {
  font-size: 2.2rem;
  color: #A284CB;
  line-height: 1;
}

.bq-preview-card-name {
  font-size: 1.7rem;
  font-weight: 800;
  color: #ede8f7;
  margin: 0;
  letter-spacing: -0.3px;
}

.bq-preview-card-desc {
  font-size: 0.92rem;
  color: rgba(237, 232, 247, 0.75);
  line-height: 1.6;
  margin: 0;
  max-width: 380px;
}

.bq-preview-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: center;
  margin: 4px 0 8px;
}

.bq-preview-tag {
  background: rgba(162, 132, 203, 0.15);
  border: 1px solid rgba(162, 132, 203, 0.32);
  color: #baa0d9;
  font-size: 0.74rem;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 30px;
  letter-spacing: 0.2px;
}

.bq-preview-open-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 36px;
  background: linear-gradient(135deg, #A284CB, #baa0d9);
  border: none;
  border-radius: 10px;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.3px;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.2s;
  box-shadow: 0 4px 20px rgba(162, 132, 203, 0.42);
  margin-top: 6px;
}

.bq-preview-open-btn:hover {
  opacity: 0.9;
  transform: translateY(-2px);
  color: #fff;
}

.bq-preview-hint {
  font-size: 0.76rem;
  color: rgba(162, 132, 203, 0.45);
  margin: 0;
  letter-spacing: 0.2px;
}

@media (max-width: 767px) {
  .bq-preview-modal        { padding: 16px 12px; }
  .bq-preview-modal-label  { display: none; }
  .bq-preview-nav-counter  { display: none; }
  .bq-preview-body         { padding: 28px 20px 32px; }
  .bq-preview-card-name    { font-size: 1.4rem; }
}




.widget-1f5975 .copyright {
    font-size: 13px;
    display: flex;
    text-align: left;
    justify-content: flex-start;
}