:root{
    --blue:#2952e5;
    --blue-dark:#1e3fc4;
    --blue-light:#eef2ff;
    --navy-deep:#0d1f6b;
    --text-dark:#16213a;
    --text-muted:#6b7585;
    --border-soft:#e7eaf3;
    --green:#1ab854;
    --primary:#2563eb;
    --purple:#6d28d9;
    --orange:#f97316;
}

body{
  font-family:"Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color:var(--text-dark);
  background:#f7f8fc;
}

/* =====================================================
   HERO SECTION
   ===================================================== */
.hero-section{
  background:linear-gradient(135deg,#dce6fb 0%,#eef2fc 45%,#f7f9fd 100%);
  overflow:hidden;
  padding-top:4.5rem;
  padding-bottom:4.5rem;
}

/* ---------- Left content ---------- */
.badge-pill{
  display:inline-flex;
  align-items:center;
  background:#fff;
  color:var(--blue);
  font-size:.8rem;
  font-weight:600;
  padding:.45rem 1rem;
  border-radius:50px;
  border:1px solid #d7e0fa;
  box-shadow:0 2px 6px rgba(41,82,229,.08);
}

.hero-heading{
  font-size:2.85rem;
  font-weight:800;
  line-height:1.15;
  letter-spacing:-0.5px;
}
.hero-heading .blue{ color:var(--blue); }

.hero-sub{
  font-size:1.05rem;
  color:var(--text-muted);
  max-width:520px;
  line-height:1.6;
}

.btn-primary-custom{
  background:var(--blue);
  border:none;
  color:#fff;
  font-weight:600;
  padding:.85rem 1.6rem;
  border-radius:.6rem;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  transition:.2s ease;
}
.btn-primary-custom:hover{ background:var(--blue-dark); color:#fff; }

.btn-outline-custom{
  background:#fff;
  border:1px solid var(--border-soft);
  color:var(--blue);
  font-weight:600;
  padding:.85rem 1.6rem;
  border-radius:.6rem;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  transition:.2s ease;
}
.btn-outline-custom:hover{ background:#f4f7ff; color:var(--blue-dark); }

.features-list{
  font-size:.92rem;
  color:#3b4356;
  font-weight:500;
}
.features-list i{ color:var(--green); margin-right:.4rem; }

.divider-top{
  border-top:1px solid var(--border-soft);
}

/* ---------- Dashboard mockup ---------- */
.dashboard-wrap{
  position:relative;
}

.dashboard-card{
  background:#fff;
  border-radius:1rem;
  box-shadow:0 25px 60px -10px rgba(30,60,160,.18);
  overflow:hidden;
  display:flex;
  min-height:460px;
}

.dash-sidebar{
  background:var(--blue);
  width:60px;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:1rem 0;
  gap:1.3rem;
}
.dash-sidebar .logo-dot{
  width:32px;height:32px;border-radius:8px;background:#fff;
  display:flex;align-items:center;justify-content:center;
  color:var(--blue); font-size:1rem; margin-bottom:.5rem;
}
.dash-sidebar .nav-icon{
  width:34px;height:34px;border-radius:8px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#9fb1f5; font-size:.95rem; gap:2px;
}
.dash-sidebar .nav-icon.active{
  background:rgba(255,255,255,.18);
  color:#fff;
}
.dash-sidebar .nav-label{
  font-size:.5rem;
  color:inherit;
}

.dash-main{
  flex:1;
  padding:1rem 1.1rem;
  min-width:0;
}

.dash-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:.9rem;
}
.dash-header h6{
  font-weight:700;
  font-size:.95rem;
  margin-bottom:0;
}
.dash-header small{
  color:var(--text-muted);
  font-size:.7rem;
}
.date-pill{
  background:#f4f6fb;
  border:1px solid var(--border-soft);
  border-radius:.4rem;
  font-size:.68rem;
  color:var(--text-muted);
  padding:.25rem .55rem;
  white-space:nowrap;
}

.stat-card{
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:.7rem;
  padding:.6rem .7rem;
  flex:1;
  min-width:0;
}
.stat-card .icon-box{
  width:26px;height:26px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-size:.75rem;color:#fff;margin-bottom:.35rem;
}
.stat-card .stat-value{
  font-weight:700;
  font-size:.95rem;
  line-height:1;
}
.stat-card .stat-label{
  font-size:.62rem;
  color:var(--text-muted);
}
.stat-card .stat-delta{
  font-size:.62rem;
  color:var(--green);
  font-weight:600;
}

.panel{
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:.7rem;
  padding:.7rem .8rem;
}
.panel-title{
  font-size:.72rem;
  font-weight:700;
  color:var(--text-dark);
}
.panel-link{
  font-size:.65rem;
  color:var(--blue);
  font-weight:600;
  text-decoration:none;
}

.chart-placeholder{
  width:100%;
  height:90px;
}

.row-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.3rem 0;
  font-size:.65rem;
  border-bottom:1px solid #f1f3f9;
}
.row-item:last-child{ border-bottom:none; }
.row-item .avatar{
  width:20px;height:20px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.55rem;font-weight:700;color:#fff;margin-right:.4rem;
}
.row-item .name{ font-weight:600; color:var(--text-dark); }
.row-item .meta{ color:var(--text-muted); font-size:.6rem; }
.status-pill{
  font-size:.55rem;
  border-radius:50px;
  padding:.12rem .5rem;
  font-weight:600;
}
.status-done{ background:#e6f7ec; color:var(--green); }
.status-route{ background:#fff3e0; color:#e08e2c; }
.status-upcoming{ background:#eef1f8; color:#7c8499; }

.ring{
  width:64px;height:64px;border-radius:50%;
  border:6px solid var(--blue);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  margin:0 auto;
}
.ring .ring-num{ font-weight:700; font-size:.7rem; }
.ring .ring-label{ font-size:.45rem; color:var(--text-muted); }

/* Floating cards */
.float-card{
  position:absolute;
  background:#fff;
  border-radius:.8rem;
  box-shadow:0 18px 40px -8px rgba(30,60,160,.22);
  padding:.8rem .9rem;
  border:1px solid var(--border-soft);
}
.float-revenue{
  top:-1.5rem;
  right:-1rem;
  width:200px;
}
.float-partners{
  bottom:5.5rem;
  left:-1.5rem;
  width:170px;
}
.float-icon{
  width:28px;height:28px;border-radius:7px;
  background:var(--blue);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:.8rem;margin-bottom:.4rem;
}
.float-card .float-value{
  font-weight:700;
  font-size:1.05rem;
}
.float-card .float-label{
  font-size:.65rem;
  color:var(--text-muted);
}
.float-card .float-delta{
  font-size:.65rem;
  color:var(--green);
  font-weight:600;
}

.mini-bars{
  display:flex;
  align-items:flex-end;
  gap:3px;
  height:24px;
  margin-top:.4rem;
}
.mini-bars span{
  width:6px;
  background:var(--blue-light);
  border-radius:2px;
}
.mini-bars span.tall{ background:var(--blue); }

.uplift-badge{
  position:absolute;
  top:6.2rem;
  right:-1.2rem;
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:.7rem;
  box-shadow:0 14px 30px -8px rgba(30,60,160,.2);
  padding:.55rem .7rem;
  width:120px;
  text-align:left;
}
.uplift-badge .uplift-value{
  font-weight:700;
  color:var(--blue);
  font-size:1rem;
}
.uplift-badge .uplift-label{
  font-size:.58rem;
  color:var(--text-muted);
}

/* =====================================================
   CHALLENGE / SOLUTION SECTION
   ===================================================== */
.section-wrap{
  padding-top:4rem;
  padding-bottom:4rem;
}

/* ---------- Eyebrow pill ---------- */
.eyebrow-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  background:#fff;
  color:var(--blue);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.03em;
  padding:.5rem 1.1rem;
  border-radius:50px;
  border:1px solid #d7e0fa;
  box-shadow:0 2px 6px rgba(41,82,229,.08);
}
.eyebrow-pill .icon-circle{
  width:20px;height:20px;border-radius:50%;
  background:#eef2ff;
  display:flex;align-items:center;justify-content:center;
  font-size:.7rem;color:var(--blue);
}

.eyebrow-pill-dark{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  background:rgba(255,255,255,.15);
  color:#fff;
  font-size:.72rem;
  font-weight:600;
  padding:.4rem .9rem;
  border-radius:50px;
}

/* ---------- Left column ---------- */
.heading-left{
  font-size:2.2rem;
  font-weight:800;
  line-height:1.2;
  letter-spacing:-.4px;
}
.heading-left .blue{ color:var(--blue); }

.sub-left{
  color:var(--text-muted);
  font-size:1rem;
  line-height:1.6;
  max-width:480px;
}

.challenge-card{
  background:#fff;
  border-radius:.7rem;
  border:1px solid var(--border-soft);
  padding:1.1rem 1.2rem;
  position:relative;
  padding-left:1.6rem;
  box-shadow:0 2px 8px rgba(20,30,60,.03);
}
.challenge-card::before{
  content:"";
  position:absolute;
  left:0; top:.6rem; bottom:.6rem;
  width:4px;
  border-radius:4px;
  background:var(--accent-color, var(--blue));
}
.challenge-card.c-blue::before{ background:#2952e5; }
.challenge-card.c-green::before{ background:#16c98a; }
.challenge-card.c-purple::before{ background:#7b3ff2; }
.challenge-card.c-orange::before{ background:#f5a623; }

.challenge-icon{
  width:44px;height:44px;border-radius:.6rem;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;
  flex-shrink:0;
}
.icon-blue{ background:#e7edfc; color:#2952e5; }
.icon-green{ background:#e3fbf2; color:#16c98a; }
.icon-purple{ background:#f1e9fe; color:#7b3ff2; }
.icon-orange{ background:#fdf0e0; color:#f5a623; }

.challenge-title{
  font-weight:700;
  font-size:1rem;
  margin-bottom:.15rem;
}
.challenge-desc{
  font-size:.88rem;
  color:var(--text-muted);
  margin-bottom:0;
}

.btn-partner{
  border:1.5px solid var(--blue);
  color:var(--blue);
  font-weight:600;
  padding:.7rem 1.5rem;
  border-radius:50px;
  background:transparent;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  transition:.2s ease;
}
.btn-partner:hover{
  background:var(--blue);
  color:#fff;
}

/* ---------- Right solution card ---------- */
.solution-card{
  background:linear-gradient(155deg, #2c4be0 0%, #1530a8 60%, #0d1f6b 100%);
  border-radius:1.1rem;
  padding:2.2rem 2.2rem;
  color:#fff;
  box-shadow:0 25px 60px -10px rgba(20,40,140,.35);
  height:100%;
}

.solution-heading{
  font-size:1.6rem;
  font-weight:800;
  line-height:1.3;
  margin-bottom:.9rem;
}

.solution-sub{
  font-size:.92rem;
  color:#cdd6f7;
  line-height:1.6;
  margin-bottom:1.6rem;
}

.feature-row{
  display:flex;
  gap:1rem;
  padding:1rem 0;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.feature-row:last-child{ border-bottom:none; padding-bottom:0; }
.feature-row:first-of-type{ padding-top:0; }

#digsnoti_lab_challange .feature-icon{
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
  font-size:1.05rem;
  flex-shrink:0;
}
#digsnoti_lab_challange .feature-icon i{
    color: #ffffff;
}
.feature-title{
  font-weight:700;
  font-size:.97rem;
  margin-bottom:.15rem;
  color:#fff;
}
.feature-desc{
  font-size:.85rem;
  color:#c4cdee;
  margin-bottom:0;
}

/* =====================================================
   RESPONSIVE (both sections combined, no duplicate breakpoints)
   ===================================================== */
@media (max-width: 991.98px){
  .hero-heading{ font-size:2.1rem; }
  .dashboard-wrap{ margin-top:3rem; }
  .float-revenue{ top:-1rem; right:.5rem; }
  .float-partners{ bottom:4.5rem; left:.5rem; }
  .uplift-badge{ right:.5rem; }

  .heading-left{ font-size:1.9rem; }
  .solution-card{ margin-top:1rem; }
}

@media (max-width: 767.98px){
  .hero-section{ padding-top:2.5rem; padding-bottom:3rem; text-align:center; }
  .hero-sub{ margin-left:auto; margin-right:auto; }
  .btn-primary-custom, .btn-outline-custom{ width:100%; justify-content:center; }
  .features-list{ justify-content:center; }
  .dashboard-card{ min-height:auto; flex-direction:column; }
  .dash-sidebar{ flex-direction:row; width:100%; padding:.5rem 1rem; gap:.8rem; overflow-x:auto; }
  .float-card, .uplift-badge{ position:static; width:auto; margin-top:.6rem; display:inline-block; }
  .dashboard-wrap{ margin-top:1.5rem; }

  .section-wrap{ padding-top:2.5rem; padding-bottom:2.5rem; }
  .heading-left{ font-size:1.7rem; text-align:center; }
  .sub-left{ text-align:center; margin-left:auto; margin-right:auto; }
  .eyebrow-pill{ display:flex; margin:0 auto; width:max-content; }
  .btn-partner{ width:100%; justify-content:center; }
  .solution-card{ padding:1.6rem 1.4rem; }
  .solution-heading{ font-size:1.35rem; }
}

@media (max-width: 575.98px){
  .stat-row{ flex-wrap:wrap; }
  .stat-card{ min-width:45%; }
}
/* your organisaition */

.who-we-serve{
    padding:90px 0;
}

/* Header */

.section-badge{
    display:inline-block;
    padding:10px 24px;
    border-radius:50px;
    background:#eef2ff;
    color:#4b5563;
    font-size:14px;
    font-weight:600;
    margin-bottom:20px;
}

.section-title{
    font-size:52px;
    font-weight:700;
    color:#202124;
    margin-bottom:20px;
}

.section-title span{
    color:var(--primary);
}

.section-description{
    max-width:850px;
    margin:0 auto 60px;
    font-size:20px;
    color:#6b7280;
    line-height:1.8;
}

/* Cards */

.service-card{
    position:relative;
    border:1px solid #e5e7eb;
    border-radius:28px;
    padding:32px;
    height:100%;
    min-height: 300px !important;
    overflow:hidden;
    transition:all .3s ease;
}

.service-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.card-number{
    position:absolute;
    top:28px;
    right:28px;
    font-size:42px;
    font-weight:700;
    color:rgba(255,255,255,.85);
}

/* Icon */

.icon-wrapper{
    width:88px;
    height:88px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:28px;
    border:8px solid rgba(255,255,255,.75);
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.icon-wrapper i{
    color:#fff;
    font-size:36px;
    line-height:1;
}

/* Typography */

.service-card h4{
    font-size:20px;
    font-weight:700;
    color:#222;
    margin-bottom:14px;
}

.service-card p{
    color:#555;
    font-size:16px;
    line-height:1.7;
    margin:0;
}

/* Card Themes */

.card-blue{
    background:linear-gradient(135deg,#f5f8ff,#eef2fb);
}

.card-blue .icon-wrapper{
    background:var(--primary);
}

.card-purple{
    background:linear-gradient(135deg,#faf5ff,#f2ecfb);
}

.card-purple .icon-wrapper{
    background:var(--purple);
}

.card-green{
    background:linear-gradient(135deg,#f2fcfb,#edf7f6);
}

.card-green .icon-wrapper{
    background:var(--green);
}

.card-orange{
    background:linear-gradient(135deg,#fffaf6,#f7efe8);
}

.card-orange .icon-wrapper{
    background:var(--orange);
}

/* Responsive */

@media(max-width:991px){

    .section-title{
        font-size:40px;
    }

    .section-description{
        font-size:18px;
    }
}

@media(max-width:767px){

    .who-we-serve{
        padding:60px 0;
    }

    .section-title{
        font-size:30px;
    }

    .section-description{
        font-size:16px;
        margin-bottom:40px;
    }

    .service-card{
        padding:24px;
    }

    .icon-wrapper{
        width:72px;
        height:72px;
        margin-bottom:20px;
    }

    .icon-wrapper i{
        font-size:28px;
    }

    .card-number{
        font-size:32px;
    }
}
/* ===========================
   SECTION
=========================== */
#medeasyFeatureSectionUnique{
    padding:60px 15px;
    background:#f5f7fc;
}

/* ===========================
   CARD
=========================== */
.medeasyCardUnique{
    max-width:850px;
    margin:auto;
    padding:40px 35px;
    border-radius:20px;
    background:linear-gradient(180deg,#2f6dff 0%,#0c2d81 100%);
    color:#fff;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
}

/* ===========================
   HEADER
=========================== */
.medeasyBadgeUnique{
    display:inline-block;
    padding:6px 14px;
    border-radius:30px;
    background:rgba(255,255,255,.15);
    color:#fff;
    font-size:13px;
    margin-bottom:18px;
}

.medeasyTitleUnique{
    font-size:42px;
    font-weight:700;
    line-height:1.25;
    margin-bottom:15px;
}

.medeasyDescriptionUnique{
    color:rgba(255,255,255,.85);
    font-size:16px;
    line-height:1.7;
    margin-bottom:25px;
}

/* ===========================
   FEATURE ITEMS
=========================== */
.medeasyFeatureItemUnique{
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px 0;
    border-bottom:1px solid rgba(255,255,255,.12);
}

.medeasyFeatureItemUnique:last-child{
    border-bottom:none;
}

/* ===========================
   ICON
=========================== */
.medeasyIconBoxUnique{
    width:56px;
    height:56px;
    min-width:56px;
    border-radius:50%;
    background:rgba(72,203,255,.15);
    border:1px solid rgba(72,203,255,.25);

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;
}

.medeasyIconBoxUnique svg{
    width:24px;
    height:24px;
    stroke:#72e7ff;
    display:block;
}

/* ===========================
   CONTENT
=========================== */
.medeasyFeatureContentUnique{
    flex:1;
}

.medeasyFeatureTitleUnique{
    font-size:18px;
    font-weight:600;
    margin:0 0 5px;
    color:#fff;
}

.medeasyFeatureDescUnique{
    margin:0;
    color:rgba(255,255,255,.82);
    line-height:1.6;
    font-size:15px;
}

/* ===========================
   RESPONSIVE
=========================== */
@media(max-width:768px){

    .medeasyCardUnique{
        padding:30px 20px;
    }

    .medeasyTitleUnique{
        font-size:28px;
    }

    .medeasyDescriptionUnique{
        font-size:15px;
    }

    .medeasyIconBoxUnique{
        width:48px;
        height:48px;
        min-width:48px;
    }

    .medeasyIconBoxUnique svg{
        width:20px;
        height:20px;
    }

    .medeasyFeatureTitleUnique{
        font-size:16px;
    }

    .medeasyFeatureDescUnique{
        font-size:14px;
    }
}