/* =========================================================
1. HERO
========================================================= */
.hero-aurora{
max-width:100%;
position:absolute;
width:900px;
height:900px;
top:-200px;
left:-200px;
background:radial-gradient(circle,
rgba(59,130,246,.35) 0%,
rgba(59,130,246,.15) 30%,
transparent 70%);
filter:blur(120px);
animation:auroraMove 18s infinite alternate ease-in-out;
pointer-events:none;
z-index:0;
}
.hero-aurora-2{
max-width:100%;
top:200px;
left:auto;
right:-200px;
background:radial-gradient(circle,
rgba(34,197,94,.35) 0%,
rgba(34,197,94,.15) 30%,
transparent 70%);
animation:auroraMoveTwo 22s infinite alternate ease-in-out;
}
@keyframes auroraMove{
0%{transform:translate(0,0) scale(1);}
100%{transform:translate(120px,80px) scale(1.15);}}
@keyframes auroraMoveTwo{0%{transform:translate(0,0) scale(1);}
100%{transform:translate(-120px,-60px) scale(1.2);}
}
.hero-grid-overlay{
position:absolute;
inset:0;
background-image:
linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
background-size:60px 60px;
pointer-events:none;
z-index:0;
}
.hero-enterprise{
min-height: calc(100vh - var(--nav-height));
padding-top: var(--nav-height);
position:relative;
overflow:hidden;
}
/* GRID LAYOUT */
.hero-grid{
display:grid;
grid-template-columns: 1.3fr 0.7fr;
gap: var(--space-xl);
align-items:center;
}
/* LEFT SIDE */
.hero-left h1{
max-width: 18ch;
background: var(--gradient-primary);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.hero-sub{
margin-top: var(--space-md);
font-size:17px;
line-height:1.6;
opacity:.85;
}
.hero-cta{
margin-top: var(--space-lg);
display: flex;
gap: var(--space-sm);
flex-wrap: wrap;
align-items:center;
}
.hero-cta a{
flex: none;
min-width: 220px;
height:52px;
text-align:center;
padding:14px 22px;
border-radius:12px;
font-weight:700;
display:inline-flex;
align-items:center;
justify-content:center;
transition:.3s;
}
.hero-proof{
margin-top: var(--space-sm);
font-size:14px;
opacity:.7;
max-width:500px;
}
.hero-proof::before{
content:"";
display:block;
width:120px;
height:2px;
margin-bottom:12px;
background:linear-gradient(90deg,transparent,#3b82f6,transparent);
opacity:.6;
}
/* RIGHT SIDE PIPELINE */
.pipeline-status{
font-size:13px;
font-weight:600;
margin-bottom:14px;
letter-spacing:.3px;
color:#93c5fd;
display:flex;
align-items:center;
gap:8px;
opacity:.9;
}
.pipeline-status::before{
content:"●";
color:#3b82f6;
animation:scanPulse 1.5s infinite;
}
.pipeline-text{
transition:opacity .4s ease;
}
.hero-left{
display:flex;
flex-direction:column;
justify-content:center;
min-height:auto;
padding-right:20px;
flex:1;
max-width: 640px;
}
.hero-right{
padding: var(--space-md);
max-width: 480px;
margin-left: 0;
justify-self: start;
position:relative;
animation:float 6s ease-in-out infinite;
will-change:transform;
transform:translateZ(0);
margin-left: -20px;
}
@keyframes float{
0%{transform:translateY(0)}
50%{transform:translateY(-8px)}
100%{transform:translateY(0)}
}
.hero-right::before{
content:"";
position:absolute;
width:500px;
height:500px;
background:radial-gradient(circle,
rgba(99,102,241,.25),
transparent 70%);
top:-100px;
right:-100px;
filter:blur(80px);
pointer-events:none;
}
/* DASHBOARD SHELL */
.workflow-dashboard{
background:
linear-gradient(180deg,
rgba(15,23,42,.9),
rgba(5,10,25,.95)
);
border:1px solid rgba(255,255,255,.08);
border-radius:22px;
transform: scale(0.85) rotateX(6deg) rotateY(-6deg);
box-shadow:
  0 20px 50px rgba(0,0,0,.45),
  0 0 20px rgba(59,130,246,.08);
padding:30px;
position:relative;
transform-style:preserve-3d;
backdrop-filter: blur(12px);
transition:transform .5s ease;
}
.dashboard-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom: var(--space-md);
}
.dashboard-title{
font-size:14px;
font-weight:700;
letter-spacing:.4px;
opacity:.8;
}
.dashboard-perspective{
perspective:1600px;
display:flex;
justify-content:center;
align-items:center;
}
.app-chrome{
display:flex;
align-items:center;
justify-content:space-between;
padding:10px 14px;
margin:-30px -30px 20px -30px;
background:rgba(255,255,255,.04);
border-bottom:1px solid rgba(255,255,255,.06);
border-radius:22px 22px 0 0;
}
.app-controls{
display:flex;
gap:8px;
}
.app-controls span{
width:10px;
height:10px;
border-radius:50%;
background:#ef4444;
}
.app-controls span:nth-child(2){background:#f59e0b}
.app-controls span:nth-child(3){background:#22c55e}
.app-title{
font-size:12px;
opacity:.6;
letter-spacing:.4px;
}
.system-status{
display:flex;
align-items:center;
gap:8px;
font-size:12px;
color:#fca5a5;
}
.scanning .status-dot{
background:#3b82f6;
box-shadow:0 0 10px #3b82f6;
animation:scanPulse 1.5s infinite;
}
@keyframes scanPulse{
0%{transform:scale(1)}
50%{transform:scale(1.4)}
100%{transform:scale(1)}
}
.status-dot{
width:8px;
height:8px;
border-radius:50%;
background:#ef4444;
box-shadow:0 0 10px #ef4444;
}
.workflow{
position:relative;
display:flex;
justify-content:space-between;
align-items:center;
height:260px;
padding: var(--space-lg);
gap: var(--space-lg);
background:rgba(15,23,42,.6);
border:1px solid rgba(255,255,255,.08);
border-radius:20px;
box-shadow:
0 30px 80px rgba(0,0,0,.45),
0 0 60px rgba(59,130,246,.12);
overflow:hidden;
}
.workflow::before{
content:"";
position:absolute;
left:40px;
right:40px;
top:68%;
height:18px;
border-radius:10px;
background:linear-gradient(90deg,#1e293b 0%,#334155 30%,#64748b 50%,#334155 70%,#1e293b 100%);
background-size:200% 100%;
box-shadow:
0 0 10px rgba(59,130,246,.4);
animation:pipelineMove 4s linear infinite;
}
@keyframes pipelineMove{
0%{background-position:0% 0;}
100%{background-position:200% 0;}
}
.dashboard-metrics{
display:flex;
gap: var(--space-md);
margin-top: var(--space-md);
}
.metric-box{
flex:1;
background:rgba(15,23,42,.7);
border:1px solid rgba(255,255,255,.08);
border-radius:14px;
padding:16px;
text-align:center;
}
.metric-box:first-child{
animation:dangerPulse 2s infinite;
}
@keyframes dangerPulse{
0%{box-shadow:0 0 0 rgba(239,68,68,0);}
50%{box-shadow:0 0 30px rgba(239,68,68,.5);}
100%{box-shadow:0 0 0 rgba(239,68,68,0);}
}
.metric-label{
display:block;
font-size:11px;
opacity:.6;
margin-bottom:6px;
}
.metric-value{
font-size:20px;
font-weight:800;
color:#ef4444;
}
.metric-box.recovered .metric-value{
color:#22c55e;
}
.stage{
flex:1;
display:flex;
flex-direction:column;
align-items:center;
position:relative;
}
.stage:not(:last-child)::after{
content:"";
position:absolute;
top:50%;
left:100%;
width:100%;
height:2px;
background:rgba(255,255,255,.15);
transform:translateY(-50%);
}
.stage-node{
width:70px;
height:70px;
font-size:11px;
font-weight:700;
text-align:center;
top:-12px;
display:flex;
align-items:center;
justify-content:center;
position:relative;
padding:10px 16px;
background:#0f172a;
border:2px solid rgba(255,255,255,.12);
border-radius:50%;
box-shadow:
0 10px 25px rgba(0,0,0,.35),
0 0 20px rgba(59,130,246,.15);
}
.leak{
position:absolute;
top:80px;
left:50%;
transform:translateX(-50%);
display:flex;
flex-direction:column;
align-items:center;
font-size:12px;
color:#fca5a5;
white-space:nowrap;
opacity:0;
}
.leak-icon{
font-size:22px;
color:#ef4444;
text-shadow:0 0 10px rgba(239,68,68,.8);
}
.loss{
margin-top:4px;
color:#ef4444;
font-weight:800;
font-size:13px;
}
.danger{
color:#fca5a5;
animation:dangerBlink 1.2s infinite;
}
@keyframes dangerBlink{
0%{opacity:1;}
50%{opacity:.4;}
100%{opacity:1;}
}
.revenue-token{
position:absolute;
max-width:80px;
white-space:nowrap;
top:68%;
transform:translateY(-50%);
background:linear-gradient(135deg,#22c55e,#16a34a);
font-size:13px;
padding:6px 14px;
color:white;
font-weight:700;
border-radius:16px;
box-shadow:
0 0 20px rgba(34,197,94,.7),
0 10px 25px rgba(0,0,0,.45);
animation:revenueFlow 6s linear infinite;
}
@keyframes revenueFlow{
0%{left:40px;opacity:0;}
10%{opacity:1;}
90%{opacity:1;}
100%{left:95%;opacity:0;}
}
.fix-banner{
margin-top: var(--space-lg);
padding: var(--space-sm) var(--space-md);
background:linear-gradient(90deg,rgba(34,197,94,.15),rgba(59,130,246,.15));
border:1px solid rgba(34,197,94,.4);
border-radius:20px;
text-align:center;
font-weight:600;
opacity:0;
transform:translateY(10px);
transition:.6s ease;
}
.fix-banner.active{
opacity:1;
transform:translateY(0);
box-shadow:
0 0 30px rgba(34,197,94,.5),
0 10px 30px rgba(0,0,0,.45);
}
.revenue-stage{
background:#16a34a;
box-shadow:0 0 20px rgba(34,197,94,.6);
}
.hero-enterprise::before{
max-width:100%;
content:"";
position:absolute;
width:800px;
height:800px;
background:radial-gradient(circle,#3b82f6 0%,transparent 70%);
top:-200px;
right:-200px;
opacity:.25;
filter:blur(120px);
pointer-events:none;
}
.hero-enterprise::after{
max-width:100%;
content:"";
position:absolute;
width:600px;
height:600px;
background:radial-gradient(circle,#22c55e 0%,transparent 70%);
top:40%;
right:15%;
opacity:.15;
filter:blur(120px);
pointer-events:none;
}

/* ==================================================================================================================
2. PRACTICEGRID PLATFORM ARCHITECTURE
================================================================================================================== */
.pg-architecture{
position:relative;
overflow:hidden;
background: var(--bg-primary);
isolation: isolate;
z-index:0;
}
.pg-architecture .section-frame{
  background: rgba(0,0,0,0.75); /* ✅ REQUIRED for dots visibility */
  backdrop-filter: blur(2px);  /* optional premium */
}
.pg-architecture-frame{
  position: relative;
}
.pg-architecture-frame::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(rgba(255,255,255,.18) 1px, transparent 1px);
  background-size:18px 18px;
  opacity:.8;
  pointer-events:none;
  z-index:0;
  border-radius: inherit; /* ✅ keeps dots inside frame */
}
.pg-architecture-frame > * {
  position: relative;
  z-index: 2;
}
.architecture-grid{
display:grid;
grid-template-columns:320px 1fr 300px;
gap: var(--space-lg);
align-items:center;
max-width:1200px;
margin:auto;
position:relative;
overflow:visible;
z-index:2;
}
/* INPUTS */
.arch-inputs{
display:flex;
flex-direction:column;
gap: var(--space-md);
z-index:3;
position:relative;
}
.input-node{
width:150px;
height:38px;
font-size:12px;
border-radius:10px;
display:flex;
align-items:center;
justify-content:center;
background:var(--secondary);
font-weight:600;
cursor:pointer;
box-shadow:
0 10px 30px rgba(0,0,0,.4);
transition:.3s;
position:relative;
z-index:2;
}
.input-node:hover{
transform:translateX(8px);
box-shadow:
0 0 25px rgba(99,102,241,.6);
}
/* ENGINE */
.arch-engine{
position:relative;
display:flex;
justify-content:center;
align-items:center;
width:100%;
height:100%;
z-index:5;
}
.arch-engine::before{
content:"";
position:absolute;
width:320px;
height:320px;
border-radius:50%;
background:radial-gradient(circle,rgba(99,102,241,.22) 0%,rgba(99,102,241,.16) 20%,rgba(99,102,241,.10) 35%,transparent 60%);
filter:blur(10px);
}
.arch-engine::after{
content:"";
position:absolute;
width:560px;
height:560px;
border-radius:50%;
background:radial-gradient(circle,rgba(59,130,246,.18) 0%,rgba(59,130,246,.10) 30%,rgba(59,130,246,.05) 50%,transparent 70%);
filter:blur(20px);
}
.engine-circle{
width:220px;
height:220px;
border-radius:50%;
background:transparent;
box-shadow:
0 0 0 8px rgba(255,255,255,.05),
0 0 30px rgba(59,130,246,.25),
0 20px 40px rgba(0,0,0,.6);
display:flex;
align-items:center;
justify-content:center;
text-align:center;
font-weight:700;
position:relative;
z-index:3;
margin:auto;
}
.engine-inner{
display:flex;
flex-direction:column;
align-items:center;
gap:4px;
padding:10px 18px;
text-align:center;
}
.engine-inner h3{
font-size:18px;
margin:0;
}
.engine-sub{
font-size:12px;
opacity:.8;
}
.engine-status{
font-size:13px;
line-height:1.3;
max-width:140px;
color:#93c5fd;
opacity:.9;
animation:enginePulse 2s infinite;
}
@keyframes enginePulse{
0%{opacity:.4}
50%{opacity:1}
100%{opacity:.4}
}
.engine-icon{
width:32px;
height:32px;
color:#93c5fd;
margin-bottom:8px;
}
/* EMR RING */
.emr-ring-wrapper{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%, -50%);
}
.emr-ring{
position:relative;
top:0;
left:0;
width:440px;
height:440px;
display:flex;
align-items:center;
justify-content:center;
pointer-events:none;
transform-origin: center;
backface-visibility: hidden;
transform-style: preserve-3d;
animation: rotateCW 20s linear infinite;
}
@keyframes rotateCW{
from{ transform: rotate(0deg); }
to{ transform: rotate(360deg); }
}
.emr{
position:absolute;
top:50%;
left:50%;
width:64px;
height:64px;
border-radius:50%;
background:white;
padding:6px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
box-shadow:0 6px 20px rgba(0,0,0,.45);
transform-origin: center;
}
.emr-inner{
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
transform-origin:center;
will-change: transform;
backface-visibility: hidden;
transform-style: preserve-3d;
animation: rotateCCW 20s linear infinite;
}
@keyframes rotateCCW{
from{ transform: rotate(0deg); }
to{ transform: rotate(-360deg); }
}
.emr-inner img{
width:100%;
height:100%;
object-fit:cover;
}
.emr:hover{
filter:brightness(1.1);
}
.emr:nth-child(1){transform: translate(-50%, -50%) rotate(0deg) translateX(150px) rotate(0deg);}
.emr:nth-child(2){transform: translate(-50%, -50%) rotate(45deg) translateX(150px) rotate(-45deg);}
.emr:nth-child(3){transform: translate(-50%, -50%) rotate(90deg) translateX(150px) rotate(-90deg);}
.emr:nth-child(4){transform: translate(-50%, -50%) rotate(135deg) translateX(150px) rotate(-135deg);}
.emr:nth-child(5){transform: translate(-50%, -50%) rotate(180deg) translateX(150px) rotate(-180deg);}
.emr:nth-child(6){transform: translate(-50%, -50%) rotate(225deg) translateX(150px) rotate(-225deg);}
.emr:nth-child(7){transform: translate(-50%, -50%) rotate(270deg) translateX(150px) rotate(-270deg);}
.emr:nth-child(8){transform: translate(-50%, -50%) rotate(315deg) translateX(150px) rotate(-315deg);}
/* DASHBOARD */
.arch-dashboard{
display:flex;
justify-content:center;
}
.dashboard-card{
background:rgba(20,25,55,.9);
padding: var(--space-lg);
border-radius:18px;
border:1px solid rgba(255,255,255,.12);
width:260px;
background:transparent;
box-shadow:
0 25px 80px rgba(0,0,0,.55),
0 0 40px rgba(99,102,241,.2);
position:relative;
z-index:2;
}
.dashboard-card h3{
font-size:20px;
font-weight:700;
margin-bottom:20px;
background:var(--pg-gradient-title);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.dashboard-metric{
margin-top: var(--space-sm);
text-align:center;
padding: var(--space-sm);
border-radius:12px;
background:transparent;
border:1px solid rgba(255,255,255,.12);
transition:.3s;
}
.dashboard-metric:hover{
transform:translateY(-3px);
border:1px solid rgba(99,102,241,.4);
box-shadow:0 10px 30px rgba(0,0,0,.5);
}
.dashboard-metric p{
font-size:12px;
opacity:.7;
margin-top:4px;
}
.dashboard-metric span{
font-size:30px;
font-weight:900;
letter-spacing:.5px;
}
#metric1{color:#f59e0b;   /* yellow */}
#metric2{color:#ef4444;   /* red */}
#metric3{color:#22c55e;   /* green */}
/* NETWORK LINES */
.network-lines{
position:absolute;
top:0;
left:0;
width:100%;
height:650px;
pointer-events:none;
z-index:10;
}
.network-lines path{
stroke:#60a5fa;
stroke-width:2;
stroke-dasharray: 3 6;
stroke-dashoffset: 0;
stroke-linecap:round;
stroke-linejoin: round;
opacity:.9;
fill:none;
filter:
drop-shadow(0 0 6px rgba(96,165,250,.6))
drop-shadow(0 0 12px rgba(96,165,250,.3));
animation:dataFlow 4s linear infinite;
}
@keyframes dataFlow{
0%{stroke-dashoffset:0}
100%{stroke-dashoffset:-60}
}

/* ==================================================================================================================
3. PRACTICEGRID REVENUE FLOW
================================================================================================================== */
.revenue-flow{
display:grid;
grid-template-columns:repeat(4,1fr);
gap: var(--space-md);
align-items:stretch;
position:relative;
max-width:1300px;
margin:auto;
}
/* STEP */
.flow-step{
display:flex;
flex-direction:column;
justify-content:space-between;
align-items:center;
text-align:center;
position:relative;
padding: var(--space-lg) var(--space-md);
min-height:320px;
background:transparent;
border:1px solid var( --border-default);
border-radius:var(--radius-sm);
transition:.35s;
z-index:2;
}
.flow-number{
font-size:12px;
font-weight:800;
letter-spacing:.15em;
color:#93c5fd;
opacity:.8;
}
/* ICON */
.flow-icon{
position:relative;
width:48px;
height:48px;
margin: var(--space-md) auto var(--space-sm);
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
background:
linear-gradient(135deg,#6366f1,#3b82f6),
radial-gradient(circle at 30% 30%,rgba(255,255,255,.2),transparent 60%);
}
.flow-icon svg{
width:34px;
height:34px;
color:white;
}
.flow-step:hover .flow-icon svg{
transform:scale(1.1);
transition:.3s;
}
/* TEXT */
.flow-step h3{
font-size:22px;
font-weight:700;
margin-top:6px;
margin-bottom:8px;
color:#f1f5ff;
}
.flow-step p{
font-size:15px;
line-height:1.6;
color:#cbd5f5;
margin-bottom: var(--space-sm);
max-width:100%;
}
/* STAT */
.flow-stat{
min-width:190px;
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
justify-content:space-between;
font-size:13px;
font-weight:700;
padding:10px 18px;
border-radius:var(--radius-sm);
background:transparent;
border:1px solid var( --border-default);
color:#e0e7ff;
}
/* LINE */
.flow-result{
margin-top: var(--space-lg);
padding: var(--space-lg);
background:linear-gradient(90deg,rgba(34,197,94,.15),rgba(59,130,246,.15));
border:1px solid rgba(34,197,94,.35);
border-radius:10px;
text-align:center;
font-size:20px;
font-weight:700;
color:#e0e7ff;
}

/* =========================================================
4. THE “BEFORRE V/S AFTER RCM TRANSFORMATION
========================================================= */

.transform-grid{
display:grid;
grid-template-columns:1fr 120px 1fr;
gap: var(--space-lg);
margin-top: var(--space-lg);
align-items:center;
}
.transform-grid::before{
content:"";
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
width:180px;
height:180px;
background:radial-gradient(circle, rgba(99,102,241,0.4), transparent 70%);
pointer-events:none;
}
.transform-card{
padding: var(--space-lg);
border-radius:var(--radius-lg);
background:rgba(20,25,55,0.65);
border:1px solid rgba(255,255,255,0.06);
transition:.35s;
position:relative;
overflow:hidden;
animation:floatTransform 6s ease-in-out infinite;
}
@keyframes floatTransform{
0%{transform:translateY(0)}
50%{transform:translateY(-4px)}
100%{transform:translateY(0)}
}
.transform-card:hover{
transform:translateY(-8px);
}
.transform-before{
border-left:4px solid #ef4444;
background:rgba(40,10,15,0.6);
}
.transform-after{
border-left:4px solid #22c55e;
background:rgba(10,40,20,0.6);
box-shadow:0 0 40px rgba(34,197,94,0.15);
}
.transform-card ul{
margin-top:20px;
line-height:1.8;
list-style:none;
padding:0;
}
.transform-card li{
display:flex;
align-items:center;
gap:12px;
margin-bottom:14px;
font-size:15px;
}
.transform-before li::before{
content:"✕";
color:#ef4444;
font-weight:bold;
}
.transform-after li::before{
content:"✓";
color:#22c55e;
font-weight:bold;
}
.transform-before li::before,
.transform-after li::before{
font-size:18px;
}
.transform-card h3{
font-size:20px;
margin-bottom:10px;
display:flex;
align-items:center;
gap:10px;
justify-content:center;
}
.transform-card h3 svg{
width:20px;
height:20px;
}
.transform-before h3{
color:#ef4444;
}
.transform-after h3{
color:#22c55e;
}
.transform-section{
position:relative;
padding: var(--space-xl) 0;
background:transparent;
overflow:hidden;
}
.transform-arrow{
display:flex;
align-items:center;
justify-content:center;
font-size:60px;
color:#6366f1;
opacity:.9;
text-shadow:
0 0 10px rgba(99,102,241,0.6),
0 0 30px rgba(99,102,241,0.4);
animation:arrowPulse 2.5s infinite ease-in-out;
}
@keyframes arrowPulse{
0%{transform:translateX(0)}
50%{transform:translateX(8px)}
100%{transform:translateX(0)}
}
.transform-arrow svg{
width:48px;
height:48px;
stroke:#6366f1;
}
.transform-tagline{
text-align:center;
color:var(--text-secondary);
margin-top:6px;
margin-bottom:30px;
font-size:16px;
}

/* =========================================================
5. RCM MATURITY SCORE GAUGE
========================================================= */
.rcm-score-layout{
display:grid;
grid-template-columns:1fr 1fr;
gap: var(--space-xl);
margin-top: var(--space-xl);
align-items:center;
}
.question{
display:flex;
flex-direction:column;
gap:10px;
margin-bottom:30px;
}
.question select{
width:100%;
padding:14px;
border-radius:10px;
background:transparent;
border:1px solid rgba(255,255,255,0.08);
color:var(--text-primary);
}
.rcm-gauge-box{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
}
.gauge{
width:260px;
margin:30px auto;
position:relative;
}
.rcm-gauge-box a{
margin-top:40px;
display:inline-block;
}
.score-number{
position:absolute;
bottom:20px;
left:50%;
transform:translateX(-50%);
font-size:38px;
font-weight:800;
}
.rcm-questions{
background:rgba(10,15,35,0.6);
padding: var(--space-lg);
border-radius:var(--radius-lg);
border:1px solid rgba(255,255,255,0.05);
}
.rcm-questions button{
display:block;
margin:30px auto 0;
}

/* =========================================================
6. PRACTICEGRID OUTCOMES
========================================================= */
.pg-outcomes .container{
position:relative;
z-index:2;
}
.pg-outcomes{
background:
radial-gradient(circle at 50% 40%, rgba(34,197,94,0.18), transparent 40%),
radial-gradient(circle at 20% 20%, rgba(99,102,241,0.18), transparent 40%),
radial-gradient(circle at 80% 80%, rgba(59,130,246,0.12), transparent 40%),
linear-gradient(180deg,#020617 0%, #020617 100%);
border-top:1px solid rgba(255,255,255,0.08);
box-shadow:inset 0 40px 80px rgba(0,0,0,.6);
position:relative;
overflow:hidden;
z-index:1;
}
.pg-outcomes::before{
content:"";
position:absolute;
width:900px;
height:900px;
top:50%;
left:50%;
transform:translate(-50%,-50%);
background:radial-gradient(circle, rgba(255,255,255,0.04), transparent 70%);
filter:blur(120px);
pointer-events:none;
}
.pg-outcomes .section-header{
position:relative;
z-index:2;
}
.pg-outcomes .section-header::after{
content:"";
display:block;
width:120px;
height:3px;
margin:20px auto 0;
background:linear-gradient(90deg,#22c55e,#3b82f6);
opacity:.8;
}
.pg-outcomes h2{
font-size:clamp(34px,4vw,52px);
font-weight:900;
letter-spacing:-0.02em;
text-align:center;
background:linear-gradient(90deg,#fff,#c4b5fd,#93c5fd);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.section-header.center{
text-align:center;
max-width:800px;
margin: 0 auto var(--space-xl);
}
.pg-stories{
display:flex;
flex-direction:column;
gap: var(--space-lg);
}
/* STORY LAYOUT */
.pg-story{
display:grid;
grid-template-columns:1.2fr .8fr;
gap: var(--space-xl);
align-items:center;
opacity:0;
transform:translateY(40px);
transition:.8s ease;
}
.pg-story.visible{
opacity:1;
transform:translateY(0);
}
/* LEFT CONTENT */
.pg-story-left{
max-width:650px;
}
.pg-label{
font-size:12px;
font-weight:700;
letter-spacing:.1em;
text-transform:uppercase;
color:#93c5fd;
display:block;
margin-bottom:16px;
}
.pg-story-left p{
font-size:16px;
line-height:1.7;
color:#cbd5f5;
margin-bottom:18px;
}
.pg-story-left ul{
margin-top:20px;
padding-left:18px;
}
.pg-story-left li{
margin-bottom:10px;
color:#e0e7ff;
font-size:15px;
}
/* RIGHT METRIC */
.pg-story-right{
display:flex;
justify-content:center;
}
.pg-metric-card{
width:240px;
min-height:220px;
border-radius:18px;
color:#fff;
background:
linear-gradient(180deg,#0f172a,#020617);
border:1px solid rgba(255,255,255,.08);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
padding-top:24px;
gap:10px;
box-shadow:
0 30px 80px rgba(0,0,0,.6),
0 0 40px rgba(59,130,246,.25);
transition:.4s;
}
.pg-metric-card:hover{
transform:translateY(-10px) scale(1.03);
box-shadow:
0 40px 120px rgba(0,0,0,.7),
0 0 60px rgba(99,102,241,.4);
}
.pg-metric-card h3{
font-size:42px;
font-weight:900;
margin-bottom:6px;
background:linear-gradient(90deg,#22c55e,#3b82f6);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.pg-metric-card p{
font-size:14px;
opacity:.75;
}
/* ROI GRAPH */
.roi-line-graph{
height:60px;
margin-bottom:12px;
}
.roi-value{
display:flex;
flex-direction:column;
align-items:center;
gap:4px;
margin-top:10px;
}
.line-svg{
width:100%;
height:100%;
}
.line-path{
fill:none;
stroke:url(#lineGradient);
stroke-width:2.5;
stroke-dasharray:200;
stroke-dashoffset:200;
transition:stroke-dashoffset 1.5s ease;
}
.roi-main{
font-size:40px;
font-weight:900;
background:linear-gradient(90deg,#22c55e,#3b82f6);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.roi-sub{
font-size:13px;
opacity:.7;
margin-top:4px;
}
.roi-graph{
display:flex;
align-items:flex-end;
gap:6px;
height:60px;
margin-bottom:14px;
}
.roi-bar{
width:10px;
height:0;
background:rgba(255,255,255,0.2);
border-radius:4px;
transition:height 1.2s ease;
}
.roi-bar.highlight{
background:linear-gradient(180deg,#22c55e,#3b82f6);
box-shadow:0 0 12px rgba(59,130,246,.6);
}
.roi-kpi-icon{
width:60px;
height:60px;
border-radius:16px;
display:flex;
align-items:center;
justify-content:center;
font-size:26px;
font-weight:900;
color:#22c55e;
background:linear-gradient(135deg,rgba(34,197,94,.15),rgba(59,130,246,.15));
border:1px solid rgba(34,197,94,.4);
box-shadow:
0 0 20px rgba(34,197,94,.4),
0 10px 30px rgba(0,0,0,.5);
}
.kpi-style{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.kpi-style .roi-main{
display:block;
font-size:48px;
font-size:48px;
font-weight:900;
background:linear-gradient(90deg,#22c55e,#3b82f6);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.kpi-style::before{
color:#22c55e;
font-size:10px;
margin-bottom:6px;
animation:pulseDot 1.5s infinite;
}
@keyframes pulseDot{
0%{opacity:.4}
50%{opacity:1}
100%{opacity:.4}
}
/* ALTERNATING LAYOUT */
.pg-story:nth-child(even){
grid-template-columns:.8fr 1.2fr;
}
.pg-story:nth-child(even) .pg-story-left{
order:2;
}
.pg-story:nth-child(even) .pg-story-right{
order:1;
}
.pg-story:nth-child(2) .pg-metric-card{
background:linear-gradient(180deg,#0b1220,#020617);
border:1px solid rgba(59,130,246,.25);
}

/* =========================================================
7. RCM FRAMEWORK TIMELINE
========================================================= */

.pg-framework{
position:relative;
overflow:hidden;
}
/* CENTER LINE */
.framework-timeline{
position:relative;
max-width:900px;
margin: var(--space-lg) auto 0;
display:flex;
flex-direction:column;
gap: var(--space-lg);
}
/* STEP */
.framework-step{
display:grid;
grid-template-columns:80px 1fr;
align-items:start; /* 🔥 THIS FIXES ALIGNMENT */
column-gap:24px;
position:relative;
opacity:1;
transform:none;
}
.framework-step::after{
content:"";
grid-column:3;
}
.framework-step:not(:last-child)::before{
content:"";
position:absolute;
left:32px;
top:64px; /* starts EXACTLY from bottom of circle */
width:2px;
min-height:90px;
background:linear-gradient(
180deg,
rgba(99,102,241,.6),
rgba(59,130,246,.6)
);
opacity:.6;
}
/* CIRCLE */
.framework-circle{
width:64px;
height:64px;
font-size:18px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
grid-column:1;
justify-self:center;
font-weight:900;
color:#fff;
color:transparent;
position:relative;
z-index:2;
transition:.4s;
}
/* GLOW ON HOVER */
.framework-step:hover .framework-circle{
transform:scale(1.08);
box-shadow:
0 0 0 8px rgba(255,255,255,.05),
0 0 40px rgba(34,197,94,.4),
0 10px 50px rgba(0,0,0,.7);
color:#4ade80;
}
/* CONTENT */
.framework-content{
grid-column:2;
text-align:left;
padding-top:2px;
}
.framework-content h3{
font-size:18px;
margin-bottom:6px;
font-weight:700;
color:#f1f5ff;
}
.framework-content p{
font-size:14px;
line-height:1.5;
max-width:420px;
color:#cbd5f5;
}
/* Framework Right */
.framework-wrapper{
display:grid;
grid-template-columns:1fr 420px;
min-width:0;
gap: var(--space-lg);
align-items:center;
max-width:1100px;
margin: var(--space-lg) auto 0;
}
.framework-card{
background:
linear-gradient(180deg,#0f172a,#020617);
border:1px solid rgba(255,255,255,.08);
border-radius:20px;
padding: var(--space-lg);
box-shadow:
0 30px 80px rgba(0,0,0,.6),
0 0 40px rgba(59,130,246,.15);
}
.framework-card h4{
font-size:18px;
margin-bottom:10px;
}
.framework-card p{
font-size:14px;
color:#cbd5f5;
line-height:1.6;
margin-bottom:16px;
}
.framework-card ul{
padding-left:18px;
}
.framework-card li{
font-size:13px;
margin-bottom:8px;
color:#9ca3af;
}
.framework-right{
  display:flex;
  align-items:center;
}