/* ==========================================================================
   Go Beyond definitive itinerary builder
   Scoped to .ibp / .ibp-* so it cannot leak into other site experiences.
   Brand rules: https://brand.gobeyond.pa/ — shared tokens and accessible controls,
   Quicksand for headings, Open Sans for body and UI.
   ========================================================================== */

.ibp {
  --ibp-hair: var(--color-neutral-medium-gray);          /* hairline — lighter than --divider-color */
  --ibp-rule: var(--divider-color);
  /* semantic status colours. Grounds use the site tokens (--green-soft);
     ink stays darker than --green, which is only 3.6:1 on --green-soft and
     fails AA for the small bold rate badges. */
  --ibp-green-ink: var(--primary-color);
  --ibp-danger: var(--bs-danger-text-emphasis);
  --ibp-danger-soft: #fff5f6;
  /* pale Jazzberry ground for selected states, paired with the pink border */
  --ibp-brand-tint: #fff8fc;
  --ibp-radius: var(--card-radius);
  --ibp-radius-sm: 6px;
  --ibp-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ibp-fast: 180ms;
  --ibp-slow: 280ms;
  padding: 0 0 112px;
  font-family: var(--font-secondary);
  color: var(--font-color);
  font-size: 17px;
}

.ibp h1,
.ibp h2,
.ibp h3,
.ibp h4 {
  font-family: var(--font-primary);
  color: var(--primary-color);
  margin: 0;
  letter-spacing: -0.01em;
}

.ibp-shell {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--site-gutter);
}

/* money and counts always align in a column */
.ibp b,
.ibp strong,
.ibp .ibp-num {
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
  .ibp *,
  .ibp *::before,
  .ibp *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- masthead ---------------------------------------------------- */

/* Keep the planner's introduction compact so the first question is visible
   immediately. Hotel and activity photography belongs inside those steps. */
.ibp-masthead {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 40px;
  padding: 40px 0;
  text-align: start;
}

.ibp-masthead h1 {
  font-size: clamp(32px, 3.2vw, 44px);
  line-height: 1.2;
  font-weight: 700;
  text-transform: none;
  letter-spacing: -0.01em;
}

.ibp-kicker {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--secondary-color);
  margin: 0 0 10px;
}

.ibp-lede {
  margin: 16px 0 0;
  max-width: 64ch;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-soft);
}

.ibp-hero-note {
  display: grid;
  gap: 12px;
  margin: 0;
  padding-block: 0;
  padding-inline: 32px 0;
  border-inline-start: 1px solid var(--divider-color);
  list-style: none;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.5;
}

.ibp-hero-note li {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ibp-hero-note i {
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--light-blue);
  color: var(--secondary-color);
  font-size: 12px;
}

.ibp-step-help {
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
}

.ibp-step-help a {
  color: var(--primary-color);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ibp-step-help a:hover,
.ibp-step-help a:focus-visible {
  color: var(--button-primary-hover);
}

/* ---------- sticky progress rail ---------------------------------------- */

.ibp-progress {
  position: sticky;
  top: var(--navbar-height, 73px);
  z-index: 20;
  background: var(--neutral-color);
  border-top: 1px solid var(--ibp-hair);
  border-bottom: 1px solid var(--ibp-hair);
  margin-bottom: 32px;
}

.ibp-progress-inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--site-gutter);
}

.ibp-progress-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 0 10px;
}

.ibp-progress-text {
  margin: 0;
  font-size: 15px;
  color: var(--muted);
  letter-spacing: 0.01em;
}

.ibp-progress-text strong {
  color: var(--primary-color);
  font-weight: 700;
}

.ibp-progress-text span::before {
  content: "\2014";
  margin: 0 9px;
  color: var(--mid-blue);
}

.ibp-progress-total {
  margin: 0;
  font-size: 14px;
  color: var(--muted);
  white-space: nowrap;
}

.ibp-progress-total strong {
  font-family: var(--font-primary);
  font-size: 17px;
  color: var(--primary-color);
  margin-left: 8px;
  font-weight: 700;
}

.ibp-progress-track {
  height: 3px;
  background: var(--ibp-hair);
  position: relative;
}

.ibp-progress-track span {
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  display: block;
  background: var(--secondary-color);
  transition: width var(--ibp-slow) var(--ibp-ease);
}

.ibp-progress-steps {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 12px 0;
}

.ibp-progress-steps button {
  background: none;
  border: 0;
  width: 100%;
  min-height: 56px;
  padding: 8px 16px;
  border-radius: var(--ibp-radius-sm);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  letter-spacing: 0.005em;
  transition: color var(--ibp-fast) var(--ibp-ease), background var(--ibp-fast) var(--ibp-ease);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-align: start;
}

.ibp-step-number {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border: 1px solid var(--divider-color);
  border-radius: 50%;
  background: var(--neutral-color);
  font-size: 14px;
  font-weight: 700;
}

.ibp-progress-steps button:hover,
.ibp-progress-steps button:focus-visible {
  background: var(--light-blue);
  color: var(--primary-color);
}

.ibp-progress-steps button.is-active {
  background: var(--accent-soft);
  color: var(--secondary-color);
}

.ibp-progress-steps button.is-active .ibp-step-number {
  background: var(--secondary-color);
  border-color: var(--secondary-color);
  color: var(--neutral-color);
}

.ibp-progress-steps button:focus-visible {
  outline: 3px solid var(--secondary-color);
  outline-offset: 4px;
}

.ibp-progress-steps button.is-done {
  color: var(--primary-color);
}

.ibp-progress-steps button.is-done .ibp-step-number {
  font-size: 0;
  border-color: var(--primary-color);
  background: var(--primary-color);
  color: var(--neutral-color);
}

.ibp-progress-steps button.is-done .ibp-step-number::before {
  content: "\2713";
  font-size: 16px;
}


/* ---------- layout ------------------------------------------------------ */

.ibp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 410px;
  align-items: start;
}

.ibp-panel {
  min-width: 0;
  padding-bottom: 10px;
}

.ibp-step[hidden] {
  display: none;
}

.ibp-step {
  animation: ibp-enter var(--ibp-slow) var(--ibp-ease) both;
}

@keyframes ibp-enter {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

.ibp-step-head {
  margin-bottom: 28px;
}

.ibp-step-head h2 {
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.15;
  font-weight: 600;
}

/* The heading is a programmatic focus target for screen readers on each step
   change, not a control. The live builder lets it take the browser's default
   black outline, which paints a stray box for mouse users. */
.ibp-step-head h2:focus,
.ibp-step-head h2:focus-visible {
  outline: none;
}

.ibp-step-head p {
  margin: 11px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.55;
  max-width: 58ch;
}

/* section label: small caps over a full-width hairline — editorial, not a box */
.ibp .ibp-sub {
  font-family: var(--font-secondary);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--primary-color);
  margin: 36px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ibp-hair);
}

.ibp-field-label {
  display: block;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--primary-color);
  margin-bottom: 8px;
}

.ibp-field-label b {
  color: var(--secondary-color);
  font-weight: 700;
}

.ibp-field-label small {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}

/* ---------- inputs ------------------------------------------------------ */

.ibp-field input,
.ibp-field textarea,
.ibp-select select {
  width: 100%;
  min-height: 50px;
  border: 1px solid var(--ibp-border-strong, #cbd4e3);
  border-radius: var(--input-radius);
  padding: 12px 16px;
  font: inherit;
  font-size: 16px;
  color: var(--primary-color);
  background: var(--neutral-color);
  transition: border-color var(--ibp-fast) var(--ibp-ease);
}

.ibp-field textarea {
  border: 1px solid var(--ibp-rule);
  border-radius: var(--input-radius);
  padding: 12px 16px;
  font-size: 15px;
  resize: vertical;
}

.ibp-field input::placeholder,
.ibp-field textarea::placeholder {
  color: #68738c;
}

.ibp-field input:hover,
.ibp-select select:hover {
  border-color: var(--mid-blue);
}

.ibp-field input:focus,
.ibp-field textarea:focus,
.ibp-select select:focus {
  outline: none;
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(30, 29, 73, 0.1);
}

.ibp-field textarea:focus {
  box-shadow: 0 0 0 3px rgba(30, 29, 73, 0.08);
}

.ibp-field-dates input {
  cursor: pointer;
  font-weight: 600;
  font-family: var(--font-primary);
  font-size: 18px;
}

.ibp-field small {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  color: var(--muted);
}

/* ---------- chips ------------------------------------------------------- */

.ibp-chip {
  border: 1px solid var(--ibp-rule);
  background: var(--neutral-color);
  border-radius: 999px;
  min-height: 48px;
  padding: 10px 17px;
  font: inherit;
  font-size: 15px;
  color: var(--ink-soft);
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease),
              color var(--ibp-fast) var(--ibp-ease),
              background var(--ibp-fast) var(--ibp-ease);
}

.ibp-chip:hover,
.ibp-chip:focus-visible {
  border-color: var(--tertiary-color);
  color: var(--button-primary-hover);
  outline: none;
}

.ibp-chip.is-on {
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
  font-weight: 600;
}

.ibp-chip.is-on small {
  color: rgba(255, 255, 255, 0.7);
}

.ibp-chip.is-on:hover,
.ibp-chip.is-on:focus-visible {
  background: var(--button-primary-hover);
  border-color: var(--tertiary-color);
  color: #fff;
}

/* ---------- step 1 ------------------------------------------------------ */

.ibp-trip-search {
  margin: 0 0 28px;
  overflow: hidden;
  border: 1px solid #d9e0ea;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(30, 29, 73, .09);
}

.ibp-trip-search .ibp-flex-chips {
  border-bottom: 2px solid var(--secondary-color);
  padding: 10px 16px;
}

.ibp-trip-search .ibp-flex-chips > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.ibp-flex-select {
  display: none;
}

.ibp-flex-select select {
  width: 100%;
  min-width: 0;
  min-height: 52px;
  padding: 12px;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius-sm);
  background: var(--neutral-color);
  color: var(--primary-color);
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
}

.ibp-flex-select select:focus-visible {
  outline: 3px solid var(--secondary-color);
  outline-offset: 3px;
}

.ibp-trip-search .ibp-chip {
  min-height: 40px;
  border: 0;
  border-radius: 6px;
  padding: 8px 10px;
  color: var(--primary-color);
  font-size: 14px;
  font-weight: 700;
}

.ibp-trip-search .ibp-chip.is-on,
.ibp-trip-search .ibp-chip.is-on:hover,
.ibp-trip-search .ibp-chip.is-on:focus-visible {
  background: var(--secondary-color);
  color: #fff;
  box-shadow: 0 4px 12px rgba(181, 0, 97, .18);
}

.ibp-trip-search-content {
  min-height: 140px;
}

.ibp-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: center;
  padding: 24px;
}

.ibp-trip-search .ibp-field-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ibp-date-hint {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 14px;
}

.ibp-trip-search .ibp-field-label {
  color: #5d6a83;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.ibp-trip-search .ibp-field-dates input {
  min-height: 64px;
  border: 0;
  border-bottom: 1px solid #d9e0ea;
  border-radius: 0;
  padding: 12px 0;
  font-size: clamp(16px, 1.7vw, 20px);
}

.ibp-trip-search .ibp-field-dates input:focus {
  border-color: var(--secondary-color);
  box-shadow: 0 2px 0 var(--secondary-color);
}

.ibp-flex-chips > div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* counters as a rule-separated row, not a box inside a box */
.ibp-counters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 18px 18px;
  border-top: 1px solid var(--ibp-hair);
  border-bottom: 1px solid var(--ibp-hair);
}

.ibp-trip-search .ibp-sub {
  margin: 0 18px 14px;
  padding: 18px 0 0;
  border-top: 1px solid var(--ibp-hair);
  border-bottom: 0;
}

.ibp-trip-search .ibp-trip-choices {
  padding: 0 18px 22px;
}

.ibp-trip-search .ibp-child-ages {
  margin: 0 18px 20px;
}

.ibp-child-ages {
  display: grid;
  grid-template-columns: minmax(190px, .8fr) minmax(0, 1.4fr);
  gap: 18px 28px;
  align-items: center;
  margin: 18px 0 30px;
  padding: 18px 20px;
  border: 1px solid var(--ibp-hair);
  border-left: 4px solid var(--secondary-color);
  border-radius: var(--ibp-radius);
  background: var(--light-blue);
}

.ibp-child-ages[hidden] {
  display: none;
}

.ibp-child-ages strong,
.ibp-child-ages small {
  display: block;
}

