iframe[src^="https://framer.com/edit"] {
  display: none !important;
}

/* FAQ accordion. The framer runtime is gone, so home.js toggles
   current-faq-open on each item; answers stay hidden until then. */
[data-framer-name="Closed"] > [data-framer-name="Answer"] {
  display: none;
}
.current-faq-open > [data-framer-name="Answer"] {
  display: flex !important;
}
/* The export pins the closed row to a fixed height and clips overflow, so
   revealing the answer is not enough: the row has to grow too. */
.current-faq-open {
  height: min-content !important;
}
[data-framer-name="Closed"] > [data-highlight] {
  cursor: pointer;
}
.current-faq-open [data-framer-name="Top"] .framer-etceum {
  /* Collapse the vertical bar of the plus icon into a minus. */
  transform: scaleY(0.15);
}

/* Creator carousel rotation. The framer runtime is gone, so CSS keeps its
   3D ring moving without changing the exported markup. */
.framer-jxojtt-container
  [style*="transform-style:preserve-3d"][style*="transform:rotateY(0deg)"] {
  animation: home-creator-carousel-rotate 48s linear infinite;
}

@keyframes home-creator-carousel-rotate {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .framer-jxojtt-container
    [style*="transform-style:preserve-3d"][style*="transform:rotateY(0deg)"] {
    animation: none;
  }
}

/* Mobile menu. The collapsed header is a fixed 48px box that clips the
   nav stack; opening just lets it grow. home.js toggles the class. */
.framer-Ynw2l.current-menu-open {
  height: auto !important;
}

/* Header CTA buttons. The export sizes these width:min-content for its
   original labels; the swapped-in BOOK A CALL label is longer and wraps.
   Keep labels on one line, let the button track the text, and pin both
   LOG IN and BOOK A CALL to the same type style. */
.framer-mylLa.framer-in6hc1 .framer-text {
  font-family: "Geist Mono", monospace !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

@media (min-width: 810px) {
  .framer-mylLa.framer-in6hc1 {
    width: max-content;
  }
}

:root {
  --booking-surface: #161616;
  --booking-surface-raised: #1c1c1c;
  --booking-line: #2a2a2a;
  --booking-ink: #fdfdfd;
  --booking-muted: #b4b4b9;
  --booking-dim: #6f6f73;
}

[data-current-pricing] {
  display: grid !important;
  width: 100% !important;
  height: auto !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
  color: var(--booking-ink) !important;
  font-family: "PP Neue Montreal", sans-serif !important;
}

[data-current-pricing],
[data-current-pricing] * {
  box-sizing: border-box;
}

.current-pricing-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 24px;
  cursor: pointer;
  border: 1px solid var(--booking-line);
  background: var(--booking-surface);
  color: var(--booking-ink);
  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    transform 180ms ease;
}

.current-pricing-card:hover,
.current-pricing-card:focus-within {
  border-color: var(--booking-dim);
  background: var(--booking-surface-raised);
  transform: translateY(-3px);
}

.current-pricing-card-managed {
  border-color: var(--booking-dim);
}

.current-pricing-header {
  display: grid;
  grid-template-rows: 98px auto;
  gap: 20px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--booking-line);
  text-align: center;
}

.current-pricing-header > div:last-child {
  display: grid;
  align-content: start;
  gap: 7px;
}

.current-pricing-header h3,
.current-pricing-header p,
.current-pricing-description {
  margin: 0;
}

/* Availability flag on a pricing card (e.g. research preview). Absolutely
   positioned so it never shifts the tier name, subtitle, and price rows out of
   line with the sibling cards. */
