body {
    background: linear-gradient(126deg, #eaf1ff 0%, #dee6fa 15%, #d4e3fd 30%, #f5d7fc 51%, #f6c1ef 77%, #d4e1f9 95%, #e9e2fd 100%);
    min-height: 100vh;
    color: #1b2252;
    font-family: 'Inter', sans-serif;
    margin: 0; padding: 0;
  }
  html, body {
    max-width: 100vw;
    overflow-x: hidden;
  }
  
  /* HEADER */
  .main-header {
    display: flex; justify-content: space-between; align-items: flex-start;
    padding: 0.2rem 2.3rem 0.01rem 2.2rem; margin-bottom: -8px;
  }
  .logo-block { display: flex; flex-direction: column; align-items: center; margin-top: 0.1rem;}
  .logo { height: 54px; margin-bottom: 0.5px;}
  .logo.small { height: 27px; margin-right:8px;}
  .support-team-text { font-size: 0.89rem; font-weight: 700; color: #347afe; letter-spacing: 0.009em; margin-top: 2.0px; text-shadow: 0 1px 2px #7ebaff27;}
  .help-center-btn { background: linear-gradient(90deg, #e31f71 10%, #264fff 89%); color: #fff; font-weight: 700; font-size: 0.99rem; padding: 0.41rem 1.19rem 0.41rem 0.91rem; border-radius: 8px; text-decoration: none; display: flex; align-items: center; gap: 0.36em; box-shadow: 0 2px 11px rgba(227,31,113,0.085); margin-top: 1.5px; border: none;}
  .help-center-btn:hover { background: linear-gradient(90deg, #264fff 12%, #e31f71 88%); filter:brightness(1.085);}
  .main-metrics-h2 {
    text-align: center;
    font-size: 1.48rem;
    font-weight: 900;
    color: #264fff;
    margin-top: 1.15em;
    margin-bottom: 0.82em;
    letter-spacing: 0.05em;
  }
  
  /* Metrics Section, Center CleverTap Support Apps Hub block */
  .after-metrics, .centered-metrics {
    margin: 1.2em auto 0.2em auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .apps-hub-title, .apps-hub-title.centered-metrics {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  .apps-hub-desc, .apps-hub-desc.centered-metrics {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  .apps-hub-title { font-size: 2.44rem; font-weight: 950; color: #143baf; letter-spacing: 0.02em; margin-bottom: 0.11em; text-shadow: 0 2px 20px #b6cbfa;}
  .apps-hub-desc { font-size: 1.06em; color: #4b5cb7; margin-bottom: 1.42em; }
  
  .button-bar, .button-bar.center-bar {
    display: flex;
    justify-content: center;
    gap: 1.13rem;
    margin-top: 1.8em;
    margin-bottom: 0.7em;
  }
  @media (max-width:700px){
    .button-bar, .button-bar.center-bar{ flex-direction:column; align-items:center;}
  }
  
  /* Section structure */
  .section-gap { height: 36px; }
  .metrics-section { margin-bottom: 2.4em; }
  .reviews-section { margin: 2.2em auto 0 auto; }
  .apps-section { margin: 2.8em auto 0 auto; }
  .internal-apps-section    { margin-top: 2.9em; }
  
  /* KPI Cards */
  .kpi-cards { display: flex; gap: 1.4rem; justify-content: center; flex-wrap: wrap;}
  .glass-card {
    background: rgba(255,255,255,0.51);
    border-radius: 21px;
    box-shadow: 0 9px 40px 0 rgba(38,79,255,0.09);
    backdrop-filter: blur(19px) saturate(128%);
    border: 1.5px solid rgba(227,31,113,0.11);
    transition: background 0.20s, border 0.18s, box-shadow 0.19s, transform 0.20s;
    opacity: 0.99; position: relative; cursor:pointer;
  }
  .glass-card.hovered, .glass-card:focus-visible, .glass-card:hover {
    background: rgba(255,255,255,0.74);
    border: 1.7px solid #e31f71c8;
    box-shadow: 0 10px 32px 0 rgba(140,130,255,0.13);
    transform: translateY(-5px) scale(1.03);
    z-index: 5;
  }
  .metric-card {
    width: 263px; min-width: 263px; max-width: 263px;
    padding: 1.7rem 1.5rem 1.6rem 1.5rem;
    align-items: center; flex-direction: column; text-align: center; border-radius: 21px;
    border-bottom: 2.5px solid #e31f7138;
  }
  .metric-icon { font-size: 2.3em; margin-bottom: 0.38em; color: #264fff;}
  .metric-card:focus-visible .metric-icon, .metric-card.hovered .metric-icon, .metric-card:hover .metric-icon { color: #e31f71; }
  .metric-value { font-size: 2.01rem; font-weight: 900; color: #264fff; margin-bottom:0.13em;}
  .metric-card:focus-visible .metric-value, .metric-card.hovered .metric-value, .metric-card:hover .metric-value { color: #e12458; }
  .metric-name { font-size: 1.07rem; color: #2d389e; font-weight: 850;}
  .metric-description { font-size: 0.97rem; color: #5066c2; font-weight: 500; margin-bottom:0.08em; margin-top:0.13em;}
  
  /* Main buttons */
  .big-btn { display: flex; align-items: center; background: linear-gradient(90deg, #264fff 9%, #e31f71 92%); color: #fff; font-weight: 700; font-size: 1.08rem; padding: 0.8rem 1.9rem 0.8rem 1.4rem; border-radius: 13px; text-decoration: none; box-shadow: 0 3.6px 17px #4c6ef524; transition:transform 0.14s, box-shadow 0.13s; gap: 0.51rem; border: none; outline: none; cursor: pointer;}
  .big-btn:hover, .big-btn:focus-visible { transform: translateY(-2px) scale(1.04); box-shadow: 0 6px 16px #e31f7142; filter: brightness(1.06);}
  .big-btn i { font-size: 1.14em; margin-right: 0.68em; margin-left: -0.17em;}
  .section-heading.big, .main-title { font-size: 2.09rem; font-weight: 950; letter-spacing:0.01em; color: #1842b2; margin-bottom:0.06em; text-align:center;}
  .review-subheading.big { text-align: center; color: #5661a3; font-size: 1.05em; margin-bottom:1.35em; font-weight: 500;}
  .apps-section-header.centered, .app-section-note.centered, .app-section-subtitle.centered { align-items: center; text-align: center; justify-content:center;}
  .app-section-note {
    display: flex; align-items: center; font-weight: 650; font-size: 1.06em;
    border-radius:18px; padding:0.12em 1.18em 0.12em 0.97em;
    background:rgba(64,221,108,0.09); color:#14b46d; gap: 0.53em; box-shadow:0 1.5px 5px #14b46d19; margin-bottom:0.16em;
  }
  .app-section-note.employees-only { background:rgba(150,139,210,0.23); color:#7c2ea9;}
  .status-dot.green { background:#14b46d; width:0.86em;height:0.86em; border-radius:50%;margin-right:0.51em;}
  .available-pills-row {
    width: 100%; display: flex;
    justify-content: center; align-items: center; margin-bottom: 0.15em;
  }
  .apps-section-header .section-heading.main-title { margin-top: 10px; margin-bottom: 0.04em; }
  
  .apps-list.two-col { display:grid; grid-template-columns: repeat(auto-fit, minmax(344px, 1fr)); gap: 1.43rem 2.15rem; width:100%; max-width:990px; margin:0 auto; margin-top:0.81em;}
  .app-card { min-width: 280px; max-width: 510px; min-height:145px; display: flex; align-items: center; gap: 1.15rem; border-radius: 19px; border: none; background: rgba(255,255,255,0.39); padding:2em 1.05em 2em 1.09em;}
  .app-icon { font-size: 2.25em; min-width: 58px; min-height: 58px; margin-top: 0; align-items: center; justify-content: center; display: flex;}
  .app-icon.rounded { border-radius: 20px !important; }
  .app-icon.blue {color: #2664ff; background:rgba(38,100,255,0.09);}
  .app-icon.green {color: #19b471; background:rgba(64,221,108,0.13);}
  .app-icon.purple {color: #a059d1; background: #f9ecfd;}
  .app-icon.orange {color: #ff9900; background: #fff7e5;}
  .app-icon.yellow {color: #f3b941; background: #fffbea;}
  .app-icon.red {color: #e12458; background: #fae2ed;}
  .app-icon.jira { display: flex; align-items: center; justify-content: center; background:rgba(34,69,228,0.07);}
  .app-name { font-size: 1.09em; font-weight: 700; color: #264fff; margin-bottom: 0.13em;}
  .app-desc { font-size: 0.98em; color: #8450a5; margin-bottom: 0.16em;}
  .soon { font-size: 0.95em; color: #e12458; margin-left: 3px;}
  .app-card .launch-btn { margin-top: 0.7em; display:inline-block; padding:0.39em 1.12em; border-radius:11px; background: linear-gradient(90deg,#264fff 11%, #e31f71 93%); color: #fff; font-weight: 600; font-size: 0.99em; text-decoration: none; box-shadow: 0 2.2px 14px #264fff16; transition: background 0.11s, box-shadow 0.11s, transform 0.13s;}
  .app-card .launch-btn:hover, .app-card .launch-btn:focus-visible {background:linear-gradient(90deg,#e31f71 6%, #264fff 98%);filter: brightness(1.09);transform: scale(1.045);}
  .launch-btn.disabled {pointer-events: none;background:#b5b5c7;color:#edeffd;opacity:0.69;filter: grayscale(1) brightness(0.94);font-style: italic;}
  .app-card:focus-visible, .app-card.hovered, .app-card:hover { background:rgba(227,31,113,0.13); box-shadow:0 7px 18px #264fff2b,0 2.5px 13px #e31f7155; transform:translateY(-2.5px) scale(1.02); border-color:#e31f71c7; z-index:3;}
  .app-card.disabled {pointer-events:none;opacity:0.58;background:rgba(255,255,255,0.17);border:1.5px solid #e31f7133;color:#a993b7;}
  
  .reviews-area { width: 100%; text-align: center; }
  .reviews-row.center-row {
    justify-content: center;
    margin: 0 auto;
    text-align: center;
  }
  .review-blurb { margin-left: auto; margin-right: auto; text-align: center;}
  @media (max-width: 900px) {
    .reviews-row.center-row { flex-direction: column; gap: 1.5rem; }
  }
  .reviews-row { display: flex; gap: 1.25rem; justify-content: center; width: 100%; max-width:1100px; margin-top:1.6em;}
  .reviews-large .glass-card { min-width: 230px; max-width: 320px; min-height: 160px;}
  .review-blurb { font-size: 1.03em; padding: 1.1em 1em 1em 1em; border-radius: 15px; background: rgba(245,223,254,0.22); box-shadow: 0 2px 14px #a9d1ee11, 0 1.5px 7px #e1245832; transition: background 0.13s, box-shadow 0.13s, transform 0.1s;}
  .review-meta-row { display: flex; align-items: center; gap: 7px; font-size: 0.93em; font-weight: 600; margin-top: 1.1em; color: #264fff; opacity: 0.97; justify-content: center; }
  .review-meta-row .person-icon {margin-right: 1.5px;}
  .review-meta-row .review-date { color: #e31f71; margin-left: 5px; margin-right: 2px;}
  .review-meta-row i.thumbs-up  { color: #19b471; margin-left:2px; }
  .meta-customer { margin-left: 4px;}
  .review-text { font-size: 1.04em; color: #213974; font-style: italic; line-height: 1.47; margin-bottom: 0.21em;}
  .review-blurb:focus-visible, .review-blurb.hovered, .review-blurb:hover { background: rgba(212,208,245,0.24); box-shadow: 0 3px 11px #264fff19; transform: translateY(-1.5px) scale(1.015); z-index: 2;}
  
  footer {
    margin-top: 1.3rem;
    background: none;
    position: relative;
    min-height: 120px;
  }
  .footer-inner {
    display: flex; flex-direction: column; align-items: stretch; justify-content: flex-end;
    gap: 3px; padding: 0.7em 2em 3.2em 2em;
    position: relative;
    width: 100%;
    min-height: 120px;
  }
  .footer-left, .footer-left-gap {
    display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
    position: absolute; left: 0; bottom: 3.2em;
  }
  .footer-team-text { font-size: 0.93em; color: #1842b2; font-weight: 700;}
  .footer-floating-sub { font-size: 0.83rem; color: #5066c2; font-weight:500;}
  .footer-copyright {
    font-size: 0.85em;
    color: #8450a5;
    text-align: center;
    margin: 0 auto 0.1em auto;
    font-weight: 600;
    width: 100%;
    display: block;
    padding-bottom: 0.7em;
  }
  
  /* --- Floating help (footer right) --- */
  .footer-floating-right {
    position:fixed; right:0; bottom:25px; z-index:987;
    background:rgba(255,255,255,0.80); backdrop-filter:blur(12px);
    border-radius:18px; box-shadow:0 3px 19px #b1caea29;
    padding: 13px 19px 8px 12px;
    display:flex; flex-direction:column; align-items:flex-end;
    min-width:175px; font-weight:700; font-size:1.03rem; color:#1240b4;
  }
  .footer-web { color:#3673c6; font-size:.98rem; margin-top:5px; text-decoration:none; font-weight:600;}
  .footer-web i { margin-right:5px; color:#2bb0f6; }
  
  @media (max-width: 1080px) {
    .footer-inner{padding:0.7em 0.8em 4.2em 0.8em;}
    .footer-left, .footer-left-gap {left:0; bottom:4.2em;}
  }
  @media (max-width: 700px) {
    .footer-left, .footer-left-gap {
      position: static;
      margin-bottom: 2em;
    }
    .footer-inner{min-height:0;padding-bottom:2em;}
  }
  
  .support-team-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .support-team-text.blue {
    position: relative;
    font-size: 0.89rem;
    font-weight: 700;
    color: #347afe;
    letter-spacing: 0.009em;
    margin-top: 2.0px;
    text-shadow: 0 1px 2px #7ebaff27;
    display: inline-block;
  }
  .apps-hub-subtext {
    position: absolute;
    right: -46px;
    bottom: -12px;
    font-size: 0.67em;
    color: #906cda;
    font-weight: 650;
    text-decoration: none;
    opacity: 0.84;
    background: none;
    letter-spacing: 0.02em;
    padding-left: 7px;
    transition: color 0.15s;
  }
  .apps-hub-subtext:hover {
    color: #2c2cac;
    text-decoration: underline;
  }
  @media (max-width: 600px) {
    .apps-hub-subtext {
      right: -26px;
      bottom: -8px;
      font-size: 0.52em;
    }
  }

  /* Wrapper to position the 24/7 text below Help Center button */
.help-center-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }
  
  /* 24/7 Support text below Help Center button */
  .support-24-7-subtext {
    font-size: 0.85em;
    color: #906cda;
    font-weight: 850;
    text-decoration: none;
    opacity: 0.84;
    letter-spacing: 0.02em;
    margin-top: 4px;
    margin-right: 15px; /* Add this line to shift left */
    transition: color 0.15s;
  }
  
  
  .support-24-7-subtext:hover {
    color: #2c2cac;
    text-decoration: underline;
  }
  
  @media (max-width: 600px) {
    .support-24-7-subtext {
      font-size: 0.52em;
      margin-top: 2px;
    }
  }