.ibp-child-ages strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 15px;
}

.ibp-child-ages small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.ibp-child-age-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 10px;
}

.ibp-child-age-grid label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.ibp-child-age-grid select {
  min-height: 42px;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  background: var(--neutral-color);
  color: var(--primary-color);
  padding: 7px 10px;
  font: inherit;
  font-weight: 700;
}

.ibp-shabbat-prompt {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 16px;
  margin: 18px 0 28px;
  padding: 20px;
  border: 1px solid rgba(181, 0, 97, .24);
  border-radius: var(--ibp-radius);
  background: var(--ibp-brand-tint);
  box-shadow: 0 12px 30px rgba(30, 29, 73, .06);
}

.ibp-shabbat-prompt[hidden] {
  display: none;
}

.ibp-shabbat-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: var(--primary-color);
  color: var(--neutral-color);
}

.ibp-shabbat-kicker,
.ibp-shabbat-prompt strong,
.ibp-shabbat-prompt p {
  display: block;
}

.ibp-shabbat-kicker {
  margin-bottom: 3px;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.ibp-shabbat-prompt strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 18px;
}

.ibp-shabbat-prompt p {
  max-width: 780px;
  margin: 6px 0 14px;
  color: var(--ink-soft);
  line-height: 1.55;
}

.ibp-shabbat-switch,
.ibp-kosher-switch {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}

.ibp-shabbat-switch input,
.ibp-kosher-switch input {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  margin-top: 2px;
  accent-color: var(--secondary-color);
}

.ibp-shabbat-switch b,
.ibp-shabbat-switch small,
.ibp-kosher-switch b,
.ibp-kosher-switch small {
  display: block;
}

.ibp-shabbat-switch b,
.ibp-kosher-switch b {
  color: var(--primary-color);
  font-size: 14px;
}

.ibp-shabbat-switch small,
.ibp-kosher-switch small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

.ibp-kosher-switch {
  position: relative;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 26px;
  align-items: center;
  gap: 16px;
  margin: 22px 0 8px;
  padding: 20px 22px;
  border: 2px solid var(--secondary-color);
  border-radius: var(--ibp-radius);
  background: var(--ibp-brand-tint);
  box-shadow: 0 10px 28px rgba(30, 29, 73, .1);
  transition: border-color var(--ibp-fast) var(--ibp-ease),
              box-shadow var(--ibp-fast) var(--ibp-ease),
              transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-kosher-switch:hover,
.ibp-kosher-switch:focus-within {
  border-color: var(--tertiary-color);
  box-shadow: 0 14px 32px rgba(30, 29, 73, .14);
  transform: translateY(-2px);
}

.ibp-kosher-switch:focus-within {
  outline: 3px solid rgba(181, 0, 97, .18);
  outline-offset: 3px;
}

.ibp-kosher-switch input {
  grid-column: 3;
  grid-row: 1;
  width: 26px;
  height: 26px;
  margin: 0;
}

.ibp-kosher-icon {
  display: grid;
  grid-column: 1;
  grid-row: 1;
  width: 52px;
  height: 52px;
  place-items: center;
  border-radius: 50%;
  color: var(--neutral-color);
  background: var(--secondary-color);
  font-size: 23px;
}

.ibp-kosher-copy {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.ibp-kosher-kicker {
  display: block;
  margin-bottom: 3px;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .09em;
  line-height: 1.3;
  text-transform: uppercase;
}

.ibp-kosher-switch b {
  font-family: var(--font-primary);
  font-size: clamp(18px, 2vw, 21px);
  line-height: 1.2;
}

.ibp-kosher-switch small {
  max-width: 720px;
  margin-top: 5px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.5;
}

@media (max-width: 520px) {
  .ibp-kosher-switch {
    grid-template-columns: 42px minmax(0, 1fr) 24px;
    gap: 12px;
    padding: 17px 15px;
  }

  .ibp-kosher-icon {
    width: 42px;
    height: 42px;
    font-size: 19px;
  }

  .ibp-kosher-switch input {
    width: 24px;
    height: 24px;
  }
}

.ibp-counter {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 8px;
  padding: 14px 16px 14px 0;
}

.ibp-counter + .ibp-counter {
  border-left: 1px solid var(--ibp-hair);
  padding-left: 16px;
}

.ibp-counter strong {
  display: block;
  font-size: 15px;
  color: var(--primary-color);
  font-weight: 600;
}

.ibp-counter small {
  font-size: 14px;
  color: var(--muted);
}

.ibp-stepper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
}

.ibp-stepper button {
  width: 48px;
  height: 48px;
  border-radius: var(--ibp-radius-sm);
  border: 1px solid var(--ibp-rule);
  background: var(--neutral-color);
  color: var(--primary-color);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease),
              color var(--ibp-fast) var(--ibp-ease),
              transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-stepper button:hover:not(:disabled),
.ibp-stepper button:focus-visible:not(:disabled) {
  border-color: var(--tertiary-color);
  color: var(--button-primary-hover);
  outline: none;
}

.ibp-stepper button:active:not(:disabled) {
  transform: scale(0.9);
}

.ibp-stepper button:disabled {
  opacity: 0.28;
  cursor: not-allowed;
}

.ibp-stepper output {
  min-width: 40px;
  text-align: center;
  font-weight: 700;
  font-size: 19px;
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-variant-numeric: tabular-nums;
}

/* ---------- choice cards ------------------------------------------------ */

/* Cards carry their own border and radius, so this is a plain grid. It used
   to draw 1px dividers by filling the row with --ibp-hair and letting a 1px
   gap show through; the gap is now 10-14px, which turned that fill into a
   visible band behind the cards. */
.ibp-choice-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.ibp-choice {
  position: relative;
  text-align: left;
  min-height: 104px;
  border: 1px solid var(--ibp-border-strong, #cbd4e3);
  border-radius: var(--ibp-radius);
  background: var(--neutral-color);
  padding: 18px;
  cursor: pointer;
  font: inherit;
  transition: background var(--ibp-fast) var(--ibp-ease);
}

.ibp-choice i {
  color: var(--secondary-color);
  font-size: 19px;
  margin-bottom: 13px;
  display: block;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-choice strong {
  display: block;
  font-family: var(--font-primary);
  font-size: 17px;
  font-weight: 700;
  color: var(--primary-color);
  margin-bottom: 5px;
}

.ibp-choice small {
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted);
  display: block;
}

.ibp-choice:hover,
.ibp-choice:focus-visible {
  background: var(--accent-soft);
  outline: none;
}

.ibp-choice:hover i,
.ibp-choice:focus-visible i {
  color: var(--button-primary-hover);
}

.ibp-choice.is-on {
  background: var(--primary-color);
  border-color: var(--primary-color);
}

.ibp-trip-choices .ibp-choice {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.ibp-trip-choices .ibp-choice i {
  margin: 3px 0 0;
}

.ibp-choice.is-on i {
  color: #fff;
  opacity: 0.85;
}

.ibp-choice.is-on strong {
  color: #fff;
}

.ibp-choice.is-on small {
  color: rgba(255, 255, 255, 0.68);
}

.ibp-choice.is-on:hover,
.ibp-choice.is-on:focus-visible {
  background: var(--button-primary-hover);
}

.ibp-choice.is-on:hover small,
.ibp-choice.is-on:focus-visible small {
  color: rgba(255, 255, 255, 0.82);
}

/* ---------- lead capture gate ------------------------------------------- */

.ibp-gate {
  margin-top: 44px;
  padding: 26px 28px 22px;
  border-radius: var(--ibp-radius);
  animation: ibp-enter var(--ibp-slow) var(--ibp-ease) both;
}

.ibp-gate[hidden] {
  display: none;
}

.ibp-gate-head {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 22px;
}

.ibp-gate-head > i {
  color: var(--secondary-color);
  font-size: 17px;
  margin-top: 3px;
}

.ibp-gate-head h3 {
  font-size: 19px;
  font-weight: 700;
}

.ibp-gate-head h3:focus,
.ibp-gate-head h3:focus-visible {
  outline: none;
}

.ibp-gate-head p {
  margin: 7px 0 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 56ch;
}

.ibp-gate-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 30px;
}

.ibp-gate .ibp-field input {
  background: var(--neutral-color);
  border: 1px solid var(--ibp-rule);
  border-radius: var(--input-radius);
  padding: 12px 16px;
  font-size: 15px;
}

.ibp-gate .ibp-field input:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(30, 29, 73, 0.1);
}

.ibp-gate .ibp-privacy {
  margin: 18px 0 0;
}

/* contact recap on the review step */
.ibp-contact-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding: 15px 18px;
  background: var(--accent-soft);
  border-radius: var(--ibp-radius);
  margin-bottom: 26px;
}

.ibp-contact-summary strong {
  display: block;
  font-family: var(--font-primary);
  font-size: 16px;
  font-weight: 700;
  color: var(--primary-color);
}

.ibp-contact-summary small {
  font-size: 14px;
  color: var(--ink-soft);
}

/* "saved" reassurance in the brief */
.ibp-brief-saved {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ibp-green-ink);
  overflow-wrap: break-word;
}

.ibp-brief-saved[hidden] {
  display: none;
}

.ibp-brief-saved i {
  margin-right: 6px;
}

.ibp-brief-saved b {
  color: var(--ibp-green-ink);
}

/* ---------- step 2 : hotels -------------------------------------------- */

.ibp-filters {
  border-top: 1px solid var(--ibp-hair);
  border-bottom: 1px solid var(--ibp-hair);
  padding: 20px 0;
  margin-bottom: 28px;
}

.ibp-filter-row {
  display: flex;
  gap: 34px;
  flex-wrap: wrap;
  align-items: flex-end;
}

.ibp-select {
  min-width: 160px;
}

.ibp-select span {
  display: block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 7px;
}

.ibp-select select {
  cursor: pointer;
  font-size: 14.5px;
  font-weight: 600;
  padding-right: 18px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23727D98' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2px center;
}

.ibp-toggles {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding-bottom: 2px;
}

.ibp-toggles .ibp-chip {
  padding: 8px 15px;
  font-size: 14px;
}

.ibp-area-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 18px;
}

.ibp-area-chips .ibp-chip {
  padding: 6px 14px;
  font-size: 14px;
}

.ibp-filter-count {
  margin: 16px 0 0;
  font-size: 14px;
  color: var(--muted);
}

.ibp-filter-count strong {
  color: var(--primary-color);
}

.ibp-linkbtn {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: var(--secondary-color);
  cursor: pointer;
  border-bottom: 1px solid currentColor;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-linkbtn:hover,
.ibp-linkbtn:focus-visible {
  color: var(--button-primary-hover);
  outline: none;
}

.ibp-hotel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(226px, 1fr));
  gap: 30px 24px;
}

.ibp-hotel-search-bar {
  margin: 0 0 10px;
  padding: 20px 22px 22px;
  border: 1px solid #d9e0ea;
  border-top: 3px solid var(--secondary-color);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(30, 29, 73, .09);
}

.ibp-hotel-search-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.ibp-hotel-search-summary strong,
.ibp-hotel-search-summary > span {
  display: block;
}

.ibp-hotel-search-summary strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 15px;
}

.ibp-hotel-search-summary > span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 14px;
}

.ibp-hotel-date-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ibp-hotel-date-controls label {
  display: block;
  margin: 0;
}

.ibp-hotel-date-controls label > span {
  display: block;
  margin: 0 0 5px;
  color: #5d6a83;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ibp-hotel-date-controls input {
  width: 100%;
  min-height: 56px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #d9e0ea;
  border-radius: 0;
  color: var(--primary-color);
  background: var(--neutral-color);
  font: 700 14px/1.2 "Open Sans", sans-serif;
}

.ibp-hotel-date-controls input:focus-visible {
  border-color: var(--secondary-color);
  outline: 2px solid color-mix(in srgb, var(--secondary-color) 22%, transparent);
  outline-offset: 1px;
}

.ibp-hotel-date-controls input:disabled {
  color: var(--muted);
  background: #f1f3f7;
  cursor: not-allowed;
}

.ibp-live-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 7px 10px;
  border-radius: 999px;
  color: var(--ibp-green-ink);
  background: var(--green-soft);
  font-size: 14px;
  font-weight: 700;
}

