/* Shared hero system: keep every primary page visually aligned. */
.hero,
.inner-hero,
.case-detail-hero {
    background-position: center 56%;
    min-height: 100svh;
    padding: 5rem 2rem 9.5rem;
}

.hero-shade,
.inner-hero-shade,
.case-detail-shade {
    background:
        linear-gradient(180deg, rgba(10, 17, 24, 0.55) 0%, rgba(13, 20, 27, 0.43) 42%, rgba(12, 18, 24, 0.72) 100%),
        radial-gradient(circle at center, transparent 28%, rgba(9, 13, 18, 0.24) 100%);
}

.hero-shade::after {
    display: none;
}

.hero .brand-hero-title--personal span,
.hero .brand-hero-title--personal strong,
.inner-title h1,
.case-detail-title h1 {
    font-size: clamp(4.5rem, 7.2vw, 8rem);
    font-weight: 900;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.hero .brand-hero-title--personal span {
    padding-left: 0;
}

.hero .brand-hero-title--personal strong {
    margin-top: 0.12em;
    white-space: nowrap;
}

.hero-lead {
    font-size: clamp(0.9rem, 1vw, 1.05rem);
    line-height: 1.7;
    margin-top: 1.6rem;
}

@media (max-width: 980px) {
    .hero,
    .inner-hero,
    .case-detail-hero {
        background-position: 86% center;
    }
}

@media (max-width: 720px) {
    .hero,
    .inner-hero,
    .case-detail-hero {
        background-position: 86% center;
        padding: 3.5rem 1.25rem 6.5rem;
    }

    .hero .brand-hero-title--personal span,
    .hero .brand-hero-title--personal strong,
    .inner-title h1,
    .case-detail-title h1 {
        font-size: clamp(3rem, 13vw, 4rem);
    }

    .hero .brand-hero-title--personal strong {
        white-space: normal;
    }
}

/* Full-site primary hero normalization. */
.hero-content,
.inner-title,
.case-detail-title {
    margin-top: 0;
    max-width: 76rem;
    position: relative;
    text-align: center;
    text-shadow: 0 3px 24px rgba(0, 0, 0, 0.42);
    width: 100%;
    z-index: 2;
}

.hero-kicker,
.inner-title > p,
.case-detail-title > p:first-child {
    font-family: "Noto Sans TC", "Microsoft JhengHei", Arial, sans-serif;
    font-size: clamp(0.62rem, 0.7vw, 0.68rem);
    font-weight: 900;
    letter-spacing: 0.18em;
    line-height: 1.5;
    margin: 0;
}

.hero .brand-hero-title--personal,
.inner-title h1,
.case-detail-title h1 {
    margin: 1.25rem 0 1.6rem;
}

.hero-lead,
.inner-title > span,
.case-detail-lead {
    display: block;
    font-family: Georgia, "Noto Serif TC", "PMingLiU", serif;
    font-size: clamp(0.9rem, 1vw, 1.05rem);
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.7;
    margin: 0 auto;
    max-width: 46rem;
}

.case-detail-lead {
    margin-bottom: 0;
}

.preview-nav,
.inner-nav {
    bottom: 2.15rem;
    height: 5.2rem;
}

.hero-scroll-button {
    bottom: 10.15rem;
    font-size: 1.45rem;
    height: 4.4rem;
    left: 50%;
    margin: 0;
    position: absolute;
    transform: translateX(-50%);
    width: 4.4rem;
    z-index: 4;
}

.hero-scroll-button:hover,
.hero-scroll-button:focus-visible {
    transform: translate(-50%, 4px);
}

.case-detail-hero > .case-hero-link {
    bottom: 10.65rem;
    left: clamp(1.5rem, 9.5vw, 11rem);
    margin: 0;
    position: absolute;
    transform: none;
    z-index: 4;
}

.case-detail-hero > .case-hero-link:hover,
.case-detail-hero > .case-hero-link:focus-visible {
    transform: none;
}

@media (max-width: 720px) {
    .hero-kicker,
    .inner-title > p,
    .case-detail-title > p:first-child {
        font-size: 0.56rem;
        letter-spacing: 0.14em;
    }

    .hero-lead,
    .inner-title > span,
    .case-detail-lead {
        font-size: 0.9rem;
        line-height: 1.7;
    }

    .preview-nav,
    .inner-nav {
        bottom: 1.5rem;
        height: 4rem;
    }

    .hero-scroll-button {
        bottom: 6.8rem;
        font-size: 1.4rem;
        height: 4rem;
        width: 4rem;
    }

    .case-detail-hero > .case-hero-link {
        bottom: 11.4rem;
        left: 50%;
        transform: translateX(-50%);
    }

    .case-detail-hero > .case-hero-link:hover,
    .case-detail-hero > .case-hero-link:focus-visible {
        transform: translateX(-50%);
    }
}