/* Font is loaded by theme/Elementor (self-hosted). */
  /* ---------------------------
     Base + layout
  --------------------------- */

  .tlx-consult-shell {
    font-family: 'Nunito Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  .tlx-consult-container {
    max-width: 960px;
    margin: 0px auto;
    padding: 0 16px;
  }

  /* Progress header ABOVE card */
  .tlx-progress-header {
    max-width: 960px;
    margin: 0 auto 16px;
    padding: 0 16px;
  }

  .tlx-progress-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #121212;
  }

  .tlx-progress-bar {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: #F0F2F4;
    overflow: hidden;
  }

  .tlx-progress-fill {
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: #8AC48B;
    transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .tlx-consult-card {
    background: #F9F9F9;
    border: 1px solid #EEEFF0;
    border-radius: 32px;
    padding: 32px 32px 24px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
  }

  @media (min-width: 1024px) {
    .tlx-consult-card {
      padding: 40px 48px 32px;
    }
  }

  .tlx-consult-body {
    position: relative;
    min-height: 260px;
  }

  /* ---------------------------
     Steps + transitions
  --------------------------- */
  .tlx-consult-step {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: translateY(16px);
    pointer-events: none;
    transition:
      opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
      transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .tlx-consult-step.is-active {
    position: relative;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }

  .tlx-step-title {
    font-size: 26px;
    line-height: 1.25;
    font-weight: 600;
    color: #121212;
    margin-bottom: 4px;
  }

  .tlx-step-subtitle {
    font-size: 14px;
    color: #121212;
    margin-bottom: 24px;
  }

  /* staggered children */
  .tlx-anim-item {
    opacity: 0;
    transform: translateY(12px);
  }

  .tlx-consult-step.is-active .tlx-anim-item {
    opacity: 1;
    transform: translateY(0);
    transition:
      opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
      transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }

  /* ---------------------------
     Service cards (step 1)
  --------------------------- */
  .tlx-service-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
  }

  .tlx-consult-step[data-step="1"].is-active {
    min-height: 290px;
    display: flex;
    flex-direction: column;
  }

  .tlx-consult-step[data-step="1"].is-active .tlx-service-list {
    margin-top: auto;
    margin-bottom: auto;
  }

  .tlx-service-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 20px;
    border-radius: 18px;
    border: 1px solid #EEEFF0;
    background: #FFFFFF;
    cursor: pointer;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      transform 0.15s ease;
  }

  .tlx-service-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .tlx-service-title {
    font-size: 15px;
    font-weight: 500;
    color: #000000;
  }

  .tlx-service-desc {
    font-size: 13px;
    color: #646C78;
    font-weight: 400;
  }

  .tlx-service-check {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid #EEEFF0;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #FFFFFF;
    flex-shrink: 0;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      color 0.2s ease;
  }

  /* hover for unselected service card – same feel as pills */
  .tlx-service-card:hover {
    border-color: #D2D7E0;
    background: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15,23,42,0.05);
  }

  .tlx-service-card.tlx-selected,
  .tlx-service-card.tlx-selected:hover {
    border-width: 2px;
    border-color: #8AC48B !important;
    background: #E6F0EA !important;
    box-shadow: none !important;
    transform: translateY(-1px);
  }

  .tlx-service-card.tlx-selected .tlx-service-check,
  .tlx-service-card.tlx-selected:hover .tlx-service-check {
    background: #8AC48B !important;
    border-color: #8AC48B !important;
    color: #FFFFFF !important;
  }

  .tlx-service-checkbox {
    display: none;
  }

  /* ---------------------------
     Inputs (step 2)
  --------------------------- */
  .tlx-field-group {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 24px;
  }

  .tlx-field-label {
    font-size: 14px;
    font-weight: 600;
    color: #121212;
    margin-bottom: 4px;
  }

  .tlx-input-wrap {
    border-radius: 16px;
    background: #F9FAFB;
    border: 1px solid #E1E3E8;
    padding: 10px 14px;
    transition:
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      background 0.2s ease;
  }

  .tlx-input {
    width: 100%;
    border: none !important;
    outline: none !important;
    background: transparent;
    font-size: 14px;
    color: #121212;
    font-family: inherit;
  }

  .tlx-input::placeholder {
    color: #B0B5BF;
  }

  .tlx-input-wrap:focus-within {
    border-color: #8AC48B;
    background: #FFFFFF;
    box-shadow: 0 0 0 1px rgba(138,196,139,0.35);
  }

  .tlx-input-wrap.is-invalid {
    border-color: #F97373;
    background: #FFFFFF;
    box-shadow: 0 0 0 1px rgba(249,115,115,0.35);
  }

  .tlx-field-hint {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.4;
    color: #F97373;
    display: none;
  }

  .tlx-field-hint.is-visible {
    display: block;
  }

  /* Company size pills 2x2 */
  .tlx-size-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .tlx-pill {
    border-radius: 18px;
    border: 1px solid #EEEFF0;
    background: #FFFFFF;
    font-size: 14px;
    padding: 20px 12px;
    text-align: center;
    cursor: pointer;
    color: #121212;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      color 0.2s ease,
      transform 0.15s ease;
  }

  .tlx-pill:hover {
    border-color: #D2D7E0 !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(15,23,42,0.05);
    transform: translateY(-1px);
    color: #121212 !important;
  }

  .tlx-pill.tlx-selected,
  .tlx-pill.tlx-selected:hover {
    border-width: 2px;
    border-color: #8AC48B !important;
    background: #E6F0EA !important;
    box-shadow: none !important;
    color: #121212 !important;
    transform: translateY(-1px);
  }

  .tlx-pill-input {
    display: none;
  }

  /* ---------------------------
     Calendar (step 3)
  --------------------------- */
  .tlx-date-time-layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  @media (min-width: 900px) {
    .tlx-date-time-layout {
      flex-direction: row;
      align-items: flex-start;
    }
  }

  .tlx-calendar-card,
  .tlx-time-card {
    flex: 1;
  }

  .tlx-calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
  }

  .tlx-calendar-caption {
    font-size: 14px;
    font-weight: 600;
    color: #121212;
  }

  .tlx-cal-nav-btn {
    all: unset;
    cursor: pointer;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF !important;
    border: 1px solid #E1E3E8 !important;
    color: #121212 !important;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      transform 0.15s ease;
  }

  .tlx-cal-nav-btn:hover {
    background: #F3F5F8 !important;
    border-color: #D2D7E0 !important;
    transform: translateY(-1px);
    color: #121212 !important;
  }

  .tlx-cal-nav-btn:focus,
  .tlx-cal-nav-btn:active {
    background: #FFFFFF !important;
    border-color: #E1E3E8 !important;
    box-shadow: none !important;
    color: #121212 !important;
    transform: none;
  }

  .tlx-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    font-size: 12px;
  }

  .tlx-calendar-day-label {
    text-align: center;
    padding: 4px 0;
    color: #9AA0AB;
    font-weight: 500;
  }

  .tlx-calendar-date {
    border-radius: 999px;
    padding: 6px 0;
    text-align: center;
    cursor: pointer;
    border: 1px solid transparent;
    background: transparent;
    color: #121212;
    transition:
      background 0.15s ease,
      border-color 0.15s ease,
      color 0.15s ease,
      transform 0.15s ease,
      box-shadow 0.15s ease;
  }

  .tlx-calendar-date:hover {
    background: #F3F5F8;
    color: #121212;
  }

  .tlx-calendar-date.tlx-disabled {
    cursor: default;
    color: #D2D6DE;
  }

  .tlx-calendar-date.tlx-disabled:hover {
    background: transparent;
  }

  .tlx-calendar-date.tlx-selected,
  .tlx-calendar-date.tlx-selected:hover {
    background: #8AC48B !important;
    color: #FFFFFF !important;
    border-color: #8AC48B !important;
    transform: translateY(-1px);
    box-shadow: none !important;
  }

  .tlx-calendar-date.tlx-today:not(.tlx-selected):not(.tlx-disabled) {
    border-color: #D2D7E0;
  }

  /* Time pills */
  .tlx-time-label {
    font-size: 14px;
    font-weight: 600;
    color: #121212;
    margin-bottom: 2px;
  }

  .tlx-time-helper {
    font-size: 12px;
    line-height: 1.4;
    font-weight: 400;
    color: #98A2B3;
    margin: 0 0 10px;
  }

  .tlx-time-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  @media (min-width: 600px) {
    .tlx-time-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  .tlx-time-pill {
    border-radius: 18px;
    border: 1px solid #EEEFF0;
    background: #FFFFFF;
    font-size: 14px;
    padding: 8px 10px;
    text-align: center;
    cursor: pointer;
    color: #121212;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      color 0.2s ease,
      transform 0.15s ease;
  }

  .tlx-time-pill:hover {
    border-color: #D2D7E0 !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(15,23,42,0.05);
    transform: translateY(-1px);
    color: #121212 !important;
  }

  .tlx-time-pill.tlx-selected,
  .tlx-time-pill.tlx-selected:hover {
    border-width: 2px;
    border-color: #8AC48B !important;
    background: #E6F0EA !important;
    box-shadow: none !important;
    color: #121212 !important;
    transform: translateY(-1px);
  }

  /* ---------------------------
     Footer buttons
  --------------------------- */
  .tlx-consult-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #E1E3E8;
    gap: 16px;
  }

  .tlx-btn {
    all: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition:
      background 0.2s ease,
      color 0.2s ease,
      transform 0.15s ease,
      box-shadow 0.2s ease;
  }

  .tlx-btn:focus-visible {
    outline: 2px solid #8AC48B;
    outline-offset: 2px;
  }

  .tlx-btn-icon-left {
    margin-right: 6px;
  }

  .tlx-btn-icon-right {
    margin-left: 6px;
  }

  .tlx-btn-back {
    color: #121212 !important;
    background: transparent !important;
    padding-left: 0;
  }

  .tlx-btn-back:hover {
    transform: translateX(-1px);
  }

  .tlx-btn-next {
    background: #E6F0EA !important;
    color: #8AC48B !important;
    min-width: 140px;
    justify-content: center;
    box-shadow: none !important;
  }

  .tlx-btn-next.tlx-active {
    background: #8AC48B !important;
    color: #FFFFFF !important;
  }

  .tlx-btn-next:hover {
    background: #8AC48B !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
    transform: translateY(-1px);
  }

  .tlx-btn-next.tlx-disabled {
    opacity: 0.5;
    cursor: default;
    background: #E6F0EA !important;
    color: #8AC48B !important;
  }

  .tlx-btn-next.tlx-disabled:hover {
    background: #E6F0EA !important;
    color: #8AC48B !important;
    box-shadow: none !important;
    transform: none;
  }

  /* Popup thank-you "Close" button: keep it clean and prevent Elementor/theme
     hover/active/focus paints (while preserving an accessible focus state). */
  .tlx-popup-close-btn{
    -webkit-tap-highlight-color: transparent;
    background: transparent !important;
    color: #121212 !important;
    box-shadow: none !important;
    filter: none !important;
  }
  .tlx-popup-close-btn:hover,
  .tlx-popup-close-btn:active,
  .tlx-popup-close-btn:focus{
    background: transparent !important;
    color: #121212 !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    outline: none !important;
  }
  .tlx-popup-close-btn:focus-visible{
    outline: 2px solid #8AC48B !important;
    outline-offset: 2px !important;
  }

  .tlx-btn-back.tlx-hidden {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }

  /* ---------------------------
     Thank-you screen
  --------------------------- */
  .tlx-consult-thankyou {
    display: none;
    text-align: center;
    padding: 24px 8px 8px;
    animation: tlx-card-in 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .tlx-consult-thankyou.is-visible {
    display: block;
  }

  @keyframes tlx-card-in {
    from {
      opacity: 0;
      transform: scale(0.96);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }

  .tlx-thanks-icon-wrap {
    width: 88px;
    height: 88px;
    border-radius: 999px;
    background: #E6F0EA;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    animation: tlx-bounce-in 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  }

  .tlx-thanks-icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 3px solid #8AC48B;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8AC48B;
    font-size: 26px;
    font-weight: 700;
  }

  @keyframes tlx-bounce-in {
    0% { transform: scale(0); }
    60% { transform: scale(1.07); }
    100% { transform: scale(1); }
  }

  .tlx-thanks-title,
  .tlx-thanks-subtitle,
  .tlx-thanks-details,
  .tlx-thanks-next {
    opacity: 0;
    transform: translateY(16px);
    animation: tlx-thanks-in 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .tlx-thanks-title { animation-delay: .20s; }
  .tlx-thanks-subtitle { animation-delay: .30s; }
  .tlx-thanks-details { animation-delay: .40s; }
  .tlx-thanks-next { animation-delay: .50s; }

  @keyframes tlx-thanks-in {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .tlx-thanks-title {
    font-size: 32px;
    font-weight: 700;
    color: #121212;
    margin-bottom: 8px;
  }

  .tlx-thanks-subtitle {
    font-size: 16px;
    color: #646C78;
    margin-bottom: 24px;
  }

  .tlx-thanks-details {
    background: #F3F4F6;
    border-radius: 24px;
    padding: 18px 20px;
    margin: 0 auto 20px;
    max-width: 520px;
  }

  .tlx-thanks-details-title {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #7A808C;
    font-weight: 600;
    margin-bottom: 10px;
  }

  .tlx-thanks-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    color: #121212;
    margin-bottom: 6px;
  }

  .tlx-thanks-row:last-child {
    margin-bottom: 0;
  }

  .tlx-thanks-icon-img {
    width: 20px;
    height: 20px;
  }

  .tlx-thanks-next {
    max-width: 520px;
    margin: 0 auto 8px;
    text-align: left;
  }

  .tlx-thanks-next h3 {
    font-size: 15px;
    font-weight: 600;
    color: #121212;
    margin-bottom: 8px;
  }

  .tlx-thanks-next ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .tlx-thanks-next li {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 14px;
    color: #646C78;
    margin-bottom: 6px;
  }

  .tlx-thanks-check {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: #E6F0EA;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #8AC48B;
    margin-top: 2px;
  }

  /* ---------------------------
     NEW: Loading screen
  --------------------------- */
  .tlx-consult-loading {
    display: none;
    text-align: center;
    padding: 36px 8px 8px;
  }

  .tlx-consult-loading.is-visible {
    display: block;
    animation: tlx-loading-in 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .tlx-loading-icon-wrap {
    width: 80px;
    height: 80px;
    border-radius: 999px;
    background: #E6F0EA;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
  }

  .tlx-loading-spinner {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 3px solid #CDE4CF;
    border-top-color: #8AC48B;
    animation: tlx-spin 0.9s linear infinite;
  }

  .tlx-loading-title,
  .tlx-loading-sub {
    opacity: 0;
    transform: translateY(10px);
    animation: tlx-loading-text-in 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .tlx-loading-title {
    font-size: 22px;
    font-weight: 600;
    color: #121212;
    margin-bottom: 6px;
    animation-delay: .10s;
  }

  .tlx-loading-sub {
    font-size: 14px;
    color: #646C78;
    animation-delay: .18s;
  }

  @keyframes tlx-spin {
    to { transform: rotate(360deg); }
  }

  @keyframes tlx-loading-in {
    from {
      opacity: 0;
      transform: scale(0.96);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }

  @keyframes tlx-loading-text-in {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* ---------------------------
     NEW: Error screen
  --------------------------- */
  .tlx-consult-error {
    display: none;
    text-align: center;
    padding: 36px 8px 8px;
  }

  .tlx-consult-error.is-visible {
    display: block;
    animation: tlx-loading-in 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .tlx-error-icon-wrap {
    width: 80px;
    height: 80px;
    border-radius: 999px;
    background: #FEECEC;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
  }

  .tlx-error-icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 3px solid #F97373;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F97373;
    font-size: 22px;
    font-weight: 700;
  }

  .tlx-error-title {
    font-size: 22px;
    font-weight: 600;
    color: #121212;
    margin-bottom: 8px;
  }

  .tlx-error-sub {
    font-size: 14px;
    color: #646C78;
    margin-bottom: 18px;
  }

  .tlx-error-btn {
    all: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    background: #E6F0EA;
    color: #8AC48B;
    transition:
      background 0.2s ease,
      color 0.2s ease,
      transform 0.15s ease;
  }

  .tlx-error-btn:hover {
    background: #8AC48B;
    color: #FFFFFF;
    transform: translateY(-1px);
  }


  /* Small inline spinner when loading times for a date */
  .tlx-time-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
  }

  .tlx-time-loading-spinner {
    width: 26px;
    height: 26px;
    border-radius: 999px;
    border: 3px solid #CDE4CF;
    border-top-color: #8AC48B;
    animation: tlx-spin 0.9s linear infinite;
  }


  /* Empty states for time grid */
  .tlx-time-empty {
    font-size: 13px;
    color: #9AA0AB;
    line-height: 1.5;
  }


  /* ---------------------------
     Misc / reset
  --------------------------- */
  .tlx-consult-hidden {
    display: none;
  }

  /* Remove Hello Elementor effects */
  .tlx-consult-card button,
  .tlx-consult-card .tlx-pill,
  .tlx-consult-card .tlx-time-pill,
  .tlx-consult-card .tlx-service-card,
  .tlx-consult-card .tlx-cal-nav-btn,
  .tlx-consult-card .tlx-calendar-date {
    background-image: none !important;
    filter: none !important;
  }

  .tlx-consult-card button::before,
  .tlx-consult-card button::after,
  .tlx-consult-card .tlx-pill::before,
  .tlx-consult-card .tlx-pill::after,
  .tlx-consult-card .tlx-time-pill::before,
  .tlx-consult-card .tlx-time-pill::after,
  .tlx-consult-card .tlx-service-card::before,
  .tlx-consult-card .tlx-service-card::after,
  .tlx-consult-card .tlx-calendar-date::before,
  .tlx-consult-card .tlx-calendar-date::after,
  .tlx-consult-card .tlx-cal-nav-btn::before,
  .tlx-consult-card .tlx-cal-nav-btn::after {
    content: none !important;
  }

  .tlx-consult-card button,
  .tlx-consult-card button:hover,
  .tlx-consult-card button:focus,
  .tlx-consult-card button:active {
    box-shadow: none !important;
  }
		 
		 /* ============================
   NEW — Disabled Time Slot Styling
   ============================ */

.tlx-time-pill.tlx-disabled {
  border-color: #E1E3E8 !important;
  background: #F3F4F6 !important;
  color: #B0B5BF !important;
  cursor: not-allowed;
  position: relative;
  box-shadow: none !important;
  transform: none !important;
}

.tlx-time-pill.tlx-disabled:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* Tooltip bubble on hover */
.tlx-time-pill.tlx-disabled::after {
  content: 'Time slot is booked';
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 8px);
  background: #111827;
  color: #FFFFFF;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  z-index: 10;
}

.tlx-time-pill.tlx-disabled:hover::after {
  opacity: 1;
  transform: translate(-50%, -2px);
}


/* =========================================================
   HERO (glass variant) — make it look premium
   Only applies to .tlx-variant-glass instance
========================================================= */

.tlx-variant-glass .tlx-consult-container {
  /* tighter feel in hero if needed */
  padding: 0 0px;
}

/* Main glass card */
.tlx-variant-glass .tlx-consult-card {
background: rgb(17 19 18) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;

  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;

  box-shadow:
    0 22px 70px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;

  overflow: hidden;
}

/* Soft “sheen” */
.tlx-variant-glass .tlx-consult-card::before {
  content: "";
  position: absolute;
  inset: -2px;
  pointer-events: none;
  border-radius: inherit;
  background:
    radial-gradient(900px 360px at 18% 0%, rgba(255,255,255,0.22), transparent 55%),
    radial-gradient(700px 300px at 95% 18%, rgba(255,255,255,0.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,0.06), transparent 55%);
  opacity: 1;
}

/* Ensure content is above sheen */
.tlx-variant-glass .tlx-consult-body,
.tlx-variant-glass .tlx-consult-footer,
.tlx-variant-glass .tlx-progress-header--inside {
  position: relative;
  z-index: 1;
  
}

/* Progress header tweaks */
.tlx-variant-glass .tlx-progress-meta {
  color: rgba(255, 255, 255, 0.82);
}

.tlx-variant-glass .tlx-progress-bar {
  background: rgba(255, 255, 255, 0.14);
}

.tlx-variant-glass .tlx-progress-fill {
  /* keep your green, but slightly glow */
  box-shadow: 0 0 0 1px rgba(138,196,139,0.35), 0 10px 24px rgba(138,196,139,0.22);
}

/* Titles in hero should be bright */
.tlx-variant-glass .tlx-step-title,
.tlx-variant-glass .tlx-step-subtitle,
.tlx-variant-glass .tlx-field-label,
.tlx-variant-glass .tlx-time-label {
  color: rgba(255, 255, 255, 0.92);
}

.tlx-variant-glass .tlx-step-subtitle {
  color: rgba(255, 255, 255, 0.70);
}

/* Service cards become frosted instead of solid white */
.tlx-variant-glass .tlx-service-card {
  background: rgba(255, 255, 255, 0.10) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  box-shadow: 0 10px 28px rgba(0,0,0,0.18);
}

.tlx-variant-glass .tlx-service-title {
  color: rgba(255, 255, 255, 0.92);
}

.tlx-variant-glass .tlx-service-desc {
  color: rgba(255, 255, 255, 0.68);
}

.tlx-variant-glass .tlx-service-check {
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.22);
}

/* Hover: lift + brighten */
.tlx-variant-glass .tlx-service-card:hover {
  border-color: rgba(255,255,255,0.30) !important;
  background: rgba(255,255,255,0.14) !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 38px rgba(0,0,0,0.28);
}

/* Selected: keep your green system, but blend into glass */
.tlx-variant-glass .tlx-service-card.tlx-selected,
.tlx-variant-glass .tlx-service-card.tlx-selected:hover {
  border-color: rgba(138,196,139,0.85) !important;
  background: rgba(138,196,139,0.18) !important;
  box-shadow: 0 16px 46px rgba(0,0,0,0.30);
}

.tlx-variant-glass .tlx-service-card.tlx-selected .tlx-service-check {
  background: rgba(138,196,139,0.95) !important;
  border-color: rgba(138,196,139,0.95) !important;
  color: #fff !important;
}

/* Inputs in hero */
.tlx-variant-glass .tlx-input-wrap {
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
}

.tlx-variant-glass .tlx-input {
  color: rgba(255,255,255,0.92);
}

.tlx-variant-glass .tlx-input::placeholder {
  color: rgba(255,255,255,0.45);
}

.tlx-variant-glass .tlx-input-wrap:focus-within {
  border-color: rgba(138,196,139,0.85);
  box-shadow: 0 0 0 1px rgba(138,196,139,0.35);
  background: rgba(255,255,255,0.14);
}

.tlx-variant-glass .tlx-input-wrap.is-invalid {
  border-color: rgba(249,115,115,0.85);
  box-shadow: 0 0 0 1px rgba(249,115,115,0.35);
  background: rgba(255,255,255,0.12);
}

.tlx-variant-glass .tlx-field-hint {
  color: rgba(255,204,204,0.9);
}

/* Pills / time pills in hero */
.tlx-variant-glass .tlx-pill,
.tlx-variant-glass .tlx-time-pill {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.88) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.16);
}

.tlx-variant-glass .tlx-pill:hover,
.tlx-variant-glass .tlx-time-pill:hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.30) !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 38px rgba(0,0,0,0.24);
}

