/*
 * Warm Gravity Stars — homepage hero only.
 * Relative gutters & clamp sizing preserve the original typography, CTAs,
 * navbar/mega menus and dashboard at laptop, desktop, tablet & phone widths.
 */
.hero[data-gravity-stars] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 100svh;
    padding-block: clamp(116px, 12vh, 154px) clamp(64px, 8vh, 108px);
    background:
        radial-gradient(ellipse at 82% 38%, rgba(31, 48, 71, 0.44), transparent 55%),
        radial-gradient(ellipse at 12% 82%, rgba(94, 55, 39, 0.22), transparent 57%),
        linear-gradient(115deg, #0c1015 0%, #10131b 56%, #10151e 100%);
}

.hero__stars {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 1;
}

/* Warm amber/ivory ambience; keep the text and buttons readable. */
.hero[data-gravity-stars]::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse at 74% 62%, rgba(167, 106, 75, 0.08), transparent 46%),
        linear-gradient(90deg, rgba(9, 13, 16, 0.23), transparent 42%, rgba(9, 13, 16, 0.09));
}

.hero[data-gravity-stars] .hero__grid {
    position: relative;
    z-index: 1;
    width: min(90%, 1480px);
    grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
    gap: clamp(28px, 4.2vw, 72px);
    min-width: 0;
}

.hero[data-gravity-stars] .hero__content,
.hero[data-gravity-stars] .hero__visual {
    min-width: 0;
}

.hero[data-gravity-stars] .hero__title {
    max-width: 13.5ch;
    font-size: clamp(42px, 5.5vw, 83px);
    line-height: 0.99;
    overflow-wrap: normal;
}

.hero[data-gravity-stars] .hero__title span {
    color: #a1a7b1;
}

.hero[data-gravity-stars] .hero__accent {
    font-size: clamp(29px, 3.55vw, 53px);
    line-height: 1.08;
    margin-top: clamp(16px, 2vw, 24px);
}

.hero[data-gravity-stars] .hero__description {
    max-width: 58ch;
    margin-top: clamp(18px, 2.2vw, 29px);
    font-size: clamp(15px, 1.12vw, 18px);
    color: #b9b9bc;
}

.hero[data-gravity-stars] .hero__actions {
    flex-wrap: wrap;
    margin-top: clamp(22px, 2.5vw, 34px);
}

.hero[data-gravity-stars] .hero__philosophy {
    color: #afa7a2;
}

.hero[data-gravity-stars] .dashboard {
    border-color: rgba(195, 167, 150, 0.24);
    background: linear-gradient(150deg, rgba(20, 25, 33, 0.97), rgba(14, 18, 25, 0.98));
    box-shadow: 0 32px 90px rgba(0, 0, 0, 0.32), 0 0 65px rgba(188, 126, 84, 0.055);
}

.hero[data-gravity-stars] .dashboard__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hero[data-gravity-stars] .dashboard__stat {
    min-width: 0;
    padding: clamp(12px, 1.35vw, 24px);
}

.hero[data-gravity-stars] .dashboard__stat strong {
    font-size: clamp(19px, 1.65vw, 25px);
}

.hero[data-gravity-stars] .dashboard__content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hero[data-gravity-stars] .dashboard__panel {
    min-width: 0;
    min-height: clamp(205px, 17vw, 260px);
    padding: clamp(12px, 1.25vw, 20px);
}

.hero[data-gravity-stars] .ai-message,
.hero[data-gravity-stars] .ai-result {
    overflow-wrap: anywhere;
}

@media (max-width: 1050px) {
    .hero[data-gravity-stars] .hero__grid {
        grid-template-columns: minmax(0, 1fr);
        width: min(90%, 760px);
        gap: clamp(32px, 5vw, 60px);
    }

    .hero[data-gravity-stars] .hero__title {
        max-width: 15ch;
        font-size: clamp(42px, 7.1vw, 74px);
    }

    .hero[data-gravity-stars] .hero__visual {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .hero[data-gravity-stars] {
        padding-block: 116px 64px;
    }

    .hero[data-gravity-stars] .hero__grid {
        width: 92%;
        gap: 35px;
    }

    .hero[data-gravity-stars] .hero__title {
        max-width: 100%;
        font-size: clamp(37px, 10.3vw, 54px);
        line-height: 1.01;
        overflow-wrap: break-word;
    }

    .hero[data-gravity-stars] .hero__accent {
        font-size: clamp(27px, 7.4vw, 38px);
    }

    .hero[data-gravity-stars] .hero__description {
        font-size: 16px;
    }

    .hero[data-gravity-stars] .dashboard__stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .hero[data-gravity-stars] .dashboard__stat {
        border-bottom: none;
        border-right: 1px solid var(--border);
        padding: 12px 8px;
    }

    .hero[data-gravity-stars] .dashboard__stat:last-child {
        border-right: none;
    }

    .hero[data-gravity-stars] .dashboard__stat strong {
        font-size: clamp(17px, 5vw, 22px);
    }

    .hero[data-gravity-stars] .dashboard__content {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero[data-gravity-stars] .dashboard__panel {
        min-height: auto;
        padding: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero[data-gravity-stars] .hero__stars {
        opacity: 0.76;
    }
}
