/* MyAnatomy Landing — Pure CSS replica */
/* Fonts loaded via <link> in demo-booking/index.html to avoid @import render blocking */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg: #fcfbfe;
  --fg: #1a1f36;
  --muted: #6b7280;
  --brand: #6421bf;
  --brand-magenta: #aa24c5;
  --brand-text: #4a07a6;
  --brand-soft: #faf6ff;
  --ring: #efe6ff;
  --gradient-brand: linear-gradient(127deg, rgb(100, 33, 191) 0%, rgb(170, 36, 197) 100%);
  --gradient-brand-text: linear-gradient(166deg, rgb(100, 33, 191) 0%, rgb(201, 48, 194) 100%);
  --gradient-sidebar: linear-gradient(159deg, rgb(26, 10, 61) 3.67%, rgb(15, 6, 40) 96.33%);
  --gradient-sidebar-active: linear-gradient(169deg, rgb(100, 33, 191) 0%, rgb(139, 71, 224) 100%);
  --gradient-progress: linear-gradient(91deg, #6421bf 0%, #aa24c5 100%);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --container: 80rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-2xl: 1.75rem;
  --radius-3xl: 2rem;
}

html { scroll-behavior: smooth; }
html:has(body.demo-booking-page) {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}
body.demo-booking-page {
  margin: 0;
  padding-top: 80px;
  font-family: "Inter", system-ui, sans-serif;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.5;
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}.demo-booking-page main.dbl-main h1, .demo-booking-page main.dbl-main h2, .demo-booking-page main.dbl-main h3, .demo-booking-page main.dbl-main h4{ font-family: "Plus Jakarta Sans", "Inter", sans-serif; letter-spacing: -0.02em; }.demo-booking-page main.dbl-main a{ color: inherit; text-decoration: none; }.demo-booking-page main.dbl-main button{ font: inherit; border: none; background: none; cursor: pointer; }.demo-booking-page main.dbl-main img, .demo-booking-page main.dbl-main svg{ display: block; max-width: 100%; }.demo-booking-page main.dbl-main .container{ width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: 1rem; }
@media (min-width: 640px) {.demo-booking-page main.dbl-main .container{ padding-inline: 1.5rem; } }.demo-booking-page main.dbl-main .section{ padding-block: 4rem; }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .section{ padding-block: 6rem; } }.demo-booking-page main.dbl-main .text-gradient{
  background-image: var(--gradient-brand-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}.demo-booking-page main.dbl-main .bg-gradient-brand{ background-image: var(--gradient-brand); }.demo-booking-page main.dbl-main .bg-gradient-progress{ background-image: var(--gradient-progress); }.demo-booking-page main.dbl-main .section-badge{
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 1rem; border-radius: 9999px;
  background: var(--brand-soft); color: var(--brand-text);
  font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em;
  box-shadow: 0 0 0 1px var(--ring);
}.demo-booking-page main.dbl-main .section-badge svg{ width: 0.875rem; height: 0.875rem; }.demo-booking-page main.dbl-main .section-heading{ text-align: center; max-width: 48rem; margin-inline: auto; }.demo-booking-page main.dbl-main .section-heading h2{
  font-size: clamp(1.875rem, 4vw, 3.75rem);
  font-weight: 800; line-height: 1.1;
}.demo-booking-page main.dbl-main .section-heading p{
  margin-top: 1rem; font-size: clamp(1rem, 2vw, 1.125rem);
  color: var(--muted); max-width: 42rem; margin-inline: auto;
}.demo-booking-page main.dbl-main .section-header{ display: flex; flex-direction: column; align-items: center; gap: 1rem; }.demo-booking-page main.dbl-main .reveal{
  opacity: 0;
  transform: translateY(var(--reveal-y, 28px));
  transition:
    opacity 0.65s var(--ease-out),
    transform 0.65s var(--ease-out);
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform;
}.demo-booking-page main.dbl-main .reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}.demo-booking-page main.dbl-main .reveal--sm{ --reveal-y: 20px; }.demo-booking-page main.dbl-main .reveal--xs{ --reveal-y: 16px; }.demo-booking-page main.dbl-main .book-demo.reveal{ transform: translateY(30px); }.demo-booking-page main.dbl-main .book-demo.reveal.is-visible{ transform: translateY(0); }.demo-booking-page main.dbl-main .hero{ position: relative; overflow: hidden; }.demo-booking-page main.dbl-main .hero__bg{
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(to bottom, #f5f0ff, var(--bg) 60%);
}.demo-booking-page main.dbl-main .hero__grid{
  display: grid; gap: 2.5rem; padding-block: 4rem 3rem;
}
@media (min-width: 768px) {.demo-booking-page main.dbl-main .hero__grid{ grid-template-columns: 1fr 1fr; align-items: center; padding-top: 7rem; }
}.demo-booking-page main.dbl-main .hero__content{ animation: fadeUp 0.7s var(--ease-out) both; }.demo-booking-page main.dbl-main .hero__visual{
  animation: fadeUpRotate 0.9s 0.1s var(--ease-out) both;
  width: 100%;
  overflow: hidden;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeUpRotate {
  from { opacity: 0; transform: translateY(30px) rotate(-2deg); }
  to { opacity: 1; transform: translateY(0) rotate(-4deg); }
}.demo-booking-page main.dbl-main .hero h1{
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  font-weight: 800; line-height: 1.08; margin-top: 0;
}.demo-booking-page main.dbl-main .hero__sub{ margin-top: 1.25rem; max-width: 36rem; color: var(--muted); font-size: clamp(1rem, 2vw, 1.125rem); }.demo-booking-page main.dbl-main .hero__cta{ margin-top: 2rem; display: flex; flex-direction: column; gap: 0.75rem; }
@media (min-width: 640px) {.demo-booking-page main.dbl-main .hero__cta{ flex-direction: row; flex-wrap: wrap; align-items: center; } }.demo-booking-page main.dbl-main .btn-primary{
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  padding: 0.875rem 1.5rem; border-radius: 9999px;
  background-image: var(--gradient-brand); color: white;
  font-size: 0.875rem; font-weight: 600;
  box-shadow: 0 10px 15px -3px rgba(139, 92, 246, 0.3);
  transition: transform 0.2s;
}.demo-booking-page main.dbl-main .btn-primary:hover{ transform: scale(1.02); }.demo-booking-page main.dbl-main .btn-secondary{
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  padding: 0.875rem 1.5rem; border-radius: 9999px;
  background: white; color: var(--brand);
  font-size: 0.875rem; font-weight: 600;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.05);
  transition: background 0.2s;
}.demo-booking-page main.dbl-main .btn-secondary:hover{ background: var(--brand-soft); }.demo-booking-page main.dbl-main .hero__stats{ margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; align-items: flex-end; }.demo-booking-page main.dbl-main .hero__stat-value{ font-size: 1.875rem; font-weight: 800; }.demo-booking-page main.dbl-main .hero__stat-label{ margin-top: 0.25rem; font-size: 0.875rem; color: var(--muted); }.demo-booking-page main.dbl-main .dashboard-scaler{ width: 100%; overflow: hidden; }.demo-booking-page main.dbl-main .dashboard-scaler__inner{ position: relative; margin-inline: auto; overflow: hidden; }.demo-booking-page main.dbl-main .dashboard-scaler__frame{
  position: absolute; top: 0; left: 50%;
  width: 1180px; transform-origin: top center;
}.demo-booking-page main.dbl-main .dashboard{
  display: flex; overflow: hidden; border-radius: var(--radius-lg);
  background: #f4f2fa;
  box-shadow: 0 4px 4px #efe6ff, 0 28px 56px rgba(136,67,219,0.2);
  outline: 1px solid var(--ring);
}.demo-booking-page main.dbl-main .dashboard__inner{ display: flex; width: 100%; border-radius: var(--radius-lg); overflow: hidden; background: #f3f0fa; }.demo-booking-page main.dbl-main .dashboard__sidebar{
  width: 13rem; flex-shrink: 0; padding: 1.25rem;
  border-right: 1px solid rgba(255,255,255,0.07);
  background-image: var(--gradient-sidebar); color: white;
}.demo-booking-page main.dbl-main .dashboard__logo{ display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; }.demo-booking-page main.dbl-main .dashboard__logo-icon{
  width: 2rem; height: 2rem; display: grid; place-items: center;
  border-radius: 0.5rem; background-image: var(--gradient-sidebar-active);
  font-size: 0.875rem; font-weight: 700;
}.demo-booking-page main.dbl-main .dashboard__nav{ display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.875rem; }.demo-booking-page main.dbl-main .dashboard__nav-item{
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.5rem 0.75rem; border-radius: 0.375rem; color: rgba(255,255,255,0.5);
}.demo-booking-page main.dbl-main .dashboard__nav-item--active{
  background-image: var(--gradient-sidebar-active); color: white;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.2);
}.demo-booking-page main.dbl-main .dashboard__badge{ background: #e03b5a; border-radius: 9999px; padding: 0 0.375rem; font-size: 10px; font-weight: 600; }.demo-booking-page main.dbl-main .dashboard__user{
  margin-top: 2rem; display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem; border-radius: 0.5rem; background: rgba(255,255,255,0.05);
}.demo-booking-page main.dbl-main .dashboard__avatar{
  width: 2rem; height: 2rem; border-radius: 9999px;
  background-image: var(--gradient-progress);
  outline: 1px solid rgba(173,70,255,0.4);
}.demo-booking-page main.dbl-main .dashboard__main{ flex: 1; background: white; padding: 1.5rem; color: #1a0a3d; }.demo-booking-page main.dbl-main .dashboard__header{
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 1rem; margin-bottom: 1.25rem;
  border-bottom: 1px solid rgba(243,232,255,0.6);
}.demo-booking-page main.dbl-main .dashboard__kpis{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; }.demo-booking-page main.dbl-main .dashboard__kpi{
  padding: 0.75rem; border-radius: 0.75rem;
  border: 1px solid rgba(243,232,255,0.5); background: white; box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}.demo-booking-page main.dbl-main .dashboard__panel{
  margin-top: 1.25rem; padding: 1rem; border-radius: 0.75rem;
  border: 1px solid rgba(243,232,255,0.5); background: white; box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}.demo-booking-page main.dbl-main .dashboard__table-head{
  display: grid; grid-template-columns: 1.4fr 0.8fr 0.6fr 0.6fr 0.7fr;
  gap: 0.5rem; padding: 0 0.5rem; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.05em; color: rgba(26,10,61,0.4);
}.demo-booking-page main.dbl-main .dashboard__row{
  display: grid; grid-template-columns: 1.4fr 0.8fr 0.6fr 0.6fr 0.7fr;
  align-items: center; gap: 0.5rem; padding: 0.5rem; margin-top: 0.5rem;
  border-radius: 0.5rem; border: 1px solid rgba(243,232,255,0.4);
  background: rgba(250,245,255,0.7); font-size: 0.75rem;
}.demo-booking-page main.dbl-main .match-bar{ height: 6px; flex: 1; border-radius: 9999px; background: #f3e8ff; overflow: hidden; }.demo-booking-page main.dbl-main .match-bar__fill{ height: 100%; background-image: var(--gradient-progress); }.demo-booking-page main.dbl-main .status-pill{ border-radius: 9999px; padding: 0.125rem 0.5rem; font-size: 10px; font-weight: 600; }.demo-booking-page main.dbl-main .status-pill--strong{ background: #ecfdf5; color: #009966; }.demo-booking-page main.dbl-main .status-pill--good{ background: #f5f3ff; color: #6421bf; }.demo-booking-page main.dbl-main .status-pill--fair{ background: #fffbeb; color: #b45309; }.demo-booking-page main.dbl-main .marquee-wrap{ overflow: hidden; }.demo-booking-page main.dbl-main .marquee-wrap:hover .marquee-track{ animation-play-state: paused; }.demo-booking-page main.dbl-main .marquee-track{
  display: flex; width: max-content; gap: 3rem;
  animation: marquee var(--marquee-dur, 40s) linear infinite;
}.demo-booking-page main.dbl-main .marquee-track > .marquee-group{ display: flex; gap: 3rem; flex-shrink: 0; align-items: center; }
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}.demo-booking-page main.dbl-main .logo-marquee{ border-block: 1px solid rgba(0,0,0,0.05); padding-block: 2rem; }.demo-booking-page main.dbl-main .logo-marquee p{ text-align: center; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; color: var(--muted); padding-inline: 1rem; }.demo-booking-page main.dbl-main .logo-item{ font-size: 1.5rem; font-weight: 700; color: rgba(26,31,54,0.7); white-space: nowrap; }.demo-booking-page main.dbl-main .problems-grid{
  margin-top: 2.5rem;
  display: grid; grid-template-columns: 1fr; gap: 1rem;
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .problems-grid{ grid-template-columns: repeat(2, 1fr); gap: 1.25rem; } }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .problems-grid{ grid-template-columns: repeat(4, 1fr); } }.demo-booking-page main.dbl-main .problem-card{
  position: relative; overflow: hidden; text-align: left;
  padding: 1.25rem; border-radius: var(--radius-lg);
  background: white; outline: 1px solid var(--ring);
  transition: outline-color 0.3s, box-shadow 0.3s, grid-column 0.5s var(--ease-out);
}.demo-booking-page main.dbl-main .problem-card:hover{ outline-color: #e8dbff; }.demo-booking-page main.dbl-main .problem-card.is-active{
  background: linear-gradient(to bottom right, #f9f7ff, white);
  outline-color: rgba(232,219,255,0.6);
  box-shadow: 0 4px 30px -10px rgba(136,67,219,0.25);
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .problem-card.is-active{ grid-column: span 2; } }.demo-booking-page main.dbl-main .problem-card__bar{
  position: absolute; inset-inline: 0; top: 0; height: 2px;
  background-image: var(--gradient-brand);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.4s var(--ease-out);
}.demo-booking-page main.dbl-main .problem-card.is-active .problem-card__bar{ transform: scaleX(1); }.demo-booking-page main.dbl-main .problem-card__icon{
  width: 2.75rem; height: 2.75rem; display: grid; place-items: center;
  border-radius: 0.75rem; background-image: var(--gradient-brand); color: white;
  margin-bottom: 1.25rem;
}.demo-booking-page main.dbl-main .problem-card__icon svg{ width: 1.25rem; height: 1.25rem; }.demo-booking-page main.dbl-main .problem-card__num{ font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--brand); }.demo-booking-page main.dbl-main .problem-card__title{ margin-top: 0.5rem; font-size: 15px; font-weight: 600; line-height: 1.35; }.demo-booking-page main.dbl-main .problem-card__solution{
  margin-top: 0.75rem; padding-left: 0.75rem;
  border-left: 4px solid var(--brand);
  font-size: 0.875rem; font-weight: 500; color: var(--brand);
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height 0.4s var(--ease-out), opacity 0.4s var(--ease-out), margin 0.4s;
}.demo-booking-page main.dbl-main .problem-card.is-active .problem-card__solution{ max-height: 120px; opacity: 1; }.demo-booking-page main.dbl-main .roi-card{
  margin-top: 2.5rem; overflow: hidden; border-radius: var(--radius-2xl);
  background: white;
  box-shadow: 0 0 0 1px var(--ring), 0 25px 50px -12px rgba(136,67,219,0.2);
  display: grid;
}
@media (min-width: 768px) {.demo-booking-page main.dbl-main .roi-card{ grid-template-columns: 1.2fr 1fr; border-radius: var(--radius-3xl); } }.demo-booking-page main.dbl-main .roi-sliders{ padding: 1.25rem; display: flex; flex-direction: column; gap: 1.5rem; }
@media (min-width: 640px) {.demo-booking-page main.dbl-main .roi-sliders{ padding: 2rem; gap: 2rem; } }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .roi-sliders{ padding: 2.5rem; } }.demo-booking-page main.dbl-main .roi-slider-group label{ display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 0.75rem; font-size: 0.875rem; color: rgba(26,31,54,0.8); }.demo-booking-page main.dbl-main .roi-slider-value{
  min-width: 90px; text-align: center; padding: 0.25rem 0.75rem;
  border-radius: 9999px; background: var(--brand-soft); color: var(--brand-text);
  font-size: 0.75rem; font-weight: 600; outline: 1px solid var(--ring);
}.demo-booking-page main.dbl-main .roi-slider{
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 10px; border-radius: 9999px; outline: none; cursor: pointer;
}.demo-booking-page main.dbl-main .roi-slider::-webkit-slider-thumb{
  -webkit-appearance: none; width: 16px; height: 16px; border-radius: 9999px;
  background: white; border: 2px solid #6d28cd;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  cursor: pointer;
}.demo-booking-page main.dbl-main .roi-slider::-moz-range-thumb{
  width: 16px; height: 16px; border-radius: 9999px;
  background: white; border: 2px solid #6d28cd; cursor: pointer;
}.demo-booking-page main.dbl-main .roi-disclaimer{
  padding-top: 1.5rem; border-top: 1px solid rgba(0,0,0,0.05);
  text-align: center; font-size: 0.75rem; color: var(--muted);
}.demo-booking-page main.dbl-main .roi-result{
  position: relative; overflow: hidden; min-height: 320px;
  padding: 1.5rem; color: white; background-image: var(--gradient-brand);
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .roi-result{ padding: 2rem; min-height: auto; } }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .roi-result{ padding: 2.5rem; } }.demo-booking-page main.dbl-main .roi-glow-dot{
  position: absolute; border-radius: 9999px; background: white; pointer-events: none;
  animation: roiDotPulse var(--dot-dur, 3s) var(--ease-out) infinite;
  animation-delay: var(--dot-delay, 0s);
  opacity: 0.08;
}
@keyframes roiDotPulse {
  0%, 100% { transform: scale(0.6); opacity: 0.08; box-shadow: 0 0 0 rgba(255,255,255,0); }
  50% { transform: scale(1.8); opacity: var(--dot-peak, 0.7); box-shadow: 0 0 var(--dot-glow, 12px) var(--dot-size, 4px) rgba(255,255,255,0.5); }
}.demo-booking-page main.dbl-main .roi-result__content{ position: relative; }.demo-booking-page main.dbl-main .roi-result__days{ font-size: clamp(2.25rem, 5vw, 3rem); font-weight: 800; text-align: center; margin-top: 0.5rem; }.demo-booking-page main.dbl-main .roi-result__label{ text-align: center; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; opacity: 0.7; margin-top: 0.25rem; }.demo-booking-page main.dbl-main .roi-result__amount{ text-align: center; font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: 800; margin-top: 1.5rem; }.demo-booking-page main.dbl-main .roi-result__box{
  margin-top: 1.25rem; padding: 1rem; border-radius: 22px;
  background: rgba(255,255,255,0.15); outline: 1px solid rgba(255,255,255,0.3);
  backdrop-filter: blur(4px);
}.demo-booking-page main.dbl-main .roi-result__cta{
  display: flex; justify-content: center; align-items: center;
  margin-top: 1.25rem; padding: 0.75rem; border-radius: 9999px;
  background: white; color: var(--brand-text); font-size: 0.875rem; font-weight: 600;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
}.demo-booking-page main.dbl-main .roi-stats{
  margin-top: 2.5rem; display: grid; gap: 1rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .roi-stats{ grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {.demo-booking-page main.dbl-main .roi-stats{ grid-template-columns: repeat(4, 1fr); } }.demo-booking-page main.dbl-main .roi-stat-tile{
  padding: 1.5rem; border-radius: var(--radius-lg); text-align: center;
  background: linear-gradient(to bottom right, rgba(250,246,255,0.6), white);
  outline: 1px solid var(--ring);
}.demo-booking-page main.dbl-main .roi-stat-tile__value{ font-size: 2.25rem; font-weight: 800; }.demo-booking-page main.dbl-main .roi-stat-tile__label{ margin-top: 0.25rem; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }.demo-booking-page main.dbl-main .testimonial-card{
  width: min(360px, 85vw); flex-shrink: 0; padding: 1.25rem;
  border-radius: var(--radius-lg); outline: 1px solid var(--ring);
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .testimonial-card{ width: 360px; padding: 1.5rem; } }.demo-booking-page main.dbl-main .testimonial-card__quote{ width: 1.5rem; height: 1.5rem; color: rgba(100,33,191,0.4); }.demo-booking-page main.dbl-main .testimonial-card__text{ margin-top: 0.75rem; font-size: 0.875rem; line-height: 1.6; color: rgba(26,31,54,0.8); }.demo-booking-page main.dbl-main .testimonial-card__footer{
  margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid rgba(0,0,0,0.05);
  display: flex; justify-content: space-between; align-items: center;
}.demo-booking-page main.dbl-main .testimonial-card__avatar{
  width: 2rem; height: 2rem; display: grid; place-items: center;
  border-radius: 0.375rem; background-image: var(--gradient-brand);
  color: white; font-size: 0.75rem; font-weight: 700;
}.demo-booking-page main.dbl-main .testimonial-card__who{ display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; font-weight: 600; }.demo-booking-page main.dbl-main .stars{ display: flex; gap: 2px; color: #fbbf24; }.demo-booking-page main.dbl-main .stars svg{ width: 0.875rem; height: 0.875rem; fill: currentColor; }.demo-booking-page main.dbl-main .hiw-steps{ position: relative; margin-top: 3.5rem; }.demo-booking-page main.dbl-main .hiw-steps__line{
  display: none; position: absolute; left: 0; right: 0; top: 1.75rem; height: 1px;
  background: linear-gradient(to right, transparent, rgba(0,0,0,0.1), transparent);
}
@media (min-width: 768px) {.demo-booking-page main.dbl-main .hiw-steps__line{ display: block; } }.demo-booking-page main.dbl-main .hiw-steps__grid{
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem;
}
@media (min-width: 768px) {.demo-booking-page main.dbl-main .hiw-steps__grid{ grid-template-columns: repeat(5, 1fr); } }.demo-booking-page main.dbl-main .hiw-step-btn{ display: flex; flex-direction: column; align-items: center; text-align: center; cursor: pointer; }.demo-booking-page main.dbl-main .hiw-step-num{
  width: 3.5rem; height: 3.5rem; display: grid; place-items: center;
  border-radius: var(--radius-lg); font-size: 1.125rem; font-weight: 700;
  background: white; color: rgba(26,31,54,0.3); outline: 1px solid rgba(0,0,0,0.1);
  transition: transform 0.3s var(--ease-out), background 0.3s, color 0.3s, box-shadow 0.3s;
}.demo-booking-page main.dbl-main .hiw-step-btn.is-active .hiw-step-num{
  transform: scale(1.1);
  background-image: var(--gradient-brand); color: white; outline: none;
  box-shadow: 0 10px 15px -3px rgba(139,92,246,0.3);
}.demo-booking-page main.dbl-main .hiw-step-label{ margin-top: 0.75rem; font-size: 0.75rem; font-weight: 600; color: var(--muted); }.demo-booking-page main.dbl-main .hiw-step-btn.is-active .hiw-step-label{ color: var(--brand); }.demo-booking-page main.dbl-main .hiw-detail{ margin-top: 3rem; display: grid; gap: 1.5rem; }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .hiw-detail{ grid-template-columns: 1fr 1fr; } }.demo-booking-page main.dbl-main .hiw-card{
  padding: 1.5rem; border-radius: var(--radius-3xl); background: white;
  transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out);
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .hiw-card{ padding: 2rem; } }.demo-booking-page main.dbl-main .hiw-card--left{ outline: 1px solid rgba(0,0,0,0.05); }.demo-booking-page main.dbl-main .hiw-card--right{
  outline: 2px solid rgba(100,33,191,0.4);
  box-shadow: 0 4px 40px -10px rgba(136,67,219,0.3);
}.demo-booking-page main.dbl-main .hiw-card.is-exiting{ opacity: 0; transform: translateX(-20px); }.demo-booking-page main.dbl-main .hiw-card--right.is-exiting{ transform: translateX(20px); }.demo-booking-page main.dbl-main .hiw-card.is-entering{ opacity: 0; }.demo-booking-page main.dbl-main .hiw-card__icon{
  width: 3.5rem; height: 3.5rem; display: grid; place-items: center;
  border-radius: var(--radius-lg); background-image: var(--gradient-brand); color: white;
}.demo-booking-page main.dbl-main .hiw-card__icon svg{ width: 1.5rem; height: 1.5rem; }.demo-booking-page main.dbl-main .hiw-card__step{ margin-top: 1.5rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--brand); }.demo-booking-page main.dbl-main .hiw-card h3{ margin-top: 0.5rem; font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: 800; }.demo-booking-page main.dbl-main .hiw-card__desc{ margin-top: 1rem; color: rgba(26,31,54,0.7); max-width: 28rem; }.demo-booking-page main.dbl-main .hiw-card__time{
  display: inline-flex; align-items: baseline; gap: 0.75rem;
  margin-top: 2rem; padding: 0.75rem 1.25rem; border-radius: var(--radius-lg);
  background: var(--brand-soft);
}.demo-booking-page main.dbl-main .hiw-card__time-value{ font-size: 1.875rem; font-weight: 800; }.demo-booking-page main.dbl-main .hiw-card__time-meta{ font-size: 0.75rem; color: rgba(26,31,54,0.6); }.demo-booking-page main.dbl-main .progress-bar{ margin-bottom: 0.25rem; }.demo-booking-page main.dbl-main .progress-bar__head{ display: flex; justify-content: space-between; font-size: 10px; color: rgba(26,31,54,0.6); margin-bottom: 0.375rem; }.demo-booking-page main.dbl-main .progress-bar__track{ height: 8px; border-radius: 9999px; background: var(--brand-soft); overflow: hidden; }.demo-booking-page main.dbl-main .progress-bar__fill{
  height: 100%; border-radius: 9999px; background-image: var(--gradient-progress);
  width: 0; transition: width 1.4s var(--ease-out);
}.demo-booking-page main.dbl-main .hiw-preview__header{ display: flex; justify-content: space-between; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: rgba(26,31,54,0.6); }.demo-booking-page main.dbl-main .hiw-preview__box{ margin-top: 1rem; padding: 1.25rem; border-radius: var(--radius-lg); border: 1px solid var(--ring); background: rgba(250,246,255,0.4); }.demo-booking-page main.dbl-main .hiw-preview__box--dashed{ border: 2px dashed rgba(0,0,0,0.1); background: transparent; }.demo-booking-page main.dbl-main .hiw-tag{ display: inline-block; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 500; }.demo-booking-page main.dbl-main .hiw-tag--primary{ background-image: var(--gradient-progress); color: white; }.demo-booking-page main.dbl-main .hiw-tag--soft{ background: var(--brand-soft); color: var(--brand-text); outline: 1px solid var(--ring); }.demo-booking-page main.dbl-main .hiw-tags{ display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }.demo-booking-page main.dbl-main .status-chip{ border-radius: 9999px; padding: 0.25rem 0.5rem; font-size: 10px; }.demo-booking-page main.dbl-main .status-chip--green{ background: #d1fae5; color: #047857; }.demo-booking-page main.dbl-main .status-chip--brand{ color: var(--brand); }.demo-booking-page main.dbl-main .compare-mobile{ margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1024px) {.demo-booking-page main.dbl-main .compare-mobile{ display: none; } }.demo-booking-page main.dbl-main .compare-mobile-card{
  padding: 1rem; border-radius: var(--radius-lg);
  border: 1px solid var(--ring); background: white; box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}.demo-booking-page main.dbl-main .compare-mobile-card.is-highlight{ outline: 1px solid #e8dbff; }.demo-booking-page main.dbl-main .compare-desktop{
  display: none; position: relative; margin-top: 2.5rem; max-width: 1212px;
  margin-inline: auto; overflow: hidden; border-radius: 26px; background: white;
  box-shadow: 0 0 0 1px var(--ring), 0 25px 50px -12px rgba(136,67,219,0.2);
}
@media (min-width: 1024px) {.demo-booking-page main.dbl-main .compare-desktop{ display: block; } }.demo-booking-page main.dbl-main .compare-desktop__glow{
  position: absolute; z-index: 1; pointer-events: none;
  left: 47%; top: 12px; bottom: 12px; width: 27%;
  transform: translateX(-8%); border-radius: 26px;
  background: linear-gradient(to bottom, #f5d5ff, #fff1f2);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.6);
}.demo-booking-page main.dbl-main .compare-row{
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: 1rem 1.5rem;
}.demo-booking-page main.dbl-main .compare-row:not(:last-child){ border-bottom: 1px solid rgba(239,230,255,0.6); }.demo-booking-page main.dbl-main .compare-row.is-highlight{ background: rgba(250,246,255,0.4); }.demo-booking-page main.dbl-main .compare-header{ border-bottom: 1px solid var(--ring); background: linear-gradient(to right, var(--brand-soft), white, var(--brand-soft)); }.demo-booking-page main.dbl-main .compare-col{ flex-shrink: 0; }.demo-booking-page main.dbl-main .compare-col--factor{ width: 15%; min-width: 100px; }.demo-booking-page main.dbl-main .compare-col--trad{ width: 23%; min-width: 140px; }.demo-booking-page main.dbl-main .compare-col--ma{ width: 23%; min-width: 140px; padding-right: 1.5rem; }.demo-booking-page main.dbl-main .compare-col--diff{ width: 20%; min-width: 120px; }.demo-booking-page main.dbl-main .compare-th{ font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; }.demo-booking-page main.dbl-main .compare-th--muted{ color: #626079; }.demo-booking-page main.dbl-main .compare-th--trad{ color: #ec003f; }.demo-booking-page main.dbl-main .compare-th--ma{ color: var(--brand-text); }.demo-booking-page main.dbl-main .diff-badge{
  display: inline-block; padding: 0.25rem 0.75rem; border-radius: 9999px;
  font-size: 0.75rem; font-weight: 700;
}.demo-booking-page main.dbl-main .diff-badge--highlight{ background-image: var(--gradient-brand); color: white; box-shadow: 0 4px 6px -1px rgba(136,67,219,0.2); }.demo-booking-page main.dbl-main .diff-badge--soft{ background: var(--brand-soft); color: var(--brand-text); outline: 1px solid var(--ring); }.demo-booking-page main.dbl-main .ma-check{
  display: inline-grid; place-items: center; width: 1rem; height: 1rem; flex-shrink: 0;
  margin-top: 2px; border-radius: 9999px; background: rgba(255,255,255,0.8);
  outline: 1px solid rgba(100,33,191,0.4);
}.demo-booking-page main.dbl-main .ma-check svg{ width: 10px; height: 10px; color: var(--brand); }.demo-booking-page main.dbl-main .trad-dot{ width: 6px; height: 6px; border-radius: 9999px; background: #ff637e; flex-shrink: 0; margin-top: 6px; }.demo-booking-page main.dbl-main .compare-ma-box{
  margin-top: 0.75rem; padding: 0.75rem; border-radius: 0.75rem;
  background: linear-gradient(to bottom, #f5d5ff, #fff1f2); outline: 1px solid rgba(255,255,255,0.6);
}.demo-booking-page main.dbl-main .faq-section{ background: #f7f5fc; }.demo-booking-page main.dbl-main .faq-list{ margin-top: 3rem; display: flex; flex-direction: column; gap: 0.75rem; max-width: 56rem; margin-inline: auto; }.demo-booking-page main.dbl-main .faq-item{
  overflow: hidden; border-radius: var(--radius-lg); background: white;
  outline: 1px solid rgba(0,0,0,0.05); transition: box-shadow 0.3s, outline-color 0.3s;
}.demo-booking-page main.dbl-main .faq-item.is-open{ outline-color: rgba(100,33,191,0.6); box-shadow: 0 10px 15px -3px rgba(139,92,246,0.05); }.demo-booking-page main.dbl-main .faq-trigger{
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; padding: 1.25rem 1.5rem; text-align: left; cursor: pointer;
  transition: background 0.2s;
}.demo-booking-page main.dbl-main .faq-trigger:hover{ background: rgba(250,246,255,0.4); }.demo-booking-page main.dbl-main .faq-trigger span:first-child{ font-size: 1rem; font-weight: 600; }.demo-booking-page main.dbl-main .faq-icon-wrap{
  width: 1.75rem; height: 1.75rem; flex-shrink: 0;
  display: grid; place-items: center; border-radius: 9999px;
  background: var(--brand-soft); color: var(--brand);
  transition: background 0.3s, color 0.3s, transform 0.25s var(--ease-out);
}.demo-booking-page main.dbl-main .faq-item.is-open .faq-icon-wrap{ background: var(--brand); color: white; transform: rotate(45deg); }.demo-booking-page main.dbl-main .faq-icon-wrap svg{ width: 1rem; height: 1rem; }.demo-booking-page main.dbl-main .faq-body{
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height 0.35s var(--ease-out), opacity 0.35s var(--ease-out);
}.demo-booking-page main.dbl-main .faq-item.is-open .faq-body{ opacity: 1; }.demo-booking-page main.dbl-main .faq-body p{ padding: 0 1.5rem 1.25rem; font-size: 0.875rem; line-height: 1.6; color: rgba(26,31,54,0.7); }.demo-booking-page main.dbl-main .book-demo-wrap{ padding-inline: 1rem; }
@media (min-width: 640px) {.demo-booking-page main.dbl-main .book-demo-wrap{ padding-inline: 1.5rem; } }.demo-booking-page main.dbl-main .book-demo{
  position: relative; overflow: hidden; max-width: var(--container); margin-inline: auto;
  padding: 1.5rem; border-radius: 1.5rem; color: white;
  background-image: var(--gradient-brand);
  box-shadow: 0 30px 60px -30px rgba(100,33,191,0.6);
  display: grid; gap: 2rem;
}
@media (min-width: 640px) {.demo-booking-page main.dbl-main .book-demo{ padding: 2.5rem; border-radius: 2rem; gap: 2.5rem; } }
@media (min-width: 768px) {.demo-booking-page main.dbl-main .book-demo{ grid-template-columns: 1fr 1fr; padding: 4rem; } }.demo-booking-page main.dbl-main .book-demo__blur{
  position: absolute; right: -5rem; top: -5rem; width: 20rem; height: 20rem;
  border-radius: 9999px; background: rgba(255,255,255,0.1); filter: blur(48px);
}.demo-booking-page main.dbl-main .book-demo__badge{
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 1rem; border-radius: 9999px;
  background: rgba(255,255,255,0.15); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em; backdrop-filter: blur(4px);
}.demo-booking-page main.dbl-main .book-demo h2{ margin-top: 1.5rem; font-size: clamp(1.875rem, 4vw, 3rem); font-weight: 800; line-height: 1.15; }.demo-booking-page main.dbl-main .book-demo__highlight{
  background: linear-gradient(to right, white, #fbcfe8);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}.demo-booking-page main.dbl-main .book-demo__sub{ margin-top: 1.5rem; max-width: 28rem; color: rgba(255,255,255,0.85); }.demo-booking-page main.dbl-main .book-demo__meta{ margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1.5rem; font-size: 0.875rem; color: rgba(255,255,255,0.85); }.demo-booking-page main.dbl-main .book-demo__meta span{ display: inline-flex; align-items: center; gap: 0.5rem; }.demo-booking-page main.dbl-main .book-demo__form{
  position: relative; padding: 1.75rem; border-radius: var(--radius-lg);
  background: white; color: var(--fg); box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
}.demo-booking-page main.dbl-main .book-demo__form h3{ font-size: 1.125rem; font-weight: 700; }.demo-booking-page main.dbl-main .book-demo__form-sub{ font-size: 0.75rem; color: var(--muted); }.demo-booking-page main.dbl-main .book-demo__form-head{ display: flex; align-items: center; gap: 0.75rem; }.demo-booking-page main.dbl-main .book-demo__form-icon{
  width: 2.75rem; height: 2.75rem; display: grid; place-items: center;
  border-radius: 0.75rem; background-image: var(--gradient-brand); color: white;
}.demo-booking-page main.dbl-main .book-demo__fields{ margin-top: 1.5rem; display: grid; gap: 1rem; }
@media (min-width: 640px) {.demo-booking-page main.dbl-main .book-demo__fields{ grid-template-columns: 1fr 1fr; } }.demo-booking-page main.dbl-main .book-demo__fields label{ display: block; font-size: 0.75rem; font-weight: 600; color: rgba(26,31,54,0.7); }.demo-booking-page main.dbl-main .book-demo__fields input{
  width: 100%; margin-top: 0.375rem; padding: 0.625rem 0.75rem;
  border-radius: 0.5rem; border: 1px solid rgba(0,0,0,0.1);
  font-size: 0.875rem; outline: none;
}.demo-booking-page main.dbl-main .book-demo__fields input:focus{ box-shadow: 0 0 0 2px rgba(100,33,191,0.3); }.demo-booking-page main.dbl-main .book-demo__submit{
  width: 100%; margin-top: 1.5rem; padding: 0.875rem;
  border-radius: 0.75rem; border: none; cursor: pointer;
  background-image: var(--gradient-brand); color: white;
  font-size: 0.875rem; font-weight: 600;
  box-shadow: 0 10px 15px -3px rgba(139,92,246,0.3);
  transition: transform 0.2s;
}.demo-booking-page main.dbl-main .book-demo__submit:hover{ transform: scale(1.01); }.demo-booking-page main.dbl-main .flex{ display: flex; }.demo-booking-page main.dbl-main .items-center{ align-items: center; }.demo-booking-page main.dbl-main .gap-2{ gap: 0.5rem; }.demo-booking-page main.dbl-main .text-xs{ font-size: 0.75rem; }.demo-booking-page main.dbl-main .text-sm{ font-size: 0.875rem; }.demo-booking-page main.dbl-main .font-semibold{ font-weight: 600; }.demo-booking-page main.dbl-main .font-extrabold{ font-weight: 800; }.demo-booking-page main.dbl-main .text-center{ text-align: center; }.demo-booking-page main.dbl-main .mt-3{ margin-top: 0.75rem; }.demo-booking-page main.dbl-main .mt-4{ margin-top: 1rem; }.demo-booking-page main.dbl-main .text-muted{ color: var(--muted); }.demo-booking-page main.dbl-main .text-brand{ color: var(--brand); }.demo-booking-page main.dbl-main .sr-only{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }


/* Site chrome overrides */
.demo-booking-page main.dbl-main {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.demo-booking-page main.dbl-main .hero,
.demo-booking-page main.dbl-main .hero__visual,
.demo-booking-page main.dbl-main .dashboard-scaler,
.demo-booking-page main.dbl-main .logo-marquee,
.demo-booking-page main.dbl-main .testimonials-marquee {
  max-width: 100%;
  overflow-x: clip;
}

.demo-booking-page main.dbl-main .marquee-wrap {
  max-width: 100%;
  overflow-x: clip;
}

.demo-booking-page main.dbl-main .marquee-track {
  contain: layout style paint;
}

.demo-booking-page ma-footer,
.demo-booking-page ma-header {
  display: block;
  width: 100%;
  max-width: 100%;
}

.demo-booking-page .site-footer {
  width: 100%;
  max-width: 100%;
}

.demo-booking-page main.dbl-main > .section {
  max-width: 100%;
  overflow-x: clip;
}

/* ─── UI fixes (steps, marquee, cards, book form) ─── */
.demo-booking-page main.dbl-main .relative {
  position: relative;
  z-index: 1;
}

.demo-booking-page main.dbl-main .dbl-card {
  border-radius: 26px;
  background: rgba(255, 255, 255, 0);
  box-shadow:
    0 0 0 1px #efe6ff,
    0 1px 3px 0 rgba(0, 0, 0, 0.1),
    0 1px 2px -1px rgba(0, 0, 0, 0.1);
}

/* How-it-works steps — remove square outline artifacts */
.demo-booking-page main.dbl-main .hiw-steps__grid {
  position: relative;
  z-index: 1;
}

.demo-booking-page main.dbl-main .hiw-steps__line {
  z-index: 0;
  pointer-events: none;
}

.demo-booking-page main.dbl-main .hiw-step-btn {
  position: relative;
  z-index: 1;
  cursor: pointer;
  border: none;
  background: none;
  padding: 0;
}

.demo-booking-page main.dbl-main .hiw-step-num {
  border-radius: 22px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  outline: none;
  box-shadow: none;
}

.demo-booking-page main.dbl-main .hiw-step-btn.is-active .hiw-step-num {
  border: none;
}

.demo-booking-page main.dbl-main .hiw-detail {
  align-items: stretch;
}

.demo-booking-page main.dbl-main .hiw-card {
  display: flex;
  flex-direction: column;
  border-radius: 26px;
  background: #fff;
  box-shadow:
    0 0 0 1px #efe6ff,
    0 25px 50px -12px rgba(136, 67, 219, 0.1);
  outline: none;
  height: 100%;
  align-self: stretch;
}

.demo-booking-page main.dbl-main .hiw-card--left,
.demo-booking-page main.dbl-main .hiw-card--right {
  padding: 2.5rem;
}

.demo-booking-page main.dbl-main .hiw-card--right {
  background: #fff;
  box-shadow:
    0 0 0 1px #efe6ff,
    0 25px 50px -12px rgba(136, 67, 219, 0.1),
    0 4px 40px -10px rgba(136, 67, 219, 0.12);
}

.demo-booking-page main.dbl-main .hiw-preview-inner {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  background: transparent;
  border-radius: 0;
  padding: 0;
}

.demo-booking-page main.dbl-main .hiw-card__head {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.demo-booking-page main.dbl-main .hiw-card__icon {
  width: 4rem;
  height: 4rem;
  border-radius: 22px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow:
    0 10px 15px -3px rgba(136, 67, 219, 0.3),
    0 4px 6px -4px rgba(136, 67, 219, 0.3);
}

.demo-booking-page main.dbl-main .hiw-card__icon svg {
  width: 1.75rem;
  height: 1.75rem;
}

.demo-booking-page main.dbl-main .hiw-card__step-meta {
  display: flex;
  flex-direction: column;
}

.demo-booking-page main.dbl-main .hiw-card__step {
  margin-top: 0;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #4a07a6;
}

.demo-booking-page main.dbl-main .hiw-card__step-of {
  font-size: 0.875rem;
  color: #626079;
  line-height: 1.25;
}

.demo-booking-page main.dbl-main .hiw-card h3 {
  margin-top: 1rem;
  color: #120e22;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  line-height: 1.25;
}

.demo-booking-page main.dbl-main .hiw-card__desc {
  color: #626079;
  font-size: 1.125rem;
  line-height: 1.62;
}

.demo-booking-page main.dbl-main .hiw-card__time {
  margin-top: auto;
  padding: 1rem 1.25rem;
  border-radius: 22px;
  background: #faf6ff;
  box-shadow: 0 0 0 1px #efe6ff;
}

.demo-booking-page main.dbl-main .hiw-card__time-meta {
  color: #626079;
}

.demo-booking-page main.dbl-main .hiw-preview__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #626079;
}

.demo-booking-page main.dbl-main .status-chip--green {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  background: #dcfce7;
  color: #008236;
  font-weight: 700;
  font-size: 0.625rem;
  padding: 0.25rem 0.625rem;
}

.demo-booking-page main.dbl-main .status-chip--brand {
  display: inline-flex;
  align-items: center;
  color: var(--brand);
  font-weight: 700;
  font-size: 0.625rem;
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  background: var(--brand-soft);
}

.demo-booking-page main.dbl-main .hiw-preview__box {
  margin-top: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 22px;
  border: 1px solid var(--ring);
  background: rgba(250, 246, 255, 0.4);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.demo-booking-page main.dbl-main .hiw-preview__box--dashed {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0.875rem 2.125rem;
  border: 1px dashed #e2e8f0;
  background: linear-gradient(159.6deg, rgba(250, 246, 255, 0.6) 0%, #fff 100%);
  justify-content: center;
}

.demo-booking-page main.dbl-main .hiw-preview__upload-row {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.demo-booking-page main.dbl-main .hiw-preview__pdf-thumb {
  flex-shrink: 0;
  transform: rotate(-4deg);
}

.demo-booking-page main.dbl-main .hiw-preview__pdf-icon {
  display: block;
  width: 64px;
  height: auto;
}

.demo-booking-page main.dbl-main .hiw-preview__upload-meta {
  flex: 1;
  min-width: 0;
}

.demo-booking-page main.dbl-main .hiw-preview__filename {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #120e22;
}

.demo-booking-page main.dbl-main .hiw-preview__file-icon {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .hiw-preview__file-meta {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  color: #626079;
  line-height: 1.5;
}

.demo-booking-page main.dbl-main .hiw-preview__progress-track {
  margin-top: 0.625rem;
  height: 6px;
  border-radius: 9999px;
  background: #efe6ff;
  overflow: hidden;
}

.demo-booking-page main.dbl-main .hiw-preview__progress-fill {
  height: 100%;
  border-radius: 9999px;
  background: linear-gradient(133.93deg, #6421bf 0%, #aa24c5 100%);
}

.demo-booking-page main.dbl-main .hiw-preview__progress-labels {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.25rem;
  font-size: 0.625rem;
  font-weight: 500;
}

.demo-booking-page main.dbl-main .hiw-preview__progress-labels span:first-child {
  color: #4a07a6;
}

.demo-booking-page main.dbl-main .hiw-preview__progress-labels span:last-child {
  color: #626079;
}

.demo-booking-page main.dbl-main .hiw-preview__drop-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.6875rem;
  color: #626079;
}

.demo-booking-page main.dbl-main .hiw-preview__upload-grey {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .hiw-preview__skills-label {
  margin-top: auto;
  padding-top: 1rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #626079;
}

.demo-booking-page main.dbl-main .hiw-preview__footnote {
  margin-top: auto;
  padding-top: 0.75rem;
  font-size: 0.6875rem;
  color: #626079;
}

.demo-booking-page main.dbl-main .hiw-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.5rem;
}

.demo-booking-page main.dbl-main .hiw-tag--primary {
  background: #6d28cd;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 600;
  box-shadow: 0 0 0 1px #6d28cd;
}

.demo-booking-page main.dbl-main .hiw-tag--soft {
  background: #faf6ff;
  color: #4a07a6;
  font-size: 0.6875rem;
  font-weight: 600;
  outline: none;
  box-shadow: 0 0 0 1px #efe6ff;
}

/* Testimonial marquee */
.demo-booking-page main.dbl-main .testimonials-marquee {
  margin-top: 2.5rem;
  min-height: 19rem;
}

.demo-booking-page main.dbl-main .testimonials-marquee .marquee-wrap {
  overflow: hidden;
  padding-block: 1.25rem;
  cursor: default;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.demo-booking-page main.dbl-main .testimonials-marquee .marquee-track {
  display: flex;
  width: max-content;
  gap: 0;
  will-change: transform;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation: dbl-marquee var(--marquee-dur, 50s) linear infinite;
}

.demo-booking-page main.dbl-main .testimonials-marquee .marquee-track > .marquee-group {
  display: flex;
  gap: 1.5rem;
  flex-shrink: 0;
  align-items: stretch;
  padding-inline: 0.75rem;
}

.demo-booking-page main.dbl-main .testimonials-marquee .marquee-wrap:hover .marquee-track,
.demo-booking-page main.dbl-main .testimonials-marquee .marquee-wrap:has(.testimonial-card:hover) .marquee-track {
  animation-play-state: paused;
}

@keyframes dbl-marquee {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

.demo-booking-page main.dbl-main .testimonial-card {
  width: 360px;
  min-width: 360px;
  max-width: 360px;
  min-height: 263px;
  flex-shrink: 0;
  padding: 1.5rem;
  border-radius: 26px;
  background: #fff;
  outline: none;
  box-shadow:
    0 0 0 1px #efe6ff,
    0 1px 3px 0 rgba(0, 0, 0, 0.1),
    0 1px 2px -1px rgba(0, 0, 0, 0.1);
  cursor: default;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  cursor: pointer;
  margin: 0.9rem 0rem;
}

.demo-booking-page main.dbl-main .testimonial-card:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px #dac4ff,
    0 10px 25px -5px rgba(136, 67, 219, 0.18),
    0 8px 16px -8px rgba(136, 67, 219, 0.22);
}

.demo-booking-page main.dbl-main .testimonial-card__text {
  flex: 1;
  margin-top: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: rgba(26, 31, 54, 0.8);
}

.demo-booking-page main.dbl-main .testimonial-card__footer {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(239, 230, 255, 0.8);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.demo-booking-page main.dbl-main .testimonial-card__who {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
}

.demo-booking-page main.dbl-main .testimonial-card__avatar {
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border-radius: 0.375rem;
  background-image: var(--gradient-brand);
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}

.demo-booking-page main.dbl-main .stars {
  display: flex;
  gap: 2px;
  color: #fbbf24;
  font-size: 0.875rem;
  flex-shrink: 0;
}

.demo-booking-page main.dbl-main .testimonial-card__quote {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
}

/* Book demo form — Figma-aligned */
.demo-booking-page main.dbl-main .book-demo {
  border-radius: 32px;
  align-items: center;
}

.demo-booking-page main.dbl-main .book-demo__form {
  width: 100%;
  padding: 2rem;
  border-radius: 26px;
  background: #fff;
  box-shadow:
    0 0 0 1px #efe6ff,
    0 1px 3px 0 rgba(0, 0, 0, 0.1),
    0 1px 2px -1px rgba(0, 0, 0, 0.1),
    0 25px 50px -12px rgba(0, 0, 0, 0.15);
}

.demo-booking-page main.dbl-main .book-demo__form h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--fg);
}

.demo-booking-page main.dbl-main .book-demo__form-sub {
  margin-top: 0.25rem;
  font-size: 0.8125rem;
}

.demo-booking-page main.dbl-main .book-demo__form-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 14px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.demo-booking-page main.dbl-main .book-demo__fields {
  margin-top: 1.75rem;
  gap: 1.125rem;
}

.demo-booking-page main.dbl-main .book-demo__fields label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(26, 31, 54, 0.75);
}

.demo-booking-page main.dbl-main .book-demo__fields input {
  margin-top: 0.5rem;
  padding: 0.75rem 0.875rem;
  border-radius: 10px;
  border: 1px solid #efe6ff;
  background: #fff;
  font-size: 0.875rem;
  color: var(--fg);
  transition: border-color 0.2s, box-shadow 0.2s;
}

.demo-booking-page main.dbl-main .book-demo__fields input::placeholder {
  color: rgba(107, 114, 128, 0.75);
}

.demo-booking-page main.dbl-main .book-demo__fields input:focus {
  border-color: rgba(100, 33, 191, 0.45);
  box-shadow: 0 0 0 3px rgba(100, 33, 191, 0.12);
}

.demo-booking-page main.dbl-main .book-demo__submit {
  margin-top: 1.75rem;
  padding: 0.9375rem 1.25rem;
  border-radius: 12px;
  font-size: 0.9375rem;
  cursor: pointer;
}

.demo-booking-page main.dbl-main .book-demo__meta span {
  gap: 0.625rem;
}

@media (prefers-reduced-motion: reduce) {
  .demo-booking-page main.dbl-main .testimonials-marquee .marquee-track {
    animation: none;
    transform: none;
  }
}

@media (max-width: 639px) {
  .demo-booking-page main.dbl-main .testimonial-card {
    width: min(320px, 85vw);
    min-width: min(320px, 85vw);
    max-width: min(320px, 85vw);
    min-height: 240px;
  }
}

/* Asset icons from /assets/images/new-demo-booking/ */
.demo-booking-page main.dbl-main .section-badge__icon {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .btn-primary__icon,
.demo-booking-page main.dbl-main .book-demo__submit-icon {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .btn-secondary__icon {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .roi-result__cta {
  gap: 0.5rem;
}

.demo-booking-page main.dbl-main .roi-result__cta-icon {
  flex-shrink: 0;
  display: block;
  filter: brightness(0) saturate(100%) invert(22%) sepia(85%) saturate(3500%) hue-rotate(258deg) brightness(0.95);
}

.demo-booking-page main.dbl-main .testimonial-card__quote {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
}

.demo-booking-page main.dbl-main .ma-check {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: auto;
  height: auto;
  margin-top: 0;
  border-radius: 0;
  background: none;
  outline: none;
}

.demo-booking-page main.dbl-main .ma-check__icon {
  width: 18px;
  height: 18px;
  display: block;
  flex-shrink: 0;
}

.demo-booking-page main.dbl-main .status-chip--green {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.demo-booking-page main.dbl-main .status-chip__icon {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .book-demo__badge-icon {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  display: block;
}


.demo-booking-page main.dbl-main .book-demo__form-icon img {
  display: block;
}

.demo-booking-page main.dbl-main .book-demo__meta-icon {
  flex-shrink: 0;
  display: block;
}

.demo-booking-page main.dbl-main .book-demo__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.demo-booking-page main.dbl-main .book-demo__submit:disabled {
  cursor: not-allowed;
  pointer-events: none;
}

.demo-booking-page main.dbl-main .book-demo__submit:disabled:hover {
  transform: none;
  pointer-events: none;
}