.tlx-variant-glass .tlx-pill.tlx-selected,
.tlx-variant-glass .tlx-time-pill.tlx-selected {
  background: rgba(138,196,139,0.18) !important;
  border-color: rgba(138,196,139,0.85) !important;
  color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,0.28);
}

/* Footer divider line in hero */
.tlx-variant-glass .tlx-consult-footer {
  border-top-color: rgba(255,255,255,0.18);
}

/* Buttons: keep your system but make it feel richer on dark bg */
.tlx-variant-glass .tlx-btn-back {
  color: rgba(255,255,255,0.85) !important;
}

.tlx-variant-glass .tlx-btn-next {
  background: rgba(138,196,139,0.20) !important;
  color: rgba(255,255,255,0.85) !important;
}

.tlx-variant-glass .tlx-btn-next.tlx-active {
  background: rgba(138,196,139,0.95) !important;
  color: #fff !important;
  box-shadow: 0 16px 44px rgba(138,196,139,0.25);
}

/* Calendar bits readable on dark */
.tlx-variant-glass .tlx-calendar-caption {
  color: rgba(255,255,255,0.85);
}

.tlx-variant-glass .tlx-calendar-day-label {
  color: rgba(255,255,255,0.55);
}

.tlx-variant-glass .tlx-calendar-date {
  color: rgba(255,255,255,0.85);
}

