.landing-anatomy{

padding:200px 8%;

background:#050C12;

}

.anatomy-container{

max-width:1100px;
margin:auto;

}
.anatomy-header{

max-width:640px;

margin-bottom:120px;

}

.anatomy-eyebrow{

font-size:.7rem;
letter-spacing:3px;

color:var(--accent);

display:block;

margin-bottom:16px;

}

.anatomy-title{

font-size:2.2rem;

margin-bottom:18px;

}

.anatomy-intro{

color:var(--text-soft);

}

.anatomy-system{

position:relative;

display:flex;
flex-direction:column;

align-items:center;

gap:50px;

}

.anatomy-line{

position:absolute;

left:50%;
top:0;
bottom:0;

width:2px;

background:linear-gradient(
to bottom,
transparent,
rgba(255,255,255,.08),
transparent
);

transform:translateX(-50%);

}

.anatomy-block{

width:420px;

background:rgba(255,255,255,.02);

border:1px solid var(--border-soft);

border-radius:14px;

padding:26px;

text-align:center;

position:relative;

transition:all .35s var(--transition);

}

.anatomy-block:hover{

transform:translateY(-6px) scale(1.02);

border-color:rgba(38,166,154,.35);

box-shadow:0 20px 50px rgba(0,0,0,.45);

}

.anatomy-block::after{

content:"";

position:absolute;

bottom:-26px;
left:50%;

width:2px;
height:26px;

background:rgba(255,255,255,.08);

transform:translateX(-50%);

}

.anatomy-block:last-child::after{

display:none;

}

.anatomy-block{

overflow:hidden;

}

.anatomy-block::before{

content:"";

position:absolute;

inset:0;

background: radial-gradient(
200px circle at var(--x,50%) var(--y,50%),
rgba(38,166,154,.12),
transparent 40%
);

opacity:0;

transition:opacity .25s ease;

pointer-events:none;

}

.anatomy-block:hover::before{

opacity:1;

}

.anatomy-block{

width:420px;

background:rgba(255,255,255,.02);

border:1px solid var(--border-soft);

border-radius:14px;

padding:26px;

text-align:center;

position:relative;

transition:all .5s var(--transition);

/* estado inicial */

opacity:.35;
transform:translateY(40px) scale(.96);

}

.anatomy-block.active{

opacity:1;

transform:translateY(0) scale(1);

border-color:rgba(38,166,154,.35);

box-shadow:
0 0 40px rgba(38,166,154,.08),
0 20px 50px rgba(0,0,0,.45);

}

.anatomy-line{

position:absolute;

left:50%;

top:0;

width:2px;
height:100%;

background:linear-gradient(
to bottom,
transparent,
rgba(38,166,154,.18),
rgba(38,166,154,.08),
transparent
);

transform:translateX(-50%) scaleY(0);

transform-origin:top;

transition:transform .2s linear;

}

.anatomy-block{
width:460px;
}

.anatomy-block h3{

font-size:1rem;

letter-spacing:.3px;

margin-bottom:6px;

}