.ibp-hotel-search-status {
  min-height: 23px;
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.ibp-hotel-search-status.is-error {
  color: var(--ibp-danger);
}

.ibp-hotel {
  border: 0;
  background: none;
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  font: inherit;
  cursor: default;
  position: relative;
}

.ibp-hotel.is-loading .ibp-hotel-live {
  animation: ibp-hotel-rate-pulse 1.1s ease-in-out infinite alternate;
}

@keyframes ibp-hotel-rate-pulse {
  to { opacity: .52; }
}

.ibp-hotel-media {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--accent-soft);
  overflow: hidden;
  border-radius: var(--ibp-radius);
}

.ibp-hotel-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 480ms var(--ibp-ease);
}

.ibp-hotel:hover .ibp-hotel-media img,
.ibp-hotel:focus-visible .ibp-hotel-media img {
  transform: scale(1.04);
}

.ibp-hotel:focus-visible {
  outline: none;
}

.ibp-hotel:focus-visible .ibp-hotel-media {
  box-shadow: 0 0 0 2px var(--primary-color), 0 0 0 5px rgba(30, 29, 73, 0.16);
}

.ibp-hotel-stars {
  position: absolute;
  left: 10px;
  bottom: 10px;
  background: rgba(32, 32, 32, 0.66);
  backdrop-filter: blur(3px);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: var(--ibp-radius-sm);
  letter-spacing: 0.02em;
}

/* selected state: a check medallion, not a heavy ring */
.ibp-hotel-tick {
  position: absolute;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--neutral-color);
  color: var(--primary-color);
  display: grid;
  place-items: center;
  font-size: 14px;
  transition: opacity var(--ibp-fast) var(--ibp-ease), transform var(--ibp-fast) var(--ibp-ease);
  box-shadow: 0 2px 8px rgba(16, 22, 40, 0.2);
}

.ibp-hotel.is-on .ibp-hotel-media {
  box-shadow: 0 0 0 2px var(--primary-color);
}

.ibp-hotel-body {
  padding: 13px 2px 0;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.ibp-hotel-area {
  font-size: 14px;
  color: var(--muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 6px;
}

.ibp-hotel-body h3 {
  font-size: 16px;
  line-height: 1.28;
  font-weight: 700;
  margin-bottom: 6px;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-hotel:hover .ibp-hotel-body h3 {
  color: var(--button-primary-hover);
}

/* badges as quiet inline text, not another row of pills */
.ibp-hotel-badges {
  font-size: 14px;
  color: var(--ibp-green-ink);
  margin-bottom: 9px;
  line-height: 1.4;
}

.ibp-hotel-badges .ibp-badge-kosher {
  color: var(--secondary-color);
}

.ibp-hotel-badges span + span::before {
  content: "·";
  margin: 0 6px;
  color: var(--mid-blue);
}

.ibp-hotel-price {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--ibp-hair);
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}

.ibp-hotel-price b {
  font-size: 18px;
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-weight: 700;
}

.ibp-hotel-price span {
  font-size: 14px;
  color: var(--muted);
}

.ibp-hotel-price em {
  font-style: normal;
  font-size: 14px;
  color: var(--ink-soft);
  width: 100%;
  margin-top: 2px;
}

.ibp-hotel-live {
  display: grid;
  gap: 3px;
  margin-top: 11px;
  padding: 10px 11px;
  border-radius: var(--ibp-radius);
  background: var(--light-blue);
}

.ibp-hotel-live > span {
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.ibp-hotel-live strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 16px;
}

.ibp-hotel-live small {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
}

.ibp-hotel-select {
  width: 100%;
  min-height: 41px;
  margin-top: 9px;
  border: 0;
  border-radius: var(--ibp-radius);
  background: var(--secondary-color);
  color: var(--neutral-color);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--ibp-fast) var(--ibp-ease);
}

.ibp-hotel-select:hover:not(:disabled),
.ibp-hotel-select:focus-visible:not(:disabled) {
  background: var(--button-primary-hover);
}

.ibp-hotel-select:disabled {
  cursor: not-allowed;
  color: var(--muted);
  background: var(--ibp-hair);
}

.ibp-hotel.is-selected .ibp-hotel-media,
.ibp-hotel.is-on .ibp-hotel-media {
  box-shadow: 0 0 0 2px var(--secondary-color), 0 0 0 5px rgba(181, 0, 97, .1);
}

.ibp-room-panel {
  margin: 24px 0 8px;
  scroll-margin-top: calc(var(--navbar-height, 73px) + 110px);
}

.ibp .hotel-room-panel {
  padding: clamp(18px, 3vw, 28px);
  border: 1px solid rgba(181, 0, 97, .24);
  border-radius: var(--ibp-radius);
  background: var(--neutral-color);
  box-shadow: 0 18px 44px rgba(30, 29, 73, .12);
}

.ibp .hotel-room-panel[hidden] { display: none; }

.ibp .hotel-room-panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.ibp .hotel-room-panel-heading > div > span {
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ibp .hotel-room-panel-heading h3 {
  margin: 4px 0 6px;
  font-size: clamp(21px, 3vw, 28px);
}

.ibp .hotel-room-panel-heading p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.ibp .hotel-room-panel-close {
  display: inline-grid;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: var(--neutral-color);
  background: var(--primary-color);
  cursor: pointer;
}

.ibp .hotel-room-list { display: grid; gap: 18px; }

.ibp .hotel-room-picker {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius);
  background: var(--light-blue);
}

.ibp .hotel-room-picker-intro {
  margin: 0;
  color: var(--primary-color);
  font-weight: 700;
}

.ibp .hotel-room-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.ibp .hotel-room-tab {
  display: flex;
  min-width: 0;
  min-height: 98px;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 12px;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  color: var(--primary-color);
  background: var(--neutral-color);
  text-align: left;
  cursor: pointer;
}

.ibp .hotel-room-tab.is-active {
  border-color: var(--secondary-color);
  box-shadow: 0 0 0 3px rgba(181, 0, 97, .1);
}

.ibp .hotel-room-tab.is-complete { background: var(--green-soft); }
.ibp .hotel-room-tab strong,
.ibp .hotel-room-tab small,
.ibp .hotel-room-tab-selection { display: block; max-width: 100%; }
.ibp .hotel-room-tab strong { font-size: 14px; }
.ibp .hotel-room-tab small { color: var(--muted); }

.ibp .hotel-room-tab-selection {
  display: -webkit-box;
  margin-top: auto;
  overflow: hidden;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.ibp .hotel-room-tab-selection i { margin-right: 5px; color: var(--ibp-green-ink); }

.ibp .hotel-room-selection-status {
  padding: 9px 11px;
  border-radius: var(--ibp-radius);
  color: var(--muted);
  background: var(--neutral-color);
  font-size: 14px;
  font-weight: 700;
}

.ibp .hotel-room-selection-status.is-complete { color: var(--ibp-green-ink); background: var(--green-soft); }

.ibp .hotel-room-option {
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  background: var(--neutral-color);
  box-shadow: 0 8px 24px rgba(30, 29, 73, .06);
}

.ibp .hotel-room-option-photo {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  height: 100%;
  min-height: 132px;
  max-height: 148px;
  object-fit: cover;
  background: var(--light-blue);
}

.ibp .hotel-room-option-heading {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  min-height: 132px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 22px;
  background: var(--light-blue);
}

.ibp .hotel-room-option-heading h4 { margin: 0; font-size: 18px; line-height: 1.35; }
.ibp .hotel-room-option-heading span {
  max-width: 220px;
  flex: 0 0 220px;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

.ibp .hotel-room-rates { display: grid; grid-column: 1 / -1; border-top: 1px solid var(--ibp-hair); }

.ibp .hotel-room-rate {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, .72fr);
  min-height: 126px;
  gap: 24px;
  align-items: center;
  padding: 18px 22px;
  border-top: 1px solid var(--ibp-hair);
}

.ibp .hotel-room-rate:first-child { border-top: 0; }
.ibp .hotel-room-rate.is-selected { background: rgba(181, 0, 97, .045); box-shadow: inset 4px 0 0 var(--secondary-color); }
.ibp .hotel-room-rate-details > strong,
.ibp .hotel-room-rate-details > small,
.ibp .hotel-room-rate-price > strong,
.ibp .hotel-room-rate-price > small { display: block; }
.ibp .hotel-room-rate-details > strong { color: var(--primary-color); font-size: 14px; }
.ibp .hotel-room-rate-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.ibp .hotel-room-rate-badges span { padding: 4px 7px; border-radius: 999px; color: var(--ibp-green-ink); background: var(--green-soft); font-size: 14px; font-weight: 700; }
.ibp .hotel-room-cancellation { margin-top: 7px; color: var(--muted); line-height: 1.4; }

.ibp .hotel-room-rate-price {
  display: flex;
  min-height: 90px;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  text-align: right;
}

.ibp .hotel-room-rate-price > strong { color: var(--primary-color); font-size: 14px; }
.ibp .hotel-room-rate-price > small { margin: 3px 0 10px; color: var(--muted); }
.ibp .hotel-room-book {
  width: min(100%, 235px);
  min-height: 40px;
  padding: 9px 14px;
  border: 0;
  border-radius: var(--ibp-radius);
  color: var(--neutral-color) !important;
  background: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
}

.ibp-hotel-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 54px 20px;
  color: var(--muted);
  border: 1px dashed var(--ibp-rule);
  border-radius: var(--ibp-radius);
}

.ibp-stay-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}

.ibp-stay-choice {
  position: relative;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 24px;
  gap: 14px;
  align-items: center;
  min-height: 112px;
  padding: 18px;
  border: 1px solid var(--ibp-border-strong, #cbd4e3);
  border-radius: var(--ibp-radius);
  color: var(--primary-color);
  background: var(--neutral-color);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease),
              background var(--ibp-fast) var(--ibp-ease),
              box-shadow var(--ibp-fast) var(--ibp-ease),
              transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-stay-choice:hover,
.ibp-stay-choice:focus-visible {
  border-color: var(--tertiary-color);
  box-shadow: 0 10px 24px rgba(30, 29, 73, .1);
  outline: none;
  transform: translateY(-2px);
}

.ibp-stay-choice.is-on {
  border: 2px solid var(--secondary-color);
  padding: 17px;
  background: var(--ibp-brand-tint);
  box-shadow: 0 8px 22px rgba(30, 29, 73, .08);
}

.ibp-stay-choice-icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 50%;
  color: var(--secondary-color);
  background: var(--ibp-brand-tint);
  font-size: 18px;
}

.ibp-stay-choice.is-on .ibp-stay-choice-icon {
  color: var(--neutral-color);
  background: var(--secondary-color);
}

.ibp-stay-choice-copy strong,
.ibp-stay-choice-copy small {
  display: block;
}

.ibp-stay-choice-copy strong {
  font-family: var(--font-primary);
  font-size: 17px;
  line-height: 1.25;
}

.ibp-stay-choice-copy small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.ibp-stay-choice-tick {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--ibp-border-strong, #cbd4e3);
  border-radius: 50%;
  color: transparent;
  background: var(--neutral-color);
  font-size: 14px;
}

.ibp-stay-choice.is-on .ibp-stay-choice-tick {
  border-color: var(--secondary-color);
  color: var(--neutral-color);
  background: var(--secondary-color);
}

/* ---------- step 3 : the day timeline ---------------------------------- */

/* ---------- drafted itinerary ------------------------------------------- */

/* The drafted plan opens the step, so it is set as a masthead rather than a
   tinted panel: the activity cards below already carry the pink, and a second
   pink box above them made the whole step read as one colour. Hairlines top and
   bottom, no ground, and the copy flush with the heading that follows. */
.ibp-suggestion {
  margin: 0 0 32px;
  padding: 4px 0 22px;
  border-bottom: 1px solid var(--ibp-rule);
}

.ibp-suggestion-kicker {
  display: block;
  margin: 0 0 6px;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* This is the step's own heading, so it matches the other three steps rather
   than inventing a size — and it is a programmatic focus target on step change,
   which would otherwise paint the browser's default outline for mouse users. */
.ibp-suggestion h2 {
  margin: 0;
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.15;
  font-weight: 600;
}

.ibp-suggestion h2:focus,
.ibp-suggestion h2:focus-visible {
  outline: none;
}

.ibp-suggestion-shape {
  max-width: 58ch;
  margin: 8px 0 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.6;
}

.ibp-suggestion-stale {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 12px 0 0;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 600;
}

.ibp-suggestion-stale[hidden] {
  display: none;
}

/* Pace controls stay with activity selection; plan actions sit in the summary. */
.ibp-suggestion-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px 28px;
  margin-top: 20px;
}