.tlx-variant-glass .tlx-calendar-date:hover {
  background: rgba(255,255,255,0.12);
}

.tlx-variant-glass .tlx-calendar-date.tlx-disabled {
  color: rgba(255,255,255,0.25);
}

.tlx-variant-glass .tlx-cal-nav-btn {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.90) !important;
}

.tlx-variant-glass .tlx-cal-nav-btn:hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.30) !important;
}

.tlx-variant-glass .tlx-progress-header.tlx-progress-header--inside {
  padding: 0;
}

/* Glass: Step 3 layout should be stacked (calendar above times) */
.tlx-variant-glass .tlx-date-time-layout {
  flex-direction: column;
  align-items: stretch;
}

@media (min-width: 900px) {
  .tlx-variant-glass .tlx-date-time-layout {
    flex-direction: column;
    align-items: stretch;
  }
}

/* Glass: make empty-state text readable */
.tlx-variant-glass .tlx-time-empty {
  color: rgba(255, 255, 255, 0.60);
}

/* Glass: loading / error / success screens should match dark hero */
.tlx-variant-glass .tlx-loading-title,
.tlx-variant-glass .tlx-error-title,
.tlx-variant-glass .tlx-thanks-title {
  color: rgba(255, 255, 255, 0.92);
}

.tlx-variant-glass .tlx-loading-sub,
.tlx-variant-glass .tlx-error-sub,
.tlx-variant-glass .tlx-thanks-subtitle {
  color: rgba(255, 255, 255, 0.70);
}

