/* ==========================================================================
   Inner pages — shared page hero and utilities
   ========================================================================== */
[hidden] { display: none !important; }

.jv-page-hero {
    position: relative;
    overflow: hidden;
    margin-top: calc(var(--jv-header-h) * -1);
    padding: calc(var(--jv-header-h) + 56px) 0 72px;
    background:
        radial-gradient(900px 520px at 85% 10%, rgba(144, 208, 186, 0.30), transparent 70%),
        radial-gradient(760px 480px at 4% 0%, rgba(38, 55, 115, 0.10), transparent 70%),
        linear-gradient(180deg, #f3f7fb 0%, var(--jv-canvas) 100%);
}
html.dark .jv-page-hero {
    background:
        radial-gradient(900px 520px at 85% 10%, rgba(144, 208, 186, 0.16), transparent 70%),
        radial-gradient(760px 480px at 4% 0%, rgba(99, 120, 220, 0.16), transparent 70%),
        linear-gradient(180deg, #0d1628 0%, var(--jv-canvas) 100%);
}
.jv-page-hero__mesh {
    position: absolute; inset: 0; pointer-events: none; opacity: 0.35;
    background-image:
        linear-gradient(to right, var(--jv-line) 1px, transparent 1px),
        linear-gradient(to bottom, var(--jv-line) 1px, transparent 1px);
    background-size: 64px 64px;
    -webkit-mask-image: radial-gradient(ellipse 90% 75% at 62% 20%, #000 8%, transparent 72%);
    mask-image: radial-gradient(ellipse 90% 75% at 62% 20%, #000 8%, transparent 72%);
}
.jv-page-hero > .jv-wrap { position: relative; z-index: 2; }
.jv-page-hero h1 { margin-top: 18px; font-size: clamp(2.4rem, 4.6vw, 4rem); line-height: 1.06; letter-spacing: -0.025em; }

@media (max-width: 720px) {
    .jv-page-hero { padding: calc(var(--jv-header-h) + 32px) 0 48px; }
}