*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{background:#F0F5FA;font-family:'Work Sans',sans-serif;font-weight:400;font-size:17px;line-height:1.8;color:#3A5A7C;overflow-x:hidden}
.hero-split{min-height:100vh;display:flex;align-items:center;padding:60px 40px}
.hero-left{flex:0.6;opacity:0;transform:translateY(20px);transition:all 0.5s ease}
.hero-left.visible{opacity:1;transform:translateY(0)}
.hero-right{flex:0.4;display:flex;align-items:center;justify-content:center}
.floating-node{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#4ECDC4,#6B8DB2);box-shadow:0 12px 40px rgba(78,205,196,0.2);animation:float-drift 6s ease-in-out infinite}
@keyframes float-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
h1{font-family:'Abril Fatface',cursive;font-weight:400;font-size:clamp(40px,6vw,80px);color:#0D1B2A;letter-spacing:-0.01em;margin-bottom:12px}
.hero-desc{max-width:400px;color:#3A5A7C;margin-bottom:16px}
.code-label{font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:14px;color:#6B8DB2;letter-spacing:0.04em;display:block;margin-bottom:8px}
.content-block{min-height:60vh;display:flex;align-items:center;padding:60px 40px}
.block-right{justify-content:flex-end}
.block-left{justify-content:flex-start}
.block-inner{max-width:520px;background:#E3ECF5;border-radius:12px;padding:40px;opacity:0;transform:translateY(20px);transition:all 0.4s ease;box-shadow:0 8px 30px rgba(26,75,140,0.06)}
.block-inner.visible{opacity:1;transform:translateY(0)}
.block-inner:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(26,75,140,0.12)}
h2{font-family:'Abril Fatface',cursive;font-weight:400;font-size:28px;color:#0D1B2A;margin-bottom:12px}
@media(max-width:768px){.hero-split{flex-direction:column;padding:60px 20px}.hero-right{display:none}.content-block{padding:40px 20px}.block-inner{padding:28px}h1{font-size:36px}}