/* ============================================================
   BUSYBEAVER — HOMEPAGE V4
   Black/Gold premium, warm cream, Montserrat impact
   ============================================================ */

/* ── S1: HERO ── */
.hero { background: var(--gradient-hero-bg); }
.hero__text { max-width: 540px; }
.hero__eyebrow { margin-bottom: 18px; }
.hero__title {
    font-family: var(--font-heading);
    font-size: 46px;
    font-weight: var(--fw-black);
    line-height: 1.02;
    letter-spacing: -0.04em;
    margin-bottom: 20px;
    max-width: 540px;
    color: var(--color-black);
    text-transform: uppercase;
}
/* Gold accent on key word */
.hero__title span {
    background: var(--gradient-gold-text);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.hero__subtitle {
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--color-muted);
    line-height: 1.7;
    max-width: 460px;
    margin-bottom: 32px;
    font-weight: 500;
}
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; }

.hero__visual { position: relative; }
.hero__screenshot {
    transform: perspective(1200px) rotateY(-2deg);
    transition: transform var(--transition-entrance);
}

.hero__visual.is-loaded .hero__screenshot {
    animation: hero-slide-up 600ms cubic-bezier(0.16,1,0.3,1) 200ms both;
}
.hero__visual.is-loaded .screenshot-badge {
    animation: hero-badge-in 400ms cubic-bezier(0.16,1,0.3,1) 800ms both;
}

@keyframes hero-slide-up {
    from { opacity: 0; transform: perspective(1200px) rotateY(-2deg) translateY(24px); }
    to   { opacity: 1; transform: perspective(1200px) rotateY(-2deg) translateY(0); }
}
@keyframes hero-badge-in {
    from { opacity: 0; transform: scale(0.85); }
    to   { opacity: 1; transform: scale(1); }
}

@media (max-width: 1199px) {
    .hero__screenshot { transform: none; max-width: 500px; margin: 0 auto; }
    .hero__text { text-align: center; max-width: 100%; margin: 0 auto; }
    .hero__title { max-width: 100%; font-size: 34px; }
    .hero__subtitle { max-width: 100%; margin-left: auto; margin-right: auto; }
    .hero__ctas { justify-content: center; }
}
@media (max-width: 767px) {
    .hero__screenshot { max-width: 100%; }
    .hero__title { font-size: 28px; }
    .hero__ctas { flex-direction: column; }
}

/* ── S2: TRUST BAR ── */
.trust-bar {
    border-top: 1px solid var(--color-border-light);
    border-bottom: 1px solid var(--color-border-light);
    background: var(--color-background-cream);
}
.trust-bar__grid { display: grid; grid-template-columns: repeat(4, 1fr); max-width: var(--container-narrow); margin: 0 auto; }
.trust-bar__item { text-align: center; padding: 8px 12px; position: relative; }
.trust-bar__item + .trust-bar__item::before {
    content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 1px; height: 36px; background: var(--color-border-light);
}

@media (max-width: 767px) {
    .trust-bar__grid { grid-template-columns: repeat(2, 1fr); gap: 4px; }
    .trust-bar__item + .trust-bar__item::before { display: none; }
    .trust-bar__item { border-bottom: 1px solid var(--color-border-light); padding: 14px 8px; }
    .trust-bar__item:nth-last-child(-n+2) { border-bottom: none; }
}

/* ── S7: FINANCIAL ── */
.financial__guarantees { padding-right: 28px; }
@media (max-width: 1199px) {
    .financial__guarantees { padding-right: 0; order: 2; }
    .financial__visual { order: 1; max-width: 500px; margin: 0 auto 24px; }
}

/* ── S6: PORTFOLIO ── */
.portfolio-cta { text-align: center; margin-top: 32px; }
.portfolio-empty { text-align: center; padding: 36px 0; color: var(--color-muted); font-size: 15px; font-weight: 500; }

/* ── COUNT-UP ── */
.count-up { display: inline-block; }