.detail-page-hero,
.profile-detail-hero {
    --profile-detail-accent: var(--palette-dc0000);
    --profile-detail-accent-dark: var(--palette-b80000);
    --profile-detail-surface: var(--bg-color2, var(--palette-ffffff));
    --profile-detail-muted: var(--text2-color, var(--palette-717171));
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 250px;
    padding: 20px 16px 0;
    margin-bottom: 20px;
    border-radius: 16px 16px 0 0;
    direction: rtl;
}

.profile-detail-hero::before {
    position: absolute;
    z-index: -2;
    inset: 0;
    content: "";
    background: linear-gradient(115deg, var(--palette-rgba-87-31-35-55), var(--palette-rgba-255-255-255-12)), var(--profile-detail-cover, linear-gradient(135deg, var(--palette-79575a), var(--palette-d7aaa5)));
    background-position: center;
    background-size: cover;
    transform: scale(1.05);
    filter: blur(2px);
}

.profile-detail-hero::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background: var(--palette-rgba-255-255-255-18);
    backdrop-filter: blur(2px);
}

.profile-detail-hero__grid {
    display: grid;
    grid-template-columns: minmax(220px, .82fr) minmax(440px, 1.75fr) minmax(220px, .82fr);
    gap: 18px;
    height: 340px;
    min-height: 340px;
}

.profile-detail-hero--center-only .profile-detail-hero__grid {
    grid-template-columns: minmax(0, 1fr);
}

.profile-detail-hero__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    overflow: hidden;
    padding: 20px;
    border: 8px solid color-mix(in srgb, var(--profile-detail-surface) 36%, transparent);
    border-radius: 13px;
    background: color-mix(in srgb, var(--profile-detail-surface) 96%, transparent);
    box-shadow: 0 8px 28px var(--palette-rgba-35-20-20-12);
    text-align: center;
}

.profile-detail-hero__logo {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    min-height: 0;
    object-fit: contain;
}

.profile-detail-hero__logo-placeholder,
.profile-detail-hero__meta-icon {
    color: var(--profile-detail-accent);
    font-size: 44px;
}

.profile-detail-hero__meta-icon { margin-bottom: 12px; }
.profile-detail-hero__meta-title { margin: 0 0 8px; color: var(--text-color, var(--palette-343434)); font-size: 15px; font-weight: 700; }
.profile-detail-hero__website { margin-bottom: 8px; color: var(--text-color, var(--palette-343434)); font-size: 13px; word-break: break-all; }
.profile-detail-hero__website:hover { color: var(--profile-detail-accent); }
.profile-detail-hero__unavailable { color: var(--profile-detail-muted); font-size: 12px; }
.profile-detail-hero__meta-caption { color: var(--profile-detail-accent); font-size: 12px; }
.profile-detail-hero__title { margin: 0 0 8px; color: var(--profile-detail-accent); font-family: 'Vazirmatn', sans-serif; font-size: clamp(22px, 2.4vw, 34px); font-weight: 900; }
.profile-detail-hero__description { max-width: 620px; margin: 0 0 6px; color: var(--text2-color, var(--palette-444444)); font-size: 13px; line-height: 2; }
.profile-detail-hero__subtitle { margin-bottom: 12px; color: var(--profile-detail-accent); font-size: 13px; font-weight: 700; }

.profile-detail-hero__action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 9px 20px;
    border: 0;
    border-radius: 6px;
    background: var(--profile-detail-accent);
    color: var(--palette-ffffff);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: .2s ease;
}

.profile-detail-hero__action:hover {
    background: var(--profile-detail-accent-dark);
    color: var(--palette-ffffff);
    transform: translateY(-1px);
}

.profile-detail-hero__badges { display: grid; gap: 5px; margin-top: 2px; }
.profile-detail-hero__badge { font-size: 11px; }
.profile-detail-hero__badge--success { color: var(--palette-159247); }
.profile-detail-hero__badge--featured { padding: 3px 10px; border-radius: 999px; background: var(--palette-fff1d7); color: var(--palette-a86100); }