.current-pricing-flag {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 4px 10px;
  border: 1px solid var(--booking-line);
  border-radius: 999px;
  color: var(--booking-muted);
  font-size: 11px;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.current-pricing-header h3 {
  font-size: clamp(24px, 2vw, 29px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.current-pricing-header p {
  max-width: 270px;
  margin-inline: auto;
  color: var(--booking-muted);
  font-size: 14px;
  line-height: 1.3;
}

.current-pricing-visual {
  display: flex;
  height: 82px;
  align-items: center;
  align-self: center;
  gap: 12px;
  justify-self: center;
  color: var(--booking-ink);
}

.current-pricing-icon {
  position: relative;
  display: block;
  flex: 0 0 auto;
}

.current-pricing-icon-phone {
  position: relative;
  width: 42px;
  height: 71px;
  border-radius: 6px;
  background: currentColor;
}

.current-pricing-phone-speaker {
  position: absolute;
  top: 6px;
  left: 50%;
  width: 21px;
  height: 5px;
  border-radius: 999px;
  background: var(--booking-surface);
  transform: translateX(-50%);
}

.current-pricing-icon-plus {
  width: 18px;
  height: 18px;
  background: currentColor;
  -webkit-mask: url("/site/home/pricing-icons/plus.svg") center / contain
    no-repeat;
  mask: url("/site/home/pricing-icons/plus.svg") center / contain no-repeat;
  opacity: 0.5;
}

.current-pricing-icon-terminal {
  width: 54px;
  height: 71px;
}

.current-pricing-terminal-body,
.current-pricing-team-person {
  position: absolute;
  display: block;
  background: currentColor;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.current-pricing-terminal-body {
  inset: 0;
  -webkit-mask-composite: xor, xor;
  -webkit-mask-image:
    url("/site/home/pricing-icons/terminal.svg"),
    url("/site/home/pricing-icons/terminal-chevron.svg"),
    url("/site/home/pricing-icons/terminal-chevron.svg");
  -webkit-mask-position:
    center,
    21px 10px,
    31px 10px;
  -webkit-mask-size:
    54px 71px,
    9px 17px,
    9px 17px;
  mask-composite: exclude, exclude;
  mask-image:
    url("/site/home/pricing-icons/terminal.svg"),
    url("/site/home/pricing-icons/terminal-chevron.svg"),
    url("/site/home/pricing-icons/terminal-chevron.svg");
  mask-position:
    center,
    21px 10px,
    31px 10px;
  mask-size:
    54px 71px,
    9px 17px,
    9px 17px;
}

.current-pricing-icon-team {
  width: 92px;
  height: 72px;
}

.current-pricing-team-person {
  inset: 0;
  width: 92px;
  height: 72px;
  opacity: 0.45;
}

.current-pricing-team-person-left {
  -webkit-mask-composite: source-out;
  -webkit-mask-image:
    url("/site/home/pricing-icons/person-left.svg"),
    url("/site/home/pricing-icons/person-center.svg");
  -webkit-mask-position:
    left top,
    21px -1px;
  -webkit-mask-size:
    48px 72px,
    50px 73px;
  mask-composite: subtract;
  mask-image:
    url("/site/home/pricing-icons/person-left.svg"),
    url("/site/home/pricing-icons/person-center.svg");
  mask-position:
    left top,
    21px -1px;
  mask-size:
    48px 72px,
    50px 73px;
}

.current-pricing-team-person-right {
  -webkit-mask-composite: source-out;
  -webkit-mask-image:
    url("/site/home/pricing-icons/person-right.svg"),
    url("/site/home/pricing-icons/person-center.svg");
  -webkit-mask-position:
    right top,
    21px -1px;
  -webkit-mask-size:
    48px 72px,
    50px 73px;
  mask-composite: subtract;
  mask-image:
    url("/site/home/pricing-icons/person-right.svg"),
    url("/site/home/pricing-icons/person-center.svg");
  mask-position:
    right top,
    21px -1px;
  mask-size:
    48px 72px,
    50px 73px;
}

.current-pricing-team-person-center {
  -webkit-mask-image: url("/site/home/pricing-icons/person-left.svg");
  -webkit-mask-position: 22px top;
  -webkit-mask-size: 48px 72px;
  mask-image: url("/site/home/pricing-icons/person-left.svg");
  mask-position: 22px top;
  mask-size: 48px 72px;
  opacity: 1;
}

.current-pricing-price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 16px 0 12px;
}

.current-pricing-price strong {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-size: 30px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.035em;
}

.current-pricing-price small,
.current-pricing-price > span {
  color: var(--booking-muted);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.current-pricing-price-call strong {
  font-size: 25px;
}

.current-pricing-description {
  color: var(--booking-muted);
  font-size: 13px;
  line-height: 1.5;
}

.current-pricing-features {
  display: grid;
  flex: 1;
  align-content: end;
  gap: 11px;
  margin: 16px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--booking-line);
  list-style: none;
}

.current-pricing-features li {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 10px;
  color: var(--booking-muted);
  font-size: 13px;
  line-height: 1.35;
}

.current-pricing-features li::before {
  width: 5px;
  height: 5px;
  margin-top: 6px;
  background: currentColor;
  content: "";
}

.current-pricing-cta {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 0 16px;
  background: var(--booking-ink);
  color: #0a0a0a;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: opacity 160ms ease;
}

.current-pricing-cta:hover,
.current-pricing-cta:focus-visible {
  opacity: 0.82;
}

.current-pricing-cta:focus-visible {
  outline: 1px solid var(--booking-ink);
  outline-offset: 3px;
}

[data-current-hidden="true"] {
  display: none !important;
}

[data-current-booking-shell] {
  display: flex !important;
  width: 100% !important;
  height: auto !important;
  align-items: flex-start !important;
  justify-content: center !important;
}

.current-booking-form {
  display: grid;
  /* Match the page's standard 1040px content column (the pricing grid and
     feature blocks use the same width). */
  width: min(1040px, 100%);
  margin-inline: auto;
  gap: 20px;
  padding: 32px;
  border: 1px solid var(--booking-line);
  background: var(--booking-surface);
  color: var(--booking-ink);
  font-family: "PP Neue Montreal", sans-serif;
  text-align: left;
}

.current-booking-form,
.current-booking-form * {
  box-sizing: border-box;
}

.current-booking-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 20px;
}

.current-booking-field {
  display: grid;
  gap: 7px;
}

.current-booking-field > span {
  color: var(--booking-muted);
  font-size: 12px;
  font-weight: 500;
}

.current-booking-field > span i {
  color: var(--booking-dim);
  font-style: normal;
}

.current-booking-field input,
.current-booking-field select {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid var(--booking-line);
  border-radius: 0;
  outline: none;
  background: var(--booking-surface-raised);
  color: var(--booking-ink);
  font: inherit;
  font-size: 14px;
}

.current-booking-field input::placeholder {
  color: var(--booking-dim);
}

.current-booking-field input:focus,
.current-booking-field select:focus {
  border-color: var(--booking-muted);
}

.current-booking-field select option {
  background: var(--booking-surface-raised);
  color: var(--booking-ink);
}

.current-booking-submit {
  display: inline-flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border: 1px solid #fff;
  border-radius: 0;
  background: #fff;
  color: #0a0a0a;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.current-booking-submit:disabled {
  cursor: wait;
  opacity: 0.65;
}

.current-booking-error,
.current-booking-terms {
  margin: 0;
  font-size: 11px;
}

.current-booking-error {
  color: #ff8a8a;
}

.current-booking-terms {
  color: var(--booking-dim);
  text-align: center;
}

.current-booking-terms a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Hosted Account Slot picker behind the pricing card's CTA. Rides the booking
   modal's overlay/dialog rules (.accounts-modal carries .booking-modal, and
   .accounts-dialog carries .booking-dialog) so there is one set of overlay,
   scroll-lock and mobile rules to maintain. Layout mirrors the in-app buy
   modal (buy-slots-modal-new.tsx): preset plan cards, custom input, posting
   stats, features, Back + primary footer. */
.accounts-dialog {
  width: min(760px, 100%);
}

.accounts-view {
  display: grid;
  gap: 22px;
  padding: 28px;
}

.accounts-view h2 {
  margin: 0;
  padding-right: 40px;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.025em;
}

.accounts-intro {
  margin: 8px 0 0;
  color: var(--booking-muted);
  font-size: 14px;
  line-height: 1.5;
}

.accounts-plans {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.accounts-plan {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 14px;
  border: 1px solid var(--booking-line);
  background: var(--booking-surface-raised);
  cursor: pointer;
  transition:
    border-color 140ms ease,
    background-color 140ms ease;
}

.accounts-plan:hover,
.accounts-plan:focus-visible {
  border-color: var(--booking-dim);
}

.accounts-plan:focus-visible {
  outline: 1px solid var(--booking-ink);
  outline-offset: 2px;
}

.accounts-plan.is-selected {
  border-color: var(--booking-ink);
  background: var(--booking-ink);
  color: #0a0a0a;
}

.accounts-plan-price {
  margin: 0;
  font-size: 12px;
  line-height: 1;
}

.accounts-plan-price span {
  color: var(--booking-muted);
}

.accounts-plan-count {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin: 16px 0 14px;
}

.accounts-plan-count strong {
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.03em;
}

.accounts-plan-count span {
  color: var(--booking-muted);
  font-size: 11px;
}

.accounts-plan-stats {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0;
  color: var(--booking-muted);
  font-size: 11px;
  list-style: none;
}

.accounts-plan-stats strong {
  color: inherit;
  font-weight: 500;
}

/* Selected card inverts; its muted text follows the dark ink. */
.accounts-plan.is-selected .accounts-plan-price span,
.accounts-plan.is-selected .accounts-plan-count span,
.accounts-plan.is-selected .accounts-plan-stats,
.accounts-plan.is-selected .accounts-plan-floor {
  color: rgba(10, 10, 10, 0.6);
}

.accounts-custom-input {
  width: 58px;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.03em;
  -moz-appearance: textfield;
  appearance: textfield;
}

.accounts-custom-input::-webkit-inner-spin-button,
.accounts-custom-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
}

.accounts-custom-input:focus {
  outline: none;
}

.accounts-plan-floor {
  margin: 6px 0 0;
  font-size: 11px;
}

.accounts-features {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
}

.accounts-features li {
  display: flex;
  gap: 10px;
}

.accounts-features strong {
  font-weight: 400;
}

.accounts-features span {
  color: var(--booking-muted);
}

.accounts-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.accounts-back {
  border: 0;
  padding: 0;
  background: none;
  color: var(--booking-muted);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}

.accounts-back:hover,
.accounts-back:focus-visible {
  color: var(--booking-ink);
}

.accounts-submit {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 0;
  background: var(--booking-ink);
  color: #0a0a0a;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 160ms ease;
}

.accounts-submit:hover,
.accounts-submit:focus-visible {
  opacity: 0.82;
}

@media (max-width: 700px) {
  .accounts-view {
    padding: 24px 20px;
  }

  .accounts-plans {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.booking-modal {
  position: fixed;
  z-index: 1200;
  inset: 0;
  display: grid;
  overflow-y: auto;
  place-items: center;
  padding: 24px;
  background: rgba(0, 0, 0, 0.72);
  color: var(--booking-ink);
  font-family: "PP Neue Montreal", sans-serif;
  backdrop-filter: blur(8px);
}

.booking-modal,
.booking-modal * {
  box-sizing: border-box;
}

.booking-modal[hidden] {
  display: none;
}

body.booking-open {
  overflow: hidden;
}

.booking-dialog {
  position: relative;
  width: min(860px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  border: 1px solid var(--booking-line);
  background: var(--booking-surface);
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.56);
  color: var(--booking-ink);
  transition: width 180ms ease;
}

.booking-dialog.is-calendar {
  width: min(1120px, 100%);
  overflow: hidden;
}

.booking-form-view,
.booking-calendar-view {
  padding: 32px;
}

.booking-form-view {
  display: grid;
  grid-template-columns: minmax(250px, 0.78fr) minmax(390px, 1.22fr);
  padding: 0;
}

.booking-form-view[hidden],
.booking-calendar-view[hidden] {
  display: none;
}

.booking-form-intro-panel {
  padding: 40px 36px;
  border-right: 1px solid var(--booking-line);
  background: var(--booking-surface);
}

.booking-form-view h2,
.booking-calendar-view h2 {
  margin: 0;
  padding-right: 40px;
  font-family: "PP Neue Montreal", sans-serif;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.025em;
}

.booking-intro {
  max-width: 600px;
  margin: 10px 0 0;
  padding-right: 32px;
  color: var(--booking-muted);
  font-size: 14px;
  line-height: 1.5;
}

.booking-calendar-view {
  padding: 0;
}

.booking-calendar-header {
  display: flex;
  min-height: 72px;
  align-items: center;
  padding: 16px 64px 16px 24px;
  border-bottom: 1px solid var(--booking-line);
}

.booking-calendar-header h2 {
  padding: 0;
  font-size: 22px;
}

.booking-calendar-header p {
  margin: 6px 0 0;
  color: var(--booking-muted);
  font-size: 13px;
}

.booking-calendar-header p span {
  margin: 0 5px;
  color: var(--booking-dim);
}

.booking-call-meta {
  display: grid;
  gap: 0;
  margin: 34px 0 0;
  border-top: 1px solid var(--booking-line);
}

.booking-call-meta div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  padding: 13px 0;
  border-bottom: 1px solid var(--booking-line);
}

.booking-call-meta dt,
.booking-call-meta dd {
  margin: 0;
  font-size: 12px;
}

.booking-call-meta dt {
  color: var(--booking-dim);
}

.booking-call-meta dd {
  color: var(--booking-muted);
}

.booking-close {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 18px;
  display: grid;
  width: 32px;
  height: 32px;
  padding: 8px;
  border: 0;
  place-items: center;
  background: transparent;
  color: var(--booking-muted);
  cursor: pointer;
}

.booking-close:hover,
.booking-close:focus-visible {
  background: var(--booking-surface-raised);
  color: var(--booking-ink);
}

.booking-close:focus-visible {
  outline: 1px solid var(--booking-ink);
  outline-offset: 2px;
}

.booking-close svg {
  width: 16px;
  height: 16px;
}

.booking-close path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.5;
}

.booking-form {
  display: grid;
  gap: 15px;
  margin: 0;
  padding: 40px 36px 32px;
}

.booking-field {
  display: grid;
  gap: 7px;
}

.booking-field > span {
  color: var(--booking-muted);
  font-size: 12px;
  font-weight: 500;
}

.booking-field > span i {
  color: var(--booking-dim);
  font-style: normal;
}

.booking-field input,
.booking-field select {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--booking-line);
  border-radius: 0;
  outline: none;
  background: var(--booking-surface-raised);
  color: var(--booking-ink);
  font: inherit;
  font-size: 14px;
}

