.platform-section{
position:relative;
padding:130px 0;
overflow:hidden;
background:
radial-gradient(circle at 12% 22%, rgba(95,201,223,.14), transparent 24%),
radial-gradient(circle at 88% 18%, rgba(17,143,166,.14), transparent 22%);
color:#fff;
}

.platform-section::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
background-size:54px 54px;
mask-image:linear-gradient(180deg, rgba(0,0,0,.55), transparent 100%);
opacity:0;
pointer-events:none;
}

.platform-shell{
position:relative;
z-index:1;
display:grid;
grid-template-columns:minmax(0, .95fr) minmax(340px, 1.05fr);
gap:64px;
align-items:center;
min-width:0;
}

.platform-content{
max-width:660px;
min-width:0;
}

.platform-content > *{
opacity:0;
transform:translateY(18px);
animation:platformFadeUp .72s ease forwards;
}

.platform-content > *:nth-child(1){ animation-delay:.06s; }
.platform-content > *:nth-child(2){ animation-delay:.14s; }
.platform-content > *:nth-child(3){ animation-delay:.22s; }
.platform-content > *:nth-child(4){ animation-delay:.3s; }
.platform-content > *:nth-child(5){ animation-delay:.38s; }

.platform-kicker{
display:inline-flex;
align-items:center;
gap:10px;
padding:10px 16px;
margin-bottom:22px;
border-radius:999px;
background:rgba(255,255,255,.06);
border:1px solid rgba(95,201,223,.18);
color:#d7f6fb;
font-size:14px;
}

.platform-kicker::before{
content:"";
width:8px;
height:8px;
border-radius:50%;
background:#78e4f3;
box-shadow:0 0 14px rgba(120,228,243,.9);
}

.platform-title{
margin:0 0 18px;
font-size:clamp(38px, 4.8vw, 62px);
line-height:1.12;
letter-spacing:-.03em;
overflow-wrap:anywhere;
text-shadow:0 10px 32px rgba(0,0,0,.16);
}

.platform-text{
margin:0 0 30px;
font-size:18px;
line-height:1.9;
color:rgba(232,244,247,.82);
}

.platform-points{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:16px;
margin-bottom:28px;
}

.platform-point{
padding:20px 20px 18px;
border-radius:22px;
background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.08);
backdrop-filter:blur(10px);
box-shadow:0 16px 36px rgba(0,0,0,.12);
}

.platform-point strong{
display:block;
margin-bottom:10px;
font-size:20px;
color:#fff;
}

.platform-point span{
display:block;
font-size:14px;
line-height:1.8;
color:rgba(232,244,247,.76);
}

.platform-actions{
display:flex;
align-items:center;
justify-content:flex-start;
gap:14px;
}

.platform-cta{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:180px;
min-height:56px;
padding:0 28px;
border-radius:16px;
background:linear-gradient(135deg, #118fa6, #5fc9df);
box-shadow:0 18px 35px rgba(17,143,166,.28);
color:#fff;
font-size:16px;
font-weight:800;
text-decoration:none;
transition:transform .28s ease, box-shadow .28s ease, filter .28s ease;
}

.platform-cta:hover{
transform:translateY(-3px);
box-shadow:0 24px 42px rgba(17,143,166,.34);
filter:brightness(1.04);
}

.platform-features{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:16px;
min-width:0;
}

.platform-item{
display:flex;
align-items:center;
gap:12px;
padding:16px 18px;
border-radius:18px;
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.08);
color:#e7f7fb;
}

.feature-icon{
width:22px;
height:22px;
color:#73deef;
stroke-width:1.9;
flex:0 0 auto;
}

.feature-icon path,
.feature-icon line,
.feature-icon circle,
.feature-icon polyline{
stroke-dasharray:120;
stroke-dashoffset:120;
animation:platformDraw 4.2s ease-in-out infinite;
}

.platform-visual{
position:relative;
min-height:620px;
min-width:0;
opacity:0;
transform:translateY(22px);
animation:platformVisualReveal .82s ease forwards .24s;
}

.platform-orb{
position:absolute;
border-radius:50%;
filter:blur(12px);
pointer-events:none;
}

.platform-orb-one{
top:32px;
right:24px;
width:180px;
height:180px;
background:radial-gradient(circle, rgba(95,201,223,.26), transparent 68%);
}

.platform-orb-two{
bottom:40px;
left:10px;
width:220px;
height:220px;
background:radial-gradient(circle, rgba(17,143,166,.22), transparent 68%);
}

.platform-panel{
position:relative;
padding:24px;
margin:40px 28px 0 0;
border-radius:34px;
background:linear-gradient(180deg, rgba(8,31,43,.9), rgba(4,17,26,.92));
border:1px solid rgba(255,255,255,.08);
box-shadow:0 42px 90px rgba(0,0,0,.32);
backdrop-filter:blur(16px);
overflow:hidden;
min-width:0;
}