.profile-detail-hero__stats {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(var(--profile-detail-stat-count, 4), minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
    color: var(--palette-ffffff);
}

.profile-detail-hero__stat {
    display: flex;
    min-width: 0;
    min-height: 62px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 10px 16px;
    border-radius: 10px 10px 0 0;
    background: var(--profile-detail-accent);
    font-size: 13px;
    font-weight: 600;
    text-align: center;
}

.profile-detail-hero__stat strong { font-weight: 700; }

[data-theme="dark"] .detail-page-hero__card,
.dark .detail-page-hero__card,
[data-theme="dark"] .profile-detail-hero__card,
.dark .profile-detail-hero__card {
    border-color: var(--palette-rgba-255-255-255-12);
    background: color-mix(in srgb, var(--profile-detail-surface) 93%, transparent);
}

[data-theme="dark"] .profile-detail-hero__badge--featured,
.dark .profile-detail-hero__badge--featured { background: var(--palette-493b20); color: var(--palette-f0bd62); }

@media (max-width: 991.98px) {
    .profile-detail-hero__grid { grid-template-columns: 150px 1fr; }
    .profile-detail-hero__main { grid-column: 2; grid-row: 1 / span 2; }
    .profile-detail-hero__logo-card { display: none; }
}

@media (max-width: 767.98px) {
    .profile-detail-hero { min-height: 0; padding: 12px 12px 0; border-radius: 13px 13px 0 0; }
    .profile-detail-hero__grid { display: block; height: auto; min-height: 0; }
    .profile-detail-hero__meta { display: none; }
    .profile-detail-hero__card { padding: 22px 15px; border-width: 5px; }
    .profile-detail-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
    .profile-detail-hero__stat { min-height: 46px; border-radius: 8px 8px 0 0; font-size: 11px; }
}

@media (max-width: 479.98px) {
    .profile-detail-hero__stats { grid-template-columns: 1fr; }
}

/* Backward-compatible aliases for pages still rendering the original component class names. */
.detail-page-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 250px; padding: 20px 16px 0; margin-bottom: 20px; border-radius: 16px 16px 0 0; direction: rtl; }
.detail-page-hero::before, .detail-page-hero::after { position: absolute; z-index: -1; inset: 0; content: ""; }
.detail-page-hero::before { z-index: -2; background: linear-gradient(115deg, var(--palette-rgba-87-31-35-55), var(--palette-rgba-255-255-255-12)), var(--profile-detail-cover, linear-gradient(135deg,var(--palette-79575a),var(--palette-d7aaa5))); background-position: center; background-size: cover; transform: scale(1.05); filter: blur(2px); }
.detail-page-hero::after { background: var(--palette-rgba-255-255-255-18); backdrop-filter: blur(2px); }
.detail-page-hero__grid { display: grid; grid-template-columns: minmax(220px,.82fr) minmax(440px,1.75fr) minmax(220px,.82fr); gap: 18px; height: 340px; min-height: 340px; }
.detail-page-hero__card { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; min-height:0; box-sizing:border-box; overflow:hidden; padding:20px; border:8px solid color-mix(in srgb, var(--profile-detail-surface) 36%, transparent); border-radius:13px; background:color-mix(in srgb, var(--profile-detail-surface) 96%, transparent); box-shadow:0 8px 28px var(--palette-rgba-35-20-20-12); text-align:center; }
.detail-page-hero__logo { width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; }
.detail-page-hero__main { grid-column:2; }
.detail-page-hero__title { margin:0 0 8px; color:var(--palette-dc0000); font-size:clamp(22px,2.4vw,34px); font-weight:900; }
.detail-page-hero__description { max-width:620px; margin:0 0 6px; color:var(--text2-color, var(--palette-444444)); font-size:13px; line-height:2; }
.detail-page-hero__subtitle { margin-bottom:12px; color:var(--palette-dc0000); font-size:13px; font-weight:700; }
.detail-page-hero__meta-title { margin:0 0 8px; color:var(--text-color, var(--palette-343434)); font-size:15px; font-weight:700; }
.detail-page-hero__website { margin-bottom:8px; color:var(--text-color, var(--palette-343434)); font-size:13px; word-break:break-all; }
.detail-page-hero__action { display:inline-flex; align-items:center; gap:8px; margin-top:4px; padding:9px 20px; border:0; border-radius:6px; background:var(--palette-dc0000); color:var(--palette-ffffff); font-size:13px; font-weight:700; text-decoration:none; }
.detail-page-hero__stats { position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-top:18px; color:var(--palette-ffffff); }
.detail-page-hero__stat { display:flex; min-width:0; min-height:62px; align-items:center; justify-content:center; gap:9px; padding:10px 16px; border-radius:10px 10px 0 0; background:var(--palette-dc0000); font-size:13px; font-weight:600; text-align:center; }
@media (max-width:991.98px) { .detail-page-hero__grid{grid-template-columns:150px 1fr}.detail-page-hero__main{grid-column:2;grid-row:1/span 2}.detail-page-hero__logo-card{display:none} }
@media (max-width:767.98px) { .detail-page-hero{min-height:0;padding:12px 12px 0}.detail-page-hero__grid{display:block;height:auto;min-height:0}.detail-page-hero__meta{display:none}.detail-page-hero__card{padding:22px 15px;border-width:5px}.detail-page-hero__stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.detail-page-hero__stat{min-height:46px;border-radius:8px 8px 0 0;font-size:11px} }
@media (max-width:479.98px) { .detail-page-hero__stats{grid-template-columns:1fr} }