.booking-field input::placeholder {
  color: var(--booking-dim);
}

.booking-field input:focus,
.booking-field select:focus {
  border-color: var(--booking-dim);
}

.booking-field select option {
  background: var(--booking-surface-raised);
  color: var(--booking-ink);
}

.booking-terms {
  color: var(--booking-dim);
  font-size: 11px;
}

.booking-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.booking-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  margin-top: 2px;
  padding: 0 16px;
  border: 1px solid #fff;
  border-radius: 0;
  background: #fff;
  color: #000;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.booking-submit:disabled {
  cursor: wait;
  opacity: 0.65;
}

.booking-error {
  margin: 0;
  color: #ff8a8a;
  font-size: 13px;
}

.booking-terms {
  margin: 0;
}

.booking-terms a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Cal.com's inline embed mounts a <cal-inline> wrapper and its iframe inside
   this container, so the panel geometry lives here rather than on an iframe.
   Cal sizes that iframe to its own content height, not to this box, and the
   enclosing dialog clips overflow: without a scroll port here the tail of the
   month (the later time slots) is unreachable on short viewports. Cal treats
   this element as the scroll port too, injecting scrollbar-hiding rules for
   `.cal-inline-container` onto it. */
.booking-calendar-embed {
  display: block;
  width: 100%;
  height: min(640px, calc(100dvh - 120px));
  overflow-y: auto;
  margin: 0;
  border: 0;
  background: var(--booking-surface);
}