.ibp-suggestion-pace {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.ibp-suggestion-pace-label {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.ibp-suggestion-pace-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ibp-suggestion-pace-chips .ibp-chip {
  min-height: 40px;
  padding: 7px 14px;
  font-size: 14px;
}

.ibp-suggestion-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-top: 16px;
}

.ibp-suggestion-actions .ibp-btn {
  min-height: 40px;
  padding: 7px 16px;
  font-size: 14px;
}

.ibp-suggestion-actions[hidden],
.ibp-suggestion-actions .ibp-btn[hidden],
.ibp-suggestion-actions .ibp-linkbtn[hidden] {
  display: none;
}

.ibp-suggestion-actions .ibp-linkbtn {
  font-size: 14px;
}

@media (max-width: 640px) {
  .ibp-suggestion-controls {
    align-items: stretch;
    gap: 16px;
  }

  .ibp-suggestion-actions {
    justify-content: space-between;
  }
}

.ibp-activity-select {
  margin-bottom: 34px;
}

.ibp-activity-select-head,
.ibp-schedule-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 16px;
}

.ibp-activity-select-head h3 {
  font-size: 22px;
}

.ibp-activity-select-head p,
.ibp-schedule-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.ibp-activity-count,
.ibp-drag-hint {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--primary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ibp-activity-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.ibp-activity-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius);
  color: var(--primary-color);
  background: var(--neutral-color);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease),
              box-shadow var(--ibp-fast) var(--ibp-ease),
              transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-activity-card:hover,
.ibp-activity-card:focus-visible {
  border-color: var(--tertiary-color);
  box-shadow: 0 4px 14px rgba(20, 20, 20, .06);
  outline: none;
  transform: translateY(-1px);
}

.ibp-activity-card.is-on {
  border-color: var(--secondary-color);
  box-shadow: none;
}

.ibp-activity-card.is-waiting {
  border-style: dashed;
}

.ibp-activity-media {
  position: relative;
  display: block;
  width: 100%;
  flex-shrink: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--light-blue);
}

.ibp-activity-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--ibp-slow) var(--ibp-ease);
}

.ibp-activity-card:hover .ibp-activity-media img,
.ibp-activity-card:focus-visible .ibp-activity-media img {
  transform: scale(1.04);
}

.ibp-activity-description {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 16px;
  color: var(--neutral-color);
  background: rgba(20, 20, 20, .84);
  font-size: 14px;
  line-height: 1.5;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity var(--ibp-fast) var(--ibp-ease), transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-activity-card:hover .ibp-activity-description,
.ibp-activity-card:focus-visible .ibp-activity-description {
  opacity: 1;
  transform: translateY(0);
}

.ibp-activity-add {
  position: absolute;
  top: 10px;
  right: 10px;
  width: fit-content;
  font-weight: 700;
  white-space: nowrap;
  display: grid;
  min-width: 82px;
  padding: 0 10px;
  height: 36px;
  place-items: center;
  border: 1px solid var(--primary-color);
  border-radius: 7px;
  color: var(--primary-color);
  background: var(--neutral-color);
  font-size: 14px;
}

.ibp-activity-card.is-on .ibp-activity-add {
  color: var(--neutral-color);
  border-color: var(--secondary-color);
  background: var(--secondary-color);
}

.ibp-activity-card:hover .ibp-activity-add,
.ibp-activity-card:focus-visible .ibp-activity-add {
  border-color: var(--tertiary-color);
  color: var(--button-primary-hover);
}

.ibp-activity-card.is-on:hover .ibp-activity-add,
.ibp-activity-card.is-on:focus-visible .ibp-activity-add {
  border-color: var(--tertiary-color);
  background: var(--button-primary-hover);
  color: var(--neutral-color);
}

.ibp-activity-card-copy {
  display: block;
  min-height: 76px;
  padding: 18px;
}

.ibp-activity-card-copy strong,
.ibp-activity-card-copy small {
  display: block;
}





.ibp-activity-card-copy strong {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: 700;
  color: var(--primary-color);
  line-height: 1.3;
}



.ibp-activity-card-copy small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

.ibp-activity-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 15px 0 0;
  padding: 11px 13px;
  border-left: 3px solid var(--primary-color);
  color: var(--ink-soft);
  background: var(--light-blue);
  font-size: 14px;
  line-height: 1.45;
}

.ibp-activity-status i {
  color: var(--primary-color);
}

.ibp-activity-status.is-warning {
  border-left-color: var(--primary-color);
  background: var(--light-blue);
}

.ibp-plans {
  margin-bottom: 40px;
}

.ibp-schedule-head {
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid var(--ibp-hair);
}

/* vertical spine with numbered nodes — reads as an itinerary, not a stack */
.ibp-pdf-detail-note {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  margin: 0 0 26px;
  padding: 16px 18px;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius);
  background: var(--light-blue);
}

.ibp-pdf-detail-note > i {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: var(--secondary-color);
  color: var(--neutral-color);
}

.ibp-pdf-detail-note strong,
.ibp-pdf-detail-note span {
  display: block;
}

.ibp-pdf-detail-note strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 15px;
}

.ibp-pdf-detail-note span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.ibp-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

.ibp-timeline::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 14px;
  bottom: 14px;
  width: 1px;
  background: var(--ibp-hair);
}

.ibp-tl-day {
  position: relative;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 20px;
  padding-bottom: 26px;
  animation: ibp-enter var(--ibp-slow) var(--ibp-ease) both;
  animation-delay: var(--ibp-delay, 0ms);
}

/* arriving from the brief: say which day you landed on, then get out of the way */
.ibp-tl-day.is-target .ibp-tl-content {
  animation: ibp-land 1500ms var(--ibp-ease) both;
}

.ibp-tl-day.is-target .ibp-tl-marker {
  animation: ibp-land-marker 1500ms var(--ibp-ease) both;
}

@keyframes ibp-land {
  0%   { box-shadow: -14px 0 0 0 var(--accent-soft), 14px 0 0 0 var(--accent-soft); background: var(--accent-soft); }
  70%  { box-shadow: -14px 0 0 0 var(--accent-soft), 14px 0 0 0 var(--accent-soft); background: var(--accent-soft); }
  100% { box-shadow: none; background: transparent; }
}

@keyframes ibp-land-marker {
  0%, 70% { box-shadow: 0 0 0 4px rgba(181, 0, 97, 0.18); }
  100%    { box-shadow: none; }
}

.ibp-tl-marker {
  width: 31px;
  height: 31px;
  border-radius: var(--ibp-radius-sm);
  border: 1px solid var(--ibp-rule);
  background: var(--neutral-color);
  color: var(--muted);
  display: grid;
  place-items: center;
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 14px;
  z-index: 1;
  transition: background var(--ibp-fast) var(--ibp-ease),
              border-color var(--ibp-fast) var(--ibp-ease),
              color var(--ibp-fast) var(--ibp-ease);
}

.ibp-tl-day.has-plan .ibp-tl-marker {
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}

.ibp-tl-day.is-shabbat .ibp-tl-marker {
  border-color: var(--primary-color);
  background: var(--primary-color);
  color: var(--neutral-color);
}

.ibp-shabbat-day {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 15px;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  background: var(--light-blue);
}

.ibp-shabbat-day > i {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: var(--ibp-radius-sm);
  background: var(--primary-color);
  color: var(--neutral-color);
}

.ibp-shabbat-day strong,
.ibp-shabbat-day span { display: block; }
.ibp-shabbat-day strong { color: var(--primary-color); font-family: var(--font-primary); }
.ibp-shabbat-day span { margin-top: 3px; color: var(--muted); font-size: 14px; line-height: 1.45; }

.ibp-friday-note {
  margin: 0 0 10px;
  padding: 8px 10px;
  border-left: 3px solid var(--primary-color);
  background: var(--light-blue);
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.45;
}

.ibp-tl-head {
  display: flex;
  align-items: baseline;
  gap: 11px;
  padding-top: 6px;
  margin-bottom: 10px;
}

.ibp-tl-head h4 {
  font-size: 16px;
  font-weight: 700;
}

.ibp-tl-date {
  font-size: 14px;
  color: var(--muted);
}

.ibp-tl-load {
  margin-left: auto;
  font-size: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--mid-blue);
}

.ibp-tl-load.is-full {
  color: var(--primary-color);
}

.ibp-day-empty {
  color: var(--muted);
  font-size: 14px;
  margin: 0 0 10px;
}

.ibp-day-item {
  position: relative;
  display: grid;
  grid-template-columns: 18px 62px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 11px 0;
  border-top: 1px solid var(--ibp-hair);
  cursor: grab;
  transition: opacity var(--ibp-fast) var(--ibp-ease),
              background var(--ibp-fast) var(--ibp-ease),
              box-shadow var(--ibp-fast) var(--ibp-ease);
}

.ibp-day-item:active {
  cursor: grabbing;
}

.ibp-day-drag {
  color: var(--mid-blue);
  font-size: 14px;
  text-align: center;
  touch-action: none;
  user-select: none;
}

.ibp-day-item.is-dragging {
  opacity: .38;
}

.ibp-day-item.is-drop-target {
  background: var(--ibp-brand-tint);
  box-shadow: inset 0 0 0 2px var(--secondary-color);
}

.ibp-tl-day.is-drag-over .ibp-tl-content {
  background: var(--ibp-brand-tint);
  box-shadow: inset 0 0 0 2px var(--secondary-color);
}

.ibp-day-item:last-of-type {
  border-bottom: 1px solid var(--ibp-hair);
}

.ibp-day-item img {
  width: 62px;
  height: 46px;
  object-fit: cover;
  border-radius: var(--ibp-radius-sm);
  flex-shrink: 0;
}

.ibp-day-item-copy {
  flex: 1;
  min-width: 0;
}

.ibp-day-item-copy strong {
  display: block;
  font-family: var(--font-primary);
  font-size: 15px;
  color: var(--primary-color);
  font-weight: 700;
}

.ibp-day-item-copy small {
  font-size: 14px;
  color: var(--muted);
}

.ibp-day-tour-type {
  color: var(--secondary-color);
  font-weight: 700;
}

.ibp-day-tour-type i,
.ibp-brief-tour-type i {
  margin-right: 4px;
  font-size: .9em;
}

.ibp-day-item-price {
  font-size: 15px;
  font-weight: 700;
  color: var(--primary-color);
  white-space: nowrap;
  font-family: var(--font-primary);
}

/* tools stay out of the way until you're on the row */
.ibp-day-item-tools {
  display: flex;
  gap: 2px;
  opacity: 0;
  transition: opacity var(--ibp-fast) var(--ibp-ease);
}

.ibp-day-item:hover .ibp-day-item-tools,
.ibp-day-item:focus-within .ibp-day-item-tools {
  opacity: 1;
}

.ibp-icon-btn {
  width: 27px;
  height: 27px;
  border: 0;
  border-radius: var(--ibp-radius-sm);
  background: none;
  color: var(--mid-blue);
  font-size: 14px;
  cursor: pointer;
  transition: color var(--ibp-fast) var(--ibp-ease), background var(--ibp-fast) var(--ibp-ease);
}

.ibp-icon-btn:hover:not(:disabled),
.ibp-icon-btn:focus-visible:not(:disabled) {
  color: var(--button-primary-hover);
  background: var(--accent-soft);
  outline: none;
}

.ibp-icon-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.ibp-day-add {
  border: 0;
  background: none;
  padding: 10px 0 0;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary-color);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-day-add i {
  font-size: 10px;
  transition: transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-day-add:hover,
.ibp-day-add:focus-visible {
  color: var(--button-primary-hover);
  outline: none;
}

.ibp-day-add:hover i {
  transform: rotate(90deg);
}

.ibp-picker {
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  margin-top: 14px;
  padding: 16px;
  background: var(--premium-surface);
  animation: ibp-enter 200ms var(--ibp-ease) both;
}

.ibp-picker-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 13px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}

.ibp-picker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
  max-height: 330px;
  overflow-y: auto;
}

.ibp-picker-item {
  display: flex;
  gap: 10px;
  align-items: center;
  text-align: left;
  border: 1px solid transparent;
  border-radius: var(--ibp-radius-sm);
  background: var(--neutral-color);
  padding: 7px;
  font: inherit;
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease), background var(--ibp-fast) var(--ibp-ease);
}

.ibp-picker-item:hover,
.ibp-picker-item:focus-visible {
  border-color: var(--tertiary-color);
  outline: none;
}

.ibp-picker-item img {
  width: 46px;
  height: 36px;
  object-fit: cover;
  border-radius: var(--ibp-radius-sm);
  flex-shrink: 0;
}