.tlx-variant-glass .tlx-loading-icon-wrap,
.tlx-variant-glass .tlx-error-icon-wrap,
.tlx-variant-glass .tlx-thanks-icon-wrap {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 14px 38px rgba(0,0,0,0.26);
}

.tlx-variant-glass .tlx-thanks-details {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 14px 38px rgba(0,0,0,0.22);
}

.tlx-variant-glass .tlx-thanks-details-title {
  color: rgba(255, 255, 255, 0.65);
}

.tlx-variant-glass .tlx-thanks-row {
  color: rgba(255, 255, 255, 0.90);
}

.tlx-variant-glass .tlx-thanks-next h3 {
  color: rgba(255, 255, 255, 0.92);
}

.tlx-variant-glass .tlx-thanks-next li {
  color: rgba(255, 255, 255, 0.70);
}

.tlx-variant-glass .tlx-thanks-check {
  background: rgba(138,196,139,0.20);
  color: rgba(255,255,255,0.92);
}

.tlx-variant-glass .tlx-error-btn {
  background: rgba(138,196,139,0.20);
  color: rgba(255,255,255,0.88);
}

.tlx-variant-glass .tlx-error-btn:hover {
  background: rgba(138,196,139,0.95);
  color: #fff;
}



/* -----------------------------------------------------------------------------
   TLX Modal (popup booking) — iOS-friendly, Apple-ish
   - Uses fixed overlay with dvh/svh fallbacks (better with iOS dynamic toolbars)
   - Uses -webkit-backdrop-filter for Safari
----------------------------------------------------------------------------- */

