/* ── Hero Widget ────────────────────────────────────────────────────────────── */
.neweb-hero {
    position: relative;
    overflow: hidden;
    padding: 12rem 1.5rem 6rem;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.neweb-hero__gradient {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.neweb-hero__inner {
    position: relative;
    z-index: 2;
    max-width: 56rem;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.neweb-hero__content {
    max-width: 56rem;
    margin: 0 auto;
}

.neweb-hero__heading {
    font-size: clamp(3.25rem, 7vw, 5.5rem);
    line-height: 1.08;
    letter-spacing: -0.02em;
    color: #0f172a;
}

[data-theme="dark"] .neweb-hero__heading {
    color: #ffffff;
}

.neweb-hero__heading-italic {
    font-style: italic;
    color: var(--color-brand);
}

.neweb-hero__subtitle {
    margin-top: 2rem;
    max-width: 32rem;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.125rem;
    line-height: 1.625;
    color: #64748b;
}

[data-theme="dark"] .neweb-hero__subtitle {
    color: #94a3b8;
}

.neweb-hero__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 2.5rem;
    flex-wrap: wrap;
}

.neweb-hero__actions .btn-star {
    padding: 16px 36px;
    box-shadow: 0 0 32px rgba(36, 127, 195, 0.15);
}

.neweb-hero__actions .btn-star .btn-label {
    font-size: 15px;
}

.neweb-hero__actions .btn-ghost {
    padding: 16px 32px;
}

.neweb-hero__footer-text {
    margin-top: 1.5rem;
    font-size: 13px;
    letter-spacing: 0.1em;
    color: #94a3b8;
}

[data-theme="dark"] .neweb-hero__footer-text {
    color: #64748b;
}

/* Screenshot */
.neweb-hero__screenshot {
    margin-top: 4rem;
    perspective: 1200px;
}

.neweb-hero__screenshot-wrapper {
    transform: rotateX(6deg);
    transform-origin: center bottom;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    max-width: 64rem;
    margin: 0 auto;
    box-shadow: 0 50px 100px -20px rgba(0,0,0,0.1), 0 0 50px rgba(36,127,195,0.05), 0 30px 60px -30px rgba(0,0,0,0.15);
    border-radius: 12px;
}

.neweb-hero__screenshot-wrapper:hover {
    transform: rotateX(2deg);
}

/* Bottom fade gradient */
.neweb-hero__bottom-fade {
    pointer-events: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 16rem;
    background: linear-gradient(to top, #f8fafc, rgba(248, 250, 252, 0.8), transparent);
    z-index: 3;
}

[data-theme="dark"] .neweb-hero__bottom-fade {
    background: linear-gradient(to top, #0c1222, rgba(12, 18, 34, 0.8), transparent);
}

@media (min-width: 768px) {
    .neweb-hero {
        padding-top: 14rem;
    }
}

@media (min-width: 1024px) {
    .neweb-hero {
        padding-top: 15rem;
    }
}

@media (max-width: 640px) {
    .neweb-hero {
        padding: 8rem 1rem 4rem;
    }
    .neweb-hero__actions {
        flex-direction: column;
    }
}