.ibp-picker-item strong {
  display: block;
  font-size: 14px;
  color: var(--primary-color);
  font-weight: 600;
  line-height: 1.25;
}

.ibp-picker-item small {
  font-size: 14px;
  color: var(--muted);
}

.ibp-picker-item[data-used="1"] {
  opacity: 0.4;
}

/* ---------- add-ons ----------------------------------------------------- */

.ibp-addons-note {
  font-size: 14px;
  color: var(--muted);
  margin: -8px 0 16px;
}

.ibp-addon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(228px, 1fr));
  gap: 18px;
}

.ibp-addon {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius);
  background: var(--neutral-color);
  padding: 0;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: border-color var(--ibp-fast) var(--ibp-ease);
}

.ibp-addon:hover,
.ibp-addon.is-on {
  border-color: var(--tertiary-color);
}

.ibp-addon:focus-visible {
  outline: 2px solid var(--tertiary-color);
  outline-offset: 3px;
}

.ibp-addon-media {
  position: relative;
  display: grid;
  width: 100%;
  aspect-ratio: 8 / 5;
  overflow: hidden;
  place-items: center;
  background: var(--light-blue);
  color: var(--primary-color);
  font-size: 32px;
}

.ibp-addon-media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-addon:hover .ibp-addon-media > img {
  transform: scale(1.03);
}

.ibp-addon-add {
  position: absolute;
  top: 10px;
  right: 10px;
  width: fit-content;
  min-width: 82px;
  padding: 0 10px;
  height: 36px;
  border: 1px solid var(--tertiary-color);
  border-radius: 7px;
  color: var(--button-primary-hover);
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  display: grid;
  place-items: center;
  background: var(--neutral-color);
  transition: background var(--ibp-fast) var(--ibp-ease);
}

.ibp-addon.is-on .ibp-addon-add {
  color: var(--neutral-color);
  background: var(--button-primary-hover);
}



.ibp-addon-copy {
  display: block;
  width: 100%;
  padding: 18px;
}

.ibp-addon-copy strong {
  display: block;
  font-family: var(--font-primary);
  font-size: 18px;
  color: var(--primary-color);
  font-weight: 700;
  line-height: 1.3;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-addon:hover .ibp-addon-copy strong {
  color: var(--button-primary-hover);
}

.ibp-addon-copy small {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  color: var(--muted);
  line-height: 1.5;
}

/* ---------- step 4 : review + form -------------------------------------- */

.ibp-review {
  border-top: 1px solid var(--ibp-rule);
}

.ibp-review-row {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 14px 0;
  font-size: 14.5px;
  border-bottom: 1px solid var(--ibp-hair);
}

.ibp-review-row span:first-child {
  color: var(--muted);
  flex-shrink: 0;
}

.ibp-review-row strong {
  color: var(--primary-color);
  text-align: right;
  font-weight: 600;
}

.ibp-review-days {
  padding: 8px 0;
}

.ibp-review-day {
  display: flex;
  gap: 18px;
  padding: 9px 0;
  font-size: 14.5px;
}

.ibp-review-day b {
  color: var(--muted);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  width: 170px;
  flex-shrink: 0;
  padding-top: 2px;
}

.ibp-review-day span {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-weight: 600;
}

.ibp-review-total {
  border-top: 1px solid var(--primary-color);
  padding: 18px 0 0;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.ibp-review-total span {
  font-weight: 700;
  color: var(--primary-color);
  font-size: 15px;
}

.ibp-review-total b {
  font-size: 30px;
  font-family: var(--font-primary);
  color: var(--secondary-color);
  font-weight: 700;
}

.ibp-form {
  margin-top: 46px;
}

.ibp-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px 34px;
}

.ibp-field-wide {
  grid-column: 1 / -1;
}

/* Errors appear only once a field is touched and invalid.
   (The live builder force-shows all three on page load.) */
.ibp-error {
  display: none;
  font-style: normal;
  font-size: 14px;
  color: var(--secondary-color);
  margin-top: 7px;
}

.ibp-field.is-invalid .ibp-error {
  display: block;
  animation: ibp-enter 160ms var(--ibp-ease) both;
}

.ibp-field.is-invalid input,
.ibp-field.is-invalid textarea {
  border-color: var(--secondary-color);
}

.ibp-privacy {
  font-size: 14px;
  color: var(--muted);
  margin: 26px 0 22px;
  line-height: 1.6;
}

.ibp-price-notice {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  margin: 18px 0 8px;
  padding: 11px 13px;
  border-left: 3px solid var(--primary-color);
  background: var(--light-blue);
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.45;
}

.ibp-price-notice i { margin-top: 2px; color: var(--primary-color); }

.ibp-privacy a {
  color: var(--secondary-color);
}

.ibp-form-msg {
  margin-top: 18px;
  padding: 13px 16px;
  border-radius: var(--ibp-radius);
  background: var(--green-soft);
  color: var(--ibp-green-ink);
  font-size: 14px;
  font-weight: 600;
}

/* ---------- buttons ----------------------------------------------------- */

.ibp-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border-radius: var(--button-radius);
  border: 1px solid transparent;
  min-height: 50px;
  padding: 12px 26px;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--ibp-fast) var(--ibp-ease),
              border-color var(--ibp-fast) var(--ibp-ease),
              color var(--ibp-fast) var(--ibp-ease);
}

.ibp-btn i {
  font-size: 11px;
  transition: transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-btn-primary {
  background: var(--secondary-color);
  color: #fff;
}

.ibp-btn-primary:hover,
.ibp-btn-primary:focus-visible {
  background: var(--button-primary-hover);
  outline: none;
}

.ibp-btn-primary:hover .fa-arrow-right {
  transform: translateX(3px);
}

.ibp-btn-quiet {
  background: none;
  border-color: var(--ibp-rule);
  color: var(--ink-soft);
}

.ibp-btn-quiet:hover,
.ibp-btn-quiet:focus-visible {
  border-color: var(--button-primary-hover);
  color: var(--button-primary-hover);
  outline: none;
}

.ibp-btn-quiet:hover .fa-arrow-left {
  transform: translateX(-3px);
}

.ibp-btn-lg {
  padding: 15px 32px;
  font-size: 15.5px;
}

.ibp-btn-sm {
  padding: 9px 18px;
  font-size: 14px;
}

.ibp-btn-sm[hidden] {
  display: none;
}

.ibp-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-top: 48px;
  padding-top: 26px;
  border-top: 1px solid var(--ibp-hair);
}

.ibp-actions [data-ibp-back][hidden],
.ibp-actions [data-ibp-next][hidden],
.ibp-actions [data-ibp-submit][hidden] {
  display: none;
}

.ibp-actions [data-ibp-next],
.ibp-actions [data-ibp-submit] {
  margin-left: auto;
}

/* ---------- trip brief -------------------------------------------------- */

/* The brief is the anchor: it holds position while the questions scroll past,
   and scrolls internally rather than clipping when the day plan gets long. */
.ibp-brief {
  position: sticky;
  top: calc(var(--navbar-height, 73px) + 118px);
  max-height: calc(100vh - var(--navbar-height, 73px) - 150px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  border-left: 1px solid var(--ibp-hair);
  padding: 2px 0 0 28px;
}

/* every readout in the brief is also a way back to the thing it reports */
.ibp-brief-jump {
  display: block;
  width: 100%;
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border-radius: var(--ibp-radius-sm);
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-jump:focus-visible {
  outline: 2px solid var(--primary-color);
  outline-offset: 3px;
}

.ibp-brief-section .ibp-brief-jump:hover span,
.ibp-brief-section .ibp-brief-jump:focus-visible span {
  color: var(--button-primary-hover);
}

.ibp-brief-close {
  display: none;
}

.ibp-brief-head {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 0 0 12px;
  background: var(--neutral-color);
}

.ibp-brief-head span {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}

.ibp-brief-head strong {
  display: block;
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 700;
  color: var(--primary-color);
  margin-top: 6px;
  letter-spacing: -0.01em;
}

.ibp-brief-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 20px 0;
  padding: 15px 0;
  border-top: 1px solid var(--ibp-hair);
  border-bottom: 1px solid var(--ibp-hair);
  border-radius: 0;
}

.ibp-brief-stats small {
  display: block;
  font-size: 14px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 600;
}

.ibp-brief-stats b {
  display: block;
  margin-top: 5px;
  font-weight: 700;
  font-size: 15px;
  color: var(--primary-color);
  font-family: var(--font-primary);
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-stats .ibp-brief-jump:hover b,
.ibp-brief-stats .ibp-brief-jump:focus-visible b {
  color: var(--button-primary-hover);
}

.ibp-brief-photos {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 24px;
}

.ibp-brief-photos img {
  display: block;
  width: 100%;
  height: 120px;
  object-fit: cover;
  object-position: center 45%;
  border-radius: var(--ibp-radius);
}

.ibp-brief-photos figcaption {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.ibp-brief-section {
  margin-bottom: 20px;
}

.ibp-brief-label {
  display: block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 9px;
}

.ibp-brief-section p,
.ibp-brief-section [data-ibp-brief-hotel] {
  display: block;
  margin: 0;
  font-size: 14.5px;
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-weight: 700;
  line-height: 1.35;
}

.ibp-brief-section small {
  display: block;
  font-family: var(--font-secondary);
  font-weight: 400;
  font-size: 14px;
  color: var(--muted);
  margin-top: 3px;
}

.ibp-brief-empty {
  color: var(--muted) !important;
  font-family: var(--font-secondary) !important;
  font-weight: 400 !important;
}

.ibp-brief-outline {
  list-style: none;
  margin: 7px 0 0;
  padding: 0;
  font-size: 14px;
}

.ibp-brief-outline li {
  padding: 7px 0 9px;
  border-top: 1px solid var(--ibp-hair);
  transition: background var(--ibp-fast) var(--ibp-ease), box-shadow var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-outline li:first-child {
  border-top: 0;
}

.ibp-brief-day-head {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  background: none;
  padding: 3px 2px;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
}

.ibp-brief-day-head b {
  color: var(--primary-color);
  font-weight: 700;
  flex-shrink: 0;
  font-size: 14px;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-day-head span {
  color: var(--muted);
  flex: 1;
  min-width: 0;
  transition: color var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-day-head > i {
  font-size: 9px;
  color: var(--primary-color);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity var(--ibp-fast) var(--ibp-ease), transform var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-day-head:hover,
.ibp-brief-day-head:focus-visible {
  outline: none;
}

.ibp-brief-day-head:hover span,
.ibp-brief-day-head:focus-visible span,
.ibp-brief-day-head:hover b,
.ibp-brief-day-head:focus-visible b {
  color: var(--primary-color);
}

.ibp-brief-day-head:hover > i,
.ibp-brief-day-head:focus-visible > i {
  opacity: 1;
  transform: none;
}

.ibp-brief-day-head:focus-visible {
  box-shadow: inset 2px 0 0 var(--primary-color);
}

.ibp-brief-outline li.is-empty .ibp-brief-day-head span {
  color: var(--muted);
  opacity: 0.75;
}

.ibp-brief-drag-note {
  display: flex !important;
  align-items: center;
  gap: 6px;
  margin: -3px 0 0 !important;
  color: var(--muted) !important;
  font-size: 14px !important;
}

.ibp-brief-tour {
  position: relative;
  display: grid;
  min-height: 112px;
  overflow: hidden;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding: 0;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius-sm);
  background: var(--neutral-color);
  cursor: grab;
  transition: border-color var(--ibp-fast) var(--ibp-ease), opacity var(--ibp-fast) var(--ibp-ease), background var(--ibp-fast) var(--ibp-ease);
}

.ibp-brief-tour:active {
  cursor: grabbing;
}

.ibp-brief-tour > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 88px;
  height: 100%;
  object-fit: cover;
}

.ibp-brief-tour-drag {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 24px;
  height: 28px;
  border-radius: 4px;
  background: rgba(255, 255, 255, .92);
  color: var(--primary-color);
  font-size: 14px;
  touch-action: none;
}

.ibp-brief-tour-copy {
  grid-column: 2;
  padding: 16px 0;
}

.ibp-brief-tour-copy,
.ibp-brief-tour-copy strong,
.ibp-brief-tour-copy small {
  display: block;
  min-width: 0;
}

.ibp-brief-tour-copy strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 14px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.ibp-brief-tour-copy small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

/* Tour prices use the same party total as the estimate. */
.ibp-brief-tour-price {
  grid-column: 3;
  padding: 36px 12px 16px 0;
  color: var(--secondary-color);
  font-size: 15px;
  font-weight: 700;
  text-align: right;
}

.ibp-brief-tour-price small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 400;
}

.ibp-brief-tour-remove {
  position: absolute;
  top: 2px;
  right: 2px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: var(--neutral-color);
  color: var(--muted);
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
}

.ibp-brief-tour-remove:hover,
.ibp-brief-tour-remove:focus-visible {
  color: var(--button-primary-hover);
  background: var(--light-blue);
}

.ibp-brief-tour-remove:focus-visible {
  outline: 2px solid var(--tertiary-color);
  outline-offset: -2px;
}

.ibp-brief-tour-type {
  color: var(--secondary-color);
  font-weight: 700;
}

.ibp-brief-tour.is-dragging {
  opacity: .35;
}

.ibp-brief-tour.is-drop-target,
.ibp-brief-outline li.is-drag-over {
  border-color: var(--primary-color);
  background: var(--light-blue);
}

.ibp-brief-outline li.is-drag-over {
  box-shadow: inset 3px 0 0 var(--primary-color);
}

.ibp-brief-total {
  border-top: 1px solid var(--primary-color);
  padding-top: 16px;
}

.ibp-brief-total > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.ibp-brief-total span {
  font-size: 14px;
  font-weight: 600;
  color: var(--primary-color);
}

.ibp-brief-total strong {
  font-family: var(--font-primary);
  font-size: 24px;
  font-weight: 700;
  color: var(--secondary-color);
}

.ibp-brief-total small {
  display: block;
  margin-top: 9px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}

/* The running total is where the decision gets made, so Continue sits directly
   under it and pins to the foot of the brief's own scroll box - no second
   full-width rail competing with it. */
.ibp-brief-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  padding: 14px 0 8px;
  background: var(--neutral-color);
  border-top: 1px solid var(--ibp-hair);
}

.ibp-brief-actions[hidden],
.ibp-brief-actions [hidden] {
  display: none;
}

.ibp-brief-actions [data-ibp-brief-next] {
  flex: 1 1 auto;
  justify-content: center;
}

/* ---------- mobile bar -------------------------------------------------- */

.ibp-mobilebar {
  display: none;
}

.ibp-access-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding: 16px 18px;
  border: 1px solid var(--ibp-rule);
  border-radius: var(--ibp-radius);
  color: var(--primary-color);
  background: var(--light-blue);
}

.ibp-access-banner[hidden],
.ibp-confirmation[hidden],
.ibp-honeypot {
  display: none;
}

.ibp-access-banner div {
  display: grid;
  gap: 2px;
}

.ibp-access-banner.is-ready {
  border-color: rgba(31, 143, 99, 0.4);
  background: var(--green-soft);
}

.ibp-access-banner.is-error {
  border-color: rgba(176, 42, 55, 0.35);
  background: var(--ibp-danger-soft);
}

.ibp-confirmation {
  margin-top: 28px;
  padding: clamp(24px, 5vw, 46px);
  border: 1px solid rgba(31, 143, 99, 0.28);
  border-radius: var(--ibp-radius);
  background: var(--green-soft);
  text-align: center;
}

.ibp-confirmation-icon {
  width: 54px;
  height: 54px;
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--green);
  font-size: 22px;
}

.ibp-confirmation h3 {
  margin-bottom: 10px;
  font-size: clamp(26px, 4vw, 38px);
}

.ibp-confirmation-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 22px;
}