/* If the site uses global `scroll-behavior:smooth`, it can make modal close
   look like the page is "gliding" back to the previous scroll position.
   We temporarily add this class during unlock to force an instant jump. */
html.tlx-no-smooth,
html.tlx-no-smooth body{
  scroll-behavior: auto !important;
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen){
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  height: 100svh;
  height: 100dvh;
  z-index: 999999;
  display: grid;
  place-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .26s cubic-bezier(.16,1,.3,1);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen).is-open{
  opacity: 1;
  pointer-events: auto;
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.48);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  opacity: 0;
  transition: opacity .26s cubic-bezier(.16,1,.3,1);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen).is-open .tlx-consult-modal__overlay{
  opacity: 1;
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__dialog{
  position: relative;
  width: min(1040px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  border-radius: 32px;
  background: rgba(255,255,255,1);
  padding: 44px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transform: translate3d(0, 18px, 0) scale(.96);
  opacity: 0;
  will-change: transform, opacity;
  transition: none;
  box-shadow: 0px 22px 70px rgba(0,0,0,.35);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen).is-open .tlx-consult-modal__dialog{
  animation: tlxModalIn .54s cubic-bezier(.16,1,.3,1) both;
}

@keyframes tlxModalIn{
  0%   { opacity: 0; transform: translate3d(0, 18px, 0) scale(.96); }
  70%  { opacity: 1; transform: translate3d(0, 0, 0) scale(1.01); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__close{
  position: absolute;
  top: 18px;
  right: 18px;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  color: rgba(18,18,18,.92);
  box-shadow: 0px 10px 30px rgba(0,0,0,.18);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
  z-index: 20;
}

/* If the modal contains the glass variant form, keep the close button “frosted” but still high-contrast */
.tlx-consult-modal:not(.tlx-consult-modal--fullscreen)[data-variant="glass"] .tlx-consult-modal__close{
  border-color: rgba(255,255,255,.34);
  background: rgba(255,255,255,.22);
  color: rgba(255,255,255,.96);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0px 14px 40px rgba(0,0,0,.28);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__close:hover{
  transform: scale(1.04);
  background: rgba(255,255,255,.98);
  border-color: rgba(0,0,0,.12);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen)[data-variant="glass"] .tlx-consult-modal__close:hover{
  background: rgba(255,255,255,.28);
  border-color: rgba(255,255,255,.46);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__close:active{
  transform: scale(.98);
}

.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-modal__content{
  padding: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* In the modal we already have generous dialog padding; let the container sit naturally */
.tlx-consult-modal:not(.tlx-consult-modal--fullscreen) .tlx-consult-container{ padding: 0; }

/* Waterfall feel: content settles a beat after the sheet appears */
.tlx-consult-modal:not(.tlx-consult-modal--fullscreen).is-open .tlx-consult-modal__content{
  animation: tlxModalContentIn .62s cubic-bezier(.16,1,.3,1) both;
  animation-delay: 90ms;
}

@keyframes tlxModalContentIn{
  0%   { opacity: 0; transform: translate3d(0, 10px, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* Popup close button shown only for popup thank-you */
.tlx-popup-close-wrap{
  margin-top: 18px;
  display: flex;
  justify-content: center;
}

.tlx-popup-close-btn{
  min-width: 220px;
}

/* Reduce motion support */
@media (prefers-reduced-motion: reduce){
  .tlx-consult-modal,
  .tlx-consult-modal__overlay,
  .tlx-consult-modal__dialog{
    transition: none !important;
    animation: none !important;
  }
}


/* ========================================================================
   Ramstrong variant — exact approved consultation-form visual contract.
   This variant is intentionally isolated so the existing Techlinx/default
   and glass forms remain untouched.
   ======================================================================== */
.tlx-variant-ramstrong {
  --ink: #0a1d2a;
  --blue: #456a82;
  --muted: #748894;
  --paper-2: #eef4f6;
  --panel: #e8f0f4;
  --white: #fff;
  --radius: 28px;
  width: 100%;
  font-family: Geist, Arial, sans-serif;
}

.tlx-variant-ramstrong,
.tlx-variant-ramstrong *,
.tlx-variant-ramstrong *::before,
.tlx-variant-ramstrong *::after { box-sizing: border-box; }

.tlx-variant-ramstrong .hero-booking.consultation-card {
  background: #fff;
  padding: 42px 38px;
  display: flex;
  flex-direction: column;
  min-height: 650px;
  border-radius: var(--radius);
  position: relative;
  overflow: hidden;
}

.tlx-variant-ramstrong .booking-head { margin: 0 0 26px; }
.tlx-variant-ramstrong .booking-head h2 {
  margin: 0 0 8px;
  font-family: Halant, Georgia, serif;
  font-size: 38px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.045em;
  color: var(--ink);
}
.tlx-variant-ramstrong .booking-head p {
  margin: 0;
  max-width: none;
  color: var(--muted);
  font-family: Geist, Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: -.025em;
}

.tlx-variant-ramstrong .consultation-form { display:block; width:100%; margin:0; padding:0; }
.tlx-variant-ramstrong .consultation-form.is-step-transitioning { position:relative; overflow:hidden; }
.tlx-variant-ramstrong .consultation-form .form-step { display:none; width:100%; margin:0; padding:0; }
.tlx-variant-ramstrong .consultation-form .form-step.active { display:block; }
.tlx-variant-ramstrong .consultation-form .field-row {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px;
}
.tlx-variant-ramstrong .consultation-form .field { display:block; width:100%; margin:0 0 10px; padding:0; }
.tlx-variant-ramstrong .consultation-form input,
.tlx-variant-ramstrong .consultation-form textarea,
.tlx-variant-ramstrong .consultation-form button {
  -webkit-appearance:none; appearance:none; font-family:Geist,Arial,sans-serif;
  font-weight:400; text-transform:none; box-shadow:none;
}
.tlx-variant-ramstrong .consultation-form input,
.tlx-variant-ramstrong .consultation-form textarea {
  display:block; width:100%; margin:0; border:0; outline:none;
  background:var(--paper-2); color:var(--ink); border-radius:12px;
  padding:14px 15px; font-size:14px; line-height:1.2; letter-spacing:-.025em;
  transition:box-shadow .4s cubic-bezier(.68,0,.16,.97),background .4s cubic-bezier(.68,0,.16,.97);
}
.tlx-variant-ramstrong .consultation-form input { height:49px; }
.tlx-variant-ramstrong .consultation-form textarea { height:104px; min-height:104px; max-height:104px; resize:none; }
.tlx-variant-ramstrong .consultation-form input::placeholder,
.tlx-variant-ramstrong .consultation-form textarea::placeholder { color:var(--muted); opacity:1; }
.tlx-variant-ramstrong .consultation-form input:focus,
.tlx-variant-ramstrong .consultation-form textarea:focus {
  background:#f4f8fa; box-shadow:0 0 0 1px var(--blue);
}
.tlx-variant-ramstrong .consultation-form .field-error {
  display:block; min-height:16px; margin:0; padding:2px 4px 0; color:#9b3f45;
  font-family:Geist,Arial,sans-serif; font-size:11px; font-weight:400;
  line-height:14px; letter-spacing:-.02em;
}
.tlx-variant-ramstrong .consultation-form .form-actions {
  display:flex; gap:10px; width:100%; margin:12px 0 0; padding:0;
}
.tlx-variant-ramstrong .consultation-form .form-actions .button {
  flex:1 1 0; width:auto; height:54px; min-height:54px; margin:0; padding:0 20px;
  border:0; border-radius:999px; background:var(--ink); color:var(--white);
  font-family:Geist,Arial,sans-serif; font-size:14px; font-weight:500; line-height:1;
  letter-spacing:-.04em; cursor:pointer;
}
.tlx-variant-ramstrong .consultation-form .form-actions .button.button--secondary {
  flex:0 0 auto; background:var(--paper-2); color:var(--ink);
}
.tlx-variant-ramstrong .consultation-form .form-actions .button:disabled { cursor:wait; opacity:.7; }

.tlx-variant-ramstrong .step-indicator {
  display:flex; gap:5px; width:100%; margin:auto 0 0; padding:22px 0 0;
}
.tlx-variant-ramstrong .step-indicator i {
  display:block; flex:1 1 0; height:3px; margin:0; border-radius:3px;
  background:var(--panel); transition:background .4s cubic-bezier(.68,0,.16,.97);
}
.tlx-variant-ramstrong .step-indicator i.on { background:var(--blue); }

.tlx-variant-ramstrong .calendar-head {
  display:flex; align-items:center; justify-content:space-between; width:100%; margin:4px 0 12px;
}
.tlx-variant-ramstrong .calendar-head strong {
  font-family:Geist,Arial,sans-serif; font-size:14px; font-weight:600; line-height:1.2; color:var(--ink);
}
.tlx-variant-ramstrong .calendar-head button {
  display:grid; place-items:center; width:30px; height:30px; min-width:30px; min-height:30px;
  margin:0; padding:0; border:0; border-radius:9px; background:var(--paper-2); color:var(--ink);
  font-size:14px; line-height:1; cursor:pointer;
}
.tlx-variant-ramstrong .calendar-head button:disabled { opacity:.3; cursor:default; }
.tlx-variant-ramstrong .calendar-grid {
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; width:100%; margin:0 0 18px;
}
.tlx-variant-ramstrong .dow {
  padding:5px 0; color:var(--muted); font-family:Geist,Arial,sans-serif; font-size:10px;
  font-weight:400; line-height:1; text-align:center;
}
.tlx-variant-ramstrong .day {
  display:grid; place-items:center; width:100%; min-width:0; aspect-ratio:1; margin:0; padding:0;
  border:0; border-radius:9px; background:var(--paper-2); color:var(--ink);
  font-family:Geist,Arial,sans-serif; font-size:12px; font-weight:400; line-height:1; cursor:pointer;
  transition:background-color .4s cubic-bezier(.68,0,.16,.97),color .4s cubic-bezier(.68,0,.16,.97);
}
.tlx-variant-ramstrong .day:hover,
.tlx-variant-ramstrong .day.selected { background:var(--ink); color:#fff; }
.tlx-variant-ramstrong .day.muted-day { opacity:.3; pointer-events:none; }
.tlx-variant-ramstrong .time-title {
  margin:0 0 8px; color:var(--ink); font-family:Geist,Arial,sans-serif;
  font-size:12px; font-weight:500; line-height:1.2;
}
.tlx-variant-ramstrong .time-grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; width:100%; margin:0;
}
.tlx-variant-ramstrong .time-slot {
  display:grid; place-items:center; width:100%; height:40px; min-height:40px; margin:0; padding:0;
  border:0; border-radius:10px; background:var(--paper-2); color:var(--ink);
  font-family:Geist,Arial,sans-serif; font-size:12px; font-weight:400; line-height:1; cursor:pointer;
  transition:background-color .4s cubic-bezier(.68,0,.16,.97),color .4s cubic-bezier(.68,0,.16,.97);
}
.tlx-variant-ramstrong .time-slot:hover,
.tlx-variant-ramstrong .time-slot.selected { background:var(--blue); color:#fff; }
.tlx-variant-ramstrong .tlx-rs-time-message {
  grid-column:1/-1; min-height:40px; display:flex; align-items:center; color:var(--muted);
  font-family:Geist,Arial,sans-serif; font-size:12px; line-height:1.35;
}
.tlx-variant-ramstrong .success {
  display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:470px;
  margin:0; padding:20px; text-align:center;
}
.tlx-variant-ramstrong .success-mark {
  display:grid; place-items:center; width:62px; height:62px; margin:0 0 22px; border-radius:50%;
  background:var(--panel); color:var(--ink); font-family:Geist,Arial,sans-serif; font-size:25px; line-height:1;
}
.tlx-variant-ramstrong .success h2 {
  margin:0 0 10px; color:var(--ink); font-family:Halant,Georgia,serif; font-size:38px;
  font-weight:400; line-height:1; letter-spacing:-.045em;
}
.tlx-variant-ramstrong .success p {
  max-width:340px; margin:0; color:var(--muted); font-family:Geist,Arial,sans-serif;
  font-size:14px; line-height:1.5; letter-spacing:-.025em;
}

@media (max-width:1199px) {
  .tlx-variant-ramstrong .hero-booking.consultation-card { min-height:620px; padding:34px 28px; }
}
@media (max-width:809px) {
  .tlx-variant-ramstrong .hero-booking.consultation-card { min-height:600px; padding:30px 22px; }
  .tlx-variant-ramstrong .booking-head h2 { font-size:34px; }
  .tlx-variant-ramstrong .consultation-form .field-row { grid-template-columns:minmax(0,1fr); gap:0; }
  .tlx-variant-ramstrong .consultation-form .field { margin-bottom:6px; }
  .tlx-variant-ramstrong .calendar-grid { gap:4px; }
  .tlx-variant-ramstrong .time-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:430px) {
  .tlx-variant-ramstrong .hero-booking.consultation-card { padding:28px 18px; }
}
.tlx-variant-ramstrong { width:100%; min-width:0; }
.tlx-variant-ramstrong .hero-booking.consultation-card { width:100%; height:auto; }
.tlx-variant-ramstrong .button__text{display:block;width:max-content;white-space:nowrap;pointer-events:none;will-change:transform,filter,opacity;line-height:inherit}
.tlx-variant-ramstrong .button__text--primary{position:relative;opacity:1;filter:blur(0)}
.tlx-variant-ramstrong .button__text--hover{position:absolute;left:50%;top:-22px;translate:-50% 0;opacity:0;filter:blur(5px)}
.tlx-variant-ramstrong .button.is-hovered .button__text--hover{position:relative;left:auto;top:auto;translate:none;opacity:1;filter:blur(0)}
.tlx-variant-ramstrong .button.is-hovered .button__text--primary{position:absolute;left:50%;top:100%;translate:-50% 0;opacity:1;filter:blur(0)}