.platform-panel::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(135deg, rgba(126,223,235,.06), transparent 38%, transparent 60%, rgba(126,223,235,.04));
pointer-events:none;
}

.platform-panel-top{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:22px;
z-index:1;
gap:12px;
flex-wrap:wrap;
}

.platform-panel-pill{
display:inline-flex;
align-items:center;
padding:10px 14px;
border-radius:999px;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.08);
font-size:13px;
color:#d7f6fb;
}

.platform-panel-dots{
display:flex;
gap:7px;
}

.platform-panel-dots span{
width:9px;
height:9px;
border-radius:50%;
background:rgba(255,255,255,.25);
}

.platform-screen{
position:relative;
z-index:1;
display:grid;
grid-template-columns:1.1fr .9fr;
gap:18px;
margin-bottom:18px;
min-width:0;
}

.platform-chart{
display:flex;
align-items:flex-end;
gap:12px;
height:250px;
padding:26px 18px 18px;
border-radius:26px;
background:
linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
radial-gradient(circle at top, rgba(126,223,235,.14), transparent 60%);
}

.platform-chart span{
display:block;
flex:1;
min-height:34px;
border-radius:16px 16px 8px 8px;
background:linear-gradient(180deg, #8be9f5 0%, #169ab2 100%);
box-shadow:0 12px 24px rgba(22,154,178,.22);
animation:platformBars 4.2s ease-in-out infinite;
}

.platform-chart span:nth-child(2){ animation-delay:.2s; }
.platform-chart span:nth-child(3){ animation-delay:.4s; }
.platform-chart span:nth-child(4){ animation-delay:.6s; }
.platform-chart span:nth-child(5){ animation-delay:.8s; }

.platform-side{
display:grid;
gap:18px;
}

.platform-mini-card{
display:flex;
flex-direction:column;
justify-content:center;
min-height:116px;
padding:20px;
border-radius:22px;
background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.08);
}

.platform-mini-card small{
font-size:13px;
color:rgba(215,246,251,.72);
margin-bottom:8px;
}

.platform-mini-card strong{
font-size:32px;
line-height:1;
}

.platform-image-card{
position:relative;
z-index:1;
border-radius:26px;
overflow:hidden;
border:1px solid rgba(255,255,255,.08);
box-shadow:0 18px 38px rgba(0,0,0,.18);
}

.platform-image-card img{
width:100%;
display:block;
}

.platform-float{
position:absolute;
padding:18px 20px;
border-radius:20px;
background:rgba(7,28,40,.88);
border:1px solid rgba(95,201,223,.18);
box-shadow:0 22px 40px rgba(0,0,0,.22);
backdrop-filter:blur(14px);
max-width:220px;
animation:platformFloat 5s ease-in-out infinite;
}

.platform-float small{
display:block;
margin-bottom:8px;
font-size:13px;
color:rgba(215,246,251,.72);
}

.platform-float strong{
font-size:24px;
line-height:1.3;
}

.platform-float-top{
top:0;
left:0;
}

.platform-float-bottom{
right:-96px;
bottom:-17px;
animation-delay:.8s;
}

@keyframes platformBars{
0%,100%{
transform:translateY(0);
filter:brightness(1);
}
50%{
transform:translateY(-6px);
filter:brightness(1.12);
}
}

@keyframes platformFloat{
0%,100%{
transform:translateY(0);
}
50%{
transform:translateY(-10px);
}
}

@keyframes platformFadeUp{
from{
opacity:0;
transform:translateY(18px);
}
to{
opacity:1;
transform:translateY(0);
}
}

@keyframes platformVisualReveal{
from{
opacity:0;
transform:translateY(22px);
}
to{
opacity:1;
transform:translateY(0);
}
}

@keyframes platformDraw{
0%{
stroke-dashoffset:120;
opacity:.4;
}
40%{
stroke-dashoffset:0;
opacity:1;
}
70%{
stroke-dashoffset:0;
opacity:1;
}
100%{
stroke-dashoffset:120;
opacity:.4;
}
}

@media (max-width: 1100px){
.platform-shell{
grid-template-columns:1fr;
}

.platform-content{
max-width:none;
}

.platform-visual{
max-width:760px;
width:100%;
margin-inline:auto;
}
}

@media (max-width: 900px){
.platform-points{
grid-template-columns:1fr;
}

.platform-screen{
grid-template-columns:1fr;
}

.platform-panel{
margin:24px 0 0;
}

.platform-actions{
justify-content:stretch;
}

.platform-cta{
width:100%;
}

.platform-visual{
min-height:auto;
}

.platform-float{
position:static;
max-width:none;
margin-top:14px;
}
}

@media (max-width: 767px){
.platform-section{
padding:90px 0;
}

.platform-visual{
min-height:420px;
}

.platform-panel{
margin:24px 0 0;
padding:18px;
border-radius:26px;
}

.platform-chart{
height:190px;
gap:10px;
padding:18px 14px 14px;
}
}