.hero {
    position: relative;
    min-height: 620px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: var(--dark);
}
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(15,25,35,0.95), rgba(15,25,35,0.7) 60%, rgba(15,25,35,0.4));
}
.hero__grid-pattern {
    position: absolute;
    top: 0; left: 0;
    width: 60px; height: 60px;
    opacity: 0.2;
    z-index: 1;
}
.hero__content {
    position: relative;
    z-index: 2;
    padding-top: 100px;
    padding-bottom: 80px;
	width: 100%;
}

.hero__badge {
    display: inline-block;
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--blue);
    margin-bottom: 20px;
}
.hero__title {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 60px;
    line-height: 1.25;
    color: #fff;
    margin-bottom: 24px;
	max-width: 800px;
}
.hero__title--accent { color: var(--blue); }
.hero__desc {
    font-size: 18px;
    line-height: 1.625;
    color: var(--text-light);
    margin-bottom: 32px;
	max-width: 800px;
}
.hero__actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
@media (max-width: 1200px) { .hero__title { font-size: 48px; } }
@media (max-width: 768px) {
    .hero__title { font-size: 40px; }
    .hero__desc { font-size: 16px; }
}
@media (max-width: 460px) {
    .hero { min-height: 520px; }
    .hero__title { font-size: 32px; }
    .hero__actions { flex-direction: column; }
    .hero__actions .btn { width: 100%; justify-content: center; }
}