.sc_bg-page {
    font-family: 'Roboto', sans-serif;
    background:
        radial-gradient(ellipse 70% 60% at 85% 5%, #c8ebe6 0%, transparent 65%),
        radial-gradient(ellipse 50% 40% at 10% 90%, #ddeae8 0%, transparent 60%),
        linear-gradient(145deg, #eaf4f2 0%, #f2f6f5 40%, #eaeef0 100%) !important;
    min-height: 100vh;
}

    .sc_card-glass {
    -webkit-backdrop-filter: blur(24px);
    padding: 44px 40px 36px;
    box-shadow:
      0 8px 40px rgba(20, 80, 70, 0.10),
      0 2px 12px rgba(20, 80, 70, 0.06),
      0 0 0 1px rgba(255,255,255,0.6) inset !important;
    }

    .sc_logo-box {
      background: linear-gradient(135deg, #1a7a6b 0%, #0d5c50 100%);
      box-shadow: 0 4px 12px rgba(13, 90, 80, 0.3);
    }

    .sc_field {
      background: #f7fbfa;
      border: 1.5px solid #d0e8e3;
      border-radius: 10px;
      transition: border-color .2s, box-shadow .2s;
    }

    .sc_field:focus-within {
      border-color: #1a7a6b;
      box-shadow: 0 0 0 3px rgba(26, 122, 107, 0.12);
    }

    .sc_btn-cta {
      background: linear-gradient(135deg, #1a7a6b 0%, #0d5c50 100%);
      box-shadow: 0 4px 18px rgba(13, 90, 80, 0.30);
      transition: transform .15s, box-shadow .15s, filter .15s;
    }

    .sc_btn-cta:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 22px rgba(13, 90, 80, 0.38);
      filter: brightness(1.06);
    }

    .sc_btn-cta:active {
      transform: translateY(0);
      box-shadow: 0 3px 12px rgba(13, 90, 80, 0.25);
    }

    .btn-alt {
      border: 1.5px solid #d0e8e3;
      background: #f7fbfa;
      border-radius: 10px;
      transition: border-color .2s, background .2s, box-shadow .15s;
    }

    .btn-alt:hover {
      border-color: #1a7a6b;
      background: #eef7f5;
      box-shadow: 0 2px 8px rgba(13, 90, 80, 0.10);
    }

    .testimonial-card {
      background: rgba(255, 255, 255, 0.75);
      border: 1.5px solid rgba(255, 255, 255, 0.85);
      box-shadow: 0 2px 14px rgba(13, 90, 80, 0.08);
      backdrop-filter: blur(10px);
    }

    @keyframes pulse-dot {

      0%,
      100% {
        opacity: 1;
        transform: scale(1);
      }

      50% {
        opacity: .7;
        transform: scale(1.3);
      }
    }

    .dot-pulse {
      animation: pulse-dot 2s ease-in-out infinite;
    }

    /* animation on btn */

  .sc_btn-cta:hover .arrow-icon {
    animation: pulse-arrow 0.5s ease-in-out infinite alternate;
  }
  @keyframes pulse-arrow {
    from { transform: scale(1); }
    to   { transform: scale(1.2) translateX(1px); }
  }

    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(18px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .fade-up {
      animation: fadeUp .55s ease both;
    }

    .delay-1 {
      animation-delay: .08s;
    }

    .delay-2 {
      animation-delay: .16s;
    }

    .delay-3 {
      animation-delay: .24s;
    }

    .delay-4 {
      animation-delay: .32s;
    }

    .custom-check {
      appearance: none !important;
      width: 16px;
      height: 16px;
      /* border: 1.5px solid #b0cec8; */
      border-radius:4px !important;
      background: #f7fbfa !important;
      cursor: pointer !important;
      flex-shrink: 0;
      outline:none !important;
    }

    .custom-check:checked {
      background: #1a7a6b !important;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4l3 3 5-6' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
      background-repeat: no-repeat !important;
      background-position: center !important;
      background-size: 10px 8px !important;
    }

    .text-brand-primary {
      color: #1a7a6b;
    }

    .hover\:text-brand-primary:hover {
      color: #1a7a6b;
    }

    .link-teal {
      color: #1a7a6b;
      font-size: .72rem;
      font-weight: 600;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .link-teal:hover {
      text-decoration: underline;
    }

    /* Eye toggle button */
    .eye-toggle {
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      color: #9cb8b3;
      display: flex;
      align-items: center;
      flex-shrink: 0;
      transition: color .2s;
    }

    .eye-toggle:hover {
      color: #1a7a6b;
    }