*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:#17243a;line-height:1.55}a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:#ffffffee;backdrop-filter:blur(12px);border-bottom:1px solid #e3e8f0}.nav-wrap{height:84px;display:flex;align-items:center;gap:22px}.brand img{width:270px}.main-nav{display:flex;gap:20px;margin-left:auto}.main-nav a{font-size:13px;font-weight:700;color:#596981}.btn{display:inline-flex;padding:13px 19px;border-radius:12px;font-weight:800;border:0;cursor:pointer}.btn-primary{background:linear-gradient(135deg,#5b4ee8,#1d8bd7);color:white}.btn-dark{background:#17243a;color:white}.btn-outline{border:1px solid #ccd6e6;background:white}.menu-btn{display:none;border:0;background:none;font-size:28px}.hero{background:radial-gradient(circle at 15% 15%,#eeeaff,transparent 30%),radial-gradient(circle at 90% 40%,#e9fbf7,transparent 30%),#f8fbff}.hero-grid{min-height:650px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.eyebrow,.kicker{font-size:12px;font-weight:900;letter-spacing:1.4px;color:#5b4ee8}.hero h1,.section h2{font-size:58px;line-height:1.05;letter-spacing:-2.5px;margin:15px 0;color:#17243a}.hero h1 span{background:linear-gradient(90deg,#5b4ee8,#1d8bd7,#2bb89f);-webkit-background-clip:text;color:transparent}.hero p,.head p,.section p{color:#65758b}.actions{display:flex;gap:12px;margin:26px 0}.mini{font-size:13px;color:#607087}.visual{height:470px;border-radius:30px;background:linear-gradient(145deg,#161c43,#25215f,#174567);position:relative;box-shadow:0 30px 70px #2a347033}.book{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:170px;height:120px;border-radius:25px;background:linear-gradient(90deg,#5b4ee8 50%,#2bb89f 50%);display:grid;place-items:center;color:#fff;font-size:28px;font-weight:900}.pill{position:absolute;background:white;padding:12px 16px;border-radius:14px;font-weight:800;font-size:12px}.p1{top:70px;left:35px}.p2{top:95px;right:35px}.p3{bottom:90px;left:35px}.p4{bottom:70px;right:35px}.stats{border-top:1px solid #e3e8f0;border-bottom:1px solid #e3e8f0}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr)}.stat-grid div{padding:24px;border-right:1px solid #e3e8f0}.stat-grid b,.stat-grid span{display:block}.stat-grid b{font-size:28px}.stat-grid span{font-size:12px;color:#65758b}.section{padding:86px 0}.head{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:end;margin-bottom:36px}.head h2,.platform-section h2,.impact h2,.contact h2{font-size:42px;letter-spacing:-1.5px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cards article{border:1px solid #e1e7f0;border-radius:20px;padding:24px}.cards article.featured{background:#f7f5ff;border-color:#b9b1ff}.cards article.platform-card{background:#f3fffc}.cards em{font-style:normal;font-size:10px;font-weight:900;color:#5b4ee8;background:#f0efff;padding:7px 10px;border-radius:99px}.cards h3{font-size:20px}.cards p{min-height:82px}.cards strong,.cards a{display:block;margin-top:14px}.cards a{color:#5b4ee8;font-size:12px;font-weight:900}.alt{background:#f6f8ff}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.platform-section small{display:block;margin-top:10px;color:#718096}.dash{display:grid;grid-template-columns:130px 1fr;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 25px 60px #32326d22}.dash-top{display:none}.dash aside{background:#172043;color:#fff;padding:25px;display:flex;flex-direction:column;gap:14px;font-weight:900}.dash aside span{font-size:11px;font-weight:400}.dash main{padding:28px}.progress{background:#f2f3ff;padding:18px;border-radius:14px;margin:20px 0}.progress b{font-size:30px;color:#5b4ee8}.progress i{display:block;height:7px;width:72%;background:linear-gradient(90deg,#5b4ee8,#2bb89f);border-radius:99px}.module{border:1px solid #e1e7f0;border-radius:10px;padding:10px;margin-top:8px}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.steps>div{border:1px solid #e1e7f0;border-radius:18px;padding:20px}.steps b{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#5b4ee8;color:#fff}.impact{background:linear-gradient(135deg,#181c43,#23285d);color:white}.impact h2{color:#fff}.light{color:#8de7d7}.impact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}.impact-grid div{padding:18px;border:1px solid #ffffff22;border-radius:14px;background:#ffffff0d}.impact-grid b,.impact-grid span{display:block}.impact-grid b{font-size:28px;color:#8de7d7}.white-card{background:white;color:#17243a;padding:30px;border-radius:22px}.partner{display:grid;grid-template-columns:1fr 1fr;gap:12px}.partner div{border:1px solid #e1e7f0;border-radius:16px;padding:20px}.partner b{display:block;margin-top:8px}.contact{background:#f7f9fc}.contact form{background:white;padding:28px;border-radius:22px;box-shadow:0 20px 55px #29315b18}.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact label{display:grid;gap:7px;margin-bottom:14px;font-size:13px;font-weight:800}.contact input,.contact select,.contact textarea{width:100%;padding:13px;border:1px solid #cfd9e7;border-radius:12px;font:inherit}.check{grid-template-columns:auto 1fr!important;font-weight:400!important}.check input{width:auto}.check a{color:#5b4ee8;text-decoration:underline}.hp{position:absolute!important;left:-9999px!important}.footer-grid{display:grid;grid-template-columns:1.1fr .6fr .6fr 1.7fr;gap:30px;padding:36px 0}.footer-grid img{width:350px}.footer-grid a,.footer-grid p{display:block;font-size:11px;color:#68788f;margin:5px 0}.funding img{width:100%;max-width:440px;background:transparent}.legal{border-top:1px solid #e1e7f0;padding:14px 0;display:flex;justify-content:space-between;font-size:10px;color:#8b96a6}.legal div{display:flex;gap:16px}.legal button{border:0;background:none;color:#8b96a6;padding:0}.cookie{position:fixed;left:20px;right:20px;bottom:20px;background:white;border:1px solid #e1e7f0;border-radius:18px;box-shadow:0 20px 60px #0002;padding:18px 22px;display:flex;justify-content:space-between;align-items:center}.cookie[hidden]{display:none}.cookie>div{display:flex;gap:8px}
@media(max-width:1000px){.main-nav,.nav-wrap>.btn-dark{display:none}.menu-btn{display:block;margin-left:auto}.main-nav.open{display:flex;position:absolute;top:80px;left:20px;right:20px;flex-direction:column;background:white;padding:20px;border-radius:16px;box-shadow:0 20px 50px #0002}.hero-grid,.split,.head{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.funding{grid-column:1/-1}}
@media(max-width:640px){.container{width:min(100% - 28px,1180px)}.brand img{width:220px}.hero-grid{padding:50px 0;min-height:auto}.hero h1{font-size:44px}.visual{height:390px}.cards,.steps,.stat-grid,.impact-grid,.partner{grid-template-columns:1fr}.row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.legal{flex-direction:column;gap:10px}.legal div{flex-wrap:wrap}.cookie{flex-direction:column;align-items:flex-start;gap:12px}}
/* ==========================================
EDUSOLIDAR - DIGITAL LEARNING HERO
========================================== */
.hero-visual{
min-height:500px;
display:flex;
align-items:center;
justify-content:center;
}
/* CONTAINER */
.digital-learning-scene{
position:relative;
width:100%;
height:500px;
overflow:hidden;
border-radius:36px;
background:
radial-gradient(
circle at 48% 48%,
rgba(80,73,220,.18),
transparent 24%
),
radial-gradient(
circle at 88% 72%,
rgba(27,193,181,.15),
transparent 30%
),
linear-gradient(
135deg,
#10142c 0%,
#171c45 45%,
#123b5d 100%
);
box-shadow:
0 35px 85px rgba(17,25,62,.30),
inset 0 0 0 1px rgba(255,255,255,.06);
}
/* GRID DIGITAL */
.tech-grid{
position:absolute;
inset:0;
background-image:
linear-gradient(
rgba(255,255,255,.035) 1px,
transparent 1px
),
linear-gradient(
90deg,
rgba(255,255,255,.035) 1px,
transparent 1px
);
background-size:34px 34px;
opacity:.65;
}
/* GLOW */
.ambient-glow{
position:absolute;
border-radius:50%;
filter:blur(55px);
}
.glow-violet{
width:260px;
height:260px;
background:
rgba(92,72,232,.35);
left:50%;
top:48%;
transform:
translate(-50%,-50%);
animation:
glowBreath 5s ease-in-out infinite;
}
.glow-cyan{
width:230px;
height:230px;
background:
rgba(39,190,180,.25);
right:-60px;
bottom:-45px;
animation:
glowBreath 6s ease-in-out infinite reverse;
}
/* CERCURI */
.tech-ring{
position:absolute;
left:50%;
top:50%;
transform:
translate(-50%,-50%);
border-radius:50%;
}
.ring-1{
width:220px;
height:220px;
border:
1px solid rgba(103,91,242,.45);
box-shadow:
0 0 35px rgba(91,78,232,.08);
animation:
rotateTech 16s linear infinite;
}
.ring-2{
width:310px;
height:310px;
border:
1px dashed rgba(97,211,198,.20);
animation:
rotateTechReverse 24s linear infinite;
}
.ring-3{
width:405px;
height:405px;
border:
1px solid rgba(255,255,255,.07);
animation:
rotateTech 35s linear infinite;
}
/* CENTRU */
.learning-core{
position:absolute;
left:50%;
top:50%;
transform:
translate(-50%,-50%);
width:178px;
height:178px;
border-radius:50%;
z-index:10;
background:
linear-gradient(
135deg,
#6b5cf0,
#278bd7,
#2ab79e
);
padding:2px;
box-shadow:
0 0 30px rgba(97,83,236,.45),
0 0 75px rgba(39,184,166,.18);
animation:
coreHover 5s ease-in-out infinite;
}
.learning-core::before{
content:"";
position:absolute;
inset:-9px;
border-radius:50%;
border:
1px solid rgba(111,227,210,.30);
animation:
corePulse 2.8s ease-out infinite;
}
.core-content{
width:100%;
height:100%;
border-radius:50%;
background:
radial-gradient(
circle at 50% 25%,
#222a63,
#101630 68%
);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
color:#fff;
}
.core-small{
font-size:9px;
letter-spacing:2px;
color:#74e4d2;
font-weight:800;
}
.core-content strong{
font-size:23px;
line-height:1.05;
margin:7px 0 12px;
letter-spacing:.5px;
}
.core-status{
display:flex;
align-items:center;
gap:6px;
font-size:7px;
letter-spacing:1.2px;
color:rgba(255,255,255,.65);
}
.core-status i{
width:5px;
height:5px;
border-radius:50%;
background:#72e2d0;
box-shadow:
0 0 8px #72e2d0;
animation:
statusPulse 1.5s infinite;
}
/* NODURI */
.digital-node{
position:absolute;
z-index:15;
display:flex;
align-items:center;
gap:12px;
min-width:190px;
padding:12px 14px;
border-radius:14px;
background:
rgba(15,22,50,.72);
border:
1px solid rgba(255,255,255,.12);
backdrop-filter:
blur(12px);
box-shadow:
0 14px 30px rgba(0,0,0,.20);
color:#fff;
animation:
nodeFloat 5s ease-in-out infinite;
}
.digital-node::after{
content:"";
position:absolute;
inset:0;
border-radius:14px;
pointer-events:none;
background:
linear-gradient(
120deg,
rgba(255,255,255,.08),
transparent 40%
);
}
.node-number{
display:grid;
place-items:center;
flex:none;
width:35px;
height:35px;
border-radius:10px;
background:
linear-gradient(
135deg,
rgba(91,78,232,.95),
rgba(31,144,211,.95)
);
font-size:9px;
font-weight:900;
}
.digital-node strong{
display:block;
font-size:13px;
line-height:1.2;
}
.digital-node small{
display:block;
margin-top:3px;
font-size:9px;
color:
rgba(255,255,255,.52);
}
/* POZIȚII */
.node-digital{
left:35px;
top:55px;
}
.node-business{
right:35px;
top:80px;
animation-delay:.7s;
}
.node-training{
left:40px;
bottom:62px;
animation-delay:1.4s;
}
.node-mentor{
right:35px;
bottom:48px;
animation-delay:2s;
}
/* LINII DE CONEXIUNE */
.signal{
position:absolute;
height:1px;
transform-origin:left center;
background:
linear-gradient(
90deg,
rgba(110,221,207,0),
rgba(110,221,207,.65),
rgba(110,221,207,0)
);
z-index:3;
opacity:.55;
animation:
signalFlow 3s ease-in-out infinite;
}
.s1{
width:175px;
left:27%;
top:30%;
transform:rotate(28deg);
}
.s2{
width:170px;
right:25%;
top:32%;
transform:rotate(-27deg);
}
.s3{
width:180px;
left:27%;
bottom:29%;
transform:rotate(-27deg);
}
.s4{
width:170px;
right:25%;
bottom:29%;
transform:rotate(28deg);
}
/* PARTICULE */
.spark{
position:absolute;
width:5px;
height:5px;
border-radius:50%;
background:#76e7d4;
box-shadow:
0 0 10px #76e7d4;
animation:
sparkFloat 6s ease-in-out infinite;
}
.sp1{
left:18%;
top:38%;
}
.sp2{
right:17%;
top:42%;
animation-delay:1s;
}
.sp3{
left:31%;
bottom:20%;
animation-delay:2s;
}
.sp4{
right:31%;
bottom:17%;
animation-delay:3s;
}
.sp5{
right:12%;
top:20%;
animation-delay:1.7s;
}
/* ANIMATII */
@keyframes nodeFloat{
0%,
100%{
transform:
translateY(0);
}
50%{
transform:
translateY(-8px);
}
}
@keyframes coreHover{
0%,
100%{
transform:
translate(-50%,-50%)
translateY(0);
}
50%{
transform:
translate(-50%,-50%)
translateY(-7px);
}
}
@keyframes corePulse{
0%{
transform:
scale(.9);
opacity:.8;
}
100%{
transform:
scale(1.25);
opacity:0;
}
}
@keyframes rotateTech{
from{
transform:
translate(-50%,-50%)
rotate(0deg);
}
to{
transform:
translate(-50%,-50%)
rotate(360deg);
}
}
@keyframes rotateTechReverse{
from{
transform:
translate(-50%,-50%)
rotate(360deg);
}
to{
transform:
translate(-50%,-50%)
rotate(0deg);
}
}
@keyframes glowBreath{
0%,
100%{
opacity:.55;
transform:scale(1);
}
50%{
opacity:1;
transform:scale(1.13);
}
}
@keyframes statusPulse{
0%,
100%{
opacity:.35;
}
50%{
opacity:1;
}
}
@keyframes signalFlow{
0%,
100%{
opacity:.18;
}
50%{
opacity:.65;
}
}
@keyframes sparkFloat{
0%,
100%{
transform:
translateY(0)
scale(.8);
opacity:.45;
}
50%{
transform:
translateY(-25px)
scale(1.3);
opacity:1;
}
}
/* MOBIL */
@media(max-width:640px){
.digital-learning-scene{
height:430px;
}
.learning-core{
width:135px;
height:135px;
}
.core-content strong{
font-size:18px;
}
.digital-node{
min-width:145px;
max-width:160px;
padding:9px 10px;
}
.digital-node strong{
font-size:10px;
}
.digital-node small{
font-size:7px;
}
.node-number{
width:27px;
height:27px;
}
.node-digital{
left:10px;
top:25px;
}
.node-business{
right:10px;
top:58px;
}
.node-training{
left:10px;
bottom:52px;
}
.node-mentor{
right:10px;
bottom:20px;
}
.ring-1{
width:160px;
height:160px;
}
.ring-2{
width:225px;
height:225px;
}
.ring-3{
width:300px;
height:300px;
}
}