.ibp-confirmation-actions[hidden],
.ibp-confirmation-actions [hidden] {
  display: none;
}

.ibp-form-msg.is-error {
  color: var(--ibp-danger);
  font-weight: 700;
}

/* Keep navigation in reach throughout the builder, including long hotel and
   day-planning steps. */
.ibp-sticky-actions {
  display: none;
  position: fixed;
  inset: auto 0 0 0;
  z-index: 1080;
  border-top: 1px solid var(--ibp-hair);
  animation: ibp-sticky-actions-in var(--ibp-slow) var(--ibp-ease) both;
}

.ibp-sticky-actions[hidden] {
  display: none;
}

.ibp-sticky-actions-inner {
  max-width: 1180px;
  min-height: 84px;
  margin: 0 auto;
  padding: 13px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.ibp-sticky-context {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 13px;
}

.ibp-sticky-icon {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  background: var(--primary-color);
  color: #fff;
  font-size: 13px;
}

.ibp-sticky-actions.is-stay-selected .ibp-sticky-icon {
  background: var(--green);
}

.ibp-sticky-context > span:last-child {
  min-width: 0;
  display: grid;
  grid-template-columns: auto auto;
  column-gap: 9px;
  align-items: baseline;
}

.ibp-sticky-context small {
  grid-column: 1 / -1;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ibp-sticky-actions.is-stay-selected .ibp-sticky-context small {
  color: var(--ibp-green-ink);
}

.ibp-sticky-context strong {
  min-width: 0;
  color: var(--primary-color);
  font-family: var(--font-primary);
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ibp-sticky-context em {
  color: var(--muted);
  font-size: 14px;
  font-style: normal;
  white-space: nowrap;
}

.ibp-sticky-actions .ibp-btn {
  flex: 0 0 auto;
}

@keyframes ibp-sticky-actions-in {
  from { opacity: 0; transform: translateY(100%); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- responsive -------------------------------------------------- */

@media (max-width: 1100px) {
  /* the brief collapses into a bottom sheet here, so it can't hold the nav */
  .ibp-sticky-actions {
    display: block;
  }

  .ibp-brief-actions {
    display: none;
  }

  .ibp-sticky-actions-inner {
    padding-bottom: calc(13px + env(safe-area-inset-bottom));
  }

  .ibp-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .ibp-brief {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 1200;
    background: var(--neutral-color);
    border: 0;
    padding: 26px 20px calc(24px + env(safe-area-inset-bottom));
    max-height: 84vh;
    overflow-y: auto;
    transform: translateY(101%);
    transition: transform var(--ibp-slow) var(--ibp-ease);
  }

  .ibp-brief.is-open {
    transform: translateY(0);
  }

  .ibp-brief-head {
    padding-inline-end: 48px;
  }

  .ibp-brief-close {
    display: block;
    position: absolute;
    z-index: 3;
    top: 16px;
    inset-inline-end: 16px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--ibp-hair);
    background: var(--neutral-color);
    color: var(--ink-soft);
    cursor: pointer;
  }

  /* On a phone the brief can't hold a column, so it becomes a live strip that
     stays on screen: the plan at a glance, each day tappable, total always up. */
  .ibp-mobilebar {
    display: none;
    position: fixed;
    inset: auto 0 0 0;
    z-index: 1100;
    background: var(--neutral-color);
    border-top: 1px solid var(--ibp-hair);
    padding: 0 0 env(safe-area-inset-bottom);
    box-shadow: 0 -4px 18px rgba(16, 22, 40, 0.06);
  }

  .ibp-ticker {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px 8px;
    border-bottom: 1px solid var(--ibp-hair);
  }

  .ibp-ticker-dots {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    scrollbar-width: none;
    flex: 1;
    min-width: 0;
    padding: 1px;
  }

  .ibp-ticker-dots::-webkit-scrollbar {
    display: none;
  }

  .ibp-ticker-dot {
    flex: 0 0 auto;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 1px solid var(--ibp-rule);
    background: none;
    color: var(--muted);
    font: inherit;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: background var(--ibp-fast) var(--ibp-ease),
                border-color var(--ibp-fast) var(--ibp-ease),
                color var(--ibp-fast) var(--ibp-ease);
  }

  .ibp-ticker-dot.is-filled {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
  }

  .ibp-ticker-dot:active {
    border-color: var(--tertiary-color);
  }

  .ibp-ticker-total {
    display: flex;
    align-items: baseline;
    gap: 7px;
    border: 0;
    background: none;
    padding: 0 0 0 10px;
    border-left: 1px solid var(--ibp-hair);
    font: inherit;
    font-size: 14px;
    color: var(--muted);
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .ibp-ticker-total b {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 16px;
    color: var(--secondary-color);
  }

  .ibp-ticker-total i {
    font-size: 9px;
    color: var(--mid-blue);
  }

  .ibp-mobilebar-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px 14px 11px;
  }

  .ibp-mobilebar-actions .ibp-btn-primary {
    flex: 1;
    justify-content: center;
  }

  .ibp-btn-sm {
    padding: 11px 20px;
    font-size: 14px;
  }

  .ibp-btn-sm[hidden] {
    display: none;
  }

  .ibp-progress-total {
    display: none;
  }
}

@media (max-width: 880px) {
  .ibp-masthead {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    padding: 32px 0;
  }

  .ibp-hero-note {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    padding: 0;
    border: 0;
  }

  .ibp-trip-search .ibp-counters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ibp-trip-search .ibp-counter + .ibp-counter {
    border-top: 0;
    border-left: 1px solid var(--ibp-hair);
    padding-left: 16px;
  }

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

  .ibp-choice-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ibp-field-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }

  .ibp-counters {
    grid-template-columns: minmax(0, 1fr);
  }

  .ibp-counter {
    padding-right: 0;
  }

  .ibp-counter + .ibp-counter {
    border-left: 0;
    border-top: 1px solid var(--ibp-hair);
    padding-left: 0;
  }

  .ibp-form-grid,
  .ibp-gate-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ibp-review-day {
    flex-direction: column;
    gap: 2px;
  }

  .ibp-review-day b {
    width: auto;
  }
}

@media (max-width: 640px) {
  .ibp-masthead {
    gap: 12px;
    padding: 24px 0 16px;
  }

  .ibp-masthead h1 {
    font-size: clamp(28px, 7.5vw, 32px);
  }

  .ibp-lede {
    margin-top: 8px;
    line-height: 1.5;
  }

  .ibp-hero-note {
    gap: 4px 16px;
    font-size: 12px;
  }

  .ibp-hero-note li {
    gap: 6px;
  }

  .ibp-hero-note i {
    flex-basis: 12px;
    width: 12px;
    height: 18px;
    background: none;
    font-size: 10px;
  }

  .ibp {
    font-size: 14.5px;
  }

  .ibp-activity-select-head,
  .ibp-schedule-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .ibp-activity-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ibp-activity-card {
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr);
  }

  .ibp-activity-media {
    height: 100%;
    min-height: 112px;
    aspect-ratio: auto;
  }

  .ibp-activity-card-copy {
    min-height: 112px;
    align-self: center;
    padding: 16px 14px;
  }



  .ibp-activity-description {
    display: none;
  }

  .ibp-shell,
  .ibp-progress-inner {
    padding: 0 18px;
  }

  .ibp-progress-steps {
    gap: 4px;
    padding: 8px 0;
  }

  .ibp-progress-steps button {
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-height: 56px;
    padding: 4px 2px;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
  }

  .ibp-step-number {
    flex-basis: 24px;
    width: 24px;
    height: 24px;
    font-size: 12px;
  }

  .ibp-progress {
    margin-bottom: 24px;
  }

  .ibp-step-head {
    margin-bottom: 16px;
  }

  .ibp-step-head h2 {
    font-size: 26px;
    line-height: 1.25;
  }

  .ibp-sticky-actions-inner {
    min-height: 0;
    padding: 11px 14px calc(11px + env(safe-area-inset-bottom));
    gap: 12px;
  }

  .ibp-sticky-icon {
    width: 30px;
    height: 30px;
  }

  .ibp-sticky-context {
    display: none;
  }

  .ibp-sticky-actions .ibp-btn {
    padding: 12px 14px;
    font-size: 14px;
  }

  .ibp-sticky-actions [data-ibp-sticky-next] {
    flex: 1 1 auto;
  }

  .ibp-hotel-body h3 {
    font-size: 14.5px;
  }

  .ibp-addon-grid,
  .ibp-picker-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ibp-timeline {
    --tl-indent: 26px;
  }

  .ibp-tl-day {
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 14px;
  }

  .ibp-timeline::before {
    left: 12px;
  }

  .ibp-tl-marker {
    width: 25px;
    height: 25px;
    font-size: 14px;
  }

  /* touch has no hover — keep the row tools visible */
  .ibp-day-item {
    display: grid;
    grid-template-columns: 18px 62px minmax(0, 1fr);
    gap: 5px 14px;
    align-items: start;
    padding: 14px 0;
  }

  .ibp-day-drag {
    grid-column: 1;
    grid-row: 1 / span 3;
    align-self: center;
  }

  .ibp-day-item img {
    grid-column: 2;
    grid-row: 1 / span 3;
    width: 62px;
    height: 62px;
  }

  .ibp-day-item-copy,
  .ibp-day-item-price,
  .ibp-day-item-tools {
    grid-column: 3;
  }

  .ibp-day-item-price {
    font-size: 14px;
  }

  .ibp-day-item-tools {
    opacity: 1;
    justify-content: flex-end;
  }

  .ibp-stay-choices {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .ibp-trip-search .ibp-field-row {
    gap: 12px;
    padding: 20px 18px;
  }

  .ibp-trip-search .ibp-counters {
    grid-template-columns: 1fr;
  }

  .ibp-trip-search .ibp-counter {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
  }

  .ibp-trip-search .ibp-counter + .ibp-counter {
    border-top: 1px solid var(--ibp-hair);
    border-left: 0;
    padding-left: 0;
  }

  .ibp-child-ages { grid-template-columns: 1fr; }
  .ibp-shabbat-prompt { grid-template-columns: 1fr; padding: 18px 16px; }
  .ibp-hotel-search-top { align-items: flex-start; flex-direction: column; gap: 10px; }
  .ibp-hotel-date-controls { grid-template-columns: 1fr; }
  .ibp .hotel-room-tabs { display: flex; overflow-x: auto; padding: 3px; scroll-snap-type: x proximity; }
  .ibp .hotel-room-tab { min-width: min(75vw, 210px); scroll-snap-align: start; }
  .ibp .hotel-room-option { grid-template-columns: 104px minmax(0, 1fr); }
  .ibp .hotel-room-option-photo { min-height: 0; max-height: none; aspect-ratio: 1 / 1; }
  .ibp .hotel-room-option-heading { padding: 14px; }
  .ibp .hotel-room-option-heading h4 { font-size: 15px; }
  .ibp .hotel-room-option-heading span { max-width: 118px; flex-basis: 118px; font-size: 14px; }
  .ibp .hotel-room-rate { grid-template-columns: 1fr; gap: 10px; padding: 16px; }
  .ibp .hotel-room-rate-price { min-height: 0; align-items: flex-start; text-align: left; }
  .ibp .hotel-room-book { width: 100%; }
}

/* ==========================================================================
   PANAMA PASSPORT TREATMENT
   An image-led, tactile layer for the live builder. The core controls and
   layout above stay deliberately simple; this layer makes the journey feel
   like travel before the visitor has picked a single date.
   ========================================================================== */


.ibp-photo-caption {
  inset: auto 26px 17px;
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.ibp-photo-caption span {
  color: var(--muted);
  font-family: var(--font-secondary);
  line-height: 1.35;
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

.ibp-photo-caption strong {
  color: var(--primary-color);
  font-family: var(--font-primary);
}

.ibp-stamp {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--secondary-color);
  box-shadow: 0 9px 24px rgba(30, 29, 73, 0.24);
  font-family: var(--font-primary);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
}

.ibp-stamp-top {
  top: -22px;
  right: 28px;
  width: 82px;
  height: 82px;
  border: 4px double rgba(255, 255, 255, 0.78);
  border-radius: 50%;
  transform: rotate(8deg);
}

.ibp-stamp-top b {
  font-size: 22px;
  line-height: 1;
}

.ibp-stamp-bottom {
  left: -26px;
  bottom: 52px;
  display: flex;
  gap: 7px;
  padding: 10px 14px;
  border: 2px solid #fff;
  border-radius: var(--ibp-radius-sm);
  background: var(--green);
  transform: rotate(-5deg);
}

.ibp-hero-mini {
  position: absolute;
  z-index: 1;
  top: 28px;
  right: -55px;
  width: 165px;
  height: 215px;
  padding: 8px 8px 34px;
  background: #fff;
  box-shadow: 0 22px 46px rgba(30, 29, 73, 0.17);
  transform: rotate(8deg);
}

.ibp-hero-mini img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.ibp-step-eyebrow {
  display: block;
  margin-bottom: 9px;
  color: var(--secondary-color);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ibp-step-head-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 0.66fr);
  gap: 28px;
}

.ibp-vibe {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(30, 29, 73, 0.1);
  overflow: hidden;
}

.ibp-vibe::after {
  content: "";
  position: absolute;
  inset: auto -14px -20px auto;
  width: 65px;
  height: 65px;
  border: 2px dashed rgba(181, 0, 97, 0.14);
  border-radius: 50%;
}

@keyframes ibp-vibe-pop {
  40% { transform: rotate(-1deg) scale(1.025); box-shadow: 0 18px 40px rgba(181, 0, 97, 0.14); }
}

.ibp-vibe-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
}

.ibp-vibe > span:last-child,
.ibp-vibe small,
.ibp-vibe strong,
.ibp-vibe em {
  display: block;
}

.ibp-vibe small {
  color: var(--secondary-color);
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.ibp-vibe strong {
  margin-top: 3px;
  color: var(--primary-color);
  font-family: var(--font-primary);
}

.ibp-vibe em {
  margin-top: 2px;
  color: var(--ink-soft);
  font-style: normal;
  line-height: 1.35;
}

.ibp .ibp-trip-choices {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  border: 0;
}

/* Five options don't divide evenly: fixed thirds with a centred last row read
   as deliberate, where a grid would leave a hole in the bottom-right cell. */
.ibp .ibp-trip-choices .ibp-choice {
  flex: 0 1 calc((100% - 28px) / 3);
  min-width: 190px;
}

@media (max-width: 880px) {
  .ibp .ibp-trip-choices .ibp-choice {
    flex: 0 1 calc((100% - 14px) / 2);
  }
}

@media (max-width: 520px) {
  .ibp .ibp-trip-choices .ibp-choice {
    flex: 1 1 100%;
  }
}

.ibp .ibp-visual-choice {
  display: block;
  padding: 0;
  border: 1px solid rgba(30, 29, 73, 0.1);
  background: #fff;
  overflow: hidden;
}


.ibp .ibp-visual-choice.is-on .ibp-choice-copy strong {
  color: var(--primary-color);
}

.ibp .ibp-visual-choice.is-on .ibp-choice-copy small {
  color: var(--ink-soft);
}

.ibp .ibp-visual-choice.is-on .ibp-choice-copy > i {
  color: var(--secondary-color);
}

.ibp-choice-photo {
  position: relative;
  display: block;
  aspect-ratio: 16 / 8.2;
  overflow: hidden;
  background: var(--light-blue);
}

.ibp-choice-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(12, 12, 12, 0.16);
  pointer-events: none;
}

.ibp-choice-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 600ms var(--ibp-ease), filter 300ms var(--ibp-ease);
}


.ibp-choice-check {
  position: absolute;
  z-index: 2;
  top: 12px;
  right: 12px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 2px solid #fff;
  border-radius: 50%;
  color: transparent;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 5px 16px rgba(12, 12, 12, 0.16);
  transition: color var(--ibp-fast), background var(--ibp-fast), transform var(--ibp-fast);
}

.ibp-visual-choice.is-on .ibp-choice-check {
  color: #fff;
  background: var(--secondary-color);
  transform: rotate(-7deg) scale(1.06);
}

.ibp-choice-copy {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  text-align: left;
}

.ibp-choice-copy > i {
  flex: 0 0 auto;
  margin: 3px 0 0;
}

.ibp-choice-copy > span,
.ibp-choice-copy strong,
.ibp-choice-copy small {
  display: block;
}

.ibp .ibp-choice-copy small {
  color: var(--ink-soft);
}

.ibp-review-collage {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr;
  gap: 7px;
  height: 185px;
  margin-bottom: 24px;
  padding: 7px;
  background: #fff;
  overflow: hidden;
}

.ibp-review-collage img {
  width: 100%;
  height: 100%;
  border-radius: var(--ibp-radius);
  object-fit: cover;
}

.ibp-review-collage img:first-child {
  grid-row: 1 / span 1;
}

.ibp-review-moment {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 28px;
  padding: 17px 19px;
  color: #fff;
  background: var(--primary-color);
}

.ibp-review-moment span,
.ibp-review-moment strong {
  display: block;
}

.ibp-review-moment span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.ibp-review-moment strong {
  margin-top: 3px;
  font-family: var(--font-primary);
  font-size: 18px;
}

.ibp-review-moment i {
  color: var(--secondary-color);
  font-size: 28px;
}

@media (max-width: 1260px) {
  .ibp-hero-mini { right: -18px; width: 130px; height: 175px; }
}

@media (max-width: 960px) {
  .ibp-hero-mini { display: none; }

  .ibp-step-head-split { grid-template-columns: minmax(0, 1fr); }
  .ibp-vibe { max-width: 460px; }
}

@media (max-width: 720px) {
  .ibp-stamp-top { width: 66px; height: 66px; top: -17px; right: 18px; }
  .ibp-stamp-top b { font-size: 17px; }
  .ibp-stamp-bottom { left: 7px; bottom: 47px; }
  .ibp-photo-caption { inset: auto 18px 13px; }

}

@media (max-width: 420px) {
  .ibp-vibe { }
  .ibp-choice-photo { aspect-ratio: 16 / 9; }
  .ibp-review-collage { grid-template-columns: 1.2fr 1fr; height: 170px; }
  .ibp-review-collage img:nth-child(3) { display: none; }
}

/* ==========================================================================
   PROFESSIONAL POLISH — live standard theme

   The live builder uses a deliberately restrained system: white surfaces,
   hairline borders, one accent color, and selection dots instead of decorative
   check medallions. Elevation is reserved for overlays that actually sit above
   the page. Keeping these overrides together also prevents older preview
   treatments from leaking back into the production theme.
   ========================================================================== */

.ibp {
  --ibp-surface-subtle: var(--color-neutral-light-gray);
  --ibp-border-strong: var(--color-neutral-medium-gray);
  background: var(--neutral-color);
}

.ibp-photo-caption {
  position: static;
  min-height: 68px;
  padding: 15px 18px;
  border-top: 1px solid var(--ibp-hair);
  align-items: center;
}

.ibp-photo-caption span {
  max-width: 24ch;
  font-size: 14px;
}

.ibp-photo-caption strong {
  max-width: 25ch;
  font-size: 15px;
  line-height: 1.35;
  text-align: right;
}

.ibp-hero-mini,
.ibp-stamp {
  display: none;
}


.ibp-layout {
  gap: 42px;
}

.ibp-step-head-split {
  align-items: start;
}

.ibp-vibe {
  min-height: 88px;
  padding: 15px 16px;
  border-color: var(--ibp-hair);
  border-radius: var(--ibp-radius);
  background: var(--ibp-surface-subtle);
  box-shadow: none;
}

.ibp-vibe::after {
  display: none;
}

.ibp-vibe.is-popping {
  animation: none;
}

.ibp-vibe-icon {
  width: 44px;
  height: 44px;
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius-sm);
  background: var(--neutral-color);
  box-shadow: none;
  color: var(--primary-color);
  font-size: 17px;
}