@media (max-width: 960px) {
  [data-current-pricing] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .current-pricing-description {
    margin-bottom: 20px;
  }

  .booking-modal {
    align-items: stretch;
    padding: 0;
  }

  .booking-dialog.is-calendar {
    width: 100%;
    height: 100dvh;
    max-height: none;
    border: 0;
  }

  .booking-dialog.is-calendar .booking-calendar-view {
    display: grid;
    height: 100%;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .booking-dialog.is-calendar .booking-calendar-embed {
    height: 100%;
  }
}

@media (max-width: 700px) {
  .current-pricing-card {
    padding: 24px 20px;
  }

  .current-pricing-header h3 {
    font-size: 25px;
  }

  .current-pricing-header p {
    max-width: 260px;
    font-size: 14px;
  }

  .current-booking-form {
    gap: 18px;
    padding: 24px 20px;
  }

  .current-booking-fields {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .booking-form-view {
    grid-template-columns: 1fr;
  }

  .booking-form-intro-panel {
    padding: 28px 24px 22px;
    border-right: 0;
    border-bottom: 1px solid var(--booking-line);
  }

  .booking-call-meta {
    grid-template-columns: 1fr 1fr;
    margin-top: 22px;
    border-bottom: 1px solid var(--booking-line);
  }

  .booking-call-meta div {
    display: block;
    padding: 11px 0;
    border-bottom: 0;
  }

  .booking-call-meta div + div {
    padding-left: 20px;
    border-left: 1px solid var(--booking-line);
  }

  .booking-call-meta dd {
    margin-top: 4px;
  }

  .booking-form {
    padding: 26px 24px max(24px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 430px) {
  .booking-modal {
    align-items: end;
  }

  .booking-dialog:not(.is-calendar) {
    width: 100%;
    max-height: 94vh;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
  }

  .booking-form-intro-panel {
    padding-right: 20px;
    padding-left: 20px;
  }

  .booking-form {
    padding-right: 20px;
    padding-left: 20px;
  }

  .booking-calendar-header {
    min-height: 68px;
    padding-left: 20px;
  }
}