.elementor-165188 .elementor-element.elementor-element-45373eb{--display:flex;--min-height:70dvh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS for container, class: .elementor-element-45373eb */:root {
      --sterling-red: #D92028;
      --sterling-red-dark: #a01820;
      --sterling-red-light: #ff4f5a;
      --card-bg: #fffbfc;
      --text-main: #3a2a3f;
    }

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

    body {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      background: radial-gradient(circle at top, #ffe8e9 0, #ffc4c6 40%, #ff9fa2 80%);
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--text-main);
      overflow: hidden;
    }

    .wrapper {
      position: relative;
      width: min(500px, 95vw);
      padding-inline: 1.5rem;
    }

    .top-text {
      text-align: center;
      margin-bottom: 1.2rem;
      font-size: clamp(1.4rem, 4vw, 1.7rem);
      font-weight: 700;
      color: #fff;
      text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    }

    .top-text span {
      display: inline-block;
      margin-left: 0.35rem;
    }

    .main_card-wrapper {
      position: relative;
      height: 100%;
      min-height: 70dvh;
      max-height: 100%;
      display: grid;
    align-items: center;
    }

    .card {
      position: absolute;
      inset: auto;
      width: 100%;
      min-height: 320px;
      background: var(--card-bg);
      border-radius: 24px;
      padding: 1.75rem 1.5rem 2.1rem;
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
      overflow: hidden;
      text-align: center;
      transition: opacity 0.4s ease, transform 0.4s ease;
      place-content: center;
    }

    .card.hidden {
      opacity: 0;
      transform: translateY(10px) scale(.98);
      pointer-events: none;
    }

    /* Floating background hearts */
    .heart-bg {
      position: absolute;
      inset: -30px;
      pointer-events: none;
      opacity: 0.45;
      background-image:
        radial-gradient(circle at 10% 20%, rgba(255,255,255,0.8) 0, transparent 55%),
        radial-gradient(circle at 80% 10%, rgba(255,255,255,0.7) 0, transparent 55%);
      z-index: 0;
    }

    .heart-bg::before,
    .heart-bg::after {
      content: "💗";
      position: absolute;
      font-size: 60px;
      animation: floatHeart 8s linear infinite;
    }

    .heart-bg::before {
      top: 10%;
      left: 8%;
    }

    .heart-bg::after {
      bottom: 5%;
      right: 10%;
      animation-duration: 10s;
    }

    @keyframes floatHeart {
      0% { transform: translateY(0) scale(1); opacity: 0.7; }
      50% { transform: translateY(-12px) scale(1.05); opacity: 1; }
      100% { transform: translateY(0) scale(1); opacity: 0.7; }
    }

    .content {
      position: relative;
      z-index: 1;
      height: 100%;
    }

    /* Little character */
    .character {
      margin-bottom: 1rem;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 0.4rem;
    }

    .character-body {
      width: 120px;
      height: 90px;
      border-radius: 50px 50px 40px 40px;
      background: #fff;
      border: 3px solid #222;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }

    .character-face {
      width: 60px;
      height: 36px;
      border-radius: 40px;
      background: #ffeef7;
      border: 3px solid #222;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 10px;
      position: relative;
    }

    .eye {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #222;
    }

    .blush {
      position: absolute;
      width: 7px;
      height: 5px;
      border-radius: 50%;
      background: rgba(217, 32, 40, 0.6);
      bottom: 2px;
    }

    .blush.left { left: 7px; }
    .blush.right { right: 7px; }

    .flower {
      position: absolute;
      top: -8px;
      right: -4px;
      font-size: 14px;
    }

    .character-legs {
      display: flex;
      justify-content: center;
      gap: 32px;
      margin-top: 0.3rem;
    }

    .leg {
      width: 4px;
      height: 26px;
      background: #222;
      border-radius: 999px;
      position: relative;
    }

    .leg::after {
      content: "";
      position: absolute;
      bottom: -6px;
      left: -4px;
      width: 12px;
      height: 6px;
      border-radius: 999px;
      background: #222;
    }

    .question-bubble {
      margin: 0.25rem auto 1.3rem;
      max-width: 300px;
      padding: 0.75rem 1rem;
      border-radius: 16px;
      border: 2px solid #222;
      background: #fff;
      font-size: 1rem;
      line-height: 1.4;
      font-weight: 600;
    }

    .question-bubble span.name {
      font-weight: 700;
      color: var(--sterling-red);
    }

    .buttons {
      position: relative;
      margin-top: 0.5rem;
      height: 90px;
    }

    .btn {
      border: none;
      padding: 0.7rem 1.8rem;
      border-radius: 999px;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.15);
      transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
      outline: none;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .btn:hover {
      transform: translateY(-2px) scale(1.03);
      box-shadow: 0 10px 22px rgba(0, 0, 0, 0.15);
    }

    #yesBtn {
      background: linear-gradient(135deg, var(--sterling-red), var(--sterling-red-light));
      color: #fff;
      position: absolute;
      left: 12%;
      bottom: 8px;
    }

    #noBtn {
      background: #ffe8e9;
      color: var(--text-main);
      position: absolute;
      right: 12%;
      bottom: 8px;
      border: 1px dashed #ffc4c6;
      transform-origin: center;
    }

    #noBtn:hover {
      background: #ffeef0;
    }

    .no-escaped #noBtn {
      transition: transform 0.18s ease;
    }

    /* step 2 text */
    .step-2-title {
      font-size: 1.15rem;
      font-weight: 700;
      margin-bottom: 0.8rem;
    }

    .big-heart {
      font-size: 4rem;
      margin-bottom: 0.6rem;
      animation: pulse 1.6s ease-in-out infinite;
    }

    @keyframes pulse {
      0%   { transform: scale(1); }
      30%  { transform: scale(1.1); }
      60%  { transform: scale(1); }
      100% { transform: scale(1); }
    }

    .step-2-text {
      font-size: 1rem;
      line-height: 1.6;
      max-width: 340px;
      margin: 0 auto 1.4rem;
      color: #555;
    }

    .step-2-text .emphasis {
      font-weight: 600;
      color: var(--sterling-red);
    }

    .step2-actions {
      margin-top: 1.5rem;
    }

    .step2-actions .btn {
      background: linear-gradient(135deg, var(--sterling-red), var(--sterling-red-dark));
      color: #fff;
      position: relative;
    }

    /* step 3 - letter writing */
    .step-3-title {
      font-size: 1.3rem;
      font-weight: 700;
      margin-bottom: 0.6rem;
      color: var(--text-main);
    }

    .step-3-sub {
      font-size: 0.95rem;
      color: #777;
      margin-bottom: 1.3rem;
      line-height: 1.5;
      max-width: 380px;
      margin-left: auto;
      margin-right: auto;
    }

    .letter-textarea {
      width: 100%;
      min-height: 280px;
      padding: 1.2rem;
      font-size: 1rem;
      font-family: 'Georgia', serif;
      border: 2px solid #f5b8bb;
      border-radius: 16px;
      background: white;
      color: var(--text-main);
      resize: vertical;
      line-height: 1.7;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
      transition: all 0.3s ease;
    }

    .letter-textarea:focus {
      outline: none;
      border-color: var(--sterling-red);
      box-shadow: 0 6px 25px rgba(217, 32, 40, 0.12);
    }

    .letter-textarea::placeholder {
      color: #aaa;
      font-style: italic;
    }

    .char-count {
      text-align: right;
      color: #999;
      font-size: 0.85rem;
      margin-top: 0.5rem;
    }

    .letter-actions {
      margin-top: 1.2rem;
    }

    .letter-actions .btn {
      background: linear-gradient(135deg, var(--sterling-red), var(--sterling-red-dark));
      color: #fff;
    }

    /* Thank you screen */
    .thankyou-icon {
      font-size: 5rem;
      margin-bottom: 1rem;
    }

    .thankyou-title {
      font-size: 1.8rem;
      font-weight: 700;
      margin-bottom: 0.8rem;
      color: var(--text-main);
    }

    .thankyou-text {
      font-size: 1.05rem;
      line-height: 1.6;
      color: #666;
      max-width: 340px;
      margin: 0 auto;
    }

    /* floating hearts on YES */
    .floating-heart {
      position: fixed;
      bottom: -40px;
      font-size: 22px;
      animation: rise 3.2s ease-out forwards;
      pointer-events: none;
      z-index: 999;
    }

    @keyframes rise {
      0%   { transform: translateY(0) scale(0.8); opacity: 0; }
      15%  { opacity: 1; }
      100% { transform: translateY(-120vh) scale(1.4); opacity: 0; }
    }

    @media (max-width: 400px) {
      .card {
        padding-inline: 1.2rem;
      }

      .buttons {
        height: 100px;
      }

      #yesBtn {
        left: 8%;
      }

      #noBtn {
        right: 8%;
      }
    }/* End custom CSS */
/* Start custom CSS */.mwai-trigger.mwai-open-button {
    display: none !important;
}

div#wp-live-chat-by-3CX, .panel, .panel[data-v-c8580658] {
    display: none !important;
}/* End custom CSS */