.ibp-vibe small {
  font-size: 14px;
}

.ibp-vibe strong {
  font-size: 15px;
}

.ibp-vibe em {
  font-size: 14px;
}

.ibp-field-label,
.ibp-select span,
.ibp .ibp-sub {
  font-size: 15px;
}

.ibp-stepper button {
  width: 48px;
  height: 48px;
}

.ibp-chip {
  min-height: 48px;
}

.ibp-icon-btn,
.ibp-brief-close,
.ibp .hotel-room-panel-close {
  min-width: 36px;
  min-height: 36px;
}

.ibp .ibp-trip-choices {
  gap: 14px;
}

.ibp .ibp-visual-choice {
  border-color: var(--ibp-hair);
  border-radius: var(--ibp-radius);
  box-shadow: none;
  transform: none;
}

.ibp .ibp-visual-choice:hover,
.ibp .ibp-visual-choice:focus-visible {
  border-color: var(--primary-color);
  box-shadow: none;
  transform: none;
}

.ibp .ibp-visual-choice.is-on {
  border-color: var(--primary-color);
  box-shadow: inset 0 0 0 1px var(--primary-color);
}

.ibp-choice-photo::after {
  display: none;
}

.ibp-visual-choice:hover .ibp-choice-photo img,
.ibp-visual-choice:focus-visible .ibp-choice-photo img,
.ibp-visual-choice.is-on .ibp-choice-photo img {
  transform: none;
}

.ibp-choice-indicator,
.ibp-choice-check,
.ibp-hotel-tick {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--primary-color);
  border-radius: 4px;
  background: var(--neutral-color);
  box-shadow: none;
}

