.cf-hero {
    width: min(var(--cf-container), calc(100% - 40px));
    margin: 18px auto 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 34px;
    align-items: center;
    padding: 42px 46px;
    border: 1px solid var(--cf-border);
    border-radius: var(--cf-radius-lg);
    background: #fff;
    box-shadow: var(--cf-shadow-sm);
}
.cf-hero h1 { margin-bottom: 14px; font-size: clamp(2.2rem, 4.4vw, 3.7rem); }
.cf-hero h1 span { color: var(--cf-primary); }
.cf-hero-text { max-width: 690px; margin-bottom: 0; color: var(--cf-muted); font-size: .98rem; }
.cf-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 22px; }
.cf-button { min-height: 42px; padding: 0 17px; gap: 9px; font-size: .86rem; }
.cf-hero-card { display: grid; place-items: center; }
.cf-hero-card img {
    display: block;
    width: 180px;
    height: 180px;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 10px 25px rgba(20,35,50,.12);
}