.rph-hero {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 300px;
    margin: 0 0 32px;
    overflow: hidden;
    border-radius: 12px;
    background: #24313b;
    color: #fff;
}
.rph-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: var(--rph-bg-image);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.rph-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(8, 16, 22, .88) 0%, rgba(8, 16, 22, .70) 54%, rgba(8, 16, 22, .48) 100%);
}
.rph-hero-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    max-width: 1220px;
    min-height: 300px;
    margin: 0 auto;
    padding: 42px 60px;
    box-sizing: border-box;
}
.rph-hero-content { min-width: 0; }
.rph-hero-title {
    margin: 0 0 22px;
    color: #fff;
    font-size: clamp(28px, 3.1vw, 46px);
    line-height: 1.14;
    font-weight: 700;
    letter-spacing: -.6px;
}
.rph-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 25px;
    color: #fff;
    font-size: 18px;
    line-height: 1.5;
}
.rph-breadcrumbs a { color: #1688ff; text-decoration: underline; text-underline-offset: 2px; }
.rph-breadcrumbs a:hover { color: #75baff; }
.rph-breadcrumbs .rph-current { color: #fff; text-decoration: none; }
.rph-separator { color: rgba(255,255,255,.85); font-weight: 600; }
.rph-hero-button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 14px;
    border-radius: 22px;
    background: #087bea;
    color: #fff !important;
    font-size: 18px;
    line-height: 1.35;
    text-decoration: none !important;
    transition: background .2s ease, transform .2s ease;
}
.rph-hero-button:hover { background: #0564c2; color: #fff !important; transform: translateY(-1px); }
.rph-hero-button span { font-size: 21px; line-height: 1; }
.rph-hero-logo-wrap {
    flex: 0 0 172px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 172px;
    min-height: 172px;
    padding: 14px;
    box-sizing: border-box;
    background: #fff;
}
.rph-hero-logo { display: block; width: 100%; height: auto; max-height: 172px; object-fit: contain; }
@media (max-width: 800px) {
    .rph-hero-inner { padding: 34px 28px; gap: 22px; }
    .rph-hero-logo-wrap { flex-basis: 128px; width: 128px; min-height: 128px; }
    .rph-breadcrumbs { font-size: 16px; }
    .rph-hero-button { font-size: 16px; }
}
@media (max-width: 560px) {
    .rph-hero { border-radius: 8px; }
    .rph-hero-inner { display: block; padding: 30px 22px; }
    .rph-hero-title { font-size: 30px; margin-bottom: 18px; }
    .rph-breadcrumbs { font-size: 15px; gap: 6px; margin-bottom: 20px; }
    .rph-hero-logo-wrap { margin: 28px 0 0; width: 116px; min-height: 116px; }
}