.ibp-choice-indicator,
.ibp-choice-check {
  top: 12px;
  right: 12px;
  opacity: 0;
  transition: opacity var(--ibp-fast) var(--ibp-ease);
}

.ibp-choice-indicator::after,
.ibp-choice-check::after,
.ibp-hotel-tick::after {
  content: "\2713";
  color: var(--primary-color);
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
}

.ibp-choice-check i {
  display: none;
}

.ibp-visual-choice.is-on .ibp-choice-indicator,
.ibp-visual-choice.is-on .ibp-choice-check {
  opacity: 1;
  color: inherit;
  background: var(--neutral-color);
  transform: none;
}

.ibp-choice-copy {
  padding: 16px 17px 17px;
}

.ibp-hotel-tick {
  top: 10px;
  right: 10px;
  opacity: 0;
  transform: none;
}

.ibp-hotel.is-on .ibp-hotel-tick {
  opacity: 1;
  transform: none;
}

.ibp-hotel.is-on .ibp-hotel-media,
.ibp-hotel:focus-visible .ibp-hotel-media {
  box-shadow: inset 0 0 0 2px var(--primary-color);
}

.ibp-review-collage {
  border: 1px solid var(--ibp-hair);
  border-radius: var(--ibp-radius);
  box-shadow: none;
  transform: none;
}

.ibp-review-moment {
  border-radius: var(--ibp-radius);
}

.ibp-gate {
  border: 1px solid var(--ibp-hair);
  border-left: 3px solid var(--secondary-color);
  background: var(--ibp-surface-subtle);
}

.ibp-gate .ibp-field input:focus,
.ibp-field textarea:focus {
  box-shadow: none;
}

/* The sticky bar carries Back/Continue while it is on screen, so the in-flow
   row would duplicate it. It hides itself on review (step 4); keying this to
   the class the JS toggles leaves the in-flow Back button available there. */
.ibp-has-sticky-actions .ibp-actions {
  display: none;
}

.ibp-sticky-actions {
  background: var(--neutral-color);
  box-shadow: none;
  backdrop-filter: none;
}

.ibp-sticky-context {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  text-align: left;
}

.ibp-sticky-icon {
  border-radius: var(--ibp-radius);
}

.ibp-brief-scrim {
  display: none;
}

@media (max-width: 1100px) {
  /* Reserve the fixed controls' space after the footer as well as the form. */
  body.itinerary-builder-page .site-shell {
    padding-bottom: calc(112px + env(safe-area-inset-bottom));
  }

  body.itinerary-builder-page .whatsapp-float {
    display: none;
  }
}

.ibp-btn:focus-visible,
.ibp-chip:focus-visible,
.ibp-choice:focus-visible,
.ibp-stepper button:focus-visible,
.ibp-icon-btn:focus-visible,
.ibp-addon:focus-visible,
.ibp-linkbtn:focus-visible {
  outline: 2px solid var(--primary-color);
  outline-offset: 2px;
}

@media (max-width: 1100px) {
  body.ibp-brief-sheet-open {
    overflow: hidden;
  }

  .ibp-sticky-context {
    cursor: pointer;
    border-radius: var(--ibp-radius);
  }

  .ibp-sticky-context:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 3px;
  }

  .ibp-brief {
    border-top: 1px solid var(--ibp-hair);
    border-radius: 12px 12px 0 0;
    box-shadow: none;
  }

  .ibp-brief-jump,
  .ibp-brief-outline button,
  .ibp-brief-close {
    min-height: 44px;
  }

  .ibp-brief-close {
    min-width: 44px;
  }

  .ibp-brief.is-open + .ibp-brief-scrim {
    position: fixed;
    inset: 0;
    z-index: 1190;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(12, 12, 12, 0.38);
    cursor: pointer;
  }
}

@media (max-width: 720px) {
  .ibp-photo-caption {
    padding: 14px 15px;
  }

  .ibp-photo-caption span {
    display: none;
  }

  .ibp-photo-caption strong {
    max-width: none;
    text-align: left;
  }


  .ibp-vibe {
    max-width: none;
  }

  .ibp-chip {
    min-height: 48px;
  }
}

@media (max-width: 640px) {
  .ibp {
    padding-bottom: 92px;
  }

  .ibp-mobilebar {
    display: block;
    background: var(--neutral-color);
    box-shadow: none;
  }

  .ibp-sticky-actions {
    display: none;
  }

  .ibp-ticker {
    min-height: 48px;
    padding: 7px 14px;
  }

  .ibp-ticker-dots[hidden] {
    display: none;
  }

  .ibp-ticker-dot {
    width: 36px;
    height: 36px;
  }

  .ibp-ticker-total {
    min-height: 48px;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    margin-left: 0;
    padding: 0 10px;
    border: 1px solid var(--ibp-hair);
    border-radius: var(--ibp-radius);
    white-space: normal;
    text-align: center;
    line-height: 1.25;
  }

  .ibp-ticker-dots[hidden] + .ibp-ticker-total {
    width: 100%;
    justify-content: space-between;
    border-left: 0;
    padding-left: 0;
  }

  .ibp-mobilebar-actions {
    gap: 8px;
    padding: 9px 14px calc(9px + env(safe-area-inset-bottom));
  }

  .ibp-mobilebar-actions .ibp-btn {
    min-height: 48px;
    padding-inline: 10px;
    gap: 8px;
    justify-content: center;
  }

  .ibp-stepper button,
  .ibp-icon-btn,
  .ibp-brief-close,
  .ibp .hotel-room-panel-close,
  .ibp .hotel-room-book {
    min-width: 44px;
    min-height: 44px;
  }

  .ibp-field input,
  .ibp-field select,
  .ibp-field textarea,
  .ibp-select select,
  .ibp-hotel-select,
  .ibp-day-add {
    min-height: 44px;
  }

  .ibp-linkbtn {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-block: 8px;
  }

  .ibp button,
  .ibp a {
    touch-action: manipulation;
  }

  .ibp-mobilebar-actions [data-ibp-back-mobile] {
    flex: 0 0 auto;
  }

  .ibp-mobilebar-actions:has([data-ibp-back-mobile]:not([hidden])) {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.3fr);
  }

  .ibp-hotel-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .ibp-filter-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 12px;
  }

  .ibp-select {
    min-width: 0;
  }

  .ibp-toggles {
    grid-column: 1 / -1;
  }

  .ibp-brief {
    max-height: min(82vh, 720px);
    padding: 24px 18px calc(22px + env(safe-area-inset-bottom));
  }

}

@media (max-width: 420px) {


  .ibp-vibe {
    align-items: center;
  }

  .ibp-vibe-icon {
    width: 42px;
    height: 42px;
    font-size: 16px;
  }
}

/* Give every trip question the same readable layout and spacing. */
.ibp .ibp-trip-search {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
  background: transparent;
  margin: 0;
}
.ibp .ibp-question {
  padding: 24px;
  margin: 0 0 20px;
  border: 1px solid var(--ibp-rule);
  border-radius: 12px;
  background: var(--neutral-color);
}
.ibp .ibp-question-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.35;
  margin: 0 0 12px;
}
.ibp-question-title > span {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--light-blue);
  color: var(--primary-color);
  font-family: var(--font-secondary);
  font-size: 15px;
}
.ibp .ibp-question-hint {
  display: block;
  margin: 0 0 16px;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.5;
}
.ibp .ibp-trip-search .ibp-flex-chips {
  border: 0;
  padding: 0;
}
.ibp .ibp-trip-search .ibp-chip {
  min-height: 52px;
  border: 1px solid var(--ibp-rule);
  border-radius: 8px;
  background: var(--light-blue);
  line-height: 1.35;
}
.ibp .ibp-trip-search .ibp-chip.is-on {
  border-color: var(--primary-color);
  background: var(--primary-color);
  color: var(--neutral-color);
  box-shadow: none;
}
.ibp .ibp-trip-search-content { min-height: 0; }
.ibp .ibp-trip-search .ibp-field-row {
  padding: 20px 0 0;
  gap: 12px 16px;
}
.ibp .ibp-trip-search .ibp-field-label {
  color: var(--primary-color);
  font-size: 15px;
  letter-spacing: 0;
  text-transform: none;
}
.ibp .ibp-trip-search .ibp-field-dates input {
  width: 100%;
  min-height: 54px;
  padding: 12px 14px;
  border: 1px solid var(--ibp-rule);
  border-radius: 8px;
  font-size: 17px;
}
.ibp .ibp-trip-search .ibp-counters {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  border: 0;
  margin: 0;
}
.ibp .ibp-trip-search .ibp-counter,
.ibp .ibp-trip-search .ibp-counter + .ibp-counter {
  padding: 16px;
  border: 1px solid var(--ibp-rule);
  border-radius: 8px;
  background: var(--light-blue);
  gap: 16px;
  min-width: 0;
}
.ibp .ibp-counter strong { font-size: 17px; font-weight: 700; }
.ibp .ibp-counter small { display: block; margin-top: 4px; }
.ibp .ibp-stepper { gap: 6px; }
.ibp .ibp-stepper button { flex: 0 0 44px; width: 44px; height: 44px; }
.ibp .ibp-trip-search .ibp-child-ages {
  grid-template-columns: 1fr;
  margin: 16px 0 0;
}
.ibp .ibp-trip-search .ibp-trip-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 0;
  gap: 12px;
}
.ibp .ibp-trip-choices .ibp-choice {
  min-height: 102px;
  min-width: 0;
  align-items: center;
  padding: 16px;
  padding-inline-end: 38px;
}
.ibp .ibp-trip-choices .ibp-choice:last-child { grid-column: 1 / -1; }
.ibp .ibp-trip-choices .ibp-choice.is-on::after {
  content: "✓";
  position: absolute;
  inset-inline-end: 14px;
  top: 16px;
  color: var(--neutral-color);
  font-weight: 700;
}
.ibp .ibp-question-meals .ibp-shabbat-prompt { margin-bottom: 0; }
.ibp .ibp-filter-options {
  margin: 20px 0;
  border: 1px solid var(--ibp-rule);
  border-radius: 8px;
  padding: 16px;
}
.ibp-filter-options > summary {
  cursor: pointer;
  color: var(--primary-color);
  font-size: 16px;
  font-weight: 700;
}
.ibp-filter-options > summary span {
  margin-inline-start: 8px;
  color: var(--muted);
  font-weight: 400;
  font-size: 14px;
}
.ibp-filter-options[open] > summary { margin-bottom: 18px; }
.ibp[data-ibp-current-step="0"] .ibp-brief-section,
.ibp[data-ibp-current-step="0"] .ibp-brief-total { display: none; }
.ibp .ibp-choice:focus-visible,
.ibp .ibp-chip:focus-visible,
.ibp .ibp-btn:focus-visible,
.ibp-filter-options > summary:focus-visible {
  outline: 3px solid var(--secondary-color);
  outline-offset: 3px;
}
@media (max-width: 767px) {
  .ibp .ibp-question { padding: 16px; margin-bottom: 16px; }
  .ibp .ibp-question-title { font-size: 19px; }
  .ibp .ibp-trip-search .ibp-flex-chips > div,
  .ibp .ibp-flex-chips > .ibp-question-hint { display: none; }
  .ibp-flex-select { display: grid; gap: 8px; }
  .ibp .ibp-trip-search .ibp-field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 16px; }
  .ibp .ibp-trip-search .ibp-field-dates input { min-height: 50px; padding: 12px 8px; font-size: 16px; }
  .ibp .ibp-trip-search .ibp-field-label { font-size: 14px; }
  .ibp .ibp-trip-search .ibp-counters { grid-template-columns: 1fr; }
  .ibp .ibp-trip-search .ibp-counter {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .ibp .ibp-stepper { width: 140px; flex: 0 0 140px; }
  .ibp .ibp-trip-search .ibp-trip-choices { grid-template-columns: 1fr; }
  .ibp .ibp-trip-choices .ibp-choice:last-child { grid-column: auto; }
  .ibp .ibp-trip-choices .ibp-choice { min-height: 88px; }
}


.ibp .ibp-trip-search .ibp-field-dates[hidden] { display: none; }

.ibp .ibp-meal-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ibp .ibp-meal-choices .ibp-chip { border-radius: 8px; min-height: 54px; white-space: normal; }
.ibp[data-ibp-current-step="0"] .ibp-ticker-total b { display: none; }
@media (max-width: 767px) {
  .ibp .ibp-meal-choices { grid-template-columns: 1fr; }
}