.hero-card{
max-width:900px;
margin:80px auto;
padding:70px 60px;
text-align:center;

border-radius:20px;
background:white;
border:1px solid #e5e7eb;

box-shadow:0 25px 70px rgba(15,23,42,.08);
}

/* Títol principal */
.hero-title{
font-size:clamp(2.8rem,6vw,4rem);
font-family:'Inter', sans-serif;
font-weight:800;
line-height:1.05;
margin-bottom:20px;
letter-spacing:-0.03em;
}


/* Subtítol */
.hero-subtitle{
max-width:640px;
margin:auto;
margin-bottom:30px;

color:#6b7280;

font-size:1.1rem;
line-height:1.7;
}

/* Tags del sector */
.hero-tags{
margin-bottom:36px;
font-size:1rem;
color:var(--color-subtext);
}

.tag{
opacity:.45;
transition:all .35s ease;
}

.tag.active{
opacity:1;
color:var(--color-accent,#2563eb);
font-weight:600;
}

.dot{
opacity:.4;
margin:0 4px;
}

/* Botons */
.hero-actions{
display:flex;
justify-content:center;
gap:16px;
flex-wrap:wrap;
margin-top:10px;
}

.btn{
padding:14px 26px;
border-radius:10px;
font-weight:600;
font-size:1rem;
transition:all .2s ease;
text-decoration:none;
display:inline-block;
}

/* Botó principal */
.btn-primary{
background:#2563eb;
color:white;
box-shadow:0 10px 25px rgba(37,99,235,0.25);
}

.btn-primary:hover{
background:#1d4ed8;
transform:translateY(-2px);
}

/* Botó secundari */
.btn-secondary{
background:white;
border:1px solid #e5e7eb;
color:#111827;
}

.btn-secondary:hover{
background:#f9fafb;
}

/* Footer */
.hero-footer{
margin-top:32px;
font-size:.9rem;
color:#6b7280;
}